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

Commitf5fac29

Browse files
authored
fix(site): show available logs consistently on template creation page (#19832)
1 parentea71808 commitf5fac29

File tree

5 files changed

+45
-94
lines changed

5 files changed

+45
-94
lines changed

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

Lines changed: 22 additions & 29 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,16 @@
1-
import{typeInterpolation,typeTheme,useTheme}from"@emotion/react";
1+
importtype{Interpolation,Theme}from"@emotion/react";
22
importtype{ProvisionerJobLog,WorkspaceBuild}from"api/typesGenerated";
33
importtype{Line}from"components/Logs/LogLine";
44
import{DEFAULT_LOG_LINE_SIDE_PADDING,Logs}from"components/Logs/Logs";
55
importdayjsfrom"dayjs";
6-
import{typeFC,Fragment,typeHTMLAttributes,useMemo}from"react";
7-
import{BODY_FONT_FAMILY,MONOSPACE_FONT_FAMILY}from"theme/constants";
6+
import{
7+
typeFC,
8+
Fragment,
9+
typeHTMLAttributes,
10+
useLayoutEffect,
11+
useRef,
12+
}from"react";
13+
import{BODY_FONT_FAMILY}from"theme/constants";
814

915
constLanguage={
1016
seconds:"seconds",
@@ -43,45 +49,32 @@ interface WorkspaceBuildLogsProps extends HTMLAttributes<HTMLDivElement> {
4349
sticky?:boolean;
4450
logs:ProvisionerJobLog[];
4551
build?:WorkspaceBuild;
52+
disableAutoscroll?:boolean;
4653
}
4754

4855
exportconstWorkspaceBuildLogs:FC<WorkspaceBuildLogsProps>=({
4956
hideTimestamps,
5057
sticky,
5158
logs,
5259
build,
60+
disableAutoscroll,
61+
className,
5362
...attrs
5463
})=>{
55-
consttheme=useTheme();
56-
57-
const_processedLogs=useMemo(()=>{
58-
constallLogs=logs||[];
59-
60-
// Add synthetic overflow message if needed
61-
if(build?.job?.logs_overflowed){
62-
allLogs.push({
63-
id:-1,
64-
created_at:newDate().toISOString(),
65-
log_level:"error",
66-
log_source:"provisioner",
67-
output:
68-
"Provisioner logs exceeded the max size of 1MB. Will not continue to write provisioner logs for workspace build.",
69-
stage:"overflow",
70-
});
71-
}
72-
73-
returnallLogs;
74-
},[logs,build?.job?.logs_overflowed]);
75-
7664
constgroupedLogsByStage=groupLogsByStage(logs);
7765

66+
constref=useRef<HTMLDivElement>(null);
67+
useLayoutEffect(()=>{
68+
if(disableAutoscroll||logs.length===0){
69+
return;
70+
}
71+
ref.current?.scrollIntoView({block:"end"});
72+
},[logs,disableAutoscroll]);
73+
7874
return(
7975
<div
80-
css={{
81-
border:`1px solid${theme.palette.divider}`,
82-
borderRadius:8,
83-
fontFamily:MONOSPACE_FONT_FAMILY,
84-
}}
76+
ref={ref}
77+
className="font-mono border border-border rounded-lg"
8578
{...attrs}
8679
>
8780
{Object.entries(groupedLogsByStage).map(([stage,logs])=>{

‎site/src/pages/CreateTemplatePage/BuildLogsDrawer.tsx‎

Lines changed: 19 additions & 36 deletions
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,7 @@ import { AlertVariant } from "modules/provisioners/ProvisionerAlert";
1111
import{ProvisionerStatusAlert}from"modules/provisioners/ProvisionerStatusAlert";
1212
import{useWatchVersionLogs}from"modules/templates/useWatchVersionLogs";
1313
import{WorkspaceBuildLogs}from"modules/workspaces/WorkspaceBuildLogs/WorkspaceBuildLogs";
14-
import{typeFC,useLayoutEffect,useRef}from"react";
14+
importtype{FC}from"react";
1515
import{navHeight}from"theme/constants";
1616

1717
typeBuildLogsDrawerProps={
@@ -29,27 +29,6 @@ export const BuildLogsDrawer: FC<BuildLogsDrawerProps> = ({
2929
...drawerProps
3030
})=>{
3131
constlogs=useWatchVersionLogs(templateVersion);
32-
constlogsContainer=useRef<HTMLDivElement>(null);
33-
34-
constscrollToBottom=()=>{
35-
setTimeout(()=>{
36-
if(logsContainer.current){
37-
logsContainer.current.scrollTop=logsContainer.current.scrollHeight;
38-
}
39-
},0);
40-
};
41-
42-
// biome-ignore lint/correctness/useExhaustiveDependencies: consider refactoring
43-
useLayoutEffect(()=>{
44-
scrollToBottom();
45-
},[logs]);
46-
47-
// biome-ignore lint/correctness/useExhaustiveDependencies: consider refactoring
48-
useLayoutEffect(()=>{
49-
if(drawerProps.open){
50-
scrollToBottom();
51-
}
52-
},[drawerProps.open]);
5332

5433
constisMissingVariables=
5534
errorinstanceofJobError&&
@@ -58,6 +37,7 @@ export const BuildLogsDrawer: FC<BuildLogsDrawerProps> = ({
5837
constmatchingProvisioners=templateVersion?.matched_provisioners?.count;
5938
constavailableProvisioners=
6039
templateVersion?.matched_provisioners?.available;
40+
consthasLogs=logs&&logs.length>0;
6141

6242
return(
6343
<Draweranchor="right"{...drawerProps}>
@@ -70,8 +50,6 @@ export const BuildLogsDrawer: FC<BuildLogsDrawerProps> = ({
7050
</IconButton>
7151
</header>
7252

73-
{}
74-
7553
{isMissingVariables ?(
7654
<MissingVariablesBanner
7755
onFillVariables={()=>{
@@ -80,23 +58,28 @@ export const BuildLogsDrawer: FC<BuildLogsDrawerProps> = ({
8058
});
8159
constfirstVariableInput=
8260
variablesSectionRef.current?.querySelector("input");
83-
setTimeout(()=>firstVariableInput?.focus(),0);
61+
firstVariableInput?.focus();
8462
drawerProps.onClose();
8563
}}
8664
/>
87-
) :availableProvisioners&&availableProvisioners>0&&logs ?(
88-
<sectionref={logsContainer}css={styles.logs}>
89-
<WorkspaceBuildLogslogs={logs}css={{border:0}}/>
90-
</section>
9165
) :(
9266
<>
93-
<ProvisionerStatusAlert
94-
matchingProvisioners={matchingProvisioners}
95-
availableProvisioners={availableProvisioners}
96-
tags={templateVersion?.job.tags??{}}
97-
variant={AlertVariant.Inline}
98-
/>
99-
<Loader/>
67+
{(matchingProvisioners===0||!hasLogs)&&(
68+
<ProvisionerStatusAlert
69+
matchingProvisioners={matchingProvisioners}
70+
availableProvisioners={availableProvisioners}
71+
tags={templateVersion?.job.tags??{}}
72+
variant={AlertVariant.Inline}
73+
/>
74+
)}
75+
76+
{hasLogs ?(
77+
<sectioncss={styles.logs}>
78+
<WorkspaceBuildLogslogs={logs}className="border-0"/>
79+
</section>
80+
) :(
81+
<Loader/>
82+
)}
10083
</>
10184
)}
10285
</div>

‎site/src/pages/TemplateVersionEditorPage/TemplateVersionEditor.tsx‎

Lines changed: 1 addition & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -197,15 +197,6 @@ export const TemplateVersionEditor: FC<TemplateVersionEditorProps> = ({
197197
constisEditorValueBinary=
198198
typeofeditorValue==="string" ?isBinaryData(editorValue) :false;
199199

200-
// Auto scroll
201-
constlogsContentRef=useRef<HTMLDivElement>(null);
202-
// biome-ignore lint/correctness/useExhaustiveDependencies: consider refactoring
203-
useEffect(()=>{
204-
if(logsContentRef.current){
205-
logsContentRef.current.scrollTop=logsContentRef.current.scrollHeight;
206-
}
207-
},[buildLogs,resources]);
208-
209200
useLeaveSiteWarning(dirty);
210201

211202
constcanBuild=!isBuilding;
@@ -596,10 +587,7 @@ export const TemplateVersionEditor: FC<TemplateVersionEditorProps> = ({
596587
</div>
597588

598589
{selectedTab==="logs"&&(
599-
<div
600-
css={[styles.logs,styles.tabContent]}
601-
ref={logsContentRef}
602-
>
590+
<divcss={[styles.logs,styles.tabContent]}>
603591
{templateVersion.job.error ?(
604592
<div>
605593
<ProvisionerAlert

‎site/src/pages/WorkspaceBuildPage/WorkspaceBuildPageView.tsx‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -299,6 +299,7 @@ const BuildLogsContent: FC<{
299299
}}
300300
logs={sortLogsByCreatedAt(logs)}
301301
build={build}
302+
disableAutoscroll
302303
/>
303304
);
304305
};

‎site/src/pages/WorkspacePage/WorkspaceBuildLogsSection.tsx‎

Lines changed: 2 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@ import { useTheme } from "@emotion/react";
22
importtype{ProvisionerJobLog}from"api/typesGenerated";
33
import{Loader}from"components/Loader/Loader";
44
import{WorkspaceBuildLogs}from"modules/workspaces/WorkspaceBuildLogs/WorkspaceBuildLogs";
5-
import{typeFC,useEffect,useRef}from"react";
5+
importtype{FC}from"react";
66

77
interfaceWorkspaceBuildLogsSectionProps{
88
logs?:ProvisionerJobLog[];
@@ -11,22 +11,8 @@ interface WorkspaceBuildLogsSectionProps {
1111
exportconstWorkspaceBuildLogsSection:FC<WorkspaceBuildLogsSectionProps>=({
1212
logs,
1313
})=>{
14-
constscrollRef=useRef<HTMLDivElement>(null);
1514
consttheme=useTheme();
1615

17-
// biome-ignore lint/correctness/useExhaustiveDependencies: reset scroll when logs change
18-
useEffect(()=>{
19-
// Auto scrolling makes hard to snapshot test using Chromatic
20-
if(process.env.STORYBOOK==="true"){
21-
return;
22-
}
23-
24-
constscrollEl=scrollRef.current;
25-
if(scrollEl){
26-
scrollEl.scrollTop=scrollEl.scrollHeight;
27-
}
28-
},[logs]);
29-
3016
return(
3117
<div
3218
css={{
@@ -50,7 +36,7 @@ export const WorkspaceBuildLogsSection: FC<WorkspaceBuildLogsSectionProps> = ({
5036
>
5137
Build logs
5238
</header>
53-
<divref={scrollRef}css={{height:"400px",overflowY:"auto"}}>
39+
<divcss={{height:"400px",overflowY:"auto"}}>
5440
{logs ?(
5541
<WorkspaceBuildLogs
5642
sticky

0 commit comments

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