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

Commit0ee7480

Browse files
committed
chore: ranges instead of range
1 parentf651e46 commit0ee7480

File tree

2 files changed

+75
-57
lines changed

2 files changed

+75
-57
lines changed

‎site/src/modules/workspaces/WorkspaceTiming/StagesChart.tsx‎

Lines changed: 58 additions & 50 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
importtype{Interpolation,Theme}from"@emotion/react";
22
importtype{TimingStage}from"api/typesGenerated";
3+
import{T}from"lodash/fp";
34
import{CircleAlertIcon,InfoIcon}from"lucide-react";
45
importtype{FC}from"react";
56
import{Bar,ClickableBar}from"./Chart/Bar";
@@ -52,7 +53,7 @@ export type Stage = {
5253
tooltip:Omit<TooltipProps,"children">;
5354
};
5455

55-
typeStageTiming={
56+
exporttypeStageTiming={
5657
stage:Stage;
5758
/**
5859
* Represents the number of resources included in this stage that can be
@@ -65,7 +66,7 @@ type StageTiming = {
6566
* duration of the stage and to position the stage within the chart. This can
6667
* be undefined if a stage has no timing data.
6768
*/
68-
range:TimeRange|undefined;
69+
ranges:TimeRange[]|undefined;
6970
/**
7071
* Display an error icon within the bar to indicate when a stage has failed.
7172
* This is used in the agent scripts stage.
@@ -83,11 +84,15 @@ export const StagesChart: FC<StagesChartProps> = ({
8384
onSelectStage,
8485
})=>{
8586
consttotalRange=mergeTimeRanges(
86-
timings.map((t)=>t.range).filter((t)=>t!==undefined),
87+
timings
88+
.map((t)=>t.ranges)
89+
.filter((t)=>t!==undefined)
90+
.flat(),
8791
);
8892
consttotalTime=calcDuration(totalRange);
8993
const[ticks,scale]=makeTicks(totalTime);
9094
constsections=Array.from(newSet(timings.map((t)=>t.stage.section)));
95+
console.log("timings",timings);
9196

9297
return(
9398
<Chart>
@@ -129,11 +134,12 @@ export const StagesChart: FC<StagesChartProps> = ({
129134
conststageTimings=timings.filter(
130135
(t)=>t.stage.section===section,
131136
);
137+
132138
return(
133139
<XAxisSectionkey={section}>
134140
{stageTimings.map((t)=>{
135141
// If the stage has no timing data, we just want to render an empty row
136-
if(t.range===undefined){
142+
if(t.ranges===undefined){
137143
return(
138144
<XAxisRow
139145
key={t.stage.name}
@@ -142,53 +148,55 @@ export const StagesChart: FC<StagesChartProps> = ({
142148
);
143149
}
144150

145-
constvalue=calcDuration(t.range);
146-
constoffset=calcOffset(t.range,totalRange);
147-
constvalidDuration=value>0&&!Number.isNaN(value);
151+
returnt.ranges?.map((range,index)=>{
152+
constvalue=calcDuration(range);
153+
constoffset=calcOffset(range,totalRange);
154+
constvalidDuration=value>0&&!Number.isNaN(value);
148155

149-
return(
150-
<XAxisRow
151-
key={t.stage.name}
152-
yAxisLabelId={encodeURIComponent(t.stage.name)}
153-
>
154-
{/** We only want to expand stages with more than one resource */}
155-
{t.visibleResources>1 ?(
156-
<ClickableBar
157-
aria-label={`View${t.stage.label} details`}
158-
scale={scale}
159-
value={value}
160-
offset={offset}
161-
onClick={()=>{
162-
onSelectStage(t.stage);
163-
}}
164-
>
165-
{t.error&&(
166-
<CircleAlertIcon
167-
className="size-icon-sm"
168-
css={{
169-
color:"#F87171",
170-
marginRight:4,
171-
}}
172-
/>
173-
)}
174-
<Blockscount={t.visibleResources}/>
175-
</ClickableBar>
176-
) :(
177-
<Barscale={scale}value={value}offset={offset}/>
178-
)}
179-
{validDuration ?(
180-
<span>{formatTime(value)}</span>
181-
) :(
182-
<span
183-
css={(theme)=>({
184-
color:theme.palette.error.main,
185-
})}
186-
>
187-
Invalid
188-
</span>
189-
)}
190-
</XAxisRow>
191-
);
156+
return(
157+
<XAxisRow
158+
key={t.stage.name+index}
159+
yAxisLabelId={encodeURIComponent(t.stage.name)}
160+
>
161+
{/** We only want to expand stages with more than one resource */}
162+
{t.visibleResources>1 ?(
163+
<ClickableBar
164+
aria-label={`View${t.stage.label} details`}
165+
scale={scale}
166+
value={value}
167+
offset={offset}
168+
onClick={()=>{
169+
onSelectStage(t.stage);
170+
}}
171+
>
172+
{t.error&&(
173+
<CircleAlertIcon
174+
className="size-icon-sm"
175+
css={{
176+
color:"#F87171",
177+
marginRight:4,
178+
}}
179+
/>
180+
)}
181+
<Blockscount={t.visibleResources}/>
182+
</ClickableBar>
183+
) :(
184+
<Barscale={scale}value={value}offset={offset}/>
185+
)}
186+
{validDuration ?(
187+
<span>{formatTime(value)}</span>
188+
) :(
189+
<span
190+
css={(theme)=>({
191+
color:theme.palette.error.main,
192+
})}
193+
>
194+
Invalid
195+
</span>
196+
)}
197+
</XAxisRow>
198+
);
199+
});
192200
})}
193201
</XAxisSection>
194202
);

