🐛 Bug: React Hydration Mismatch & Unrecognized <tableofcontent> tag warnings

Describe the bug

While running the JSON Schema website locally, I noticed two distinct React warnings flooding the developer console on the Homepage (/) and Documentation (/docs) pages:

• Hydration Mismatch & Missing src Errors: The initial Server-Side Rendered (SSR) HTML does not match the Client-side React tree. Specifically, theme-dependent SVG icons in the Sidebar drop expected src attributes, and elements like the APIDeck logo have mismatched alt text (newline vs space) during hydration. This forces React to discard the SSR HTML and re-render the components.

• Unrecognized Tag: A warning states: Warning: The tag is unrecognized in this browser. This occurs because the custom table of contents component is written as lowercase () in the markdown files, causing React to treat it as an invalid native HTML element instead of a mapped custom component.

Steps To Reproduce

1. Clone the repository and run yarn dev.
2. Navigate to the Homepage (/) or the Docs page (/docs).
3. Open the browser Developer Tools and go to the Console tab.
4. Perform a Hard Refresh to ensure you receive the fresh server-rendered HTML.
5. See the React Hydration warnings and the unrecognized tag warnings in the console logs.

Expected Behavior

1. The TableOfContent component should be capitalized properly (e.g., ) in both the .md documents and the markdown-to-jsx parser overrides to avoid invalid HTML tag warnings.

2. The console should be completely clean of Next.js hydration warnings. Theme-dependent images and SVG files should either define a default src on the server or wait until the client is mounted to render, to avoid SSR vs. Client mismatch.

Screenshots

Device Information [optional]

- OS:
- Browser:
- version:

Are you working on this issue?

Yes

Do you think this work might require an [Architectural Decision Record (ADR)]? (significant or noteworthy)

No

Run yarn dev and reproduce the warnings on / and /docs with a hard refresh. Inspect the markdown-to-JSX parser overrides and the theme-dependent Sidebar SVGs and APIDeck logo mentioned in the report. Done means the TableOfContent warning and the hydration warnings no longer appear in the browser console.