Add invitation system, table of contents, actionable dashboard, and settings improvements

Invitation system (Phase 5.7):
- invitation_tokens table (migration 0012) with SHA256-hashed tokens, 7-day expiry
- Admin CRUD endpoints: POST/GET/DELETE /api/admin/invitations
- Branded invitation email with registration link
- /register-invite frontend view with token validation and account creation
- Admin UI: invite form + pending invitations table with revoke
- Configurable base URL setting for email links (replaces hardcoded Config.BASE_URL)

Table of contents + markdown improvements (Phase 5.8):
- TableOfContents component: sticky sidebar, heading parsing, smooth-scroll
- Custom marked renderer adds id attributes to headings for anchor links
- stripFirstLineTags() prevents leading #tags from rendering as headings
- NoteViewerView/TaskViewerView flex layout with TOC sidebar (hidden ≤1200px)
- Model catalog refresh: added llama3.2/3.3, gemma3, qwen3, phi4, deepseek-r1,
  qwen2.5-coder, dolphin3; added Reasoning category; removed discontinued models
- Settings model section split into Installed/Available tabs

Actionable dashboard (Phase 5.9):
- due_before/due_after query params on /api/tasks (exclusive < / inclusive >=)
- HomeView rewritten: overdue (red accent), due today, in progress, chats, notes
- 5 parallel API calls via Promise.allSettled
- Client-side done filtering and in-progress deduplication
- Task sections hidden when empty; status toggle removes done tasks

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
2026-02-14 08:46:51 -05:00
parent d354da5b51
commit e02b681e91
20 changed files with 1506 additions and 295 deletions
+246 -97
View File
@@ -46,88 +46,110 @@ const sendingTest = ref(false);
const MODEL_CATALOG: ModelInfo[] = [
// — General Purpose —
{
name: "llama3.2",
description: "Meta's Llama 3.2 — lightweight models (1B/3B) with 128K context. Great for low-resource setups.",
size: "2.0 GB",
bestFor: "Light tasks, fast responses, low RAM",
category: "General Purpose",
},
{
name: "llama3.1",
description: "Meta's Llama 3.1 8B — strong general-purpose model with good instruction following.",
size: "4.7 GB",
description: "Meta's Llama 3.1 8B — strong general-purpose model with good instruction following. 128K context.",
size: "4.9 GB",
bestFor: "General chat, writing, Q&A",
category: "General Purpose",
},
{
name: "llama3.1:70b",
description: "Meta's Llama 3.1 70B — significantly more capable, better reasoning and nuance.",
size: "40 GB",
name: "llama3.3",
description: "Meta's Llama 3.3 70B — 405B-level performance in a 70B model. 128K context. Top tier open model.",
size: "43 GB",
bestFor: "Complex reasoning, detailed analysis",
category: "General Purpose",
},
{
name: "mistral",
description: "Mistral 7B — fast and efficient with strong performance for its size.",
size: "4.1 GB",
bestFor: "Fast responses, general tasks",
name: "gemma3",
description: "Google's Gemma 3 — multimodal (vision + text), 1B to 27B. 128K context, 140+ languages.",
size: "5.2 GB",
bestFor: "Multilingual, vision, general tasks",
category: "General Purpose",
},
{
name: "qwen3",
description: "Alibaba's Qwen 3 — latest generation, 0.6B to 235B. Up to 256K context. Hybrid thinking modes.",
size: "4.7 GB",
bestFor: "Multilingual, reasoning, code, math",
category: "General Purpose",
},
{
name: "qwen2.5",
description: "Alibaba's Qwen 2.5 7B — multilingual model with strong coding and math skills.",
description: "Alibaba's Qwen 2.5 7B — multilingual model with strong coding and math skills. 32K context.",
size: "4.7 GB",
bestFor: "Multilingual, code, math",
category: "General Purpose",
},
{
name: "phi3",
description: "Microsoft Phi-3 Mini — compact model with surprising capability for its size.",
size: "2.3 GB",
bestFor: "Light tasks, low resource usage",
category: "General Purpose",
},
{
name: "neural-chat",
description: "Intel's fine-tune optimized for natural conversation. Lighter filtering than base models.",
name: "mistral",
description: "Mistral 7B v0.3 — fast and efficient with function calling support. 32K context.",
size: "4.1 GB",
bestFor: "Natural conversation, general tasks",
bestFor: "Fast responses, general tasks",
category: "General Purpose",
},
{
name: "yi",
description: "01.AI's Yi 6B — Chinese-developed model, more permissive on creative content.",
size: "3.5 GB",
bestFor: "Creative content, multilingual",
name: "phi4",
description: "Microsoft Phi-4 14B — strong reasoning and math for its size. Successor to Phi-3.",
size: "9.1 GB",
bestFor: "Reasoning, math, structured tasks",
category: "General Purpose",
},
{
name: "command-r",
description: "Cohere's Command R 35B — enterprise-grade model with light content filtering.",
description: "Cohere's Command R 35B — enterprise-grade model with 128K context and light content filtering.",
size: "20 GB",
bestFor: "RAG, conversation, creative tasks",
category: "General Purpose",
},
// — Reasoning —
{
name: "deepseek-r1",
description: "DeepSeek R1 — chain-of-thought reasoning model. Distilled versions from 1.5B to 70B run locally.",
size: "4.7 GB",
bestFor: "Step-by-step reasoning, math, logic",
category: "Reasoning",
},
// — Coding —
{
name: "codellama",
description: "Meta's Code Llama — specialized for code generation and understanding.",
size: "3.8 GB",
bestFor: "Code generation, debugging, technical docs",
name: "qwen2.5-coder",
description: "Alibaba's Qwen 2.5 Coder — 0.5B to 32B. 32B version rivals GPT-4o on coding benchmarks.",
size: "4.7 GB",
bestFor: "Code generation, refactoring, debugging",
category: "Coding",
},
{
name: "deepseek-coder-v2",
description: "DeepSeek Coder V2 — state-of-the-art coding model with strong math ability.",
description: "DeepSeek Coder V2 16B — strong coding model with 160K context and math ability.",
size: "8.9 GB",
bestFor: "Code, math, technical problem solving",
category: "Coding",
},
// — Uncensored / Creative Writing —
{
name: "dolphin3",
description: "Eric Hartford's Dolphin 3 — next-gen uncensored model based on Llama 3.1 8B. 128K context.",
size: "4.9 GB",
bestFor: "Uncensored chat, coding, creative writing",
category: "Uncensored / Creative Writing",
},
{
name: "dolphin-mistral",
description: "Eric Hartford's Dolphin fine-tune of Mistral 7B. Safety/refusal data removed from training.",
description: "Dolphin fine-tune of Mistral 7B. Safety/refusal data removed from training. 32K context.",
size: "4.1 GB",
bestFor: "Uncensored general chat, creative writing",
category: "Uncensored / Creative Writing",
},
{
name: "dolphin-llama3",
description: "Dolphin fine-tune of Llama 3 8B. Uncensored training on a stronger base model.",
description: "Dolphin fine-tune of Llama 3 8B. Uncensored training on a strong base model.",
size: "4.7 GB",
bestFor: "Uncensored chat, strong reasoning",
category: "Uncensored / Creative Writing",
@@ -153,30 +175,15 @@ const MODEL_CATALOG: ModelInfo[] = [
bestFor: "Helpful assistant, minimal filtering",
category: "Uncensored / Creative Writing",
},
{
name: "nollama/mythomax-l2-13b",
description: "MythoMax L2 13B — a merge of multiple fine-tunes for creative and narrative writing with strong coherence.",
size: "7.4 GB",
bestFor: "Creative fiction, roleplay, narrative writing",
category: "Uncensored / Creative Writing",
},
{
name: "mattw/mythalion",
description: "Mythalion 13B — a Gryphe merge combining Mythologic and Pygmalion for expressive creative output.",
size: "7.4 GB",
bestFor: "Creative writing, character dialogue",
category: "Uncensored / Creative Writing",
},
{
name: "samantha-mistral",
description: "Eric Hartford's Samantha personality model. Designed as a helpful companion without refusals.",
size: "4.1 GB",
bestFor: "Companion chat, unrestricted conversation",
category: "Uncensored / Creative Writing",
},
];
const selectedModel = ref("");
const modelTab = ref<"installed" | "available">("installed");
// Base URL setting (admin only)
const baseUrl = ref("");
const savingBaseUrl = ref(false);
const baseUrlSaved = ref(false);
const modelStatuses = computed(() => {
const installed = new Set(
@@ -189,6 +196,10 @@ const modelStatuses = computed(() => {
}));
});
const installedModels = computed(() =>
modelStatuses.value.filter((m) => m.installed)
);
const categories = computed(() => {
const cats: string[] = [];
for (const m of modelStatuses.value) {
@@ -224,7 +235,7 @@ onMounted(async () => {
notifySecurityAlerts.value = allSettings.notify_security_alerts !== "false";
}
// Load SMTP config if admin
// Load admin settings
if (authStore.isAdmin) {
try {
const smtpConfig = await apiGet<Record<string, string>>("/api/admin/smtp");
@@ -232,6 +243,12 @@ onMounted(async () => {
} catch {
// SMTP not configured yet
}
try {
const urlConfig = await apiGet<{ base_url: string }>("/api/admin/base-url");
baseUrl.value = urlConfig.base_url;
} catch {
// base URL not configured yet
}
}
});
@@ -411,6 +428,20 @@ async function sendTestEmail() {
}
}
async function saveBaseUrl() {
savingBaseUrl.value = true;
baseUrlSaved.value = false;
try {
await apiPut("/api/admin/base-url", { base_url: baseUrl.value.trim() });
baseUrlSaved.value = true;
setTimeout(() => (baseUrlSaved.value = false), 2000);
} catch {
toastStore.show("Failed to save application URL", "error");
} finally {
savingBaseUrl.value = false;
}
}
async function handleRestoreFile(event: Event) {
const file = (event.target as HTMLInputElement).files?.[0];
if (!file) return;
@@ -545,6 +576,29 @@ async function handleRestoreFile(event: Event) {
</div>
</section>
<section v-if="authStore.isAdmin" class="settings-section">
<h2>Application URL</h2>
<p class="section-desc">
The public URL used in email links (invitations, password resets). Example: https://notes.example.com
</p>
<div class="field">
<label for="base-url">Base URL</label>
<input
id="base-url"
v-model="baseUrl"
type="url"
placeholder="https://notes.example.com"
class="input"
/>
</div>
<div class="actions">
<button class="btn-save" @click="saveBaseUrl" :disabled="savingBaseUrl">
{{ savingBaseUrl ? "Saving..." : "Save" }}
</button>
<span v-if="baseUrlSaved" class="saved-msg">Saved!</span>
</div>
</section>
<section v-if="authStore.isAdmin" class="settings-section">
<h2>Email / SMTP</h2>
<p class="section-desc">
@@ -612,15 +666,35 @@ async function handleRestoreFile(event: Event) {
<section class="settings-section">
<h2>Model</h2>
<p class="section-desc">
Choose which LLM model to use for chat. Models need to be downloaded before use.
</p>
<div v-for="cat in categories" :key="cat" class="model-category">
<h3 class="category-label">{{ cat }}</h3>
<div class="model-list">
<div class="model-tabs">
<button
class="model-tab"
:class="{ active: modelTab === 'installed' }"
@click="modelTab = 'installed'"
>
Installed
</button>
<button
class="model-tab"
:class="{ active: modelTab === 'available' }"
@click="modelTab = 'available'"
>
Available
</button>
</div>
<!-- Installed tab -->
<template v-if="modelTab === 'installed'">
<p class="section-desc">
Models currently downloaded and ready to use.
</p>
<div v-if="installedModels.length === 0" class="empty-state">
No models installed. Browse the Available tab to download one.
</div>
<div v-else class="model-list">
<div
v-for="model in modelsInCategory(cat)"
v-for="model in installedModels"
:key="model.name"
class="model-card"
:class="{ active: model.active }"
@@ -630,56 +704,84 @@ async function handleRestoreFile(event: Event) {
<span class="model-name">{{ model.name }}</span>
<span class="model-size">{{ model.size }}</span>
</div>
<p class="model-desc">{{ model.description }}</p>
<p class="model-best-for">
<strong>Best for:</strong> {{ model.bestFor }}
</p>
</div>
<div class="model-actions">
<template v-if="model.installed">
<button
v-if="!model.active"
class="btn-select"
@click="selectModel(model.name)"
:disabled="saving"
>
Select
</button>
<span v-else class="active-badge">Active</span>
<template v-if="confirmDelete === model.name">
<button
v-if="!model.active"
class="btn-select"
@click="selectModel(model.name)"
:disabled="saving"
>
Select
</button>
<span v-else class="active-badge">Active</span>
<template v-if="confirmDelete === model.name">
<button
class="btn-confirm-delete"
@click="removeModel(model.name)"
:disabled="deleting !== null"
>
{{ deleting === model.name ? "Removing..." : "Confirm" }}
</button>
<button class="btn-cancel-delete" @click="cancelDelete">
Cancel
</button>
</template>
<button
v-else
class="btn-remove"
class="btn-confirm-delete"
@click="removeModel(model.name)"
:disabled="deleting !== null || model.active"
:title="model.active ? 'Cannot remove the active model' : 'Remove model'"
:disabled="deleting !== null"
>
Remove
{{ deleting === model.name ? "Removing..." : "Confirm" }}
</button>
<button class="btn-cancel-delete" @click="cancelDelete">
Cancel
</button>
</template>
<button
v-else
class="btn-pull"
@click="pullModel(model.name)"
:disabled="pullProgress !== null"
class="btn-remove"
@click="removeModel(model.name)"
:disabled="deleting !== null || model.active"
:title="model.active ? 'Cannot remove the active model' : 'Remove model'"
>
{{ pullProgress?.model === model.name ? `Downloading ${pullProgress.percent}%` : "Download" }}
Remove
</button>
</div>
</div>
</div>
</div>
</template>
<!-- Available tab -->
<template v-if="modelTab === 'available'">
<p class="section-desc">
Browse and download models. Models need to be downloaded before use.
</p>
<div v-for="cat in categories" :key="cat" class="model-category">
<h3 class="category-label">{{ cat }}</h3>
<div class="model-list">
<div
v-for="model in modelsInCategory(cat)"
:key="model.name"
class="model-card"
:class="{ active: model.active }"
>
<div class="model-info">
<div class="model-name-row">
<span class="model-name">{{ model.name }}</span>
<span class="model-size">{{ model.size }}</span>
</div>
<p class="model-desc">{{ model.description }}</p>
<p class="model-best-for">
<strong>Best for:</strong> {{ model.bestFor }}
</p>
</div>
<div class="model-actions">
<template v-if="model.installed">
<span class="installed-badge">Installed</span>
</template>
<button
v-else
class="btn-pull"
@click="pullModel(model.name)"
:disabled="pullProgress !== null"
>
{{ pullProgress?.model === model.name ? `Downloading ${pullProgress.percent}%` : "Download" }}
</button>
</div>
</div>
</div>
</div>
</template>
</section>
<section class="settings-section">
@@ -912,6 +1014,53 @@ async function handleRestoreFile(event: Event) {
font-weight: 600;
}
/* Model tabs */
.model-tabs {
display: flex;
gap: 0.5rem;
margin-bottom: 1rem;
}
.model-tab {
padding: 0.4rem 1rem;
background: transparent;
color: var(--color-text-muted);
border: 1px solid var(--color-border);
border-radius: var(--radius-sm);
cursor: pointer;
font-size: 0.9rem;
font-weight: 500;
}
.model-tab.active {
background: var(--color-primary);
color: #fff;
border-color: var(--color-primary);
}
.model-tab:hover:not(.active) {
border-color: var(--color-text-muted);
color: var(--color-text);
}
/* Installed badge on available tab */
.installed-badge {
padding: 0.25rem 0.75rem;
background: var(--color-success);
color: #fff;
border-radius: var(--radius-lg);
font-size: 0.8rem;
font-weight: 600;
white-space: nowrap;
}
/* Empty state */
.empty-state {
padding: 2rem 1rem;
text-align: center;
color: var(--color-text-muted);
font-size: 0.9rem;
border: 1px dashed var(--color-border);
border-radius: var(--radius-md);
}
/* Category headers */
.model-category {
margin-bottom: 1.5rem;