|
| 1 | +<script lang="ts"> |
| 2 | + import type { WorkflowExecution } from '@temporalio/client'; |
| 3 | +
|
| 4 | + import { page } from '$app/state'; |
| 5 | +
|
| 6 | + import Button from '$lib/holocene/button.svelte'; |
| 7 | + import Tooltip from '$lib/holocene/tooltip.svelte'; |
| 8 | + import { translate } from '$lib/i18n/translate'; |
| 9 | + import type { PendingActivity } from '$lib/types/events'; |
| 10 | +
|
| 11 | + import ActivityOptionsUpdateDrawer from './activity-options-update-drawer.svelte'; |
| 12 | + import ActivityPauseConfirmationModal from './activity-pause-confirmation-modal.svelte'; |
| 13 | + import ActivityResetConfirmationModal from './activity-reset-confirmation-modal.svelte'; |
| 14 | + import ActivityUnpauseConfirmationModal from './activity-unpause-confirmation-modal.svelte'; |
| 15 | +
|
| 16 | + type Props = { |
| 17 | + activity: PendingActivity; |
| 18 | + class?: string; |
| 19 | + }; |
| 20 | +
|
| 21 | + let { activity, class: className = '' }: Props = $props(); |
| 22 | + const { namespace, workflow, run } = $derived(page.params); |
| 23 | + const execution: WorkflowExecution = $derived({ |
| 24 | + workflowId: workflow, |
| 25 | + runId: run, |
| 26 | + }); |
| 27 | +
|
| 28 | + let pauseConfirmationModalOpen = $state(false); |
| 29 | + let unpauseConfirmationModalOpen = $state(false); |
| 30 | + let resetConfirmationModalOpen = $state(false); |
| 31 | + let optionsUpdateDrawerOpen = $state(false); |
| 32 | +
|
| 33 | + const onPause = async () => { |
| 34 | + if (activity.paused) { |
| 35 | + unpauseConfirmationModalOpen = true; |
| 36 | + } else { |
| 37 | + pauseConfirmationModalOpen = true; |
| 38 | + } |
| 39 | + }; |
| 40 | +
|
| 41 | + const onReset = () => { |
| 42 | + resetConfirmationModalOpen = true; |
| 43 | + }; |
| 44 | +
|
| 45 | + const onUpdate = () => { |
| 46 | + optionsUpdateDrawerOpen = true; |
| 47 | + }; |
| 48 | +</script> |
| 49 | + |
| 50 | +<div class="flex items-center gap-2 {className}"> |
| 51 | + <Tooltip |
| 52 | + bottomLeft |
| 53 | + width={200} |
| 54 | + text={activity.paused |
| 55 | + ? 'Resume this Activity' |
| 56 | + : 'Pauses this Activity, starting before it retries or the next time it heartbeats. It won’t time out while it’s paused.'} |
| 57 | + > |
| 58 | + <Button |
| 59 | + variant="secondary" |
| 60 | + size="sm" |
| 61 | + leadingIcon={activity.paused ? 'play' : 'pause'} |
| 62 | + on:click={onPause} |
| 63 | + > |
| 64 | + {activity.paused |
| 65 | + ? translate('workflows.unpause') |
| 66 | + : translate('workflows.pause')} |
| 67 | + </Button> |
| 68 | + </Tooltip> |
| 69 | + <Tooltip bottomLeft width={200} text="Update this Activity Options."> |
| 70 | + <Button |
| 71 | + variant="secondary" |
| 72 | + size="sm" |
| 73 | + leadingIcon="pencil" |
| 74 | + on:click={onUpdate} |
| 75 | + > |
| 76 | + {translate('common.update')} |
| 77 | + </Button> |
| 78 | + </Tooltip> |
| 79 | + <Tooltip bottom width={200} text="Reset this Activity."> |
| 80 | + <Button |
| 81 | + variant="secondary" |
| 82 | + size="sm" |
| 83 | + leadingIcon="retry" |
| 84 | + on:click={onReset} |
| 85 | + > |
| 86 | + {translate('workflows.reset')} |
| 87 | + </Button> |
| 88 | + </Tooltip> |
| 89 | +</div> |
| 90 | + |
| 91 | +<ActivityPauseConfirmationModal |
| 92 | + bind:open={pauseConfirmationModalOpen} |
| 93 | + {namespace} |
| 94 | + {execution} |
| 95 | + {activity} |
| 96 | +/> |
| 97 | + |
| 98 | +<ActivityUnpauseConfirmationModal |
| 99 | + bind:open={unpauseConfirmationModalOpen} |
| 100 | + {namespace} |
| 101 | + {execution} |
| 102 | + {activity} |
| 103 | +/> |
| 104 | + |
| 105 | +<ActivityResetConfirmationModal |
| 106 | + bind:open={resetConfirmationModalOpen} |
| 107 | + {namespace} |
| 108 | + {execution} |
| 109 | + {activity} |
| 110 | +/> |
| 111 | + |
| 112 | +{#key optionsUpdateDrawerOpen} |
| 113 | + <ActivityOptionsUpdateDrawer |
| 114 | + bind:open={optionsUpdateDrawerOpen} |
| 115 | + {namespace} |
| 116 | + {execution} |
| 117 | + {activity} |
| 118 | + /> |
| 119 | +{/key} |
0 commit comments