Info
Hey! I am new to web dev and therein also NextJS - I do however have 7 years of gamedev and generalized software developer experience so to say I dont know programming isnt the case.

Now I am in the situration where I learn best getting feet first into a project and then make it bad and slowly apply concepts as I go along. I also benefit from hearing things from different sources.

The stack
Now this term is a bit new for me. So there might be some flufff here. I am using NextJS and the only thing I added is mysql and DaisyUI (There in tailwindcss too)

The problem
What I am stumped on is like I have a navbar component. This component can change the theme. The part of the structure where that theme needs to be read is in Layout.tsx where we got a theme attribute in the header.

What I need from you
I need some guidence. If you got the time to sit down and explain that be very nice but else as much "Where to look in documentation" or a "This is the concept you skipped over to do this"

Code that I think matters

Layout.tsx
https://hastebin.skyra.pw/mebagakuri.ts

Navbar.Js - a component
https://hastebin.skyra.pw/fawatiyaho.ts