design & shits

frontend/app/src/pages/AppRoutes.tsx

@@ -1,20 +1,33 @@
 import React, { ReactNode } from "react";
 import { BrowserRouter, Route, Routes } from "react-router-dom";
 import MainPage from "./MainPage";
-import { getLocalToken, loadLanguage, store } from "../config/store";
+import {
+  StorePrototype,
+  getLocalToken,
+  loadLanguage,
+  store,
+} from "../config/store";
 import DashboardPage from "./DashboardPage";
 import PropTypes from "prop-types";
+import { useSelector } from "react-redux";
+import NotFoundPage from "./NotFoundPage";
 
 const AppRoutes = ({ children }: { children: ReactNode }) => {
   store.dispatch(getLocalToken());
   store.dispatch(loadLanguage());
 
+  const user = useSelector((state: StorePrototype) => state.auth.user);
+
   return (
     <BrowserRouter>
       {children}
       <Routes>
         <Route path="/" element={<MainPage />} />
-        <Route path="/dashboard" element={<DashboardPage />} />
+        <Route
+          path="/dashboard"
+          element={user ? <DashboardPage /> : <NotFoundPage />}
+        />
+        <Route path="*" element={<NotFoundPage />} />
       </Routes>
     </BrowserRouter>
   );

frontend/app/src/pages/DashboardPage.tsx

@@ -1,22 +1,9 @@
 import React from "react";
 import "./styles.css";
-import logoSquare from "../../static/logo-square.png";
-import { Button } from "antd";
-import tr from "../config/translation";
+import QueuesList from "../components/queue/QueuesList";
 
 const DashboardPage = () => {
-  return (
-    <div className="card main">
-      <img src={logoSquare} alt="logo" className="image" />
-      <p style={{ fontSize: "2rem" }}>
-        {tr("Queuing has never been so simple")}
-      </p>
-      <div className="button-box">
-        <Button>{tr("Join a queue")}</Button>
-        <Button>{tr("Take a tour")}</Button>
-      </div>
-    </div>
-  );
+  return <QueuesList />;
 };
 
 export default DashboardPage;

frontend/app/src/pages/NotFoundPage.tsx

@@ -0,0 +1,17 @@
+import { QuestionCircleOutlined } from "@ant-design/icons";
+import React from "react";
+import tr from "../config/translation";
+import Title from "antd/es/typography/Title";
+
+const NotFoundPage = () => {
+  return (
+    <>
+      <div style={{ width: "100%", marginTop: "3rem" }}>
+        <QuestionCircleOutlined style={{ fontSize: "5rem" }} />
+      </div>
+      <Title>{tr("Not found")}</Title>
+    </>
+  );
+};
+
+export default NotFoundPage;

frontend/app/src/pages/styles.css

@@ -1,6 +1,8 @@
 .card {
     background: #001529;
-    margin: 10px;
+    margin-top: 0.5rem;
+    margin-right: 1rem;
+    margin-left: 1rem;
     border-radius: 10px;
   }