Re Render default radio checked
React gives the following example of handling default values of inputs, specifically on radio buttons. https://react.dev/reference/react-dom/components/input#displaying-inputs-of-different-types. For some reason, when I implement this the re render on refresh does not render correctly. The value is set correctly, but the render looks like it sets it, then unsets it. Has anyone experienced this before?
I will note, that when I change the name of the inputs, it doesn't do this, but instead rendes the default value correctly. The below would set it correctly.
```<label><input type="radio" name="myRadio1" value="option1" /> Option 1</label? <label><input type="radio" name="myRadio2" value="option2" defaultChecked={true} /> Option 2</label>...
Microsoft Login W T3
Howdy! I followed this guide to the T https://microsoft.github.io/MicrosoftCloud/tutorials/docs/Authentication-App-With-NextJs-And-Microsoft-Graph/.
Unfortunately I think I might be off base in this approach as I am getting numerous errors when trying to sign in (I think this is moreso for internal organizations / internal oauth with company AD accounts?!)
Either way, I would essentially like to know if anyone knows how I can reproduce the microsoft login flow that Theo and team implemented for ping.gg...
tRPC Express server with Next.js
As much as I hate this, I am required to use Express for back-end and Next.js for front-end.
I have two Node.js projects, an Express server and a Next.js client.
I did a minimal setup on the back-end side using the Express adapter and it is working fine when i try to hit an endpoint on the browser....
❌ Invalid environment variables
I recently created a new t3 application using the pnpm create t3-app@latest command. After setting up all the necessary environment variables, I was able to successfully start the development server using pnpm dev. The application was functioning as expected, with both the database and authentication working properly.
However, when I attempted to use the pnpm drizzle-kit studio command, I encountered an issue. The attached image provides a visual representation of the problem.
I would appreciate any assistance in resolving this issue. Thank you....
Breaking-border on input fields
Does anybody have any resources for me to look at, or any examples on how to actually do a breaking-border label for a input field? Similar to how material ui's input fields look.
There's a few strategies I know of, which is using clip path (and calculating the width of the label) or using psuedo elements with a background color on the label itself. Both have their own issues, the clip-path strategy is just plain ugly and annoying, and the background color strategy will only work on one background color.
Is there a better way to go about it? Thanks!...
DatePicker for react-native
I need to build a date-picker as it is shown on the pic and I need it fast ;D
Are there any libs that could help me?...
Next seems to not be respecting the layout.tsx
Attached is my layout.tsx in the root of the app directory. However When I navigate to subpages, sometimes the navbar (which in the layout.tsx) isn't there, (until I refresh the page). Also, when I navigate back up to the home page via links, the header is also gone in the home page. Why might this be the case where I have to refresh the page for the Navbar in the layout.tsx to appear?
UploadThing spamming terminal with: "dev server is now running"
I am using the uploadthing useUploadThing hook in my NextJS project. The hook runs every time a modal renders, causing it to call the UploadThing API, which in turn spins up a dev server. The thing is the modal has quite a lot of state causing it to rerender often. This results in the hook constantly calling the API and my terminal getting spammed with "[UT] UploadThing dev server is now running!".
Is there some way to cache / make this hook global so it ONLY runs ONCE when the page is loaded?...
React components not rendering in mdx (contentlayer)
Attached is my MDX file and a screenshot of it rendering on the page. How can I import and use components in the posts, such that contentlayer correctly renders them in the final page?
TRPC / Prisma findMany not showing properties in auto completion
Ive been pulling my hair out for the last hour and cannot seem to find whats happening. In my TRPC router, I have the following very simple procedure defined (initially a unique model but seems to be a problem with everything using FindMany):
getAll: protectedProcedure.query(({ ctx }) => { return ctx.prisma.example.findMany(); }), ...
getAll: protectedProcedure.query(({ ctx }) => { return ctx.prisma.example.findMany(); }), ...
