diff --git a/app/javascript/mastodon/features/ui/components/confirmation_modals/confirmation_modal.tsx b/app/javascript/mastodon/features/ui/components/confirmation_modals/confirmation_modal.tsx index 929b1a240..7a0bfe6a9 100644 --- a/app/javascript/mastodon/features/ui/components/confirmation_modals/confirmation_modal.tsx +++ b/app/javascript/mastodon/features/ui/components/confirmation_modals/confirmation_modal.tsx @@ -13,6 +13,7 @@ export const ConfirmationModal: React.FC< title: React.ReactNode; message: React.ReactNode; confirm: React.ReactNode; + cancel?: React.ReactNode; secondary?: React.ReactNode; onSecondary?: () => void; onConfirm: () => void; @@ -22,6 +23,7 @@ export const ConfirmationModal: React.FC< title, message, confirm, + cancel, onClose, onConfirm, secondary, @@ -57,10 +59,12 @@ export const ConfirmationModal: React.FC<
{secondary && ( diff --git a/app/javascript/mastodon/features/ui/components/confirmation_modals/discard_draft_confirmation.tsx b/app/javascript/mastodon/features/ui/components/confirmation_modals/discard_draft_confirmation.tsx new file mode 100644 index 000000000..206e31efc --- /dev/null +++ b/app/javascript/mastodon/features/ui/components/confirmation_modals/discard_draft_confirmation.tsx @@ -0,0 +1,104 @@ +import { useCallback } from 'react'; + +import { defineMessages, useIntl } from 'react-intl'; + +import { replyCompose } from 'mastodon/actions/compose'; +import { editStatus } from 'mastodon/actions/statuses'; +import type { Status } from 'mastodon/models/status'; +import { useAppDispatch, useAppSelector } from 'mastodon/store'; + +import type { BaseConfirmationModalProps } from './confirmation_modal'; +import { ConfirmationModal } from './confirmation_modal'; + +const editMessages = defineMessages({ + title: { + id: 'confirmations.discard_draft.edit.title', + defaultMessage: 'Discard changes to your post?', + }, + message: { + id: 'confirmations.discard_draft.edit.message', + defaultMessage: + 'Continuing will discard any changes you have made to the post you are currently editing.', + }, + cancel: { + id: 'confirmations.discard_draft.edit.cancel', + defaultMessage: 'Resume editing', + }, +}); + +const postMessages = defineMessages({ + title: { + id: 'confirmations.discard_draft.post.title', + defaultMessage: 'Discard your draft post?', + }, + message: { + id: 'confirmations.discard_draft.post.message', + defaultMessage: + 'Continuing will discard the post you are currently composing.', + }, + cancel: { + id: 'confirmations.discard_draft.post.cancel', + defaultMessage: 'Resume draft', + }, +}); + +const messages = defineMessages({ + confirm: { + id: 'confirmations.discard_draft.confirm', + defaultMessage: 'Discard and continue', + }, +}); + +const DiscardDraftConfirmationModal: React.FC< + { + onConfirm: () => void; + } & BaseConfirmationModalProps +> = ({ onConfirm, onClose }) => { + const intl = useIntl(); + const isEditing = useAppSelector((state) => !!state.compose.get('id')); + + const contextualMessages = isEditing ? editMessages : postMessages; + + return ( + + ); +}; + +export const ConfirmReplyModal: React.FC< + { + status: Status; + } & BaseConfirmationModalProps +> = ({ status, onClose }) => { + const dispatch = useAppDispatch(); + + const onConfirm = useCallback(() => { + dispatch(replyCompose(status)); + }, [dispatch, status]); + + return ( + + ); +}; + +export const ConfirmEditStatusModal: React.FC< + { + statusId: string; + } & BaseConfirmationModalProps +> = ({ statusId, onClose }) => { + const dispatch = useAppDispatch(); + + const onConfirm = useCallback(() => { + dispatch(editStatus(statusId)); + }, [dispatch, statusId]); + + return ( + + ); +}; diff --git a/app/javascript/mastodon/features/ui/components/confirmation_modals/edit_status.tsx b/app/javascript/mastodon/features/ui/components/confirmation_modals/edit_status.tsx deleted file mode 100644 index fb958518c..000000000 --- a/app/javascript/mastodon/features/ui/components/confirmation_modals/edit_status.tsx +++ /dev/null @@ -1,45 +0,0 @@ -import { useCallback } from 'react'; - -import { defineMessages, useIntl } from 'react-intl'; - -import { editStatus } from 'mastodon/actions/statuses'; -import { useAppDispatch } from 'mastodon/store'; - -import type { BaseConfirmationModalProps } from './confirmation_modal'; -import { ConfirmationModal } from './confirmation_modal'; - -const messages = defineMessages({ - editTitle: { - id: 'confirmations.edit.title', - defaultMessage: 'Overwrite post?', - }, - editConfirm: { id: 'confirmations.edit.confirm', defaultMessage: 'Edit' }, - editMessage: { - id: 'confirmations.edit.message', - defaultMessage: - 'Editing now will overwrite the message you are currently composing. Are you sure you want to proceed?', - }, -}); - -export const ConfirmEditStatusModal: React.FC< - { - statusId: string; - } & BaseConfirmationModalProps -> = ({ statusId, onClose }) => { - const intl = useIntl(); - const dispatch = useAppDispatch(); - - const onConfirm = useCallback(() => { - dispatch(editStatus(statusId)); - }, [dispatch, statusId]); - - return ( - - ); -}; diff --git a/app/javascript/mastodon/features/ui/components/confirmation_modals/index.ts b/app/javascript/mastodon/features/ui/components/confirmation_modals/index.ts index 4893fb096..25ffb3b62 100644 --- a/app/javascript/mastodon/features/ui/components/confirmation_modals/index.ts +++ b/app/javascript/mastodon/features/ui/components/confirmation_modals/index.ts @@ -1,8 +1,10 @@ export { ConfirmationModal } from './confirmation_modal'; export { ConfirmDeleteStatusModal } from './delete_status'; export { ConfirmDeleteListModal } from './delete_list'; -export { ConfirmReplyModal } from './reply'; -export { ConfirmEditStatusModal } from './edit_status'; +export { + ConfirmReplyModal, + ConfirmEditStatusModal, +} from './discard_draft_confirmation'; export { ConfirmUnfollowModal } from './unfollow'; export { ConfirmClearNotificationsModal } from './clear_notifications'; export { ConfirmLogOutModal } from './log_out'; diff --git a/app/javascript/mastodon/features/ui/components/confirmation_modals/reply.tsx b/app/javascript/mastodon/features/ui/components/confirmation_modals/reply.tsx deleted file mode 100644 index cccd62e4b..000000000 --- a/app/javascript/mastodon/features/ui/components/confirmation_modals/reply.tsx +++ /dev/null @@ -1,46 +0,0 @@ -import { useCallback } from 'react'; - -import { defineMessages, useIntl } from 'react-intl'; - -import { replyCompose } from 'mastodon/actions/compose'; -import type { Status } from 'mastodon/models/status'; -import { useAppDispatch } from 'mastodon/store'; - -import type { BaseConfirmationModalProps } from './confirmation_modal'; -import { ConfirmationModal } from './confirmation_modal'; - -const messages = defineMessages({ - replyTitle: { - id: 'confirmations.reply.title', - defaultMessage: 'Overwrite post?', - }, - replyConfirm: { id: 'confirmations.reply.confirm', defaultMessage: 'Reply' }, - replyMessage: { - id: 'confirmations.reply.message', - defaultMessage: - 'Replying now will overwrite the message you are currently composing. Are you sure you want to proceed?', - }, -}); - -export const ConfirmReplyModal: React.FC< - { - status: Status; - } & BaseConfirmationModalProps -> = ({ status, onClose }) => { - const intl = useIntl(); - const dispatch = useAppDispatch(); - - const onConfirm = useCallback(() => { - dispatch(replyCompose(status)); - }, [dispatch, status]); - - return ( - - ); -}; diff --git a/app/javascript/mastodon/locales/en.json b/app/javascript/mastodon/locales/en.json index 6a2a7a885..59d39a153 100644 --- a/app/javascript/mastodon/locales/en.json +++ b/app/javascript/mastodon/locales/en.json @@ -219,11 +219,15 @@ "confirmations.delete_list.confirm": "Delete", "confirmations.delete_list.message": "Are you sure you want to permanently delete this list?", "confirmations.delete_list.title": "Delete list?", + "confirmations.discard_draft.confirm": "Discard and continue", + "confirmations.discard_draft.edit.cancel": "Resume editing", + "confirmations.discard_draft.edit.message": "Continuing will discard any changes you have made to the post you are currently editing.", + "confirmations.discard_draft.edit.title": "Discard changes to your post?", + "confirmations.discard_draft.post.cancel": "Resume draft", + "confirmations.discard_draft.post.message": "Continuing will discard the post you are currently composing.", + "confirmations.discard_draft.post.title": "Discard your draft post?", "confirmations.discard_edit_media.confirm": "Discard", "confirmations.discard_edit_media.message": "You have unsaved changes to the media description or preview, discard them anyway?", - "confirmations.edit.confirm": "Edit", - "confirmations.edit.message": "Editing now will overwrite the message you are currently composing. Are you sure you want to proceed?", - "confirmations.edit.title": "Overwrite post?", "confirmations.follow_to_list.confirm": "Follow and add to list", "confirmations.follow_to_list.message": "You need to be following {name} to add them to a list.", "confirmations.follow_to_list.title": "Follow user?", @@ -241,9 +245,6 @@ "confirmations.remove_from_followers.confirm": "Remove follower", "confirmations.remove_from_followers.message": "{name} will stop following you. Are you sure you want to proceed?", "confirmations.remove_from_followers.title": "Remove follower?", - "confirmations.reply.confirm": "Reply", - "confirmations.reply.message": "Replying now will overwrite the message you are currently composing. Are you sure you want to proceed?", - "confirmations.reply.title": "Overwrite post?", "confirmations.unfollow.confirm": "Unfollow", "confirmations.unfollow.message": "Are you sure you want to unfollow {name}?", "confirmations.unfollow.title": "Unfollow user?",