fix(app): hide branch icon on non-git workspace headers
Gate the GitBranch icon behind isGitCheckout, and keep the header skeleton visible until the checkout status query resolves so the icon doesn't pop in and cause layout shift.
This commit is contained in:
@@ -45,7 +45,7 @@ export function BranchSwitcher({
|
|||||||
|
|
||||||
const titleContent = (
|
const titleContent = (
|
||||||
<>
|
<>
|
||||||
<GitBranch size={14} color={theme.colors.foregroundMuted} />
|
{isGitCheckout ? <GitBranch size={14} color={theme.colors.foregroundMuted} /> : null}
|
||||||
<Text testID="workspace-header-title" style={styles.headerTitle} numberOfLines={1}>
|
<Text testID="workspace-header-title" style={styles.headerTitle} numberOfLines={1}>
|
||||||
{title}
|
{title}
|
||||||
</Text>
|
</Text>
|
||||||
|
|||||||
@@ -731,12 +731,13 @@ function WorkspaceScreenContent({ serverId, workspaceId }: WorkspaceScreenProps)
|
|||||||
};
|
};
|
||||||
}, [client, isConnected, normalizedWorkspaceId, queryClient, terminalsQueryKey]);
|
}, [client, isConnected, normalizedWorkspaceId, queryClient, terminalsQueryKey]);
|
||||||
|
|
||||||
|
const isCheckoutQueryEnabled =
|
||||||
|
Boolean(client && isConnected) &&
|
||||||
|
normalizedWorkspaceId.length > 0 &&
|
||||||
|
isAbsolutePath(normalizedWorkspaceId);
|
||||||
const checkoutQuery = useQuery({
|
const checkoutQuery = useQuery({
|
||||||
queryKey: checkoutStatusQueryKey(normalizedServerId, normalizedWorkspaceId),
|
queryKey: checkoutStatusQueryKey(normalizedServerId, normalizedWorkspaceId),
|
||||||
enabled:
|
enabled: isCheckoutQueryEnabled,
|
||||||
Boolean(client && isConnected) &&
|
|
||||||
normalizedWorkspaceId.length > 0 &&
|
|
||||||
isAbsolutePath(normalizedWorkspaceId),
|
|
||||||
queryFn: async () => {
|
queryFn: async () => {
|
||||||
if (!client) {
|
if (!client) {
|
||||||
throw new Error("Host is not connected");
|
throw new Error("Host is not connected");
|
||||||
@@ -745,6 +746,8 @@ function WorkspaceScreenContent({ serverId, workspaceId }: WorkspaceScreenProps)
|
|||||||
},
|
},
|
||||||
staleTime: 15_000,
|
staleTime: 15_000,
|
||||||
});
|
});
|
||||||
|
const isCheckoutStatusLoading =
|
||||||
|
isCheckoutQueryEnabled && checkoutQuery.data === undefined && !checkoutQuery.isError;
|
||||||
|
|
||||||
const workspaceDescriptor = useSessionStore(
|
const workspaceDescriptor = useSessionStore(
|
||||||
(state) => state.sessions[normalizedServerId]?.workspaces.get(normalizedWorkspaceId) ?? null,
|
(state) => state.sessions[normalizedServerId]?.workspaces.get(normalizedWorkspaceId) ?? null,
|
||||||
@@ -758,7 +761,7 @@ function WorkspaceScreenContent({ serverId, workspaceId }: WorkspaceScreenProps)
|
|||||||
const workspaceHeader = workspaceDescriptor
|
const workspaceHeader = workspaceDescriptor
|
||||||
? resolveWorkspaceHeader({ workspace: workspaceDescriptor })
|
? resolveWorkspaceHeader({ workspace: workspaceDescriptor })
|
||||||
: null;
|
: null;
|
||||||
const isWorkspaceHeaderLoading = workspaceHeader === null;
|
const isWorkspaceHeaderLoading = workspaceHeader === null || isCheckoutStatusLoading;
|
||||||
const workspaceHeaderTitle = workspaceHeader?.title ?? "";
|
const workspaceHeaderTitle = workspaceHeader?.title ?? "";
|
||||||
const workspaceHeaderSubtitle = workspaceHeader?.subtitle ?? "";
|
const workspaceHeaderSubtitle = workspaceHeader?.subtitle ?? "";
|
||||||
const shouldShowWorkspaceHeaderSubtitle = !areHeaderLabelsEquivalent(
|
const shouldShowWorkspaceHeaderSubtitle = !areHeaderLabelsEquivalent(
|
||||||
|
|||||||
Reference in New Issue
Block a user