From b2f111a4e76579f0b474c165ed7d0d5afb58e124 Mon Sep 17 00:00:00 2001
From: codytseng <codytseng98@gmail.com>
Date: Fri, 17 Jan 2025 23:11:27 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20=F0=9F=90=9B?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/PageManager.tsx                             |  2 +-
 src/components/FeedSwitcher/index.tsx           |  2 +-
 src/lib/link.ts                                 |  4 +++-
 src/pages/secondary/RelaySettingsPage/index.tsx | 15 ++++++++++++++-
 4 files changed, 19 insertions(+), 4 deletions(-)

diff --git a/src/PageManager.tsx b/src/PageManager.tsx
index 152f5227..559e5cbc 100644
--- a/src/PageManager.tsx
+++ b/src/PageManager.tsx
@@ -275,7 +275,7 @@ function isCurrentPage(stack: TStackItem[], url: string) {
 }
 
 function findAndCreateComponent(url: string, index: number) {
-  const path = url.split('?')[0]
+  const path = url.split('?')[0].split('#')[0]
   for (const { matcher, element } of routes) {
     const match = matcher(path)
     if (!match) continue
diff --git a/src/components/FeedSwitcher/index.tsx b/src/components/FeedSwitcher/index.tsx
index dbd4842f..3539e61f 100644
--- a/src/components/FeedSwitcher/index.tsx
+++ b/src/components/FeedSwitcher/index.tsx
@@ -31,7 +31,7 @@ export default function FeedSwitcher({ close }: { close?: () => void }) {
         <div className="flex justify-between px-2">
           <div className="text-muted-foreground text-sm font-semibold">{t('relay sets')}</div>
           <SecondaryPageLink
-            to={toRelaySettings()}
+            to={toRelaySettings('relay-sets')}
             className="text-highlight text-sm font-semibold"
             onClick={() => close?.()}
           >
diff --git a/src/lib/link.ts b/src/lib/link.ts
index 59fcd0e9..c3fcc80a 100644
--- a/src/lib/link.ts
+++ b/src/lib/link.ts
@@ -32,7 +32,9 @@ export const toOthersRelaySettings = (pubkey: string) => {
   const npub = nip19.npubEncode(pubkey)
   return `/users/${npub}/relays`
 }
-export const toRelaySettings = () => '/relay-settings'
+export const toRelaySettings = (tag?: 'mailbox' | 'relay-sets') => {
+  return '/relay-settings' + (tag === 'relay-sets' ? '#relay-sets' : '')
+}
 export const toSettings = () => '/settings'
 export const toProfileEditor = () => '/profile-editor'
 export const toRelay = (url: string) => `/relays/${encodeURIComponent(url)}`
diff --git a/src/pages/secondary/RelaySettingsPage/index.tsx b/src/pages/secondary/RelaySettingsPage/index.tsx
index 119a193c..b39be0c2 100644
--- a/src/pages/secondary/RelaySettingsPage/index.tsx
+++ b/src/pages/secondary/RelaySettingsPage/index.tsx
@@ -2,14 +2,27 @@ import MailboxSetting from '@/components/MailboxSetting'
 import RelaySetsSetting from '@/components/RelaySetsSetting'
 import { Tabs, TabsContent, TabsList, TabsTrigger } from '@/components/ui/tabs'
 import SecondaryPageLayout from '@/layouts/SecondaryPageLayout'
+import { useEffect, useState } from 'react'
 import { useTranslation } from 'react-i18next'
 
 export default function RelaySettingsPage({ index }: { index?: number }) {
   const { t } = useTranslation()
+  const [tabValue, setTabValue] = useState('mailbox')
+
+  useEffect(() => {
+    if (window.location.hash === '#relay-sets') {
+      setTabValue('relay-sets')
+    }
+  }, [])
 
   return (
     <SecondaryPageLayout index={index} title={t('Relay settings')}>
-      <Tabs defaultValue="mailbox" className="px-4 space-y-4">
+      <Tabs
+        defaultValue="mailbox"
+        value={tabValue}
+        onValueChange={setTabValue}
+        className="px-4 space-y-4"
+      >
         <TabsList>
           <TabsTrigger value="mailbox">{t('Read & Write Relays')}</TabsTrigger>
           <TabsTrigger value="relay-sets">{t('Relay Sets')}</TabsTrigger>