admin/bodyshop
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merged in release/2025-12-05 (pull request #2690)

Browse Source 
feature/IO-3457-Job-Lifecycle-Tags
This commit is contained in:
Dave Richer
2025-12-04 21:23:48 +00:00
parent 0ef68afa0c 77268d5f5b
commit 6032ff0e5d
2 changed files with 48 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

28
client/src/components/dashboard-components/job-lifecycle/job-lifecycle-dashboard.component.jsx
View File

@@ -142,17 +142,37 @@ export default function JobLifecycleDashboardComponent({ data, bodyshop, ...card
title={t("job_lifecycle.content.legend_title")} title={t("job_lifecycle.content.legend_title")}
style={{ marginTop: "10px" }} style={{ marginTop: "10px" }}
> >
<div> <div
style={{
display: "flex",
flexWrap: "wrap",
gap: 8
}}
>
{lifecycleData.summations.map((key) => ( {lifecycleData.summations.map((key) => (
<Tag key={key.status} color={key.color} style={{ width: "13vh", padding: "4px", margin: "4px" }}> <Tag
key={key.status}
color={key.color}
style={{
// IMPORTANT: let the tag grow with its content
width: "auto",
padding: 0,
margin: 0,
display: "inline-flex",
alignItems: "center",
justifyContent: "center",
boxSizing: "border-box"
}}
>
<div <div
aria-label={`${key.status} | ${key.roundedPercentage} | ${key.humanReadable}`} aria-label={`${key.status} | ${key.roundedPercentage} | ${key.humanReadable}`}
title={`${key.status} | ${key.roundedPercentage} | ${key.humanReadable}`} title={`${key.status} | ${key.roundedPercentage} | ${key.humanReadable}`}
style={{ style={{
backgroundColor: "var(--tag-wrapper-bg)", backgroundColor: "var(--tag-wrapper-bg)",
color: "var(--tag-wrapper-text)", color: "var(--tag-wrapper-text)",
padding: "4px", padding: "4px 8px",
textAlign: "center" textAlign: "center",
whiteSpace: "nowrap" // keep it on one line while letting the pill expand
}} }}
> >
{key.status} [{lifecycleData.statusCounts[key.status]}] ({key.roundedPercentage}) {key.status} [{lifecycleData.statusCounts[key.status]}] ({key.roundedPercentage})

28
client/src/components/job-lifecycle/job-lifecycle.component.jsx
View File

@@ -222,17 +222,37 @@ export function JobLifecycleComponent({ bodyshop, job, statuses }) {
</div> </div>
</BlurWrapperComponent> </BlurWrapperComponent>
<Card type="inner" title={t("job_lifecycle.content.legend_title")} style={{ marginTop: "10px" }}> <Card type="inner" title={t("job_lifecycle.content.legend_title")} style={{ marginTop: "10px" }}>
<div> <div
style={{
display: "flex",
flexWrap: "wrap",
gap: 8
}}
>
{lifecycleData.durations.summations.map((key) => ( {lifecycleData.durations.summations.map((key) => (
<Tag key={key.status} color={key.color} style={{ width: "13vh", padding: "4px", margin: "4px" }}> <Tag
key={key.status}
color={key.color}
style={{
// let the tag grow with its content
width: "auto",
padding: 0,
margin: 0,
display: "inline-flex",
alignItems: "center",
justifyContent: "center",
boxSizing: "border-box"
}}
>
<div <div
aria-label={`${key.status} | ${key.roundedPercentage} | ${key.humanReadable}`} aria-label={`${key.status} | ${key.roundedPercentage} | ${key.humanReadable}`}
title={`${key.status} | ${key.roundedPercentage} | ${key.humanReadable}`} title={`${key.status} | ${key.roundedPercentage} | ${key.humanReadable}`}
style={{ style={{
backgroundColor: "var(--tag-wrapper-bg)", backgroundColor: "var(--tag-wrapper-bg)",
color: "var(--tag-wrapper-text)", color: "var(--tag-wrapper-text)",
padding: "4px", padding: "4px 8px",
textAlign: "center" textAlign: "center",
whiteSpace: "nowrap" // single line; tag gets wider instead of text escaping
}} }}
> >
{key.status} ( {key.status} (