refactor: ♻️ Remove dashboard page

singhAmandeep007 · Nov 25, 2024 · 282f0ec · 282f0ec
1 parent 10d9a94
commit 282f0ec
Show file tree

Hide file tree

Showing 12 changed files with 56 additions and 106 deletions.
diff --git a/src/pages/App/AppLayout.tsx b/src/pages/App/AppLayout.tsx
@@ -22,7 +22,7 @@ import {
 
 import { Input } from "../../components/forms";
 
-import { Home, PanelLeft, Search, Settings as SettingsIcon } from "lucide-react";
+import { PanelLeft, Search, Settings as SettingsIcon } from "lucide-react";
 
 import { useAppLayout } from "./useAppLayout";
 
@@ -53,13 +53,6 @@ export const AppLayout = () => {
               >
                 <nav className="grid gap-6 text-lg font-medium">
                   <Brand className="justify-start" />
-                  <RouteLink
-                    to="/app/dashboard"
-                    className="flex items-center gap-4 px-2.5 text-muted-foreground hover:text-foreground"
-                  >
-                    <Home className="icon" />
-                    Dashboard
-                  </RouteLink>
 
                   <RouteLink
                     to="/app/settings"
@@ -79,8 +72,10 @@ export const AppLayout = () => {
                 className="w-full rounded-lg bg-background pl-8 md:w-[200px] lg:w-[336px]"
               />
             </div>
-            <LangToggler />
-            <ThemeToggler />
+            <div className="flex gap-1">
+              <LangToggler />
+              <ThemeToggler />
+            </div>
             <DropdownMenu>
               <DropdownMenuTrigger asChild>
                 <Button
@@ -100,15 +95,16 @@ export const AppLayout = () => {
               <DropdownMenuContent align="end">
                 <DropdownMenuLabel>My Account</DropdownMenuLabel>
                 <DropdownMenuSeparator />
-                <DropdownMenuItem>Settings</DropdownMenuItem>
+                <DropdownMenuItem>
+                  <RouteLink to="/app/settings">Settings</RouteLink>
+                </DropdownMenuItem>
                 <DropdownMenuSeparator />
                 <DropdownMenuItem onClick={() => void handleLogout()}>Logout</DropdownMenuItem>
               </DropdownMenuContent>
             </DropdownMenu>
           </header>
 
           <div className="grid flex-1 items-start gap-4 overflow-scroll p-4">
-            <div>App</div>
             <Outlet />
           </div>
         </div>

diff --git a/src/pages/App/Dashboard.tsx → src/pages/App/Posts.tsx b/src/pages/App/Dashboard.tsx → src/pages/App/Posts.tsx
@@ -1,9 +1,6 @@
-import { FC, PropsWithChildren } from "react";
 import { useGetPostsQuery } from "../../api/posts";
 
-export type TDashboardProps = Record<string, never>;
-
-export const Dashboard: FC<PropsWithChildren<TDashboardProps>> = () => {
+export const Posts = () => {
   const { data, isSuccess, isError, error } = useGetPostsQuery({
     retry: false,
   });

diff --git a/src/pages/App/Settings.tsx b/src/pages/App/Settings.tsx
@@ -1,7 +1,3 @@
-import { FC, PropsWithChildren } from "react";
-
-export type TSettingsProps = Record<string, never>;
-
-export const Settings: FC<PropsWithChildren<TSettingsProps>> = () => {
+export const Settings = () => {
   return <div>Settings</div>;
 };
diff --git a/src/pages/App/Sidebar.tsx b/src/pages/App/Sidebar.tsx
@@ -1,28 +1,12 @@
-import { FC, PropsWithChildren } from "react";
-
 import { Brand, RouteLink, Tooltip, TooltipContent, TooltipTrigger } from "../../components/ui";
 
-import { Home, Settings } from "lucide-react";
-
-export type TSidebarProps = Record<string, never>;
+import { Settings } from "lucide-react";
 
-export const Sidebar: FC<PropsWithChildren<TSidebarProps>> = () => {
+export const Sidebar = () => {
   return (
     <aside className="fixed inset-y-0 left-0 z-[--z-navbar] hidden w-14 flex-col border-r bg-background sm:flex">
       <nav className="flex flex-col items-center gap-4 px-2 sm:py-5">
         <Brand />
-        <Tooltip>
-          <TooltipTrigger>
-            <RouteLink
-              to="/app/dashboard"
-              className="flex h-9 w-9 items-center justify-center rounded-lg text-muted-foreground transition-colors hover:text-foreground"
-            >
-              <Home className="icon" />
-              <span className="sr-only">Dashboard</span>
-            </RouteLink>
-          </TooltipTrigger>
-          <TooltipContent side="right">Dashboard</TooltipContent>
-        </Tooltip>
       </nav>
       <nav className="mt-auto flex flex-col items-center gap-4 px-2 sm:py-5">
         <Tooltip>

diff --git a/src/pages/App/index.ts b/src/pages/App/index.ts
@@ -1,3 +1,3 @@
 export * from "./AppLayout";
-export * from "./Dashboard";
+export * from "./Posts";
 export * from "./Settings";
diff --git a/src/pages/Auth/ForgotPassword.tsx b/src/pages/Auth/ForgotPassword.tsx
@@ -1,7 +1,3 @@
-import { FC, PropsWithChildren } from "react";
-
-export type TForgotPasswordProps = Record<string, never>;
-
-export const ForgotPassword: FC<PropsWithChildren<TForgotPasswordProps>> = () => {
+export const ForgotPassword = () => {
   return <div>ForgotPassword</div>;
 };
diff --git a/src/pages/Auth/Login.tsx b/src/pages/Auth/Login.tsx
@@ -1,5 +1,3 @@
-import { FC, PropsWithChildren } from "react";
-
 import {
   Form,
   FormButton,
@@ -16,9 +14,7 @@ import { ReactHookFormDevelopmentTools } from "../../components/developmentTools
 
 import { useLoginForm } from "./useLoginForm";
 
-export type TLoginProps = Record<string, never>;
-
-export const Login: FC<PropsWithChildren<TLoginProps>> = () => {
+export const Login = () => {
   const {
     form,
     form: {

diff --git a/src/pages/Auth/Signup.tsx b/src/pages/Auth/Signup.tsx
@@ -1,7 +1,3 @@
-import { FC, PropsWithChildren } from "react";
-
-export type TSignupProps = Record<string, never>;
-
-export const Signup: FC<PropsWithChildren<TSignupProps>> = () => {
+export const Signup = () => {
   return <div>Signup</div>;
 };
diff --git a/src/pages/Home/Home.tsx b/src/pages/Home/Home.tsx
@@ -1,19 +1,17 @@
-import { FC, PropsWithChildren, useMemo } from "react";
+import { useMemo } from "react";
 
 import { Trans, useTranslation } from "react-i18next";
 
 import { Button, RouteLink, Typography } from "../../components/ui";
 
 import { ArrowRight, ListTodo, NotebookPen, Repeat, SquareCheckBig } from "lucide-react";
 
-export type THomeProps = Record<string, never>;
-
 type TSequence = {
   icon: JSX.Element;
   name: string;
 };
 
-export const Home: FC<PropsWithChildren<THomeProps>> = () => {
+export const Home = () => {
   const { t } = useTranslation("homePage");
 
   const sequence: TSequence[] = useMemo(
@@ -101,7 +99,7 @@ export const Home: FC<PropsWithChildren<THomeProps>> = () => {
         </div>
 
         {/* Shadow effect */}
-        <div className="absolute -z-10 h-1/2 w-1/2 animate-shadow-pulse rounded-[50%] blur-[120px]"></div>
+        <div className="absolute -z-10 h-1/2 w-1/2 animate-shadow-pulse rounded-[80%] blur-[150px]"></div>
       </section>
       <section className="container mb-16 h-full">
         <Typography

diff --git a/src/routeTree.gen.ts b/src/routeTree.gen.ts
@@ -12,7 +12,7 @@
 
 import { Route as rootRoute } from "./routes/__root";
 import { Route as AppImport } from "./routes/app";
-import { Route as AppDashboardImport } from "./routes/app/dashboard";
+import { Route as AppIndexImport } from "./routes/app/index";
 import { Route as AppSettingsImport } from "./routes/app/settings";
 import { Route as AuthImport } from "./routes/auth";
 import { Route as AuthForgotPasswordImport } from "./routes/auth/forgotPassword";
@@ -40,6 +40,12 @@ const IndexRoute = IndexImport.update({
   getParentRoute: () => rootRoute,
 } as any);
 
+const AppIndexRoute = AppIndexImport.update({
+  id: "/",
+  path: "/",
+  getParentRoute: () => AppRoute,
+} as any);
+
 const AuthSignupRoute = AuthSignupImport.update({
   id: "/signup",
   path: "/signup",
@@ -64,12 +70,6 @@ const AppSettingsRoute = AppSettingsImport.update({
   getParentRoute: () => AppRoute,
 } as any);
 
-const AppDashboardRoute = AppDashboardImport.update({
-  id: "/dashboard",
-  path: "/dashboard",
-  getParentRoute: () => AppRoute,
-} as any);
-
 // Populate the FileRoutesByPath interface
 
 declare module "@tanstack/react-router" {
@@ -95,13 +95,6 @@ declare module "@tanstack/react-router" {
       preLoaderRoute: typeof AuthImport;
       parentRoute: typeof rootRoute;
     };
-    "/app/dashboard": {
-      id: "/app/dashboard";
-      path: "/dashboard";
-      fullPath: "/app/dashboard";
-      preLoaderRoute: typeof AppDashboardImport;
-      parentRoute: typeof AppImport;
-    };
     "/app/settings": {
       id: "/app/settings";
       path: "/settings";
@@ -130,19 +123,26 @@ declare module "@tanstack/react-router" {
       preLoaderRoute: typeof AuthSignupImport;
       parentRoute: typeof AuthImport;
     };
+    "/app/": {
+      id: "/app/";
+      path: "/";
+      fullPath: "/app/";
+      preLoaderRoute: typeof AppIndexImport;
+      parentRoute: typeof AppImport;
+    };
   }
 }
 
 // Create and export the route tree
 
 interface AppRouteChildren {
-  AppDashboardRoute: typeof AppDashboardRoute;
   AppSettingsRoute: typeof AppSettingsRoute;
+  AppIndexRoute: typeof AppIndexRoute;
 }
 
 const AppRouteChildren: AppRouteChildren = {
-  AppDashboardRoute: AppDashboardRoute,
   AppSettingsRoute: AppSettingsRoute,
+  AppIndexRoute: AppIndexRoute,
 };
 
 const AppRouteWithChildren = AppRoute._addFileChildren(AppRouteChildren);
@@ -165,34 +165,33 @@ export interface FileRoutesByFullPath {
   "/": typeof IndexRoute;
   "/app": typeof AppRouteWithChildren;
   "/auth": typeof AuthRouteWithChildren;
-  "/app/dashboard": typeof AppDashboardRoute;
   "/app/settings": typeof AppSettingsRoute;
   "/auth/forgotPassword": typeof AuthForgotPasswordRoute;
   "/auth/login": typeof AuthLoginRoute;
   "/auth/signup": typeof AuthSignupRoute;
+  "/app/": typeof AppIndexRoute;
 }
 
 export interface FileRoutesByTo {
   "/": typeof IndexRoute;
-  "/app": typeof AppRouteWithChildren;
   "/auth": typeof AuthRouteWithChildren;
-  "/app/dashboard": typeof AppDashboardRoute;
   "/app/settings": typeof AppSettingsRoute;
   "/auth/forgotPassword": typeof AuthForgotPasswordRoute;
   "/auth/login": typeof AuthLoginRoute;
   "/auth/signup": typeof AuthSignupRoute;
+  "/app": typeof AppIndexRoute;
 }
 
 export interface FileRoutesById {
   __root__: typeof rootRoute;
   "/": typeof IndexRoute;
   "/app": typeof AppRouteWithChildren;
   "/auth": typeof AuthRouteWithChildren;
-  "/app/dashboard": typeof AppDashboardRoute;
   "/app/settings": typeof AppSettingsRoute;
   "/auth/forgotPassword": typeof AuthForgotPasswordRoute;
   "/auth/login": typeof AuthLoginRoute;
   "/auth/signup": typeof AuthSignupRoute;
+  "/app/": typeof AppIndexRoute;
 }
 
 export interface FileRouteTypes {
@@ -201,31 +200,23 @@ export interface FileRouteTypes {
     | "/"
     | "/app"
     | "/auth"
-    | "/app/dashboard"
     | "/app/settings"
     | "/auth/forgotPassword"
     | "/auth/login"
-    | "/auth/signup";
+    | "/auth/signup"
+    | "/app/";
   fileRoutesByTo: FileRoutesByTo;
-  to:
-    | "/"
-    | "/app"
-    | "/auth"
-    | "/app/dashboard"
-    | "/app/settings"
-    | "/auth/forgotPassword"
-    | "/auth/login"
-    | "/auth/signup";
+  to: "/" | "/auth" | "/app/settings" | "/auth/forgotPassword" | "/auth/login" | "/auth/signup" | "/app";
   id:
     | "__root__"
     | "/"
     | "/app"
     | "/auth"
-    | "/app/dashboard"
     | "/app/settings"
     | "/auth/forgotPassword"
     | "/auth/login"
-    | "/auth/signup";
+    | "/auth/signup"
+    | "/app/";
   fileRoutesById: FileRoutesById;
 }
 
@@ -260,8 +251,8 @@ export const routeTree = rootRoute._addFileChildren(rootRouteChildren)._addFileT
     "/app": {
       "filePath": "app.tsx",
       "children": [
-        "/app/dashboard",
-        "/app/settings"
+        "/app/settings",
+        "/app/"
       ]
     },
     "/auth": {
@@ -272,10 +263,6 @@ export const routeTree = rootRoute._addFileChildren(rootRouteChildren)._addFileT
         "/auth/signup"
       ]
     },
-    "/app/dashboard": {
-      "filePath": "app/dashboard.tsx",
-      "parent": "/app"
-    },
     "/app/settings": {
       "filePath": "app/settings.tsx",
       "parent": "/app"
@@ -291,6 +278,10 @@ export const routeTree = rootRoute._addFileChildren(rootRouteChildren)._addFileT
     "/auth/signup": {
       "filePath": "auth/signup.tsx",
       "parent": "/auth"
+    },
+    "/app/": {
+      "filePath": "app/index.tsx",
+      "parent": "/app"
     }
   }
 }

diff --git a/src/routes/app/dashboard.tsx b/src/routes/app/dashboard.tsx
diff --git a/src/routes/app/index.tsx b/src/routes/app/index.tsx
@@ -0,0 +1,7 @@
+import { createFileRoute } from "@tanstack/react-router";
+
+import { Posts } from "../../pages/App";
+
+export const Route = createFileRoute("/app/")({
+  component: Posts,
+});