fix: remove send files functionality

app/components/MediaUploader.vue

@@ -1,169 +0,0 @@
-<script setup lang="ts">
-interface Props {
-  modelValue?: File[]
-  maxFiles?: number
-  acceptedTypes?: string
-  maxFileSize?: number // in MB
-  disabled?: boolean
-}
-
-interface Emits {
-  (e: 'update:modelValue', files: File[]): void
-}
-
-const props = withDefaults(defineProps<Props>(), {
-  modelValue: () => [],
-  maxFiles: 5,
-  acceptedTypes: 'image/*,video/*',
-  maxFileSize: 50,
-  disabled: false
-})
-
-const emit = defineEmits<Emits>()
-
-const fileInputRef = ref<HTMLInputElement>()
-const isDragging = ref(false)
-const error = ref('')
-
-const files = computed({
-  get: () => props.modelValue || [],
-  set: (value) => emit('update:modelValue', value)
-})
-
-const handleFilesSelected = (selectedFiles: FileList | null) => {
-  if (!selectedFiles) return
-  error.value = ''
-
-  const newFiles = Array.from(selectedFiles)
-  
-  if (files.value.length + newFiles.length > props.maxFiles) {
-    error.value = `Massimo ${props.maxFiles} file consentiti`
-    return
-  }
-
-  for (const file of newFiles) {
-    if (file.size > props.maxFileSize! * 1024 * 1024) {
-      error.value = `Il file ${file.name} supera il limite di ${props.maxFileSize}MB`
-      return
-    }
-  }
-
-  files.value = [...files.value, ...newFiles]
-}
-
-const removeFile = (index: number) => {
-  files.value.splice(index, 1)
-}
-
-const openFileDialog = () => {
-  fileInputRef.value?.click()
-}
-
-const formatFileSize = (bytes: number): string => {
-  const mb = Math.round(bytes / (1024 * 1024) * 10) / 10
-  return mb > 0 ? `${mb}MB` : 'Piccolo'
-}
-
-const getFileUrl = (file: File) => {
-  return URL.createObjectURL(file)
-}
-</script>
-
-<template>
-  <div class="media-uploader">
-    <div
-      class="upload-area border-2 border-dashed rounded-3 p-4 text-center cursor-pointer position-relative"
-      :class="{ 'border-primary bg-primary bg-opacity-10': isDragging, 'bg-light': !isDragging }"
-      @dragover.prevent="isDragging = true"
-      @dragleave.prevent="isDragging = false"
-      @drop.prevent="isDragging = false; handleFilesSelected(($event as DragEvent).dataTransfer?.files || null)"
-      @click="!disabled && openFileDialog()"
-    >
-      <BIIcon name="it-upload" size="xl" color="primary" class="mb-3" />
-      <div class="h6 font-weight-bold">
-        Trascina i file qui o <span class="text-primary text-decoration-underline">clicca per selezionare</span>
-      </div>
-      <small class="text-muted d-block mt-2">
-        Massimo {{ maxFiles }} file ({{ maxFileSize }}MB max per file). Tipi: {{ acceptedTypes }}
-      </small>
-    </div>
-
-    <input
-      ref="fileInputRef"
-      type="file"
-      :multiple="maxFiles > 1"
-      :accept="acceptedTypes"
-      :disabled="disabled"
-      class="d-none"
-      @change="handleFilesSelected(($event.target as HTMLInputElement).files)"
-    />
-
-    <div v-if="error" class="alert alert-danger mt-3 py-2 small" role="alert">
-      {{ error }}
-    </div>
-
-    <div v-if="files.length > 0" class="mt-4 row g-3">
-      <div v-for="(file, idx) in files" :key="`file-${idx}`" class="col-6 col-md-4 col-lg-3">
-        <div class="card h-100 position-relative shadow-sm border-0">
-          <div class="ratio ratio-1x1 bg-light rounded-top overflow-hidden">
-            <img v-if="file.type.startsWith('image/')" :src="getFileUrl(file)" class="object-fit-cover" :alt="file.name" />
-            <video v-else-if="file.type.startsWith('video/')" :src="getFileUrl(file)" class="object-fit-cover"></video>
-            <div v-else class="d-flex align-items-center justify-content-center bg-secondary bg-opacity-25">
-              <BIIcon name="it-file" size="xl" color="secondary" />
-            </div>
-          </div>
-          
-          <button
-            type="button"
-            class="btn btn-danger btn-sm position-absolute top-0 end-0 m-1 rounded-circle p-1 d-flex align-items-center justify-content-center shadow"
-            style="width: 28px; height: 28px; z-index: 10;"
-            @click.stop="removeFile(idx)"
-            :disabled="disabled"
-            title="Rimuovi file"
-          >
-            <BIIcon name="it-close" size="sm" color="white" />
-          </button>
-          
-          <div class="card-body p-2 d-flex flex-column justify-content-between">
-            <div class="small text-truncate fw-semibold" :title="file.name">{{ file.name }}</div>
-            <div class="small text-muted d-flex justify-content-between align-items-center mt-1">
-              <span>{{ formatFileSize(file.size) }}</span>
-              <div class="progress flex-grow-1 ms-2" style="height: 4px;" title="Pronto per l'upload">
-                <div class="progress-bar bg-success w-100" role="progressbar"></div>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-    </div>
-  </div>
-</template>
-
-<style scoped>
-.upload-area {
-  transition: all 0.2s ease-in-out;
-}
-.upload-area:hover:not(.border-primary) {
-  background-color: #f8f9fa !important;
-  border-color: #0066cc !important;
-}
-.cursor-pointer {
-  cursor: pointer;
-}
-.border-dashed {
-  border-style: dashed !important;
-}
-.border-2 {
-  border-width: 2px !important;
-}
-.object-fit-cover {
-  object-fit: cover;
-  width: 100%;
-  height: 100%;
-}
-</style>
-
-
-
-
-

