@promptbook/cli 0.112.0-93 → 0.112.0-95

package/apps/agents-server/src/app/admin/_components/AdminConfigurationShell.tsx

@@ -6,7 +6,7 @@ import Link from 'next/link';
  *
  * @private admin configuration UI helper
  */
-type AdminConfigurationPage = 'metadata' | 'limits';
+type AdminConfigurationPage = 'environment' | 'metadata' | 'limits';
 
 /**
  * One shared navigation item rendered in the configuration shell.
@@ -15,15 +15,21 @@ type AdminConfigurationPage = 'metadata' | 'limits';
  */
 const ADMIN_CONFIGURATION_NAVIGATION_ITEMS: ReadonlyArray<{
     readonly id: AdminConfigurationPage;
-    readonly href: '/admin/metadata' | '/admin/limits';
+    readonly href: '/admin/environment' | '/admin/metadata' | '/admin/limits';
     readonly label: string;
     readonly description: string;
 }> = [
+    {
+        id: 'environment',
+        href: '/admin/environment',
+        label: 'Environment variables',
+        description: 'VPS-wide .env values with secrets masked in the browser.',
+    },
     {
         id: 'metadata',
         href: '/admin/metadata',
         label: 'Metadata',
-        description: 'Feature flags, text settings, and legacy compatibility keys.',
+        description: 'Domain-specific feature flags, text settings, and compatibility keys.',
     },
     {
         id: 'limits',
@@ -44,7 +50,7 @@ type AdminConfigurationShellProps = {
 };
 
 /**
- * Shared page shell used by the Metadata and Limits admin pages.
+ * Shared page shell used by the Environment variables, Metadata, and Limits admin pages.
  */
 export function AdminConfigurationShell({ activePage, children }: AdminConfigurationShellProps) {
     return (
@@ -53,11 +59,11 @@ export function AdminConfigurationShell({ activePage, children }: AdminConfigura
                 <div>
                     <h1 className="text-3xl font-light text-gray-900">Server configuration</h1>
                     <p className="mt-1 max-w-3xl text-sm text-gray-500">
-                        Manage raw metadata together with dedicated operational limits. Deprecated compatibility metadata
-                        stays visible, but active quota changes belong on the Limits page.
+                        Manage VPS-wide environment variables, domain-specific metadata, and dedicated operational
+                        limits from one configuration area.
                     </p>
                 </div>
-                <div className="grid gap-3 md:grid-cols-2">
+                <div className="grid gap-3 md:grid-cols-3">
                     {ADMIN_CONFIGURATION_NAVIGATION_ITEMS.map((item) => {
                         const isActive = item.id === activePage;
 

package/apps/agents-server/src/app/admin/code-runners/CodeRunnersClient.tsx

@@ -0,0 +1,225 @@
+'use client';
+
+import { Loader2, Save, ServerCog } from 'lucide-react';
+import { useEffect, useState } from 'react';
+import { Card } from '../../../components/Homepage/Card';
+
+/**
+ * Code-runner API response.
+ */
+type CodeRunnersResponse = {
+    readonly agent?: string;
+    readonly model?: string;
+    readonly thinkingLevel?: string;
+    readonly status?: string;
+    readonly applyResult?: {
+        readonly isAvailable: boolean;
+        readonly output: string;
+    } | null;
+    readonly error?: string;
+};
+
+/**
+ * Supported runner options shown by the standalone UI.
+ */
+const RUNNER_OPTIONS = [
+    { value: 'github-copilot', label: 'GitHub Copilot' },
+    { value: 'openai-codex', label: 'OpenAI Codex' },
+    { value: 'claude-code', label: 'Claude Code' },
+    { value: 'opencode', label: 'Opencode' },
+    { value: 'gemini', label: 'Gemini' },
+] as const;
+
+/**
+ * Shared input styling for code-runner controls.
+ */
+const INPUT_CLASS_NAME =
+    'w-full rounded-md border border-gray-300 px-3 py-2 text-sm text-gray-900 shadow-sm focus:border-blue-500 focus:outline-none focus:ring-2 focus:ring-blue-200 disabled:bg-gray-50 disabled:text-gray-500';
+
+/**
+ * Client UI for configuring the local coding runner used by durable chats.
+ */
+export function CodeRunnersClient() {
+    const [agent, setAgent] = useState('github-copilot');
+    const [model, setModel] = useState('gpt-5.4');
+    const [thinkingLevel, setThinkingLevel] = useState('xhigh');
+    const [status, setStatus] = useState('');
+    const [isLoading, setIsLoading] = useState(true);
+    const [isSaving, setIsSaving] = useState(false);
+    const [errorMessage, setErrorMessage] = useState<string | null>(null);
+    const [successMessage, setSuccessMessage] = useState<string | null>(null);
+    const [applyOutput, setApplyOutput] = useState<string | null>(null);
+
+    useEffect(() => {
+        void loadConfiguration();
+    }, []);
+
+    /**
+     * Loads current code-runner settings.
+     */
+    async function loadConfiguration(): Promise<void> {
+        try {
+            setIsLoading(true);
+            setErrorMessage(null);
+            const response = await fetch('/api/admin/code-runners', { cache: 'no-store' });
+            const payload = (await response.json()) as CodeRunnersResponse;
+
+            if (!response.ok) {
+                throw new Error(payload.error || 'Failed to load code-runner configuration.');
+            }
+
+            setAgent(payload.agent || 'github-copilot');
+            setModel(payload.model || 'gpt-5.4');
+            setThinkingLevel(payload.thinkingLevel || 'xhigh');
+            setStatus(payload.status || '');
+        } catch (error) {
+            setErrorMessage(error instanceof Error ? error.message : 'Failed to load code-runner configuration.');
+        } finally {
+            setIsLoading(false);
+        }
+    }
+
+    /**
+     * Saves code-runner settings into `.env`.
+     */
+    async function saveConfiguration(applyRuntimeConfiguration: boolean): Promise<void> {
+        try {
+            setIsSaving(true);
+            setErrorMessage(null);
+            setSuccessMessage(null);
+            setApplyOutput(null);
+
+            const response = await fetch('/api/admin/code-runners', {
+                method: 'PATCH',
+                headers: {
+                    'Content-Type': 'application/json',
+                },
+                body: JSON.stringify({ agent, model, thinkingLevel, applyRuntimeConfiguration }),
+            });
+            const payload = (await response.json()) as CodeRunnersResponse;
+
+            if (!response.ok) {
+                throw new Error(payload.error || 'Failed to save code-runner configuration.');
+            }
+
+            setAgent(payload.agent || agent);
+            setModel(payload.model || model);
+            setThinkingLevel(payload.thinkingLevel || thinkingLevel);
+            setStatus(payload.status || '');
+            setApplyOutput(payload.applyResult?.output || null);
+            setSuccessMessage(
+                applyRuntimeConfiguration
+                    ? 'Code-runner configuration was saved and applied.'
+                    : 'Code-runner configuration was saved.',
+            );
+        } catch (error) {
+            setErrorMessage(error instanceof Error ? error.message : 'Failed to save code-runner configuration.');
+        } finally {
+            setIsSaving(false);
+        }
+    }
+
+    return (
+        <div className="container mx-auto space-y-6 px-4 py-8">
+            <div className="mt-20">
+                <h1 className="text-3xl font-light text-gray-900">Code runners</h1>
+                <p className="mt-1 text-sm text-gray-500">
+                    Configure the local runner used by the standalone Agents Server durable chat worker.
+                </p>
+            </div>
+
+            {errorMessage && (
+                <div className="rounded-xl border border-rose-200 bg-rose-50 px-4 py-3 text-sm text-rose-700">
+                    {errorMessage}
+                </div>
+            )}
+            {successMessage && (
+                <div className="rounded-xl border border-emerald-200 bg-emerald-50 px-4 py-3 text-sm text-emerald-700">
+                    {successMessage}
+                </div>
+            )}
+
+            <Card className="hover:border-gray-200 hover:shadow-md">
+                <div className="grid gap-5 md:grid-cols-3">
+                    <label className="space-y-2">
+                        <span className="text-sm font-semibold text-slate-700">Runner</span>
+                        <select
+                            value={agent}
+                            onChange={(event) => setAgent(event.target.value)}
+                            disabled={isLoading || isSaving}
+                            className={INPUT_CLASS_NAME}
+                        >
+                            {RUNNER_OPTIONS.map((option) => (
+                                <option key={option.value} value={option.value}>
+                                    {option.label}
+                                </option>
+                            ))}
+                        </select>
+                    </label>
+                    <label className="space-y-2">
+                        <span className="text-sm font-semibold text-slate-700">Model</span>
+                        <input
+                            type="text"
+                            value={model}
+                            onChange={(event) => setModel(event.target.value)}
+                            disabled={isLoading || isSaving}
+                            className={INPUT_CLASS_NAME}
+                        />
+                    </label>
+                    <label className="space-y-2">
+                        <span className="text-sm font-semibold text-slate-700">Thinking level</span>
+                        <input
+                            type="text"
+                            value={thinkingLevel}
+                            onChange={(event) => setThinkingLevel(event.target.value)}
+                            disabled={isLoading || isSaving}
+                            className={INPUT_CLASS_NAME}
+                        />
+                    </label>
+                </div>
+
+                <div className="mt-6 flex flex-wrap items-center gap-3">
+                    <button
+                        type="button"
+                        onClick={() => void saveConfiguration(false)}
+                        disabled={isLoading || isSaving}
+                        className="inline-flex items-center gap-2 rounded-md bg-blue-600 px-4 py-2 text-sm font-semibold text-white hover:bg-blue-700 disabled:cursor-not-allowed disabled:opacity-60"
+                    >
+                        {isSaving ? <Loader2 className="h-4 w-4 animate-spin" /> : <Save className="h-4 w-4" />}
+                        Save runner
+                    </button>
+                    <button
+                        type="button"
+                        onClick={() => void saveConfiguration(true)}
+                        disabled={isLoading || isSaving}
+                        className="inline-flex items-center gap-2 rounded-md border border-slate-300 bg-white px-4 py-2 text-sm font-semibold text-slate-700 hover:bg-slate-50 disabled:cursor-not-allowed disabled:opacity-60"
+                    >
+                        {isSaving ? <Loader2 className="h-4 w-4 animate-spin" /> : <ServerCog className="h-4 w-4" />}
+                        Save and apply runner
+                    </button>
+                </div>
+            </Card>
+
+            {applyOutput ? (
+                <pre className="max-h-72 overflow-auto rounded-xl border border-slate-200 bg-slate-950 p-4 text-xs text-slate-100">
+                    {applyOutput}
+                </pre>
+            ) : null}
+
+            <Card className="hover:border-gray-200 hover:shadow-md">
+                <div className="space-y-3">
+                    <h2 className="text-lg font-semibold text-slate-900">Authentication</h2>
+                    <p className="text-sm text-slate-600">
+                        GitHub Copilot still requires an interactive CLI login and project trust setup on the VPS
+                        terminal. Use <span className="font-mono">sudo -u $USER copilot</span>, run{' '}
+                        <span className="font-mono">/login</span> when prompted, trust the install directory, then
+                        restart the pm2 process.
+                    </p>
+                    <pre className="max-h-64 overflow-auto rounded-xl border border-slate-200 bg-slate-950 p-4 text-xs text-slate-100">
+                        {status || 'Runner status was not available.'}
+                    </pre>
+                </div>
+            </Card>
+        </div>
+    );
+}

package/apps/agents-server/src/app/admin/code-runners/page.tsx

@@ -0,0 +1,14 @@
+import { ForbiddenPage } from '../../../components/ForbiddenPage/ForbiddenPage';
+import { isUserGlobalAdmin } from '../../../utils/isUserGlobalAdmin';
+import { CodeRunnersClient } from './CodeRunnersClient';
+
+/**
+ * Super-admin page for configuring standalone code runners.
+ */
+export default async function CodeRunnersPage() {
+    if (!(await isUserGlobalAdmin())) {
+        return <ForbiddenPage />;
+    }
+
+    return <CodeRunnersClient />;
+}

package/apps/agents-server/src/app/admin/environment/EnvironmentVariablesClient.tsx

@@ -0,0 +1,259 @@
+'use client';
+
+import { EyeOff, Loader2, Save, ServerCog } from 'lucide-react';
+import { useEffect, useMemo, useState } from 'react';
+import { Card } from '../../../components/Homepage/Card';
+
+/**
+ * One environment variable returned by the admin API.
+ */
+type EnvironmentVariableRecord = {
+    readonly key: string;
+    readonly value: string;
+    readonly isSensitive: boolean;
+    readonly isDefined: boolean;
+};
+
+/**
+ * Environment API response consumed by the client page.
+ */
+type EnvironmentVariablesResponse = {
+    readonly envFilePath: string;
+    readonly variables: ReadonlyArray<EnvironmentVariableRecord>;
+    readonly canEdit: boolean;
+    readonly error?: string;
+    readonly applyResult?: {
+        readonly isAvailable: boolean;
+        readonly output: string;
+    } | null;
+};
+
+/**
+ * Shared input styling for environment rows.
+ */
+const INPUT_CLASS_NAME =
+    'w-full rounded-md border border-gray-300 px-3 py-2 text-sm font-mono text-gray-900 shadow-sm focus:border-blue-500 focus:outline-none focus:ring-2 focus:ring-blue-200 disabled:bg-gray-50 disabled:text-gray-500';
+
+/**
+ * Placeholder shown instead of sensitive environment values.
+ */
+const HIDDEN_ENVIRONMENT_VALUE = '********';
+
+/**
+ * Browser UI for standalone VPS environment variables.
+ */
+export function EnvironmentVariablesClient() {
+    const [envFilePath, setEnvFilePath] = useState('');
+    const [variables, setVariables] = useState<EnvironmentVariableRecord[]>([]);
+    const [draftValues, setDraftValues] = useState<Record<string, string>>({});
+    const [canEdit, setCanEdit] = useState(false);
+    const [isLoading, setIsLoading] = useState(true);
+    const [isSaving, setIsSaving] = useState(false);
+    const [errorMessage, setErrorMessage] = useState<string | null>(null);
+    const [successMessage, setSuccessMessage] = useState<string | null>(null);
+    const [applyOutput, setApplyOutput] = useState<string | null>(null);
+
+    const hasChanges = useMemo(
+        () => variables.some((variable) => draftValues[variable.key] !== variable.value),
+        [draftValues, variables],
+    );
+
+    useEffect(() => {
+        void loadVariables();
+    }, []);
+
+    /**
+     * Loads environment variables from the admin API.
+     */
+    async function loadVariables(): Promise<void> {
+        try {
+            setIsLoading(true);
+            setErrorMessage(null);
+            const response = await fetch('/api/admin/environment', { cache: 'no-store' });
+            const payload = (await response.json()) as EnvironmentVariablesResponse;
+
+            if (!response.ok) {
+                throw new Error(payload.error || 'Failed to load environment variables.');
+            }
+
+            setEnvFilePath(payload.envFilePath);
+            setVariables([...payload.variables]);
+            setDraftValues(Object.fromEntries(payload.variables.map((variable) => [variable.key, variable.value])));
+            setCanEdit(payload.canEdit);
+        } catch (error) {
+            setErrorMessage(error instanceof Error ? error.message : 'Failed to load environment variables.');
+        } finally {
+            setIsLoading(false);
+        }
+    }
+
+    /**
+     * Persists current environment drafts.
+     *
+     * @param applyRuntimeConfiguration - Whether to run the VPS apply step after saving.
+     */
+    async function saveVariables(applyRuntimeConfiguration: boolean): Promise<void> {
+        try {
+            setIsSaving(true);
+            setErrorMessage(null);
+            setSuccessMessage(null);
+            setApplyOutput(null);
+
+            const response = await fetch('/api/admin/environment', {
+                method: 'PATCH',
+                headers: {
+                    'Content-Type': 'application/json',
+                },
+                body: JSON.stringify({
+                    variables: draftValues,
+                    applyRuntimeConfiguration,
+                }),
+            });
+            const payload = (await response.json()) as EnvironmentVariablesResponse;
+
+            if (!response.ok) {
+                throw new Error(payload.error || 'Failed to save environment variables.');
+            }
+
+            setEnvFilePath(payload.envFilePath);
+            setVariables([...payload.variables]);
+            setDraftValues(Object.fromEntries(payload.variables.map((variable) => [variable.key, variable.value])));
+            setCanEdit(payload.canEdit);
+            setSuccessMessage('Environment variables were saved.');
+            setApplyOutput(payload.applyResult?.output || null);
+        } catch (error) {
+            setErrorMessage(error instanceof Error ? error.message : 'Failed to save environment variables.');
+        } finally {
+            setIsSaving(false);
+        }
+    }
+
+    return (
+        <div className="space-y-6">
+            <Card className="hover:border-gray-200 hover:shadow-md">
+                <div className="space-y-2 text-sm text-slate-600">
+                    <p>
+                        These values are stored in the VPS-wide <span className="font-mono">.env</span> file and affect
+                        the whole installed Agents Server process.
+                    </p>
+                    <p>
+                        Sensitive values are always masked. To change a secret, type a new value; leaving the stars in
+                        place keeps the current secret.
+                    </p>
+                    {envFilePath ? <p className="font-mono text-xs text-slate-500">{envFilePath}</p> : null}
+                </div>
+            </Card>
+
+            {!canEdit && (
+                <div className="rounded-xl border border-amber-200 bg-amber-50 px-4 py-3 text-sm text-amber-800">
+                    You can view environment variables as an administrator. Editing is restricted to the super admin
+                    authenticated with <span className="font-mono">ADMIN_PASSWORD</span>.
+                </div>
+            )}
+
+            {errorMessage && (
+                <div className="rounded-xl border border-rose-200 bg-rose-50 px-4 py-3 text-sm text-rose-700">
+                    {errorMessage}
+                </div>
+            )}
+            {successMessage && (
+                <div className="rounded-xl border border-emerald-200 bg-emerald-50 px-4 py-3 text-sm text-emerald-700">
+                    {successMessage}
+                </div>
+            )}
+            {applyOutput && (
+                <pre className="max-h-72 overflow-auto rounded-xl border border-slate-200 bg-slate-950 p-4 text-xs text-slate-100">
+                    {applyOutput}
+                </pre>
+            )}
+
+            <Card className="hover:border-gray-200 hover:shadow-md">
+                {isLoading ? (
+                    <div className="py-10 text-center text-sm text-gray-500">Loading environment variables...</div>
+                ) : (
+                    <div className="overflow-x-auto rounded-xl border border-gray-200">
+                        <table className="min-w-full table-fixed divide-y divide-gray-200 text-sm">
+                            <colgroup>
+                                <col className="w-[18rem]" />
+                                <col />
+                                <col className="w-[10rem]" />
+                            </colgroup>
+                            <thead className="bg-gray-50 text-xs uppercase tracking-wide text-gray-500">
+                                <tr>
+                                    <th className="px-4 py-3 text-left font-semibold">Variable</th>
+                                    <th className="px-4 py-3 text-left font-semibold">Value</th>
+                                    <th className="px-4 py-3 text-left font-semibold">Status</th>
+                                </tr>
+                            </thead>
+                            <tbody className="divide-y divide-gray-200 bg-white">
+                                {variables.map((variable) => (
+                                    <tr key={variable.key}>
+                                        <td className="px-4 py-3 align-top font-mono text-sm font-semibold text-slate-800">
+                                            {variable.key}
+                                        </td>
+                                        <td className="px-4 py-3 align-top">
+                                            <div className="relative">
+                                                <input
+                                                    type={variable.isSensitive ? 'password' : 'text'}
+                                                    value={draftValues[variable.key] ?? ''}
+                                                    onChange={(event) =>
+                                                        setDraftValues((currentDraftValues) => ({
+                                                            ...currentDraftValues,
+                                                            [variable.key]: event.target.value,
+                                                        }))
+                                                    }
+                                                    disabled={!canEdit || isSaving}
+                                                    className={`${INPUT_CLASS_NAME} ${
+                                                        variable.isSensitive ? 'pr-10 tracking-wider' : ''
+                                                    }`}
+                                                    placeholder={variable.isSensitive ? HIDDEN_ENVIRONMENT_VALUE : ''}
+                                                />
+                                                {variable.isSensitive && (
+                                                    <EyeOff className="pointer-events-none absolute right-3 top-2.5 h-4 w-4 text-slate-400" />
+                                                )}
+                                            </div>
+                                        </td>
+                                        <td className="px-4 py-3 align-top">
+                                            <span
+                                                className={`rounded-full border px-2.5 py-1 text-xs font-semibold ${
+                                                    variable.isDefined
+                                                        ? 'border-emerald-200 bg-emerald-50 text-emerald-700'
+                                                        : 'border-slate-200 bg-slate-50 text-slate-500'
+                                                }`}
+                                            >
+                                                {variable.isDefined ? 'Configured' : 'Empty'}
+                                            </span>
+                                        </td>
+                                    </tr>
+                                ))}
+                            </tbody>
+                        </table>
+                    </div>
+                )}
+            </Card>
+
+            {canEdit && (
+                <div className="flex flex-wrap items-center gap-3">
+                    <button
+                        type="button"
+                        onClick={() => void saveVariables(false)}
+                        disabled={isSaving || !hasChanges}
+                        className="inline-flex items-center gap-2 rounded-md bg-blue-600 px-4 py-2 text-sm font-semibold text-white hover:bg-blue-700 disabled:cursor-not-allowed disabled:opacity-60"
+                    >
+                        {isSaving ? <Loader2 className="h-4 w-4 animate-spin" /> : <Save className="h-4 w-4" />}
+                        Save .env
+                    </button>
+                    <button
+                        type="button"
+                        onClick={() => void saveVariables(true)}
+                        disabled={isSaving}
+                        className="inline-flex items-center gap-2 rounded-md border border-slate-300 bg-white px-4 py-2 text-sm font-semibold text-slate-700 hover:bg-slate-50 disabled:cursor-not-allowed disabled:opacity-60"
+                    >
+                        {isSaving ? <Loader2 className="h-4 w-4 animate-spin" /> : <ServerCog className="h-4 w-4" />}
+                        Save and apply VPS configuration
+                    </button>
+                </div>
+            )}
+        </div>
+    );
+}

package/apps/agents-server/src/app/admin/environment/page.tsx

@@ -0,0 +1,21 @@
+import { ForbiddenPage } from '../../../components/ForbiddenPage/ForbiddenPage';
+import { isUserAdmin } from '../../../utils/isUserAdmin';
+import { AdminConfigurationShell } from '../_components/AdminConfigurationShell';
+import { EnvironmentVariablesClient } from './EnvironmentVariablesClient';
+
+/**
+ * Page for viewing and editing standalone VPS `.env` variables.
+ */
+export default async function EnvironmentVariablesPage() {
+    const isAdmin = await isUserAdmin();
+
+    if (!isAdmin) {
+        return <ForbiddenPage />;
+    }
+
+    return (
+        <AdminConfigurationShell activePage="environment">
+            <EnvironmentVariablesClient />
+        </AdminConfigurationShell>
+    );
+}

package/apps/agents-server/src/app/admin/logs/LogsClient.tsx

@@ -0,0 +1,78 @@
+'use client';
+
+import { Loader2, RefreshCcw } from 'lucide-react';
+import { useEffect, useState } from 'react';
+
+/**
+ * API payload returned by the pm2 logs endpoint.
+ */
+type LogsResponse = {
+    readonly isAvailable?: boolean;
+    readonly output?: string;
+    readonly error?: string;
+};
+
+/**
+ * Client UI for recent pm2 log output.
+ */
+export function LogsClient() {
+    const [logs, setLogs] = useState('');
+    const [isLoading, setIsLoading] = useState(true);
+    const [errorMessage, setErrorMessage] = useState<string | null>(null);
+
+    useEffect(() => {
+        void loadLogs();
+    }, []);
+
+    /**
+     * Refreshes log output from the API.
+     */
+    async function loadLogs(): Promise<void> {
+        try {
+            setIsLoading(true);
+            setErrorMessage(null);
+            const response = await fetch('/api/admin/logs?lines=300', { cache: 'no-store' });
+            const payload = (await response.json()) as LogsResponse;
+
+            if (!response.ok) {
+                throw new Error(payload.error || 'Failed to load logs.');
+            }
+
+            setLogs(payload.output || 'No log output returned.');
+        } catch (error) {
+            setErrorMessage(error instanceof Error ? error.message : 'Failed to load logs.');
+        } finally {
+            setIsLoading(false);
+        }
+    }
+
+    return (
+        <div className="container mx-auto space-y-6 px-4 py-8">
+            <div className="mt-20 flex flex-col gap-4 sm:flex-row sm:items-center sm:justify-between">
+                <div>
+                    <h1 className="text-3xl font-light text-gray-900">Logs</h1>
+                    <p className="mt-1 text-sm text-gray-500">Recent pm2 output for the standalone Agents Server.</p>
+                </div>
+                <button
+                    type="button"
+                    onClick={() => void loadLogs()}
+                    disabled={isLoading}
+                    className="inline-flex items-center gap-2 rounded-md border border-slate-300 bg-white px-4 py-2 text-sm font-semibold text-slate-700 hover:bg-slate-50 disabled:cursor-not-allowed disabled:opacity-60"
+                >
+                    {isLoading ? <Loader2 className="h-4 w-4 animate-spin" /> : <RefreshCcw className="h-4 w-4" />}
+                    Refresh
+                </button>
+            </div>
+
+            {errorMessage && (
+                <div className="rounded-xl border border-rose-200 bg-rose-50 px-4 py-3 text-sm text-rose-700">
+                    {errorMessage}
+                </div>
+            )}
+
+            <pre className="min-h-[28rem] overflow-auto rounded-xl border border-slate-800 bg-slate-950 p-4 text-xs leading-5 text-slate-100 shadow-sm">
+                {isLoading && !logs ? 'Loading logs...' : logs}
+            </pre>
+        </div>
+    );
+}

package/apps/agents-server/src/app/admin/logs/page.tsx

@@ -0,0 +1,14 @@
+import { ForbiddenPage } from '../../../components/ForbiddenPage/ForbiddenPage';
+import { isUserGlobalAdmin } from '../../../utils/isUserGlobalAdmin';
+import { LogsClient } from './LogsClient';
+
+/**
+ * Super-admin page for viewing standalone VPS pm2 logs.
+ */
+export default async function LogsPage() {
+    if (!(await isUserGlobalAdmin())) {
+        return <ForbiddenPage />;
+    }
+
+    return <LogsClient />;
+}