Create shared preferences API (#4654)

5 files changed, 138 insertions, 9 deletions

diff --git a/src/Navigation.tsx b/src/Navigation.tsx
index 4ecf3fff8..495435122 100644
--- a/src/Navigation.tsx
+++ b/src/Navigation.tsx
@@ -39,6 +39,7 @@ import {ModerationMutedAccounts} from 'view/screens/ModerationMutedAccounts'
 import {PreferencesFollowingFeed} from 'view/screens/PreferencesFollowingFeed'
 import {PreferencesThreads} from 'view/screens/PreferencesThreads'
 import {SavedFeeds} from 'view/screens/SavedFeeds'
+import {SharedPreferencesTesterScreen} from '#/screens/E2E/SharedPreferencesTesterScreen'
 import HashtagScreen from '#/screens/Hashtag'
 import {ModerationScreen} from '#/screens/Moderation'
 import {ProfileKnownFollowersScreen} from '#/screens/Profile/KnownFollowers'
@@ -234,6 +235,11 @@ function commonScreens(Stack: typeof HomeTab, unreadCountLabel?: string) {
         options={{title: title(msg`Moderation states`), requireAuth: true}}
       />
       <Stack.Screen
+        name="SharedPreferencesTester"
+        getComponent={() => SharedPreferencesTesterScreen}
+        options={{title: title(msg`Shared Preferences Tester`)}}
+      />
+      <Stack.Screen
         name="Log"
         getComponent={() => LogScreen}
         options={{title: title(msg`Log`), requireAuth: true}}
diff --git a/src/components/hooks/useStarterPackEntry.native.ts b/src/components/hooks/useStarterPackEntry.native.ts
index b6e4ab05b..212ecae71 100644
--- a/src/components/hooks/useStarterPackEntry.native.ts
+++ b/src/components/hooks/useStarterPackEntry.native.ts
@@ -7,7 +7,7 @@ import {
 import {isAndroid} from 'platform/detection'
 import {useHasCheckedForStarterPack} from 'state/preferences/used-starter-packs'
 import {useSetActiveStarterPack} from 'state/shell/starter-pack'
-import {DevicePrefs, Referrer} from '../../../modules/expo-bluesky-swiss-army'
+import {Referrer, SharedPrefs} from '../../../modules/expo-bluesky-swiss-army'
 
 export function useStarterPackEntry() {
   const [ready, setReady] = React.useState(false)
@@ -39,14 +39,10 @@ export function useStarterPackEntry() {
           uri = createStarterPackLinkFromAndroidReferrer(res.installReferrer)
         }
       } else {
-        const res = await DevicePrefs.getStringValueAsync(
-          'starterPackUri',
-          true,
-        )
-
-        if (res) {
-          uri = httpStarterPackUriToAtUri(res)
-          DevicePrefs.setStringValueAsync('starterPackUri', null, true)
+        const starterPackUri = SharedPrefs.getString('starterPackUri')
+        if (starterPackUri) {
+          uri = httpStarterPackUriToAtUri(starterPackUri)
+          SharedPrefs.setValue('starterPackUri', null)
         }
       }
 
diff --git a/src/lib/routes/types.ts b/src/lib/routes/types.ts
index 9d102f248..bda93fb40 100644
--- a/src/lib/routes/types.ts
+++ b/src/lib/routes/types.ts
@@ -25,6 +25,7 @@ export type CommonNavigatorParams = {
   ProfileLabelerLikedBy: {name: string}
   Debug: undefined
   DebugMod: undefined
+  SharedPreferencesTester: undefined
   Log: undefined
   Support: undefined
   PrivacyPolicy: undefined
diff --git a/src/screens/E2E/SharedPreferencesTesterScreen.tsx b/src/screens/E2E/SharedPreferencesTesterScreen.tsx
new file mode 100644
index 000000000..380f1080b
--- /dev/null
+++ b/src/screens/E2E/SharedPreferencesTesterScreen.tsx
@@ -0,0 +1,113 @@
+import React from 'react'
+import {View} from 'react-native'
+
+import {ScrollView} from 'view/com/util/Views'
+import {atoms as a} from '#/alf'
+import {Button, ButtonText} from '#/components/Button'
+import {Text} from '#/components/Typography'
+import {SharedPrefs} from '../../../modules/expo-bluesky-swiss-army'
+
+export function SharedPreferencesTesterScreen() {
+  const [currentTestOutput, setCurrentTestOutput] = React.useState<string>('')
+
+  return (
+    <ScrollView contentContainerStyle={{backgroundColor: 'red'}}>
+      <View style={[a.flex_1]}>
+        <View>
+          <Text testID="testOutput">{currentTestOutput}</Text>
+        </View>
+        <View style={[a.flex_wrap]}>
+          <Button
+            label="btn"
+            testID="setStringBtn"
+            style={[a.self_center]}
+            variant="solid"
+            color="primary"
+            size="xsmall"
+            onPress={async () => {
+              SharedPrefs.removeValue('testerString')
+              SharedPrefs.setValue('testerString', 'Hello')
+              const str = SharedPrefs.getString('testerString')
+              console.log(JSON.stringify(str))
+              setCurrentTestOutput(`${str}`)
+            }}>
+            <ButtonText>Set String</ButtonText>
+          </Button>
+          <Button
+            label="btn"
+            testID="removeStringBtn"
+            style={[a.self_center]}
+            variant="solid"
+            color="primary"
+            size="xsmall"
+            onPress={async () => {
+              SharedPrefs.removeValue('testerString')
+              const str = SharedPrefs.getString('testerString')
+              setCurrentTestOutput(`${str}`)
+            }}>
+            <ButtonText>Remove String</ButtonText>
+          </Button>
+          <Button
+            label="btn"
+            testID="setBoolBtn"
+            style={[a.self_center]}
+            variant="solid"
+            color="primary"
+            size="xsmall"
+            onPress={async () => {
+              SharedPrefs.removeValue('testerBool')
+              SharedPrefs.setValue('testerBool', true)
+              const bool = SharedPrefs.getBool('testerBool')
+              setCurrentTestOutput(`${bool}`)
+            }}>
+            <ButtonText>Set Bool</ButtonText>
+          </Button>
+          <Button
+            label="btn"
+            testID="setNumberBtn"
+            style={[a.self_center]}
+            variant="solid"
+            color="primary"
+            size="xsmall"
+            onPress={async () => {
+              SharedPrefs.removeValue('testerNumber')
+              SharedPrefs.setValue('testerNumber', 123)
+              const num = SharedPrefs.getNumber('testerNumber')
+              setCurrentTestOutput(`${num}`)
+            }}>
+            <ButtonText>Set Number</ButtonText>
+          </Button>
+          <Button
+            label="btn"
+            testID="addToSetBtn"
+            style={[a.self_center]}
+            variant="solid"
+            color="primary"
+            size="xsmall"
+            onPress={async () => {
+              SharedPrefs.removeFromSet('testerSet', 'Hello!')
+              SharedPrefs.addToSet('testerSet', 'Hello!')
+              const contains = SharedPrefs.setContains('testerSet', 'Hello!')
+              setCurrentTestOutput(`${contains}`)
+            }}>
+            <ButtonText>Add to Set</ButtonText>
+          </Button>
+          <Button
+            label="btn"
+            testID="removeFromSetBtn"
+            style={[a.self_center]}
+            variant="solid"
+            color="primary"
+            size="xsmall"
+            onPress={async () => {
+              SharedPrefs.removeFromSet('testerSet', 'Hello!')
+              const contains = SharedPrefs.setContains('testerSet', 'Hello!')
+              setCurrentTestOutput(`${contains}`)
+            }}>
+            <ButtonText>Remove from Set</ButtonText>
+          </Button>
+        </View>
+      </View>
+    </ScrollView>
+  )
+}
diff --git a/src/view/screens/Storybook/Dialogs.tsx b/src/view/screens/Storybook/Dialogs.tsx
index 6d166d4b6..ca2420fed 100644
--- a/src/view/screens/Storybook/Dialogs.tsx
+++ b/src/view/screens/Storybook/Dialogs.tsx
@@ -1,7 +1,9 @@
 import React from 'react'
 import {View} from 'react-native'
+import {useNavigation} from '@react-navigation/native'
 
 import {useDialogStateControlContext} from '#/state/dialogs'
+import {NavigationProp} from 'lib/routes/types'
 import {atoms as a} from '#/alf'
 import {Button, ButtonText} from '#/components/Button'
 import * as Dialog from '#/components/Dialog'
@@ -18,6 +20,7 @@ export function Dialogs() {
   const [shouldRenderUnmountTest, setShouldRenderUnmountTest] =
     React.useState(false)
   const unmountTestInterval = React.useRef<number>()
+  const navigation = useNavigation<NavigationProp>()
 
   const onUnmountTestStartPressWithClose = () => {
     setShouldRenderUnmountTest(true)
@@ -134,6 +137,16 @@ export function Dialogs() {
         <ButtonText>End Unmount Test</ButtonText>
       </Button>
 
+      <Button
+        variant="solid"
+        color="primary"
+        size="small"
+        onPress={() => navigation.navigate('SharedPreferencesTester')}
+        label="two"
+        testID="sharedPrefsTestOpenBtn">
+        <ButtonText>Open Shared Prefs Tester</ButtonText>
+      </Button>
+
       <Prompt.Outer control={prompt}>
         <Prompt.TitleText>This is a prompt</Prompt.TitleText>
         <Prompt.DescriptionText>