Skip to content

Commit 3133297

Browse files
geroplroboquat
geropl
authored and
roboquat
committed
[dashboard] Fix PrebuildLogs layout
1 parent d873fe7 commit 3133297

File tree

4 files changed

+62
-49
lines changed

4 files changed

+62
-49
lines changed

‎components/dashboard/src/components/PrebuildLogs.tsx

Lines changed: 8 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -106,16 +106,18 @@ export default function PrebuildLogs(props: PrebuildLogsProps) {
106106
}, [props.workspaceId, workspaceInstance?.status.phase]);
107107

108108
return (
109-
<>
110-
<Suspense fallback={<div />}>
111-
<WorkspaceLogs logsEmitter={logsEmitter} errorMessage={error?.message} />
112-
</Suspense>
113-
<div className="h-20 px-6 border-gray-200 dark:border-gray-600 flex space-x-2">
109+
<div className="rounded-xl overflow-hidden bg-gray-100 dark:bg-gray-800 flex flex-col">
110+
<div className="h-96 flex">
111+
<Suspense fallback={<div />}>
112+
<WorkspaceLogs classes="h-full w-full" logsEmitter={logsEmitter} errorMessage={error?.message} />
113+
</Suspense>
114+
</div>
115+
<div className="h-20 px-6 bg-gray-50 dark:bg-gray-800 border-t border-gray-200 dark:border-gray-600 flex space-x-2">
114116
{prebuild && <PrebuildStatus prebuild={prebuild} />}
115117
<div className="flex-grow" />
116118
{props.children}
117119
</div>
118-
</>
120+
</div>
119121
);
120122
}
121123

‎components/dashboard/src/projects/Prebuild.tsx

Lines changed: 34 additions & 36 deletions
Original file line numberDiff line numberDiff line change
@@ -155,42 +155,40 @@ export default function () {
155155
<>
156156
<Header title={renderTitle()} subtitle={renderSubtitle()} />
157157
<div className="app-container mt-8">
158-
<div className="rounded-xl overflow-hidden bg-gray-100 dark:bg-gray-800 flex flex-col">
159-
<PrebuildLogs workspaceId={prebuild?.info?.buildWorkspaceId}>
160-
{["aborted", "timeout", "failed"].includes(prebuild?.status || "") || !!prebuild?.error ? (
161-
<button
162-
className="flex items-center space-x-2"
163-
disabled={isRerunningPrebuild}
164-
onClick={rerunPrebuild}
165-
>
166-
{isRerunningPrebuild && (
167-
<img className="h-4 w-4 animate-spin filter brightness-150" src={Spinner} />
168-
)}
169-
<span>Rerun Prebuild ({prebuild?.info.branch})</span>
170-
</button>
171-
) : ["building", "queued"].includes(prebuild?.status || "") ? (
172-
<button
173-
className="danger flex items-center space-x-2"
174-
disabled={isCancellingPrebuild}
175-
onClick={cancelPrebuild}
176-
>
177-
{isCancellingPrebuild && (
178-
<img className="h-4 w-4 animate-spin filter brightness-150" src={Spinner} />
179-
)}
180-
<span>Cancel Prebuild</span>
181-
</button>
182-
) : prebuild?.status === "available" ? (
183-
<a
184-
className="my-auto"
185-
href={gitpodHostUrl.withContext(`${prebuild?.info.changeUrl}`).toString()}
186-
>
187-
<button>New Workspace ({prebuild?.info.branch})</button>
188-
</a>
189-
) : (
190-
<button disabled={true}>New Workspace ({prebuild?.info.branch})</button>
191-
)}
192-
</PrebuildLogs>
193-
</div>
158+
<PrebuildLogs workspaceId={prebuild?.info?.buildWorkspaceId}>
159+
{["aborted", "timeout", "failed"].includes(prebuild?.status || "") || !!prebuild?.error ? (
160+
<button
161+
className="flex items-center space-x-2"
162+
disabled={isRerunningPrebuild}
163+
onClick={rerunPrebuild}
164+
>
165+
{isRerunningPrebuild && (
166+
<img className="h-4 w-4 animate-spin filter brightness-150" src={Spinner} />
167+
)}
168+
<span>Rerun Prebuild ({prebuild?.info.branch})</span>
169+
</button>
170+
) : ["building", "queued"].includes(prebuild?.status || "") ? (
171+
<button
172+
className="danger flex items-center space-x-2"
173+
disabled={isCancellingPrebuild}
174+
onClick={cancelPrebuild}
175+
>
176+
{isCancellingPrebuild && (
177+
<img className="h-4 w-4 animate-spin filter brightness-150" src={Spinner} />
178+
)}
179+
<span>Cancel Prebuild</span>
180+
</button>
181+
) : prebuild?.status === "available" ? (
182+
<a
183+
className="my-auto"
184+
href={gitpodHostUrl.withContext(`${prebuild?.info.changeUrl}`).toString()}
185+
>
186+
<button>New Workspace ({prebuild?.info.branch})</button>
187+
</a>
188+
) : (
189+
<button disabled={true}>New Workspace ({prebuild?.info.branch})</button>
190+
)}
191+
</PrebuildLogs>
194192
</div>
195193
</>
196194
);

