diff --git a/src/features/compose/components/compose-form.tsx b/src/features/compose/components/compose-form.tsx index 1e4b4da68..9c4a0851f 100644 --- a/src/features/compose/components/compose-form.tsx +++ b/src/features/compose/components/compose-form.tsx @@ -15,6 +15,7 @@ import { selectComposeSuggestion, uploadCompose, } from 'soapbox/actions/compose.ts'; +import { openModal } from 'soapbox/actions/modals.ts'; import { useCustomEmojis } from 'soapbox/api/hooks/useCustomEmojis.ts'; import AutosuggestInput, { AutoSuggestion } from 'soapbox/components/autosuggest-input.tsx'; import Button from 'soapbox/components/ui/button.tsx'; @@ -72,9 +73,10 @@ interface IComposeForm { event?: string; group?: string; extra?: React.ReactNode; + streak?: number; } -const ComposeForm = ({ id, shouldCondense, autoFocus, clickableAreaRef, event, group, extra }: IComposeForm) => { +const ComposeForm = ({ id, shouldCondense, autoFocus, clickableAreaRef, event, group, extra, streak }: IComposeForm) => { const history = useHistory(); const intl = useIntl(); const dispatch = useAppDispatch(); @@ -156,6 +158,10 @@ const ComposeForm = ({ id, shouldCondense, autoFocus, clickab dispatch(changeCompose(id, text)); dispatch(submitCompose(id, { history })); + if (streak) { + dispatch(openModal('STREAK')); + } + editorRef.current?.dispatchCommand(CLEAR_EDITOR_COMMAND, undefined); }; diff --git a/src/features/ui/components/modal-root.tsx b/src/features/ui/components/modal-root.tsx index c3c996446..ba5894de8 100644 --- a/src/features/ui/components/modal-root.tsx +++ b/src/features/ui/components/modal-root.tsx @@ -39,6 +39,7 @@ import { ReblogsModal, ReplyMentionsModal, ReportModal, + StreakModal, UnauthorizedModal, VideoModal, EditRuleModal, @@ -92,6 +93,7 @@ const MODAL_COMPONENTS: Record> = { 'REBLOGS': ReblogsModal, 'REPLY_MENTIONS': ReplyMentionsModal, 'REPORT': ReportModal, + 'STREAK': StreakModal, 'UNAUTHORIZED': UnauthorizedModal, 'VIDEO': VideoModal, 'ZAPS': ZapsModal, diff --git a/src/features/ui/components/modals/compose-modal.tsx b/src/features/ui/components/modals/compose-modal.tsx index 58e85a496..c30d81e72 100644 --- a/src/features/ui/components/modals/compose-modal.tsx +++ b/src/features/ui/components/modals/compose-modal.tsx @@ -15,6 +15,7 @@ import { useAppDispatch } from 'soapbox/hooks/useAppDispatch.ts'; import { useAppSelector } from 'soapbox/hooks/useAppSelector.ts'; import { useCompose } from 'soapbox/hooks/useCompose.ts'; import { useDraggedFiles } from 'soapbox/hooks/useDraggedFiles.ts'; +import { useOwnAccount } from 'soapbox/hooks/useOwnAccount.ts'; import ComposeForm from '../../../compose/components/compose-form.tsx'; @@ -33,6 +34,7 @@ const ComposeModal: React.FC = ({ onClose, composeId = 'compose-m const dispatch = useAppDispatch(); const node = useRef(null); const compose = useCompose(composeId); + const { account } = useOwnAccount(); const { id: statusId, privacy, in_reply_to: inReplyTo, quote, group_id: groupId } = compose!; @@ -40,6 +42,8 @@ const ComposeModal: React.FC = ({ onClose, composeId = 'compose-m dispatch(uploadCompose(composeId, files, intl)); }); + const userStreak = useAppSelector((state) => account?.ditto?.streak?.days ?? 0); + const onClickClose = () => { if (checkComposeContent(compose)) { dispatch(openModal('CONFIRM', { @@ -93,6 +97,7 @@ const ComposeModal: React.FC = ({ onClose, composeId = 'compose-m id={composeId} extra={} autoFocus + streak={userStreak} /> ); @@ -135,4 +140,4 @@ const ComposeFormGroupToggle: React.FC = ({ composeId, ); }; -export default ComposeModal; +export default ComposeModal; \ No newline at end of file diff --git a/src/features/ui/components/modals/streak-modal.tsx b/src/features/ui/components/modals/streak-modal.tsx new file mode 100644 index 000000000..c40c6b54c --- /dev/null +++ b/src/features/ui/components/modals/streak-modal.tsx @@ -0,0 +1,22 @@ +import React from 'react'; +import { FormattedMessage } from 'react-intl'; + +import Modal from 'soapbox/components/ui/modal.tsx'; +import Text from 'soapbox/components/ui/text.tsx'; + +interface IStreakModal { + onClose: () => void; +} + +const StreakModal: React.FC = ({ onClose }) => { + + return ( + } onClose={onClose}> + + + + + ); +}; + +export default StreakModal; \ No newline at end of file diff --git a/src/features/ui/util/async-components.ts b/src/features/ui/util/async-components.ts index ff6b05aca..e6717d626 100644 --- a/src/features/ui/util/async-components.ts +++ b/src/features/ui/util/async-components.ts @@ -181,3 +181,4 @@ export const ZapsModal = lazy(() => import('soapbox/features/ui/components/modal export const ZapSplitModal = lazy(() => import('soapbox/features/ui/components/modals/zap-split/zap-split-modal.tsx')); export const CaptchaModal = lazy(() => import('soapbox/features/ui/components/modals/captcha-modal/captcha-modal.tsx')); export const NostrBunkerLogin = lazy(() => import('soapbox/features/nostr/nostr-bunker-login.tsx')); +export const StreakModal = lazy(() => import('soapbox/features/ui/components/modals/streak-modal.tsx'));