941fe7146e
* feat(frontend): Use common components on the landing pae * feat(frontend): Use shared icon
59 lines
1.4 KiB
Svelte
59 lines
1.4 KiB
Svelte
<script lang="ts">
|
|
import { goto } from '$app/navigation'
|
|
import type { Script } from '$lib/gen'
|
|
|
|
import { truncateHash } from '$lib/utils'
|
|
import { faPencil, faPlay } from '@fortawesome/free-solid-svg-icons'
|
|
import { Button, Badge, ActionRow } from '$lib/components/common'
|
|
|
|
export let script: Script
|
|
</script>
|
|
|
|
<div
|
|
class="border p-4 rounded-sm shadow-sm space-y-2 hover:border-blue-600 flex flex-col justify-between cursor-pointer"
|
|
on:click={() => goto(`/scripts/get/${script.hash}`)}
|
|
>
|
|
<div class="font-bold">{script.summary || script.path}</div>
|
|
|
|
<div class="inline-flex justify-between w-full">
|
|
<div class="text-xs">{script.path}</div>
|
|
|
|
<Badge color="gray">
|
|
{truncateHash(script.hash)}
|
|
</Badge>
|
|
</div>
|
|
<div class="inline-flex space-x-1 w-full">
|
|
<Badge color="blue" capitalize>
|
|
{script.language}
|
|
</Badge>
|
|
{#if script.kind !== 'script'}
|
|
<Badge color="green" capitalize>
|
|
{script.kind}
|
|
</Badge>
|
|
{/if}
|
|
</div>
|
|
<ActionRow>
|
|
<svelte:fragment slot="right">
|
|
<Button
|
|
on:click={() => goto(`/scripts/edit/${script.hash}?step=2`)}
|
|
color="dark"
|
|
size="xs"
|
|
variant="border"
|
|
startIcon={{ icon: faPencil }}
|
|
>
|
|
Edit
|
|
</Button>
|
|
|
|
<Button
|
|
on:click={() => goto(`/scripts/run/${script.hash}`)}
|
|
color="dark"
|
|
size="xs"
|
|
variant="border"
|
|
startIcon={{ icon: faPlay }}
|
|
>
|
|
Run
|
|
</Button>
|
|
</svelte:fragment>
|
|
</ActionRow>
|
|
</div>
|