feat: update UI configurations and enhance skills data structure for improved functionality

This commit is contained in:
2025-09-03 17:58:56 +02:00
parent 9485afa616
commit 8857b53854
9 changed files with 25 additions and 13 deletions

View File

@@ -1,7 +1,7 @@
export default defineAppConfig({ export default defineAppConfig({
ui: { ui: {
container: { container: {
base: 'max-w-4xl', base: 'max-w-3xl',
}, },
colors: { colors: {
primary: 'neutral', primary: 'neutral',

View File

@@ -36,6 +36,8 @@ const { dark, toggleDark } = useTheme()
defineShortcuts({ defineShortcuts({
meta_enter: () => openMessageModal.value = !openMessageModal.value, meta_enter: () => openMessageModal.value = !openMessageModal.value,
enter: () => openMessageModal.value = !openMessageModal.value,
meta_k: () => openMessageModal.value = !openMessageModal.value,
meta_d: () => openClearModal.value = !openClearModal.value, meta_d: () => openClearModal.value = !openClearModal.value,
l: () => changeLocale(currentLocale.value!.code === 'en' ? 'fr' : currentLocale.value!.code === 'fr' ? 'es' : 'en'), l: () => changeLocale(currentLocale.value!.code === 'en' ? 'fr' : currentLocale.value!.code === 'fr' ? 'es' : 'en'),
t: () => toggleDark({ clientX: window.innerWidth, clientY: 0 }), t: () => toggleDark({ clientX: window.innerWidth, clientY: 0 }),
@@ -55,7 +57,7 @@ const commandPaletteUi = {
<template> <template>
<nav <nav
class="fixed z-50 pb-8 duration-700 mx-auto p-8" class="fixed z-50 pb-8 duration-700 mx-auto px-8 sm:px-0"
:class="active ? 'bottom-0 left-1/2 -translate-x-1/2' : 'max-w-[40rem] w-full md:bottom-1/5 left-1/2 -translate-x-1/2 bottom-0'" :class="active ? 'bottom-0 left-1/2 -translate-x-1/2' : 'max-w-[40rem] w-full md:bottom-1/5 left-1/2 -translate-x-1/2 bottom-0'"
> >
<UCard variant="outline" class="rounded-xl shadow-lg w-full" :ui="{ body: 'p-2 sm:p-2 flex gap-2 w-full' }"> <UCard variant="outline" class="rounded-xl shadow-lg w-full" :ui="{ body: 'p-2 sm:p-2 flex gap-2 w-full' }">

View File

@@ -10,15 +10,16 @@ const { t, locale } = useI18n()
<p>{{ t('skills.main') }}</p> <p>{{ t('skills.main') }}</p>
</div> </div>
<div v-if="skills" class="space-y-12 m-1 my-4"> <div v-if="skills" class="space-y-12 m-1 my-4">
<div v-for="category in skills.items" :key="category.id" class="space-y-8"> <div v-for="item in skills.body" :key="item.id" class="space-y-8">
<USeparator <USeparator
:label="locale === 'en' ? category.name.en : locale === 'es' ? category.name.es : category.name.fr" :label="locale === 'en' ? item.name.en : locale === 'es' ? item.name.es : item.name.fr"
size="xs" size="xs"
type="dashed"
/> />
<div class="flex gap-3 flex-wrap"> <div class="flex gap-3 flex-wrap">
<UButton <UButton
v-for="skill in category.items" v-for="skill in item.items"
:key="skill.id" :key="skill.name.trim()"
:label="skill.name" :label="skill.name"
variant="subtle" variant="subtle"
color="neutral" color="neutral"

View File

@@ -57,7 +57,7 @@ export const collections = {
type: 'data', type: 'data',
source: 'skills.json', source: 'skills.json',
schema: z.object({ schema: z.object({
items: z.object({ body: z.array(z.object({
id: z.string(), id: z.string(),
name: z.object({ name: z.object({
en: z.string(), en: z.string(),
@@ -68,7 +68,7 @@ export const collections = {
name: z.string(), name: z.string(),
icon: z.string(), icon: z.string(),
})), })),
}), })),
}), }),
}), }),
} }

View File

@@ -1,5 +1,5 @@
{ {
"items": [ "body": [
{ {
"id": "programmation", "id": "programmation",
"name": { "name": {

View File

@@ -95,6 +95,7 @@
"thinking": "Thinking...", "thinking": "Thinking...",
"fetching": "Fetching the data...", "fetching": "Fetching the data...",
"generating": "Generating the component...", "generating": "Generating the component...",
"checking": "Checking of the Résumé...",
"done": "Done!" "done": "Done!"
}, },
"welcome": "Welcome to ArtChat", "welcome": "Welcome to ArtChat",

View File

@@ -95,7 +95,8 @@
"thinking": "Pensando...", "thinking": "Pensando...",
"fetching": "Obteniendo los datos...", "fetching": "Obteniendo los datos...",
"generating": "Generando el componente...", "generating": "Generando el componente...",
"done": "¡Hecho!" "done": "¡Hecho!",
"checking": "Comprobación del currículum ..."
}, },
"welcome": "Bienvenido en Artchat", "welcome": "Bienvenido en Artchat",
"ask": "Pregúntame cualquier cosa sobre Arthur Danjou" "ask": "Pregúntame cualquier cosa sobre Arthur Danjou"

View File

@@ -95,7 +95,8 @@
"thinking": "En train de réfléchir...", "thinking": "En train de réfléchir...",
"fetching": "Récupération des données...", "fetching": "Récupération des données...",
"generating": "Génération du composant...", "generating": "Génération du composant...",
"done": "Terminé !" "done": "Terminé !",
"checking": "Vérification du curriculum vitae ..."
}, },
"welcome": "Bienvenue sur Artchat", "welcome": "Bienvenue sur Artchat",
"ask": "Demandez-moi n'importe quoi sur Arthur Danjou" "ask": "Demandez-moi n'importe quoi sur Arthur Danjou"

View File

@@ -34,6 +34,7 @@ export enum ChatFetchState {
THINKING = 'chat.state.thinking', THINKING = 'chat.state.thinking',
FETCHING = 'chat.state.fetching', FETCHING = 'chat.state.fetching',
GENERATING = 'chat.state.generating', GENERATING = 'chat.state.generating',
CHECKING = 'chat.state.checking',
DONE = 'chat.state.done', DONE = 'chat.state.done',
} }
@@ -123,13 +124,14 @@ export const ChatMessages = [
icon: 'i-ph-person-arms-spread-duotone', icon: 'i-ph-person-arms-spread-duotone',
prompt: 'command.about.prompt', prompt: 'command.about.prompt',
type: ChatType.ABOUT, type: ChatType.ABOUT,
fetchStates: [ChatFetchState.CHECKING],
}, },
{ {
label: 'command.projects.label', label: 'command.projects.label',
icon: 'i-ph-code-duotone', icon: 'i-ph-code-duotone',
prompt: 'command.projects.prompt', prompt: 'command.projects.prompt',
type: ChatType.PROJECTS, type: ChatType.PROJECTS,
fetchStates: [ChatFetchState.FETCHING, ChatFetchState.GENERATING], fetchStates: [ChatFetchState.FETCHING, ChatFetchState.CHECKING, ChatFetchState.GENERATING],
}, },
{ {
label: 'command.writings.label', label: 'command.writings.label',
@@ -143,31 +145,35 @@ export const ChatMessages = [
icon: 'i-ph-briefcase-duotone', icon: 'i-ph-briefcase-duotone',
prompt: 'command.experiences.prompt', prompt: 'command.experiences.prompt',
type: ChatType.EXPERIENCES, type: ChatType.EXPERIENCES,
fetchStates: [ChatFetchState.CHECKING],
}, },
{ {
label: 'command.skills.label', label: 'command.skills.label',
icon: 'i-ph-rocket-duotone', icon: 'i-ph-rocket-duotone',
prompt: 'command.skills.prompt', prompt: 'command.skills.prompt',
type: ChatType.SKILLS, type: ChatType.SKILLS,
fetchStates: [ChatFetchState.FETCHING], fetchStates: [ChatFetchState.FETCHING, ChatFetchState.CHECKING],
}, },
{ {
label: 'command.resume.label', label: 'command.resume.label',
icon: 'i-ph-address-book-duotone', icon: 'i-ph-address-book-duotone',
prompt: 'command.resume.prompt', prompt: 'command.resume.prompt',
type: ChatType.RESUME, type: ChatType.RESUME,
fetchStates: [ChatFetchState.CHECKING],
}, },
{ {
label: 'command.contact.label', label: 'command.contact.label',
icon: 'i-ph-envelope-duotone', icon: 'i-ph-envelope-duotone',
prompt: 'command.contact.prompt', prompt: 'command.contact.prompt',
type: ChatType.CONTACT, type: ChatType.CONTACT,
fetchStates: [ChatFetchState.CHECKING],
}, },
{ {
label: 'command.hobbies.label', label: 'command.hobbies.label',
icon: 'i-ph-heart-duotone', icon: 'i-ph-heart-duotone',
prompt: 'command.hobbies.prompt', prompt: 'command.hobbies.prompt',
type: ChatType.HOBBIES, type: ChatType.HOBBIES,
fetchStates: [ChatFetchState.CHECKING],
}, },
{ {
label: 'command.uses.label', label: 'command.uses.label',