From 48bc82fb1e3c5e28455e755491169004dad2d046 Mon Sep 17 00:00:00 2001 From: sosokker Date: Thu, 23 Nov 2023 00:19:32 +0700 Subject: [PATCH] Add landing page and handling wrong url --- frontend/src/App.jsx | 20 +++-- frontend/src/PrivateRoute.jsx | 2 +- frontend/src/PublicRoute.jsx | 9 +++ .../src/components/dashboard/dashboard.jsx | 45 ++++------- .../components/landingPage/LandingPage.jsx | 75 +++++++++++++++++++ .../components/landingPage/landingPage.jsx | 64 ---------------- frontend/src/components/signup/Signup.jsx | 61 ++++++++------- 7 files changed, 144 insertions(+), 132 deletions(-) create mode 100644 frontend/src/PublicRoute.jsx create mode 100644 frontend/src/components/landingPage/LandingPage.jsx delete mode 100644 frontend/src/components/landingPage/landingPage.jsx diff --git a/frontend/src/App.jsx b/frontend/src/App.jsx index 89166b6..1ab242f 100644 --- a/frontend/src/App.jsx +++ b/frontend/src/App.jsx @@ -1,6 +1,6 @@ import { useEffect } from "react"; import "./App.css"; -import { Route, Routes } from "react-router-dom"; +import { Route, Routes, Navigate } from "react-router-dom"; import axios from "axios"; import TestAuth from "./components/testAuth"; import LoginPage from "./components/authentication/LoginPage"; @@ -13,6 +13,8 @@ import Eisenhower from "./components/EisenhowerMatrix/Eisenhower"; import PrivateRoute from "./PrivateRoute"; import ProfileUpdatePage from "./components/profilePage"; import Dashboard from "./components/dashboard/dashboard"; +import { LandingPage } from "./components/landingPage/LandingPage"; +import PublicRoute from "./PublicRoute"; import { useAuth } from "./hooks/AuthHooks"; @@ -60,10 +62,17 @@ const App = () => { const NonAuthenticatedComponents = () => { return (
- - } /> - } /> + }> + } /> + + }> + } /> + + }> + } /> + + } />
); @@ -91,8 +100,7 @@ const AuthenticatedComponents = () => { }> } /> - } /> - } /> + } /> diff --git a/frontend/src/PrivateRoute.jsx b/frontend/src/PrivateRoute.jsx index b9784f6..01afc6a 100644 --- a/frontend/src/PrivateRoute.jsx +++ b/frontend/src/PrivateRoute.jsx @@ -3,7 +3,7 @@ import { useAuth } from "src/hooks/AuthHooks"; const PrivateRoute = () => { const { isAuthenticated } = useAuth(); - return isAuthenticated ? : ; + return isAuthenticated ? : ; }; export default PrivateRoute; diff --git a/frontend/src/PublicRoute.jsx b/frontend/src/PublicRoute.jsx new file mode 100644 index 0000000..ffdc39c --- /dev/null +++ b/frontend/src/PublicRoute.jsx @@ -0,0 +1,9 @@ +import { Navigate, Outlet } from "react-router-dom"; +import { useAuth } from "src/hooks/AuthHooks"; + +const PublicRoute = () => { + const { isAuthenticated } = useAuth(); + return isAuthenticated ? : ; +}; + +export default PublicRoute; diff --git a/frontend/src/components/dashboard/dashboard.jsx b/frontend/src/components/dashboard/dashboard.jsx index b1da562..4de23ae 100644 --- a/frontend/src/components/dashboard/dashboard.jsx +++ b/frontend/src/components/dashboard/dashboard.jsx @@ -1,24 +1,10 @@ -import { - Card, - Grid, - Tab, - TabGroup, - TabList, - TabPanel, - TabPanels, - Text, - Title, - Legend, -} from "@tremor/react"; -import KpiCard from "./KpiCard"; +import { Card, Grid, Tab, TabGroup, TabList, TabPanel, TabPanels, Text, Title, Legend } from "@tremor/react"; +import KpiCard from "./kpiCard"; import { BarChartGraph } from "./Barchart"; import DonutChartGraph from "./DonutChart"; import { AreaChartGraph } from "./Areachart"; import ProgressCircleChart from "./ProgressCircle"; -const valueFormatter = (number) => - `$ ${new Intl.NumberFormat("us").format(number).toString()}`; - export default function Dashboard() { return (
@@ -48,8 +34,7 @@ export default function Dashboard() { + colors={["indigo"]}> @@ -60,18 +45,18 @@ export default function Dashboard() { -
- - Tasks - -
- - -
+
+ + Tasks + +
+ + +
diff --git a/frontend/src/components/landingPage/LandingPage.jsx b/frontend/src/components/landingPage/LandingPage.jsx new file mode 100644 index 0000000..e40463d --- /dev/null +++ b/frontend/src/components/landingPage/LandingPage.jsx @@ -0,0 +1,75 @@ +import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"; +import { faGoogle, faGithub } from "@fortawesome/free-brands-svg-icons"; + +export function LandingPage() { + return ( +
+
+
+

TurTask

+ +
+
+
+
+
+
+ Your Picture +
+
+

TurTask

+

Your Ultimate Task Management

+
+
+

+ TurTask is a task and project management tool that incorporates gamification elements. +

+
+
+
+
+

Create your account

+

Start spending more time on your own table.

+
+
+ +
+
+ +
+
+ +
+
+
+
+
+
+
+ ); +} diff --git a/frontend/src/components/landingPage/landingPage.jsx b/frontend/src/components/landingPage/landingPage.jsx deleted file mode 100644 index d4aab24..0000000 --- a/frontend/src/components/landingPage/landingPage.jsx +++ /dev/null @@ -1,64 +0,0 @@ -import React from 'react' -import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; -import { faGoogle, faGithub } from '@fortawesome/free-brands-svg-icons'; - -function landingPage() { - return ( -
-
-
-

TurTask

-
- Register - Login -
-
-
-
-
-
-
- Your Picture -
-
-

TurTask

-

Your Ultimate Task Management

-
-
-

- TurTask is a task and project management tool that incorporates gamification elements. -

-
-
-
-
-

Create your account

-

Start spending more time on your own table.

-
-
- -
-
- -
-
- -
-
-
-
-
-
-
- ) -} - -export default landingPage \ No newline at end of file diff --git a/frontend/src/components/signup/Signup.jsx b/frontend/src/components/signup/Signup.jsx index 3958feb..dd25136 100644 --- a/frontend/src/components/signup/Signup.jsx +++ b/frontend/src/components/signup/Signup.jsx @@ -1,39 +1,38 @@ -import React from 'react'; -import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; -import { faGoogle, faGithub } from '@fortawesome/free-brands-svg-icons'; +import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"; +import { faGoogle, faGithub } from "@fortawesome/free-brands-svg-icons"; function Signup() { - return ( -
-
-

Create your account

-

- Start spending more time on your own table. -

-
-
- -
+ return ( +
+
+

Create your account

+

Start spending more time on your own table.

+
+
+ +
-
- -
+
+ +
-
- -
-
-
+
+ +
- ); +
+
+ ); } export default Signup;