feat(unauthorized): update protected route using role-based access

Author: Rituparna158

apps/web-app/src/app/router/ProtectedRoute.tsx

@@ -22,7 +22,7 @@ export default function ProtectedRoute({
     allowedRoles &&
     !allowedRoles.some((role) => user.roles.includes(role))
   ) {
-    return <Navigate to="/login" replace />;
+    return <Navigate to="/unauthorized" replace />;
   }
 
   return children;

apps/web-app/src/pages/Unauthorized.tsx

@@ -0,0 +1,20 @@
+import { Link } from 'react-router-dom';
+
+export default function Unauthorized() {
+  return (
+    <div className="flex min-h-screen flex-col items-center justify-center px-6 text-center">
+      <h1 className="text-3xl font-bold">403 - Unauthorized</h1>
+
+      <p className="mt-2 text-muted-foreground">
+        You do not have permission to access this page.
+      </p>
+
+      <Link to="/" className="mt-4 text-primary underline">
+        Go back home
+      </Link>
+    </div>
+  );
+}
+
+
+