I m using this navbar
I created one component with navbar, the I m calling it on my src/app/page.tsx
"use client";
import Login from "../app/pages/login/page";
import Dashboard from "../app/pages/dashboard/page";
import { useAppSelector } from "./hooks/hooks";
import Header from "./components/layout/header";
export default function Home() {
const userLogged = useAppSelector((state) => state.UserLogged.userLogged.onLine);
return (
<>
{
userLogged?
<>
<Header />
<Dashboard />
</>
:
<Login />
}
</>
)
}
and I configure my layout.tsx, calling flowbite.min.js
return (
<html lang="en">
<body>
<Router>
<Provider store={store}>
{children}
</Provider>
</Router>
<script src="https://cdnjs.cloudflare.com/ajax/libs/flowbite/1.6.6/flowbite.min.js"></script>
</body>
</html>
)
so I follow the configuration of flowbite
so, the app run, perfect, but the option Dropdown on navBar is not working, what s wrong?? what I m doing wrong?
notice that this error started coming up when i added the <Provider store={store}>
I was testing it, if I remove tags Provider and Router of my layout.tsx file, like:
<html lang="en">
<body>
{children}
<script src="https://cdnjs.cloudflare.com/ajax/libs/flowbite/1.6.6/flowbite.min.js"></script>
</body>
</html>
the option dropDown work: Image 1
but if I add tags Provider and Router of my layout.tsx file, like:
<html lang="en">
<body>
<Router>
<Provider store={store}>
{children}
</Provider>
</Router>
<script src="https://cdnjs.cloudflare.com/ajax/libs/flowbite/1.6.6/flowbite.min.js"></script>
</body>
</html>
don t work the option dropDown: image 2
you can check on codesandbox.io
whe you in, click on "click here" and then you can see that the header dropdown is not working