This commit is contained in:
mgabdev 2020-02-24 18:25:55 -05:00
parent 7679012e2f
commit 32cd8e622a
62 changed files with 404 additions and 771 deletions

View File

@ -1,5 +1,4 @@
import { defineMessages, injectIntl } from 'react-intl';
import Column from '../column';
import IconButton from '../icon_button';
const messages = defineMessages({
@ -25,12 +24,10 @@ class BundleColumnError extends PureComponent {
const { intl: { formatMessage } } = this.props;
return (
<Column>
<div className='error-column'>
<IconButton title={formatMessage(messages.retry)} icon='refresh' onClick={this.handleRetry} size={64} />
{formatMessage(messages.body)}
</div>
</Column>
);
}

View File

@ -1,30 +0,0 @@
import { isMobile } from '../../utils/is_mobile';
export default class Column extends PureComponent {
static propTypes = {
heading: PropTypes.string,
icon: PropTypes.string,
children: PropTypes.node,
active: PropTypes.bool,
hideHeadingOnMobile: PropTypes.bool,
backBtn: PropTypes.oneOf([
'normal',
'slim',
]),
};
render () {
const { heading, icon, children, active, hideHeadingOnMobile, backBtn } = this.props;
const showHeading = heading && (!hideHeadingOnMobile || (hideHeadingOnMobile && !isMobile(window.innerWidth)));
const columnHeaderId = showHeading && heading.replace(/ /g, '-');
return (
<div role='region' aria-labelledby={columnHeaderId} className={[_s.default].join(' ')}>
{children}
</div>
);
}
}

View File

@ -1,22 +0,0 @@
.column {
display: flex;
position: relative;
box-sizing: border-box;
flex-direction: column;
// width: 350px;
flex: 1 1 100%;
overflow: hidden;
@media screen and (min-width: 631px) {
flex: 0 0 auto;
padding: 10px 5px;
&:first-child {
padding-left: 10px;
}
&:last-child {
padding-right: 10px;
}
}
}

View File

@ -1 +0,0 @@
export { default } from './column';

View File

@ -1,14 +0,0 @@
export default class ColumnSettingsHeading extends PureComponent {
static propTypes = {
heading: PropTypes.object.isRequired,
id: PropTypes.string,
};
render() {
const { heading, id } = this.props;
return (
<span id={id} className='column-settings-heading'>{heading}</span>
)
}
}

View File

@ -1,7 +0,0 @@
.column-settings-heading {
display: block;
color: $darker-text-color;
cursor: default;
font-weight: 500;
margin-bottom: 10px;
}

View File

@ -1 +0,0 @@
export { default } from './column_settings_heading';

View File

@ -1,19 +0,0 @@
.error-boundary {
&__container {
@include margin-center(auto);
}
span {
display: block;
text-align: center;
color: $secondary-text-color;
}
&__link {
display: block;
text-align: center;
color: $gab-brand-default;
@include margin-center(15px);
}
}

View File

@ -1 +0,0 @@
export { default } from './error_boundary';

View File

@ -1,6 +1,6 @@
import { is } from 'immutable';
import scheduleIdleTask from '../../utils/schedule_idle_task';
import getRectFromEntry from '../../utils/get_rect_from_entry';
import scheduleIdleTask from '../utils/schedule_idle_task';
import getRectFromEntry from '../utils/get_rect_from_entry';
// Diff these props in the "rendered" state
const updateOnPropsForRendered = ['id', 'index', 'listLength'];

View File

@ -1 +0,0 @@
export { default } from './intersection_observer_article';

View File

@ -1,4 +0,0 @@
article {
// TEMPORARY - content of columns may be significantly altered
// background: $gab-background-container;
}

View File

@ -1,11 +1,11 @@
import ImmutablePropTypes from 'react-immutable-proptypes';
import ImmutablePureComponent from 'react-immutable-pure-component';
import classNames from 'classnames';
import StatusContent from '../../status_content';
import Avatar from '../../avatar';
import RelativeTimestamp from '../../relative_timestamp';
import DisplayName from '../../display_name';
import IconButton from '../../icon_button';
import StatusContent from '../status_content';
import Avatar from '../avatar';
import RelativeTimestamp from '../relative_timestamp';
import DisplayName from '../display_name';
import IconButton from '../icon_button';
export default class ActionsModal extends ImmutablePureComponent {

View File

@ -1,12 +1,12 @@
import ImmutablePropTypes from 'react-immutable-proptypes';
import ImmutablePureComponent from 'react-immutable-pure-component';
import { defineMessages, injectIntl } from 'react-intl';
import Button from '../../button';
import StatusContent from '../../status_content';
import Avatar from '../../avatar';
import RelativeTimestamp from '../../relative_timestamp';
import DisplayName from '../../display_name';
import Icon from '../../icon';
import Button from '../button';
import StatusContent from '../status_content';
import Avatar from '../avatar';
import RelativeTimestamp from '../relative_timestamp';
import DisplayName from '../display_name';
import Icon from '../icon';
const messages = defineMessages({
cancel_reblog: { id: 'status.cancel_reblog_private', defaultMessage: 'Un-repost' },

View File

@ -1,9 +1,9 @@
import { defineMessages, injectIntl, FormattedMessage } from 'react-intl';
import ImmutablePureComponent from 'react-immutable-pure-component';
import { openModal } from '../../../actions/modal';
import { cancelReplyCompose } from '../../../actions/compose';
import ModalLayout from '../modal_layout';
import TimelineComposeBlock from '../../timeline_compose_block';
import { openModal } from '../../actions/modal';
import { cancelReplyCompose } from '../../actions/compose';
import ModalLayout from './modal_layout';
import TimelineComposeBlock from '../timeline_compose_block';
const messages = defineMessages({
confirm: { id: 'confirmations.delete.confirm', defaultMessage: 'Delete' },

View File

@ -1,7 +1,9 @@
import { injectIntl, FormattedMessage } from 'react-intl';
import Button from '../../button';
import { injectIntl, FormattedMessage } from 'react-intl'
import ModalLayout from './modal_layout'
import Button from '../button'
export default @injectIntl
export default
@injectIntl
class ConfirmationModal extends PureComponent {
static propTypes = {
@ -13,34 +15,34 @@ class ConfirmationModal extends PureComponent {
onSecondary: PropTypes.func,
intl: PropTypes.object.isRequired,
onCancel: PropTypes.func,
};
}
componentDidMount() {
this.button.focus();
this.button.focus()
}
handleClick = () => {
this.props.onClose();
this.props.onConfirm();
this.props.onClose()
this.props.onConfirm()
}
handleSecondary = () => {
this.props.onClose();
this.props.onSecondary();
this.props.onClose()
this.props.onSecondary()
}
handleCancel = () => {
const {onClose, onCancel} = this.props;
onClose();
if (onCancel) onCancel();
const {onClose, onCancel} = this.props
onClose()
if (onCancel) onCancel()
}
setRef = (c) => {
this.button = c;
this.button = c
}
render () {
const { message, confirm, secondary } = this.props;
const { message, confirm, secondary } = this.props
return (
<div className='modal-root__modal confirmation-modal'>
@ -58,7 +60,7 @@ class ConfirmationModal extends PureComponent {
<Button text={confirm} onClick={this.handleClick} ref={this.setRef} />
</div>
</div>
);
)
}
}

View File

@ -1,6 +1,6 @@
import ImmutablePureComponent from 'react-immutable-pure-component';
import { defineMessages, injectIntl } from 'react-intl';
import api from '../../../api'
import api from '../../api'
const messages = defineMessages({
embed: { id: 'status.embed', defaultMessage: 'Embed' },

View File

@ -1,9 +1,9 @@
import ImmutablePropTypes from 'react-immutable-proptypes';
import ImmutablePureComponent from 'react-immutable-pure-component';
import classNames from 'classnames';
import { changeUploadCompose } from '../../../actions/compose';
import { getPointerPosition } from '../../../utils/element_position';
import ImageLoader from '../../image_loader';
import { changeUploadCompose } from '../../actions/compose';
import { getPointerPosition } from '../../utils/element_position';
import ImageLoader from '../image_loader';
const mapStateToProps = (state, { id }) => ({
media: state.getIn(['compose', 'media_attachments']).find(item => item.get('id') === id),

View File

@ -1,27 +0,0 @@
import ActionsModal from './actions_modal/actions_modal';
import BoostModal from './boost_modal/boost_modal';
import ComposeModal from './compose_modal/compose_modal';
import ConfirmationModal from './confirmation_modal/confirmation_modal';
import EmbedModal from './embed_modal/embed_modal';
import FocalPointModal from './focal_point_modal/focal_point_modal';
import HotkeysModal from './hotkeys_modal';
import MediaModal from './media_modal/media_modal';
import MuteModal from './mute_modal/mute_modal';
import ReportModal from './report_modal/report_modal';
import UnauthorizedModal from './unauthorized_modal';
import VideoModal from './video_modal/video_modal';
export {
ActionsModal,
BoostModal,
ComposeModal,
ConfirmationModal,
EmbedModal,
FocalPointModal,
HotkeysModal,
MediaModal,
MuteModal,
ReportModal,
UnauthorizedModal,
VideoModal,
};

View File

@ -3,11 +3,11 @@ import { defineMessages, injectIntl, FormattedMessage } from 'react-intl';
import ReactSwipeableViews from 'react-swipeable-views';
import ImmutablePropTypes from 'react-immutable-proptypes';
import ImmutablePureComponent from 'react-immutable-pure-component';
import Video from '../../../features/video';
import ExtendedVideoPlayer from '../../extended_video_player';
import IconButton from '../../icon_button';
import ImageLoader from '../../image_loader';
import Icon from '../../icon';
import Video from '../../features/video';
import ExtendedVideoPlayer from '../extended_video_player';
import IconButton from '../icon_button';
import ImageLoader from '../image_loader';
import Icon from '../icon';
const messages = defineMessages({
close: { id: 'lightbox.close', defaultMessage: 'Close' },

View File

@ -1,18 +1,17 @@
import ModalBase from './modal_base'
import Bundle from '../../features/ui/util/bundle'
import BundleModalError from '../bundle_modal_error'
import {
ActionsModal,
MediaModal,
VideoModal,
BoostModal,
ConfirmationModal,
FocalPointModal,
HotkeysModal,
ComposeModal,
UnauthorizedModal,
ProUpgradeModal,
} from '.'
import ActionsModal from './actions_modal'
import MediaModal from './media_modal'
// import VideoModal from './video_modal'
import BoostModal from './boost_modal'
import ConfirmationModal from './confirmation_modal'
import FocalPointModal from './focal_point_modal'
import HotkeysModal from './hotkeys_modal'
import ComposeModal from './compose_modal'
import UnauthorizedModal from './unauthorized_modal'
import ProUpgradeModal from './pro_upgrade_modal'
import ModalLoading from './modal_loading'
import {
MuteModal,
ReportModal,
@ -21,11 +20,10 @@ import {
ListAdder,
StatusRevisionModal,
} from '../../features/ui/util/async-components'
import ModalLoading from '../modal_loading'
const MODAL_COMPONENTS = {
'MEDIA': () => Promise.resolve({ default: MediaModal }),
'VIDEO': () => Promise.resolve({ default: VideoModal }),
// 'VIDEO': () => Promise.resolve({ default: VideoModal }),
'BOOST': () => Promise.resolve({ default: BoostModal }),
'CONFIRM': () => Promise.resolve({ default: ConfirmationModal }),
'MUTE': MuteModal,

View File

@ -1,9 +1,9 @@
import { injectIntl, defineMessages } from 'react-intl';
import { closeModal } from '../../../actions/modal';
import { muteAccount } from '../../../actions/accounts';
import { toggleHideNotifications } from '../../../actions/mutes';
import ToggleSwitch from '../../toggle_switch';
import Button from '../../button';
import { closeModal } from '../../actions/modal';
import { muteAccount } from '../../actions/accounts';
import { toggleHideNotifications } from '../../actions/mutes';
import ToggleSwitch from '../toggle_switch';
import Button from '../button';
const messages = defineMessages({
muteMessage: { id: 'confirmations.mute.message', defaultMessage: 'Are you sure you want to mute {name}?' },

View File

@ -1,63 +1,63 @@
import { defineMessages, injectIntl, FormattedMessage } from 'react-intl';
import ImmutablePureComponent from 'react-immutable-pure-component';
import { me } from '../initial_state';
import IconButton from './icon_button';
import Icon from './icon';
import { defineMessages, injectIntl } from 'react-intl'
import ImmutablePureComponent from 'react-immutable-pure-component'
import Button from '../button'
import Text from '../text'
import ModalLayout from './modal_layout'
const messages = defineMessages({
close: { id: 'lightbox.close', defaultMessage: 'Close' },
});
const mapStateToProps = state => {
return {
account: state.getIn(['accounts', me]),
};
};
title: { id: 'promo.gab_pro', defaultMessage: 'Upgrade to GabPRO' },
text: { id: 'pro_upgrade_modal.text', defaultMessage: 'Gab is fully funded by people like you. Please consider supporting us on our mission to defend free expression online for all people.' },
benefits: { id: 'pro_upgrade_modal.benefits', defaultMessage: 'Here are just some of the benefits that thousands of GabPRO members receive:' },
})
export default
@injectIntl
class ProUpgradeModal extends ImmutablePureComponent {
static propTypes = {
intl: PropTypes.object.isRequired,
onClose: PropTypes.func.isRequired,
};
onClickClose = () => {
this.props.onClose('PRO_UPGRADE');
};
}
render() {
const { intl } = this.props;
const { intl } = this.props
return (
<div className='modal-root__modal compose-modal pro-upgrade-modal'>
<div className='compose-modal__header'>
<h3 className='compose-modal__header__title'><FormattedMessage id='promo.gab_pro' defaultMessage='Upgrade to GabPRO' /></h3>
<IconButton className='compose-modal__close' title={intl.formatMessage(messages.close)} icon='times' onClick={this.onClickClose} size={20} />
</div>
<div className='compose-modal__content pro-upgrade-modal__content'>
<ModalLayout title={intl.formatMessage(messages.title)}>
<div>
<span className="pro-upgrade-modal__text">
<FormattedMessage id='pro_upgrade_modal.text' defaultMessage='Gab is fully funded by people like you. Please consider supporting us on our mission to defend free expression online for all people.' />
<FormattedMessage id='pro_upgrade_modal.benefits' defaultMessage='Here are just some of the benefits that thousands of GabPRO members receive:' />
</span>
<ul className="pro-upgrade-modal__list">
<li>Schedule Posts</li>
<li>Get Verified</li>
<li>Create Groups</li>
<li>Larger Video and Image Uploads</li>
<li>Receive the PRO Badge</li>
<li>Remove in-feed promotions</li>
<li>More value being added daily!</li>
</ul>
<a href='https://pro.gab.com' className='pro-upgrade-modal__button button'>
<Icon id='arrow-up' fixedWidth/>
<FormattedMessage id='promo.gab_pro' defaultMessage='Upgrade to GabPRO' />
</a>
<Text>
{intl.formatMessage(messages.text)}
</Text>
<Text>
{intl.formatMessage(messages.benefits)}
</Text>
</div>
</div>
</div>
);
}
}
export default injectIntl(connect(mapStateToProps)(ProUpgradeModal));
<ul>
<li>
<Text>Schedule Posts</Text>
</li>
<li>
<Text>Get Verified</Text>
</li>
<li>
<Text>Create Groups</Text>
</li>
<li>
<Text>Larger Video and Image Uploads</Text>
</li>
<li>
<Text>Receive the PRO Badge</Text>
</li>
<li>
<Text>Remove in-feed promotions</Text>
</li>
</ul>
<Button icon='pro' href='https://pro.gab.com'>
{intl.formatMessage(messages.title)}
</Button>
</ModalLayout>
)
}
}

View File

@ -2,13 +2,13 @@ import ImmutablePropTypes from 'react-immutable-proptypes';
import { defineMessages, injectIntl } from 'react-intl';
import { OrderedSet } from 'immutable';
import ImmutablePureComponent from 'react-immutable-pure-component';
import { changeReportComment, changeReportForward, submitReport } from '../../../actions/reports';
import { expandAccountTimeline } from '../../../actions/timelines';
import { makeGetAccount } from '../../../selectors';
import StatusCheckBox from '../../status_check_box';
import ToggleSwitch from '../../toggle_switch';
import Button from '../../button';
import IconButton from '../../icon_button';
import { changeReportComment, changeReportForward, submitReport } from '../../actions/reports';
import { expandAccountTimeline } from '../../actions/timelines';
import { makeGetAccount } from '../../selectors';
import StatusCheckBox from '../status_check_box';
import ToggleSwitch from '../toggle_switch';
import Button from '../button';
import IconButton from '../icon_button';
const messages = defineMessages({
close: { id: 'lightbox.close', defaultMessage: 'Close' },

View File

@ -2,8 +2,8 @@
import { defineMessages, injectIntl, FormattedMessage } from 'react-intl';
import ImmutablePropTypes from 'react-immutable-proptypes';
import ImmutablePureComponent from 'react-immutable-pure-component';
import StatusRevisionListContainer from '../../../containers/status_revision_list_container';
import IconButton from '../../../components/icon_button';
import StatusRevisionListContainer from '../../containers/status_revision_list_container';
import IconButton from '../icon_button';
const messages = defineMessages({
close: { id: 'lightbox.close', defaultMessage: 'Close' },

View File

@ -1,7 +1,7 @@
import ImmutablePropTypes from 'react-immutable-proptypes';
import ImmutablePureComponent from 'react-immutable-pure-component';
import { FormattedMessage } from 'react-intl';
import Video from '../../../features/video';
import Video from '../../features/video';
export const previewState = 'previewVideoModal';

View File

@ -1 +0,0 @@
export { default } from './modal_loading';

View File

@ -1,9 +1,9 @@
import { throttle } from 'lodash';
import { List as ImmutableList } from 'immutable';
import IntersectionObserverArticleContainer from '../../containers/intersection_observer_article_container';
import IntersectionObserverWrapper from '../../features/ui/util/intersection_observer_wrapper';
import ColumnIndicator from '../column_indicator';
import LoadMore from '../load_more';
import IntersectionObserverArticleContainer from '../containers/intersection_observer_article_container';
import IntersectionObserverWrapper from '../features/ui/util/intersection_observer_wrapper';
import ColumnIndicator from './column_indicator';
import LoadMore from './load_more';
const MOUSE_IDLE_DELAY = 300;

View File

@ -1 +0,0 @@
export { default } from './scrollable_list';

View File

@ -1,6 +0,0 @@
.scrollable-list {
&--flex {
display: flex;
flex-direction: column;
}
}

View File

@ -1 +0,0 @@
export { default } from './section_headline_bar';

View File

@ -1,62 +0,0 @@
import { NavLink } from 'react-router-dom';
import classNames from 'classnames';
import Icon from '../icon';
class SectionHeadlineBarItem extends PureComponent {
static propTypes = {
to: PropTypes.string,
icon: PropTypes.string,
className: PropTypes.string,
onClick: PropTypes.func,
title: PropTypes.oneOfType([
PropTypes.string,
PropTypes.node,
]),
exact: PropTypes.bool,
};
render() {
const { to, title, icon, className, onClick, exact } = this.props;
const classes = classNames('section-header-bar__item', className);
if (to) {
return (
<NavLink className={classes} exact={exact} to={to}>{title}</NavLink>
)
} else if (icon) {
return (
<button className={classes} onClick={onClick} title={title}>
<Icon id={icon} fixedWidth />
</button>
)
}
return (
<button className={classes} onClick={onClick}>{title}</button>
)
}
};
export default class SectionHeadlineBar extends PureComponent {
static propTypes = {
items: PropTypes.array.isRequired,
className: PropTypes.string,
};
render() {
const { items, className } = this.props;
const classes = classNames('section-headline-bar', className);
return (
<div className={classes}>
{
items.forEach((item, i) => (
<SectionHeadlineBarItem key={`shbi-${i}`} {...item} />
))
}
</div>
)
}
}

View File

@ -1,58 +0,0 @@
.section-headline-bar {
background: darken($ui-base-color, 4%);
border-bottom: 1px solid lighten($ui-base-color, 8%);
cursor: default;
display: flex;
flex-shrink: 0;
button {
background: darken($ui-base-color, 4%);
border: 0;
margin: 0;
}
button,
a {
display: block;
flex: 1 1 auto;
color: $secondary-text-color;
padding: 15px 0;
text-decoration: none;
position: relative;
@include text-sizing(14px, 500, 1, center);
&.active {
color: $primary-text-color;
&::before,
&::after {
bottom: 0;
left: 50%;
transform: translateX(-50%);
border-style: solid;
border-width: 0 10px 10px;
border-color: transparent transparent lighten($ui-base-color, 8%);
@include pseudo;
@include size(0);
}
&::after {
bottom: -1px;
border-color: transparent transparent $ui-base-color;
}
}
}
}
.account-section-headline {
button,
a {
flex: none;
padding: 18px 15px;
@include text-sizing(16px, 600);
}
}

View File

@ -1,6 +1,6 @@
import { FormattedMessage } from 'react-intl';
import classNames from 'classnames';
import { shortNumberFormat } from '../../utils/numbers';
import { shortNumberFormat } from '../utils/numbers';
export default class TimelineQueueButtonHeader extends PureComponent {

View File

@ -1 +0,0 @@
export { default } from './timeline_queue_button_header';

View File

@ -1,29 +0,0 @@
.timeline-queue-header {
display: block;
width: 100%;
max-height: 0px;
position: relative;
background-color: darken($ui-base-color, 8%);
border-bottom: 1px solid;
border-top: 1px solid;
border-color: darken($ui-base-color, 4%);
transition: max-height 2.5s ease;
overflow: hidden;
&--extended {
max-height: 46px;
}
&__btn {
display: block;
cursor: pointer;
color: $secondary-text-color;
@include size(100%);
@include text-sizing(14px, 400, 46px, center);
span {
height: 46px;
}
}
}

View File

@ -8,7 +8,7 @@ import Card from '../features/status/components/card';
import Poll from '../components/poll';
import MediaGallery from '../components/media_gallery';
import ModalRoot from '../components/modal/modal_root';
import { MediaModal } from '../components/modal';
import MediaModal from '../components/modal/media_modal';
const { localeData, messages } = getLocale();
addLocaleData(localeData);

View File

@ -1,5 +1,5 @@
import ImmutablePureComponent from 'react-immutable-pure-component';
import { load } from '../../../actions/status_revision_list';
import { load } from '../actions/status_revision_list';
import StatusRevisionList from '../components/status_revision_list';
class StatusRevisionListContainer extends ImmutablePureComponent {

View File

@ -10,10 +10,8 @@ import { expandAccountMediaTimeline } from '../../actions/timelines';
import { me } from '../../initial_state';
import { getAccountGallery } from '../../selectors';
import ColumnIndicator from '../../components/column_indicator';
import Column from '../../components/column';
import MediaItem from './components/media_item';
import LoadMore from '../../components/load_more';
import SectionHeadlineBar from '../../components/section_headline_bar';
const messages = defineMessages({
posts: { id: 'account.posts', defaultMessage: 'Gabs' },
@ -173,9 +171,8 @@ class AccountGallery extends ImmutablePureComponent {
}
return (
<Column>
<div className='scrollable-list scrollable-list--flex' onScroll={this.handleScroll}>
<SectionHeadlineBar
{ /* <SectionHeadlineBar
className='account-section-headline'
items={[
{
@ -194,7 +191,7 @@ class AccountGallery extends ImmutablePureComponent {
title: intl.formatMessage(messages.media),
},
]}
/>
/> */ }
<div role='feed' className='account-gallery__container' ref={this.handleRef}>
{attachments.map((attachment, index) => attachment === null ? (
@ -219,7 +216,6 @@ class AccountGallery extends ImmutablePureComponent {
</div>
)}
</div>
</Column>
);
}

View File

@ -8,8 +8,6 @@ import { fetchAccountIdentityProofs } from '../../actions/identity_proofs';
import { me } from '../../initial_state';
import StatusList from '../../components/status_list/status_list';
import ColumnIndicator from '../../components/column_indicator';
import Column from '../../components/column';
import SectionHeadlineBar from '../../components/section_headline_bar' ;
const messages = defineMessages({
posts: { id: 'account.posts', defaultMessage: 'Gabs' },
@ -117,9 +115,7 @@ class AccountTimeline extends ImmutablePureComponent {
return (<ColumnIndicator type='error' message={intl.formatMessage(messages.error)} />);
}
return (
<Column>
<SectionHeadlineBar
/* <SectionHeadlineBar
className='account-section-headline'
items={[
{
@ -139,6 +135,9 @@ class AccountTimeline extends ImmutablePureComponent {
},
]}
/>
*/
return (
<StatusList
scrollKey='account_timeline'
statusIds={statusIds}
@ -148,7 +147,6 @@ class AccountTimeline extends ImmutablePureComponent {
onLoadMore={this.handleLoadMore}
emptyMessage={<FormattedMessage id='empty_column.account_timeline' defaultMessage='No gabs here!' />}
/>
</Column>
);
}

View File

@ -3,7 +3,6 @@ import ImmutablePureComponent from 'react-immutable-pure-component';
import ImmutablePropTypes from 'react-immutable-proptypes';
import { debounce } from 'lodash';
import ColumnIndicator from '../../components/column_indicator';
import Column from '../../components/column';
import AccountContainer from '../../containers/account_container';
import { fetchBlocks, expandBlocks } from '../../actions/blocks';
import ScrollableList from '../../components/scrollable_list';
@ -45,7 +44,6 @@ class Blocks extends ImmutablePureComponent {
}
return (
<Column icon='ban' heading={intl.formatMessage(messages.heading)} backBtn='slim'>
<ScrollableList
scrollKey='blocks'
onLoadMore={this.handleLoadMore}
@ -56,7 +54,6 @@ class Blocks extends ImmutablePureComponent {
<AccountContainer key={id} id={id} />
)}
</ScrollableList>
</Column>
);
}

View File

@ -5,7 +5,6 @@ import { debounce } from 'lodash';
import { fetchDomainBlocks, expandDomainBlocks } from '../../actions/domain_blocks';
import DomainContainer from '../../containers/domain_container';
import ColumnIndicator from '../../components/column_indicator';
import Column from '../../components/column';
import ScrollableList from '../../components/scrollable_list';
const messages = defineMessages({
@ -46,7 +45,6 @@ class Blocks extends ImmutablePureComponent {
}
return (
<Column icon='minus-circle' heading={intl.formatMessage(messages.heading)} backBtn='slim'>
<ScrollableList
scrollKey='domain_blocks'
onLoadMore={this.handleLoadMore}
@ -57,7 +55,6 @@ class Blocks extends ImmutablePureComponent {
<DomainContainer key={domain} domain={domain} />
)}
</ScrollableList>
</Column>
);
}

View File

@ -4,7 +4,6 @@ import ImmutablePureComponent from 'react-immutable-pure-component';
import { debounce } from 'lodash';
import { fetchFavouritedStatuses, expandFavouritedStatuses } from '../../actions/favourites';
import { meUsername } from '../../initial_state';
import Column from '../../components/column';
import StatusList from '../../components/status_list';
import ColumnIndicator from '../../components/column_indicator';
@ -44,7 +43,6 @@ class Favourites extends ImmutablePureComponent {
}
return (
<Column>
<StatusList
statusIds={statusIds}
scrollKey='favourited_statuses'
@ -53,7 +51,6 @@ class Favourites extends ImmutablePureComponent {
onLoadMore={this.handleLoadMore}
emptyMessage={<FormattedMessage id='empty_column.favourited_statuses' defaultMessage="You don't have any favourite gabs yet. When you favourite one, it will show up here." />}
/>
</Column>
);
}

View File

@ -4,7 +4,6 @@ import ImmutablePropTypes from 'react-immutable-proptypes';
import { debounce } from 'lodash';
import { fetchFollowRequests, expandFollowRequests } from '../../actions/accounts';
import ColumnIndicator from '../../components/column_indicator';
import Column from '../../components/column';
import AccountAuthorize from './components/account_authorize';
import ScrollableList from '../../components/scrollable_list';
@ -45,7 +44,6 @@ class FollowRequests extends ImmutablePureComponent {
}
return (
<Column icon='user-plus' heading={intl.formatMessage(messages.heading)} backBtn='slim'>
<ScrollableList
scrollKey='follow_requests'
onLoadMore={this.handleLoadMore}
@ -56,7 +54,6 @@ class FollowRequests extends ImmutablePureComponent {
<AccountAuthorize key={id} id={id} />
)}
</ScrollableList>
</Column>
);
}

View File

@ -11,7 +11,6 @@ import {
} from '../../actions/accounts';
import { me } from '../../initial_state';
import AccountContainer from '../../containers/account_container';
import Column from '../../components/column';
import ScrollableList from '../../components/scrollable_list';
const mapStateToProps = (state, { params: { username } }) => {
@ -88,7 +87,6 @@ class Followers extends ImmutablePureComponent {
}
return (
<Column>
<ScrollableList
scrollKey='followers'
hasMore={hasMore}
@ -99,7 +97,6 @@ class Followers extends ImmutablePureComponent {
<AccountContainer key={id} id={id} withNote={false} />
)}
</ScrollableList>
</Column>
);
}

View File

@ -11,7 +11,6 @@ import {
import { me } from '../../initial_state';
import AccountContainer from '../../containers/account_container';
import ColumnIndicator from '../../components/column_indicator';
import Column from '../../components/column';
import ScrollableList from '../../components/scrollable_list';
const mapStateToProps = (state, { params: { username } }) => {
@ -90,7 +89,6 @@ class Following extends ImmutablePureComponent {
}
return (
<Column>
<ScrollableList
scrollKey='following'
hasMore={hasMore}
@ -101,7 +99,6 @@ class Following extends ImmutablePureComponent {
<AccountContainer key={id} id={id} withNote={false} />
)}
</ScrollableList>
</Column>
);
}

View File

@ -1,7 +1,6 @@
import ImmutablePureComponent from 'react-immutable-pure-component';
import ImmutablePropTypes from 'react-immutable-proptypes';
import { debounce } from 'lodash';
import ColumnIndicator from '../../../components/column_indicator';
import {
fetchMembers,
expandMembers,
@ -10,7 +9,6 @@ import {
} from '../../../actions/groups';
import { FormattedMessage } from 'react-intl';
import AccountContainer from '../../../containers/account_container';
import Column from '../../../components/column';
import ScrollableList from '../../../components/scrollable_list';
import Dropdown from '../../../components/dropdown_menu'
@ -51,15 +49,10 @@ class GroupMembers extends ImmutablePureComponent {
const { accountIds, hasMore, group, relationships, dispatch } = this.props;
if (!group || !accountIds || !relationships) {
return (
<Column>
<LoadingIndicator />
</Column>
);
return <LoadingIndicator />
}
return (
<Column>
<ScrollableList
scrollKey='members'
hasMore={hasMore}
@ -84,7 +77,6 @@ class GroupMembers extends ImmutablePureComponent {
);
})}
</ScrollableList>
</Column>
);
}

View File

@ -9,7 +9,6 @@ import {
} from '../../../actions/groups';
import { FormattedMessage } from 'react-intl';
import AccountContainer from '../../../containers/account_container';
import Column from '../../../components/column';
import ScrollableList from '../../../components/scrollable_list';
import { defineMessages, injectIntl } from 'react-intl';
@ -54,11 +53,10 @@ class GroupRemovedAccounts extends ImmutablePureComponent {
const { accountIds, hasMore, group, intl } = this.props;
if (!group || !accountIds) {
return (<ColumnIndicator type='loading' />);
return <ColumnIndicator type='loading' />
}
return (
<Column>
<ScrollableList
scrollKey='removed_accounts'
hasMore={hasMore}
@ -73,8 +71,7 @@ class GroupRemovedAccounts extends ImmutablePureComponent {
actionTitle={intl.formatMessage(messages.remove)}
/>))}
</ScrollableList>
</Column>
);
)
}
}

View File

@ -3,7 +3,6 @@ import { isEqual } from 'lodash';
import { expandHashtagTimeline, clearTimeline } from '../../actions/timelines';
import { connectHashtagStream } from '../../actions/streaming';
import StatusListContainer from '../../containers/status_list_container';
import Column from '../../components/column';
const mapStateToProps = (state, props) => ({
hasUnread: state.getIn(['timelines', `hashtag:${props.params.id}`, 'unread']) > 0,
@ -102,14 +101,12 @@ class HashtagTimeline extends PureComponent {
const { id } = this.props.params;
return (
<Column heading={`#${id}`}>
<StatusListContainer
scrollKey='hashtag_timeline'
timelineId={`hashtag:${id}`}
onLoadMore={this.handleLoadMore}
emptyMessage={<FormattedMessage id='empty_column.hashtag' defaultMessage='There is nothing in this hashtag yet.' />}
/>
</Column>
);
}

View File

@ -3,7 +3,6 @@ import ImmutablePureComponent from 'react-immutable-pure-component';
import { FormattedMessage } from 'react-intl';
import { changeSetting, saveSettings } from '../../../../actions/settings';
import SettingToggle from '../../../../components/setting_toggle';
import ColumnSettingsHeading from '../../../../components/column_settings_heading';
const mapStateToProps = state => ({
settings: state.getIn(['settings', 'home']),
@ -31,9 +30,7 @@ class ColumnSettings extends ImmutablePureComponent {
return (
<div>
<ColumnSettingsHeading
heading={<FormattedMessage id='home.column_settings.basic' defaultMessage='Basic' />}
/>
<FormattedMessage id='home.column_settings.basic' defaultMessage='Basic' />
<SettingToggle
prefix='home_timeline'

View File

@ -5,7 +5,6 @@ import { debounce } from 'lodash';
import { fetchMutes, expandMutes } from '../../actions/mutes';
import AccountContainer from '../../containers/account_container';
import ColumnIndicator from '../../components/column_indicator';
import Column from '../../components/column';
import ScrollableList from '../../components/scrollable_list';
const messages = defineMessages({
@ -41,11 +40,10 @@ class Mutes extends ImmutablePureComponent {
const { intl, hasMore, accountIds } = this.props;
if (!accountIds) {
return (<ColumnIndicator type='loading' />);
return <ColumnIndicator type='loading' />
}
return (
<Column icon='volume-off' heading={intl.formatMessage(messages.heading)} backBtn='slim'>
<ScrollableList
scrollKey='mutes'
onLoadMore={this.handleLoadMore}
@ -56,8 +54,7 @@ class Mutes extends ImmutablePureComponent {
<AccountContainer key={id} id={id} />
)}
</ScrollableList>
</Column>
);
)
}
}

View File

@ -3,7 +3,6 @@ import ImmutablePureComponent from 'react-immutable-pure-component';
import { FormattedMessage } from 'react-intl';
import ColumnHeaderSettingButton from '../../../../components/column_header_setting_button';
import SettingToggle from '../../../../components/setting_toggle';
import ColumnSettingsHeading from '../../../../components/column_settings_heading';
export default class ColumnSettings extends ImmutablePureComponent {
@ -39,20 +38,13 @@ export default class ColumnSettings extends ImmutablePureComponent {
/>
<div role='group' aria-labelledby='notifications-filter-bar'>
<ColumnSettingsHeading
id='notifications-filter-bar'
heading={<FormattedMessage id='notifications.column_settings.filter_bar.category' defaultMessage='Quick filter bar' />}
/>
<FormattedMessage id='notifications.column_settings.filter_bar.category' defaultMessage='Quick filter bar' />
<SettingToggle id='show-filter-bar' prefix='notifications' settings={settings} settingPath={['quickFilter', 'show']} onChange={onChange} label={filterShowStr} />
<SettingToggle id='show-filter-bar' prefix='notifications' settings={settings} settingPath={['quickFilter', 'advanced']} onChange={onChange} label={filterAdvancedStr} />
</div>
<div role='group' aria-labelledby='notifications-follow'>
<ColumnSettingsHeading
id='notifications-follow'
heading={<FormattedMessage id='notifications.column_settings.follow' defaultMessage='New followers:' />}
/>
<FormattedMessage id='notifications.column_settings.follow' defaultMessage='New followers:' />
<SettingToggle prefix='notifications_desktop' settings={settings} settingPath={['alerts', 'follow']} onChange={onChange} label={alertStr} />
{showPushSettings && <SettingToggle prefix='notifications_push' settings={pushSettings} settingPath={['alerts', 'follow']} onChange={this.onPushChange} label={pushStr} />}
<SettingToggle prefix='notifications' settings={settings} settingPath={['shows', 'follow']} onChange={onChange} label={showStr} />
@ -60,11 +52,7 @@ export default class ColumnSettings extends ImmutablePureComponent {
</div>
<div role='group' aria-labelledby='notifications-favourite'>
<ColumnSettingsHeading
id='notifications-favourite'
heading={<FormattedMessage id='notifications.column_settings.favourite' defaultMessage='Favorites:' />}
/>
<FormattedMessage id='notifications.column_settings.favourite' defaultMessage='Favorites:' />
<SettingToggle prefix='notifications_desktop' settings={settings} settingPath={['alerts', 'favourite']} onChange={onChange} label={alertStr} />
{showPushSettings && <SettingToggle prefix='notifications_push' settings={pushSettings} settingPath={['alerts', 'favourite']} onChange={this.onPushChange} label={pushStr} />}
<SettingToggle prefix='notifications' settings={settings} settingPath={['shows', 'favourite']} onChange={onChange} label={showStr} />
@ -72,11 +60,7 @@ export default class ColumnSettings extends ImmutablePureComponent {
</div>
<div role='group' aria-labelledby='notifications-mention'>
<ColumnSettingsHeading
id='notifications-mention'
heading={<FormattedMessage id='notifications.column_settings.mention' defaultMessage='Mentions:' />}
/>
<FormattedMessage id='notifications.column_settings.mention' defaultMessage='Mentions:' />
<SettingToggle prefix='notifications_desktop' settings={settings} settingPath={['alerts', 'mention']} onChange={onChange} label={alertStr} />
{showPushSettings && <SettingToggle prefix='notifications_push' settings={pushSettings} settingPath={['alerts', 'mention']} onChange={this.onPushChange} label={pushStr} />}
<SettingToggle prefix='notifications' settings={settings} settingPath={['shows', 'mention']} onChange={onChange} label={showStr} />
@ -84,11 +68,7 @@ export default class ColumnSettings extends ImmutablePureComponent {
</div>
<div role='group' aria-labelledby='notifications-reblog'>
<ColumnSettingsHeading
id='notifications-reblog'
heading={<FormattedMessage id='notifications.column_settings.reblog' defaultMessage='Reposts:' />}
/>
<FormattedMessage id='notifications.column_settings.reblog' defaultMessage='Reposts:' />
<SettingToggle prefix='notifications_desktop' settings={settings} settingPath={['alerts', 'reblog']} onChange={onChange} label={alertStr} />
{showPushSettings && <SettingToggle prefix='notifications_push' settings={pushSettings} settingPath={['alerts', 'reblog']} onChange={this.onPushChange} label={pushStr} />}
<SettingToggle prefix='notifications' settings={settings} settingPath={['shows', 'reblog']} onChange={onChange} label={showStr} />
@ -96,11 +76,7 @@ export default class ColumnSettings extends ImmutablePureComponent {
</div>
<div role='group' aria-labelledby='notifications-poll'>
<ColumnSettingsHeading
id='notifications-poll'
heading={<FormattedMessage id='notifications.column_settings.poll' defaultMessage='Poll results:' />}
/>
<FormattedMessage id='notifications.column_settings.poll' defaultMessage='Poll results:' />
<SettingToggle prefix='notifications_desktop' settings={settings} settingPath={['alerts', 'poll']} onChange={onChange} label={alertStr} />
{showPushSettings && <SettingToggle prefix='notifications_push' settings={pushSettings} settingPath={['alerts', 'poll']} onChange={this.onPushChange} label={pushStr} />}
<SettingToggle prefix='notifications' settings={settings} settingPath={['shows', 'poll']} onChange={onChange} label={showStr} />

View File

@ -1,5 +1,4 @@
import { defineMessages, injectIntl } from 'react-intl';
import SectionHeadlineBar from '../../../../components/section_headline_bar';
const messages = defineMessages({
mentions: { id: 'notifications.filter.mentions', defaultMessage: 'Mentions' },
@ -30,7 +29,7 @@ class NotificationFilterBar extends PureComponent {
if (!advancedMode) {
return (
<SectionHeadlineBar
{ /* <SectionHeadlineBar
items={[
{
className: selectedFilter === 'all' ? 'active' : '',
@ -43,12 +42,15 @@ class NotificationFilterBar extends PureComponent {
title: intl.formatMessage(messages.filterMentions),
}
]}
/>
/> */ }
)
}
return (
<SectionHeadlineBar
<div />
)
/* <SectionHeadlineBar
items={[
{
className: selectedFilter === 'all' ? 'active' : '',
@ -86,8 +88,7 @@ class NotificationFilterBar extends PureComponent {
icon: 'user-plus',
},
]}
/>
)
/> */
}
}

View File

@ -15,7 +15,6 @@ import NotificationContainer from './containers/notification_container';
import ScrollableList from '../../components/scrollable_list';
import LoadMore from '../../components/load_more';
// import TimelineQueueButtonHeader from '../../components/timeline_queue_button_header';
import Column from '../../components/column';
const messages = defineMessages({
title: { id: 'column.notifications', defaultMessage: 'Notifications' },
@ -177,11 +176,11 @@ class Notifications extends ImmutablePureComponent {
);
return (
<Column ref={this.setColumnRef} heading={intl.formatMessage(messages.title)}>
<div ref={this.setColumnRef}>
{ /* filterBarContainer */ }
{ /* <TimelineQueueButtonHeader onClick={this.handleDequeueNotifications} count={totalQueuedNotificationsCount} itemType='notification' /> */ }
{ scrollContainer }
</Column>
</div>
);
}

View File

@ -3,7 +3,6 @@ import ImmutablePureComponent from 'react-immutable-pure-component';
import { FormattedMessage } from 'react-intl';
import { fetchPinnedStatuses } from '../../actions/pin_statuses';
import { meUsername } from '../../initial_state';
import Column from '../../components/column';
import StatusList from '../../components/status_list/status_list';
import ColumnIndicator from '../../components/column_indicator';
@ -33,18 +32,16 @@ class PinnedStatuses extends ImmutablePureComponent {
const { statusIds, hasMore, isMyAccount } = this.props;
if (!isMyAccount) {
return (<ColumnIndicator type='missing' />);
return <ColumnIndicator type='missing' />
}
return (
<Column>
<StatusList
statusIds={statusIds}
scrollKey='pinned_statuses'
hasMore={hasMore}
emptyMessage={<FormattedMessage id='pinned_statuses.none' defaultMessage='No pins to show.' />}
/>
</Column>
);
}

View File

@ -6,7 +6,6 @@ import { fetchStatus } from '../../actions/statuses';
import { makeGetStatus } from '../../selectors';
import AccountContainer from '../../containers/account_container';
import ColumnIndicator from '../../components/column_indicator';
import Column from '../../components/column';
import ScrollableList from '../../components/scrollable_list';
const mapStateToProps = (state, props) => {
@ -54,7 +53,6 @@ class Reblogs extends ImmutablePureComponent {
}
return (
<Column>
<ScrollableList
scrollKey='reblogs'
emptyMessage={<FormattedMessage id='status.reblogs.empty' defaultMessage='No one has reposted this gab yet. When someone does, they will show up here.' />}
@ -63,7 +61,6 @@ class Reblogs extends ImmutablePureComponent {
<AccountContainer key={id} id={id} withNote={false} />
)}
</ScrollableList>
</Column>
);
}

View File

@ -1,5 +1,4 @@
import { FormattedMessage } from 'react-intl';
import SectionHeadlineBar from '../../../../components/section_headline_bar';
const mapStateToProps = state => ({
value: state.getIn(['search', 'value']),
@ -41,14 +40,14 @@ class Header extends PureComponent {
</div>
<div className='search-header__type-filters'>
<div className='search-header__type-filters-tabs'>
<SectionHeadlineBar
{ /* <SectionHeadlineBar
items={[
{
to: '/search',
title: <FormattedMessage id='search_results.top' defaultMessage='Top' />
}
]}
/>
/> */ }
</div>
</div>
</div>

View File

@ -39,7 +39,6 @@ import Icon from '../../components/icon';
import ColumnIndicator from '../../components/column_indicator';
import DetailedStatus from './components/detailed_status';
import ActionBar from './components/detailed_status_action_bar';
import Column from '../../components/column';
const messages = defineMessages({
deleteConfirm: { id: 'confirmations.delete.confirm', defaultMessage: 'Delete' },
@ -442,9 +441,7 @@ class Status extends ImmutablePureComponent {
toggleSensitive: this.handleHotkeyToggleSensitive,
};
return (
<Column heading={intl.formatMessage(messages.detailedStatus)}>
{ /* me &&
/* me &&
<ColumnHeader
extraButton={(
<button
@ -461,8 +458,9 @@ class Status extends ImmutablePureComponent {
</button>
)}
/>
*/ }
*/
return (
<div ref={this.setRef}>
{ancestors}
@ -498,7 +496,6 @@ class Status extends ImmutablePureComponent {
{descendants}
</div>
</Column>
);
}

View File

@ -107,15 +107,15 @@ export function Mutes() {
}
export function MuteModal() {
return import(/* webpackChunkName: "modals/mute_modal" */'../../../components/modal')
return import(/* webpackChunkName: "modals/mute_modal" */'../../../components/modal/mute_modal')
}
export function StatusRevisionModal() {
return import(/* webpackChunkName: "modals/mute_modal" */'../../../components/modal')
return import(/* webpackChunkName: "modals/mute_modal" */'../../../components/modal/status_revision_modal')
}
export function ReportModal() {
return import(/* webpackChunkName: "modals/report_modal" */'../../../components/modal')
return import(/* webpackChunkName: "modals/report_modal" */'../../../components/modal/report_modal')
}
export function MediaGallery() {
@ -127,7 +127,7 @@ export function Video() {
}
export function EmbedModal() {
return import(/* webpackChunkName: "modals/embed_modal" */'../../../components/modal')
return import(/* webpackChunkName: "modals/embed_modal" */'../../../components/modal/embed_modal')
}
export function ListEditor() {