Progress
This commit is contained in:
@@ -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 {
|
||||
|
||||
@@ -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' },
|
||||
@@ -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' },
|
||||
@@ -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>
|
||||
);
|
||||
)
|
||||
}
|
||||
|
||||
}
|
||||
@@ -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' },
|
||||
@@ -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),
|
||||
@@ -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,
|
||||
};
|
||||
@@ -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' },
|
||||
20
app/javascript/gabsocial/components/modal/modal_loading.js
Normal file
20
app/javascript/gabsocial/components/modal/modal_loading.js
Normal file
@@ -0,0 +1,20 @@
|
||||
import ColumnIndicator from '../column_indicator';
|
||||
|
||||
// Keep the markup in sync with <BundleModalError />
|
||||
// (make sure they have the same dimensions)
|
||||
export default class ModalLoading extends PureComponent {
|
||||
render() {
|
||||
return (
|
||||
<div className='modal-root__modal error-modal'>
|
||||
<div className='error-modal__body'>
|
||||
<ColumnIndicator type='loading' />
|
||||
</div>
|
||||
<div className='error-modal__footer'>
|
||||
<div>
|
||||
<button className='error-modal__nav onboarding-modal__skip' />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
@@ -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,
|
||||
|
||||
@@ -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}?' },
|
||||
@@ -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;
|
||||
render() {
|
||||
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} />
|
||||
<ModalLayout title={intl.formatMessage(messages.title)}>
|
||||
<div>
|
||||
<Text>
|
||||
{intl.formatMessage(messages.text)}
|
||||
</Text>
|
||||
<Text>
|
||||
{intl.formatMessage(messages.benefits)}
|
||||
</Text>
|
||||
</div>
|
||||
<div className='compose-modal__content pro-upgrade-modal__content'>
|
||||
<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>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
|
||||
<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>
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
export default injectIntl(connect(mapStateToProps)(ProUpgradeModal));
|
||||
|
||||
@@ -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' },
|
||||
@@ -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' },
|
||||
@@ -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';
|
||||
|
||||
Reference in New Issue
Block a user