fix(tui): distinguish disconnect actions

packages/tui/src/component/dialog-integration.tsx

@@ -123,6 +123,7 @@ function manageConnections(
   onConnected?: OnIntegrationConnected,
 ) {
   dialog.replace(() => {
+    const theme = useTheme("elevated")
     const data = useData()
     const client = useClient()
     const toast = useToast()
@@ -142,6 +143,9 @@ function manageConnections(
           ...credentialConnections(integration).map((connection) => ({
             title: `Disconnect ${connection.label}`,
             value: connection.id,
+            category: "Connected accounts",
+            bg: theme.background.action.destructive.focused,
+            fg: theme.text.action.destructive.focused,
             onSelect: () => {
               void client.api.credential
                 .remove({ credentialID: connection.id, location: location(data) })
@@ -317,19 +321,15 @@ function CommandView(props: { title: string; output: string; message: string })
           esc close
         </text>
       </box>
-      <Show when={props.output.trim()}>
-        {(output) => (
-          <box
-            backgroundColor={overlayTheme.background.default}
-            paddingLeft={2}
-            paddingRight={2}
-            paddingTop={1}
-            paddingBottom={1}
-          >
-            <text fg={overlayTheme.text.default}>{output()}</text>
-          </box>
-        )}
-      </Show>
+      <box
+        backgroundColor={overlayTheme.background.default}
+        paddingLeft={2}
+        paddingRight={2}
+        paddingTop={1}
+        paddingBottom={1}
+      >
+        <text fg={overlayTheme.text.default}>{props.output.trim()}</text>
+      </box>
       <box paddingLeft={2} paddingRight={2}>
         <text fg={theme.text.subdued}>{props.message}</text>
       </box>