about summary refs log tree commit diff
path: root/src/view/shell/desktop
diff options
context:
space:
mode:
Diffstat (limited to 'src/view/shell/desktop')
-rw-r--r--src/view/shell/desktop/Feeds.tsx19
-rw-r--r--src/view/shell/desktop/LeftNav.tsx52
-rw-r--r--src/view/shell/desktop/RightNav.tsx6
-rw-r--r--src/view/shell/desktop/SidebarTrendingTopics.tsx1
4 files changed, 74 insertions, 4 deletions
diff --git a/src/view/shell/desktop/Feeds.tsx b/src/view/shell/desktop/Feeds.tsx
index 7a56722cc..441b35e3b 100644
--- a/src/view/shell/desktop/Feeds.tsx
+++ b/src/view/shell/desktop/Feeds.tsx
@@ -4,7 +4,7 @@ import {useLingui} from '@lingui/react'
 import {useNavigation, useNavigationState} from '@react-navigation/native'
 
 import {getCurrentRoute} from '#/lib/routes/helpers'
-import {NavigationProp} from '#/lib/routes/types'
+import {type NavigationProp} from '#/lib/routes/types'
 import {emitSoftReset} from '#/state/events'
 import {usePinnedFeedsInfos} from '#/state/queries/feed'
 import {useSelectedFeed, useSetSelectedFeed} from '#/state/shell/selected-feed'
@@ -30,7 +30,8 @@ export function DesktopFeeds() {
       <View
         style={[
           {
-            gap: 12,
+            gap: 10,
+            paddingVertical: 2,
           },
         ]}>
         {Array(5)
@@ -66,6 +67,7 @@ export function DesktopFeeds() {
            * height of the screen with lots of feeds.
            */
           paddingVertical: 2,
+          marginHorizontal: -2,
           overflowY: 'auto',
         }),
       ]}>
@@ -90,6 +92,10 @@ export function DesktopFeeds() {
               current
                 ? [a.font_bold, t.atoms.text]
                 : [t.atoms.text_contrast_medium],
+              web({
+                marginHorizontal: 2,
+                width: 'calc(100% - 4px)',
+              }),
             ]}
             numberOfLines={1}>
             {feedInfo.displayName}
@@ -100,7 +106,14 @@ export function DesktopFeeds() {
       <InlineLinkText
         to="/feeds"
         label={_(msg`More feeds`)}
-        style={[a.text_md, a.leading_snug]}
+        style={[
+          a.text_md,
+          a.leading_snug,
+          web({
+            marginHorizontal: 2,
+            width: 'calc(100% - 4px)',
+          }),
+        ]}
         numberOfLines={1}>
         {_(msg`More feeds`)}
       </InlineLinkText>
diff --git a/src/view/shell/desktop/LeftNav.tsx b/src/view/shell/desktop/LeftNav.tsx
index aa18f9b70..cf1ff8425 100644
--- a/src/view/shell/desktop/LeftNav.tsx
+++ b/src/view/shell/desktop/LeftNav.tsx
@@ -236,6 +236,7 @@ function SwitchMenuItems({
     setShowLoggedOut(true)
     closeEverything()
   }
+
   return (
     <Menu.Outer>
       {accounts && accounts.length > 0 && (
@@ -255,6 +256,7 @@ function SwitchMenuItems({
           <Menu.Divider />
         </>
       )}
+      <SwitcherMenuProfileLink />
       <Menu.Item
         label={_(msg`Add another account`)}
         onPress={onAddAnotherAccount}>
@@ -273,6 +275,56 @@ function SwitchMenuItems({
   )
 }
 
+function SwitcherMenuProfileLink() {
+  const {_} = useLingui()
+  const {currentAccount} = useSession()
+  const navigation = useNavigation()
+  const context = Menu.useMenuContext()
+  const profileLink = currentAccount ? makeProfileLink(currentAccount) : '/'
+  const [pathName] = useMemo(() => router.matchPath(profileLink), [profileLink])
+  const currentRouteInfo = useNavigationState(state => {
+    if (!state) {
+      return {name: 'Home'}
+    }
+    return getCurrentRoute(state)
+  })
+  let isCurrent =
+    currentRouteInfo.name === 'Profile'
+      ? isTab(currentRouteInfo.name, pathName) &&
+        (currentRouteInfo.params as CommonNavigatorParams['Profile']).name ===
+          currentAccount?.handle
+      : isTab(currentRouteInfo.name, pathName)
+  const onProfilePress = useCallback(
+    (e: React.MouseEvent<HTMLAnchorElement, MouseEvent>) => {
+      if (e.ctrlKey || e.metaKey || e.altKey) {
+        return
+      }
+      e.preventDefault()
+      context.control.close()
+      if (isCurrent) {
+        emitSoftReset()
+      } else {
+        const [screen, params] = router.matchPath(profileLink)
+        // @ts-expect-error TODO: type matchPath well enough that it can be plugged into navigation.navigate directly
+        navigation.navigate(screen, params, {pop: true})
+      }
+    },
+    [navigation, profileLink, isCurrent, context],
+  )
+  return (
+    <Menu.Item
+      label={_(msg`Go to profile`)}
+      // @ts-expect-error The function signature differs on web -inb
+      onPress={onProfilePress}
+      href={profileLink}>
+      <Menu.ItemIcon icon={UserCircle} />
+      <Menu.ItemText>
+        <Trans>Go to profile</Trans>
+      </Menu.ItemText>
+    </Menu.Item>
+  )
+}
+
 function SwitchMenuItem({
   account,
   profile,
diff --git a/src/view/shell/desktop/RightNav.tsx b/src/view/shell/desktop/RightNav.tsx
index 26795e0fd..1e000340a 100644
--- a/src/view/shell/desktop/RightNav.tsx
+++ b/src/view/shell/desktop/RightNav.tsx
@@ -65,6 +65,7 @@ export function DesktopRightNav({routeName}: {routeName: string}) {
       style={[
         gutters,
         a.gap_lg,
+        a.pr_2xs,
         web({
           position: 'fixed',
           left: '50%',
@@ -74,7 +75,10 @@ export function DesktopRightNav({routeName}: {routeName: string}) {
             },
             ...a.scrollbar_offset.transform,
           ],
-          width: width + gutters.paddingLeft,
+          /**
+           * Compensate for the right padding above (2px) to retain intended width.
+           */
+          width: width + gutters.paddingLeft + 2,
           maxHeight: '100%',
           overflowY: 'auto',
         }),
diff --git a/src/view/shell/desktop/SidebarTrendingTopics.tsx b/src/view/shell/desktop/SidebarTrendingTopics.tsx
index 6b49f5834..c8ef49ee7 100644
--- a/src/view/shell/desktop/SidebarTrendingTopics.tsx
+++ b/src/view/shell/desktop/SidebarTrendingTopics.tsx
@@ -82,6 +82,7 @@ function Inner() {
                 <TrendingTopicLink
                   key={topic.link}
                   topic={topic}
+                  style={a.rounded_full}
                   onPress={() => {
                     logEvent('trendingTopic:click', {context: 'sidebar'})
                   }}>