mirror of
https://github.com/imputnet/cobalt.git
synced 2025-06-29 09:58:27 +00:00
88d4b4dc7c
Some checks failed
Run tests / check lockfile correctness (push) Has been cancelled
Run tests / web sanity check (push) Has been cancelled
Run tests / api sanity check (push) Has been cancelled
CodeQL / Analyze (${{ matrix.language }}) (none, javascript-typescript) (push) Has been cancelled
51 lines
1.2 KiB
Svelte
51 lines
1.2 KiB
Svelte
<script lang="ts">
|
|
import Skeleton from "$components/misc/Skeleton.svelte";
|
|
|
|
export let percentage: number = 0;
|
|
export let workerId: string;
|
|
export let runningWorkerId: string | undefined;
|
|
export let completedWorkers: string[] = [];
|
|
</script>
|
|
|
|
<div class="file-progress">
|
|
{#if percentage && workerId === runningWorkerId}
|
|
<div
|
|
class="progress"
|
|
style="width: {Math.min(100, percentage || 0)}%"
|
|
></div>
|
|
{:else if completedWorkers?.includes(workerId)}
|
|
<div
|
|
class="progress"
|
|
style="width: 100%"
|
|
></div>
|
|
{:else if workerId === runningWorkerId}
|
|
<Skeleton
|
|
height="6px"
|
|
width="100%"
|
|
class="elevated indeterminate-progress"
|
|
/>
|
|
{/if}
|
|
</div>
|
|
|
|
<style>
|
|
.file-progress {
|
|
width: 100%;
|
|
background-color: var(--button-elevated);
|
|
}
|
|
|
|
.file-progress,
|
|
.file-progress .progress {
|
|
height: 6px;
|
|
border-radius: 10px;
|
|
transition: width 0.1s;
|
|
}
|
|
|
|
.file-progress :global(.indeterminate-progress) {
|
|
display: block;
|
|
}
|
|
|
|
.file-progress .progress {
|
|
background-color: var(--blue);
|
|
}
|
|
</style>
|