Add menu to quick switch to current logged-in instance

src/pages/account-statuses.jsx

@@ -57,6 +57,7 @@ function AccountStatuses() {
   const tagged = searchParams.get('tagged');
   const media = !!searchParams.get('media');
   const { masto, instance, authenticated } = api({ instance: params.instance });
+  const { masto: currentMasto, instance: currentInstance } = api();
   const accountStatusesIterator = useRef();
 
   const allSearchParams = [month, excludeReplies, excludeBoosts, tagged, media];
@@ -67,8 +68,8 @@ function AccountStatuses() {
   }, allSearchParams);
 
   const sameCurrentInstance = useMemo(
-    () => instance === api().instance,
+    () => instance === currentInstance,
-    [instance],
+    [instance, currentInstance],
   );
   const [searchEnabled, setSearchEnabled] = useState(false);
   useEffect(() => {
@@ -516,6 +517,29 @@ function AccountStatuses() {
               Switch to account's instance (<b>{accountInstance}</b>)
             </small>
           </MenuItem>
+          {!sameCurrentInstance && (
+            <MenuItem
+              onClick={() => {
+                (async () => {
+                  try {
+                    const acc = await currentMasto.v1.accounts.lookup({
+                      acct: account.acct + '@' + instance,
+                    });
+                    const { id } = acc;
+                    location.hash = `/${currentInstance}/a/${id}`;
+                  } catch (e) {
+                    console.error(e);
+                    alert('Unable to fetch account info');
+                  }
+                })();
+              }}
+            >
+              <Icon icon="transfer" />{' '}
+              <small class="menu-double-lines">
+                Switch to my instance (<b>{currentInstance}</b>)
+              </small>
+            </MenuItem>
+          )}
         </Menu2>
       }
     />

src/pages/hashtag.jsx

@@ -42,7 +42,11 @@ function Hashtags({ media: mediaView, columnMode, ...props }) {
   const { masto, instance, authenticated } = api({
     instance: props?.instance || params.instance,
   });
-  const { authenticated: currentAuthenticated } = api();
+  const {
+    masto: currentMasto,
+    instance: currentInstance,
+    authenticated: currentAuthenticated,
+  } = api();
   const hashtagTitle = hashtags.map((t) => `#${t}`).join(' ');
   const hashtagPostTitle = media ? ` (Media only)` : '';
   const title = instance
@@ -376,6 +380,20 @@ function Hashtags({ media: mediaView, columnMode, ...props }) {
           >
             <Icon icon="bus" /> <span>Go to another instance…</span>
           </MenuItem>
+          {currentInstance !== instance && (
+            <MenuItem
+              onClick={() => {
+                location.hash = `/${currentInstance}/t/${hashtags.join(
+                  '+',
+                )}${linkParams}`;
+              }}
+            >
+              <Icon icon="bus" />{' '}
+              <small class="menu-double-lines">
+                Go to my instance (<b>{currentInstance}</b>)
+              </small>
+            </MenuItem>
+          )}
         </Menu2>
       }
     />

src/pages/public.jsx

@@ -21,6 +21,7 @@ function Public({ local, columnMode, ...props }) {
   const { masto, instance } = api({
     instance: props?.instance || params.instance,
   });
+  const { masto: currentMasto, instance: currentInstance } = api();
   const title = `${isLocal ? 'Local' : 'Federated'} timeline (${instance})`;
   useTitle(title, isLocal ? `/:instance?/p/l` : `/:instance?/p`);
   // const navigate = useNavigate();
@@ -138,6 +139,20 @@ function Public({ local, columnMode, ...props }) {
           >
             <Icon icon="bus" /> <span>Go to another instance…</span>
           </MenuItem>
+          {currentInstance !== instance && (
+            <MenuItem
+              onClick={() => {
+                location.hash = isLocal
+                  ? `/${currentInstance}/p/l`
+                  : `/${currentInstance}/p`;
+              }}
+            >
+              <Icon icon="bus" />{' '}
+              <small class="menu-double-lines">
+                Go to my instance (<b>{currentInstance}</b>)
+              </small>
+            </MenuItem>
+          )}
         </Menu2>
       }
     />

src/pages/trending.jsx

@@ -38,6 +38,7 @@ function Trending({ columnMode, ...props }) {
   const { masto, instance } = api({
     instance: props?.instance || params.instance,
   });
+  const { masto: currentMasto, instance: currentInstance } = api();
   const title = `Trending (${instance})`;
   useTitle(title, `/:instance?/trending`);
   // const navigate = useNavigate();
@@ -291,6 +292,18 @@ function Trending({ columnMode, ...props }) {
           >
             <Icon icon="bus" /> <span>Go to another instance…</span>
           </MenuItem>
+          {currentInstance !== instance && (
+            <MenuItem
+              onClick={() => {
+                location.hash = `/${currentInstance}/trending`;
+              }}
+            >
+              <Icon icon="bus" />{' '}
+              <small class="menu-double-lines">
+                Go to my instance (<b>{currentInstance}</b>)
+              </small>
+            </MenuItem>
+          )}
         </Menu2>
       }
     />