Sync completed + Navigation links improved

This commit is contained in:
Peaceultime 2024-08-21 14:05:27 +02:00
parent a9a98b9618
commit 62ba72515b
17 changed files with 125 additions and 889 deletions

BIN
bun.lockb

Binary file not shown.

View File

@ -44,7 +44,7 @@ import LiveBlockquote from "~/components/prose/ProseBlockquote.vue";
import { hash } from 'ohash'
import { watch, computed } from 'vue'
import type { Root, Node } from 'hast';
import { diffLines as diff } from 'diff';
/* import { diffLines as diff } from 'diff'; */
const model = defineModel<string>();
@ -61,7 +61,7 @@ async function update(value: string | undefined, old: string | undefined) {
{
if(node.value)
{
const differences = diff(old, value, {
/* const differences = diff(old, value, {
newlineIsToken: true,
});
@ -108,11 +108,10 @@ async function update(value: string | undefined, old: string | undefined) {
newNodes = parser(value.substring(newStart ?? 0, (newEnd ?? 0) + lengthDiff));
const root = node.value;
//root.position?.end.offset
node.value = parser(value);
}
console.log(node.value);
} */
node.value = parser(value);
}
else
{

View File

@ -111,10 +111,6 @@ function renderNode(node: RootContent, tags: Record<string, any>): VNode | undef
{
return h(tags[node.tagName] ?? node.tagName, { ...node.properties, class: node.properties.className }, {default: () => node.children.map(e => renderNode(e, tags)).filter(e => !!e)});
}
else if(node.type === 'raw')
{
console.warn("???");
}
return undefined;
}

View File

@ -11,25 +11,7 @@ const hasChildren = computed(() => {
return props.link && props.link.children && props.link.children.length > 0 || false;
});
if(hasChildren.value)
{
props.link.children?.sort((a, b) => {
if(a.order && b.order)
return a.order - b.order;
if(a.path === props.link.path)
return -1;
if(b.path === props.link.path)
return 1;
return 0;
});
}
const collapsed = ref(!useRoute().path.startsWith('/explorer' + props.link.path));
function hideLeftPanel(_: Event)
{
document?.querySelector('.published-container')?.classList.remove('is-left-column-open');
}
const collapsed = ref(!unifySlug(useRoute().params.slug).startsWith(props.link.path));
</script>
<template>
@ -37,7 +19,8 @@ function hideLeftPanel(_: Event)
<template v-if="hasChildren">
<div class="tree-item-self"
:class="{ 'is-collapsed': collapsed, 'mod-collapsible is-clickable': hasChildren }"
data-path="{{ props.link.title }}" @click="collapsed = hasChildren && !collapsed">
data-path="{{ props.link.title }}" @click="collapsed = hasChildren && !collapsed"
:data-type="link.private ? 'privé' : undefined">
<div v-if="hasChildren" class="tree-item-icon collapse-icon">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"
stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"
@ -51,8 +34,8 @@ function hideLeftPanel(_: Event)
<NavigationLink v-if="hasChildren" v-for="l of link.children" :link="l" :project="project" />
</div>
</template>
<NuxtLink @click="hideLeftPanel" v-else class="tree-item-self" :to="{ path: `/explorer/${project}${link.path}`, force: true }"
:active-class="'mod-active'" :data-type="link.type === 'Canvas' ? 'graph' : undefined">
<NuxtLink v-else class="tree-item-self" :to="{ path: `/explorer/${project}/${link.path}`, force: true }"
:active-class="'mod-active'" :data-type="(link.type === 'Canvas' ? 'graph' : (link.private ? 'privé' : undefined))">
<div class="tree-item-inner">{{ link.title }}</div>
</NuxtLink>
</div>

View File

@ -1,6 +1,6 @@
<template>
<NuxtLink class="preview-link" v-if="data && data[0] && status !== 'pending'"
:to="{ path: `/explorer/${project}${data[0].path}`, hash: hash }" :class="class">
:to="{ path: `/explorer/${project}/${data[0].path}`, hash: hash }" :class="class">
<PreviewContent :project="project" :path="data[0].path" :anchor="hash">
<slot v-bind="$attrs"></slot>
<ThemeIcon class="link-icon" v-if="data && data[0] && data[0].type !== 'Markdown'" :height="20" :width="20"

View File

@ -1,5 +1,23 @@
<template>
<blockquote>
<blockquote ref="el">
<slot />
</blockquote>
</template>
<script setup lang="ts">
const attrs = useAttrs(), el = ref<HTMLQuoteElement>(), title = ref<Element | null>(null);
onMounted(() => {
if(el && el.value && attrs.hasOwnProperty("dataCalloutFold"))
{
title.value = el.value.querySelector('.callout-title');
title.value?.addEventListener('click', toggle);
}
});
onUnmounted(() => {
title.value?.removeEventListener('click', toggle);
})
function toggle() {
el.value?.classList?.toggle('is-collapsed');
}
</script>

View File

@ -6,6 +6,4 @@
<script setup lang="ts">
const props = defineProps<{ id?: string }>()
const generate = computed(() => props.id)
</script>

View File

@ -6,6 +6,7 @@ import RemarkRehype from 'remark-rehype';
import RemarkOfm from 'remark-ofm';
import RemarkBreaks from 'remark-breaks'
import RemarkGfm from 'remark-gfm';
import RemarkFrontmatter from 'remark-frontmatter';
import RehypeRaw from 'rehype-raw';
export default function useMarkdown(): (md: string) => Root
@ -15,7 +16,7 @@ export default function useMarkdown(): (md: string) => Root
const parse = (markdown: string) => {
if (!processor)
{
processor = unified().use([RemarkParse, RemarkGfm, RemarkOfm, RemarkBreaks]);
processor = unified().use([RemarkParse, RemarkGfm, RemarkOfm, RemarkBreaks, RemarkFrontmatter]);
processor.use(RemarkRehype, { allowDangerousHtml: true });
processor.use(RehypeRaw);
}

BIN
db.sqlite

Binary file not shown.

View File

@ -14,6 +14,7 @@
},
"dependencies": {
"diff": "^5.2.0",
"lodash.capitalize": "^4.2.1"
"lodash.capitalize": "^4.2.1",
"remark-frontmatter": "^5.0.0"
}
}

View File

@ -12,7 +12,7 @@ const { data: projects, status, error } = await useFetch('/api/project');
<div class="projects-container">
<div v-if="status === 'success'" class="project-list">
<div v-for="p of projects" class="project-item">
<NuxtLink class="project-title" :to="{ path: `/explorer/${p.id}${p.home}`, force: true }">{{ p.name }}</NuxtLink>
<NuxtLink class="project-title" :to="{ path: `/explorer/${p.id}/${p.home}`, force: true }">{{ p.name }}</NuxtLink>
<div class="project-user">Par {{ p.username }}</div>
<div class="project-pages">{{ p.pages }} pages</div>
<div class="project-summary">{{ p.summary ?? "Sans contenu" }}</div>

View File

@ -11,8 +11,6 @@ export default defineCachedEventHandler(async (e) => {
return;
}
console.log(query);
const where = ["project = $project"];
const criteria: Record<string, any> = { $project: project };

View File

@ -1,7 +1,9 @@
import useDatabase from '~/composables/useDatabase';
import { Navigation } from '~/types/api';
export default defineEventHandler(async (e) => {
const project = getRouterParam(e, "projectId");
const { user } = await getUserSession(e);
if(!project)
{
@ -11,14 +13,33 @@ export default defineEventHandler(async (e) => {
const db = useDatabase();
const content = db.query(`SELECT "path", "title", "type", "order" FROM explorer_files WHERE project = ?1 and navigable = 1 and private = 0`).all(project!).sort((a: any, b: any) => a.path.length - b.path.length) as any[];
const content = db.query(`SELECT "path", "title", "type", "order", "private", "navigable", "owner" FROM explorer_files WHERE project = ?1`).all(project!).sort((a: any, b: any) => a.path.length - b.path.length) as Navigation[];
if(content.length > 0)
{
const navigation: Navigation[] = [];
for(const item of content)
for(const idx in content)
{
const item = content[idx];
if(!!item.private && (user?.id ?? -1) !== item.owner || !item.navigable)
{
delete content[idx];
continue;
}
const parent = item.path.includes('/') ? item.path.substring(0, item.path.lastIndexOf('/')) : undefined;
if(parent && !content.find(e => e && e.path === parent))
{
delete content[idx];
continue;
}
}
for(const item of content.filter(e => !!e))
{
addChild(navigation, item);
}
return navigation;
}
@ -39,6 +60,11 @@ function addChild(arr: Navigation[], e: Navigation): void
}
else
{
arr.push({ title: e.title, path: e.path, type: e.type, order: e.order });
arr.push({ title: e.title, path: e.path, type: e.type, order: e.order, private: e.private });
arr.sort((a, b) => {
if(a.order && b.order)
return a.order - b.order;
return a.title.localeCompare(b.title);
});
}
}

File diff suppressed because one or more lines are too long

3
types/api.d.ts vendored
View File

@ -25,7 +25,8 @@ export interface Navigation {
title: string;
path: string;
type: string;
order: number
order: number;
private: boolean;
children?: Navigation[];
}
export interface File {

View File

@ -1,4 +1,4 @@
export function unifySlug(slug: string | string[]): string
{
return '/' + (Array.isArray(slug) ? slug.join('/') : slug);
return (Array.isArray(slug) ? slug.join('/') : slug);
}