[🐴] Settings screen (#3830)
* create settings screen + api * update api package * use putrecord API with validate false * create new RadioGroup component
This commit is contained in:
parent
9861494e34
commit
5af61ca4e4
6 changed files with 216 additions and 28 deletions
70
src/screens/Messages/Settings.tsx
Normal file
70
src/screens/Messages/Settings.tsx
Normal file
|
@ -0,0 +1,70 @@
|
|||
import React, {useCallback} from 'react'
|
||||
import {View} from 'react-native'
|
||||
import {AppBskyActorDefs} from '@atproto/api'
|
||||
import {msg, Trans} from '@lingui/macro'
|
||||
import {useLingui} from '@lingui/react'
|
||||
import {NativeStackScreenProps} from '@react-navigation/native-stack'
|
||||
import {UseQueryResult} from '@tanstack/react-query'
|
||||
|
||||
import {CommonNavigatorParams} from '#/lib/routes/types'
|
||||
import {useGate} from '#/lib/statsig/statsig'
|
||||
import {useUpdateActorDeclaration} from '#/state/queries/messages/actor-declaration'
|
||||
import {useProfileQuery} from '#/state/queries/profile'
|
||||
import {useSession} from '#/state/session'
|
||||
import * as Toast from '#/view/com/util/Toast'
|
||||
import {ViewHeader} from '#/view/com/util/ViewHeader'
|
||||
import {CenteredView} from '#/view/com/util/Views'
|
||||
import {atoms as a} from '#/alf'
|
||||
import {RadioGroup} from '#/components/RadioGroup'
|
||||
import {Text} from '#/components/Typography'
|
||||
import {ClipClopGate} from './gate'
|
||||
|
||||
type AllowIncoming = 'all' | 'none' | 'following'
|
||||
|
||||
type Props = NativeStackScreenProps<CommonNavigatorParams, 'MessagesSettings'>
|
||||
export function MessagesSettingsScreen({}: Props) {
|
||||
const {_} = useLingui()
|
||||
const {currentAccount} = useSession()
|
||||
const {data: profile} = useProfileQuery({
|
||||
did: currentAccount!.did,
|
||||
}) as UseQueryResult<AppBskyActorDefs.ProfileViewDetailed, Error>
|
||||
|
||||
const {mutate: updateDeclaration} = useUpdateActorDeclaration({
|
||||
onError: () => {
|
||||
Toast.show(_(msg`Failed to update settings`))
|
||||
},
|
||||
})
|
||||
|
||||
const onSelectItem = useCallback(
|
||||
(key: string) => {
|
||||
updateDeclaration(key as AllowIncoming)
|
||||
},
|
||||
[updateDeclaration],
|
||||
)
|
||||
|
||||
const gate = useGate()
|
||||
if (!gate('dms')) return <ClipClopGate />
|
||||
|
||||
return (
|
||||
<CenteredView sideBorders>
|
||||
<ViewHeader title={_(msg`Settings`)} showOnDesktop showBorder />
|
||||
<View style={[a.px_md, a.py_lg, a.gap_md]}>
|
||||
<Text style={[a.text_xl, a.font_bold, a.px_sm]}>
|
||||
<Trans>Allow messages from</Trans>
|
||||
</Text>
|
||||
<RadioGroup<AllowIncoming>
|
||||
value={
|
||||
(profile?.associated?.chat?.allowIncoming as AllowIncoming) ??
|
||||
'following'
|
||||
}
|
||||
items={[
|
||||
{label: _(msg`Everyone`), value: 'all'},
|
||||
{label: _(msg`Follows only`), value: 'following'},
|
||||
{label: _(msg`No one`), value: 'none'},
|
||||
]}
|
||||
onSelect={onSelectItem}
|
||||
/>
|
||||
</View>
|
||||
</CenteredView>
|
||||
)
|
||||
}
|
Loading…
Add table
Add a link
Reference in a new issue