From 6d28856f1e7e9fd0742b1e37fce5c69b1ca7d6e9 Mon Sep 17 00:00:00 2001
From: anteqkois <anteqkois.dev@gmail.com>
Date: Thu, 30 May 2024 19:25:07 +0200
Subject: [PATCH] feat(auth): fix issue with ablity to return to protected
 routes after logout

---
 apps/web/app/app/layout.tsx                   |  2 ++
 apps/web/middleware.ts                        |  6 ++---
 .../modules/billing/components/PlanCard.tsx   |  2 +-
 apps/web/modules/user/AuthGuard.tsx           | 22 +++++++++++++++++++
 .../billing/products/products.service.ts      |  2 +-
 5 files changed, 29 insertions(+), 5 deletions(-)
 create mode 100644 apps/web/modules/user/AuthGuard.tsx

diff --git a/apps/web/app/app/layout.tsx b/apps/web/app/app/layout.tsx
index 0bf239ab..fdafaaf8 100644
--- a/apps/web/app/app/layout.tsx
+++ b/apps/web/app/app/layout.tsx
@@ -4,6 +4,7 @@ import { ModeToggle } from '@linkerry/ui-components/client'
 import ReactQueryProvider from '../../libs/reactQueryProvider'
 import { ReachLimitDialog } from '../../modules/billing/components/ReachLimitDialog'
 import { ReachLimitDialogProvider } from '../../modules/billing/useReachLimitDialog'
+import { AuthGuard } from '../../modules/user/AuthGuard'
 import { DesktopMenu } from './components/DesktopMenu'
 import { LiveCharInitializer } from './components/LiveCharInitializer'
 import { MobileMenu } from './components/MobileMenu'
@@ -18,6 +19,7 @@ export default function AuthLayout({ children }: AuthLayoutProps) {
     <div className="">
       <ReactQueryProvider>
         <UserProvider>
+          <AuthGuard />
           <ReachLimitDialogProvider>
             <div className="fixed h-14 top-0 z-40 flex justify-between items-center p-1 py-2 w-full border-b border-border/80 bg-background/95 backdrop-blur supports-[backdrop-filter]:bg-background/60">
               <div className="flex items-center gap-1">
diff --git a/apps/web/middleware.ts b/apps/web/middleware.ts
index 54edb024..f33d2059 100644
--- a/apps/web/middleware.ts
+++ b/apps/web/middleware.ts
@@ -1,6 +1,6 @@
-import { AuthStatus } from '@linkerry/shared/lib/common/auth'
-import { Cookies } from '@linkerry/shared/lib/constants/cookies'
-import { NextRequest, NextResponse } from 'next/server'
+import { AuthStatus } from '@linkerry/shared/lib/common/auth';
+import { Cookies } from '@linkerry/shared/lib/constants/cookies';
+import { NextRequest, NextResponse } from 'next/server';
 
 export function middleware(req: NextRequest) {
   const authStatus = req.cookies.get(Cookies.AUTH_STATUS)
diff --git a/apps/web/modules/billing/components/PlanCard.tsx b/apps/web/modules/billing/components/PlanCard.tsx
index e9a7ed9f..bf1c38e1 100644
--- a/apps/web/modules/billing/components/PlanCard.tsx
+++ b/apps/web/modules/billing/components/PlanCard.tsx
@@ -52,7 +52,7 @@ export const PlanCard = ({ price, product, className, config, onSelectPlan, pric
         <CardDescription>{product.shortDescription}</CardDescription>
       </CardHeader>
       <CardContent>
-        <div className="mb-4 relative w-full h-10">
+        <div className="mb-4 mt-2 relative w-full h-10">
           {priceSlot ? (
             priceSlot
           ) : (
diff --git a/apps/web/modules/user/AuthGuard.tsx b/apps/web/modules/user/AuthGuard.tsx
new file mode 100644
index 00000000..84d10fbb
--- /dev/null
+++ b/apps/web/modules/user/AuthGuard.tsx
@@ -0,0 +1,22 @@
+'use client'
+
+import { AuthStatus } from '@linkerry/shared'
+import { useRouter } from 'next/navigation'
+import { HTMLAttributes, useEffect } from 'react'
+import { useUser } from './useUser'
+
+export interface AuthGuardProps extends HTMLAttributes<HTMLElement> {}
+
+export const AuthGuard = () => {
+  const { authStatus } = useUser()
+  const { push } = useRouter()
+
+  useEffect(() => {
+    if (authStatus === AuthStatus.UNAUTHENTICATED) {
+      console.warn('User unauthenticated')
+      push('/login')
+    }
+  }, [])
+
+  return <></>
+}
diff --git a/libs/nest-core/src/modules/billing/products/products.service.ts b/libs/nest-core/src/modules/billing/products/products.service.ts
index 8bec3463..a0150a27 100644
--- a/libs/nest-core/src/modules/billing/products/products.service.ts
+++ b/libs/nest-core/src/modules/billing/products/products.service.ts
@@ -33,7 +33,7 @@ export class ProductsService {
       })
     }
 
-    return items
+    return items.sort((a, b) => a.priority - b.priority)
   }
 
   async findOne(id: Id) {