arthur/artchat
1
0
Fork 0
mirror of https://github.com/ArthurDanjou/artchat.git synced 2026-02-11 06:07:10 +01:00
Code Issues Packages Projects Releases Wiki Activity

feat: add VSCode settings for improved development experience; remove Typing component and adjust layout in MessageContainer and index pages

Browse Source
This commit is contained in:
Arthur Danjou
2025-09-03 13:37:42 +02:00
parent 3e7aaba2f3
commit 5d9b1080dd
4 changed files with 26 additions and 40 deletions
Download Patch File Download Diff File Expand all files Collapse all files

20
.vscode/settings.json vendored Normal file
View File

@@ -0,0 +1,20 @@
{
"todo-tree.tree.scanMode": "workspace only",
"todo-tree.tree.disableCompactFolders": false,
"todo-tree.tree.showCountsInTree": false,
"todo-tree.tree.showBadges": true,
"files.associations": {
"*.css": "tailwindcss"
},
"editor.quickSuggestions": {
"strings": "on"
},
"tailwindCSS.classAttributes": ["class", "ui"],
"tailwindCSS.experimental.classRegex": [
["ui:\\s*{([^)]*)\\s*}", "(?:'|\"|`)([^']*)(?:'|\"|`)"]
],
"i18n-ally.localesPaths": [
"locales"
],
"i18n-ally.keystyle": "nested"
}

10
app/components/chat/MessageContainer.vue
View File

@@ -14,8 +14,8 @@ const formatted = computed(() => useDateFormat(useNow(), 'D MMMM YYYY, HH:mm', {
</script> </script>
<template> <template>
<div v-if="!isArthur" class="group flex flex-col gap-4"> <div v-if="!isArthur" class="group flex flex-col gap-2">
<div class="flex flex-col-reverse gap-4 md:flex-row-reverse items-end"> <div class="flex flex-col-reverse md:flex-row-reverse items-end">
<UCard <UCard
variant="solid" variant="solid"
class="rounded-xl mt-1 bg-sky-500 md:max-w-3/4 text-white font-medium" class="rounded-xl mt-1 bg-sky-500 md:max-w-3/4 text-white font-medium"
@@ -24,12 +24,12 @@ const formatted = computed(() => useDateFormat(useNow(), 'D MMMM YYYY, HH:mm', {
{{ t(message.content || '') }} {{ t(message.content || '') }}
</UCard> </UCard>
</div> </div>
<div class="opacity-0 group-hover:opacity-80 duration-500 flex text-sm italic justify-end"> <div class="opacity-0 group-hover:opacity-80 duration-500 flex text-xs italic justify-end">
{{ formatted }} {{ formatted }}
</div> </div>
</div> </div>
<div v-else class="group space-y-2"> <div v-else class="group space-y-2">
<div class="flex flex-col-reverse gap-4 items-start md:flex-row-reverse"> <div class="flex flex-col-reverse gap-2 items-start md:flex-row-reverse">
<UCard <UCard
v-if="message.state === ChatState.LOADING && message.fetchStates && message.fetchStates.length > 0" v-if="message.state === ChatState.LOADING && message.fetchStates && message.fetchStates.length > 0"
variant="soft" variant="soft"
@@ -83,7 +83,7 @@ const formatted = computed(() => useDateFormat(useNow(), 'D MMMM YYYY, HH:mm', {
<span class="md:hidden">Arthur DANJOU</span> <span class="md:hidden">Arthur DANJOU</span>
</div> </div>
</div> </div>
<div class="opacity-0 group-hover:opacity-80 duration-500 flex text-sm italic justify-start ml-12"> <div class="opacity-0 group-hover:opacity-80 duration-500 flex text-xs italic justify-start ml-12">
{{ formatted }} {{ formatted }}
</div> </div>
</div> </div>

34
app/components/chat/Typing.vue
View File

@@ -1,34 +0,0 @@
<script setup lang="ts">
const children = ref<HTMLElement[]>([])
const shown = ref<HTMLElement[]>([])
const container = ref<HTMLElement | null>(null)
onMounted(async () => {
if (!container.value)
return
children.value = Array.from(container.value.children) as HTMLElement[]
for (const child of children.value) {
shown.value.push(child)
await new Promise(resolve => setTimeout(resolve, 400))
}
})
</script>
<template>
<div>
<div ref="container" class="hidden">
<slot />
</div>
<div>
<component
:is="el.tagName.toLowerCase()"
v-for="(el, index) in shown"
:key="index"
v-html="el.innerHTML"
/>
</div>
</div>
</template>

2
app/pages/index.vue
View File

@@ -38,7 +38,7 @@ watch(
}" }"
/> />
<ChatMain /> <ChatMain />
<div ref="parents" class="space-y-8 my-16 md:my-32"> <div ref="parents" class="space-y-4 my-32">
<ChatMessageContainer <ChatMessageContainer
v-motion v-motion
:initial="{ :initial="{