+22
-1
src/screens/Settings/ContentAndMediaSettings.tsx
+22
-1
src/screens/Settings/ContentAndMediaSettings.tsx
···
4
4
5
5
import {CommonNavigatorParams} from '#/lib/routes/types'
6
6
import {isNative} from '#/platform/detection'
7
-
import {useAutoplayDisabled, useSetAutoplayDisabled} from '#/state/preferences'
7
+
import {
8
+
useAutoOpenLabelsDialog,
9
+
useAutoplayDisabled,
10
+
useSetAutoOpenLabelsDialog,
11
+
useSetAutoplayDisabled,
12
+
} from '#/state/preferences'
8
13
import {
9
14
useInAppBrowser,
10
15
useSetInAppBrowser,
···
18
23
import {Play_Stroke2_Corner2_Rounded as PlayIcon} from '#/components/icons/Play'
19
24
import {Window_Stroke2_Corner2_Rounded as WindowIcon} from '#/components/icons/Window'
20
25
import * as Layout from '#/components/Layout'
26
+
import {Shield_Stroke2_Corner0_Rounded} from '#/components/icons/Shield'
21
27
22
28
type Props = NativeStackScreenProps<
23
29
CommonNavigatorParams,
···
27
33
const {_} = useLingui()
28
34
const autoplayDisabledPref = useAutoplayDisabled()
29
35
const setAutoplayDisabledPref = useSetAutoplayDisabled()
36
+
const autoOpenLabelsDialogPref = useAutoOpenLabelsDialog()
37
+
const setAutoOpenLabelsDialogPref = useSetAutoOpenLabelsDialog()
30
38
const inAppBrowserPref = useInAppBrowser()
31
39
const setUseInAppBrowser = useSetInAppBrowser()
32
40
···
96
104
<Toggle.Platform />
97
105
</SettingsList.Item>
98
106
</Toggle.Item>
107
+
<Toggle.Item
108
+
name="enable_auto_open_labels_dialog"
109
+
label={_(msg`Open content warning dialog when attaching media`)}
110
+
value={autoOpenLabelsDialogPref}
111
+
onChange={value => setAutoOpenLabelsDialogPref(value)}>
112
+
<SettingsList.Item>
113
+
<SettingsList.ItemIcon icon={Shield_Stroke2_Corner0_Rounded} />
114
+
<SettingsList.ItemText>
115
+
<Trans>Open content warning dialog when attaching media</Trans>
116
+
</SettingsList.ItemText>
117
+
<Toggle.Platform />
118
+
</SettingsList.Item>
119
+
</Toggle.Item>
99
120
</SettingsList.Container>
100
121
</Layout.Content>
101
122
</Layout.Screen>
+2
src/state/persisted/schema.ts
+2
src/state/persisted/schema.ts
···
91
91
*/
92
92
appLanguage: z.string(),
93
93
}),
94
+
autoOpenLabelsDialog: z.boolean(), // should move to server
94
95
requireAltTextEnabled: z.boolean(), // should move to server
95
96
largeAltBadgeEnabled: z.boolean().optional(),
96
97
externalEmbeds: z
···
150
151
deviceLanguageCodes[0],
151
152
]),
152
153
},
154
+
autoOpenLabelsDialog: false,
153
155
requireAltTextEnabled: false,
154
156
largeAltBadgeEnabled: false,
155
157
externalEmbeds: {},
+52
src/state/preferences/auto-open-labels-dialog.tsx
+52
src/state/preferences/auto-open-labels-dialog.tsx
···
1
+
import React from 'react'
2
+
3
+
import * as persisted from '#/state/persisted'
4
+
5
+
type StateContext = persisted.Schema['autoOpenLabelsDialog']
6
+
type SetContext = (v: persisted.Schema['autoOpenLabelsDialog']) => void
7
+
8
+
const stateContext = React.createContext<StateContext>(
9
+
persisted.defaults.autoOpenLabelsDialog,
10
+
)
11
+
const setContext = React.createContext<SetContext>(
12
+
(_: persisted.Schema['autoOpenLabelsDialog']) => {},
13
+
)
14
+
15
+
export function Provider({children}: React.PropsWithChildren<{}>) {
16
+
const [state, setState] = React.useState(
17
+
persisted.get('autoOpenLabelsDialog'),
18
+
)
19
+
20
+
const setStateWrapped = React.useCallback(
21
+
(autoOpenLabelsDialog: persisted.Schema['autoOpenLabelsDialog']) => {
22
+
setState(autoOpenLabelsDialog)
23
+
persisted.write('autoOpenLabelsDialog', autoOpenLabelsDialog)
24
+
},
25
+
[setState],
26
+
)
27
+
28
+
React.useEffect(() => {
29
+
return persisted.onUpdate(
30
+
'autoOpenLabelsDialog',
31
+
nextAutoOpenLabelsDialog => {
32
+
setState(nextAutoOpenLabelsDialog)
33
+
},
34
+
)
35
+
}, [setStateWrapped])
36
+
37
+
return (
38
+
<stateContext.Provider value={state}>
39
+
<setContext.Provider value={setStateWrapped}>
40
+
{children}
41
+
</setContext.Provider>
42
+
</stateContext.Provider>
43
+
)
44
+
}
45
+
46
+
export function useAutoOpenLabelsDialog() {
47
+
return React.useContext(stateContext)
48
+
}
49
+
50
+
export function useSetAutoOpenLabelsDialog() {
51
+
return React.useContext(setContext)
52
+
}
+24
-17
src/state/preferences/index.tsx
+24
-17
src/state/preferences/index.tsx
···
1
1
import React from 'react'
2
2
3
3
import {Provider as AltTextRequiredProvider} from './alt-text-required'
4
+
import {Provider as AutoOpenLabelsDialogProvider} from './auto-open-labels-dialog'
4
5
import {Provider as AutoplayProvider} from './autoplay'
5
6
import {Provider as DisableHapticsProvider} from './disable-haptics'
6
7
import {Provider as ExternalEmbedsProvider} from './external-embeds-prefs'
···
16
17
useRequireAltTextEnabled,
17
18
useSetRequireAltTextEnabled,
18
19
} from './alt-text-required'
20
+
export {
21
+
useAutoOpenLabelsDialog,
22
+
useSetAutoOpenLabelsDialog,
23
+
} from './auto-open-labels-dialog'
19
24
export {useAutoplayDisabled, useSetAutoplayDisabled} from './autoplay'
20
25
export {useHapticsDisabled, useSetHapticsDisabled} from './disable-haptics'
21
26
export {
···
31
36
return (
32
37
<LanguagesProvider>
33
38
<AltTextRequiredProvider>
34
-
<LargeAltBadgeProvider>
35
-
<ExternalEmbedsProvider>
36
-
<HiddenPostsProvider>
37
-
<InAppBrowserProvider>
38
-
<DisableHapticsProvider>
39
-
<AutoplayProvider>
40
-
<UsedStarterPacksProvider>
41
-
<SubtitlesProvider>
42
-
<KawaiiProvider>{children}</KawaiiProvider>
43
-
</SubtitlesProvider>
44
-
</UsedStarterPacksProvider>
45
-
</AutoplayProvider>
46
-
</DisableHapticsProvider>
47
-
</InAppBrowserProvider>
48
-
</HiddenPostsProvider>
49
-
</ExternalEmbedsProvider>
50
-
</LargeAltBadgeProvider>
39
+
<AutoOpenLabelsDialogProvider>
40
+
<LargeAltBadgeProvider>
41
+
<ExternalEmbedsProvider>
42
+
<HiddenPostsProvider>
43
+
<InAppBrowserProvider>
44
+
<DisableHapticsProvider>
45
+
<AutoplayProvider>
46
+
<UsedStarterPacksProvider>
47
+
<SubtitlesProvider>
48
+
<KawaiiProvider>{children}</KawaiiProvider>
49
+
</SubtitlesProvider>
50
+
</UsedStarterPacksProvider>
51
+
</AutoplayProvider>
52
+
</DisableHapticsProvider>
53
+
</InAppBrowserProvider>
54
+
</HiddenPostsProvider>
55
+
</ExternalEmbedsProvider>
56
+
</LargeAltBadgeProvider>
57
+
</AutoOpenLabelsDialogProvider>
51
58
</AltTextRequiredProvider>
52
59
</LanguagesProvider>
53
60
)
+11
src/view/com/composer/labels/LabelsBtn.tsx
+11
src/view/com/composer/labels/LabelsBtn.tsx
···
1
+
import {useEffect} from 'react'
1
2
import {Keyboard, View} from 'react-native'
2
3
import {msg, Trans} from '@lingui/macro'
3
4
import {useLingui} from '@lingui/react'
···
10
11
SelfLabel,
11
12
} from '#/lib/moderation'
12
13
import {isWeb} from '#/platform/detection'
14
+
import {useAutoOpenLabelsDialog} from '#/state/preferences'
13
15
import {atoms as a, native, useTheme, web} from '#/alf'
14
16
import {Button, ButtonIcon, ButtonText} from '#/components/Button'
15
17
import * as Dialog from '#/components/Dialog'
···
46
48
])
47
49
}
48
50
51
+
const autoOpenLabelsDialogPref = useAutoOpenLabelsDialog()
52
+
53
+
useEffect(() => {
54
+
if (autoOpenLabelsDialogPref) {
55
+
Keyboard.dismiss()
56
+
control.open()
57
+
}
58
+
}, [autoOpenLabelsDialogPref, control])
59
+
49
60
return (
50
61
<>
51
62
<Button