‎components/dashboard/src/start/CreateWorkspace.tsx

Lines changed: 8 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -488,11 +488,14 @@ function RunningPrebuildView(props: RunningPrebuildViewProps) {
488488

489489
return (
490490
<StartPage title="Prebuild in Progress">
491-
<PrebuildLogs workspaceId={props.runningPrebuild.workspaceID} onIgnorePrebuild={props.onIgnorePrebuild}>
492-
<button className="secondary" onClick={() => props.onIgnorePrebuild && props.onIgnorePrebuild()}>
493-
Skip Prebuild
494-
</button>
495-
</PrebuildLogs>
491+
{/* TODO(gpl) Copied around in Start-/CreateWorkspace. This should properly go somewhere central. */}
492+
<div className="mt-6 w-11/12 lg:w-3/5 overflow-hidden">
493+
<PrebuildLogs workspaceId={props.runningPrebuild.workspaceID} onIgnorePrebuild={props.onIgnorePrebuild}>
494+
<button className="secondary" onClick={() => props.onIgnorePrebuild && props.onIgnorePrebuild()}>
495+
Skip Prebuild
496+
</button>
497+
</PrebuildLogs>
498+
</div>
496499
</StartPage>
497500
);
498501
}

‎components/dashboard/src/start/StartWorkspace.tsx

Lines changed: 12 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -443,7 +443,12 @@ export default class StartWorkspace extends React.Component<StartWorkspaceProps,
443443
// or as a headless workspace.
444444
case "running":
445445
if (isPrebuild) {
446-
return <PrebuildLogs workspaceId={this.props.workspaceId} />;
446+
return (
447+
<div className="mt-6 w-11/12 lg:w-3/5 overflow-hidden">
448+
{/* TODO(gpl) These classes are copied around in Start-/CreateWorkspace. This should properly go somewhere central. */}
449+
<PrebuildLogs workspaceId={this.props.workspaceId} />
450+
</div>
451+
);
447452
}
448453
if (!this.state.desktopIde) {
449454
phase = StartPhase.Running;
@@ -570,7 +575,12 @@ export default class StartWorkspace extends React.Component<StartWorkspaceProps,
570575
// Stopping means that the workspace is currently shutting down. It could go to stopped every moment.
571576
case "stopping":
572577
if (isPrebuild) {
573-
return <PrebuildLogs workspaceId={this.props.workspaceId} />;
578+
return (
579+
<div className="mt-6 w-11/12 lg:w-3/5 overflow-hidden">
580+
{/* TODO(gpl) These classes are copied around in Start-/CreateWorkspace. This should properly go somewhere central. */}
581+
<PrebuildLogs workspaceId={this.props.workspaceId} />
582+
</div>
583+
);
574584
}
575585
phase = StartPhase.Stopping;
576586
statusMessage = (

0 commit comments

Comments
 (0)