‎site/src/modules/workspaces/WorkspaceTiming/WorkspaceTimings.tsx‎

Lines changed: 17 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -28,6 +28,7 @@ import {
2828
provisioningStages,
2929
typeStage,
3030
StagesChart,
31+
typeStageTiming,
3132
}from"./StagesChart";
3233

3334
typeTimingView=
@@ -130,16 +131,25 @@ export const WorkspaceTimings: FC<WorkspaceTimingsProps> = ({
130131
<divcss={styles.collapseBody}>
131132
{view.name==="default"&&(
132133
<StagesChart
133-
timings={stages.map((s)=>{
134+
timings={stages.map((s):StageTiming=>{
134135
conststageTimings=timings.filter(
135136
// graph has 2 stages, `graph` and `graph_second`
136-
(t)=>t.stage===s.name||s.alternativeNames?.includes(t.stage),
137+
(t)=>
138+
t.stage===s.name||
139+
s.alternativeNames?.includes(t.stage),
137140
);
138-
// console.log(s.name, stageTimings)
139-
conststageRange=
140-
stageTimings.length===0
141+
142+
143+
constkeyedRanges=stageTimings.reduce<Record<string,TimeRange[]>>(
144+
(acc,t)=>{
145+
acc[t.stage]=acc[t.stage]||[];
146+
acc[t.stage].push(toTimeRange(t));
147+
returnacc;
148+
},{});
149+
150+
conststageRanges=stageTimings.length===0
141151
?undefined
142-
:mergeTimeRanges(stageTimings.map(toTimeRange));
152+
:Object.entries(keyedRanges).map(([_,ranges])=>mergeTimeRanges(ranges));
143153

144154
// Prevent users from inspecting internal coder resources in
145155
// provisioner timings because they were not useful to the
@@ -160,7 +170,7 @@ export const WorkspaceTimings: FC<WorkspaceTimingsProps> = ({
160170

161171
return{
162172
stage:s,
163-
range:stageRange,
173+
ranges:stageRanges,
164174
visibleResources:visibleResources.length,
165175
error:stageTimings.some(
166176
(t)=>"status"int&&t.status==="exit_failure",

0 commit comments

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