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

Commit5724197

Browse files
BrunoQuaresmamafredri
authored andcommitted
refactor tasks sidebar
1 parenta196bae commit5724197

File tree

6 files changed

+58
-89
lines changed

6 files changed

+58
-89
lines changed

‎codersdk/aitasks.go‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -135,7 +135,7 @@ type Task struct {
135135
OrganizationID uuid.UUID`json:"organization_id" format:"uuid" table:"organization id"`
136136
OwnerID uuid.UUID`json:"owner_id" format:"uuid" table:"owner id"`
137137
OwnerNamestring`json:"owner_name" table:"owner name"`
138-
OwnerAvatarURLstring`json:"owner_avatar_url" table:"owner avatar url"`
138+
OwnerAvatarURLstring`json:"owner_avatar_url,omitempty" table:"owner avatar url"`
139139
Namestring`json:"name" table:"name,default_sort"`
140140
TemplateID uuid.UUID`json:"template_id" format:"uuid" table:"template id"`
141141
TemplateVersionID uuid.UUID`json:"template_version_id" format:"uuid" table:"template version id"`

‎site/src/api/typesGenerated.ts‎

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more aboutcustomizing how changed files appear on GitHub.

‎site/src/modules/tasks/TaskStatus/TaskStatus.tsx‎

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,7 @@ export type TaskStatusProps = {
1111
stateMessage:string;
1212
};
1313

14-
conststatusToVariant:Record<
14+
exportconsttaskStatusToStatusIndicatorVariant:Record<
1515
TypesGen.TaskStatus,
1616
StatusIndicatorProps["variant"]
1717
>={
@@ -25,7 +25,10 @@ const statusToVariant: Record<
2525

2626
exportconstTaskStatus:FC<TaskStatusProps>=({ status, stateMessage})=>{
2727
return(
28-
<StatusIndicatorvariant={statusToVariant[status]}className="items-start">
28+
<StatusIndicator
29+
variant={taskStatusToStatusIndicatorVariant[status]}
30+
className="items-start"
31+
>
2932
<StatusIndicatorDotclassName="mt-1"/>
3033
<divclassName="flex flex-col">
3134
<spanclassName="[&:first-letter]:uppercase">{status}</span>

‎site/src/modules/tasks/TasksSidebar/TasksSidebar.stories.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -19,9 +19,9 @@ const meta: Meta<typeof TasksSidebar> = {
1919
},
2020
reactRouter:reactRouterParameters({
2121
location:{
22-
path:`/tasks/${MockTasks[0].workspace.name}`,
22+
path:`/tasks/${MockTasks[0].name}`,
2323
pathParams:{
24-
workspace:MockTasks[0].workspace.name,
24+
workspace:MockTasks[0].name,
2525
},
2626
},
2727
routing:[

‎site/src/modules/tasks/TasksSidebar/TasksSidebar.tsx‎

Lines changed: 24 additions & 45 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import{API}from"api/api";
22
import{getErrorMessage}from"api/errors";
3-
import{cva}from"class-variance-authority";
3+
importtype{Task,TasksFilter}from"api/typesGenerated";
44
import{Button}from"components/Button/Button";
55
import{
66
DropdownMenu,
@@ -12,6 +12,7 @@ import {
1212
import{CoderIcon}from"components/Icons/CoderIcon";
1313
import{ScrollArea}from"components/ScrollArea/ScrollArea";
1414
import{Skeleton}from"components/Skeleton/Skeleton";
15+
import{StatusIndicatorDot}from"components/StatusIndicator/StatusIndicator";
1516
import{
1617
Tooltip,
1718
TooltipContent,
@@ -21,18 +22,18 @@ import {
2122
import{useAuthenticated}from"hooks";
2223
import{useSearchParamsKey}from"hooks/useSearchParamsKey";
2324
import{EditIcon,EllipsisIcon,PanelLeftIcon,TrashIcon}from"lucide-react";
24-
importtype{Task}from"modules/tasks/tasks";
2525
import{typeFC,useState}from"react";
2626
import{useQuery}from"react-query";
2727
import{LinkasRouterLink,useNavigate,useParams}from"react-router";
2828
import{cn}from"utils/cn";
2929
import{TaskDeleteDialog}from"../TaskDeleteDialog/TaskDeleteDialog";
30+
import{taskStatusToStatusIndicatorVariant}from"../TaskStatus/TaskStatus";
3031
import{UserCombobox}from"./UserCombobox";
3132

3233
exportconstTasksSidebar:FC=()=>{
3334
const{ user, permissions}=useAuthenticated();
34-
constusernameParam=useSearchParamsKey({
35-
key:"username",
35+
constownerParam=useSearchParamsKey({
36+
key:"owner",
3637
defaultValue:user.username,
3738
});
3839

@@ -109,29 +110,29 @@ export const TasksSidebar: FC = () => {
109110

110111
{!isCollapsed&&permissions.viewAllUsers&&(
111112
<UserCombobox
112-
value={usernameParam.value}
113+
value={ownerParam.value}
113114
onValueChange={(username)=>{
114-
if(username===usernameParam.value){
115-
usernameParam.setValue("");
115+
if(username===ownerParam.value){
116+
ownerParam.setValue("");
116117
return;
117118
}
118-
usernameParam.setValue(username);
119+
ownerParam.setValue(username);
119120
}}
120121
/>
121122
)}
122123
</div>
123124

124-
{!isCollapsed&&<TasksSidebarGroupusername={usernameParam.value}/>}
125+
{!isCollapsed&&<TasksSidebarGroupowner={ownerParam.value}/>}
125126
</div>
126127
);
127128
};
128129

129130
typeTasksSidebarGroupProps={
130-
username:string;
131+
owner:string;
131132
};
132133

133-
constTasksSidebarGroup:FC<TasksSidebarGroupProps>=({username})=>{
134-
constfilter={username};
134+
constTasksSidebarGroup:FC<TasksSidebarGroupProps>=({owner})=>{
135+
constfilter:TasksFilter={owner};
135136
consttasksQuery=useQuery({
136137
queryKey:["tasks",filter],
137138
queryFn:()=>API.experimental.getTasks(filter),
@@ -145,8 +146,8 @@ const TasksSidebarGroup: FC<TasksSidebarGroupProps> = ({ username }) => {
145146
<divclassName="flex flex-col flex-1 gap-1">
146147
{tasksQuery.data ?(
147148
tasksQuery.data.length>0 ?(
148-
tasksQuery.data.map((t)=>(
149-
<TaskSidebarMenuItemkey={t.workspace.id}task={t}/>
149+
tasksQuery.data.map((task)=>(
150+
<TaskSidebarMenuItemkey={task.id}task={task}/>
150151
))
151152
) :(
152153
<divclassName="text-content-secondary text-xs p-4 border-border border-solid rounded text-center">
@@ -175,8 +176,8 @@ type TaskSidebarMenuItemProps = {
175176
};
176177

177178
constTaskSidebarMenuItem:FC<TaskSidebarMenuItemProps>=({ task})=>{
178-
const{workspace}=useParams<{workspace:string}>();
179-
constisActive=task.workspace.name===workspace;
179+
const{task:taskName}=useParams<{task:string}>();
180+
constisActive=task.name===taskName;
180181
const[isDeleteDialogOpen,setIsDeleteDialogOpen]=useState(false);
181182
constnavigate=useNavigate();
182183

@@ -197,12 +198,12 @@ const TaskSidebarMenuItem: FC<TaskSidebarMenuItemProps> = ({ task }) => {
197198
>
198199
<RouterLink
199200
to={{
200-
pathname:`/tasks/${task.workspace.owner_name}/${task.workspace.name}`,
201+
pathname:`/tasks/${task.owner_name}/${task.name}`,
201202
search:window.location.search,
202203
}}
203204
>
204205
<TaskSidebarMenuItemStatustask={task}/>
205-
<spanclassName="truncate">{task.workspace.name}</span>
206+
<spanclassName="truncate">{task.name}</span>
206207
<DropdownMenu>
207208
<DropdownMenuTriggerasChild>
208209
<Button
@@ -256,40 +257,18 @@ const TaskSidebarMenuItem: FC<TaskSidebarMenuItemProps> = ({ task }) => {
256257
);
257258
};
258259

259-
consttaskStatusVariants=cva("block size-2 rounded-full shrink-0",{
260-
variants:{
261-
state:{
262-
default:"border border-content-secondary border-solid",
263-
complete:"bg-content-success",
264-
failure:"bg-content-destructive",
265-
idle:"bg-content-secondary",
266-
working:"bg-highlight-sky",
267-
},
268-
},
269-
defaultVariants:{
270-
state:"default",
271-
},
272-
});
273-
274260
constTaskSidebarMenuItemStatus:FC<{task:Task}>=({ task})=>{
275-
conststatusText=task.workspace.latest_app_status
276-
?task.workspace.latest_app_status.state
277-
:"No activity yet";
278-
279261
return(
280262
<TooltipProvider>
281263
<Tooltip>
282264
<TooltipTriggerasChild>
283-
<div
284-
className={taskStatusVariants({
285-
state:task.workspace.latest_app_status?.state??"default",
286-
})}
287-
>
288-
<spanclassName="sr-only">{statusText}</span>
289-
</div>
265+
<StatusIndicatorDot
266+
variant={taskStatusToStatusIndicatorVariant[task.status]}
267+
aria-label={task.status}
268+
/>
290269
</TooltipTrigger>
291270
<TooltipContentclassName="first-letter:capitalize">
292-
{statusText}
271+
{task.status}
293272
</TooltipContent>
294273
</Tooltip>
295274
</TooltipProvider>

‎site/src/testHelpers/entities.ts‎

Lines changed: 25 additions & 38 deletions
Original file line numberDiff line numberDiff line change
@@ -4982,48 +4982,13 @@ export const MockAIPromptPresets: TypesGen.Preset[] = [
49824982
},
49834983
];
49844984

4985-
// Mock Tasks for AI Tasks page
4986-
exportconstMockTasks=[
4987-
{
4988-
workspace:{
4989-
...MockWorkspace,
4990-
name:"create-competitors-page",
4991-
latest_app_status:MockWorkspaceAppStatus,
4992-
},
4993-
prompt:"Create competitors page",
4994-
},
4995-
{
4996-
workspace:{
4997-
...MockWorkspace,
4998-
id:"workspace-2",
4999-
name:"fix-avatar-size",
5000-
latest_app_status:{
5001-
...MockWorkspaceAppStatus,
5002-
message:"Avatar size fixed!",
5003-
},
5004-
},
5005-
prompt:"Fix user avatar size",
5006-
},
5007-
{
5008-
workspace:{
5009-
...MockWorkspace,
5010-
id:"workspace-3",
5011-
name:"fix-accessibility-issues",
5012-
latest_app_status:{
5013-
...MockWorkspaceAppStatus,
5014-
message:"Accessibility issues fixed!",
5015-
},
5016-
},
5017-
prompt:"Fix accessibility issues",
5018-
},
5019-
];
5020-
5021-
exportconstMockTask:TypesGen.Task={
4985+
exportconstMockTask={
50224986
id:"test-task",
50234987
name:"task-wild-test-123",
50244988
organization_id:MockOrganization.id,
50254989
owner_id:MockUserOwner.id,
50264990
owner_name:MockUserOwner.username,
4991+
owner_avatar_url:MockUserOwner.avatar_url,
50274992
template_id:MockTemplate.id,
50284993
template_name:MockTemplate.name,
50294994
template_display_name:MockTemplate.display_name,
@@ -5046,7 +5011,7 @@ export const MockTask: TypesGen.Task = {
50465011
},
50475012
created_at:"2022-05-17T17:39:01.382927298Z",
50485013
updated_at:"2022-05-17T17:39:01.382927298Z",
5049-
};
5014+
}satisfiesTypesGen.Task;
50505015

50515016
exportconstMockNewTaskData={
50525017
prompt:"Create a new task",
@@ -5059,3 +5024,25 @@ export const MockNewTaskData = {
50595024
},
50605025
},
50615026
};
5027+
5028+
exportconstMockTasks:TypesGen.Task[]=[
5029+
MockTask,
5030+
{
5031+
...MockTask,
5032+
id:"task-2",
5033+
name:"fix-avatar-size",
5034+
current_state:{
5035+
...MockTask.current_state,
5036+
message:"Avatar size fixed!",
5037+
},
5038+
},
5039+
{
5040+
...MockTask,
5041+
id:"task-3",
5042+
name:"fix-accessibility-issues",
5043+
current_state:{
5044+
...MockTask.current_state,
5045+
message:"Accessibility issues fixed!",
5046+
},
5047+
},
5048+
];

0 commit comments

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