From 173149ba718503cb3b5b95ebd3fdc879e0fac9eb Mon Sep 17 00:00:00 2001 From: Tam Nhu Tran Date: Tue, 7 Apr 2026 07:08:32 -0400 Subject: [PATCH] fix(ui): keep remote read-only notice accurate --- .../api-routes-remote-write-guard.test.ts | 99 ++++++++++++++++++- .../shared/localhost-disclaimer.tsx | 49 ++++++--- .../shared/localhost-disclaimer.test.tsx | 21 ++++ 3 files changed, 149 insertions(+), 20 deletions(-) diff --git a/tests/unit/web-server/api-routes-remote-write-guard.test.ts b/tests/unit/web-server/api-routes-remote-write-guard.test.ts index de2a2c77..83575173 100644 --- a/tests/unit/web-server/api-routes-remote-write-guard.test.ts +++ b/tests/unit/web-server/api-routes-remote-write-guard.test.ts @@ -1,10 +1,15 @@ import { afterAll, afterEach, beforeAll, beforeEach, describe, expect, it } from 'bun:test'; +import bcrypt from 'bcrypt'; import express from 'express'; import type { Server } from 'http'; import * as fs from 'fs'; import * as os from 'os'; import * as path from 'path'; import { apiRoutes } from '../../../src/web-server/routes'; +import { + authMiddleware, + createSessionMiddleware, +} from '../../../src/web-server/middleware/auth-middleware'; describe('api-routes remote write guard', () => { let server: Server; @@ -107,12 +112,93 @@ describe('api-routes remote write guard', () => { }); }); - it('allows remote writes again when dashboard auth is enabled', async () => { - process.env.CCS_DASHBOARD_AUTH_ENABLED = 'true'; + it('blocks remote PUT requests when dashboard auth is disabled', async () => { + const response = await fetch(`${baseUrl}/api/cliproxy-server`, { + method: 'PUT', + headers: { 'Content-Type': 'application/json' }, + body: JSON.stringify({}), + }); - const response = await fetch(`${baseUrl}/api/profiles`, { + expect(response.status).toBe(403); + expect(await response.json()).toEqual({ + error: 'Remote dashboard writes require localhost access when dashboard auth is disabled.', + }); + }); + + it('blocks remote PATCH requests when dashboard auth is disabled', async () => { + const response = await fetch(`${baseUrl}/api/codex/config/patch`, { + method: 'PATCH', + headers: { 'Content-Type': 'application/json' }, + body: JSON.stringify({}), + }); + + expect(response.status).toBe(403); + expect(await response.json()).toEqual({ + error: 'Remote dashboard writes require localhost access when dashboard auth is disabled.', + }); + }); + + it('blocks remote DELETE requests when dashboard auth is disabled', async () => { + const response = await fetch(`${baseUrl}/api/profiles/demo`, { + method: 'DELETE', + }); + + expect(response.status).toBe(403); + expect(await response.json()).toEqual({ + error: 'Remote dashboard writes require localhost access when dashboard auth is disabled.', + }); + }); + + it('allows remote writes again when dashboard auth is enabled', async () => { + const password = 'testpassword123'; + process.env.CCS_DASHBOARD_AUTH_ENABLED = 'true'; + process.env.CCS_DASHBOARD_USERNAME = 'admin'; + process.env.CCS_DASHBOARD_PASSWORD_HASH = await bcrypt.hash(password, 10); + + const authApp = express(); + authApp.use(express.json()); + authApp.use((req, _res, next) => { + Object.defineProperty(req.socket, 'remoteAddress', { + value: forcedRemoteAddress, + configurable: true, + }); + next(); + }); + authApp.use(createSessionMiddleware()); + authApp.use(authMiddleware); + authApp.use('/api', apiRoutes); + + const authServer = await new Promise((resolve, reject) => { + const instance = authApp.listen(0, '127.0.0.1'); + instance.once('error', reject); + instance.once('listening', () => resolve(instance)); + }); + + const address = authServer.address(); + if (!address || typeof address === 'string') { + throw new Error('Unable to resolve auth-enabled test server port'); + } + const authBaseUrl = `http://127.0.0.1:${address.port}`; + + const loginResponse = await fetch(`${authBaseUrl}/api/auth/login`, { method: 'POST', headers: { 'Content-Type': 'application/json' }, + body: JSON.stringify({ + username: 'admin', + password, + }), + }); + const cookie = loginResponse.headers.get('set-cookie'); + + expect(loginResponse.status).toBe(200); + expect(cookie).toBeTruthy(); + + const response = await fetch(`${authBaseUrl}/api/profiles`, { + method: 'POST', + headers: { + 'Content-Type': 'application/json', + Cookie: cookie as string, + }, body: JSON.stringify({ name: 'demo', baseUrl: 'https://api.example.com', @@ -120,6 +206,11 @@ describe('api-routes remote write guard', () => { }), }); - expect(response.status).not.toBe(403); + expect(response.status).toBe(201); + + await new Promise((resolve) => authServer.close(() => resolve())); + + delete process.env.CCS_DASHBOARD_USERNAME; + delete process.env.CCS_DASHBOARD_PASSWORD_HASH; }); }); diff --git a/ui/src/components/shared/localhost-disclaimer.tsx b/ui/src/components/shared/localhost-disclaimer.tsx index 5890da43..c6efc7b4 100644 --- a/ui/src/components/shared/localhost-disclaimer.tsx +++ b/ui/src/components/shared/localhost-disclaimer.tsx @@ -4,11 +4,12 @@ import { useAuth } from '@/contexts/auth-context'; export function LocalhostDisclaimer() { const [dismissed, setDismissed] = useState(false); - const { authEnabled, isLocalAccess, loading } = useAuth(); - - if (dismissed || loading) return null; + const { authEnabled, authConfigured, isLocalAccess, loading } = useAuth(); const isRemoteReadonly = !isLocalAccess && !authEnabled; + + if ((dismissed && !isRemoteReadonly) || loading) return null; + const wrapperClasses = isRemoteReadonly ? 'w-full border-t border-amber-200 bg-amber-50 px-4 py-2 text-amber-900 transition-colors duration-200 dark:border-amber-800 dark:bg-amber-900/20 dark:text-amber-200' : 'w-full border-t border-yellow-200 bg-yellow-50 px-4 py-2 text-yellow-800 transition-colors duration-200 dark:border-yellow-800 dark:bg-yellow-900/20 dark:text-yellow-200'; @@ -17,12 +18,26 @@ export function LocalhostDisclaimer() { : 'text-yellow-600 hover:bg-yellow-100 hover:text-yellow-800 dark:text-yellow-400 dark:hover:bg-yellow-800/30'; const message = isRemoteReadonly ? ( <> - - Remote dashboard access is read-only until you run ccs config auth setup on the host. - - - Remote dashboard is read-only until host auth is configured. - + {authConfigured ? ( + <> + + Remote dashboard access is read-only because dashboard auth is currently disabled on the + host. Re-enable dashboard auth on the host to unlock remote changes. + + + Remote dashboard is read-only until dashboard auth is re-enabled on the host. + + + ) : ( + <> + + Remote dashboard access is read-only until you run ccs config auth setup on the host. + + + Remote dashboard is read-only until host auth is configured. + + + )} ) : ( <> @@ -40,13 +55,15 @@ export function LocalhostDisclaimer() { {message} - + {!isRemoteReadonly ? ( + + ) : null} ); diff --git a/ui/tests/unit/components/shared/localhost-disclaimer.test.tsx b/ui/tests/unit/components/shared/localhost-disclaimer.test.tsx index 5525543e..8c27d933 100644 --- a/ui/tests/unit/components/shared/localhost-disclaimer.test.tsx +++ b/ui/tests/unit/components/shared/localhost-disclaimer.test.tsx @@ -18,6 +18,7 @@ describe('LocalhostDisclaimer', () => { it('shows the local safety copy for loopback sessions', () => { useAuthMock.mockReturnValue({ authEnabled: false, + authConfigured: false, isLocalAccess: true, loading: false, }); @@ -32,6 +33,7 @@ describe('LocalhostDisclaimer', () => { it('shows the remote read-only copy when auth is disabled for remote access', () => { useAuthMock.mockReturnValue({ authEnabled: false, + authConfigured: false, isLocalAccess: false, loading: false, }); @@ -43,5 +45,24 @@ describe('LocalhostDisclaimer', () => { 'Remote dashboard access is read-only until you run ccs config auth setup on the host.' ) ).toBeVisible(); + expect(screen.queryByLabelText('Dismiss disclaimer')).toBeNull(); + }); + + it('shows the re-enable message when host credentials already exist', () => { + useAuthMock.mockReturnValue({ + authEnabled: false, + authConfigured: true, + isLocalAccess: false, + loading: false, + }); + + render(); + + expect( + screen.getByText( + 'Remote dashboard access is read-only because dashboard auth is currently disabled on the host. Re-enable dashboard auth on the host to unlock remote changes.' + ) + ).toBeVisible(); + expect(screen.queryByLabelText('Dismiss disclaimer')).toBeNull(); }); });