Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

chore(console): add confirm when cancelling or pausing tasks #2495

Merged
merged 2 commits into from
Jul 11, 2023
Merged

chore(console): add confirm when cancelling or pausing tasks #2495

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
074687e
chore(console): add confirm when cancelling or pausing tasks
jialeicui Jul 11, 2023
5949d18
add role based permission wrapper
jialeicui Jul 11, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
5 changes: 4 additions & 1 deletion console/src/api/const.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,14 +14,17 @@ export const Privileges = {
'evaluation.panel.save': true,
'runtime.image.build': true,
'task.execute': true,
'job.pinOrUnpin': true,
'job.cancel': true,
'job.pause': true,
'job.resume': true,
// menu
'project.menu.trash': true,
// global
'online-eval': true,
'job-pause': true,
'job-resume': true,
'job-dev': true,
'job.pinOrUnpin': true,
}

export type IPrivileges = typeof Privileges
Expand Down
8 changes: 8 additions & 0 deletions console/src/i18n/locales.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -992,6 +992,10 @@ const locales0 = {
en: 'Cancel',
zh: '取消',
},
'Cancel.Confirm': {
en: 'Are you sure to cancel the job?',
zh: '确定要取消该任务吗？',
},
'Confirm': {
en: 'Confirm',
zh: '确认',
Expand Down Expand Up @@ -1172,6 +1176,10 @@ const locales0 = {
en: 'Pause',
zh: '暂停',
},
'Pause.Confirm': {
en: 'Are you sure to pause the job?',
zh: '确定要暂停该任务吗？',
},
'Resume': {
en: 'Resume',
zh: '恢复',
Expand Down
89 changes: 48 additions & 41 deletions console/src/pages/Job/JobListCard.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -21,6 +21,11 @@ import { IconTooltip } from '@starwhale/ui/Tooltip'
import IconFont from '@starwhale/ui/IconFont'
import { useProjectRole } from '@project/hooks/useProjectRole'
import { ConfigurationOverride } from '@starwhale/ui/base/helpers/overrides'
import { ConfirmButton } from '@starwhale/ui'

interface IActionButtonProps {
jobId: string
}

export default function JobListCard() {
const [t] = useTranslation()
Expand Down Expand Up @@ -58,6 +63,42 @@ export default function JobListCard() {
[canPinOrUnpin, jobsInfo, projectId]
)

const CancelButton = ({ jobId }: IActionButtonProps) => (
<WithCurrentAuth id='job.cancel'>
<ConfirmButton
kind='tertiary'
onClick={() => handleAction(jobId, JobActionType.CANCEL)}
title={t('Cancel.Confirm')}
>
{t('Cancel')}
</ConfirmButton>
</WithCurrentAuth>
)

const PauseButton = ({ jobId }: IActionButtonProps) => (
<WithCurrentAuth id='job-pause'>
<WithCurrentAuth id='job.pause'>
<ConfirmButton
kind='tertiary'
onClick={() => handleAction(jobId, JobActionType.PAUSE)}
title={t('Pause.Confirm')}
>
{t('Pause')}
</ConfirmButton>
</WithCurrentAuth>
</WithCurrentAuth>
)

const ResumeButton = ({ jobId }: IActionButtonProps) => (
<WithCurrentAuth id='job-resume'>
<WithCurrentAuth id='job.resume'>
<Button kind='tertiary' onClick={() => handleAction(jobId, JobActionType.RESUME)}>
{t('Resume')}
</Button>
</WithCurrentAuth>
</WithCurrentAuth>
)

return (
<Card
title={t('Jobs')}
Expand Down Expand Up @@ -98,59 +139,25 @@ export default function JobListCard() {
const actions: Partial<Record<JobStatusType, React.ReactNode>> = {
[JobStatusType.CREATED]: (
<>
<Button kind='tertiary' onClick={() => handleAction(job.id, JobActionType.CANCEL)}>
{t('Cancel')}
</Button>
<WithCurrentAuth id='job-pause'>
<Button
kind='tertiary'
onClick={() => handleAction(job.id, JobActionType.PAUSE)}
>
{t('Pause')}
</Button>
</WithCurrentAuth>
<CancelButton jobId={job.id} />
<PauseButton jobId={job.id} />
</>
),
[JobStatusType.RUNNING]: (
<>
<Button kind='tertiary' onClick={() => handleAction(job.id, JobActionType.CANCEL)}>
{t('Cancel')}
</Button>
<WithCurrentAuth id='job-pause'>
<Button
kind='tertiary'
onClick={() => handleAction(job.id, JobActionType.PAUSE)}
>
{t('Pause')}
</Button>
</WithCurrentAuth>
<CancelButton jobId={job.id} />
<PauseButton jobId={job.id} />
</>
),
[JobStatusType.PAUSED]: (
<>
<Button kind='tertiary' onClick={() => handleAction(job.id, JobActionType.CANCEL)}>
{t('Cancel')}
</Button>
<WithCurrentAuth id='job-resume'>
<Button
kind='tertiary'
onClick={() => handleAction(job.id, JobActionType.RESUME)}
>
{t('Resume')}
</Button>
</WithCurrentAuth>
<CancelButton jobId={job.id} />
<ResumeButton jobId={job.id} />
</>
),
[JobStatusType.FAIL]: (
<>
<WithCurrentAuth id='job-resume'>
<Button
kind='tertiary'
onClick={() => handleAction(job.id, JobActionType.RESUME)}
>
{t('Resume')}
</Button>
</WithCurrentAuth>
<ResumeButton jobId={job.id} />
</>
),
[JobStatusType.SUCCESS]: (
Expand Down