feat: improve file upload and diplay stuff

app/components/ChatInput.vue

@@ -13,8 +13,9 @@ const files = ref<{
     id: string;
     name: string;
     mimeType: string;
-    status: 'pending' | 'uploaded';
+    status: 'uploading' | 'uploaded' | 'error';
     url: string;
+    progress: number;
 }[]>([]);
 const inputValue = defineModel<BaseMessage>({ required: false, default: { content: '', fileIds: [] } });
 const textAreaValue = ref('');
@@ -189,7 +190,7 @@ onUnmounted(() => {
     <div :class="['w-full flex max-h-full', $attrs.class]">
         <div class="relative w-full flex flex-shrink-1 flex-col gap-3 p-2 rounded-2xl border transition-border ease-in-out duration-300 bg-[var(--bg-container)]
         border-[var(--color-border)] focus-within:border-[var(--color-border-active)]">
-            <div v-if="files.length > 0" class="flex-1 flex gap-2 max-w-full max-h-24 pt-2 px-2">
+            <div v-if="files.length > 0" class="flex-1 flex gap-2 pt-2 px-2 pb-1 overflow-x-auto flex-wrap">
                 <!-- TODO: show attachment previews -->
                 <AttachmentPreview v-for="file in files" @delete="files = files.filter((f) => f.id !== file.id)"
                     :key="file.id" :file="file" />
@@ -207,9 +208,7 @@ onUnmounted(() => {
                 <!-- TODO: since we dont want to model selector dropdown to potentially overflow, it has max-width: 100%, so, we need to maake the trigger large enough to fit the entire width of the dropdown -->
                 <div class="flex flex-1 gap-1">
                     <ModelSelector v-if="providers !== undefined" v-model="selectedModel" :providers="providers" />
-                    <FileSelector
-                        v-if="selectedModel && [...selectedModel.attributes.inputModalities].filter(p => p !== 'text').length > 0"
-                        v-model="files" />
+                    <FileSelector :selected-model="selectedModel" v-model="files" />
                 </div>
                 <button aria-label="Send message" @click="handleSubmit"
                     :disabled="(!inputValue.content.trim() && files.length === 0) && !loading" :class="[