app/components/MessageComposer.vue

@@ -1,21 +1,20 @@
 <script setup lang="ts">
+import { ref } from 'vue'
+
 interface Emits {
-  (e: 'send', message: string, files: File[]): void
+  (e: 'send', message: string): void
 }
 
 const emit = defineEmits<Emits>()
 
 const message = ref('')
 const isSubmitting = ref(false)
-const files = ref<File[]>([])
-const fileInputRef = ref<HTMLInputElement>()
 
 const handleSubmit = () => {
-  if (message.value.trim() === '' && files.value.length === 0) return
+  if (message.value.trim() === '') return
 
-  emit('send', message.value, [...files.value])
+  emit('send', message.value)
   message.value = ''
-  files.value = []
 }
 
 const handleKeydown = (e: KeyboardEvent) => {
@@ -24,55 +23,13 @@ const handleKeydown = (e: KeyboardEvent) => {
     handleSubmit()
   }
 }
-
-const handleFileSelect = (e: Event) => {
-  const target = e.target as HTMLInputElement
-  if (target.files) {
-    const newFiles = Array.from(target.files)
-    files.value = [...files.value, ...newFiles].slice(0, 5) // max 5
-  }
-  if (fileInputRef.value) {
-    fileInputRef.value.value = ''
-  }
-}
-
-const removeFile = (idx: number) => {
-  files.value.splice(idx, 1)
-}
 </script>
 
 <template>
   <div class="message-composer mt-3">
     <form @submit.prevent="handleSubmit">
 
-      <div v-if="files.length > 0" class="message-files mb-3">
-        <div v-for="(file, idx) in files" :key="idx" class="message-file-chip">
-          <BIIcon name="it-clip" size="xs" />
-          <span class="text-truncate file-name">{{ file.name }}</span>
-          <button type="button" class="btn-close btn-close-sm" @click="removeFile(idx)" aria-label="Rimuovi allegato"></button>
-        </div>
-      </div>
-
       <div class="d-flex align-items-stretch gap-2">
-        <input
-            ref="fileInputRef"
-            type="file"
-            multiple
-            class="d-none"
-            @change="handleFileSelect"
-            accept="image/*,video/*,.pdf,.doc,.docx"
-        />
-
-        <button
-            type="button"
-            class="btn btn-outline-primary btn-square flex-shrink-0"
-            title="Allega file"
-            @click="fileInputRef?.click()"
-            :disabled="isSubmitting || files.length >= 5"
-        >
-          <BIIcon name="it-clip" size="sm" />
-        </button>
-
         <textarea
             v-model="message"
             class="form-control chat-textarea m-0"
@@ -84,16 +41,16 @@ const removeFile = (idx: number) => {
         <button
             type="submit"
             class="btn btn-primary btn-square flex-shrink-0"
-            :disabled="isSubmitting || (message.trim() === '' && files.length === 0)"
+            :disabled="isSubmitting || message.trim() === ''"
             title="Invia"
         >
           <span v-if="isSubmitting" class="spinner-border spinner-border-sm" role="status" aria-hidden="true"></span>
-          <BIIcon v-else name="it-arrow-right" size="sm" color="white" />
+          <BIIcon v-else color="white" name="it-arrow-right" size="sm"/>
         </button>
       </div>
 
       <small class="text-muted d-block mt-2">
-        `Ctrl` + `Invio` per inviare. Fino a 5 allegati.
+        `Ctrl` + `Invio` per inviare.
       </small>
     </form>
   </div>
@@ -105,31 +62,6 @@ const removeFile = (idx: number) => {
   padding-top: 1rem;
 }
 
-.message-files {
-  display: flex;
-  flex-wrap: wrap;
-  gap: 0.5rem;
-}
-
-.message-file-chip {
-  align-items: center;
-  background: #fff;
-  border: 1px solid #d9e3ee;
-  border-radius: 4px;
-  display: inline-flex;
-  gap: 0.5rem;
-  max-width: 100%;
-  padding: 0.4rem 0.75rem;
-}
-
-.file-name {
-  max-width: 14rem;
-}
-
-.btn-close-sm {
-  font-size: 0.55rem;
-}
-
 .chat-textarea {
   resize: none !important;
   height: 48px;
@@ -154,4 +86,4 @@ const removeFile = (idx: number) => {
   justify-content: center;
   border-radius: 6px;
 }
-</style>
+</style>