Skip to content

Commit 4b05241

Browse files
michaeljguarinomichaeljguarino
committed
stack committer information
1 parent 1b937c0 commit 4b05241

32 files changed

Lines changed: 563 additions & 237 deletions

‎assets/src/components/stacks/run/Header.tsx‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -170,6 +170,7 @@ function StackRunHeaderInfo({ stackRun }): ReactNode {
170170
>
171171
<GitCommitIcon />
172172
{stackRun.git?.ref}
173+
{stackRun.committer && <span>{stackRun.committer}</span>}
173174
</span>
174175
</div>
175176
)

‎assets/src/components/stacks/run/Sidecar.tsx‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -173,6 +173,9 @@ export default function StackRunSidecar({
173173
/>
174174
</SidecarItem>
175175
)}
176+
{stackRun.committer && (
177+
<SidecarItem heading="Committer">{stackRun.committer}</SidecarItem>
178+
)}
176179
<SidecarItem heading="Observability metrics">
177180
<StackObservabilityMetrics
178181
observableMetrics={stackRun.stack?.observableMetrics}

‎assets/src/components/stacks/run/repository/Repository.tsx‎

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -31,6 +31,14 @@ export default function StackRunRepository(): ReactNode {
3131
>
3232
{stackRun.git.ref}
3333
</Prop>
34+
{stackRun.committer && (
35+
<Prop
36+
title="Committer"
37+
margin={0}
38+
>
39+
{stackRun.committer}
40+
</Prop>
41+
)}
3442
<Prop
3543
title="Folder"
3644
margin={0}

‎assets/src/components/stacks/runs/StackRunsTable.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -96,7 +96,7 @@ const cols = [
9696
cell: function Cell({ getValue }) {
9797
const { colors } = useTheme()
9898
const { stack } = useOutletContext<Nullable<StackOutletContextT>>() ?? {}
99-
const { id, message, status, git } = getValue()
99+
const { id, message, committer, status, git } = getValue()
100100
return (
101101
<StackedText
102102
icon={
@@ -122,7 +122,7 @@ const cols = [
122122
second={
123123
<Flex gap="xsmall">
124124
<GitCommitIcon />
125-
<span>{git.ref}</span>
125+
<span>{committer ? `${git.ref} ${committer}` : git.ref}</span>
126126
</Flex>
127127
}
128128
secondPartialType="caption"

‎assets/src/components/workbenches/workbench/job/WorkbenchJobActionCard.tsx‎

Lines changed: 51 additions & 39 deletions
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,7 @@ import {
1414
getActionSubtitle,
1515
getActionTitle,
1616
} from './workbenchJobActionsUtils'
17+
import { WorkbenchJobActionDetails } from './WorkbenchJobActionDetails'
1718
import { WorkbenchJobKubeActionChips } from './WorkbenchJobKubeUpdateDiff'
1819

1920
export function WorkbenchJobActionCard({
@@ -28,44 +29,47 @@ export function WorkbenchJobActionCard({
2829

2930
return (
3031
<CardSC $status={activity.status}>
31-
<Flex
32-
align="center"
33-
gap="small"
34-
css={{ minWidth: 0, flex: 1 }}
35-
>
36-
<IconFrame
37-
circle
38-
size="medium"
39-
type="secondary"
40-
icon={icon ?? <KubernetesIcon size={16} />}
41-
css={{
42-
flexShrink: 0,
43-
border: theme.borders['fill-two'],
44-
backgroundColor: 'transparent',
45-
}}
32+
<HeaderSC>
33+
<Flex
34+
align="center"
35+
gap="small"
36+
css={{ minWidth: 0, flex: 1 }}
37+
>
38+
<IconFrame
39+
circle
40+
size="medium"
41+
type="secondary"
42+
icon={icon ?? <KubernetesIcon size={16} />}
43+
css={{
44+
flexShrink: 0,
45+
border: theme.borders['fill-two'],
46+
backgroundColor: 'transparent',
47+
}}
48+
/>
49+
<StackedText
50+
first={getActionTitle(activity)}
51+
firstPartialType="body2Bold"
52+
firstColor="text-light"
53+
second={getActionSubtitle(activity)}
54+
secondColor="text-xlight"
55+
truncate
56+
css={{ flex: 1, minWidth: 0 }}
57+
/>
58+
</Flex>
59+
<WorkbenchJobKubeActionChips
60+
type={activity.type}
61+
method={activity.result?.kubeRequest?.method}
4662
/>
47-
<StackedText
48-
first={getActionTitle(activity)}
49-
firstPartialType="body2Bold"
50-
firstColor="text-light"
51-
second={getActionSubtitle(activity)}
52-
secondColor="text-xlight"
53-
truncate
54-
css={{ flex: 1, minWidth: 0 }}
55-
/>
56-
</Flex>
57-
<WorkbenchJobKubeActionChips
58-
type={activity.type}
59-
method={activity.result?.kubeRequest?.method}
60-
/>
61-
<Button
62-
small
63-
secondary
64-
onClick={onView}
65-
css={{ flexShrink: 0 }}
66-
>
67-
{getActionDetailButtonLabel(activity)}
68-
</Button>
63+
<Button
64+
small
65+
secondary
66+
onClick={onView}
67+
css={{ flexShrink: 0 }}
68+
>
69+
{getActionDetailButtonLabel(activity)}
70+
</Button>
71+
</HeaderSC>
72+
<WorkbenchJobActionDetails activity={activity} />
6973
</CardSC>
7074
)
7175
}
@@ -74,10 +78,18 @@ const CardSC = styled.div<{
7478
$status: WorkbenchJobActionFragment['status']
7579
}>(({ theme, $status }) => ({
7680
display: 'flex',
77-
alignItems: 'center',
78-
gap: theme.spacing.medium,
81+
flexDirection: 'column',
82+
gap: theme.spacing.xsmall,
7983
padding: `${theme.spacing.medium}px ${theme.spacing.small}px`,
8084
borderRadius: theme.borderRadiuses.large,
8185
background: theme.colors['fill-one'],
8286
borderLeft: `${theme.borderRadiuses.large / 2}px solid ${getActionStatusBorderColor(theme, $status)}`,
8387
}))
88+
89+
const HeaderSC = styled.div(({ theme }) => ({
90+
display: 'flex',
91+
alignItems: 'center',
92+
gap: theme.spacing.medium,
93+
minWidth: 0,
94+
width: '100%',
95+
}))

‎assets/src/components/workbenches/workbench/job/WorkbenchJobActionDetail.tsx‎

Lines changed: 44 additions & 31 deletions
Original file line numberDiff line numberDiff line change
@@ -35,6 +35,7 @@ import {
3535
import { WorkbenchJobActionDenialResult } from './WorkbenchJobActionDenialResult'
3636
import { WorkbenchJobActionDenyButton } from './WorkbenchJobActionDenyPopover'
3737
import { WorkbenchJobActionStatusChip } from './WorkbenchJobActionStatusChip'
38+
import { WorkbenchJobActionDetails } from './WorkbenchJobActionDetails'
3839
import { WorkbenchJobExecDetails } from './WorkbenchJobExecDetails'
3940

4041
export function WorkbenchJobActionDetail({
@@ -89,43 +90,48 @@ export function WorkbenchJobActionDetail({
8990
Back to all actions
9091
</BackBtnSC>
9192

92-
<Flex
93-
align="center"
94-
justify="space-between"
95-
gap="medium"
96-
>
93+
<HeaderBlockSC>
9794
<Flex
9895
align="center"
99-
gap="small"
100-
css={{ minWidth: 0, flex: 1 }}
96+
justify="space-between"
97+
gap="medium"
10198
>
102-
<IconFrame
103-
circle
104-
size="medium"
105-
type="secondary"
106-
icon={icon ?? <KubernetesIcon size={16} />}
107-
css={{
108-
flexShrink: 0,
109-
border: theme.borders['fill-two'],
110-
backgroundColor: 'transparent',
111-
}}
112-
/>
113-
<StackedText
114-
first={getActionTitle(activity)}
115-
firstPartialType="body2Bold"
116-
firstColor="text"
117-
second={getActionSubtitle(activity)}
118-
secondColor="text-xlight"
119-
truncate
99+
<Flex
100+
align="center"
101+
gap="small"
120102
css={{ minWidth: 0, flex: 1 }}
103+
>
104+
<IconFrame
105+
circle
106+
size="medium"
107+
type="secondary"
108+
icon={icon ?? <KubernetesIcon size={16} />}
109+
css={{
110+
flexShrink: 0,
111+
border: theme.borders['fill-two'],
112+
backgroundColor: 'transparent',
113+
}}
114+
/>
115+
<StackedText
116+
first={getActionTitle(activity)}
117+
firstPartialType="body2Bold"
118+
firstColor="text"
119+
second={getActionSubtitle(activity)}
120+
secondColor="text-xlight"
121+
truncate
122+
css={{ minWidth: 0, flex: 1 }}
123+
/>
124+
</Flex>
125+
<WorkbenchJobKubeActionChips
126+
type={activity.type}
127+
method={activity.result?.kubeRequest?.method}
128+
statusChip={
129+
<WorkbenchJobActionStatusChip status={activity.status} />
130+
}
121131
/>
122132
</Flex>
123-
<WorkbenchJobKubeActionChips
124-
type={activity.type}
125-
method={activity.result?.kubeRequest?.method}
126-
statusChip={<WorkbenchJobActionStatusChip status={activity.status} />}
127-
/>
128-
</Flex>
133+
<WorkbenchJobActionDetails activity={activity} />
134+
</HeaderBlockSC>
129135

130136
{error && <GqlError error={error} />}
131137

@@ -219,6 +225,13 @@ const DetailSC = styled.div(({ theme }) => ({
219225
gap: theme.spacing.large,
220226
}))
221227

228+
const HeaderBlockSC = styled.div(({ theme }) => ({
229+
display: 'flex',
230+
flexDirection: 'column',
231+
gap: theme.spacing.xsmall,
232+
minWidth: 0,
233+
}))
234+
222235
const BackBtnSC = styled.button(({ theme }) => ({
223236
...theme.partials.reset.button,
224237
...theme.partials.text.body2,

‎assets/src/components/workbenches/workbench/job/WorkbenchJobActionDetails.tsx‎

Lines changed: 59 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,59 @@
1+
import { WorkbenchJobActionFragment } from 'generated/graphql'
2+
import styled from 'styled-components'
3+
import { formatDateTime } from 'utils/datetime'
4+
import { getActionPolicyToolName } from './workbenchJobActionPolicyUtils'
5+
6+
export function WorkbenchJobActionDetails({
7+
activity,
8+
}: {
9+
activity: WorkbenchJobActionFragment
10+
}) {
11+
const toolName = getActionPolicyToolName(activity)
12+
const createdAt = activity.insertedAt
13+
? formatDateTime(
14+
activity.insertedAt,
15+
'YYYY-MM-DD HH:mm:ss [UTC]',
16+
false,
17+
true
18+
)
19+
: null
20+
21+
if (!toolName && !createdAt) return null
22+
23+
return (
24+
<DetailsSC>
25+
<span>tool</span>
26+
{toolName && <ToolNameSC title={toolName}>{toolName}</ToolNameSC>}
27+
{toolName && createdAt && <span>·</span>}
28+
{createdAt && <strong>{createdAt}</strong>}
29+
</DetailsSC>
30+
)
31+
}
32+
33+
const DetailsSC = styled.div(({ theme }) => ({
34+
...theme.partials.text.caption,
35+
display: 'flex',
36+
alignItems: 'center',
37+
flexWrap: 'wrap',
38+
gap: theme.spacing.xsmall,
39+
minWidth: 0,
40+
color: theme.colors['text-xlight'],
41+
fontSize: 10,
42+
strong: {
43+
color: theme.colors['text-light'],
44+
fontWeight: 400,
45+
},
46+
}))
47+
48+
const ToolNameSC = styled.strong(({ theme }) => ({
49+
...theme.partials.text.code,
50+
fontSize: 'inherit',
51+
lineHeight: 'inherit',
52+
color: theme.colors['text-light'],
53+
fontWeight: 400,
54+
userSelect: 'all',
55+
minWidth: 0,
56+
overflow: 'hidden',
57+
textOverflow: 'ellipsis',
58+
whiteSpace: 'nowrap',
59+
}))

0 commit comments

Comments
 (0)