Revert "AYS-878 | show pop up about session expired for 401 errors (#359)"

This reverts commit 8bc13d3.

Author: sanshigo345

src/components/ui/dialog.tsx

@@ -29,16 +29,10 @@ const DialogOverlay = React.forwardRef<
 ))
 DialogOverlay.displayName = DialogPrimitive.Overlay.displayName
 
-type DialogContentProps = React.ComponentPropsWithoutRef<
-  typeof DialogPrimitive.Content
-> & {
-  showClose?: boolean
-}
-
 const DialogContent = React.forwardRef<
   React.ElementRef<typeof DialogPrimitive.Content>,
-  DialogContentProps
->(({ className, children, showClose = true, ...props }, ref) => (
+  React.ComponentPropsWithoutRef<typeof DialogPrimitive.Content>
+>(({ className, children, ...props }, ref) => (
   <DialogPortal>
     <DialogOverlay />
     <DialogPrimitive.Content
@@ -50,12 +44,10 @@ const DialogContent = React.forwardRef<
       {...props}
     >
       {children}
-      {showClose && (
-        <DialogPrimitive.Close className="absolute right-4 top-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-accent data-[state=open]:text-muted-foreground">
-          <X className="h-4 w-4" />
-          <span className="sr-only">Close</span>
-        </DialogPrimitive.Close>
-      )}
+      <DialogPrimitive.Close className="absolute right-4 top-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-accent data-[state=open]:text-muted-foreground">
+        <X className="h-4 w-4" />
+        <span className="sr-only">Close</span>
+      </DialogPrimitive.Close>
     </DialogPrimitive.Content>
   </DialogPortal>
 ))

src/contexts/validateRouteProvider.tsx

@@ -1,40 +1,24 @@
-'use client'
-
+import React, { ReactNode, useState, useEffect, useMemo } from 'react'
+import { usePathname, useRouter } from 'next/navigation'
+import { useAppSelector } from '@/store/hooks'
+import { getRouteStatus } from '@/lib/getRouteStatus'
+import { getUserPermissions } from '@/lib/getUserPermissions'
+import { selectToken } from '@/modules/auth/authSlice'
 import { LoadingSpinner } from '@/components/ui/loadingSpinner'
 import {
   ValidateRouteContext,
   ValidateRouteContextType,
 } from '@/contexts/validateRouteContext'
-import { getRouteStatus } from '@/lib/getRouteStatus'
-import { getUserPermissions } from '@/lib/getUserPermissions'
-import { selectToken } from '@/modules/auth/authSlice'
-import { useAppSelector } from '@/store/hooks'
-import { usePathname, useRouter } from 'next/navigation'
-import { ReactNode, useEffect, useMemo, useState } from 'react'
-
-import {
-  Dialog,
-  DialogContent,
-  DialogDescription,
-  DialogHeader,
-  DialogTitle,
-} from '@/components/ui/dialog'
-import { useTranslation } from 'react-i18next'
 
 export const ValidateRouteProvider = ({
   children,
 }: {
   children: ReactNode
 }): React.JSX.Element => {
-  const { t } = useTranslation()
   const router = useRouter()
   const pathname = usePathname()
   const token = useAppSelector(selectToken)
-
   const [loading, setLoading] = useState(true)
-  const [showModal, setShowModal] = useState(false)
-  const [countdown, setCountdown] = useState(3)
-
   const { isProtected, route, requiredPermission } = getRouteStatus(pathname)
   const userPermissions = token ? getUserPermissions(token) : []
 
@@ -62,58 +46,17 @@ export const ValidateRouteProvider = ({
         setLoading(false)
       }
     } else if (isProtected) {
-      setShowModal(true)
+      router.replace('/login')
     } else {
       setLoading(false)
     }
-  }, [token, pathname, isProtected, userHasPermission, router])
-
-  useEffect(() => {
-    if (!showModal) return
+  }, [token, pathname, isProtected, userHasPermission, router, loading])
 
-    if (showModal) {
-      setCountdown(3)
-    }
-
-    const interval = setInterval(() => {
-      setCountdown((prev) => {
-        if (prev === 1) {
-          clearInterval(interval)
-          setShowModal(false)
-          router.replace('/login')
-        }
-        return prev - 1
-      })
-    }, 1000)
-
-    return () => clearInterval(interval)
-  }, [showModal, router])
-
-  if (loading || showModal) {
+  if (loading) {
     return (
-      <>
-        <Dialog open={showModal}>
-          <DialogContent
-            className="sm:max-w-md"
-            showClose={false}
-            onEscapeKeyDown={(e) => e.preventDefault()}
-            onPointerDownOutside={(e) => e.preventDefault()}
-          >
-            <DialogHeader>
-              <DialogTitle>{t('sessionExpired.title')}</DialogTitle>
-              <DialogDescription>
-                {t('sessionExpired.description')}
-                <br />
-                {t('sessionExpired.countdown', { count: countdown })}
-              </DialogDescription>
-            </DialogHeader>
-          </DialogContent>
-        </Dialog>
-
-        <div className="flex items-center justify-center h-screen">
-          <LoadingSpinner />
-        </div>
-      </>
+      <div className="flex items-center justify-center h-screen">
+        <LoadingSpinner />
+      </div>
     )
   }
 

src/i18n/locales/en.json

@@ -59,11 +59,6 @@
       "incorrectCredentials": "Incorrect email or password. Please try again."
     }
   },
-  "sessionExpired": {
-    "title": "Your Session Has Expired",
-    "description": "Please log in again.",
-    "countdown": "You will be redirected to the login screen in {{count}} second."
-  },
   "password": {
     "forgot": {
       "title": "Forgot password",

src/i18n/locales/tr.json

@@ -59,11 +59,6 @@
       "incorrectCredentials": "Hatalı e-posta veya şifre. Lütfen tekrar deneyiniz."
     }
   },
-  "sessionExpired": {
-    "title": "Oturum Süreniz Doldu",
-    "description": "Lütfen tekrar giriş yapınız.",
-    "countdown": "{{count}} saniye içinde giriş ekranına yönlendirileceksiniz…"
-  },
   "password": {
     "forgot": {
       "title": "Şifrenizi mi unuttunuz?",

src/lib/showToast.ts

@@ -7,13 +7,9 @@ export const showErrorToast = (
 ): void => {
   const title = 'common.error.defaultTitle'
 
-  const status = error?.response?.status
-
-  // error status 401 means session expired in this project 🤷‍♂️. Which we do not want to show toast.
-  // Detailed info at https://afetyonetimsistemi.atlassian.net/browse/AYS-878
-  if (status === 401) return
-
-  if (status === 429) description = 'common.error.tooManyRequest'
+  if (error?.response?.status === 429) {
+    description = 'common.error.tooManyRequest'
+  }
 
   toast({
     title,