I'm working on a React form using Ant Design's Form component. The form includes several dropdowns, including facility, specialization, and doctor. The doctor dropdown should be cleared whenever the facility or specialization dropdown values change, and the doctor dropdown should…
I'm working on a Next.js API route to handle user registration. The code is supposed to check if a username is already taken and return an appropriate response. However, I'm encountering an issue with the Response.json method. import dbConnect from…
Is it possible to navigate or go to another route using 'react-scroll' with NextJs14? For example: I want to navigate to the Blog Page. Or should I use Link from 'next/link' with pathname or params to extract the route name…
have been stuck on this for hours :( I have a hook, useCollection which is supposed to expose data fetched from my API and updated in realtime using a websocket. Works perfectly fine with just realtime, however id like to…
Hello guys I'm trying to pass refs to lazy load component but getting null instead of {current: null} please check where I'm doing mistake. 'use client'; import dynamic from 'next/dynamic'; import { useRef } from 'react'; const Component = dynamic(()…
I was trying to use react-py to use pyodide in my NextJs app. It requires it wrap the component where python is to be used with `PythonProvider`. I have used the PythonProvider and usePython in the same page (client side)…
Consider the following example: pages/index.js import { useState, useRef, useEffect } from 'react' function complexExternalLibraryFunctionWithoutCleanup(elem, cb) { elem.addEventListener('click', () => { cb() }) } export default function IndexPage() { const [text, setText] = useState('') const [myint, setMyint] = useState(0) const…
I have a Next.js client component which shows a data table and has a search bar which can be used to filter the table. The issue is that whenever I type in the search bar, it causes the whole component…
"use client"; import React, { useState } from "react"; import { useRouter } from "next/navigation"; import { zodResolver } from "@hookform/resolvers/zod"; import { useForm } from "react-hook-form"; import { z } from "zod"; import { api } from "@/trpc/react"; import…
I here want to fetch all 'products' using react query BUT 'build process' fails when using custom hooks inside 'useQuery', so it throws error in 'build process' but it works perfectly fine during 'development server' const { data, isPending, isError,…