feat: enhance command palette with new "uses" feature and update chat types

- Added "View setup" command to the command palette in English, French, and Spanish. - Removed "Tech Stack" command from the command palette. - Updated MessageContainer to handle new "uses" message type. - Refactored chat.ts to use a new ChatMessages function for better organization. - Created new Uses.vue component to display a list of software and gadgets. - Added Item.vue and List.vue components for rendering individual items and categories. - Updated content configuration to include new skills and uses categories. - Added new JSON files for programming languages, frontend, backend, devops, and python frameworks. - Updated existing JSON files for homelab items with improved descriptions. - Removed obsolete stack JSON files.
2026-01-14 13:54:01 +01:00 · 2025-09-02 21:19:32 +02:00
parent f850982430
commit ff28b719de
35 changed files with 295 additions and 227 deletions
--- a/app/components/chat/CommandPalette.vue
+++ b/app/components/chat/CommandPalette.vue
@@ -156,6 +156,10 @@ const commandPaletteUi = {
            "label": "Change theme",
            "prompt": "How can I change the theme?"
        },
+        "uses": {
+          "label": "View setup",
+          "prompt": "How can I view the setup of Arthur?"
+        },
        "stats": {
          "label": "View statistics",
          "prompt": "How can I view the statistics concerning Arthur?"
@@ -196,10 +200,6 @@ const commandPaletteUi = {
            "label": "Skills",
            "prompt": "What are your skills?"
        },
-        "stack": {
-            "label": "Tech Stack",
-            "prompt": "What tech stack are you currently using?"
-        },
        "status": {
            "label": "Homelab status",
            "prompt": "I saw you have a homelab, is it currently working?"
@@ -242,6 +242,10 @@ const commandPaletteUi = {
        "label": "Changer de thème",
        "prompt": "Comment puis-je changer le thème ?"
      },
+      "uses": {
+        "label": "Voir la configuration",
+        "prompt": "Comment puis-je voir la configuration d'Arthur ?"
+      },
      "stats": {
        "label": "Voir les statistiques",
        "prompt": "Comment puis-je voir les statistiques concernant Arthur ?"
@@ -282,10 +286,6 @@ const commandPaletteUi = {
        "label": "Compétences",
        "prompt": "Quelles sont tes compétences ?"
      },
-      "stack": {
-        "label": "Tech Stack",
-        "prompt": "Quelle est stack technique utilises-tu en ce moment ?"
-      },
      "status": {
        "label": "Statut du homelab",
        "prompt": "J'ai vu que tu avais un homelab, est-il actuellement fonctionnel ?"
@@ -328,6 +328,10 @@ const commandPaletteUi = {
            "label": "Cambiar tema",
            "prompt": "¿Cómo puedo cambiar el tema?"
        },
+        "uses": {
+            "label": "Ver la configuración",
+            "prompt": "¿Cómo puedo ver la configuración de Arthur?"
+        },
        "stats": {
            "label": "Ver estadísticas",
            "prompt": "¿Cómo puedo ver las estadísticas sobre Arthur?"
@@ -368,10 +372,6 @@ const commandPaletteUi = {
            "label": "Habilidades",
            "prompt": "¿Cuáles son tus habilidades?"
        },
-        "stack": {
-            "label": "Stack tecnológico",
-            "prompt": "¿Qué stack tecnológico estás usando actualmente?"
-        },
        "status": {
            "label": "Estado del homelab",
            "prompt": "Vi que tienes un homelab, ¿está funcionando actualmente?"
--- a/app/components/chat/MessageContainer.vue
+++ b/app/components/chat/MessageContainer.vue
@@ -23,9 +23,7 @@ const formatted = computed(() => useDateFormat(useNow(), 'D MMMM YYYY, HH:mm', {
        class="rounded-xl mt-1 bg-sky-500 md:max-w-3/4 text-white font-medium"
        :ui="{ body: 'sm:p-2', header: 'sm:p-2', footer: 'sm:p-2' }"
      >
-        <div class="text-justify">
-          {{ message.content }}
-        </div>
+        {{ message.content }}
      </UCard>
    </div>
    <div class="opacity-0 group-hover:opacity-80 duration-500 flex text-sm italic justify-end">
@@ -57,6 +55,9 @@ const formatted = computed(() => useDateFormat(useNow(), 'D MMMM YYYY, HH:mm', {
        <div v-else-if="message.type === ChatType.THEME">
          <ToolTheme />
        </div>
+        <div v-else-if="message.type === ChatType.USES">
+          <ToolUses />
+        </div>
        <div v-else-if="message.type === ChatType.LANGUAGE">
          <ToolLanguage />
        </div>
--- a/app/components/tool/Duplicated.vue
+++ b/app/components/tool/Duplicated.vue
@@ -4,7 +4,7 @@ const { t } = useI18n({ useScope: 'local' })

 <template>
  <section class="prose dark:prose-invert">
-    <h2>{{ t('duplicated.title') }}</h2>
+    <h3>{{ t('duplicated.title') }}</h3>
    <p>{{ t('duplicated.description') }}</p>
  </section>
 </template>
--- a/app/components/tool/Uses.vue
+++ b/app/components/tool/Uses.vue
@@ -0,0 +1,37 @@
+<script lang="ts" setup>
+const { t } = useI18n({ useScope: 'local' })
+
+const { data: items } = await useAsyncData('uses', async () => await queryCollection('uses').all())
+const { data: categories } = await useAsyncData('categories', async () => await queryCollection('usesCategories').all())
+</script>
+
+<template>
+  <section>
+    <div class="prose dark:prose-invert">
+      <p>{{ t('description') }}</p>
+    </div>
+    <div v-if="items" class="space-y-12 mt-4">
+      <UsesList v-for="category in categories" :key="category.id" :title="category.name">
+        <UsesItem
+          v-for="(item, id) in items.filter(item => item.category === String(category.meta.title).toLowerCase())"
+          :key="id"
+          :item="item"
+        />
+      </UsesList>
+    </div>
+  </section>
+</template>
+
+<i18n lang="json">
+{
+  "en": {
+    "description": "Here is a comprehensive list of all the software I use, gadgets I love, and other things I recommend."
+  },
+  "fr": {
+    "description": "Voici une grande liste de tous mes logiciels que j'utilise, gadgets que j'adore et autres choses que je recommande."
+  },
+  "es": {
+    "description": "Aquí hay una gran lista de todo el software que uso, gadgets que amo y otras cosas que recomiendo."
+  }
+}
+</i18n>
--- a/app/components/uses/Item.vue
+++ b/app/components/uses/Item.vue
@@ -0,0 +1,23 @@
+<script lang="ts" setup>
+import type { UsesItem } from '#components'
+
+defineProps({
+  item: {
+    type: Object as PropType<typeof UsesItem>,
+    required: true,
+  },
+})
+
+const { locale } = useI18n()
+</script>
+
+<template>
+  <li class="prose dark:prose-invert">
+    <p class="text-base font-semibold">
+      {{ item.name }}
+    </p>
+    <p class="text-sm">
+      {{ locale === 'en' ? item.description.en : locale === 'es' ? item.description.es : item.description.fr }}
+    </p>
+  </li>
+</template>
--- a/app/components/uses/List.vue
+++ b/app/components/uses/List.vue
@@ -0,0 +1,22 @@
+<script lang="ts" setup>
+defineProps({
+  title: {
+    type: Object as PropType<{ en: string, fr: string, es: string }>,
+    required: true,
+  },
+})
+
+const { locale } = useI18n()
+</script>
+
+<template>
+  <div class="space-y-8">
+    <USeparator
+      :label="locale === 'en' ? title.en : locale === 'es' ? title.es : title.fr"
+      size="xs"
+    />
+    <ul class="space-y-8">
+      <slot />
+    </ul>
+  </div>
+</template>
--- a/app/composables/chat.ts
+++ b/app/composables/chat.ts
@@ -1,140 +1,7 @@
-import { ChatFetchState, ChatSender, ChatType } from '~~/types/chat'
+import { ChatFetchState, ChatMessages, ChatSender, ChatType } from '~~/types/chat'

 export function useChat(t: any) {
-  const messages = computed(() => {
-    return [
-      {
-        id: 'interface',
-        label: t('chat.interface'),
-        items: [
-          {
-            label: t('chat.theme.label'),
-            icon: 'i-ph-lightbulb-filament-duotone',
-            prompt: t('chat.theme.prompt'),
-            type: ChatType.THEME,
-            fetchStates: [ChatFetchState.THINKING, ChatFetchState.GENERATING],
-          },
-          {
-            label: t('chat.language.label'),
-            icon: 'i-ph-translate-duotone',
-            prompt: t('chat.language.prompt'),
-            type: ChatType.LANGUAGE,
-            fetchStates: [ChatFetchState.THINKING, ChatFetchState.GENERATING],
-          },
-        ],
-      },
-      {
-        id: 'actions',
-        label: t('chat.actions'),
-        items: [
-          {
-            label: t('chat.location.label'),
-            icon: 'i-ph-map-pin-area-duotone',
-            prompt: t('chat.location.prompt'),
-            type: ChatType.LOCATION,
-            fetchStates: [ChatFetchState.FETCHING, ChatFetchState.GENERATING],
-          },
-          {
-            label: t('chat.stats.label'),
-            icon: 'i-ph-projector-screen-chart-duotone',
-            prompt: t('chat.stats.prompt'),
-            type: ChatType.STATS,
-            fetchStates: [ChatFetchState.FETCHING, ChatFetchState.GENERATING],
-          },
-          {
-            label: t('chat.weather.label'),
-            icon: 'i-ph-cloud-rain-duotone',
-            prompt: t('chat.weather.prompt'),
-            type: ChatType.WEATHER,
-            fetchStates: [ChatFetchState.FETCHING, ChatFetchState.GENERATING],
-          },
-          {
-            label: t('chat.activity.label'),
-            icon: 'i-ph-activity',
-            prompt: t('chat.activity.prompt'),
-            type: ChatType.ACTIVITY,
-            fetchStates: [ChatFetchState.FETCHING, ChatFetchState.GENERATING],
-          },
-          {
-            label: t('chat.status.label'),
-            icon: 'i-ph-warning-duotone',
-            prompt: t('chat.status.prompt'),
-            type: ChatType.STATUS,
-            fetchStates: [ChatFetchState.FETCHING],
-          },
-        ].sort((a, b) => a.label.localeCompare(b.label)),
-      },
-      {
-        id: 'arthur',
-        label: t('chat.arthur'),
-        items: [
-          {
-            label: t('chat.credits.label'),
-            icon: 'i-ph-star-duotone',
-            prompt: t('chat.credits.prompt'),
-            type: ChatType.CREDITS,
-          },
-          {
-            label: t('chat.about.label'),
-            icon: 'i-ph-person-arms-spread-duotone',
-            prompt: t('chat.about.prompt'),
-            type: ChatType.ABOUT,
-          },
-          {
-            label: t('chat.projects.label'),
-            icon: 'i-ph-code-duotone',
-            prompt: t('chat.projects.prompt'),
-            type: ChatType.PROJECTS,
-            fetchStates: [ChatFetchState.FETCHING, ChatFetchState.GENERATING],
-          },
-          {
-            label: t('chat.writings.label'),
-            icon: 'i-ph-books-duotone',
-            prompt: t('chat.writings.prompt'),
-            type: ChatType.WRITINGS,
-            fetchStates: [ChatFetchState.FETCHING, ChatFetchState.GENERATING],
-          },
-          {
-            label: t('chat.experiences.label'),
-            icon: 'i-ph-briefcase-duotone',
-            prompt: t('chat.experiences.prompt'),
-            type: ChatType.EXPERIENCES,
-          },
-          {
-            label: t('chat.skills.label'),
-            icon: 'i-ph-rocket-duotone',
-            prompt: t('chat.skills.prompt'),
-            type: ChatType.SKILLS,
-          },
-          {
-            label: t('chat.stack.label'),
-            icon: 'i-ph-stack-duotone',
-            prompt: t('chat.stack.prompt'),
-            type: ChatType.STACK,
-          },
-          {
-            label: t('chat.resume.label'),
-            icon: 'i-ph-address-book-duotone',
-            prompt: t('chat.resume.prompt'),
-            type: ChatType.RESUME,
-          },
-          {
-            label: t('chat.contact.label'),
-            icon: 'i-ph-envelope-duotone',
-            prompt: t('chat.contact.prompt'),
-            type: ChatType.CONTACT,
-          },
-          {
-            label: t('chat.hobbies.label'),
-            icon: 'i-ph-heart-duotone',
-            prompt: t('chat.hobbies.prompt'),
-            type: ChatType.HOBBIES,
-          },
-
-        ].sort((a, b) => a.label.localeCompare(b.label)),
-      },
-    ]
-  })
+  const messages = computed(() => ChatMessages(t))

  const { addMessage, checkForDuplicateMessages, deleteMessage, cleanDuplicatedMessages } = useChatStore()

--- a/content.config.ts
+++ b/content.config.ts
@@ -1,10 +1,6 @@
 import { defineCollection, z } from '@nuxt/content'

 export const collections = {
-  main: defineCollection({
-    type: 'page',
-    source: 'home/*.md',
-  }),
  projects: defineCollection({
    type: 'page',
    source: 'projects/*.md',
@@ -32,7 +28,7 @@ export const collections = {
      tags: z.array(z.string()),
    }),
  }),
-  categories: defineCollection({
+  usesCategories: defineCollection({
    type: 'data',
    source: 'uses/categories/*.json',
    schema: z.object({
@@ -42,7 +38,6 @@ export const collections = {
        fr: z.string(),
        es: z.string(),
      }),
-      carousel: z.string().optional(),
    }),
  }),
  uses: defineCollection({
@@ -58,4 +53,17 @@ export const collections = {
      category: z.string(),
    }),
  }),
+  skills: defineCollection({
+    type: 'data',
+    source: 'skills/*.json',
+    schema: z.object({
+      name: z.string(),
+      description: z.string(),
+      items: z.object({
+        name: z.string(),
+        icon: z.string(),
+        color: z.string(),
+      }),
+    }),
+  }),
 }
--- a/content/projects/artsite.md
+++ b/content/projects/artsite.md
@@ -12,7 +12,7 @@ tags:

 [**ArtSite**](https://arthurdanjou.fr) is my personal space on the web — a portfolio, a blog, and a digital lab where I showcase my projects, write about topics I care about, and experiment with design and web technologies.

-It’s designed to be fast, accessible, and fully responsive. The site also serves as a playground to explore and test modern frontend tools.
+It's designed to be fast, accessible, and fully responsive. The site also serves as a playground to explore and test modern frontend tools.

 ### ⚒️ Tech Stack

--- a/content/projects/sevetys.md
+++ b/content/projects/sevetys.md
@@ -13,7 +13,7 @@ favorite: false

 Committed to digital innovation, Sevetys leverages centralized data systems to optimize clinic operations, improve patient data management, and enhance the overall client experience. This combination of medical excellence and operational efficiency supports veterinarians in delivering the highest quality care nationwide.

-During my two-month internship as a Data Engineer, I focused primarily on cleaning and standardizing customer and patient data — a critical task, as this data is extensively used by clinics, Marketing, and Performance teams. Ensuring data quality was therefore essential to the company’s operations.
+During my two-month internship as a Data Engineer, I focused primarily on cleaning and standardizing customer and patient data — a critical task, as this data is extensively used by clinics, Marketing, and Performance teams. Ensuring data quality was therefore essential to the company's operations.

 Additionally, I took charge of revising and enhancing an existing data quality report designed to evaluate the effectiveness of my cleaning processes. The report encompassed 47 detailed metrics assessing data completeness and consistency, providing valuable insights that helped maintain high standards across the organization.

--- a/content/skills/java.json
+++ b/content/skills/java.json
--- a/content/stack/0.programming-languages.json
+++ b/content/stack/0.programming-languages.json
@@ -0,0 +1,4 @@
+{
+  "name": "Programming",
+  "description": "Java, Python, Html, Css, JavaScript, TypeScript, SQL."
+}
--- a/content/stack/1.frontend.json
+++ b/content/stack/1.frontend.json
@@ -0,0 +1,4 @@
+{
+  "name": "FrontEnd",
+  "description": "Nuxt Stack (Framework, UI, Hub, Content, Studio), VueJS, TailwindCSS, Vite."
+}
--- a/content/stack/2.backend.json
+++ b/content/stack/2.backend.json
@@ -0,0 +1,4 @@
+{
+  "name": "BackEnd",
+  "description": "AdonisJs, Nuxt (powered by Nitro), PostgreSQL, Redis, MariaDB."
+}
--- a/content/stack/3.devops.json
+++ b/content/stack/3.devops.json
@@ -0,0 +1,4 @@
+{
+  "name": "DevOps",
+  "description": "Docker, Git, GitHub, Traefik, Proxmox, Linux."
+}
--- a/content/stack/4.python.json
+++ b/content/stack/4.python.json
@@ -0,0 +1,4 @@
+{
+  "name": "Python Frameworks",
+  "description": "Pytorch, Scikit-learn, Tensorflow, Numpy, Matplotlib, Pandas, Seaborn."
+}
--- a/content/uses/0.homelab-beelink.json
+++ b/content/uses/0.homelab-beelink.json
@@ -2,7 +2,7 @@
  "name": "Beelink EQR6 AMD Ryzen",
  "description": {
    "en": "I use my Beelink as the main server in my homelab, running Proxmox, to host self-hosted services, run Docker containers, and test open-source tools.",
-    "fr": "J’utilise mon Beelink comme premier serveur de mon homelab, avec Proxmox, pour héberger mes services en auto-hébergement, faire tourner des conteneurs Docker et tester des services open-source.",
+    "fr": "J'utilise mon Beelink comme premier serveur de mon homelab, avec Proxmox, pour héberger mes services en auto-hébergement, faire tourner des conteneurs Docker et tester des services open-source.",
    "es": "Utilizo mi Beelink como primer servidor de mi homelab, con Proxmox, para alojar servicios autogestionados, ejecutar contenedores Docker y probar herramientas de código abierto."
  },
  "category": "homelab"
--- a/content/uses/0.stack-programming-languages.json
+++ b/content/uses/0.stack-programming-languages.json
@@ -1,9 +0,0 @@
-{
-  "name": "Programming",
-  "description": {
-    "en": "Java, Python, Html, Css, JavaScript, TypeScript, SQL.",
-    "fr": "Java, Python, Html, Css, JavaScript, TypeScript, SQL.",
-    "es": "Java, Python, Html, Css, JavaScript, TypeScript, SQL."
-  },
-  "category": "stack"
-}
--- a/content/uses/1.homelab-tp-link.json
+++ b/content/uses/1.homelab-tp-link.json
@@ -2,7 +2,7 @@
  "name": "Switch TP-Link 5 ports",
  "description": {
    "en": "I use my 5-port TP-Link switch to connect my various network devices to my main server and ensure fast, stable local communication.",
-    "fr": "J’utilise mon switch TP-Link 5 ports pour connecter mes différents appareils réseau à mon serveur principal et assurer une communication locale rapide et stable.",
+    "fr": "J'utilise mon switch TP-Link 5 ports pour connecter mes différents appareils réseau à mon serveur principal et assurer une communication locale rapide et stable.",
    "es": "Utilizo mi switch TP-Link de 5 puertos para conectar mis distintos dispositivos de red a mi servidor principal y garantizar una comunicación local rápida y estable."
  },
  "category": "homelab"
--- a/content/uses/1.stack-frontend.json
+++ b/content/uses/1.stack-frontend.json
@@ -1,9 +0,0 @@
-{
-  "name": "FrontEnd",
-  "description": {
-    "en": "Nuxt Stack (Framework, UI, Hub, Content, Studio), VueJS, TailwindCSS, Vite.",
-    "fr": "Nuxt Stack (Framework, UI, Hub, Content, Studio), VueJS, TailwindCSS, Vite.",
-    "es": "Nuxt Stack (Framework, UI, Hub, Content, Studio), VueJS, TailwindCSS, Vite."
-  },
-  "category": "stack"
-}
--- a/content/uses/2.homelab-nas.json
+++ b/content/uses/2.homelab-nas.json
@@ -0,0 +1,9 @@
+{
+  "name": "UGREEN NASync DXP4800 Plus",
+  "description": {
+    "en": "I bought a UGREEN 4-bay NAS to store and manage my data centrally, while ensuring regular backups and optimal accessibility. For now, I've installed 2 8TB hard drives, but I plan to add two more drives in the future to increase storage capacity.",
+    "fr": "J'ai acheté un NAS UGreen 4 baies pour stocker et gérer mes données de manière centralisée, tout en assurant des sauvegardes régulières et une accessibilité optimale. Pour le moment, j'ai installé 2 disques durs de 8To, mais je prévois d'ajouter deux autres disques à l'avenir pour augmenter la capacité de stockage.",
+    "es": "He comprado un NAS UGreen de 4 bahías para almacenar y gestionar mis datos de manera centralizada, asegurando copias de seguridad regulares y una accesibilidad óptima. Por el momento, he instalado 2 discos duros de 8To, pero planeo agregar otros dos discos en el futuro para aumentar la capacidad de almacenamiento."
+  },
+  "category": "homelab"
+}
--- a/content/uses/2.stack-backend.json
+++ b/content/uses/2.stack-backend.json
@@ -1,9 +0,0 @@
-{
-  "name": "BackEnd",
-  "description": {
-    "en": "AdonisJs, Nuxt (powered by Nitro), PostgreSQL, Redis, MariaDB.",
-    "fr": "AdonisJs, Nuxt (powered by Nitro), PostgreSQL, Redis, MariaDB.",
-    "es": "AdonisJs, Nuxt (powered by Nitro), PostgreSQL, Redis, MariaDB."
-  },
-  "category": "stack"
-}
--- a/content/uses/3.stack-devops.json
+++ b/content/uses/3.stack-devops.json
@@ -1,9 +0,0 @@
-{
-  "name": "DevOps",
-  "description": {
-    "en": "Docker, Git, GitHub, Traefik.",
-    "fr": "Docker, Git, GitHub, Traefik.",
-    "es": "Docker, Git, GitHub, Traefik."
-  },
-  "category": "stack"
-}
--- a/content/uses/4.stack-python.json
+++ b/content/uses/4.stack-python.json
@@ -1,9 +0,0 @@
-{
-  "name": "Python Frameworks",
-  "description": {
-    "en": "Pytorch, Scikit-learn, Tensorflow, Numpy, Matplotlib, Pandas, Seaborn.",
-    "fr": "Pytorch, Scikit-learn, Tensorflow, Numpy, Matplotlib, Pandas, Seaborn.",
-    "es": "Pytorch, Scikit-learn, Tensorflow, Numpy, Matplotlib, Pandas, Seaborn."
-  },
-  "category": "stack"
-}
--- a/content/uses/apple-macbook-pro.json
+++ b/content/uses/apple-macbook-pro.json
@@ -3,7 +3,7 @@
  "description": {
    "en": "My main programming computer is a MacBook Pro 13' 2020 with the Apple M1 Chip and 16Go RAM. I use MacOS Sorona.",
    "fr": "Mon ordinateur principal pour programmer est un MacBook Pro 13' 2020 avec la puce Apple M1 et 16Go de RAM. J'utilise MacOS Sorona.",
-    "es": "Mi ordenador principal para programar es un Apple MacBook Pro 13’ 2020 con el chip Apple M1 y 16Go de Ram. Utilizo MAcOs Sorona."
+    "es": "Mi ordenador principal para programar es un Apple MacBook Pro 13' 2020 con el chip Apple M1 y 16Go de Ram. Utilizo MAcOs Sorona."
  },
  "category": "hardware"
 }
--- a/content/uses/categories/3.ide.json
+++ b/content/uses/categories/3.ide.json
@@ -4,6 +4,5 @@
    "en": "IDE & Font",
    "fr": "IDE & Police",
    "es": "IDE y Fuente"
-  },
-  "carousel": "ides"
+  }
 }
--- a/content/uses/categories/5.stack.json
+++ b/content/uses/categories/5.stack.json
@@ -1,8 +0,0 @@
-{
-  "id": "stack",
-  "name": {
-    "en": "Stack",
-    "fr": "Stack",
-    "es": "Stack"
-  }
-}
--- a/content/writings/how-my-website-works.md
+++ b/content/writings/how-my-website-works.md
@@ -60,7 +60,7 @@ Tailwind provides everything I need out of the box, but I've gradually added a b

 #### Nuxt UI

-Nuxt UI is a new tool I've been using since its release to enhance and streamline my Nuxt projects. It’s a module that offers a collection of Vue components and composables built with Tailwind CSS and Headless UI, designed to help you create beautiful and accessible user interfaces.
+Nuxt UI is a new tool I've been using since its release to enhance and streamline my Nuxt projects. It's a module that offers a collection of Vue components and composables built with Tailwind CSS and Headless UI, designed to help you create beautiful and accessible user interfaces.

 Nuxt UI aims to provide everything you need for the UI when building a Nuxt app, including components, icons, colors, dark mode, and keyboard shortcuts. It's an excellent tool for both beginners and experienced developers.

--- a/content/writings/log-lin-reg.md
+++ b/content/writings/log-lin-reg.md
@@ -144,7 +144,7 @@ Interpreting the results in logistic regression differs from linear regression d

 ### **Understanding Odds Ratios**

-In logistic regression, odds ratios provide insights into the relationship between the independent variables and the likelihood of the outcome variable belonging to the positive class. An odds ratio greater than 1 indicates that an increase in the independent variable’s value leads to higher odds of the positive outcome, while an odds ratio less than 1 suggests a decrease in the odds of the positive outcome. Additionally, odds ratios close to 1 indicate a weaker or negligible impact of the independent variable on the outcome.
+In logistic regression, odds ratios provide insights into the relationship between the independent variables and the likelihood of the outcome variable belonging to the positive class. An odds ratio greater than 1 indicates that an increase in the independent variable's value leads to higher odds of the positive outcome, while an odds ratio less than 1 suggests a decrease in the odds of the positive outcome. Additionally, odds ratios close to 1 indicate a weaker or negligible impact of the independent variable on the outcome.

 ### **Confidence Intervals and Significance**

--- a/content/writings/rag-ai-agents.md
+++ b/content/writings/rag-ai-agents.md
@@ -27,7 +27,7 @@ A **Large Language Model (LLM)** is a machine learning model trained on vast amo

 LLMs work by predicting the next token (word or part of a word) based on the input they receive. This ability allows them to generate text, summarize documents, answer questions, and even carry on conversations that seem remarkably human.

-However, LLMs have their limitations. They can sometimes generate **hallucinations** (incorrect or fabricated information), and their knowledge is **static**, meaning they can become outdated as they don’t automatically update from the web.
+However, LLMs have their limitations. They can sometimes generate **hallucinations** (incorrect or fabricated information), and their knowledge is **static**, meaning they can become outdated as they don't automatically update from the web.

 ## 3 - Messages and Tokens

@@ -101,7 +101,7 @@ Here's how it works:

 RAG solves a major problem with LLMs: the **outdated or incomplete information** they may have. By pulling in real-time data, RAG ensures that the generated content is relevant and grounded in current knowledge.

-A classic example of RAG is when you ask an AI to summarize the latest research on a particular topic. Instead of relying on the model’s static knowledge base, the model can retrieve relevant papers or articles and generate an accurate summary.
+A classic example of RAG is when you ask an AI to summarize the latest research on a particular topic. Instead of relying on the model's static knowledge base, the model can retrieve relevant papers or articles and generate an accurate summary.

 ## 7 - Synergy Between RAG and AI Agents

@@ -112,7 +112,7 @@ Here's how they complement each other:
 - **RAG** acts as an external memory or knowledge source for AI agents, providing them with up-to-date information to improve their decision-making and outputs.
 - **AI agents**, powered by LLMs, can process this information and take actions based on it, whether it's generating a response, making a decision, or interacting with other systems.

-For example, imagine an AI agent that's tasked with assisting a business in handling customer inquiries. It could use RAG to retrieve relevant customer information and FAQs, then generate a response based on that data. It might then take action by sending an email or updating a CRM system based on the customer’s query.
+For example, imagine an AI agent that's tasked with assisting a business in handling customer inquiries. It could use RAG to retrieve relevant customer information and FAQs, then generate a response based on that data. It might then take action by sending an email or updating a CRM system based on the customer's query.

 This synergy leads to **autonomous, efficient systems** that can process, reason, and act in a dynamic environment.

--- a/content/writings/what-is-machine-learning.md
+++ b/content/writings/what-is-machine-learning.md
@@ -43,7 +43,7 @@ caption: The different types of machine learning models
 ---
 ::

-With this overview of ML types, let’s now focus on supervised learning, the most widely used approach, and explore how to choose the right model.
+With this overview of ML types, let's now focus on supervised learning, the most widely used approach, and explore how to choose the right model.

 ## 3 - Three Considerations for Choosing a Supervised Learning Model

@@ -59,7 +59,7 @@ Selecting the right supervised learning model is critical and depends on several

 3. **Algorithmic Approach**
   - Should you choose a feature-based or similarity-based model?
-   - **Key Point**: The choice of the model (e.g., linear regressions vs k-NN) depends on the dataset’s size and complexity.
+   - **Key Point**: The choice of the model (e.g., linear regressions vs k-NN) depends on the dataset's size and complexity.

 Once the model type is defined, the next step is to delve into the full workflow of developing an ML model.

@@ -89,12 +89,12 @@ Evaluation is a crucial step to verify the performance of a model. For regressio

 ## 5 - Evaluating Models: The R² Score

-For regression problems, the **R² score** measures the proportion of the target’s variance explained by the model:
+For regression problems, the **R² score** measures the proportion of the target's variance explained by the model:

 $$R^2 = 1 - \frac{\text{SS}_{\text{residual}}}{\text{SS}_{\text{total}}}$$ where:

 - $$\text{SS}_{\text{residual}}$$ : Sum of squared residuals between actual and predicted values.
- $$\text{SS}_{\text{total}}$$ : Total sum of squares relative to the target’s mean.
+- $$\text{SS}_{\text{total}}$$ : Total sum of squares relative to the target's mean.

 A $$R^2$$ close to 1 indicates a good fit.

--- a/public/uses/jetbrains.webp
+++ b/public/uses/jetbrains.webp
--- a/public/uses/pycharm.webp
+++ b/public/uses/pycharm.webp
--- a/public/uses/vscode.webp
+++ b/public/uses/vscode.webp
--- a/types/chat.ts
+++ b/types/chat.ts
@@ -10,7 +10,7 @@ export enum ChatType {
  EXPERIENCES = 'experiences',
  SKILLS = 'skills',
  HOBBIES = 'hobbies',
-  STACK = 'stack',
+  USES = 'uses',
  STATUS = 'status',
  CREDITS = 'credits',
  CONTACT = 'contact',
@@ -45,3 +45,138 @@ export interface ChatMessage {
  state: ChatState
  fetchStates?: ChatFetchState[]
 }
+
+export function ChatMessages(t: any) {
+  return [
+    {
+      id: 'interface',
+      label: t('chat.interface'),
+      items: [
+        {
+          label: t('chat.theme.label'),
+          icon: 'i-ph-lightbulb-filament-duotone',
+          prompt: t('chat.theme.prompt'),
+          type: ChatType.THEME,
+          fetchStates: [ChatFetchState.THINKING, ChatFetchState.GENERATING],
+        },
+        {
+          label: t('chat.language.label'),
+          icon: 'i-ph-translate-duotone',
+          prompt: t('chat.language.prompt'),
+          type: ChatType.LANGUAGE,
+          fetchStates: [ChatFetchState.THINKING, ChatFetchState.GENERATING],
+        },
+      ],
+    },
+    {
+      id: 'actions',
+      label: t('chat.actions'),
+      items: [
+        {
+          label: t('chat.location.label'),
+          icon: 'i-ph-map-pin-area-duotone',
+          prompt: t('chat.location.prompt'),
+          type: ChatType.LOCATION,
+          fetchStates: [ChatFetchState.FETCHING, ChatFetchState.GENERATING],
+        },
+        {
+          label: t('chat.stats.label'),
+          icon: 'i-ph-projector-screen-chart-duotone',
+          prompt: t('chat.stats.prompt'),
+          type: ChatType.STATS,
+          fetchStates: [ChatFetchState.FETCHING, ChatFetchState.GENERATING],
+        },
+        {
+          label: t('chat.weather.label'),
+          icon: 'i-ph-cloud-rain-duotone',
+          prompt: t('chat.weather.prompt'),
+          type: ChatType.WEATHER,
+          fetchStates: [ChatFetchState.FETCHING, ChatFetchState.GENERATING],
+        },
+        {
+          label: t('chat.activity.label'),
+          icon: 'i-ph-activity',
+          prompt: t('chat.activity.prompt'),
+          type: ChatType.ACTIVITY,
+          fetchStates: [ChatFetchState.FETCHING, ChatFetchState.GENERATING],
+        },
+        {
+          label: t('chat.status.label'),
+          icon: 'i-ph-warning-duotone',
+          prompt: t('chat.status.prompt'),
+          type: ChatType.STATUS,
+          fetchStates: [ChatFetchState.FETCHING],
+        },
+      ].sort((a, b) => a.label.localeCompare(b.label)),
+    },
+    {
+      id: 'arthur',
+      label: t('chat.arthur'),
+      items: [
+        {
+          label: t('chat.credits.label'),
+          icon: 'i-ph-star-duotone',
+          prompt: t('chat.credits.prompt'),
+          type: ChatType.CREDITS,
+        },
+        {
+          label: t('chat.about.label'),
+          icon: 'i-ph-person-arms-spread-duotone',
+          prompt: t('chat.about.prompt'),
+          type: ChatType.ABOUT,
+        },
+        {
+          label: t('chat.projects.label'),
+          icon: 'i-ph-code-duotone',
+          prompt: t('chat.projects.prompt'),
+          type: ChatType.PROJECTS,
+          fetchStates: [ChatFetchState.FETCHING, ChatFetchState.GENERATING],
+        },
+        {
+          label: t('chat.writings.label'),
+          icon: 'i-ph-books-duotone',
+          prompt: t('chat.writings.prompt'),
+          type: ChatType.WRITINGS,
+          fetchStates: [ChatFetchState.FETCHING, ChatFetchState.GENERATING],
+        },
+        {
+          label: t('chat.experiences.label'),
+          icon: 'i-ph-briefcase-duotone',
+          prompt: t('chat.experiences.prompt'),
+          type: ChatType.EXPERIENCES,
+        },
+        {
+          label: t('chat.skills.label'),
+          icon: 'i-ph-rocket-duotone',
+          prompt: t('chat.skills.prompt'),
+          type: ChatType.SKILLS,
+        },
+        {
+          label: t('chat.resume.label'),
+          icon: 'i-ph-address-book-duotone',
+          prompt: t('chat.resume.prompt'),
+          type: ChatType.RESUME,
+        },
+        {
+          label: t('chat.contact.label'),
+          icon: 'i-ph-envelope-duotone',
+          prompt: t('chat.contact.prompt'),
+          type: ChatType.CONTACT,
+        },
+        {
+          label: t('chat.hobbies.label'),
+          icon: 'i-ph-heart-duotone',
+          prompt: t('chat.hobbies.prompt'),
+          type: ChatType.HOBBIES,
+        },
+        {
+          label: t('chat.uses.label'),
+          icon: 'i-ph-chalkboard-simple-duotone',
+          prompt: t('chat.uses.prompt'),
+          type: ChatType.USES,
+          fetchStates: [ChatFetchState.FETCHING, ChatFetchState.GENERATING],
+        },
+      ].sort((a, b) => a.label.localeCompare(b.label)),
+    },
+  ]
+}