Add PlaylistUploadEntry

app/components/internal/import/uploadentry/SingleUploadEntry.vue

@@ -0,0 +1,97 @@
+<template>
+    <Frame margin="none" class="px-3 py-4 flex items-center gap-2">
+        <div>
+            <Disc3 :size="40" v-if="hasLoaded" />
+            <AudioWaveform :size="40" v-if="hasProgress" />
+            <FileQuestionMark :size="40" v-if="hasError" />
+        </div>
+        <div class="w-full">
+            <div class="flex flex-row items-center gap-1">
+                <p class="font-medium">
+                    {{ title }}
+                </p>
+            </div>
+            <div class="flex flex-row" v-if="hasLoaded">
+                <p class="text-sm text-muted-foreground">
+                    {{ size }}
+                </p>
+                <Dot />
+                <p class="text-sm text-muted-foreground">
+                    {{ format }}
+                </p>
+                <Dot />
+                <p class="text-sm text-muted-foreground">
+                    {{ type }}
+                </p>
+            </div>
+            <div class="flex flex-row items-center gap-2" v-if="hasProgress">
+                <p class="text-sm text-muted-foreground">
+                    {{ progress }}%
+                </p>
+                <UiProgress :modelValue="progress" />
+            </div>
+            <div class="flex flex-row" v-if="hasError">
+                <p class="text-sm text-destructive-foreground">
+                    {{ error }}
+                </p>
+            </div>
+        </div>
+        <div>
+            <DropdownMenu>
+                <DropdownMenuTrigger as-child>
+                    <UiButton variant="ghost">
+                        <EllipsisVertical :size="40" />
+                    </UiButton>
+                </DropdownMenuTrigger>
+                <DropdownMenuContent class="w-56" align="start">
+                    <DropdownMenuLabel>My Account</DropdownMenuLabel>
+                    <DropdownMenuGroup>
+                        <DropdownMenuItem>
+                            Profile
+                        </DropdownMenuItem>
+                        <DropdownMenuItem>
+                            Billing
+                        </DropdownMenuItem>
+                        <DropdownMenuItem>
+                            Settings
+                        </DropdownMenuItem>
+                        <DropdownMenuItem>
+                            Keyboard shortcuts
+                        </DropdownMenuItem>
+                    </DropdownMenuGroup>
+                </DropdownMenuContent>
+            </DropdownMenu>
+        </div>
+    </Frame>
+</template>
+
+<script setup lang="ts">
+import {
+    DropdownMenu,
+    DropdownMenuContent,
+    DropdownMenuGroup,
+    DropdownMenuItem,
+    DropdownMenuLabel,
+    DropdownMenuShortcut,
+    DropdownMenuTrigger
+} from '@/components/ui/dropdown-menu';
+import Frame from '@/components/ui/frame/Frame.vue';
+import { AudioWaveform, Disc3, Dot, EllipsisVertical, FileQuestionMark } from 'lucide-vue-next';
+
+interface Props {
+    title: string
+    size?: string
+    format?: string
+    type?: string
+    progress?: number
+    error?: string
+}
+
+const props = withDefaults(defineProps<Props>(), {
+});
+
+const hasLoaded = props.size && props.format && props.type;
+const hasProgress = props.progress;
+const hasError = props.error;
+
+</script>