Peaceultime
/
obsidian-visualiser
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Graph + Private indicator for navigation + ProseA search improvement

This commit is contained in:
Peaceultime 2024-09-04 17:50:03 +02:00
parent 6d3efea784
commit 85c8fbae0f
6 changed files with 32 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
components/explorer/NavigationLink.vue
View File

@ -19,22 +19,27 @@ const emit = defineEmits(['navigate']);
<template> <template>
<div class="py-1" v-if="project && !isNaN(project)"> <div class="py-1" v-if="project && !isNaN(project)">
<template v-if="hasChildren"> <template v-if="hasChildren">
<div class="flex gap-2 items-center cursor-pointer hover:text-opacity-75 text-light-100 dark:text-dark-100" @click="collapsed = hasChildren && !collapsed" :data-type="link.private ? 'privé' : undefined"> <div class="flex gap-2 items-center cursor-pointer hover:text-opacity-75 text-light-100 dark:text-dark-100
data-[type]:after:content-[attr(data-type)] data-[type]:after:border data-[type]:after:border-light-35 data-[type]:dark:after:border-dark-35
data-[type]:after:text-sm data-[type]:after:px-1 data-[type]:after:bg-light-20 data-[type]:dark:after:bg-dark-20 data-[type]:after:[font-variant:all-petite-caps]"
@click="collapsed = hasChildren && !collapsed" :data-type="link.private ? 'privé' : undefined">
<div v-if="hasChildren" class="w-4 h-4 transition-transform" :class="{'-rotate-90': collapsed}"> <div v-if="hasChildren" class="w-4 h-4 transition-transform" :class="{'-rotate-90': collapsed}">
<svg xmlns="http://www.w3.org/2000/svg" class="w-4 h-4" width="24" height="24" viewBox="0 0 24 24" fill="none" <svg xmlns="http://www.w3.org/2000/svg" class="w-4 h-4" width="24" height="24" viewBox="0 0 24 24" fill="none"
stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"> stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<path d="M3 8L12 17L21 8"></path> <path d="M3 8L12 17L21 8"></path>
</svg> </svg>
</div> </div>
<div class="font-semibold xl:text-base text-sm">{{ link.title }}</div> <div class="font-semibold xl:text-base text-sm flex-1">{{ link.title }}</div>
</div> </div>
<div v-if="!collapsed"> <div v-if="!collapsed">
<NavigationLink @navigate="e => emit('navigate')" class="border-light-40 dark:border-dark-40 ms-2 ps-4 border-l" v-if="hasChildren" v-for="l of link.children" :link="l" :project="project" /> <NavigationLink @navigate="e => emit('navigate')" class="border-light-40 dark:border-dark-40 ms-2 ps-4 border-l" v-if="hasChildren" v-for="l of link.children" :link="l" :project="project" />
</div> </div>
</template> </template>
<NuxtLink v-else @click="e => emit('navigate')" class="text-light-100 dark:text-dark-100 cursor-pointer hover:text-opacity-75 xl:text-base text-sm" :to="{ path: `/explorer/${project}/${link.path}`, force: true }" <NuxtLink v-else @click="e => emit('navigate')" class="text-light-100 dark:text-dark-100 cursor-pointer hover:text-opacity-75 xl:text-base text-sm flex justify-between items-center
data-[type]:after:content-[attr(data-type)] data-[type]:after:border data-[type]:after:border-light-35 data-[type]:dark:after:border-dark-35
data-[type]:after:text-sm data-[type]:after:px-1 data-[type]:after:bg-light-20 data-[type]:dark:after:bg-dark-20 data-[type]:after:[font-variant:all-petite-caps]" :to="{ path: `/explorer/${project}/${link.path}`, force: true }"
active-class="!text-accent-blue relative before:border-l-2 before:border-accent-blue before:absolute before:-top-1 before:-bottom-1 before:-left-4 before:-mx-px" :data-type="(link.type === 'Canvas' ? 'graph' : (link.private ? 'privé' : undefined))"> active-class="!text-accent-blue relative before:border-l-2 before:border-accent-blue before:absolute before:-top-1 before:-bottom-1 before:-left-4 before:-mx-px" :data-type="(link.type === 'Canvas' ? 'graph' : (link.private ? 'privé' : undefined))">
<div class="">{{ link.title }}</div> <div>{{ link.title }}</div>
</NuxtLink> </NuxtLink>
</div> </div>
</template> </template>

9
components/prose/ProseA.vue
View File

