mirror of
https://github.com/tiennm99/ccs.git
synced 2026-10-13 20:14:34 +00:00
fix(ui): keep remote read-only notice accurate
This commit is contained in:
1 parent
1603f19388
commit
173149ba71
3 files changed
+149
-20
No files matched your search
@@ -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 ? (
|
||||
<>
|
||||
<span className="hidden sm:inline">
|
||||
Remote dashboard access is read-only until you run ccs config auth setup on the host.
|
||||
</span>
|
||||
<span className="sm:hidden">
|
||||
Remote dashboard is read-only until host auth is configured.
|
||||
</span>
|
||||
{authConfigured ? (
|
||||
<>
|
||||
<span className="hidden sm:inline">
|
||||
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.
|
||||
</span>
|
||||
<span className="sm:hidden">
|
||||
Remote dashboard is read-only until dashboard auth is re-enabled on the host.
|
||||
</span>
|
||||
</>
|
||||
) : (
|
||||
<>
|
||||
<span className="hidden sm:inline">
|
||||
Remote dashboard access is read-only until you run ccs config auth setup on the host.
|
||||
</span>
|
||||
<span className="sm:hidden">
|
||||
Remote dashboard is read-only until host auth is configured.
|
||||
</span>
|
||||
</>
|
||||
)}
|
||||
</>
|
||||
) : (
|
||||
<>
|
||||
@@ -40,13 +55,15 @@ export function LocalhostDisclaimer() {
|
||||
<Shield className="w-4 h-4 flex-shrink-0" />
|
||||
{message}
|
||||
</div>
|
||||
<button
|
||||
onClick={() => setDismissed(true)}
|
||||
className={`flex-shrink-0 rounded p-1 transition-colors ${dismissClasses}`}
|
||||
aria-label="Dismiss disclaimer"
|
||||
>
|
||||
<X className="w-4 h-4" />
|
||||
</button>
|
||||
{!isRemoteReadonly ? (
|
||||
<button
|
||||
onClick={() => setDismissed(true)}
|
||||
className={`flex-shrink-0 rounded p-1 transition-colors ${dismissClasses}`}
|
||||
aria-label="Dismiss disclaimer"
|
||||
>
|
||||
<X className="w-4 h-4" />
|
||||
</button>
|
||||
) : null}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
|
||||
@@ -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(<LocalhostDisclaimer />);
|
||||
|
||||
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();
|
||||
});
|
||||
});
|
||||
Reference in new issue
Block a user