feat: add credits component and update localization for multiple languages

app/components/chat/MessageFromArthur.vue

@@ -3,6 +3,7 @@ import type { ChatMessage } from '~~/types'
 import { ChatState, ChatType } from '~~/types'
 import ToolActivity from '~/components/tool/Activity.vue'
 import ToolContact from '~/components/tool/Contact.vue'
+import ToolCredits from '~/components/tool/Credits.vue'
 import ToolDuplicated from '~/components/tool/Duplicated.vue'
 import ToolHobbies from '~/components/tool/Hobbies.vue'
 import ToolLanguage from '~/components/tool/Language.vue'
@@ -44,7 +45,7 @@ const componentMap: Record<ChatType, Component | undefined> = {
   [ChatType.ABOUT]: undefined,
   [ChatType.EXPERIENCES]: undefined,
   [ChatType.STATUS]: undefined,
-  [ChatType.CREDITS]: undefined,
+  [ChatType.CREDITS]: ToolCredits,
   [ChatType.RESUME]: undefined,
 }
 

app/components/tool/Credits.vue

@@ -0,0 +1,55 @@
+<script lang="ts" setup>
+const { t } = useI18n()
+
+const year = ref(useNow().value.getFullYear())
+</script>
+
+<template>
+  <section class="prose dark:prose-invert">
+    <i18n-t keypath="tool.credits.made">
+      <template #nuxt>
+        <UButton
+          label="Nuxt Stack (Core, UI, I18n, Content)"
+          trailing-icon="i-logos-nuxt-icon"
+          variant="link"
+          to="https://nuxt.com"
+          target="_blank"
+          class="px-0"
+        />
+      </template>
+      <template #vercel>
+        <UButton
+          label="Vercel"
+          trailing-icon="i-logos-vercel-icon"
+          variant="link"
+          to="https://vercel.com"
+          target="_blank"
+          class="px-0"
+        />
+      </template>
+    </i18n-t>
+    <p>{{ t('tool.credits.heart') }}</p>
+    <i18n-t keypath="tool.credits.chat" tag="p">
+      <template #chat>
+        <UTooltip
+          arrow
+          :content="{
+            position: 'bottom',
+            sideOffset: 0,
+          }"
+          :delay-duration="0"
+          :text="t('tool.credits.tooltip')"
+        >
+          <strong>ArtChat</strong>
+        </UTooltip>
+      </template>
+    </i18n-t>
+    <p>{{ t('tool.credits.thank') }}</p>
+    <p>{{ t('tool.credits.message') }}</p>
+    <i18n-t keypath="tool.credits.copyrights" tag="p">
+      <template #year>
+        {{ year }}
+      </template>
+    </i18n-t>
+  </section>
+</template>