@ -34,7 +34,8 @@ const props = defineProps({
const route = useRoute(); const route = useRoute();
const { hash, pathname, protocol } = parseURL(props.href); const { hash, pathname, protocol } = parseURL(props.href);
const project = computed(() => parseInt(Array.isArray(route.params.projectId) ? '0' : route.params.projectId)); const project = computed(() => parseInt(Array.isArray(route.params.projectId) ? '0' : route.params.projectId));
const { data, status } = await useFetch(`/api/project/${project.value}/file`, {
const { data, status, execute } = await useFetch(`/api/project/${project.value}/file`, {
method: 'GET', method: 'GET',
query: { query: {
search: `%${pathname}` search: `%${pathname}`
@ -43,5 +44,11 @@ const { data, status } = await useFetch(`/api/project/${project.value}/file`, {
key: `file:${project.value}:%${pathname}`, key: `file:${project.value}:%${pathname}`,
dedupe: 'defer', dedupe: 'defer',
ignoreResponseError: true, ignoreResponseError: true,
immediate: false,
}); });
if(pathname && !protocol)
{
execute();
}
</script> </script>

4
components/prose/ProseTag.vue
View File

@ -1,5 +1,5 @@
<template> <template>
<span class="cursor-default bg-accent-blue bg-opacity-10 hover:bg-opacity-20 text-accent-blue text-sm px-1 ms-1 pb-0.5 rounded-full rounded-se-none border border-accent-blue border-opacity-30"> <span class="before:content-['#'] cursor-default bg-accent-blue bg-opacity-10 hover:bg-opacity-20 text-accent-blue text-sm px-1 ms-1 pb-0.5 rounded-full rounded-se-none border border-accent-blue border-opacity-30">
#<slot></slot> <slot></slot>
</span> </span>
</template> </template>

2
components/standard/Input.vue
View File

@ -1,3 +1,3 @@
<template> <template>
<input class="caret-light-50 dark:caret-dark-50 text-light-100 dark:text-dark-100 placeholder:text-light-50 dark:placeholder:text-dark-50 bg-light-20 dark:bg-dark-20 appearance-none outline-none px-3 py-1 focus:shadow-raw transition-[box-shadow] focus:shadow-light-40 dark:focus:shadow-dark-40 border border-light-35 dark:border-dark-35" v-bind="$attrs"/> <input v-bind="$attrs" class="caret-light-50 dark:caret-dark-50 text-light-100 dark:text-dark-100 placeholder:text-light-50 dark:placeholder:text-dark-50 bg-light-20 dark:bg-dark-20 appearance-none outline-none px-3 py-1 focus:shadow-raw transition-[box-shadow] focus:shadow-light-40 dark:focus:shadow-dark-40 border border-light-35 dark:border-dark-35"/>
</template> </template>

BIN
db.sqlite
View File

Binary file not shown.

14
server/tasks/sync.ts
View File

@ -2,6 +2,7 @@ import useDatabase from "~/composables/useDatabase";
import { extname, basename } from 'node:path'; import { extname, basename } from 'node:path';
import type { File, FileType } from '~/types/api'; import type { File, FileType } from '~/types/api';
import { CanvasColor, CanvasContent } from "~/types/canvas"; import { CanvasColor, CanvasContent } from "~/types/canvas";
import useMarkdown from "~/composables/useMarkdown";
const typeMapping: Record<string, FileType> = { const typeMapping: Record<string, FileType> = {
".md": "Markdown", ".md": "Markdown",
@ -26,7 +27,7 @@ export default defineTask({
} }
}) as any; }) as any;
const files = await Promise.all(tree.tree.filter((e: any) => !e.path.startsWith(".")).map(async (e: any) => { const files: File[] = await Promise.all(tree.tree.filter((e: any) => !e.path.startsWith(".")).map(async (e: any) => {
if(e.type === 'tree') if(e.type === 'tree')
{ {
const title = basename(e.path); const title = basename(e.path);
@ -56,11 +57,20 @@ export default defineTask({
} }
})); }));
/*let tags = [];
const tagFile = files.find(e => e.path === "tags");
if(tagFile)
{
useMarkdown()(tagFile.content);
tags.push()
}*/
const db = useDatabase(); const db = useDatabase();
const oldFiles = db.prepare(`SELECT * FROM explorer_files WHERE project = ?1`).all('1') as File[]; const oldFiles = db.prepare(`SELECT * FROM explorer_files WHERE project = ?1`).all('1') as File[];
const remove = db.prepare(`DELETE FROM explorer_files WHERE project = ?1 AND path = ?2`); const remove = db.prepare(`DELETE FROM explorer_files WHERE project = ?1 AND path = ?2`);
db.transaction(data => data.forEach(e => { remove.run('1', e.path); /* console.log(`Removing ${e.title}`) */ }))(oldFiles.filter(e => !files.find(f => f.path = e.path))); db.transaction(data => data.forEach(e => remove.run('1', e.path)))(oldFiles.filter(e => !files.find(f => f.path = e.path)));
remove.finalize(); remove.finalize();
const insert = db.prepare(`INSERT INTO explorer_files("project", "path", "owner", "title", "order", "type", "content") VALUES (1, $path, 1, $title, $order, $type, $content)`); const insert = db.prepare(`INSERT INTO explorer_files("project", "path", "owner", "title", "order", "type", "content") VALUES (1, $path, 1, $title, $order, $type, $content)`);