o11y/frontend/index.html

<!doctype html>
<html lang="en">
	<head>
		<meta charset="utf-8" />
		<base href="[[.BaseHref]]" />
		<meta
			http-equiv="Cache-Control"
			content="no-cache, no-store, must-revalidate, max-age: 0"
		/>
		<meta http-equiv="Pragma" content="no-cache" />
		<meta http-equiv="Expires" content="0" />

		<title data-react-helmet="true">
			Hanzo O11y
		</title>
		<meta
			data-react-helmet="true"
			property="og:title"
			content="Hanzo O11y"
		/>
		<meta
			data-react-helmet="true"
			name="description"
			content="Hanzo O11y is a unified observability platform for metrics, traces, and logs with deep filtering and aggregation to find and resolve issues quickly."
		/>
		<meta
			data-react-helmet="true"
			property="og:description"
			content="Hanzo O11y is a unified observability platform for metrics, traces, and logs with deep filtering and aggregation to find and resolve issues quickly."
		/>
		<meta
			data-react-helmet="true"
			property="og:image"
			content="/Logos/hanzo-icon.svg"
		/>
		<meta
			data-react-helmet="true"
			name="twitter:image"
			content="/Logos/hanzo-icon.svg"
		/>
		<meta
			data-react-helmet="true"
			name="twitter:image:alt"
			content="Hanzo O11y"
		/>
		<meta
			data-react-helmet="true"
			name="twitter:card"
			content="summary_large_image"
		/>
		<meta data-react-helmet="true" name="docusaurus_locale" content="en" />
		<meta data-react-helmet="true" name="docusaurus_tag" content="default" />
		<meta name="robots" content="noindex" />
		<link data-react-helmet="true" rel="shortcut icon" href="favicon.ico" />
	</head>
	<body data-theme="default">
		<script>
			// Apply theme class synchronously before React renders to prevent flash.
			// Mirrors the logic in ThemeProvider (hooks/useDarkMode/index.tsx).
			(function () {
				try {
					// When served under a URL prefix (e.g. /o11y/), storage keys are scoped
					// to that prefix by the React app (see utils/storage.ts getScopedKey).
					// Read the <base> tag — already populated by the Go template — to derive
					// the same prefix here, before any JS module has loaded.
					var basePath =
						(document.querySelector('base') || {}).getAttribute('href') || '/';
					var prefix = basePath === '/' ? '' : basePath;
					var theme = localStorage.getItem(prefix + 'THEME');
					var autoSwitch =
						localStorage.getItem(prefix + 'THEME_AUTO_SWITCH') === 'true';
					if (autoSwitch) {
						theme = window.matchMedia('(prefers-color-scheme: dark)').matches
							? 'dark'
							: 'light';
					}
					if (theme === 'light') {
						document.body.classList.add('lightMode');
					} else {
						// Default to dark when no preference is stored
						document.body.classList.add('dark', 'darkMode');
					}
				} catch (e) {
					document.body.classList.add('dark', 'darkMode');
				}
			})();
		</script>
		<script type="application/json" id="o11y-boot-settings">
			[[.Settings]]
		</script>
		<script>
			try {
				var _el = document.getElementById('o11y-boot-settings');
				window.o11yBootData = {
					settings: _el ? JSON.parse(_el.textContent) : null,
				};
			} catch (e) {
				window.o11yBootData = { settings: null };
			}
		</script>
		<noscript>You need to enable JavaScript to run this app.</noscript>
		<div id="root"></div>

		<!--
			NO third-party widgets or trackers are loaded here, and none may be
			added. The upstream fork injected a support-chat widget and an
			onboarding tracker, both enabled by default — a self-hosted
			observability tool must never make outbound calls to third parties
			with our users' data. Support chat is Hanzo Chat (utils/supportChat);
			analytics is Hanzo Insights. Sentry is opt-in, on our own fork.
		-->
		<link rel="stylesheet" href="css/uPlot.min.css" />
		<script type="module" src="./src/index.tsx"></script>
	</body>
</html>