forked from
jollywhoppers.com/witchsky.app
Bluesky app fork with some witchin' additions 馃挮
1import {msg, Trans} from '@lingui/macro'
2import {useLingui} from '@lingui/react'
3
4import {atoms as a} from '#/alf'
5import {Button, ButtonText} from '#/components/Button'
6import * as Dialog from '#/components/Dialog'
7import * as Prompt from '#/components/Prompt'
8import {useAnalytics} from '#/analytics'
9import {DraftsListDialog} from './DraftsListDialog'
10import {useSaveDraftMutation} from './state/queries'
11import {type DraftSummary} from './state/schema'
12
13export function DraftsButton({
14 onSelectDraft,
15 onSaveDraft,
16 onDiscard,
17 isEmpty,
18 isDirty,
19 isEditingDraft,
20 textLength,
21}: {
22 onSelectDraft: (draft: DraftSummary) => void
23 onSaveDraft: () => Promise<void>
24 onDiscard: () => void
25 isEmpty: boolean
26 isDirty: boolean
27 isEditingDraft: boolean
28 textLength: number
29}) {
30 const {_} = useLingui()
31 const ax = useAnalytics()
32 const draftsDialogControl = Dialog.useDialogControl()
33 const savePromptControl = Prompt.usePromptControl()
34 const {isPending: isSaving} = useSaveDraftMutation()
35
36 const handlePress = () => {
37 if (isEmpty || !isDirty) {
38 // Composer is empty or has no unsaved changes, go directly to drafts list
39 draftsDialogControl.open()
40 } else {
41 // Composer has unsaved changes, ask what to do
42 savePromptControl.open()
43 }
44 }
45
46 const handleSaveAndOpen = async () => {
47 await onSaveDraft()
48 draftsDialogControl.open()
49 }
50
51 const handleDiscardAndOpen = () => {
52 // Fire draft:discard metric before discarding
53 ax.metric('draft:discard', {
54 logContext: 'BeforeDraftsList',
55 hadContent: !isEmpty,
56 textLength,
57 })
58 onDiscard()
59 draftsDialogControl.open()
60 }
61
62 return (
63 <>
64 <Button
65 label={_(msg`Drafts`)}
66 variant="ghost"
67 color="primary"
68 shape="default"
69 size="small"
70 style={[a.rounded_full, a.py_sm, a.px_md, a.mx_xs]}
71 disabled={isSaving}
72 onPress={handlePress}>
73 <ButtonText style={[a.text_md]}>
74 <Trans>Drafts</Trans>
75 </ButtonText>
76 </Button>
77
78 <DraftsListDialog
79 control={draftsDialogControl}
80 onSelectDraft={onSelectDraft}
81 />
82
83 <Prompt.Outer control={savePromptControl}>
84 <Prompt.Content>
85 <Prompt.TitleText>
86 {isEditingDraft ? (
87 <Trans>Save changes?</Trans>
88 ) : (
89 <Trans>Save draft?</Trans>
90 )}
91 </Prompt.TitleText>
92 </Prompt.Content>
93 <Prompt.DescriptionText>
94 {isEditingDraft ? (
95 <Trans>
96 You have unsaved changes. Would you like to save them before
97 viewing your drafts?
98 </Trans>
99 ) : (
100 <Trans>
101 Would you like to save this as a draft before viewing your drafts?
102 </Trans>
103 )}
104 </Prompt.DescriptionText>
105 <Prompt.Actions>
106 <Prompt.Action
107 cta={isEditingDraft ? _(msg`Save changes`) : _(msg`Save draft`)}
108 onPress={handleSaveAndOpen}
109 color="primary"
110 />
111 <Prompt.Action
112 cta={_(msg`Discard`)}
113 onPress={handleDiscardAndOpen}
114 color="negative_subtle"
115 />
116 <Prompt.Cancel />
117 </Prompt.Actions>
118 </Prompt.Outer>
119 </>
120 )
121}