Skip to content

Commit 03f0ebc

Browse files
factorydroidfactorydroid
committed
fix(terminal): clean up TypeScript errors in terminal components (#310)
- Fix unused variable warnings by prefixing with underscore or using void - Fix type mismatch in ShellIntegrationDecorations (IDecoration | undefined to null) - Remove unused imports in TerminalCard.tsx - Fix unused parameters in TerminalLinkProvider, TerminalQuickFix, TerminalSplitView - Suppress unused imports with eslint-disable comments where appropriate This improves code quality without changing behavior.
1 parent df45c44 commit 03f0ebc

File tree

8 files changed

+167
-162
lines changed

8 files changed

+167
-162
lines changed

‎cortex-gui/src/components/TerminalCard.tsx‎

Lines changed: 116 additions & 117 deletions
Original file line numberDiff line numberDiff line change
@@ -1,77 +1,76 @@
11
import { Show, For, type JSX } from "solid-js";
22
import { Icon } from "./ui/Icon";
33
import { TerminalInfo, useTerminals } from "@/context/TerminalsContext";
4-
import { Card, Text, Badge, EmptyState, StatusDot } from "@/components/ui";
5-
import { tokens } from "@/design-system/tokens";
6-
import { Box, Flex, VStack, HStack } from "@/design-system/primitives/Flex";
7-
8-
interface TerminalCardProps {
9-
terminal: TerminalInfo;
10-
onKill?: () => void;
11-
}
12-
13-
export function TerminalCard(props: TerminalCardProps) {
14-
const { openTerminal } = useTerminals();
15-
16-
const statusColor = () => {
17-
switch (props.terminal.status) {
18-
case "running": return tokens.colors.semantic.success;
19-
case "exited": return tokens.colors.text.muted;
20-
case "error": return tokens.colors.semantic.error;
21-
default: return tokens.colors.text.muted;
22-
}
23-
};
24-
25-
const statusVariant = (): "success" | "error" | "idle" => {
26-
switch (props.terminal.status) {
27-
case "running": return "success";
28-
case "error": return "error";
29-
default: return "idle";
30-
}
31-
};
32-
33-
const containerStyle: JSX.CSSProperties = {
34-
display: "flex",
35-
"align-items": "center",
36-
gap: tokens.spacing.lg,
37-
padding: `${tokens.spacing.md} ${tokens.spacing.lg}`,
38-
cursor: "pointer",
39-
transition: "background var(--cortex-transition-fast)",
40-
};
41-
42-
const iconContainerStyle: JSX.CSSProperties = {
43-
width: "32px",
44-
height: "32px",
45-
"border-radius": tokens.radius.sm,
46-
display: "flex",
47-
"align-items": "center",
48-
"justify-content": "center",
49-
background: `color-mix(in srgb, ${statusColor()} 20%, transparent)`,
50-
};
51-
52-
const contentStyle: JSX.CSSProperties = {
53-
flex: "1",
54-
"min-width": "0",
55-
display: "flex",
56-
"flex-direction": "column",
57-
gap: "2px",
58-
};
59-
60-
const actionsStyle: JSX.CSSProperties = {
61-
display: "flex",
62-
"align-items": "center",
63-
gap: tokens.spacing.md,
64-
};
65-
66-
return (
67-
<Card
68-
variant="outlined"
69-
padding="none"
70-
hoverable
71-
onClick={() => openTerminal(props.terminal.id)}
72-
style={{ "border-radius": tokens.radius.md }}
73-
>
74-
<div style={containerStyle}>
4+
import { Card, Text, Badge, EmptyState, StatusDot } from "@/components/ui";
5+
import { tokens } from "@/design-system/tokens";
6+
7+
interface TerminalCardProps {
8+
terminal: TerminalInfo;
9+
onKill?: () => void;
10+
}
11+
12+
export function TerminalCard(props: TerminalCardProps) {
13+
const { openTerminal } = useTerminals();
14+
15+
const statusColor = () => {
16+
switch (props.terminal.status) {
17+
case "running": return tokens.colors.semantic.success;
18+
case "exited": return tokens.colors.text.muted;
19+
case "error": return tokens.colors.semantic.error;
20+
default: return tokens.colors.text.muted;
21+
}
22+
};
23+
24+
const statusVariant = (): "success" | "error" | "idle" => {
25+
switch (props.terminal.status) {
26+
case "running": return "success";
27+
case "error": return "error";
28+
default: return "idle";
29+
}
30+
};
31+
32+
const containerStyle: JSX.CSSProperties = {
33+
display: "flex",
34+
"align-items": "center",
35+
gap: tokens.spacing.lg,
36+
padding: `${tokens.spacing.md} ${tokens.spacing.lg}`,
37+
cursor: "pointer",
38+
transition: "background var(--cortex-transition-fast)",
39+
};
40+
41+
const iconContainerStyle: JSX.CSSProperties = {
42+
width: "32px",
43+
height: "32px",
44+
"border-radius": tokens.radius.sm,
45+
display: "flex",
46+
"align-items": "center",
47+
"justify-content": "center",
48+
background: `color-mix(in srgb, ${statusColor()} 20%, transparent)`,
49+
};
50+
51+
const contentStyle: JSX.CSSProperties = {
52+
flex: "1",
53+
"min-width": "0",
54+
display: "flex",
55+
"flex-direction": "column",
56+
gap: "2px",
57+
};
58+
59+
const actionsStyle: JSX.CSSProperties = {
60+
display: "flex",
61+
"align-items": "center",
62+
gap: tokens.spacing.md,
63+
};
64+
65+
return (
66+
<Card
67+
variant="outlined"
68+
padding="none"
69+
hoverable
70+
onClick={() => openTerminal(props.terminal.id)}
71+
style={{ "border-radius": tokens.radius.md }}
72+
>
73+
<div style={containerStyle}>
7574
<div style={iconContainerStyle}>
7675
<Icon
7776
name="terminal"
@@ -82,25 +81,25 @@ export function TerminalCard(props: TerminalCardProps) {
8281
}}
8382
/>
8483
</div>
85-
86-
<div style={contentStyle}>
87-
<Text variant="body" weight="medium" truncate>
88-
{props.terminal.name}
89-
</Text>
90-
<Text variant="muted" size="xs" truncate>
91-
{props.terminal.cwd}
92-
</Text>
93-
</div>
94-
95-
<div style={actionsStyle}>
96-
<Show when={props.terminal.status === "running"}>
97-
<StatusDot status={statusVariant()} />
98-
</Show>
99-
<Show when={props.terminal.status === "exited"}>
100-
<Badge variant="default" size="sm">
101-
Exit: {props.terminal.exitCode ?? "?"}
102-
</Badge>
103-
</Show>
84+
85+
<div style={contentStyle}>
86+
<Text variant="body" weight="medium" truncate>
87+
{props.terminal.name}
88+
</Text>
89+
<Text variant="muted" size="xs" truncate>
90+
{props.terminal.cwd}
91+
</Text>
92+
</div>
93+
94+
<div style={actionsStyle}>
95+
<Show when={props.terminal.status === "running"}>
96+
<StatusDot status={statusVariant()} />
97+
</Show>
98+
<Show when={props.terminal.status === "exited"}>
99+
<Badge variant="default" size="sm">
100+
Exit: {props.terminal.exitCode ?? "?"}
101+
</Badge>
102+
</Show>
104103
<Icon
105104
name="chevron-right"
106105
style={{
@@ -109,36 +108,36 @@ export function TerminalCard(props: TerminalCardProps) {
109108
color: tokens.colors.icon.default,
110109
}}
111110
/>
112-
</div>
113-
</div>
114-
</Card>
115-
);
116-
}
117-
118-
export function TerminalsList() {
119-
const { state } = useTerminals();
120-
121-
const listStyle: JSX.CSSProperties = {
122-
display: "flex",
123-
"flex-direction": "column",
124-
gap: tokens.spacing.md,
125-
};
126-
127-
return (
128-
<Show
129-
when={state.terminals.length > 0}
111+
</div>
112+
</div>
113+
</Card>
114+
);
115+
}
116+
117+
export function TerminalsList() {
118+
const { state } = useTerminals();
119+
120+
const listStyle: JSX.CSSProperties = {
121+
display: "flex",
122+
"flex-direction": "column",
123+
gap: tokens.spacing.md,
124+
};
125+
126+
return (
127+
<Show
128+
when={state.terminals.length > 0}
130129
fallback={
131130
<EmptyState
132131
icon={<Icon name="terminal" />}
133132
description="No terminals running"
134133
/>
135134
}
136-
>
137-
<div style={listStyle}>
138-
<For each={state.terminals}>
139-
{(terminal) => <TerminalCard terminal={terminal} />}
140-
</For>
141-
</div>
142-
</Show>
143-
);
144-
}
135+
>
136+
<div style={listStyle}>
137+
<For each={state.terminals}>
138+
{(terminal) => <TerminalCard terminal={terminal} />}
139+
</For>
140+
</div>
141+
</Show>
142+
);
143+
}

0 commit comments

Comments
 (0)