diff --git a/app/javascript/gabsocial/features/groups/members/index.js b/app/javascript/gabsocial/features/groups/members/index.js
index e07410d4..a7346601 100644
--- a/app/javascript/gabsocial/features/groups/members/index.js
+++ b/app/javascript/gabsocial/features/groups/members/index.js
@@ -12,7 +12,7 @@ import { FormattedMessage } from 'react-intl';
import AccountContainer from '../../../containers/account_container';
import Column from '../../../components/column';
import ScrollableList from '../../../components/scrollable_list';
-import DropdownMenuContainer from '../../../containers/dropdown_menu_container';
+import Dropdown from '../../../components/dropdown_menu'
const mapStateToProps = (state, { params: { id } }) => ({
group: state.getIn(['groups', id]),
diff --git a/app/javascript/gabsocial/features/groups/timeline/components/header.js b/app/javascript/gabsocial/features/groups/timeline/components/header.js
index 488c10df..0022774e 100644
--- a/app/javascript/gabsocial/features/groups/timeline/components/header.js
+++ b/app/javascript/gabsocial/features/groups/timeline/components/header.js
@@ -2,7 +2,7 @@ import ImmutablePropTypes from 'react-immutable-proptypes';
import ImmutablePureComponent from 'react-immutable-pure-component';
import { defineMessages, injectIntl } from 'react-intl';
import { NavLink } from 'react-router-dom';
-import DropdownMenuContainer from '../../../../containers/dropdown_menu_container';
+import Dropdown from '../../../../components/dropdown_menu'
import Button from '../../../../components/button';
const messages = defineMessages({
@@ -24,7 +24,7 @@ class Header extends ImmutablePureComponent {
router: PropTypes.object,
};
- getActionButton() {
+getActionButton() {
const { group, relationships, toggleMembership, intl } = this.props;
const toggle = () => toggleMembership(group, relationships);
diff --git a/app/javascript/gabsocial/features/home_timeline/index.js b/app/javascript/gabsocial/features/home_timeline/index.js
index 260d1350..dc2e74da 100644
--- a/app/javascript/gabsocial/features/home_timeline/index.js
+++ b/app/javascript/gabsocial/features/home_timeline/index.js
@@ -11,7 +11,8 @@ const mapStateToProps = state => ({
isPartial: state.getIn(['timelines', 'home', 'isPartial']),
})
-export default @connect(mapStateToProps)
+export default
+@connect(mapStateToProps)
@injectIntl
class HomeTimeline extends PureComponent {
diff --git a/app/javascript/gabsocial/features/notifications/components/notification/notification.js b/app/javascript/gabsocial/features/notifications/components/notification/notification.js
index 66310aac..eaa5e4bb 100644
--- a/app/javascript/gabsocial/features/notifications/components/notification/notification.js
+++ b/app/javascript/gabsocial/features/notifications/components/notification/notification.js
@@ -4,7 +4,7 @@ import { HotKeys } from 'react-hotkeys';
import ImmutablePropTypes from 'react-immutable-proptypes';
import StatusContainer from '../../../../containers/status_container';
import AccountContainer from '../../../../containers/account_container';
-import Permalink from '../../../../components/permalink';
+import Button from '../../../../components/button'
import Icon from '../../../../components/icon';
const notificationForScreenReader = (intl, message, timestamp) => {
@@ -240,7 +240,7 @@ class Notification extends ImmutablePureComponent {
const { notification } = this.props;
const account = notification.get('account');
const displayNameHtml = { __html: account.get('display_name_html') };
- const link =
;
+ const link =
;
switch(notification.get('type')) {
// case 'follow':
diff --git a/app/javascript/gabsocial/features/status/components/detailed_status_action_bar/detailed_status_action_bar.js b/app/javascript/gabsocial/features/status/components/detailed_status_action_bar/detailed_status_action_bar.js
index 39a90cfa..cd735118 100644
--- a/app/javascript/gabsocial/features/status/components/detailed_status_action_bar/detailed_status_action_bar.js
+++ b/app/javascript/gabsocial/features/status/components/detailed_status_action_bar/detailed_status_action_bar.js
@@ -3,7 +3,7 @@ import ImmutablePureComponent from 'react-immutable-pure-component';
import { defineMessages, injectIntl } from 'react-intl';
import { openModal } from '../../../../actions/modal';
import { me, isStaff } from '../../../../initial_state';
-import DropdownMenuContainer from '../../../../containers/dropdown_menu_container';
+import Dropdown from '../../../../components/dropdown_menu';
import IconButton from '../../../../components/icon_button';
const messages = defineMessages({
diff --git a/app/javascript/gabsocial/features/ui/ui.js b/app/javascript/gabsocial/features/ui/ui.js
index 2494605b..de4874b8 100644
--- a/app/javascript/gabsocial/features/ui/ui.js
+++ b/app/javascript/gabsocial/features/ui/ui.js
@@ -1,28 +1,27 @@
-'use strict';
+'use strict'
-import classNames from 'classnames';
-import { HotKeys } from 'react-hotkeys';
-import { defineMessages, injectIntl } from 'react-intl';
-import { Switch, Redirect, withRouter } from 'react-router-dom';
-import { debounce } from 'lodash';
-import { uploadCompose, resetCompose } from '../../actions/compose';
-import { expandHomeTimeline } from '../../actions/timelines';
+import { HotKeys } from 'react-hotkeys'
+import { defineMessages, injectIntl } from 'react-intl'
+import { Switch, Redirect, withRouter } from 'react-router-dom'
+import { debounce } from 'lodash'
+import { uploadCompose, resetCompose } from '../../actions/compose'
+import { expandHomeTimeline } from '../../actions/timelines'
import {
initializeNotifications,
expandNotifications,
-} from '../../actions/notifications';
-import { fetchFilters } from '../../actions/filters';
-import { clearHeight } from '../../actions/height_cache';
-import { openModal } from '../../actions/modal';
-import WrappedRoute from './util/wrapped_route';
-// import NotificationsContainer from '../../containers/notifications_container';
-// import ModalContainer from '../../containers/modal_container';
-// import UploadArea from '../../components/upload_area';
-// import TrendsPanel from './components/trends_panel';
-// import { WhoToFollowPanel } from '../../components/panel';
-// import LinkFooter from '../../components/link_footer';
+} from '../../actions/notifications'
+import { fetchFilters } from '../../actions/filters'
+import { clearHeight } from '../../actions/height_cache'
+import { openModal } from '../../actions/modal'
+import WrappedRoute from './util/wrapped_route'
+import NotificationsContainer from '../../containers/notifications_container'
+import ModalContainer from '../../containers/modal_container'
+import UploadArea from '../../components/upload_area'
+// import TrendsPanel from './components/trends_panel'
+// import { WhoToFollowPanel } from '../../components/panel'
+// import LinkFooter from '../../components/link_footer'
import ProfilePage from '../../pages/profile_page'
-// import GroupPage from '../../pages/group_page';
+// import GroupPage from '../../pages/group_page'
import GroupsPage from '../../pages/groups_page'
import SearchPage from '../../pages/search_page'
import ErrorPage from '../../pages/error_page'
@@ -30,12 +29,13 @@ import HomePage from '../../pages/home_page'
import NotificationsPage from '../../pages/notifications_page'
import ListPage from '../../pages/list_page'
import ListsPage from '../../pages/lists_page'
-// import GroupSidebarPanel from '../groups/sidebar_panel';
+import SettingsPage from '../../pages/settings_page'
+// import GroupSidebarPanel from '../groups/sidebar_panel'
import {
Status,
// GettingStarted,
- // CommunityTimeline,
+ CommunityTimeline,
AccountTimeline,
// AccountGallery,
HomeTimeline,
@@ -63,25 +63,25 @@ import {
// GroupRemovedAccounts,
// GroupCreate,
// GroupEdit,
-} from './util/async-components';
-import { me, meUsername } from '../../initial_state';
+} from './util/async-components'
+import { me, meUsername } from '../../initial_state'
// Dummy import, to make sure that
ends up in the application bundle.
// Without this it ends up in ~8 very commonly used bundles.
-import '../../components/status';
-import { fetchGroups } from '../../actions/groups';
+import '../../components/status'
+import { fetchGroups } from '../../actions/groups'
const messages = defineMessages({
beforeUnload: { id: 'ui.beforeunload', defaultMessage: 'Your draft will be lost if you leave Gab Social.' },
publish: { id: 'compose_form.publish', defaultMessage: 'Gab' },
-});
+})
const mapStateToProps = state => ({
isComposing: state.getIn(['compose', 'is_composing']),
hasComposingText: state.getIn(['compose', 'text']).trim().length !== 0,
hasMediaAttachments: state.getIn(['compose', 'media_attachments']).size > 0,
dropdownMenuIsOpen: state.getIn(['dropdown_menu', 'openId']) !== null,
-});
+})
const keyMap = {
help: '?',
@@ -109,7 +109,7 @@ const keyMap = {
goToRequests: 'g r',
toggleHidden: 'x',
toggleSensitive: 'h',
-};
+}
class SwitchingArea extends PureComponent {
@@ -117,7 +117,7 @@ class SwitchingArea extends PureComponent {
children: PropTypes.node,
location: PropTypes.object,
onLayoutChange: PropTypes.func.isRequired,
- };
+ }
componentWillMount() {
window.addEventListener('resize', this.handleResize, {
@@ -148,7 +148,7 @@ class SwitchingArea extends PureComponent {
- {/*
*/}
+
@@ -184,10 +184,11 @@ class SwitchingArea extends PureComponent {
+ */ }
- */ }
+
{ /*
@@ -220,7 +221,7 @@ class SwitchingArea extends PureComponent {
*/}
- );
+ )
}
}
@@ -295,7 +296,7 @@ class UI extends PureComponent {
e.stopPropagation()
try {
- e.dataTransfer.dropEffect = 'copy';
+ e.dataTransfer.dropEffect = 'copy'
} catch (err) {
//
}
@@ -320,10 +321,10 @@ class UI extends PureComponent {
}
handleDragLeave = (e) => {
- e.preventDefault();
- e.stopPropagation();
+ e.preventDefault()
+ e.stopPropagation()
- this.dragTargets = this.dragTargets.filter(el => el !== e.target && this.node.contains(el));
+ this.dragTargets = this.dragTargets.filter(el => el !== e.target && this.node.contains(el))
if (this.dragTargets.length > 0) return
@@ -348,99 +349,99 @@ class UI extends PureComponent {
handleServiceWorkerPostMessage = ({ data }) => {
if (data.type === 'navigate') {
- this.context.router.history.push(data.path);
+ this.context.router.history.push(data.path)
} else {
- console.warn('Unknown message type:', data.type);
+ console.warn('Unknown message type:', data.type)
}
}
componentWillMount() {
- window.addEventListener('beforeunload', this.handleBeforeUnload, false);
+ window.addEventListener('beforeunload', this.handleBeforeUnload, false)
- document.addEventListener('dragenter', this.handleDragEnter, false);
- document.addEventListener('dragover', this.handleDragOver, false);
- document.addEventListener('drop', this.handleDrop, false);
- document.addEventListener('dragleave', this.handleDragLeave, false);
- document.addEventListener('dragend', this.handleDragEnd, false);
+ document.addEventListener('dragenter', this.handleDragEnter, false)
+ document.addEventListener('dragover', this.handleDragOver, false)
+ document.addEventListener('drop', this.handleDrop, false)
+ document.addEventListener('dragleave', this.handleDragLeave, false)
+ document.addEventListener('dragend', this.handleDragEnd, false)
if ('serviceWorker' in navigator) {
- navigator.serviceWorker.addEventListener('message', this.handleServiceWorkerPostMessage);
+ navigator.serviceWorker.addEventListener('message', this.handleServiceWorkerPostMessage)
}
if (typeof window.Notification !== 'undefined' && Notification.permission === 'default') {
- window.setTimeout(() => Notification.requestPermission(), 120 * 1000);
+ window.setTimeout(() => Notification.requestPermission(), 120 * 1000)
}
if (me) {
- this.props.dispatch(expandHomeTimeline());
- this.props.dispatch(expandNotifications());
- this.props.dispatch(initializeNotifications());
- this.props.dispatch(fetchGroups('member'));
+ this.props.dispatch(expandHomeTimeline())
+ this.props.dispatch(expandNotifications())
+ this.props.dispatch(initializeNotifications())
+ this.props.dispatch(fetchGroups('member'))
- setTimeout(() => this.props.dispatch(fetchFilters()), 500);
+ setTimeout(() => this.props.dispatch(fetchFilters()), 500)
}
}
componentDidMount() {
- if (!me) return;
+ if (!me) return
this.hotkeys.__mousetrap__.stopCallback = (e, element) => {
- return ['TEXTAREA', 'SELECT', 'INPUT'].includes(element.tagName);
- };
+ return ['TEXTAREA', 'SELECT', 'INPUT'].includes(element.tagName)
+ }
}
componentWillUnmount() {
- window.removeEventListener('beforeunload', this.handleBeforeUnload);
- document.removeEventListener('dragenter', this.handleDragEnter);
- document.removeEventListener('dragover', this.handleDragOver);
- document.removeEventListener('drop', this.handleDrop);
- document.removeEventListener('dragleave', this.handleDragLeave);
- document.removeEventListener('dragend', this.handleDragEnd);
+ window.removeEventListener('beforeunload', this.handleBeforeUnload)
+ document.removeEventListener('dragenter', this.handleDragEnter)
+ document.removeEventListener('dragover', this.handleDragOver)
+ document.removeEventListener('drop', this.handleDrop)
+ document.removeEventListener('dragleave', this.handleDragLeave)
+ document.removeEventListener('dragend', this.handleDragEnd)
}
setRef = c => {
- this.node = c;
+ this.node = c
}
handleHotkeyNew = e => {
- e.preventDefault();
+ e.preventDefault()
- const element = this.node.querySelector('.compose-form__autosuggest-wrapper textarea');
+ const element = this.node.querySelector('.compose-form__autosuggest-wrapper textarea')
if (element) {
- element.focus();
+ element.focus()
}
}
handleHotkeySearch = e => {
- e.preventDefault();
+ e.preventDefault()
- const element = this.node.querySelector('.search__input');
+ const element = this.node.querySelector('.search__input')
if (element) {
- element.focus();
+ element.focus()
}
}
handleHotkeyForceNew = e => {
- this.handleHotkeyNew(e);
- this.props.dispatch(resetCompose());
+ this.handleHotkeyNew(e)
+ this.props.dispatch(resetCompose())
}
handleHotkeyFocusColumn = e => {
- const index = (e.key * 1) + 1; // First child is drawer, skip that
- const column = this.node.querySelector(`.column:nth-child(${index})`);
- if (!column) return;
- const container = column.querySelector('.scrollable');
+ const index = (e.key * 1) + 1 // First child is drawer, skip that
+ const column = this.node.querySelector(`.column:nth-child(${index})`)
+ if (!column) return
+ const container = column.querySelector('.scrollable')
if (container) {
- const status = container.querySelector('.focusable');
+ const status = container.querySelector('.focusable')
if (status) {
if (container.scrollTop > status.offsetTop) {
- status.scrollIntoView(true);
+ status.scrollIntoView(true)
}
- status.focus();
+ status.focus()
}
}
}
@@ -454,7 +455,7 @@ class UI extends PureComponent {
}
setHotkeysRef = c => {
- this.hotkeys = c;
+ this.hotkeys = c
}
handleHotkeyToggleHelp = () => {
@@ -502,8 +503,8 @@ class UI extends PureComponent {
}
render() {
- const { draggingOver } = this.state;
- const { children, location, dropdownMenuIsOpen } = this.props;
+ const { draggingOver } = this.state
+ const { children, location, dropdownMenuIsOpen } = this.props
const handlers = me ? {
help: this.handleHotkeyToggleHelp,
@@ -521,7 +522,7 @@ class UI extends PureComponent {
goToBlocked: this.handleHotkeyGoToBlocked,
goToMuted: this.handleHotkeyGoToMuted,
goToRequests: this.handleHotkeyGoToRequests,
- } : {};
+ } : {}
return (
- { /*
- */ }
- );
+ )
}
}
diff --git a/app/javascript/gabsocial/components/layouts/default_layout.js b/app/javascript/gabsocial/layouts/default_layout.js
similarity index 94%
rename from app/javascript/gabsocial/components/layouts/default_layout.js
rename to app/javascript/gabsocial/layouts/default_layout.js
index e363823f..ff324c35 100644
--- a/app/javascript/gabsocial/components/layouts/default_layout.js
+++ b/app/javascript/gabsocial/layouts/default_layout.js
@@ -1,7 +1,7 @@
import Sticky from 'react-stickynode'
-import Search from '../search'
-import ColumnHeader from '../column_header'
-import Sidebar from '../sidebar'
+import Search from '../components/search'
+import ColumnHeader from '../components/column_header'
+import Sidebar from '../components/sidebar'
export default class DefaultLayout extends PureComponent {
static propTypes = {
diff --git a/app/javascript/gabsocial/layouts/profile_layout.js b/app/javascript/gabsocial/layouts/profile_layout.js
new file mode 100644
index 00000000..47be07f6
--- /dev/null
+++ b/app/javascript/gabsocial/layouts/profile_layout.js
@@ -0,0 +1,55 @@
+import Sticky from 'react-stickynode'
+import Sidebar from '../components/sidebar'
+import Image from '../components/image'
+
+export default class ProfileLayout extends PureComponent {
+ static propTypes = {
+ layout: PropTypes.object,
+ title: PropTypes.string,
+ showBackBtn: PropTypes.bool,
+ }
+
+ render() {
+ const { children, layout } = this.props
+
+ return (
+ 
-