basic file sharing

frontend/components/DirectoryEntryIcon.vue

@@ -0,0 +1,47 @@
+<script lang="ts" setup>
+import type { DirectoryEntry } from '~/shared/types';
+
+const { entry } = defineProps<{
+    entry: DirectoryEntry;
+}>();
+
+const route = useRoute();
+const warrenStore = useWarrenStore();
+</script>
+
+<template>
+    <div class="flex flex-row items-center">
+        <Icon
+            v-if="
+                entry.fileType !== 'file' ||
+                entry.mimeType == null ||
+                !entry.mimeType.startsWith('image/')
+            "
+            class="size-6"
+            :name="
+                entry.fileType === 'file'
+                    ? getFileIcon(entry.mimeType)
+                    : 'lucide:folder'
+            "
+        />
+        <object
+            v-else-if="warrenStore.current != null"
+            :type="entry.mimeType"
+            class="size-6 object-cover"
+            width="24"
+            height="24"
+            :data="
+                route.meta.layout === 'share'
+                    ? getApiUrl(
+                          `warrens/files/cat_share?shareId=${route.query.id}&path=${joinPaths(warrenStore.current.path, entry.name)}`
+                      )
+                    : getApiUrl(
+                          `warrens/files/cat?warrenId=${warrenStore.current!.warrenId}&path=${joinPaths(warrenStore.current.path, entry.name)}`
+                      )
+            "
+        >
+            <Icon class="size-6" :name="getFileIcon(entry.mimeType)" />
+        </object>
+        <Icon v-else class="size-6" :name="getFileIcon(entry.mimeType)" />
+    </div>
+</template>