From 1696fc7076220b61575479002be6a88c6c56c7e2 Mon Sep 17 00:00:00 2001 From: seog-jun Date: Wed, 18 Oct 2023 12:18:17 -0400 Subject: [PATCH 1/6] Added 'gradient' CSS for 'NextTopLoader' --- styles/globals.css | 16 ++++++++++++++++ 1 file changed, 16 insertions(+) diff --git a/styles/globals.css b/styles/globals.css index cd42f16f..85a5a874 100644 --- a/styles/globals.css +++ b/styles/globals.css @@ -350,3 +350,19 @@ table div { transform: translate(24px, 0); } } + +@layer { + .gradient { + background-image: linear-gradient( + to right, + rgb(251, 146, 60), + rgb(219, 39, 119) + ); + height: 0.25rem; + width: 100%; + left: 0px; + top: 0px; + position: fixed; + z-index: 50; + } +} From de7dcc1a8ccac6a1069e283aaa8c572102e7a6ca Mon Sep 17 00:00:00 2001 From: seog-jun Date: Wed, 18 Oct 2023 12:18:50 -0400 Subject: [PATCH 2/6] Installed 'nextjs-toploader' --- package-lock.json | 30 +++++++++++++++++++++++++++--- package.json | 1 + 2 files changed, 28 insertions(+), 3 deletions(-) diff --git a/package-lock.json b/package-lock.json index 366969b9..7c298ab1 100644 --- a/package-lock.json +++ b/package-lock.json @@ -63,6 +63,7 @@ "next-auth": "^4.23.1", "next-superjson-plugin": "^0.5.9", "next-themes": "^0.2.1", + "nextjs-toploader": "^1.5.3", "nodemailer": "^6.9.4", "prismjs": "^1.29.0", "react": "^18.2.0", @@ -6934,6 +6935,11 @@ "@types/node": "*" } }, + "node_modules/@types/nprogress": { + "version": "0.2.2", + "resolved": "https://registry.npmjs.org/@types/nprogress/-/nprogress-0.2.2.tgz", + "integrity": "sha512-2wLrSJXLztGmr7wXwM0hA/wuIOY9DznVdd+ZFofHOiXcj9JnVt+2ZeLRJ7v5ZVlmheSkUOSg3Q3O4Ce7yji79A==" + }, "node_modules/@types/object.omit": { "version": "3.0.1", "resolved": "https://registry.npmjs.org/@types/object.omit/-/object.omit-3.0.1.tgz", @@ -13462,6 +13468,21 @@ "url": "https://github.com/sponsors/colinhacks" } }, + "node_modules/nextjs-toploader": { + "version": "1.5.3", + "resolved": "https://registry.npmjs.org/nextjs-toploader/-/nextjs-toploader-1.5.3.tgz", + "integrity": "sha512-kNqgpOxVeo7ihMZqNzxtsCNcO0lo1NNjxhCtnJ2qgTKxgppMGpuSVU4FTMaCOefamVop1mWk1Ij3C2pBP5NwPg==", + "dependencies": { + "@types/nprogress": "^0.2.1", + "nprogress": "^0.2.0", + "prop-types": "^15.8.1" + }, + "peerDependencies": { + "next": ">= 6.0.0", + "react": ">= 16.0.0", + "react-dom": ">= 16.0.0" + } + }, "node_modules/node-abi": { "version": "3.50.0", "resolved": "https://registry.npmjs.org/node-abi/-/node-abi-3.50.0.tgz", @@ -13594,6 +13615,11 @@ "node": ">=8" } }, + "node_modules/nprogress": { + "version": "0.2.0", + "resolved": "https://registry.npmjs.org/nprogress/-/nprogress-0.2.0.tgz", + "integrity": "sha512-I19aIingLgR1fmhftnbWWO3dXc0hSxqHQHQb3H8m+K3TnEn/iSeTZZOyvKXWqQESMwuUVnatlCnZdLBZZt2VSA==" + }, "node_modules/nth-check": { "version": "2.1.1", "resolved": "https://registry.npmjs.org/nth-check/-/nth-check-2.1.1.tgz", @@ -14510,7 +14536,6 @@ "version": "15.8.1", "resolved": "https://registry.npmjs.org/prop-types/-/prop-types-15.8.1.tgz", "integrity": "sha512-oj87CgZICdulUohogVAR7AjlC0327U4el4L6eAvOqCeudMDVU0NThNaV+b9Df4dXgSP1gXMTnPdhfe/2qDH5cg==", - "dev": true, "dependencies": { "loose-envify": "^1.4.0", "object-assign": "^4.1.1", @@ -14520,8 +14545,7 @@ "node_modules/prop-types/node_modules/react-is": { "version": "16.13.1", "resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz", - "integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==", - "dev": true + "integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==" }, "node_modules/prosemirror-changeset": { "version": "2.2.1", diff --git a/package.json b/package.json index 49fe6dee..a3d38a46 100644 --- a/package.json +++ b/package.json @@ -77,6 +77,7 @@ "next-auth": "^4.23.1", "next-superjson-plugin": "^0.5.9", "next-themes": "^0.2.1", + "nextjs-toploader": "^1.5.3", "nodemailer": "^6.9.4", "prismjs": "^1.29.0", "react": "^18.2.0", From 1b6366c86d8289f73d246b7bcdefbf71f3213b69 Mon Sep 17 00:00:00 2001 From: seog-jun Date: Wed, 18 Oct 2023 12:20:30 -0400 Subject: [PATCH 3/6] Added 'NextTopLoader' instead of 'ProgressBar' --- app/layout.tsx | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/app/layout.tsx b/app/layout.tsx index 23197be8..9294d3f8 100644 --- a/app/layout.tsx +++ b/app/layout.tsx @@ -9,7 +9,7 @@ import Nav from "@/components/Nav/Nav"; import { getServerAuthSession } from "@/server/auth"; import AuthProvider from "@/context/AuthProvider"; // @TODO layout app in way that doesn't need to use client session check - +import NextTopLoader from "nextjs-toploader"; export const metadata = { title: "Codú - The Web Developer Community", description: @@ -34,6 +34,10 @@ export default async function RootLayout({ {/* Needs to be fixed */} + From ec21e24d430abf26c03d3cd05c667113787c9457 Mon Sep 17 00:00:00 2001 From: seog-jun Date: Thu, 19 Oct 2023 06:34:19 -0400 Subject: [PATCH 4/6] Added 'linear' to keep the same speed --- app/layout.tsx | 1 + 1 file changed, 1 insertion(+) diff --git a/app/layout.tsx b/app/layout.tsx index 9294d3f8..33a8d573 100644 --- a/app/layout.tsx +++ b/app/layout.tsx @@ -35,6 +35,7 @@ export default async function RootLayout({ From c866d9663b88b5312d27d1c3e9a3b974caf3fdc9 Mon Sep 17 00:00:00 2001 From: seog-jun Date: Thu, 19 Oct 2023 06:44:33 -0400 Subject: [PATCH 5/6] Reference is added to 'next-env.d.ts' --- next-env.d.ts | 1 - 1 file changed, 1 deletion(-) diff --git a/next-env.d.ts b/next-env.d.ts index fd36f949..4f11a03d 100644 --- a/next-env.d.ts +++ b/next-env.d.ts @@ -1,6 +1,5 @@ /// /// -/// // NOTE: This file should not be edited // see https://nextjs.org/docs/basic-features/typescript for more information. From 5f5216470fadb6d4a37bcda4027e952ee2fdb996 Mon Sep 17 00:00:00 2001 From: seog-jun Date: Thu, 19 Oct 2023 15:02:04 -0400 Subject: [PATCH 6/6] Removed 'ProgressBar' component and unused package --- app/layout.tsx | 4 +- components/ProgressBar/ProgressBar.tsx | 56 -------------------------- package-lock.json | 14 ------- package.json | 1 - 4 files changed, 1 insertion(+), 74 deletions(-) delete mode 100644 components/ProgressBar/ProgressBar.tsx diff --git a/app/layout.tsx b/app/layout.tsx index 33a8d573..7f56f18d 100644 --- a/app/layout.tsx +++ b/app/layout.tsx @@ -1,15 +1,14 @@ import "../styles/globals.css"; import { headers } from "next/headers"; import Fathom from "@/components/Fathom/Fathom"; -// import ProgressBar from "@/components/ProgressBar/ProgressBar"; import ThemeProvider from "@/components/Theme/ThemeProvider"; import { TRPCReactProvider } from "@/server/trpc/react"; import Footer from "@/components/Footer/Footer"; import Nav from "@/components/Nav/Nav"; import { getServerAuthSession } from "@/server/auth"; import AuthProvider from "@/context/AuthProvider"; -// @TODO layout app in way that doesn't need to use client session check import NextTopLoader from "nextjs-toploader"; +// @TODO layout app in way that doesn't need to use client session check export const metadata = { title: "Codú - The Web Developer Community", description: @@ -31,7 +30,6 @@ export default async function RootLayout({ const session = await getServerAuthSession(); return ( - {/* Needs to be fixed */} { - const router = useRouter(); - - const [isAnimating, setIsAnimating] = useState(false); - - const { animationDuration, isFinished, progress } = useNProgress({ - isAnimating, - }); - - useEffect(() => { - function onRouteChangeStart() { - setIsAnimating(true); - } - - function onRouteChangeComplete() { - setIsAnimating(false); - } - - router.events.on("routeChangeStart", onRouteChangeStart); - router.events.on("routeChangeComplete", onRouteChangeComplete); - - // Unassign event listener - return () => { - router.events.off("routeChangeComplete", onRouteChangeComplete); - router.events.off("routeChangeStart", onRouteChangeStart); - }; - }, [router]); - - return ( -
-
-
- ); -}; - -export default ProgressBar; diff --git a/package-lock.json b/package-lock.json index 7c298ab1..378506fd 100644 --- a/package-lock.json +++ b/package-lock.json @@ -24,7 +24,6 @@ "@sentry/nextjs": "^7.73.0", "@styled-icons/material": "^10.47.0", "@tailwindcss/forms": "^0.5.6", - "@tanem/react-nprogress": "^5.0.49", "@tanstack/react-query": "^4.35.0", "@tiptap/extension-color": "^2.1.6", "@tiptap/extension-highlight": "^2.1.6", @@ -5947,19 +5946,6 @@ "tailwindcss": ">=3.0.0 || insiders" } }, - "node_modules/@tanem/react-nprogress": { - "version": "5.0.51", - "resolved": "https://registry.npmjs.org/@tanem/react-nprogress/-/react-nprogress-5.0.51.tgz", - "integrity": "sha512-YxNUCpznuBVA+PhjEzFmxaa1czXgU+5Ojchw5JBK7DQS6SHIgNudpFohWpNBWMu2KWByGJ2OLH2OwbM/XyP18Q==", - "dependencies": { - "@babel/runtime": "^7.22.15", - "hoist-non-react-statics": "^3.3.2" - }, - "peerDependencies": { - "react": "^16.8.0 || ^17.0.0 || ^18.0.0", - "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0" - } - }, "node_modules/@tanstack/query-core": { "version": "4.36.1", "resolved": "https://registry.npmjs.org/@tanstack/query-core/-/query-core-4.36.1.tgz", diff --git a/package.json b/package.json index a3d38a46..c2ca4956 100644 --- a/package.json +++ b/package.json @@ -38,7 +38,6 @@ "@sentry/nextjs": "^7.73.0", "@styled-icons/material": "^10.47.0", "@tailwindcss/forms": "^0.5.6", - "@tanem/react-nprogress": "^5.0.49", "@tanstack/react-query": "^4.35.0", "@tiptap/extension-color": "^2.1.6", "@tiptap/extension-highlight": "^2.1.6",