fix deployment update cards

This commit is contained in:
kv
2023-07-27 13:55:48 -07:00
parent 485b337c72
commit a55d4e3c6f
3 changed files with 25 additions and 21 deletions

View File

@@ -8,25 +8,27 @@ const fmt_date = (d: Date) =>
export const SingleUpdate = ({ update }: { update: Update }) => (
<UpdateDetails update={update}>
<div
className="grid gap-4 justify-start items-center cursor-pointer"
style={{ gridTemplateColumns: "1fr 1.75fr 1fr" }}
>
<div className="flex items-center gap-2">
<Calendar className="w-4 h-4" />
<div className="text-xs">
{update.end_ts ? fmt_date(new Date(update.end_ts)) : "ongoing"}
<div className="px-2 py-4 hover:bg-muted transition-colors border-b last:border-none cursor-pointer">
<div
className="grid gap-4 justify-start items-center"
style={{ gridTemplateColumns: "1fr 1.75fr 1fr" }}
>
<div className="flex items-center gap-2">
<Calendar className="w-4 h-4" />
<div className="text-xs">
{update.end_ts ? fmt_date(new Date(update.end_ts)) : "ongoing"}
</div>
</div>
</div>
<div className="text-sm w-full">
{update.operation.match(/[A-Z][a-z]+|[0-9]+/g)?.join(" ")}{" "}
{version_to_string(update.version)}
</div>
<div className="text-sm w-full">
{update.operation.match(/[A-Z][a-z]+|[0-9]+/g)?.join(" ")}{" "}
{version_to_string(update.version)}
</div>
<div className="flex items-center gap-2 text-sm">
<User className="w-4 h-4" />
<UpdateUser userId={update.operator} />
<div className="flex items-center gap-2 text-sm">
<User className="w-4 h-4" />
<UpdateUser userId={update.operator} />
</div>
</div>
</div>
</UpdateDetails>

View File

@@ -50,10 +50,12 @@ export const DeploymentLogs = () => {
{["stdout", "stderr"].map((t) => (
<TabsContent key={t} className="h-full relative" value={t}>
<div className="h-[60vh] overflow-y-scroll">
<pre id={t}>{data?.[t as keyof typeof data] || `no ${t} logs`}</pre>
<pre id={t} className="scroll-mb-24">
{data?.[t as keyof typeof data] || `no ${t} logs`}
</pre>
</div>
<Button
className="absolute bottom-4 right-4"
className="absolute bottom-4 right-4 scroll-mt-24"
onClick={scroll_to_bottom(t)}
>
<ChevronDown className="h-4 w-4" />

View File

@@ -36,11 +36,11 @@ const DeploymentUpdates = ({ id }: { id: string }) => {
</CardHeader>
<CardContent>
<CardDescription className="flex items-center gap-2">
<Calendar className="w-4 h-4" />
{fmt_update_date(new Date(update.start_ts))}
<User className="w-4 h-4" /> {update.operator}
</CardDescription>
<CardDescription className="flex items-center gap-2">
<User className="w-4 h-4" /> {update.operator}
<Calendar className="w-4 h-4" />
{fmt_update_date(new Date(update.start_ts))}
</CardDescription>
</CardContent>
</Card>