[Feat/UI]: Implement Operations Console Theme Providers and Theme Toggle Switches

Problem

We have successfully assembled our core dashboard console layout grids and collapsible multi-region cluster trees under issues #38 and #39. To maximize visual tracing clarity for infrastructure administrators monitoring high-frequency operations continuously, we need a global UI theme provider configuration layer to manage theme switching transitions smoothly without causing rendering ticks or flashing artifacts across text terminal components.

Proposed Solution

Develop and integrate a low-overhead, modular theme management system inside /dashboard/components/ThemeProvider.tsx utilizing standard Next.js layouts and Tailwind dark-mode state mechanisms.

• Build a lightweight React Theme Context pipeline to detect, apply, and persist user style preferences (dark / light) inside browser local storage arrays seamlessly.
• Design an isolated, minimalist Theme Toggle switch button component equipped with clean vector paths to swap document class states instantly with less than 5ms execution latency.
• Ensure the application theme default properties fallback cleanly to pure black backgrounds (bg-black / slate-950 text coordinates) to guarantee optical relief for system operators triaging high-frequency incoming logs arrays during extended tracking shifts.

Alternatives

• Importing large third-party runtime component configuration frameworks, which injects unneeded dependency layout trees and spikes bundle sizes during open-source developer onboarding flows.

Use Case

Provides a professional, high-fidelity dark-interface base standard for our metrics tracking command application plane, enabling frontend contributors to build nested visual widgets cleanly without requiring access to lower-level Go data-plane proxies.

Additional Notes

This layout framework must remain strictly independent of backend network daemon scripts. Drop a comment below if you want this task assigned to you!

Start with /dashboard/components/ThemeProvider.tsx and the standard Next.js layout configuration, then trace how Tailwind dark-mode state is applied across the dashboard. Done means light and dark preferences are detected, persisted in browser local storage, applied without visible flashing, and exposed through an isolated theme toggle with the specified dark fallback.