From 739ed42d386c85ea1ad15e62044814f3cfc49a68 Mon Sep 17 00:00:00 2001
From: Paul Frazee <pfrazee@gmail.com>
Date: Tue, 25 Mar 2025 17:58:54 -0700
Subject: [PATCH] Add 'the lab' settings screen

---
 bskyweb/cmd/bskyweb/server.go              |  1 +
 src/Navigation.tsx                         |  9 +++++
 src/lib/routes/types.ts                    |  1 +
 src/routes.ts                              |  1 +
 src/screens/Settings/LabSettings/index.tsx | 47 ++++++++++++++++++++++
 src/screens/Settings/Settings.tsx          |  6 +++
 6 files changed, 65 insertions(+)
 create mode 100644 src/screens/Settings/LabSettings/index.tsx

diff --git a/bskyweb/cmd/bskyweb/server.go b/bskyweb/cmd/bskyweb/server.go
index 73fa710195..6aafc1c5de 100644
--- a/bskyweb/cmd/bskyweb/server.go
+++ b/bskyweb/cmd/bskyweb/server.go
@@ -277,6 +277,7 @@ func serve(cctx *cli.Context) error {
 	e.GET("/settings/content-and-media", server.WebGeneric)
 	e.GET("/settings/about", server.WebGeneric)
 	e.GET("/settings/app-icon", server.WebGeneric)
+	e.GET("/settings/lab", server.WebGeneric)
 	e.GET("/sys/debug", server.WebGeneric)
 	e.GET("/sys/debug-mod", server.WebGeneric)
 	e.GET("/sys/log", server.WebGeneric)
diff --git a/src/Navigation.tsx b/src/Navigation.tsx
index 807fd92e5b..db704fdbe1 100644
--- a/src/Navigation.tsx
+++ b/src/Navigation.tsx
@@ -83,6 +83,7 @@ import {ProfileFollowsScreen} from '#/screens/Profile/ProfileFollows'
 import {ProfileLabelerLikedByScreen} from '#/screens/Profile/ProfileLabelerLikedBy'
 import {AppearanceSettingsScreen} from '#/screens/Settings/AppearanceSettings'
 import {AppIconSettingsScreen} from '#/screens/Settings/AppIconSettings'
+import {LabSettingsScreen} from '#/screens/Settings/LabSettings'
 import {NotificationSettingsScreen} from '#/screens/Settings/NotificationSettings'
 import {
   StarterPackScreen,
@@ -392,6 +393,14 @@ function commonScreens(Stack: typeof HomeTab, unreadCountLabel?: string) {
           requireAuth: true,
         }}
       />
+      <Stack.Screen
+        name="LabSettings"
+        getComponent={() => LabSettingsScreen}
+        options={{
+          title: title(msg`The Lab`),
+          requireAuth: true,
+        }}
+      />
       <Stack.Screen
         name="Hashtag"
         getComponent={() => HashtagScreen}
diff --git a/src/lib/routes/types.ts b/src/lib/routes/types.ts
index 0e38c92627..7b77b042ff 100644
--- a/src/lib/routes/types.ts
+++ b/src/lib/routes/types.ts
@@ -53,6 +53,7 @@ export type CommonNavigatorParams = {
   ContentAndMediaSettings: undefined
   AboutSettings: undefined
   AppIconSettings: undefined
+  LabSettings: undefined
   Search: {q?: string}
   Hashtag: {tag: string; author?: string}
   Topic: {topic: string}
diff --git a/src/routes.ts b/src/routes.ts
index b6a11acbf7..1c844123e7 100644
--- a/src/routes.ts
+++ b/src/routes.ts
@@ -47,6 +47,7 @@ export const router = new Router({
   ContentAndMediaSettings: '/settings/content-and-media',
   AboutSettings: '/settings/about',
   AppIconSettings: '/settings/app-icon',
+  LabSettings: '/settings/lab',
   // support
   Support: '/support',
   PrivacyPolicy: '/support/privacy',
diff --git a/src/screens/Settings/LabSettings/index.tsx b/src/screens/Settings/LabSettings/index.tsx
new file mode 100644
index 0000000000..2be183ce37
--- /dev/null
+++ b/src/screens/Settings/LabSettings/index.tsx
@@ -0,0 +1,47 @@
+import {useState} from 'react'
+import {Alert, View} from 'react-native'
+import {msg, Trans} from '@lingui/macro'
+import {useLingui} from '@lingui/react'
+import {NativeStackScreenProps} from '@react-navigation/native-stack'
+
+import {PressableScale} from '#/lib/custom-animations/PressableScale'
+import {CommonNavigatorParams} from '#/lib/routes/types'
+import {useGate} from '#/lib/statsig/statsig'
+import {atoms as a, useTheme} from '#/alf'
+import * as Toggle from '#/components/forms/Toggle'
+import * as Layout from '#/components/Layout'
+import {Text} from '#/components/Typography'
+
+type Props = NativeStackScreenProps<CommonNavigatorParams, 'LabSettings'>
+export function LabSettingsScreen({}: Props) {
+  const t = useTheme()
+  const {_} = useLingui()
+  const gate = useGate()
+
+  return (
+    <Layout.Screen>
+      <Layout.Header.Outer>
+        <Layout.Header.BackButton />
+        <Layout.Header.Content>
+          <Layout.Header.TitleText>
+            <Trans>The Lab</Trans>
+          </Layout.Header.TitleText>
+        </Layout.Header.Content>
+        <Layout.Header.Slot />
+      </Layout.Header.Outer>
+
+      <Layout.Content contentContainerStyle={[a.p_lg]}>
+        <Text
+          style={[
+            a.text_md,
+            a.mt_xl,
+            a.mb_sm,
+            a.font_bold,
+            t.atoms.text_contrast_medium,
+          ]}>
+          <Trans>The Lab (TODO)</Trans>
+        </Text>
+      </Layout.Content>
+    </Layout.Screen>
+  )
+}
diff --git a/src/screens/Settings/Settings.tsx b/src/screens/Settings/Settings.tsx
index b8cdfdcb41..f485ae5cf7 100644
--- a/src/screens/Settings/Settings.tsx
+++ b/src/screens/Settings/Settings.tsx
@@ -202,6 +202,12 @@ export function SettingsScreen({}: Props) {
               <Trans>Languages</Trans>
             </SettingsList.ItemText>
           </SettingsList.LinkItem>
+          <SettingsList.LinkItem to="/settings/lab" label={_(msg`The Lab`)}>
+            <SettingsList.ItemIcon icon={EarthIcon} />
+            <SettingsList.ItemText>
+              <Trans>The Lab</Trans>
+            </SettingsList.ItemText>
+          </SettingsList.LinkItem>
           <SettingsList.PressableItem
             onPress={() => Linking.openURL(HELP_DESK_URL)}
             label={_(msg`Help`)}