Skip to content

Commit

Permalink
[dashboard] Fix PrebuildLogs layout
Browse files Browse the repository at this point in the history
  • Loading branch information
@geropl @roboquat
geropl authored and roboquat committed Jun 29, 2022
1 parent d873fe7 commit 3133297
Show file tree
Hide file tree
Showing 4 changed files with 62 additions and 49 deletions.
14 changes: 8 additions & 6 deletions components/dashboard/src/components/PrebuildLogs.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -106,16 +106,18 @@ export default function PrebuildLogs(props: PrebuildLogsProps) {
}, [props.workspaceId, workspaceInstance?.status.phase]);

return (
<>
<Suspense fallback={<div />}>
<WorkspaceLogs logsEmitter={logsEmitter} errorMessage={error?.message} />
</Suspense>
<div className="h-20 px-6 border-gray-200 dark:border-gray-600 flex space-x-2">
<div className="rounded-xl overflow-hidden bg-gray-100 dark:bg-gray-800 flex flex-col">
<div className="h-96 flex">
<Suspense fallback={<div />}>
<WorkspaceLogs classes="h-full w-full" logsEmitter={logsEmitter} errorMessage={error?.message} />
</Suspense>
</div>
<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">
{prebuild && <PrebuildStatus prebuild={prebuild} />}
<div className="flex-grow" />
{props.children}
</div>
</>
</div>
);
}

Expand Down
70 changes: 34 additions & 36 deletions components/dashboard/src/projects/Prebuild.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -155,42 +155,40 @@ export default function () {
<>
<Header title={renderTitle()} subtitle={renderSubtitle()} />
<div className="app-container mt-8">
<div className="rounded-xl overflow-hidden bg-gray-100 dark:bg-gray-800 flex flex-col">
<PrebuildLogs workspaceId={prebuild?.info?.buildWorkspaceId}>
{["aborted", "timeout", "failed"].includes(prebuild?.status || "") || !!prebuild?.error ? (
<button
className="flex items-center space-x-2"
disabled={isRerunningPrebuild}
onClick={rerunPrebuild}
>
{isRerunningPrebuild && (
<img className="h-4 w-4 animate-spin filter brightness-150" src={Spinner} />
)}
<span>Rerun Prebuild ({prebuild?.info.branch})</span>
</button>
) : ["building", "queued"].includes(prebuild?.status || "") ? (
<button
className="danger flex items-center space-x-2"
disabled={isCancellingPrebuild}
onClick={cancelPrebuild}
>
{isCancellingPrebuild && (
<img className="h-4 w-4 animate-spin filter brightness-150" src={Spinner} />
)}
<span>Cancel Prebuild</span>
</button>
) : prebuild?.status === "available" ? (
<a
className="my-auto"
href={gitpodHostUrl.withContext(`${prebuild?.info.changeUrl}`).toString()}
>
<button>New Workspace ({prebuild?.info.branch})</button>
</a>
) : (
<button disabled={true}>New Workspace ({prebuild?.info.branch})</button>
)}
</PrebuildLogs>
</div>
<PrebuildLogs workspaceId={prebuild?.info?.buildWorkspaceId}>
{["aborted", "timeout", "failed"].includes(prebuild?.status || "") || !!prebuild?.error ? (
<button
className="flex items-center space-x-2"
disabled={isRerunningPrebuild}
onClick={rerunPrebuild}
>
{isRerunningPrebuild && (
<img className="h-4 w-4 animate-spin filter brightness-150" src={Spinner} />
)}
<span>Rerun Prebuild ({prebuild?.info.branch})</span>
</button>
) : ["building", "queued"].includes(prebuild?.status || "") ? (
<button
className="danger flex items-center space-x-2"
disabled={isCancellingPrebuild}
onClick={cancelPrebuild}
>
{isCancellingPrebuild && (
<img className="h-4 w-4 animate-spin filter brightness-150" src={Spinner} />
)}
<span>Cancel Prebuild</span>
</button>
) : prebuild?.status === "available" ? (
<a
className="my-auto"
href={gitpodHostUrl.withContext(`${prebuild?.info.changeUrl}`).toString()}
>
<button>New Workspace ({prebuild?.info.branch})</button>
</a>
) : (
<button disabled={true}>New Workspace ({prebuild?.info.branch})</button>
)}
</PrebuildLogs>
</div>
</>
);
Expand Down
13 changes: 8 additions & 5 deletions components/dashboard/src/start/CreateWorkspace.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -488,11 +488,14 @@ function RunningPrebuildView(props: RunningPrebuildViewProps) {

return (
<StartPage title="Prebuild in Progress">
<PrebuildLogs workspaceId={props.runningPrebuild.workspaceID} onIgnorePrebuild={props.onIgnorePrebuild}>
<button className="secondary" onClick={() => props.onIgnorePrebuild && props.onIgnorePrebuild()}>
Skip Prebuild
</button>
</PrebuildLogs>
{/* TODO(gpl) Copied around in Start-/CreateWorkspace. This should properly go somewhere central. */}
<div className="mt-6 w-11/12 lg:w-3/5 overflow-hidden">
<PrebuildLogs workspaceId={props.runningPrebuild.workspaceID} onIgnorePrebuild={props.onIgnorePrebuild}>
<button className="secondary" onClick={() => props.onIgnorePrebuild && props.onIgnorePrebuild()}>
Skip Prebuild
</button>
</PrebuildLogs>
</div>
</StartPage>
);
}
14 changes: 12 additions & 2 deletions components/dashboard/src/start/StartWorkspace.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -443,7 +443,12 @@ export default class StartWorkspace extends React.Component<StartWorkspaceProps,
// or as a headless workspace.
case "running":
if (isPrebuild) {
return <PrebuildLogs workspaceId={this.props.workspaceId} />;
return (
<div className="mt-6 w-11/12 lg:w-3/5 overflow-hidden">
{/* TODO(gpl) These classes are copied around in Start-/CreateWorkspace. This should properly go somewhere central. */}
<PrebuildLogs workspaceId={this.props.workspaceId} />
</div>
);
}
if (!this.state.desktopIde) {
phase = StartPhase.Running;
Expand Down Expand Up @@ -570,7 +575,12 @@ export default class StartWorkspace extends React.Component<StartWorkspaceProps,
// Stopping means that the workspace is currently shutting down. It could go to stopped every moment.
case "stopping":
if (isPrebuild) {
return <PrebuildLogs workspaceId={this.props.workspaceId} />;
return (
<div className="mt-6 w-11/12 lg:w-3/5 overflow-hidden">
{/* TODO(gpl) These classes are copied around in Start-/CreateWorkspace. This should properly go somewhere central. */}
<PrebuildLogs workspaceId={this.props.workspaceId} />
</div>
);
}
phase = StartPhase.Stopping;
statusMessage = (
Expand Down

0 comments on commit 3133297

Please sign in to comment.