Hello, I'm trying to get rid of Hydration keep coming out of my screen saying dispatchEvent. At first it was having div in html but i have resolved that and then dispatch error shows up. Below is the code for it which a footer in layout file.
import { Inter } from "next/font/google";
import "./globals.css";
const inter = Inter({ subsets: ["latin"] });
export const metadata: Metadata = {
title: "Student Information Zone",
description: "Testing",
};
export default function RootLayout({
children,
}: Readonly<{
children: React.ReactNode;
}>) {
return (
<html lang="en">
<head>
{/* Add metadata and other head elements here if needed */}
</head>
<body className={inter.className}>
{children}
<footer className="footer p-10 bg-base-200 text-base-content">
<aside>
<p>CampuSphere Ltd.<br />Providing reliable system since 2000.</p>
</aside>
<nav>
<h6 className="footer-title">Company</h6>
<a className="link link-hover">About us</a>
<a className="link link-hover">Contact</a>
</nav>
<nav>
<h6 className="footer-title">Legal</h6>
<a className="link link-hover">Terms of use</a>
<a className="link link-hover">Privacy policy</a>
</nav>
</footer>
</body>
</html>
);
}```