Thread through default settings into composer
This commit is contained in:
@@ -2,34 +2,24 @@ import React from 'react'
|
|||||||
import {View} from 'react-native'
|
import {View} from 'react-native'
|
||||||
import {msg, Trans} from '@lingui/macro'
|
import {msg, Trans} from '@lingui/macro'
|
||||||
import {useLingui} from '@lingui/react'
|
import {useLingui} from '@lingui/react'
|
||||||
import {AppBskyFeedDefs, AppBskyFeedPostgate, AtUri} from '@atproto/api'
|
|
||||||
|
|
||||||
import {logger} from '#/logger'
|
import {logger} from '#/logger'
|
||||||
import {useAgent, useSession} from '#/state/session'
|
import {usePostInteractionSettingsMutation} from '#/state/queries/post-interaction-settings'
|
||||||
import {atoms as a, useGutters} from '#/alf'
|
import {createPostgateRecord} from '#/state/queries/postgate/util'
|
||||||
import {PostInteractionSettingsForm} from '#/components/dialogs/PostInteractionSettingsDialog'
|
|
||||||
import * as Layout from '#/components/Layout'
|
|
||||||
import {Admonition} from '#/components/Admonition'
|
|
||||||
import {
|
import {
|
||||||
createPostgateQueryKey,
|
usePreferencesQuery,
|
||||||
getPostgateRecord,
|
UsePreferencesQueryResponse,
|
||||||
usePostgateQuery,
|
} from '#/state/queries/preferences'
|
||||||
useWritePostgateMutation,
|
|
||||||
} from '#/state/queries/postgate'
|
|
||||||
import {
|
import {
|
||||||
createPostgateRecord,
|
|
||||||
embeddingRules,
|
|
||||||
} from '#/state/queries/postgate/util'
|
|
||||||
import {
|
|
||||||
createThreadgateViewQueryKey,
|
|
||||||
getThreadgateView,
|
|
||||||
ThreadgateAllowUISetting,
|
ThreadgateAllowUISetting,
|
||||||
threadgateViewToAllowUISetting,
|
threadgateAllowUISettingToAllowRecordValue,
|
||||||
useSetThreadgateAllowMutation,
|
|
||||||
useThreadgateViewQuery,
|
|
||||||
threadgateRecordToAllowUISetting,
|
threadgateRecordToAllowUISetting,
|
||||||
} from '#/state/queries/threadgate'
|
} from '#/state/queries/threadgate'
|
||||||
import {usePreferencesQuery, UsePreferencesQueryResponse} from '#/state/queries/preferences'
|
import * as Toast from '#/view/com/util/Toast'
|
||||||
|
import {atoms as a, useGutters} from '#/alf'
|
||||||
|
import {Admonition} from '#/components/Admonition'
|
||||||
|
import {PostInteractionSettingsForm} from '#/components/dialogs/PostInteractionSettingsDialog'
|
||||||
|
import * as Layout from '#/components/Layout'
|
||||||
import {Loader} from '#/components/Loader'
|
import {Loader} from '#/components/Loader'
|
||||||
|
|
||||||
export function Screen() {
|
export function Screen() {
|
||||||
@@ -58,7 +48,7 @@ export function Screen() {
|
|||||||
<Inner preferences={preferences} />
|
<Inner preferences={preferences} />
|
||||||
) : (
|
) : (
|
||||||
<View style={[gutters, a.justify_center, a.align_center]}>
|
<View style={[gutters, a.justify_center, a.align_center]}>
|
||||||
<Loader size='xl' />
|
<Loader size="xl" />
|
||||||
</View>
|
</View>
|
||||||
)}
|
)}
|
||||||
</View>
|
</View>
|
||||||
@@ -69,63 +59,59 @@ export function Screen() {
|
|||||||
|
|
||||||
function Inner({preferences}: {preferences: UsePreferencesQueryResponse}) {
|
function Inner({preferences}: {preferences: UsePreferencesQueryResponse}) {
|
||||||
const {_} = useLingui()
|
const {_} = useLingui()
|
||||||
const {currentAccount} = useSession()
|
const {mutateAsync: setPostInteractionSettings, isPending} =
|
||||||
const [isSaving, setIsSaving] = React.useState(false)
|
usePostInteractionSettingsMutation()
|
||||||
console.log(preferences)
|
const [error, setError] = React.useState<string | undefined>(undefined)
|
||||||
|
|
||||||
const [postgate, setPostgate] = React.useState(() => {
|
const [postgate, setPostgate] = React.useState(() => {
|
||||||
return createPostgateRecord({
|
return createPostgateRecord({
|
||||||
post: '',
|
post: '',
|
||||||
embeddingRules: preferences.postInteractionSettings.postgateEmbeddingRules
|
embeddingRules:
|
||||||
|
preferences.postInteractionSettings.postgateEmbeddingRules,
|
||||||
})
|
})
|
||||||
})
|
})
|
||||||
const [allowUISettings, setAllowUISettings] = React.useState<ThreadgateAllowUISetting[]>(() => {
|
const [allowUISettings, setAllowUISettings] = React.useState<
|
||||||
|
ThreadgateAllowUISetting[]
|
||||||
|
>(() => {
|
||||||
return threadgateRecordToAllowUISetting({
|
return threadgateRecordToAllowUISetting({
|
||||||
$type: 'app.bsky.feed.threadgate',
|
$type: 'app.bsky.feed.threadgate',
|
||||||
post: '',
|
post: '',
|
||||||
createdAt: new Date().toString(),
|
createdAt: new Date().toString(),
|
||||||
allow: preferences.postInteractionSettings.threadgateAllowRules
|
allow: preferences.postInteractionSettings.threadgateAllowRules,
|
||||||
})
|
})
|
||||||
})
|
})
|
||||||
|
|
||||||
const onSave = React.useCallback(async () => {
|
const onSave = React.useCallback(async () => {
|
||||||
setIsSaving(true)
|
setError('')
|
||||||
|
|
||||||
try {
|
try {
|
||||||
const requests = []
|
await setPostInteractionSettings({
|
||||||
|
threadgateAllowRules:
|
||||||
if (postgate) {
|
threadgateAllowUISettingToAllowRecordValue(allowUISettings),
|
||||||
// TODO
|
postgateEmbeddingRules: postgate.embeddingRules ?? [],
|
||||||
}
|
})
|
||||||
|
Toast.show(_(msg`Settings saved`))
|
||||||
if (allowUISettings) {
|
|
||||||
// TODO
|
|
||||||
}
|
|
||||||
} catch (e: any) {
|
} catch (e: any) {
|
||||||
logger.error(`Failed to save post interaction settings`, {
|
logger.error(`Failed to save post interaction settings`, {
|
||||||
context: 'PostInteractionSettingsDialogControlledInner',
|
context: 'PostInteractionSettingsDialogControlledInner',
|
||||||
safeMessage: e.message,
|
safeMessage: e.message,
|
||||||
})
|
})
|
||||||
} finally {
|
setError(_(msg`Failed to save settings. Please try again.`))
|
||||||
setIsSaving(false)
|
|
||||||
}
|
}
|
||||||
}, [
|
}, [_, postgate, allowUISettings, setPostInteractionSettings])
|
||||||
_,
|
|
||||||
postgate,
|
|
||||||
allowUISettings,
|
|
||||||
setIsSaving,
|
|
||||||
])
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<PostInteractionSettingsForm
|
<PostInteractionSettingsForm
|
||||||
isSaving={isSaving}
|
isSaving={isPending}
|
||||||
onSave={onSave}
|
onSave={onSave}
|
||||||
postgate={postgate}
|
postgate={postgate}
|
||||||
onChangePostgate={setPostgate}
|
onChangePostgate={setPostgate}
|
||||||
threadgateAllowUISettings={allowUISettings}
|
threadgateAllowUISettings={allowUISettings}
|
||||||
onChangeThreadgateAllowUISettings={setAllowUISettings}
|
onChangeThreadgateAllowUISettings={setAllowUISettings}
|
||||||
/>
|
/>
|
||||||
|
|
||||||
|
{error && <Admonition type="error">{error}</Admonition>}
|
||||||
</>
|
</>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -0,0 +1,20 @@
|
|||||||
|
import {AppBskyActorDefs} from '@atproto/api'
|
||||||
|
import {useMutation, useQueryClient} from '@tanstack/react-query'
|
||||||
|
|
||||||
|
import {preferencesQueryKey} from '#/state/queries/preferences'
|
||||||
|
import {useAgent} from '#/state/session'
|
||||||
|
|
||||||
|
export function usePostInteractionSettingsMutation() {
|
||||||
|
const qc = useQueryClient()
|
||||||
|
const agent = useAgent()
|
||||||
|
return useMutation({
|
||||||
|
async mutationFn(props: AppBskyActorDefs.PostInteractionSettingsPref) {
|
||||||
|
await agent.setPostInteractionSettings(props)
|
||||||
|
},
|
||||||
|
async onSuccess() {
|
||||||
|
await qc.invalidateQueries({
|
||||||
|
queryKey: preferencesQueryKey,
|
||||||
|
})
|
||||||
|
},
|
||||||
|
})
|
||||||
|
}
|
||||||
@@ -39,4 +39,8 @@ export const DEFAULT_LOGGED_OUT_PREFERENCES: UsePreferencesQueryResponse = {
|
|||||||
activeProgressGuide: undefined,
|
activeProgressGuide: undefined,
|
||||||
nuxs: [],
|
nuxs: [],
|
||||||
},
|
},
|
||||||
|
postInteractionSettings: {
|
||||||
|
threadgateAllowRules: undefined,
|
||||||
|
postgateEmbeddingRules: [],
|
||||||
|
},
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -83,6 +83,10 @@ import {
|
|||||||
useLanguagePrefs,
|
useLanguagePrefs,
|
||||||
useLanguagePrefsApi,
|
useLanguagePrefsApi,
|
||||||
} from '#/state/preferences/languages'
|
} from '#/state/preferences/languages'
|
||||||
|
import {
|
||||||
|
preferencesQueryKey,
|
||||||
|
UsePreferencesQueryResponse,
|
||||||
|
} from '#/state/queries/preferences'
|
||||||
import {useProfileQuery} from '#/state/queries/profile'
|
import {useProfileQuery} from '#/state/queries/profile'
|
||||||
import {Gif} from '#/state/queries/tenor'
|
import {Gif} from '#/state/queries/tenor'
|
||||||
import {useAgent, useSession} from '#/state/session'
|
import {useAgent, useSession} from '#/state/session'
|
||||||
@@ -169,6 +173,11 @@ export const ComposePost = ({
|
|||||||
const discardPromptControl = Prompt.usePromptControl()
|
const discardPromptControl = Prompt.usePromptControl()
|
||||||
const {closeAllDialogs} = useDialogStateControlContext()
|
const {closeAllDialogs} = useDialogStateControlContext()
|
||||||
const {closeAllModals} = useModalControls()
|
const {closeAllModals} = useModalControls()
|
||||||
|
const initInteractionSettings = useMemo(() => {
|
||||||
|
const prefs =
|
||||||
|
queryClient.getQueryData<UsePreferencesQueryResponse>(preferencesQueryKey)
|
||||||
|
return prefs?.postInteractionSettings
|
||||||
|
}, [queryClient])
|
||||||
|
|
||||||
const [isKeyboardVisible] = useIsKeyboardVisible({iosUseWillEvents: true})
|
const [isKeyboardVisible] = useIsKeyboardVisible({iosUseWillEvents: true})
|
||||||
const [isPublishing, setIsPublishing] = useState(false)
|
const [isPublishing, setIsPublishing] = useState(false)
|
||||||
@@ -177,7 +186,13 @@ export const ComposePost = ({
|
|||||||
|
|
||||||
const [composerState, composerDispatch] = useReducer(
|
const [composerState, composerDispatch] = useReducer(
|
||||||
composerReducer,
|
composerReducer,
|
||||||
{initImageUris, initQuoteUri: initQuote?.uri, initText, initMention},
|
{
|
||||||
|
initImageUris,
|
||||||
|
initQuoteUri: initQuote?.uri,
|
||||||
|
initText,
|
||||||
|
initMention,
|
||||||
|
initInteractionSettings,
|
||||||
|
},
|
||||||
createComposerState,
|
createComposerState,
|
||||||
)
|
)
|
||||||
|
|
||||||
|
|||||||
@@ -1,5 +1,10 @@
|
|||||||
import {ImagePickerAsset} from 'expo-image-picker'
|
import {ImagePickerAsset} from 'expo-image-picker'
|
||||||
import {AppBskyFeedPostgate, AppBskyRichtextFacet, RichText} from '@atproto/api'
|
import {
|
||||||
|
AppBskyFeedPostgate,
|
||||||
|
AppBskyRichtextFacet,
|
||||||
|
BskyPreferences,
|
||||||
|
RichText,
|
||||||
|
} from '@atproto/api'
|
||||||
import {nanoid} from 'nanoid/non-secure'
|
import {nanoid} from 'nanoid/non-secure'
|
||||||
|
|
||||||
import {SelfLabel} from '#/lib/moderation'
|
import {SelfLabel} from '#/lib/moderation'
|
||||||
@@ -13,7 +18,7 @@ import {
|
|||||||
import {ComposerImage, createInitialImages} from '#/state/gallery'
|
import {ComposerImage, createInitialImages} from '#/state/gallery'
|
||||||
import {createPostgateRecord} from '#/state/queries/postgate/util'
|
import {createPostgateRecord} from '#/state/queries/postgate/util'
|
||||||
import {Gif} from '#/state/queries/tenor'
|
import {Gif} from '#/state/queries/tenor'
|
||||||
import {threadgateViewToAllowUISetting} from '#/state/queries/threadgate'
|
import {threadgateRecordToAllowUISetting} from '#/state/queries/threadgate'
|
||||||
import {ThreadgateAllowUISetting} from '#/state/queries/threadgate'
|
import {ThreadgateAllowUISetting} from '#/state/queries/threadgate'
|
||||||
import {ComposerOpts} from '#/state/shell/composer'
|
import {ComposerOpts} from '#/state/shell/composer'
|
||||||
import {
|
import {
|
||||||
@@ -477,11 +482,15 @@ export function createComposerState({
|
|||||||
initMention,
|
initMention,
|
||||||
initImageUris,
|
initImageUris,
|
||||||
initQuoteUri,
|
initQuoteUri,
|
||||||
|
initInteractionSettings,
|
||||||
}: {
|
}: {
|
||||||
initText: string | undefined
|
initText: string | undefined
|
||||||
initMention: string | undefined
|
initMention: string | undefined
|
||||||
initImageUris: ComposerOpts['imageUris']
|
initImageUris: ComposerOpts['imageUris']
|
||||||
initQuoteUri: string | undefined
|
initQuoteUri: string | undefined
|
||||||
|
initInteractionSettings:
|
||||||
|
| BskyPreferences['postInteractionSettings']
|
||||||
|
| undefined
|
||||||
}): ComposerState {
|
}): ComposerState {
|
||||||
let media: ImagesMedia | undefined
|
let media: ImagesMedia | undefined
|
||||||
if (initImageUris?.length) {
|
if (initImageUris?.length) {
|
||||||
@@ -591,8 +600,16 @@ export function createComposerState({
|
|||||||
},
|
},
|
||||||
},
|
},
|
||||||
],
|
],
|
||||||
postgate: createPostgateRecord({post: ''}),
|
postgate: createPostgateRecord({
|
||||||
threadgate: threadgateViewToAllowUISetting(undefined),
|
post: '',
|
||||||
|
embeddingRules: initInteractionSettings?.postgateEmbeddingRules || [],
|
||||||
|
}),
|
||||||
|
threadgate: threadgateRecordToAllowUISetting({
|
||||||
|
$type: 'app.bsky.feed.threadgate',
|
||||||
|
post: '',
|
||||||
|
createdAt: new Date().toString(),
|
||||||
|
allow: initInteractionSettings?.threadgateAllowRules,
|
||||||
|
}),
|
||||||
},
|
},
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user