Something went wrong. Try again.
Something went wrong. Try again.
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102<script lang="ts"> import { stringHref } from "$lib/components/strings/urls"; import Pencil from "$icon/pencil"; import Trash2 from "$icon/trash-2"; import Button from "$lib/components/ui/Button.svelte"; import DropdownItem from "$lib/components/ui/DropdownItem.svelte"; import MoreMenu from "$lib/components/ui/MoreMenu.svelte"; import OwnerTitle from "$lib/components/repo/OwnerTitle.svelte"; import StarButton from "$lib/components/repo/StarButton.svelte";
interface Props { ownerHandle: string; ownerDid: string; rkey: string; filename: string; description?: string; isOwner?: boolean; stringUri: string; stringCid?: string; initialStarCount?: number | Promise<number>; initialStarRkey?: string | null | Promise<string | null>; onedit?: () => void; ondelete?: () => void; deleting?: boolean; }
let { ownerHandle, ownerDid, rkey, filename, description = "", isOwner = false, stringUri, stringCid, initialStarCount, initialStarRkey, onedit, ondelete, deleting = false }: Props = $props();
const selfHref = $derived(stringHref(ownerHandle, rkey));</script>
{#snippet actions(className: string)} <div class={className}> <StarButton subject={{ kind: "string", uri: stringUri, cid: stringCid }} initialCount={initialStarCount} initialRkey={initialStarRkey} count="wide" size="small" /> {#if isOwner} <div class="flex items-center gap-xs"> <Button variant="default" size="small" icon={Pencil} onclick={onedit} disabled={deleting} > Edit </Button> <MoreMenu label="More actions for {filename}" size="small" buttonVariant="default" disabled={deleting} > <DropdownItem icon={Trash2} danger onclick={ondelete} disabled={deleting}> Delete </DropdownItem> </MoreMenu> </div> {/if} </div>{/snippet}
<div class="flex flex-col"> <div class="mb-xs flex flex-col items-start justify-between gap-md sm:flex-row"> <div class="flex min-w-0 flex-col gap-xs"> <OwnerTitle {ownerDid} {ownerHandle} name={filename} href={selfHref} /> </div>
{@render actions("hidden shrink-0 items-center gap-xs sm:flex")} </div>
{#if description} <p data-testid="stringDescription" class="typography-paragraph-small text-foreground-muted"> {description} </p> {:else} <p class="typography-paragraph-small text-foreground-muted italic"> This string has no description </p> {/if}
{@render actions("mt-xs flex items-center justify-between gap-xs sm:hidden")}</div>