feat: show page titles on agent and topic pages

This commit moves the actions bar out of the default template and into the
individual pages so that they can display their titles at the top. this
commit also has pages set the meta title so tabs are labeled nicely.
This commit is contained in:
Zoe
2026-02-24 16:33:32 +00:00
parent a22b6c07d1
commit ab57af1f23
7 changed files with 108 additions and 51 deletions
+20 -8
View File
@@ -4,6 +4,7 @@ import type { Agent } from '~/composables/useAgents';
const triplit = useTriplitClient();
const { open: sidebarOpen, openSidebar } = useSidebar();
const { agents, createAgent } = useAgents();
const { providers, getFirstAvailableModel, allModels } = useModels();
@@ -165,14 +166,25 @@ onUnmounted(() => {
</script>
<template>
<div class="flex flex-col items-center pt-12 px-4 h-full gap-12">
<h1 class="text-center text-3xl font-semibold">{{ animatedText }}<span
class="animate-blink inline-block w-4 h-[0.9em] bg-current align-middle ml-0.5 select-none">&nbsp;</span>
</h1>
<div class="max-w-4xl h-full w-full">
<!-- TODO: view transitions have caused me issues with the page flashing with no content (so just a black or white screen depending on the theme) so I have disabled them for now. -->
<ChatInput class="[view-transition-name:chat-prompt] duration-150 ease-in-out" :agent="agent"
:providers="providers" @submit="handleChatSubmit" />
<div class="h-full w-full flex flex-col">
<div class="h-14 flex items-center justify-between px-4">
<div class="flex items-center gap-2">
<button v-if="!sidebarOpen" @click="openSidebar"
class="flex p-2 rounded-lg text-[var(--text-primary)] bg-transparent hover:bg-[var(--color-hover)] transition-colors">
<Icon class="text-5" name="mynaui:panel-left-open" />
</button>
</div>
</div>
<div class="flex flex-col items-center pt-12 px-4 h-full gap-12">
<h1 class="text-center text-3xl font-semibold">{{ animatedText }}<span
class="animate-blink inline-block w-4 h-[0.9em] bg-current align-middle ml-0.5 select-none">&nbsp;</span>
</h1>
<div class="max-w-4xl h-full w-full">
<!-- TODO: view transitions have caused me issues with the page flashing with no content (so just a black or white screen depending on the theme) so I have disabled them for now. -->
<ChatInput class="[view-transition-name:chat-prompt] duration-150 ease-in-out" :agent="agent"
:providers="providers" @submit="handleChatSubmit" />
</div>
</div>
</div>
</template>