From b402662c09b18eca1f573abbdf5ac635a7f377f1 Mon Sep 17 00:00:00 2001
From: Manav Rathi <manav@mrmr.io>
Date: Thu, 23 May 2024 16:11:30 +0530
Subject: [PATCH] [desktop] Allow refreshing when inside an album

Steps to reproduce on Linux:

- Open an album
- Open a photo
- View > Reload

Causes a 404 page to be displayed.
---
 web/apps/auth/src/pages/404.tsx        | 10 ++-----
 web/apps/photos/src/pages/404.tsx      | 10 ++-----
 web/packages/shared/next/pages/404.tsx | 41 ++++++++++++++++----------
 3 files changed, 30 insertions(+), 31 deletions(-)

diff --git a/web/apps/auth/src/pages/404.tsx b/web/apps/auth/src/pages/404.tsx
index 6cca72b77..dcd621c70 100644
--- a/web/apps/auth/src/pages/404.tsx
+++ b/web/apps/auth/src/pages/404.tsx
@@ -1,9 +1,3 @@
-import { APPS } from "@ente/shared/apps/constants";
-import NotFoundPage from "@ente/shared/next/pages/404";
-import { AppContext } from "pages/_app";
-import { useContext } from "react";
+import Page from "@ente/shared/next/pages/404";
 
-export default function NotFound() {
-    const appContext = useContext(AppContext);
-    return <NotFoundPage appContext={appContext} appName={APPS.AUTH} />;
-}
+export default Page;
diff --git a/web/apps/photos/src/pages/404.tsx b/web/apps/photos/src/pages/404.tsx
index 6cca72b77..dcd621c70 100644
--- a/web/apps/photos/src/pages/404.tsx
+++ b/web/apps/photos/src/pages/404.tsx
@@ -1,9 +1,3 @@
-import { APPS } from "@ente/shared/apps/constants";
-import NotFoundPage from "@ente/shared/next/pages/404";
-import { AppContext } from "pages/_app";
-import { useContext } from "react";
+import Page from "@ente/shared/next/pages/404";
 
-export default function NotFound() {
-    const appContext = useContext(AppContext);
-    return <NotFoundPage appContext={appContext} appName={APPS.AUTH} />;
-}
+export default Page;
diff --git a/web/packages/shared/next/pages/404.tsx b/web/packages/shared/next/pages/404.tsx
index 7cc4a6ff0..8e6e06cfa 100644
--- a/web/packages/shared/next/pages/404.tsx
+++ b/web/packages/shared/next/pages/404.tsx
@@ -1,19 +1,30 @@
-import { VerticallyCentered } from "@ente/shared/components/Container";
-import { t } from "i18next";
-import { useEffect, useState } from "react";
+import { PAGES } from "@ente/accounts/constants/pages";
+import { useRouter } from "next/router";
+import { useEffect } from "react";
 
-import { PageProps } from "@ente/shared/apps/types";
-import EnteSpinner from "@ente/shared/components/EnteSpinner";
+const Page: React.FC = () => {
+    // [Note: 404 back to home]
+    //
+    // In the desktop app, if the user presses the refresh button when the URL
+    // has an attached query parameter, e.g. "/gallery?collectionId=xxx", then
+    // the code in next-electron-server blindly appends the html extension to
+    // this URL, resulting in it trying to open "gallery?collectionId=xxx.html"
+    // instead of "gallery.html". It doesn't find such a file, causing it open
+    // "404.html" (the static file generated from this file).
+    //
+    // One way around is to patch the package, e.g.
+    // https://github.com/ente-io/next-electron-server/pull/1/files
+    //
+    // However, redirecting back to the root is arguably a better fallback in
+    // all cases (even when running on our website), since our app is a SPA.
+
+    const router = useRouter();
 
-export default function NotFound({ appContext }: PageProps) {
-    const [loading, setLoading] = useState(true);
     useEffect(() => {
-        appContext.showNavBar(true);
-        setLoading(false);
+        router.push(PAGES.ROOT);
     }, []);
-    return (
-        <VerticallyCentered>
-            {loading ? <EnteSpinner /> : t("NOT_FOUND")}
-        </VerticallyCentered>
-    );
-}
+
+    return <></>;
+};
+
+export default Page;