tiennm99/ccs
1
0
Fork 0
mirror of https://github.com/tiennm99/ccs.git synced 2026-07-16 04:18:05 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix(cliproxy): remove control panel setup notice

Browse Source 
- drop the extra top banner from the embedded CLIProxy control panel

- keep the raw upstream dashboard focused on monitoring and recovery flows

Refs #649
This commit is contained in:
Tam Nhu Tran
2026-03-19 17:29:02 -04:00
parent 77fcd45173
commit e2ca9c2407
1 changed files with 1 additions and 77 deletions
Download Patch File Download Diff File Expand all files Collapse all files
ui/src/components/cliproxy/control-panel-embed.tsx
+1 -77
View File
@@ -7,7 +7,7 @@
*/
import { useState, useEffect, useRef, useCallback, useMemo } from 'react';
import { RefreshCw, AlertCircle, Key, X, Gauge, Globe, Settings } from 'lucide-react';
import { RefreshCw, AlertCircle, Gauge } from 'lucide-react';
import { useQuery } from '@tanstack/react-query';
import { api, withApiBase } from '@/lib/api-client';
import type { CliproxyServerConfig } from '@/lib/api-client';
@@ -28,7 +28,6 @@ export function ControlPanelEmbed({ port = CLIPROXY_DEFAULT_PORT }: ControlPanel
const [iframeRevision, setIframeRevision] = useState(0);
const [error, setError] = useState<string | null>(null);
const [isConnected, setIsConnected] = useState(false);
const [showLoginHint, setShowLoginHint] = useState(true);
// Fetch cliproxy_server config for remote/local mode detection
const { data: cliproxyConfig, error: configError } = useQuery<CliproxyServerConfig>({
@@ -200,25 +199,6 @@ export function ControlPanelEmbed({ port = CLIPROXY_DEFAULT_PORT }: ControlPanel
Retry
</button>
</div>
<div className="border-b bg-muted/20 p-4">
<div className="mx-auto max-w-3xl rounded-xl border bg-card/95 p-4 shadow-sm">
<div className="flex items-center justify-between gap-3">
<div>
<p className="text-sm font-semibold">Need the CCS-native workflow?</p>
<p className="text-xs text-muted-foreground">
Configure provider entries in the dedicated AI Providers page. Use the embedded
control panel only when you need the raw upstream dashboard.
</p>
</div>
<a
href="/cliproxy/ai-providers"
className="inline-flex items-center gap-2 rounded-md border px-3 py-1.5 text-sm hover:bg-muted"
>
Open AI Providers
</a>
</div>
</div>
</div>
<div className="flex-1 flex items-center justify-center bg-muted/20">
<div className="text-center max-w-md px-8">
<div className="w-16 h-16 rounded-full bg-destructive/10 flex items-center justify-center mx-auto mb-6">
@@ -239,63 +219,7 @@ export function ControlPanelEmbed({ port = CLIPROXY_DEFAULT_PORT }: ControlPanel
return (
<div className="flex-1 flex flex-col">
<div className="border-b bg-muted/20 p-4">
<div className="mx-auto max-w-3xl rounded-xl border bg-card/95 p-4 shadow-sm">
<div className="flex items-center justify-between gap-3">
<div>
<p className="text-sm font-semibold">Need the CCS-native workflow?</p>
<p className="text-xs text-muted-foreground">
Configure provider entries in the dedicated AI Providers page. Use the embedded
control panel only when you need the raw upstream dashboard.
</p>
</div>
<a
href="/cliproxy/ai-providers"
className="inline-flex items-center gap-2 rounded-md border px-3 py-1.5 text-sm hover:bg-muted"
>
Open AI Providers
</a>
</div>
</div>
</div>
<div className="flex-1 flex flex-col relative">
{/* Remote indicator and login hint banner */}
{showLoginHint && !isLoading && (
<div className="absolute top-2 left-1/2 -translate-x-1/2 z-20">
<div className="flex items-center gap-2 px-3 py-1.5 bg-blue-50 dark:bg-blue-950 border border-blue-200 dark:border-blue-800 rounded-md text-sm">
{isRemote && (
<>
<Globe className="h-3.5 w-3.5 text-green-600" />
<span className="text-green-600 font-medium">Remote</span>
<span className="text-blue-300 dark:text-blue-700">|</span>
</>
)}
<Key className="h-3.5 w-3.5 text-blue-600" />
<span>
Key:{' '}
<code className="bg-blue-100 dark:bg-blue-900 px-1 rounded font-mono font-semibold">
{authToken && authToken.length > 4
? `***${authToken.slice(-4)}`
: authToken || 'ccs'}
</code>
</span>
<a
href="/settings?tab=auth"
className="text-blue-600 hover:text-blue-800 dark:hover:text-blue-400"
title="Manage auth tokens"
>
<Settings className="h-3.5 w-3.5" />
</a>
<button
className="text-blue-600 hover:text-blue-800 dark:hover:text-blue-400"
onClick={() => setShowLoginHint(false)}
>
<X className="h-3.5 w-3.5" />
</button>
</div>
</div>
)}
{/* Loading overlay */}
{isLoading && (
<div className="absolute inset-0 flex items-center justify-center bg-background/80 z-10">