Improve chat context: build_context() now returns metadata about auto-found notes, emitted as an SSE event so the frontend can display context pills showing which notes influenced the response. Users can promote notes for deeper context (+) or exclude irrelevant ones (x). A note picker lets users manually attach notes. Multi-word search uses per-term AND matching, and auto-search iterates keywords individually for broader OR-style coverage. Standardize styling: introduce CSS design tokens (--radius-sm/md/lg/pill, --color-success/warning/overlay, --focus-ring) and migrate all components to use them. Fix header alignment to full-width, add active nav link state, replace hardcoded colors with CSS variables, and normalize button padding. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
68 lines
1.6 KiB
Vue
68 lines
1.6 KiB
Vue
<script setup lang="ts">
|
|
import type { Note } from "@/types/note";
|
|
import TagPill from "@/components/TagPill.vue";
|
|
import { relativeTime } from "@/composables/useRelativeTime";
|
|
import { renderPreview } from "@/utils/markdown";
|
|
|
|
defineProps<{ note: Note }>();
|
|
const emit = defineEmits<{ "tag-click": [tag: string] }>();
|
|
|
|
function onTagClick(tag: string) {
|
|
emit("tag-click", tag);
|
|
}
|
|
</script>
|
|
|
|
<template>
|
|
<router-link :to="`/notes/${note.id}`" class="note-card">
|
|
<h3 class="note-title">{{ note.title || "Untitled" }}</h3>
|
|
<div v-if="note.body" class="note-preview prose" v-html="renderPreview(note.body)"></div>
|
|
<div class="note-meta">
|
|
<TagPill
|
|
v-for="tag in note.tags"
|
|
:key="tag"
|
|
:tag="tag"
|
|
@click.stop="onTagClick(tag)"
|
|
/>
|
|
<span class="timestamp">{{ relativeTime(note.updated_at) }}</span>
|
|
</div>
|
|
</router-link>
|
|
</template>
|
|
|
|
<style scoped>
|
|
.note-card {
|
|
display: block;
|
|
padding: 1rem;
|
|
border: 1px solid var(--color-border);
|
|
border-radius: var(--radius-md);
|
|
text-decoration: none;
|
|
color: inherit;
|
|
background: var(--color-bg-card);
|
|
transition: box-shadow 0.15s;
|
|
}
|
|
.note-card:hover {
|
|
box-shadow: 0 2px 8px var(--color-shadow);
|
|
}
|
|
.note-title {
|
|
margin: 0 0 0.25rem;
|
|
font-size: 1.1rem;
|
|
}
|
|
.note-preview {
|
|
margin: 0 0 0.5rem;
|
|
color: var(--color-text-secondary);
|
|
font-size: 0.9rem;
|
|
max-height: 7.5em;
|
|
overflow: hidden;
|
|
}
|
|
.note-meta {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 0.5rem;
|
|
flex-wrap: wrap;
|
|
}
|
|
.timestamp {
|
|
margin-left: auto;
|
|
font-size: 0.75rem;
|
|
color: var(--color-text-muted);
|
|
}
|
|
</style>
|