Rework file access and link archiving

This commit is contained in:
2024-12-01 23:25:33 +01:00
parent f7094f7ce1
commit 602b0af212
14 changed files with 186 additions and 151 deletions

View File

@@ -1,5 +1,5 @@
<template>
<HoverCardRoot :open-delay="delay">
<HoverCardRoot :open-delay="delay" @update:open="(...args) => emits('open', ...args)">
<HoverCardTrigger class="inline-block cursor-help outline-none">
<slot></slot>
</HoverCardTrigger>
@@ -18,4 +18,6 @@ const { delay = 500, disabled = false, side = 'bottom' } = defineProps<{
disabled?: boolean
side?: 'top' | 'right' | 'bottom' | 'left'
}>();
const emits = defineEmits(['open'])
</script>

View File

@@ -1,29 +1,31 @@
<template>
<NuxtLink class="text-accent-blue inline-flex items-center" v-if="data && data[0]"
:to="{ name: 'explore-path', params: { path: data[0].path }, hash: hash }" :class="class">
<HoverCard class="max-w-[600px] max-h-[600px] w-full overflow-auto z-[45]" :class="{'overflow-hidden !p-0': data[0].type === 'canvas'}">
<NuxtLink class="text-accent-blue inline-flex items-center" v-if="overview"
:to="{ name: 'explore-path', params: { path: overview.path }, hash: hash }" :class="class">
<HoverCard class="max-w-[600px] max-h-[600px] w-full overflow-auto z-[45]" :class="{'overflow-hidden !p-0': overview.type === 'canvas'}" @open="load">
<template #content>
<template v-if="data[0].type === 'markdown'">
<template v-if="loading">
<Loading />
</template>
<template v-else-if="overview.type === 'markdown'">
<div class="px-10">
<Markdown :content="data[0].content" />
<Markdown :content="content!.content" />
</div>
</template>
<template v-else-if="data[0].type === 'canvas'">
<template v-else-if="overview.type === 'canvas'">
<div class="w-[600px] h-[600px] relative">
<Canvas :canvas="JSON.parse(data[0].content)" />
<Canvas :canvas="JSON.parse(content!.content)" />
</div>
</template>
</template>
<template #default>
<slot v-bind="$attrs"></slot>
<Icon class="w-4 h-4 inline-block" v-if="data && data[0] && data[0].type !== 'markdown'" :icon="iconByType[data[0].type]" />
<Icon class="w-4 h-4 inline-block" v-if="overview && overview.type !== 'markdown'" :icon="iconByType[overview.type]" />
</template>
</HoverCard>
</NuxtLink>
<NuxtLink v-else-if="href" :to="href" :class="class" class="text-accent-blue inline-flex items-center">
<slot v-bind="$attrs"></slot>
<Icon class="w-4 h-4 inline-block" v-if="data && data[0] && data[0].type !== 'markdown'" :height="20" :width="20"
:icon="`icons/link-${data[0].type.toLowerCase()}`" />
<Icon class="w-4 h-4 inline-block" v-if="overview && overview.type !== 'markdown'" :height="20" :width="20" :icon="iconByType[overview.type]" />
</NuxtLink>
<slot :class="class" v-else v-bind="$attrs"></slot>
</template>
@@ -39,17 +41,35 @@ const { href } = defineProps<{
}>();
const { hash, pathname, protocol } = parseURL(href);
const data = ref(), loading = ref(false);
const overview = ref<{
path: string;
owner: number;
title: string;
type: "file" | "folder" | "markdown" | "canvas";
navigable: boolean;
private: boolean;
order: number;
visit: number;
}>(), content = ref<{
content: string;
}>(), loading = ref(false), fetched = ref(false);
if(!!pathname && !protocol)
{
try {
overview.value = await $fetch(`/api/file/overview/${encodeURIComponent(pathname)}`);
} catch(e) {}
}
async function load()
{
if(fetched.value === true)
return;
fetched.value = true;
loading.value = true;
try {
data.value = await $fetch(`/api/file`, {
query: {
search: `%${pathname}`
},
});
content.value = await $fetch(`/api/file/content/${encodeURIComponent(pathname)}`);
} catch(e) { }
loading.value = false;
}