fix(app): add tooltip with shortcut hint to source control explorer toggle

The git checkout mode explorer button was missing the tooltip that
the non-git and mobile variants already had via HeaderToggleButton.

packages/app/src/screens/workspace/workspace-screen.tsx

@@ -2046,16 +2046,21 @@ function WorkspaceScreenContent({ serverId, workspaceId }: WorkspaceScreenProps)
                       serverId={normalizedServerId}
                       cwd={normalizedWorkspaceId}
                     />
+                    <Tooltip delayDuration={0} enabledOnDesktop enabledOnMobile={false}>
+                      <TooltipTrigger asChild>
                         <Pressable
                           testID="workspace-explorer-toggle"
                           onPress={handleToggleExplorer}
                           accessibilityRole="button"
-                      accessibilityLabel={isExplorerOpen ? "Close explorer" : "Open explorer"}
+                          accessibilityLabel={
+                            isExplorerOpen ? "Close explorer" : "Open explorer"
+                          }
                           accessibilityState={{ expanded: isExplorerOpen }}
                           style={({ hovered, pressed }) => [
                             styles.sourceControlButton,
                             workspaceDescriptor?.diffStat && styles.sourceControlButtonWithStats,
-                        (hovered || pressed || isExplorerOpen) && styles.sourceControlButtonHovered,
+                            (hovered || pressed || isExplorerOpen) &&
+                              styles.sourceControlButtonHovered,
                           ]}
                         >
                           {({ hovered, pressed }) => {
@@ -2065,7 +2070,10 @@ function WorkspaceScreenContent({ serverId, workspaceId }: WorkspaceScreenProps)
                               : theme.colors.foregroundMuted;
                             return (
                               <>
-                            <SourceControlPanelIcon size={theme.iconSize.md} color={iconColor} />
+                                <SourceControlPanelIcon
+                                  size={theme.iconSize.md}
+                                  color={iconColor}
+                                />
                                 {workspaceDescriptor?.diffStat ? (
                                   <View style={styles.diffStatRow}>
                                     <Text style={styles.diffStatAdditions}>
@@ -2080,6 +2088,19 @@ function WorkspaceScreenContent({ serverId, workspaceId }: WorkspaceScreenProps)
                             );
                           }}
                         </Pressable>
+                      </TooltipTrigger>
+                      <TooltipContent
+                        testID="workspace-explorer-toggle-tooltip"
+                        side="left"
+                        align="center"
+                        offset={8}
+                      >
+                        <View style={styles.explorerTooltipRow}>
+                          <Text style={styles.explorerTooltipText}>Toggle explorer</Text>
+                          <Shortcut keys={["mod", "E"]} style={styles.explorerTooltipShortcut} />
+                        </View>
+                      </TooltipContent>
+                    </Tooltip>
                   </>
                 ) : null}
                 {!isMobile && !isGitCheckout ? (
@@ -2347,6 +2368,19 @@ const styles = StyleSheet.create((theme) => ({
     backgroundColor: theme.colors.surface3,
     borderColor: theme.colors.borderAccent,
   },
+  explorerTooltipRow: {
+    flexDirection: "row",
+    alignItems: "center",
+    gap: theme.spacing[2],
+  },
+  explorerTooltipText: {
+    fontSize: theme.fontSize.sm,
+    color: theme.colors.popoverForeground,
+  },
+  explorerTooltipShortcut: {
+    backgroundColor: theme.colors.surface3,
+    borderColor: theme.colors.borderAccent,
+  },
   mobileTabsRow: {
     backgroundColor: theme.colors.surface0,
     borderBottomWidth: theme.borderWidth[1],