Add screens and routes

bskyweb/cmd/bskyweb/server.go

@@ -280,6 +280,10 @@ func serve(cctx *cli.Context) error {
 	e.GET("/profile/:handleOrDID/feed/:rkey", server.WebGeneric)
 	e.GET("/profile/:handleOrDID/feed/:rkey/liked-by", server.WebGeneric)
 	e.GET("/profile/:handleOrDID/labeler/liked-by", server.WebGeneric)
+	e.GET("/profile/:handleOrDID/vouches", server.WebGeneric)
+	e.GET("/profile/:handleOrDID/vouches/create", server.WebGeneric)
+	e.GET("/profile/:handleOrDID/vouches/issued", server.WebGeneric)
+	e.GET("/profile/:handleOrDID/vouches/received", server.WebGeneric)
 
 	// profile RSS feed (DID not handle)
 	e.GET("/profile/:ident/rss", server.WebProfileRSS)

src/Navigation.tsx

@@ -78,6 +78,10 @@ import {ProfileFeedScreen} from '#/screens/Profile/ProfileFeed'
 import {ProfileFollowersScreen} from '#/screens/Profile/ProfileFollowers'
 import {ProfileFollowsScreen} from '#/screens/Profile/ProfileFollows'
 import {ProfileLabelerLikedByScreen} from '#/screens/Profile/ProfileLabelerLikedBy'
+import {Screen as ProfileVouches} from '#/screens/Profile/Vouches'
+import {Screen as ProfileVouchesCreate} from '#/screens/Profile/Vouches/Create'
+import {Screen as ProfileVouchesIssued} from '#/screens/Profile/Vouches/Issued'
+import {Screen as ProfileVouchesReceived} from '#/screens/Profile/Vouches/Received'
 import {AppearanceSettingsScreen} from '#/screens/Settings/AppearanceSettings'
 import {AppIconSettingsScreen} from '#/screens/Settings/AppIconSettings'
 import {NotificationSettingsScreen} from '#/screens/Settings/NotificationSettings'
@@ -239,6 +243,26 @@ function commonScreens(Stack: typeof HomeTab, unreadCountLabel?: string) {
         getComponent={() => ProfileLabelerLikedByScreen}
         options={{title: title(msg`Liked by`)}}
       />
+      <Stack.Screen
+        name="ProfileVouches"
+        getComponent={() => ProfileVouches}
+        options={{title: title(msg`Vouches`)}}
+      />
+      <Stack.Screen
+        name="ProfileVouchesCreate"
+        getComponent={() => ProfileVouchesCreate}
+        options={{title: title(msg`Create Vouch`)}}
+      />
+      <Stack.Screen
+        name="ProfileVouchesIssued"
+        getComponent={() => ProfileVouchesIssued}
+        options={{title: title(msg`Issued Vouch`)}}
+      />
+      <Stack.Screen
+        name="ProfileVouchesReceived"
+        getComponent={() => ProfileVouchesReceived}
+        options={{title: title(msg`My Vouches`)}}
+      />
       <Stack.Screen
         name="Debug"
         getComponent={() => Storybook}

src/lib/constants.ts

@@ -32,6 +32,8 @@ export const DISCOVER_DEBUG_DIDS: Record<string, true> = {
   'did:plc:3jpt2mvvsumj2r7eqk4gzzjz': true, // esb.lol
   'did:plc:vjug55kidv6sye7ykr5faxxn': true, // emilyliu.me
 }
+export const isInternalUser = (did?: string) =>
+  did ? DISCOVER_DEBUG_DIDS[did] : false
 
 const BASE_FEEDBACK_FORM_URL = `${HELP_DESK_URL}/requests/new`
 export function FEEDBACK_FORM_URL({

src/lib/routes/types.ts

@@ -23,6 +23,10 @@ export type CommonNavigatorParams = {
   ProfileFeed: {name: string; rkey: string}
   ProfileFeedLikedBy: {name: string; rkey: string}
   ProfileLabelerLikedBy: {name: string}
+  ProfileVouches: {name: string}
+  ProfileVouchesCreate: {name: string}
+  ProfileVouchesIssued: {name: string}
+  ProfileVouchesReceived: {name: string}
   Debug: undefined
   DebugMod: undefined
   SharedPreferencesTester: undefined

src/routes.ts

@@ -26,6 +26,11 @@ export const router = new Router({
   ProfileFeed: '/profile/:name/feed/:rkey',
   ProfileFeedLikedBy: '/profile/:name/feed/:rkey/liked-by',
   ProfileLabelerLikedBy: '/profile/:name/labeler/liked-by',
+  ProfileVouches: '/profile/:name/vouches',
+  ProfileVouchesCreate: '/profile/:name/vouches/create',
+  ProfileVouchesIssued: '/profile/:name/vouches/issued',
+  ProfileVouchesReceived: '/profile/:name/vouches/received',
+
   // debug
   Debug: '/sys/debug',
   DebugMod: '/sys/debug-mod',

src/screens/Profile/Vouches/Create/index.tsx

@@ -0,0 +1,24 @@
+import {Trans} from '@lingui/macro'
+
+import * as Layout from '#/components/Layout'
+import {Text} from '#/components/Typography'
+
+export function Screen() {
+  return (
+    <Layout.Screen>
+      <Layout.Header.Outer>
+        <Layout.Header.BackButton />
+        <Layout.Header.Content>
+          <Layout.Header.TitleText>
+            <Trans>Create Vouch</Trans>
+          </Layout.Header.TitleText>
+        </Layout.Header.Content>
+        <Layout.Header.Slot />
+      </Layout.Header.Outer>
+
+      <Layout.Content>
+        <Text>Create</Text>
+      </Layout.Content>
+    </Layout.Screen>
+  )
+}

src/screens/Profile/Vouches/Issued/index.tsx

@@ -0,0 +1,24 @@
+import {Trans} from '@lingui/macro'
+
+import * as Layout from '#/components/Layout'
+import {Text} from '#/components/Typography'
+
+export function Screen() {
+  return (
+    <Layout.Screen>
+      <Layout.Header.Outer>
+        <Layout.Header.BackButton />
+        <Layout.Header.Content>
+          <Layout.Header.TitleText>
+            <Trans>Issued Vouches</Trans>
+          </Layout.Header.TitleText>
+        </Layout.Header.Content>
+        <Layout.Header.Slot />
+      </Layout.Header.Outer>
+
+      <Layout.Content>
+        <Text>Create</Text>
+      </Layout.Content>
+    </Layout.Screen>
+  )
+}

src/screens/Profile/Vouches/Received/index.tsx

@@ -0,0 +1,24 @@
+import {Trans} from '@lingui/macro'
+
+import * as Layout from '#/components/Layout'
+import {Text} from '#/components/Typography'
+
+export function Screen() {
+  return (
+    <Layout.Screen>
+      <Layout.Header.Outer>
+        <Layout.Header.BackButton />
+        <Layout.Header.Content>
+          <Layout.Header.TitleText>
+            <Trans>My Vouches</Trans>
+          </Layout.Header.TitleText>
+        </Layout.Header.Content>
+        <Layout.Header.Slot />
+      </Layout.Header.Outer>
+
+      <Layout.Content>
+        <Text>Mine</Text>
+      </Layout.Content>
+    </Layout.Screen>
+  )
+}

src/screens/Profile/Vouches/index.tsx

@@ -0,0 +1,24 @@
+import {Trans} from '@lingui/macro'
+
+import * as Layout from '#/components/Layout'
+import {Text} from '#/components/Typography'
+
+export function Screen() {
+  return (
+    <Layout.Screen>
+      <Layout.Header.Outer>
+        <Layout.Header.BackButton />
+        <Layout.Header.Content>
+          <Layout.Header.TitleText>
+            <Trans>Vouches</Trans>
+          </Layout.Header.TitleText>
+        </Layout.Header.Content>
+        <Layout.Header.Slot />
+      </Layout.Header.Outer>
+
+      <Layout.Content>
+        <Text>Vouches</Text>
+      </Layout.Content>
+    </Layout.Screen>
+  )
+}

src/view/com/profile/ProfileMenu.tsx

@@ -4,7 +4,8 @@ import {msg, Trans} from '@lingui/macro'
 import {useLingui} from '@lingui/react'
 import {useQueryClient} from '@tanstack/react-query'
 
-import {HITSLOP_20} from '#/lib/constants'
+import {HITSLOP_20, isInternalUser} from '#/lib/constants'
+import {useNavigationDeduped} from '#/lib/hooks/useNavigationDeduped'
 import {makeProfileLink} from '#/lib/routes/links'
 import {shareUrl} from '#/lib/sharing'
 import {toShareUrl} from '#/lib/strings/url-helpers'
@@ -52,6 +53,7 @@ let ProfileMenu = ({
   const isBlocked = profile.viewer?.blocking || profile.viewer?.blockedBy
   const isFollowingBlockedAccount = isFollowing && isBlocked
   const isLabelerAndNotBlocked = !!profile.associated?.labeler && !isBlocked
+  const navigation = useNavigationDeduped()
 
   const [queueMute, queueUnmute] = useProfileMuteMutationQueue(profile)
   const [queueBlock, queueUnblock] = useProfileBlockMutationQueue(profile)
@@ -80,6 +82,10 @@ let ProfileMenu = ({
     shareUrl(toShareUrl(makeProfileLink(profile)))
   }, [profile])
 
+  const onPressManageVouches = React.useCallback(() => {
+    navigation.navigate('ProfileVouches', {name: profile.handle})
+  }, [navigation, profile.handle])
+
   const onPressAddRemoveLists = React.useCallback(() => {
     openModal({
       name: 'user-add-remove-lists',
@@ -247,6 +253,16 @@ let ProfileMenu = ({
                   </Menu.ItemText>
                   <Menu.ItemIcon icon={List} />
                 </Menu.Item>
+                {isInternalUser(currentAccount?.did) && (
+                  <Menu.Item
+                    label={_(msg`Manage my vouches`)}
+                    onPress={onPressManageVouches}>
+                    <Menu.ItemText>
+                      <Trans>Manage vouches</Trans>
+                    </Menu.ItemText>
+                    <Menu.ItemIcon icon={List} />
+                  </Menu.Item>
+                )}
                 {!isSelf && (
                   <>
                     {!profile.viewer?.blocking &&