phone/src/services/server/components/LogsPage.tsx
2025-11-17 10:54:37 -08:00

63 lines
1.4 KiB
TypeScript

import { Layout } from "./Layout";
type LogsPageProps = {
logs: string;
};
export const LogsPage = ({ logs }: LogsPageProps) => (
<Layout title="Service Logs">
<h1>📋 Service Logs</h1>
<p>
<small>
<label>
<input type="checkbox" id="auto-refresh" checked /> Auto-refresh
</label>
{" | "}
<a href="/"> Back</a>
</small>
</p>
<pre>
<code id="logs-content">{logs.trim()}</code>
</pre>
<script>{`
let interval = null;
const checkbox = document.getElementById('auto-refresh');
const logsContent = document.getElementById('logs-content');
async function refreshLogs() {
try {
const res = await fetch('/api/logs');
const data = await res.json();
logsContent.textContent = data.logs;
} catch (error) {
console.error('Failed to refresh logs:', error);
}
}
function startRefresh() {
if (interval) clearInterval(interval);
interval = setInterval(refreshLogs, 5000);
}
function stopRefresh() {
if (interval) {
clearInterval(interval);
interval = null;
}
}
checkbox.addEventListener('change', (e) => {
if (e.target.checked) {
startRefresh();
} else {
stopRefresh();
}
});
// Start auto-refresh by default
startRefresh();
`}</script>
</Layout>
);