diff --git a/src/lib/actions/timer.ts b/src/lib/actions/timer.ts new file mode 100644 index 000000000..1e5f9411e --- /dev/null +++ b/src/lib/actions/timer.ts @@ -0,0 +1,40 @@ +import { calculateTime } from '$lib/helpers/timeConversion'; +import type { Action } from 'svelte/action'; + +type Props = { + start?: string; + enabled?: boolean; +}; + +const defaultProps: Props = { + enabled: true +}; + +export const timer: Action = (node, props) => { + let startDate: Date; + let frame: number; + + function init(props: Props) { + const { start, enabled } = { ...defaultProps, ...props }; + startDate = start ? new Date(start) : new Date(); + frame = enabled ? window.requestAnimationFrame(step) : null; + } + + function step() { + const diffInSeconds = Math.floor((new Date().getTime() - startDate.getTime()) / 1000); + node.textContent = calculateTime(diffInSeconds); + frame = window.requestAnimationFrame(step); + } + + init(props); + + return { + update(props) { + window.cancelAnimationFrame(frame); + init(props); + }, + destroy() { + window.cancelAnimationFrame(frame); + } + }; +}; diff --git a/src/routes/console/project-[project]/functions/function-[function]/[[page]]/+page.svelte b/src/routes/console/project-[project]/functions/function-[function]/[[page]]/+page.svelte index d0b3237ab..abf5c880c 100644 --- a/src/routes/console/project-[project]/functions/function-[function]/[[page]]/+page.svelte +++ b/src/routes/console/project-[project]/functions/function-[function]/[[page]]/+page.svelte @@ -39,6 +39,7 @@ import { page } from '$app/stores'; import Output from '$lib/components/output.svelte'; import { calculateTime } from '$lib/helpers/timeConversion'; + import { timer } from '$lib/actions/timer'; export let data: PageData; @@ -188,7 +189,9 @@ - {#if deployment.status === 'ready'} + {#if ['processing', 'building'].includes(deployment.status)} + + {:else} {calculateTime(deployment.buildTime)} {/if} diff --git a/src/routes/console/project-[project]/functions/function-[function]/executions/[[page]]/+page.svelte b/src/routes/console/project-[project]/functions/function-[function]/executions/[[page]]/+page.svelte index fc7a8be27..45739d87d 100644 --- a/src/routes/console/project-[project]/functions/function-[function]/executions/[[page]]/+page.svelte +++ b/src/routes/console/project-[project]/functions/function-[function]/executions/[[page]]/+page.svelte @@ -1,28 +1,28 @@