42 lines
1.4 KiB
TypeScript
42 lines
1.4 KiB
TypeScript
/**
|
|
* ContextSwitchOverlay - Full-screen loading overlay during context switches.
|
|
*
|
|
* Displayed when isContextSwitching is true, preventing stale data flash
|
|
* during workspace transitions.
|
|
*/
|
|
|
|
import React from 'react';
|
|
|
|
import { useAppTranslation } from '@features/localization/renderer';
|
|
import { useStore } from '@renderer/store';
|
|
|
|
export const ContextSwitchOverlay: React.FC = () => {
|
|
const { t } = useAppTranslation('common');
|
|
const isContextSwitching = useStore((state) => state.isContextSwitching);
|
|
const targetContextId = useStore((state) => state.targetContextId);
|
|
|
|
if (!isContextSwitching) {
|
|
return null;
|
|
}
|
|
|
|
// Format context label for display
|
|
const contextLabel =
|
|
targetContextId === 'local'
|
|
? t('context.local')
|
|
: (targetContextId?.replace(/^ssh-/, '') ?? t('states.unknown'));
|
|
|
|
return (
|
|
<div className="fixed inset-0 z-[9999] flex items-center justify-center bg-surface">
|
|
<div className="flex flex-col items-center gap-4">
|
|
{/* Spinner */}
|
|
<div className="size-8 animate-spin rounded-full border-4 border-text border-t-transparent" />
|
|
|
|
{/* Text */}
|
|
<div className="flex flex-col items-center gap-1">
|
|
<p className="text-text">{t('context.switchingTo', { workspace: contextLabel })}</p>
|
|
<p className="text-sm text-text-secondary">{t('context.loadingWorkspace')}</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
};
|