Skip to content

Commit 1a7da2a

Browse files
andnordaandnorda
committed
progressively disclose alerts
1 parent 170cec6 commit 1a7da2a

File tree

4 files changed

+204
-186
lines changed

4 files changed

+204
-186
lines changed

‎src/lib/components/errors/ErrorMessage.svelte

+112-103
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,7 @@
1111

1212
<script lang="ts">
1313
import { WorkloadStatusErrorLevel, type ValueOf } from '$houdini';
14-
import { Alert, BodyLong, Heading } from '@nais/ds-svelte-community';
14+
import { Alert, BodyLong, Button, Heading } from '@nais/ds-svelte-community';
1515
1616
const {
1717
error,
@@ -80,115 +80,124 @@
8080
WorkloadStatusFailedRun: 'Job Failed',
8181
WorkloadStatusVulnerable: 'High Risk: Vulnerabilities Detected'
8282
};
83+
84+
let open = $state(false);
8385
</script>
8486

8587
{#if error.__typename !== "non-exhaustive; don't match this"}
86-
<Alert variant={levelVariant(error.level)}>
88+
<Alert variant={levelVariant(error.level)} size="small">
8789
<div class="content">
88-
<Heading level="2" size="small">{heading[error.__typename]}</Heading>
89-
{#if error.__typename === 'WorkloadStatusInvalidNaisYaml'}
90-
<BodyLong>
91-
The rollout of your {workloadType === 'Job' ? 'job' : 'application'} has failed due to an error
92-
in the {workloadType === 'Job' ? 'job' : 'application'} manifest.
93-
</BodyLong>
94-
95-
<Heading level="3" size="xsmall">Error details</Heading>
96-
<code>{error.detail}</code>
97-
98-
<BodyLong>
99-
To resolve this issue, review the {workloadType === 'Job' ? 'job' : 'application'} manifest
100-
and correct any errors. Consult the
101-
<a
102-
target="_blank"
103-
rel="noopener noreferrer"
104-
href={docURL(
105-
workloadType === 'Job'
106-
? '/workloads/job/reference/naisjob-spec/'
107-
: '/workloads/application/reference/application-spec/'
108-
)}>Nais {workloadType === 'Job' ? 'job' : 'application'} reference</a
109-
> for manifest requirements.
110-
</BodyLong>
111-
{:else if error.__typename === 'WorkloadStatusSynchronizationFailing'}
112-
<BodyLong>
113-
The rollout of the {workloadType === 'Job' ? 'job' : 'application'} is failing, meaning it
114-
is not in sync with the latest deployment. This may be due to a misconfiguration or a temporary
115-
issue, so try again in a few minutes. If the problem persists, contact the Nais team.
116-
</BodyLong>
117-
118-
<Heading level="3" size="xsmall">Error details</Heading>
119-
<code>{error.detail}</code>
120-
{:else if error.__typename === 'WorkloadStatusDeprecatedRegistry'}
121-
<BodyLong>
122-
This {workloadType === 'Job' ? 'job' : 'application'} is using a deprecated image registry
123-
({error.registry}).
124-
</BodyLong>
125-
126-
<BodyLong
127-
>Starting April 1st, applications and jobs on Nais must use images from Google Artifact
128-
Registry (GAR). The easiest way to ensure that images are stored in GAR is to use Nais'
129-
GitHub Actions in the workflow. <a
130-
href="https://nais.io/log/#2025-02-24-image-policy"
131-
target="_blank"
132-
rel="noopener noreferrer">Read more in Nais announcement</a
133-
>.
134-
</BodyLong>
135-
{:else if error.__typename === 'WorkloadStatusNoRunningInstances'}
136-
<BodyLong>The application has no running instances.</BodyLong>
137-
138-
{#if instances?.length}
139-
<Heading level="3" size="xsmall">Failing instances:</Heading>
140-
<ul style="margin: 0;">
141-
{#each instances as instance (instance.name)}
142-
<li>
143-
<code style="font-size: 1rem; line-height: 1.75;">{instance.name}</code>:
144-
<strong>{instance.status.message}</strong>
145-
</li>
146-
{/each}
147-
</ul>
148-
{/if}
90+
<div style="display: flex; align-items: center; gap: var(--a-spacing-2);">
91+
<Heading level="2" size="small">{heading[error.__typename]}</Heading>
92+
<Button variant="tertiary" size="xsmall" onclick={() => (open = !open)}>
93+
{open ? 'Hide' : 'Show'} details
94+
</Button>
95+
</div>
96+
{#if open}
97+
{#if error.__typename === 'WorkloadStatusInvalidNaisYaml'}
98+
<BodyLong>
99+
The rollout of your {workloadType === 'Job' ? 'job' : 'application'} has failed due to an
100+
error in the {workloadType === 'Job' ? 'job' : 'application'} manifest.
101+
</BodyLong>
149102

150-
<BodyLong>
151-
Check logs if available. If this is unexpected and you cannot resolve the issue, contact
152-
the Nais team.
153-
</BodyLong>
154-
{:else if error.__typename === 'WorkloadStatusFailedRun'}
155-
<BodyLong>The last run of this job failed.</BodyLong>
156-
157-
<div>
158-
<code>{error.name}</code>:
159-
{error.detail}
160-
</div>
161-
162-
<BodyLong>
163-
Check logs if available. If you're unable to resolve the issue, contact the Nais team.
164-
</BodyLong>
165-
{:else if error.__typename === 'WorkloadStatusVulnerable'}
166-
<BodyLong>
167-
{#if error.riskScore > 100}
168-
<strong>Risk Score:</strong>
169-
{error.riskScore} (Exceeds threshold of 100)<br />
170-
{/if}
171-
{#if error.critical > 0}
172-
<strong>Critical Vulnerabilities:</strong>
173-
{error.critical}
103+
<Heading level="3" size="xsmall">Error details</Heading>
104+
<code>{error.detail}</code>
105+
106+
<BodyLong>
107+
To resolve this issue, review the {workloadType === 'Job' ? 'job' : 'application'} manifest
108+
and correct any errors. Consult the
109+
<a
110+
target="_blank"
111+
rel="noopener noreferrer"
112+
href={docURL(
113+
workloadType === 'Job'
114+
? '/workloads/job/reference/naisjob-spec/'
115+
: '/workloads/application/reference/application-spec/'
116+
)}>Nais {workloadType === 'Job' ? 'job' : 'application'} reference</a
117+
> for manifest requirements.
118+
</BodyLong>
119+
{:else if error.__typename === 'WorkloadStatusSynchronizationFailing'}
120+
<BodyLong>
121+
The rollout of the {workloadType === 'Job' ? 'job' : 'application'} is failing, meaning it
122+
is not in sync with the latest deployment. This may be due to a misconfiguration or a temporary
123+
issue, so try again in a few minutes. If the problem persists, contact the Nais team.
124+
</BodyLong>
125+
126+
<Heading level="3" size="xsmall">Error details</Heading>
127+
<code>{error.detail}</code>
128+
{:else if error.__typename === 'WorkloadStatusDeprecatedRegistry'}
129+
<BodyLong>
130+
This {workloadType === 'Job' ? 'job' : 'application'} is using a deprecated image registry
131+
({error.registry}).
132+
</BodyLong>
133+
134+
<BodyLong
135+
>Starting April 1st, applications and jobs on Nais must use images from Google Artifact
136+
Registry (GAR). The easiest way to ensure that images are stored in GAR is to use Nais'
137+
GitHub Actions in the workflow. <a
138+
href="https://nais.io/log/#2025-02-24-image-policy"
139+
target="_blank"
140+
rel="noopener noreferrer">Read more in Nais announcement</a
141+
>.
142+
</BodyLong>
143+
{:else if error.__typename === 'WorkloadStatusNoRunningInstances'}
144+
<BodyLong>The application has no running instances.</BodyLong>
145+
146+
{#if instances?.length}
147+
<Heading level="3" size="xsmall">Failing instances:</Heading>
148+
<ul style="margin: 0;">
149+
{#each instances as instance (instance.name)}
150+
<li>
151+
<code style="font-size: 1rem; line-height: 1.75;">{instance.name}</code>:
152+
<strong>{instance.status.message}</strong>
153+
</li>
154+
{/each}
155+
</ul>
174156
{/if}
175-
</BodyLong>
176-
<BodyLong>
177-
Workloads are flagged as vulnerable if their dependencies have a high risk score or
178-
critical vulnerabilities.
179-
</BodyLong>
180-
<BodyLong>
181-
Review detailed vulnerability information in the <a
182-
href="/team/{teamSlug}/{environment}/{workloadType === 'Job'
157+
158+
<BodyLong>
159+
Check logs if available. If this is unexpected and you cannot resolve the issue, contact
160+
the Nais team.
161+
</BodyLong>
162+
{:else if error.__typename === 'WorkloadStatusFailedRun'}
163+
<BodyLong>The last run of this job failed.</BodyLong>
164+
165+
<div>
166+
<code>{error.name}</code>:
167+
{error.detail}
168+
</div>
169+
170+
<BodyLong>
171+
Check logs if available. If you're unable to resolve the issue, contact the Nais team.
172+
</BodyLong>
173+
{:else if error.__typename === 'WorkloadStatusVulnerable'}
174+
<BodyLong>
175+
{#if error.riskScore > 100}
176+
<strong>Risk Score:</strong>
177+
{error.riskScore} (Exceeds threshold of 100)<br />
178+
{/if}
179+
{#if error.critical > 0}
180+
<strong>Critical Vulnerabilities:</strong>
181+
{error.critical}
182+
{/if}
183+
</BodyLong>
184+
<BodyLong>
185+
Workloads are flagged as vulnerable if their dependencies have a high risk score or
186+
critical vulnerabilities.
187+
</BodyLong>
188+
<BodyLong>
189+
Review detailed vulnerability information in the <a
190+
href="/team/{teamSlug}/{environment}/{workloadType === 'Job'
191+
? 'job'
192+
: 'app'}/{workloadName}/vulnerability-report">Vulnerability Report</a
193+
>, and update affected dependencies to their latest patched versions.
194+
</BodyLong>
195+
<BodyLong>
196+
Ignoring these vulnerabilities can expose your {workloadType === 'Job'
183197
? 'job'
184-
: 'app'}/{workloadName}/vulnerability-report">Vulnerability Report</a
185-
>, and update affected dependencies to their latest patched versions.
186-
</BodyLong>
187-
<BodyLong>
188-
Ignoring these vulnerabilities can expose your {workloadType === 'Job'
189-
? 'job'
190-
: 'application'} to potential security breaches.
191-
</BodyLong>
198+
: 'application'} to potential security breaches.
199+
</BodyLong>
200+
{/if}
192201
{/if}
193202
</div>
194203
</Alert>

0 commit comments

Comments
 (0)