From 3cb2f32240df80b871fca85e8d42167dad1b0b2e Mon Sep 17 00:00:00 2001 From: davitJabushanuri Date: Sat, 30 Mar 2024 22:49:20 +0400 Subject: [PATCH 01/33] chore: add custom spin animation to tailwind config --- tailwind.config.js | 11 +++++++++++ 1 file changed, 11 insertions(+) diff --git a/tailwind.config.js b/tailwind.config.js index 839661e6..143fbb64 100644 --- a/tailwind.config.js +++ b/tailwind.config.js @@ -152,6 +152,17 @@ module.exports = { nano: "var(--tw-fs-nano)", pico: "var(--tw-fs-pico)", }, + + animation: { + spin: "spin 0.8s linear infinite", + }, + + keyframes: { + spin: { + "0%": { transform: "rotate(0deg)" }, + "100%": { transform: "rotate(360deg)" }, + }, + }, }, }, plugins: [], From 6d6731d5a532fb2972ed99c5c0d1ac0c546db344 Mon Sep 17 00:00:00 2001 From: davitJabushanuri Date: Sat, 30 Mar 2024 22:56:51 +0400 Subject: [PATCH 02/33] refactor: use svg for loading spinner --- .../assets/loading-spinner-icon.tsx | 26 +++++++++++++++++++ .../loading-spinner/loading-spinner.tsx | 6 ++--- .../styles/loading-spinner.module.scss | 24 ----------------- 3 files changed, 29 insertions(+), 27 deletions(-) create mode 100644 src/components/elements/loading-spinner/assets/loading-spinner-icon.tsx delete mode 100644 src/components/elements/loading-spinner/styles/loading-spinner.module.scss diff --git a/src/components/elements/loading-spinner/assets/loading-spinner-icon.tsx b/src/components/elements/loading-spinner/assets/loading-spinner-icon.tsx new file mode 100644 index 00000000..f78def9d --- /dev/null +++ b/src/components/elements/loading-spinner/assets/loading-spinner-icon.tsx @@ -0,0 +1,26 @@ +export const LoadingSpinnerIcon = () => { + return ( + + + + + ); +}; diff --git a/src/components/elements/loading-spinner/loading-spinner.tsx b/src/components/elements/loading-spinner/loading-spinner.tsx index 7c6827bc..b2b0b810 100644 --- a/src/components/elements/loading-spinner/loading-spinner.tsx +++ b/src/components/elements/loading-spinner/loading-spinner.tsx @@ -1,9 +1,9 @@ -import styles from "./styles/loading-spinner.module.scss"; +import { LoadingSpinnerIcon } from "./assets/loading-spinner-icon"; export const LoadingSpinner = () => { return ( -
- +
+
); }; diff --git a/src/components/elements/loading-spinner/styles/loading-spinner.module.scss b/src/components/elements/loading-spinner/styles/loading-spinner.module.scss deleted file mode 100644 index f32cd8e3..00000000 --- a/src/components/elements/loading-spinner/styles/loading-spinner.module.scss +++ /dev/null @@ -1,24 +0,0 @@ -.container { - display: flex; - justify-content: center; - padding: 1rem; - - .loading { - border: 3.5px solid var(--clr-primary-disabled); - border-top: 3.5px solid var(--clr-primary); - border-radius: 50%; - width: 1.525rem; - height: 1.525rem; - animation: spin 0.8s linear infinite; - } -} - -@keyframes spin { - 0% { - transform: rotate(0deg); - } - - 100% { - transform: rotate(360deg); - } -} From 00859c25db8c3c510f3eed45b7a39408944b2b57 Mon Sep 17 00:00:00 2001 From: davitJabushanuri Date: Sat, 30 Mar 2024 23:47:13 +0400 Subject: [PATCH 03/33] refactor: use tailwind to style loading-screen component and hide the scrollbar when component is mounted --- .../loading-screen/loading-screen.tsx | 18 +++++++--- .../styles/loading-screen.module.scss | 33 ------------------- 2 files changed, 14 insertions(+), 37 deletions(-) delete mode 100644 src/components/elements/loading-screen/styles/loading-screen.module.scss diff --git a/src/components/elements/loading-screen/loading-screen.tsx b/src/components/elements/loading-screen/loading-screen.tsx index de81d925..91a0bd24 100644 --- a/src/components/elements/loading-screen/loading-screen.tsx +++ b/src/components/elements/loading-screen/loading-screen.tsx @@ -1,11 +1,21 @@ -import { TwitterLogo } from "@/assets/twitter-logo"; +"use client"; +import { useEffect } from "react"; -import styles from "./styles/loading-screen.module.scss"; +import { TwitterLogo } from "@/assets/twitter-logo"; export const LoadingScreen = () => { + useEffect(() => { + document.body.style.overflow = "hidden"; + document.body.style.paddingRight = "11px"; + + return () => { + document.body.style.overflow = ""; + document.body.style.paddingRight = ""; + }; + }, []); return ( -
-
+
+
diff --git a/src/components/elements/loading-screen/styles/loading-screen.module.scss b/src/components/elements/loading-screen/styles/loading-screen.module.scss deleted file mode 100644 index 18e6cd9e..00000000 --- a/src/components/elements/loading-screen/styles/loading-screen.module.scss +++ /dev/null @@ -1,33 +0,0 @@ -.container { - position: fixed; - top: 0; - left: 0; - width: 100vw; - width: 100dvw; - height: 100vh; - height: 100dvh; - background-color: var(--clr-background); - z-index: 99999999; - display: flex; - justify-content: center; - align-items: center; - - .logo { - svg { - width: 4rem; - height: 4rem; - fill: var(--clr-blue); - animation: breath 2s ease-in-out infinite; - } - } -} - -@keyframes breath { - 0% { - opacity: 0.8; - } - - 50% { - opacity: 1; - } -} From 0dd4327009c8d64216ad854bd47924a1841d4bb8 Mon Sep 17 00:00:00 2001 From: davitJabushanuri Date: Sat, 30 Mar 2024 23:47:36 +0400 Subject: [PATCH 04/33] style: update scrollbar styles --- src/app/styles/layout.scss | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/app/styles/layout.scss b/src/app/styles/layout.scss index e7ed516d..ed9deb6a 100644 --- a/src/app/styles/layout.scss +++ b/src/app/styles/layout.scss @@ -42,12 +42,12 @@ } *::-webkit-scrollbar-track { - background-color: var(--clr-nav-hover); + background-color: var(--clr-background); border-radius: 1rem; } *::-webkit-scrollbar-thumb { - background-color: var(--clr-nav-active); + background-color: var(--clr-nav-hover); border-radius: 1rem; } From 0cdd1393f2dc9de0569bb36277f492f9bf2a41d4 Mon Sep 17 00:00:00 2001 From: davitJabushanuri Date: Sun, 31 Mar 2024 23:14:25 +0400 Subject: [PATCH 05/33] feat: create error-boundary-provider --- src/providers/error-boundary-provider.tsx | 30 +++++++++++++++++++++++ src/providers/index.tsx | 10 +++++--- 2 files changed, 37 insertions(+), 3 deletions(-) create mode 100644 src/providers/error-boundary-provider.tsx diff --git a/src/providers/error-boundary-provider.tsx b/src/providers/error-boundary-provider.tsx new file mode 100644 index 00000000..5d69642a --- /dev/null +++ b/src/providers/error-boundary-provider.tsx @@ -0,0 +1,30 @@ +"use client"; +import { useRouter } from "next/navigation"; +import { ErrorInfo, FC } from "react"; +import { ErrorBoundary } from "react-error-boundary"; + +import { ErrorFallback } from "@/components/elements/error-fallback"; + +interface IErrorProvider { + children: React.ReactNode; +} + +export const ErrorBoundaryProvider: FC = ({ children }) => { + const router = useRouter(); + + const logError = (error: Error, info: ErrorInfo) => { + console.log(error, info); + }; + + return ( + { + router.refresh(); + }} + > + {children} + + ); +}; diff --git a/src/providers/index.tsx b/src/providers/index.tsx index dd2271c5..47e99fe9 100644 --- a/src/providers/index.tsx +++ b/src/providers/index.tsx @@ -1,5 +1,7 @@ +"use client"; import { FC } from "react"; +import { ErrorBoundaryProvider } from "./error-boundary-provider"; import { NextAuthProvider } from "./next-auth-provider"; import { ReactQueryProvider } from "./react-query-provider"; @@ -9,8 +11,10 @@ type AppProvidersProps = { export const AppProviders: FC = ({ children }) => { return ( - - {children} - + + + {children} + + ); }; From 96ea8011946ca7810e9c5d1bf96882319da9a75b Mon Sep 17 00:00:00 2001 From: davitJabushanuri Date: Sun, 31 Mar 2024 23:14:51 +0400 Subject: [PATCH 06/33] feat: create error-fallback component --- .../elements/error-fallback/assets/offline-icon.tsx | 9 +++++++++ 1 file changed, 9 insertions(+) create mode 100644 src/components/elements/error-fallback/assets/offline-icon.tsx diff --git a/src/components/elements/error-fallback/assets/offline-icon.tsx b/src/components/elements/error-fallback/assets/offline-icon.tsx new file mode 100644 index 00000000..99563bd2 --- /dev/null +++ b/src/components/elements/error-fallback/assets/offline-icon.tsx @@ -0,0 +1,9 @@ +export const OfflineIcon = () => { + return ( + + ); +}; From e2f5901872ecde9acbc118c060c57de6be0aa0a9 Mon Sep 17 00:00:00 2001 From: davitJabushanuri Date: Sun, 31 Mar 2024 23:16:11 +0400 Subject: [PATCH 07/33] feat: create global-error component to catch errors in the main layout --- src/app/global-error.tsx | 19 +++++++++++++ .../error-fallback/error-fallback.tsx | 28 +++++++++++++++++++ .../elements/error-fallback/index.ts | 1 + 3 files changed, 48 insertions(+) create mode 100644 src/app/global-error.tsx create mode 100644 src/components/elements/error-fallback/error-fallback.tsx create mode 100644 src/components/elements/error-fallback/index.ts diff --git a/src/app/global-error.tsx b/src/app/global-error.tsx new file mode 100644 index 00000000..cd9a9c9c --- /dev/null +++ b/src/app/global-error.tsx @@ -0,0 +1,19 @@ +"use client"; + +import { ErrorFallback } from "@/components/elements/error-fallback"; + +export default function GlobalError({ + error, + reset, +}: { + error: Error & { digest?: string }; + reset: () => void; +}) { + return ( + + + + + + ); +} diff --git a/src/components/elements/error-fallback/error-fallback.tsx b/src/components/elements/error-fallback/error-fallback.tsx new file mode 100644 index 00000000..cc7f63a3 --- /dev/null +++ b/src/components/elements/error-fallback/error-fallback.tsx @@ -0,0 +1,28 @@ +"use client"; +import { FC } from "react"; + +import { Button } from "../button"; +import { ReloadIcon } from "../try-again/assets/reload-icon"; + +interface IErrorFallback { + error: Error; + resetErrorBoundary: () => void; +} + +export const ErrorFallback: FC = ({ + error, + resetErrorBoundary, +}) => { + return ( +
+

{error.message}

+ +
+ ); +}; diff --git a/src/components/elements/error-fallback/index.ts b/src/components/elements/error-fallback/index.ts new file mode 100644 index 00000000..0cbd6753 --- /dev/null +++ b/src/components/elements/error-fallback/index.ts @@ -0,0 +1 @@ +export { ErrorFallback } from "./error-fallback"; From 40fec3a8b5188320e06522d88612a10c4cb6c6c2 Mon Sep 17 00:00:00 2001 From: davitJabushanuri Date: Mon, 1 Apr 2024 21:08:25 +0400 Subject: [PATCH 08/33] refactor: make error-boundary-provider reusable --- src/providers/error-boundary-provider.tsx | 12 ++++++++---- tsconfig.json | 14 +++----------- 2 files changed, 11 insertions(+), 15 deletions(-) diff --git a/src/providers/error-boundary-provider.tsx b/src/providers/error-boundary-provider.tsx index 5d69642a..eaa2d446 100644 --- a/src/providers/error-boundary-provider.tsx +++ b/src/providers/error-boundary-provider.tsx @@ -1,15 +1,19 @@ "use client"; import { useRouter } from "next/navigation"; -import { ErrorInfo, FC } from "react"; -import { ErrorBoundary } from "react-error-boundary"; +import { ComponentType, ErrorInfo, FC } from "react"; +import { ErrorBoundary, FallbackProps } from "react-error-boundary"; import { ErrorFallback } from "@/components/elements/error-fallback"; interface IErrorProvider { children: React.ReactNode; + fallback?: ComponentType | undefined; } -export const ErrorBoundaryProvider: FC = ({ children }) => { +export const ErrorBoundaryProvider: FC = ({ + children, + fallback, +}) => { const router = useRouter(); const logError = (error: Error, info: ErrorInfo) => { @@ -18,7 +22,7 @@ export const ErrorBoundaryProvider: FC = ({ children }) => { return ( { router.refresh(); diff --git a/tsconfig.json b/tsconfig.json index 08db1e45..3de25b81 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -2,16 +2,10 @@ "compilerOptions": { "baseUrl": ".", "paths": { - "@/*": [ - "./src/*" - ] + "@/*": ["./src/*"] }, "target": "ES2022", - "lib": [ - "dom", - "dom.iterable", - "ES2022" - ], + "lib": ["dom", "dom.iterable", "ES2022"], "allowJs": true, "skipLibCheck": true, "strict": true, @@ -46,7 +40,5 @@ "jest.setup.mjs", ".next/types/**/*.ts" ], - "exclude": [ - "node_modules" - ] + "exclude": ["node_modules"] } From a1efd5c06465ded01e14ec2ddb4964fa9641dd99 Mon Sep 17 00:00:00 2001 From: davitJabushanuri Date: Mon, 1 Apr 2024 21:11:19 +0400 Subject: [PATCH 09/33] chore: add onReset optional prop to error-boundary-provider --- src/providers/error-boundary-provider.tsx | 8 +++++++- 1 file changed, 7 insertions(+), 1 deletion(-) diff --git a/src/providers/error-boundary-provider.tsx b/src/providers/error-boundary-provider.tsx index eaa2d446..ccaba3dc 100644 --- a/src/providers/error-boundary-provider.tsx +++ b/src/providers/error-boundary-provider.tsx @@ -8,11 +8,13 @@ import { ErrorFallback } from "@/components/elements/error-fallback"; interface IErrorProvider { children: React.ReactNode; fallback?: ComponentType | undefined; + onReset?: () => void; } export const ErrorBoundaryProvider: FC = ({ children, fallback, + onReset, }) => { const router = useRouter(); @@ -25,7 +27,11 @@ export const ErrorBoundaryProvider: FC = ({ FallbackComponent={fallback ?? ErrorFallback} onError={logError} onReset={() => { - router.refresh(); + if (onReset) { + onReset(); + } else { + router.refresh(); + } }} > {children} From 906883131385a1329c3ae82421eb519e58b8b6de Mon Sep 17 00:00:00 2001 From: davitJabushanuri Date: Mon, 1 Apr 2024 21:26:32 +0400 Subject: [PATCH 10/33] feat: add error boundary for aside --- src/app/layout.tsx | 7 +++++-- src/features/aside/components/aside-fallback.tsx | 9 +++++++++ src/features/aside/index.ts | 3 ++- 3 files changed, 16 insertions(+), 3 deletions(-) create mode 100644 src/features/aside/components/aside-fallback.tsx diff --git a/src/app/layout.tsx b/src/app/layout.tsx index aa14a7ab..5baa2de6 100644 --- a/src/app/layout.tsx +++ b/src/app/layout.tsx @@ -4,12 +4,13 @@ import { ToastContainer, Slide } from "react-toastify"; import "react-toastify/dist/ReactToastify.css"; import "./styles/layout.scss"; import "./styles/tailwind.css"; -import { Aside } from "@/features/aside"; +import { Aside, AsideFallback } from "@/features/aside"; import { AuthFlow } from "@/features/auth"; import { MobileTweetButton } from "@/features/create-tweet"; import { MobileNavbar } from "@/features/navbar"; import { Sidebar } from "@/features/sidebar"; import { AppProviders } from "@/providers"; +import { ErrorBoundaryProvider } from "@/providers/error-boundary-provider"; import { Hamburger } from "./hamburger"; import { JoinTwitter } from "./join-twitter"; @@ -47,7 +48,9 @@ export default async function RootLayout({ {children} -
- + + +
- {children} + + {children} +
diff --git a/src/app/page-fallback.tsx b/src/app/page-fallback.tsx new file mode 100644 index 00000000..8bb5f478 --- /dev/null +++ b/src/app/page-fallback.tsx @@ -0,0 +1,11 @@ +"use client"; + +export const PageFallback = () => { + return ( +
+

+ Could not load the page, please try again later +

+
+ ); +}; From 89e1f2b91771d718dc2f1f141d83f41668540fec Mon Sep 17 00:00:00 2001 From: davitJabushanuri Date: Fri, 5 Apr 2024 21:51:25 +0400 Subject: [PATCH 23/33] refactor: get rid of submitError function --- src/providers/error-boundary-provider.tsx | 41 ++++++----------------- 1 file changed, 11 insertions(+), 30 deletions(-) diff --git a/src/providers/error-boundary-provider.tsx b/src/providers/error-boundary-provider.tsx index 67045325..75d39655 100644 --- a/src/providers/error-boundary-provider.tsx +++ b/src/providers/error-boundary-provider.tsx @@ -19,17 +19,21 @@ export const ErrorBoundaryProvider: FC = ({ }) => { const router = useRouter(); - const logError = (error: Error, info: ErrorInfo) => { + const logError = async (error: Error, info: ErrorInfo) => { const stackLines = error.stack?.split("\n") ?? []; const errorStack = stackLines.slice(0, 5).join("\n"); const componentStack = info.componentStack?.split("html")[0] + "html"; - submitError({ - name: error.name, - message: error.message, - error_stack: errorStack, - component_stack: componentStack, - }); + try { + await axios.post("/api/error", { + name: error.name, + message: error.message, + error_stack: errorStack, + component_stack: componentStack, + }); + } catch (error) { + throw new Error("Error submitting error"); + } }; return ( @@ -48,26 +52,3 @@ export const ErrorBoundaryProvider: FC = ({ ); }; - -const submitError = async ({ - name, - message, - error_stack, - component_stack, -}: { - name: string; - message: string; - error_stack: string; - component_stack: string; -}) => { - try { - await axios.post("/api/error", { - name, - message, - error_stack, - component_stack, - }); - } catch (error) { - throw new Error("Error submitting error"); - } -}; From ad1d889d0b1f669e560b234be863ea73c98bf876 Mon Sep 17 00:00:00 2001 From: davitJabushanuri Date: Fri, 5 Apr 2024 21:52:45 +0400 Subject: [PATCH 24/33] feat: only log the errors if NODE_ENV is production --- src/providers/error-boundary-provider.tsx | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/src/providers/error-boundary-provider.tsx b/src/providers/error-boundary-provider.tsx index 75d39655..116681ff 100644 --- a/src/providers/error-boundary-provider.tsx +++ b/src/providers/error-boundary-provider.tsx @@ -24,6 +24,10 @@ export const ErrorBoundaryProvider: FC = ({ const errorStack = stackLines.slice(0, 5).join("\n"); const componentStack = info.componentStack?.split("html")[0] + "html"; + // only log the error if NODE_ENV is production + + if (process.env.NODE_ENV !== "production") return; + try { await axios.post("/api/error", { name: error.name, From ee0c841aea1c0ef56bf8a1cbf74a72fa7b86059d Mon Sep 17 00:00:00 2001 From: davitJabushanuri Date: Sat, 6 Apr 2024 21:18:06 +0400 Subject: [PATCH 25/33] feat: create layout for admin page and nested routes --- src/app/admin/layout.tsx | 16 ++++++++++++++++ src/app/admin/page.tsx | 4 ++-- 2 files changed, 18 insertions(+), 2 deletions(-) create mode 100644 src/app/admin/layout.tsx diff --git a/src/app/admin/layout.tsx b/src/app/admin/layout.tsx new file mode 100644 index 00000000..570bbb36 --- /dev/null +++ b/src/app/admin/layout.tsx @@ -0,0 +1,16 @@ +import { Header } from "@/features/header"; + +import { AdminNavbar } from "./admin-navbar"; + +const AdminLayout = ({ children }: { children: React.ReactNode }) => { + return ( +
+
+ +
+ {children} +
+ ); +}; + +export default AdminLayout; diff --git a/src/app/admin/page.tsx b/src/app/admin/page.tsx index c6397641..7b34f6b4 100644 --- a/src/app/admin/page.tsx +++ b/src/app/admin/page.tsx @@ -1,8 +1,8 @@ -const DefaultPage = () => { +const AdminPage = () => { return
This is admin panel
; }; -export default DefaultPage; +export default AdminPage; export const metadata = { title: "Admin", From 19c0e2979f073c5d98d73ce2afdf7c6b5003cc22 Mon Sep 17 00:00:00 2001 From: davitJabushanuri Date: Mon, 6 May 2024 18:09:40 +0400 Subject: [PATCH 26/33] chore: update prettier ignore file --- .prettierignore | 2 -- 1 file changed, 2 deletions(-) diff --git a/.prettierignore b/.prettierignore index d3435cd1..a11df637 100644 --- a/.prettierignore +++ b/.prettierignore @@ -26,8 +26,6 @@ generated/ .env.production.local # LOGS -logs -*.log npm-debug.log* yarn-debug.log* yarn-error.log* From 116476b67413efd8b66a18f1005753010cae6482 Mon Sep 17 00:00:00 2001 From: davitJabushanuri Date: Mon, 6 May 2024 18:10:16 +0400 Subject: [PATCH 27/33] chore: create admin navbar --- src/app/admin/admin-navbar.tsx | 3 +++ src/providers/error-boundary-provider.tsx | 2 -- 2 files changed, 3 insertions(+), 2 deletions(-) create mode 100644 src/app/admin/admin-navbar.tsx diff --git a/src/app/admin/admin-navbar.tsx b/src/app/admin/admin-navbar.tsx new file mode 100644 index 00000000..0febaaf5 --- /dev/null +++ b/src/app/admin/admin-navbar.tsx @@ -0,0 +1,3 @@ +export const AdminNavbar = () => { + return
admin navbar
; +}; diff --git a/src/providers/error-boundary-provider.tsx b/src/providers/error-boundary-provider.tsx index 116681ff..34d048f9 100644 --- a/src/providers/error-boundary-provider.tsx +++ b/src/providers/error-boundary-provider.tsx @@ -24,8 +24,6 @@ export const ErrorBoundaryProvider: FC = ({ const errorStack = stackLines.slice(0, 5).join("\n"); const componentStack = info.componentStack?.split("html")[0] + "html"; - // only log the error if NODE_ENV is production - if (process.env.NODE_ENV !== "production") return; try { From 40288744abb171ba418ac15630848c1eddd0ae38 Mon Sep 17 00:00:00 2001 From: davitJabushanuri Date: Mon, 6 May 2024 18:10:57 +0400 Subject: [PATCH 28/33] chore: update gitignore --- .gitignore | 2 -- 1 file changed, 2 deletions(-) diff --git a/.gitignore b/.gitignore index 61b8ef6b..acbc6c72 100644 --- a/.gitignore +++ b/.gitignore @@ -26,8 +26,6 @@ generated/ .env.production.local # LOGS -logs -*.log npm-debug.log* yarn-debug.log* yarn-error.log* From d50b459427facbce198b3dc6e186378e22f0e5a2 Mon Sep 17 00:00:00 2001 From: davitJabushanuri Date: Mon, 6 May 2024 18:11:31 +0400 Subject: [PATCH 29/33] feat: create logs page --- src/app/admin/logs/page.tsx | 36 ++++++++++++++++++++++++++++++++++++ 1 file changed, 36 insertions(+) create mode 100644 src/app/admin/logs/page.tsx diff --git a/src/app/admin/logs/page.tsx b/src/app/admin/logs/page.tsx new file mode 100644 index 00000000..157f76b5 --- /dev/null +++ b/src/app/admin/logs/page.tsx @@ -0,0 +1,36 @@ +import { Button } from "@/components/elements/button"; +import { prisma } from "@/lib/prisma"; +import { Log } from "./log"; + +const getLogs = async () => { + const data = await prisma.errorLog.findMany({}); + return data; +}; + +async function LogsPage() { + const logs = await getLogs(); + console.log(logs); + + if (!logs || logs.length === 0) { + return ( +
+

There are no logs in this time range

+ +
+ ); + } + + return ( +
+ {logs.map((log) => { + return ; + })} +
+ ); +} + +export default LogsPage; + +export const metadata = { + title: "Logs", +}; From 4e81fb462c6027bed9b44d60c7be2433728450b1 Mon Sep 17 00:00:00 2001 From: davitJabushanuri Date: Mon, 6 May 2024 18:26:42 +0400 Subject: [PATCH 30/33] feat: create Log component to display error logs --- src/app/admin/logs/log.tsx | 42 ++++++++++++++++++++++++++++++++++++++ 1 file changed, 42 insertions(+) create mode 100644 src/app/admin/logs/log.tsx diff --git a/src/app/admin/logs/log.tsx b/src/app/admin/logs/log.tsx new file mode 100644 index 00000000..976cccad --- /dev/null +++ b/src/app/admin/logs/log.tsx @@ -0,0 +1,42 @@ +"use client"; +import { useState } from "react"; +import type { ErrorLog } from "@prisma/client"; + +import { Button } from "@/components/elements/button"; + +export const Log = ({ log }: { log: ErrorLog }) => { + const [isOpen, setIsOpen] = useState(false); + const [isComponentStackOpen, setIsComponentStackOpen] = useState(false); + + return ( +
+ + + {isOpen && ( +
+ Message: {log.message} + + Error stack: {log.error_stack} + + + + {isComponentStackOpen && ( + {log.component_stack} + )} +
+ )} +
+ ); +}; From 04b7ea2864cb0f5a1d2c9a078884d5bbd9f7d69e Mon Sep 17 00:00:00 2001 From: davitJabushanuri Date: Mon, 6 May 2024 18:28:11 +0400 Subject: [PATCH 31/33] chore: remove console log --- src/app/admin/logs/page.tsx | 2 -- 1 file changed, 2 deletions(-) diff --git a/src/app/admin/logs/page.tsx b/src/app/admin/logs/page.tsx index 157f76b5..e725db9e 100644 --- a/src/app/admin/logs/page.tsx +++ b/src/app/admin/logs/page.tsx @@ -1,4 +1,3 @@ -import { Button } from "@/components/elements/button"; import { prisma } from "@/lib/prisma"; import { Log } from "./log"; @@ -9,7 +8,6 @@ const getLogs = async () => { async function LogsPage() { const logs = await getLogs(); - console.log(logs); if (!logs || logs.length === 0) { return ( From dae36564bd2aa36ddf539ae1c15c916f7c036160 Mon Sep 17 00:00:00 2001 From: davitJabushanuri Date: Mon, 6 May 2024 22:46:17 +0400 Subject: [PATCH 32/33] feat: add admin link to the navbar --- src/features/navbar/assets/dashboard-icon.tsx | 9 +++++++++ src/features/navbar/components/navbar.tsx | 11 +++++++++++ 2 files changed, 20 insertions(+) create mode 100644 src/features/navbar/assets/dashboard-icon.tsx diff --git a/src/features/navbar/assets/dashboard-icon.tsx b/src/features/navbar/assets/dashboard-icon.tsx new file mode 100644 index 00000000..8a248701 --- /dev/null +++ b/src/features/navbar/assets/dashboard-icon.tsx @@ -0,0 +1,9 @@ +export const DashboardIcon = () => { + return ( + + ); +}; diff --git a/src/features/navbar/components/navbar.tsx b/src/features/navbar/components/navbar.tsx index 5597e392..0689cdbb 100644 --- a/src/features/navbar/components/navbar.tsx +++ b/src/features/navbar/components/navbar.tsx @@ -5,6 +5,7 @@ import { Tooltip } from "@/components/elements/tooltip"; import { BellActive, Bell } from "../assets/bell-icon"; import { Bookmark, BookmarkActive } from "../assets/bookmark-icon"; +import { DashboardIcon } from "../assets/dashboard-icon"; import { Envelope, EnvelopeActive } from "../assets/envelope-icon"; import { Gear, GearActive } from "../assets/gear-icon"; import { Hashtag, HashtagActive } from "../assets/hashtag-icon"; @@ -23,6 +24,16 @@ export const Navbar = () => { aria-label="Primary" className="flex flex-col items-center xxl:items-start" > + + : } + text="Dashboard" + aria-label="Admin Dashboard" + isActive={pathname === `/admin`} + /> + + {session && ( Date: Mon, 6 May 2024 22:54:42 +0400 Subject: [PATCH 33/33] feat: add admin and logs routes to admin navbar --- src/app/admin/admin-navbar.tsx | 32 +++++++++++++++++++++++++++++++- 1 file changed, 31 insertions(+), 1 deletion(-) diff --git a/src/app/admin/admin-navbar.tsx b/src/app/admin/admin-navbar.tsx index 0febaaf5..34fca8ea 100644 --- a/src/app/admin/admin-navbar.tsx +++ b/src/app/admin/admin-navbar.tsx @@ -1,3 +1,33 @@ +"use client"; +import Link from "next/link"; +import { usePathname } from "next/navigation"; + +import { cn } from "@/utils/cn"; + export const AdminNavbar = () => { - return
admin navbar
; + const pathname = usePathname(); + const path = pathname.split("/").at(-1); + + return ( + + ); };