From 6913c1e5ee35e7a294482e9f18693df92ca80c12 Mon Sep 17 00:00:00 2001
From: Munkherdene <muunuu960@gmail.com>
Date: Sat, 22 Aug 2026 21:33:14 +0800
Subject: [PATCH] feat(web): desktop layout (wider container + 2-col dashboard)
 + redirect-loop fix + mn string
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- Shell content widens to max-w-6xl on desktop (was phone-strip max-w-2xl)
- Dashboard reflows into a 2-col grid on desktop instead of stretching
- On 401, clear session cookie via logout before redirect (prevents /login<->/home loop when cookie outlives server session)
- Profile 'Subscriptions' -> 'Захиалга'
---
 src/api/client.ts                   | 8 +++++++-
 src/app/(app)/layout.tsx            | 2 +-
 src/features/home/DashboardView.tsx | 2 ++
 src/features/profile/strings.ts     | 2 +-
 4 files changed, 11 insertions(+), 3 deletions(-)

diff --git a/src/api/client.ts b/src/api/client.ts
index 04aa0cf..21f580b 100644
--- a/src/api/client.ts
+++ b/src/api/client.ts
@@ -17,7 +17,13 @@ async function req(method: string, path: string, body?: unknown): Promise<unknow
     body: body === undefined ? undefined : JSON.stringify(body),
   });
   if (res.status === 401) {
-    if (typeof window !== "undefined") window.location.href = "/login";
+    // Clear the (now-stale) session cookie before redirecting. Otherwise the
+    // middleware bounces /login → /home on mere cookie presence, and a
+    // server-invalidated-but-not-expired session produces an infinite loop.
+    if (typeof window !== "undefined") {
+      await fetch("/api/auth/logout", { method: "POST", credentials: "same-origin" }).catch(() => {});
+      window.location.href = "/login";
+    }
     throw new ApiError(401, "unauthorized");
   }
   if (!res.ok) throw new ApiError(res.status, await res.text());
diff --git a/src/app/(app)/layout.tsx b/src/app/(app)/layout.tsx
index 8292f93..2a89162 100644
--- a/src/app/(app)/layout.tsx
+++ b/src/app/(app)/layout.tsx
@@ -11,7 +11,7 @@ export default function AppLayout({ children }: { children: ReactNode }) {
     <AppQueryProvider>
       <div className="md:flex md:min-h-screen">
         <AppNav />
-        <main className="mx-auto w-full max-w-2xl flex-1 px-4 pb-24 pt-6 md:pb-6 md:pt-8">
+        <main className="mx-auto w-full max-w-2xl flex-1 px-4 pb-24 pt-6 md:max-w-4xl md:px-8 md:pb-10 md:pt-10 lg:max-w-6xl lg:px-12">
           {children}
         </main>
       </div>
diff --git a/src/features/home/DashboardView.tsx b/src/features/home/DashboardView.tsx
index 2047fd9..6ae8c3c 100644
--- a/src/features/home/DashboardView.tsx
+++ b/src/features/home/DashboardView.tsx
@@ -73,6 +73,7 @@ export function DashboardView() {
         <HideAmountsToggle label={s.hideAmounts} />
       </header>
 
+      <div className="grid grid-cols-1 gap-[18px] md:grid-cols-2 md:items-start md:gap-5">
       {/* Safe-to-spend hero (green): how much is left to spend this month
           after committed obligations and what's already been spent. */}
       <Link
@@ -218,6 +219,7 @@ export function DashboardView() {
           ))}
         </Card>
       </div>
+      </div>
     </div>
   );
 }
diff --git a/src/features/profile/strings.ts b/src/features/profile/strings.ts
index 068b059..0b7b2ea 100644
--- a/src/features/profile/strings.ts
+++ b/src/features/profile/strings.ts
@@ -14,7 +14,7 @@ export const profileStrings = {
   menu: {
     settings: "Тохиргоо",
     categories: "Ангилал",
-    subscriptions: "Subscriptions",
+    subscriptions: "Захиалга",
   },
   display: {
     title: "Дэлгэц ба нууцлал",