I've been trying to implement smooth scrolling in my Next.js application using the new App Router using the lenis scroll package, but I'm having challenges making it work Here's what I'm trying to do: Enable smooth scrolling on my home…
I am creating a project component for my homepage which displays a project. When the user clicks on the component, I want the overall component to redirect to the specific project page. However, when they specifically click the GitHub icon,…
In my client I have: const [error, loginUser, pending] = useActionState(login, null); loginUser gets called from a login form: <form action={loginUser}>....</form> error keeps track of the error returned and if not-null then it shows a toast notification: useEffect(() => {…
I have problem that the favicon does not change when searched in google. This is the _document.tsx and the image exists in public folder. but it still take the last logo and not change to the new one <Html dir={dir}>…
I am using NextJS with Shadcn. I am trying to display a command component that contains a dynamic number of items from a database. This is a snippet of the line that is not working. Hard coding numbers works fine,…
I'm working on integrating a MultiSelectComponent from Syncfusion into the ScheduleComponent editor window. However, I encounter an error when clicking the input field. Uncaught TypeError: Cannot read properties of undefined (reading 'enqueueForceUpdate') at Component.forceUpdate (react.development.js:368:16) at ComponentBase.renderReactTemplates (component-base.js:473:18) at Observer.eval…
I'm working on a Next.js project where I fetch grades from a database using Prisma in the app directory. The fetched data is displayed using a GradesComponent. However, when I run npm run build, the page generates static files with…
My application takes too long to build, since there are about 300k pages to build on build time. It also means that I am reaching my cloud provider high limit of 1 hour per build. I am thinking about alternative…
I am using Next JS 14 and Tailwind CSS If I use fill this is code: "use client"; import React from "react"; import { motion } from "framer-motion"; import Image from "next/image"; const Photo = () => { return (…
I have been following a tutorial which uses the /pages directory, however, the newer versions of NextJS are using the /app directory. How to adapt the following pages into the new behavior. /pages/index.tsx import Head from "next/head"; import { useState…