Skip to content

Commit e01e135

Browse files
committed
#2716 fixes after review
1 parent 05e426c commit e01e135

10 files changed

Lines changed: 91 additions & 36 deletions

File tree

.pre-commit-config.yaml

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -19,14 +19,14 @@ repos:
1919
- id: end-of-file-fixer
2020

2121
- repo: https://github.com/pre-commit/mirrors-eslint
22-
rev: ''
22+
rev: 'v9.28.0'
2323
hooks:
2424
- id: eslint
2525
name: ESLint
2626
entry: eslint --fix --config frontend/.eslintrc --ignore-path frontend/.eslintignore
2727
language: node
2828
pass_filenames: false
29-
cwd: "frontend/"
29+
cwd: frontend
3030
additional_dependencies:
3131
- eslint@8.31.0
3232
- eslint-config-prettier@8.10.0

frontend/src/libs/index.ts

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -108,3 +108,5 @@ export const isValidUrl = (urlString: string) => {
108108
export const includeSubString = (value: string, query: string) => {
109109
return value.toLowerCase().includes(query.trim().toLowerCase());
110110
};
111+
112+
export const capitalize = (str: string): string => str.charAt(0).toUpperCase() + str.slice(1);

frontend/src/libs/run.ts

Lines changed: 15 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,15 @@
11
import { get as _get } from 'lodash';
22
import { StatusIndicatorProps } from '@cloudscape-design/components';
33

4+
import { capitalize } from 'libs';
5+
46
import { IModelExtended } from '../pages/Models/List/types';
57

6-
export const getStatusIconType = (status: IRun['status'] | TJobStatus, termination_reason: string | null | undefined): StatusIndicatorProps['type'] => {
7-
if (termination_reason === 'interrupted_by_no_capacity') {
8+
export const getStatusIconType = (
9+
status: IRun['status'] | TJobStatus,
10+
terminationReason: string | null | undefined,
11+
): StatusIndicatorProps['type'] => {
12+
if (terminationReason === 'interrupted_by_no_capacity') {
813
return 'stopped';
914
}
1015
switch (status) {
@@ -28,26 +33,24 @@ export const getStatusIconType = (status: IRun['status'] | TJobStatus, terminati
2833
}
2934
};
3035

31-
export const getStatusIconColor = (status: IRun['status'] | TJobStatus, termination_reason: string | null | undefined): StatusIndicatorProps.Color | undefined => {
32-
if (termination_reason === 'failed_to_start_due_to_no_capacity' ||
33-
termination_reason === 'interrupted_by_no_capacity'
34-
) {
36+
export const getStatusIconColor = (
37+
status: IRun['status'] | TJobStatus,
38+
terminationReason: string | null | undefined,
39+
): StatusIndicatorProps.Color | undefined => {
40+
if (terminationReason === 'failed_to_start_due_to_no_capacity' || terminationReason === 'interrupted_by_no_capacity') {
3541
return 'yellow';
3642
}
3743

3844
switch (status) {
3945
case 'pulling':
40-
return 'green'
46+
return 'green';
4147
case 'aborted':
42-
return 'yellow'
48+
return 'yellow';
4349
default:
4450
return undefined;
4551
}
4652
};
4753

48-
49-
const capitalize = (str: string): string => str.charAt(0).toUpperCase() + str.slice(1);
50-
5154
export const getRunStatusMessage = (run: IRun): string => {
5255
if (run.latest_job_submission?.status_message) {
5356
return capitalize(run.latest_job_submission.status_message);
@@ -56,7 +59,7 @@ export const getRunStatusMessage = (run: IRun): string => {
5659
}
5760
};
5861

59-
export const getRunError = (run: IRun): string | null => {
62+
export const getRunError = (run: IRun): string | null => {
6063
const error = run.error ?? run.latest_job_submission?.error ?? null;
6164
return error ? capitalize(error) : null;
6265
};

frontend/src/pages/Project/Backends/Table/constants.tsx

Lines changed: 28 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -4,13 +4,26 @@ export const BACKENDS_HELP_SKY = {
44
header: <h2>Backends</h2>,
55
body: (
66
<>
7-
<p>To use <code>dstack</code> with cloud providers, you have to configure backends.</p>
7+
<p>
8+
To use <code>dstack</code> with cloud providers, you have to configure backends.
9+
</p>
810
<h4>Marketplace</h4>
9-
<p>By default, <code>dstack Sky</code> includes a preset of backends that let you access compute from the {' '}
10-
<code>dstack</code> marketplace and pay through your <code>dstack Sky</code> user billing.</p>
11+
<p>
12+
By default, <code>dstack Sky</code> includes a preset of backends that let you access compute from the{' '}
13+
<code>dstack</code> marketplace and pay through your <code>dstack Sky</code> user billing.
14+
</p>
1115
<h4>Your own cloud accounts</h4>
12-
<p>You can also configure custom backends to use your own cloud providers, either instead of or in addition to the default ones.</p>
13-
<p>See the <a href={'https://dstack.ai/docs/concepts/backends'} target='_blank'>documentation</a> for the list of supported backends.</p>
16+
<p>
17+
You can also configure custom backends to use your own cloud providers, either instead of or in addition to the
18+
default ones.
19+
</p>
20+
<p>
21+
See the{' '}
22+
<a href={'https://dstack.ai/docs/concepts/backends'} target="_blank">
23+
documentation
24+
</a>{' '}
25+
for the list of supported backends.
26+
</p>
1427
</>
1528
),
1629
};
@@ -19,8 +32,16 @@ export const BACKENDS_HELP_ENTERPRISE = {
1932
header: <h2>Backends</h2>,
2033
body: (
2134
<>
22-
<p>To use <code>dstack</code> with cloud providers, you have to configure backends.</p>
23-
<p>See the <a href={'https://dstack.ai/docs/concepts/backends'} target='_blank'>documentation</a> for the list of supported backends.</p>
35+
<p>
36+
To use <code>dstack</code> with cloud providers, you have to configure backends.
37+
</p>
38+
<p>
39+
See the{' '}
40+
<a href={'https://dstack.ai/docs/concepts/backends'} target="_blank">
41+
documentation
42+
</a>{' '}
43+
for the list of supported backends.
44+
</p>
2445
</>
2546
),
2647
};

frontend/src/pages/Project/Backends/YAMLForm/constants.tsx

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -68,7 +68,10 @@ export const CONFIG_YAML_HELP_ENTERPRISE = {
6868
</p>
6969
<p>
7070
Each backend type may support different properties. See the{' '}
71-
<a href={'https://dstack.ai/docs/concepts/backends'} target='_blank'>documentaiton</a> for more examples.
71+
<a href={'https://dstack.ai/docs/concepts/backends'} target="_blank">
72+
documentaiton
73+
</a>{' '}
74+
for more examples.
7275
</p>
7376
</>
7477
),

frontend/src/pages/Project/Details/Settings/constants.tsx

Lines changed: 8 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -6,12 +6,17 @@ export const CLI_INFO = {
66
<>
77
<p>
88
To use this project with your CLI, add it using the
9-
<a href={'https://dstack.ai/docs/reference/cli/dstack/project/'} target='_blank'>
10-
<code>dstack project add</code></a> command.
9+
<a href={'https://dstack.ai/docs/reference/cli/dstack/project/'} target="_blank">
10+
<code>dstack project add</code>
11+
</a>{' '}
12+
command.
1113
</p>
1214
<p>
1315
To learn how to install the CLI, refer to the{' '}
14-
<a href={'https://dstack.ai/docs/cli/installation'} target='_blank'>installation</a> guide.
16+
<a href={'https://dstack.ai/docs/cli/installation'} target="_blank">
17+
installation
18+
</a>{' '}
19+
guide.
1520
</p>
1621
</>
1722
),

frontend/src/pages/Project/Gateways/Table/constants.tsx

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,13 @@ export const GATEWAYS_INFO = {
55
body: (
66
<>
77
<p>Gateways manage the ingress traffic for running services.</p>
8-
<p>To learn more about gateways, see the <a href={'https://dstack.ai/docs/concepts/gateways'} target='_blank'>documentation</a>.</p>
8+
<p>
9+
To learn more about gateways, see the{' '}
10+
<a href={'https://dstack.ai/docs/concepts/gateways'} target="_blank">
11+
documentation
12+
</a>
13+
.
14+
</p>
915
</>
1016
),
1117
};

frontend/src/pages/Runs/Details/Jobs/List/helpers.ts

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
import { format } from 'date-fns';
22

33
import { DATE_TIME_FORMAT } from 'consts';
4+
import { capitalize } from 'libs';
45

56
export const getJobListItemResources = (job: IJob) => {
67
return job.job_submissions?.[job.job_submissions.length - 1]?.job_provisioning_data?.instance_type?.resources?.description;
@@ -46,8 +47,6 @@ export const getJobTerminationReason = (job: IJob) => {
4647
return job.job_submissions?.[job.job_submissions.length - 1].termination_reason ?? '-';
4748
};
4849

49-
const capitalize = (str: string): string => str.charAt(0).toUpperCase() + str.slice(1);
50-
5150
export const getJobStatusMessage = (job: IJob): string | null => {
5251
const latest_submission = job.job_submissions?.[job.job_submissions.length - 1];
5352
if (latest_submission?.status_message) {

frontend/src/pages/Runs/Details/RunDetails/index.tsx

Lines changed: 10 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@ import { format } from 'date-fns';
77
import { Box, ColumnLayout, Container, Header, Loader, StatusIndicator } from 'components';
88

99
import { DATE_TIME_FORMAT } from 'consts';
10-
import { getRunStatusMessage, getStatusIconType, getStatusIconColor, getRunError } from 'libs/run';
10+
import { getRunError, getRunStatusMessage, getStatusIconColor, getStatusIconType } from 'libs/run';
1111
import { useGetRunQuery } from 'services/run';
1212

1313
import {
@@ -47,6 +47,9 @@ export const RunDetails = () => {
4747

4848
if (!runData) return null;
4949

50+
const status = runData.latest_job_submission?.status ?? runData.status;
51+
const terminationReason = runData.latest_job_submission?.termination_reason;
52+
5053
return (
5154
<>
5255
<Container header={<Header variant="h2">{t('common.general')}</Header>}>
@@ -82,7 +85,12 @@ export const RunDetails = () => {
8285
<div>
8386
<Box variant="awsui-key-label">{t('projects.run.status')}</Box>
8487
<div>
85-
<StatusIndicator type={getStatusIconType(runData.latest_job_submission?.status || runData.status, runData.latest_job_submission?.termination_reason)} colorOverride={getStatusIconColor(runData.latest_job_submission?.status || runData.status, runData.latest_job_submission?.termination_reason)}>
88+
<StatusIndicator
89+
type={getStatusIconType(status, terminationReason)}
90+
colorOverride={
91+
getStatusIconColor(status, terminationReason)
92+
}
93+
>
8694
{getRunStatusMessage(runData)}
8795
</StatusIndicator>
8896
</div>

frontend/src/pages/Runs/List/hooks/useColumnsDefinitions.tsx

Lines changed: 14 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ import { format } from 'date-fns';
55
import { NavigateLink, StatusIndicator } from 'components';
66

77
import { DATE_TIME_FORMAT } from 'consts';
8-
import { getRepoNameFromRun, getStatusIconType, getRunStatusMessage, getRunError, getStatusIconColor } from 'libs/run';
8+
import { getRepoNameFromRun, getRunError, getRunStatusMessage, getStatusIconColor, getStatusIconType } from 'libs/run';
99
import { ROUTES } from 'routes';
1010

1111
import {
@@ -64,11 +64,19 @@ export const useColumnsDefinitions = () => {
6464
{
6565
id: 'status',
6666
header: t('projects.run.status'),
67-
cell: (item: IRun) => (
68-
<StatusIndicator type={getStatusIconType(item.latest_job_submission?.status || item.status, item.latest_job_submission?.termination_reason)} colorOverride={getStatusIconColor(item.latest_job_submission?.status || item.status, item.latest_job_submission?.termination_reason)}>
69-
{getRunStatusMessage(item)}
70-
</StatusIndicator>
71-
),
67+
cell: (item: IRun) => {
68+
const status = item.latest_job_submission?.status ?? item.status;
69+
const terminationReason = item.latest_job_submission?.termination_reason;
70+
71+
return (
72+
<StatusIndicator
73+
type={getStatusIconType(status, terminationReason)}
74+
colorOverride={getStatusIconColor(status, terminationReason)}
75+
>
76+
{getRunStatusMessage(item)}
77+
</StatusIndicator>
78+
);
79+
},
7280
},
7381
{
7482
id: 'error',

0 commit comments

Comments
 (0)