Movatterモバイル変換

[0]ホーム
URL:

Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

 Sign up
Appearance settings

Commited86e1f

Browse files
committed
chore: fix idle state icon when disabled
When the workspace is off, we set a disabled color, but for the idleicon that also needs a fill, this only changed the border making it lookweird. Instead, move the disabled logic into the component so we canapply a matching fill when necessary.
1 parent288ec77 commited86e1f

File tree

3 files changed

+42
-7
lines changed

3 files changed

+42
-7
lines changed

‎site/src/modules/apps/AppStatusStateIcon.tsx‎

Lines changed: 7 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -24,16 +24,21 @@ export const AppStatusStateIcon: FC<AppStatusStateIconProps> = ({
2424
latest,
2525
className:customClassName,
2626
})=>{
27-
constclassName=cn(["size-4 shrink-0",customClassName]);
27+
constclassName=cn([
28+
"size-4 shrink-0",
29+
customClassName,
30+
disabled&&"text-content-disabled",
31+
]);
2832

2933
switch(state){
3034
case"idle":
3135
return(
3236
<PauseIcon
3337
className={cn([
3438
"text-content-secondary",
35-
"fill-content-secondary",
3639
className,
40+
// The pause icon is outlined; add a fill since it is hard to see.
41+
disabled ?"fill-content-disabled" :"fill-content-secondary",
3742
])}
3843
/>
3944
);

‎site/src/modules/workspaces/WorkspaceAppStatus/WorkspaceAppStatus.stories.tsx‎

Lines changed: 35 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -69,9 +69,43 @@ export const LongMessage: Story = {
6969
},
7070
};
7171

72-
exportconstDisabled:Story={
72+
exportconstDisabledComplete:Story={
7373
args:{
7474
status:MockWorkspaceAppStatus,
7575
disabled:true,
7676
},
7777
};
78+
79+
exportconstDisabledFailure:Story={
80+
args:{
81+
status:{
82+
...MockWorkspaceAppStatus,
83+
state:"failure",
84+
message:"Couldn't figure out how to start the dev server",
85+
},
86+
disabled:true,
87+
},
88+
};
89+
90+
exportconstDisabledWorking:Story={
91+
args:{
92+
status:{
93+
...MockWorkspaceAppStatus,
94+
state:"working",
95+
message:"Starting dev server...",
96+
uri:"",
97+
},
98+
disabled:true,
99+
},
100+
};
101+
102+
exportconstDisabledIdle:Story={
103+
args:{
104+
status:{
105+
...MockWorkspaceAppStatus,
106+
state:"idle",
107+
message:"Done for now",
108+
},
109+
disabled:true,
110+
},
111+
};

‎site/src/modules/workspaces/WorkspaceAppStatus/WorkspaceAppStatus.tsx‎

Lines changed: 0 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,6 @@ import {
77
}from"components/Tooltip/Tooltip";
88
importcapitalizefrom"lodash/capitalize";
99
import{AppStatusStateIcon}from"modules/apps/AppStatusStateIcon";
10-
import{cn}from"utils/cn";
1110

1211
typeWorkspaceAppStatusProps={
1312
status:APIWorkspaceAppStatus|null;
@@ -37,9 +36,6 @@ export const WorkspaceAppStatus = ({
3736
latest
3837
disabled={disabled}
3938
state={status.state}
40-
className={cn({
41-
"text-content-disabled":disabled,
42-
})}
4339
/>
4440
<spanclassName="whitespace-nowrap max-w-72 overflow-hidden text-ellipsis text-sm text-content-primary font-medium">
4541
{message}

0 commit comments

Comments
 (0)
[8]ページ先頭
©2009-2025 Movatter.jp