@xuda.io/xuda-widget-plugin-xuda-drive 1.0.136 → 1.0.138

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@xuda.io/xuda-widget-plugin-xuda-drive",
-  "version": "1.0.136",
+  "version": "1.0.138",
   "description": "Xuda Drive widget plugin",
   "scripts": {
     "pub": "npm version patch --force && npm publish  --access public",

package/src/runtime.mjs

@@ -796,27 +796,60 @@ export async function viewer(fields, e) {
             </div>
 
             <!-- Upload job window (Google Drive style) -->
-            <div v-if="uploadJobs.length" class="fixed bottom-4 right-4 z-[100] w-96 bg-white rounded-lg shadow-2xl border border-neutral-200 overflow-hidden" style="font-family: system-ui, -apple-system, sans-serif;">
+            <div v-if="uploadJobs.length || checkingFiles" class="fixed bottom-4 right-4 z-[100] w-96 bg-white rounded-lg shadow-2xl border border-neutral-200 overflow-hidden" style="font-family: system-ui, -apple-system, sans-serif;">
               <!-- Header -->
               <div class="flex items-center justify-between px-4 py-3 bg-neutral-900 text-white cursor-pointer" @click="jobWindowCollapsed = !jobWindowCollapsed">
                 <div class="font-medium text-sm">
-                  <template v-if="uploadsInProgress > 0">Uploading {{ uploadsInProgress }} item{{ uploadsInProgress > 1 ? 's' : '' }}</template>
-                  <template v-else>{{ uploadJobs.length }} upload{{ uploadJobs.length > 1 ? 's' : '' }} complete</template>
+                  <template v-if="checkingFiles">Checking {{ checkingFilesCount }} file{{ checkingFilesCount > 1 ? 's' : '' }}</template>
+                  <template v-else-if="uploadsInProgress > 0">Uploading {{ uploadsInProgress }} item{{ uploadsInProgress > 1 ? 's' : '' }}</template>
+                  <template v-else>
+                    {{ uploadsDone }} uploaded<template v-if="uploadsFailed">, {{ uploadsFailed }} failed</template>
+                  </template>
                 </div>
                 <div class="flex items-center gap-2">
                   <button @click.stop="jobWindowCollapsed = !jobWindowCollapsed" class="text-white/70 hover:text-white">
                     <svg :class="{ 'rotate-180': jobWindowCollapsed }" class="w-5 h-5 transition-transform" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" d="M19.5 8.25l-7.5 7.5-7.5-7.5" /></svg>
                   </button>
-                  <button v-if="uploadsInProgress === 0" @click.stop="uploadJobs = []" class="text-white/70 hover:text-white">
+                  <button v-if="uploadsInProgress === 0 && !checkingFiles" @click.stop="uploadJobs = []" class="text-white/70 hover:text-white">
                     <svg class="w-5 h-5" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" d="M6 18L18 6M6 6l12 12" /></svg>
                   </button>
                 </div>
               </div>
+              <!-- Failed summary bar -->
+              <div v-if="uploadsFailed > 0 && uploadsInProgress === 0 && !jobWindowCollapsed" class="flex items-center justify-between px-4 py-2 bg-red-50 border-b border-red-100">
+                <div class="flex items-center gap-2 text-red-600 text-sm font-medium">
+                  <svg class="w-4 h-4" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor"><path fill-rule="evenodd" d="M12 2.25c-5.385 0-9.75 4.365-9.75 9.75s4.365 9.75 9.75 9.75 9.75-4.365 9.75-9.75S17.385 2.25 12 2.25zm-1.72 6.97a.75.75 0 10-1.06 1.06L10.94 12l-1.72 1.72a.75.75 0 101.06 1.06L12 13.06l1.72 1.72a.75.75 0 101.06-1.06L13.06 12l1.72-1.72a.75.75 0 10-1.06-1.06L12 10.94l-1.72-1.72z" clip-rule="evenodd" /></svg>
+                  {{ uploadsFailed }} failed
+                </div>
+                <div class="flex items-center gap-1.5">
+                  <!-- Navigate up/down between failed items -->
+                  <button @click.stop="navigateFailed(-1)" class="p-0.5 rounded hover:bg-red-100 text-red-500 transition-colors">
+                    <svg class="w-4 h-4" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" d="M4.5 15.75l7.5-7.5 7.5 7.5" /></svg>
+                  </button>
+                  <button @click.stop="navigateFailed(1)" class="p-0.5 rounded hover:bg-red-100 text-red-500 transition-colors">
+                    <svg class="w-4 h-4" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" d="M19.5 8.25l-7.5 7.5-7.5-7.5" /></svg>
+                  </button>
+                  <!-- Retry all failed -->
+                  <button @click.stop="retryAllFailed" class="text-xs text-red-600 hover:text-red-800 font-medium px-2 py-1 rounded hover:bg-red-100 transition-colors">
+                    Retry all
+                  </button>
+                </div>
+              </div>
               <!-- File list -->
-              <div v-show="!jobWindowCollapsed" class="max-h-64 overflow-y-auto divide-y divide-neutral-100">
-                <div v-for="job in uploadJobs" :key="job.id" class="flex items-center gap-3 px-4 py-2.5">
+              <div v-show="!jobWindowCollapsed" ref="jobListRef" class="max-h-64 overflow-y-auto divide-y divide-neutral-100">
+                <!-- Checking files row -->
+                <div v-if="checkingFiles" class="flex items-center gap-3 px-4 py-2.5">
+                  <div class="shrink-0">
+                    <sepcial-loader class="size-5 text-neutral-500" />
+                  </div>
+                  <div class="flex-1 min-w-0">
+                    <div class="text-sm">Checking {{ checkingFilesCount }} file{{ checkingFilesCount > 1 ? 's' : '' }} for duplicates...</div>
+                  </div>
+                </div>
+                <!-- Upload jobs -->
+                <div v-for="job in uploadJobs" :key="job.id" :ref="'job-' + job.id" class="flex items-center gap-3 px-4 py-2.5">
                   <div class="shrink-0">
-                    <!-- Upload icon -->
+                    <!-- Uploading spinner -->
                     <svg v-if="job.status === 'uploading'" class="w-5 h-5 text-neutral-400" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" d="M3 16.5v2.25A2.25 2.25 0 005.25 21h13.5A2.25 2.25 0 0021 18.75V16.5m-13.5-9L12 3m0 0l4.5 4.5M12 3v13.5" /></svg>
                     <!-- Success icon -->
                     <svg v-else-if="job.status === 'done'" class="w-5 h-5 text-green-500" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor"><path fill-rule="evenodd" d="M2.25 12c0-5.385 4.365-9.75 9.75-9.75s9.75 4.365 9.75 9.75-4.365 9.75-9.75 9.75S2.25 17.385 2.25 12zm13.36-1.814a.75.75 0 10-1.22-.872l-3.236 4.53L9.53 12.22a.75.75 0 00-1.06 1.06l2.25 2.25a.75.75 0 001.14-.094l3.75-5.25z" clip-rule="evenodd" /></svg>
@@ -830,8 +863,12 @@ export async function viewer(fields, e) {
                       <div class="h-full bg-blue-500 rounded-full transition-all duration-300" :style="{ width: job.progress + '%' }"></div>
                     </div>
                   </div>
-                  <div class="shrink-0 text-xs text-neutral-400">
-                    <span v-if="job.status === 'uploading'">{{ Math.round(job.progress) }}%</span>
+                  <div class="shrink-0 flex items-center gap-1">
+                    <span v-if="job.status === 'uploading'" class="text-xs text-neutral-400">{{ Math.round(job.progress) }}%</span>
+                    <!-- Retry button for failed uploads -->
+                    <button v-if="job.status === 'error'" @click.stop="retryUpload(job)" class="text-xs text-blue-500 hover:text-blue-700 font-medium px-1.5 py-0.5 rounded hover:bg-blue-50 transition-colors">
+                      Retry
+                    </button>
                   </div>
                 </div>
               </div>
@@ -966,6 +1003,9 @@ export async function viewer(fields, e) {
         uploadJobs: [],
         jobWindowCollapsed: false,
         pendingFiles: [],
+        checkingFiles: false,
+        checkingFilesCount: 0,
+        failedNavIndex: -1,
         searchOptions: [
           {
             label: 'Filename',
@@ -1054,6 +1094,9 @@ export async function viewer(fields, e) {
       },
       checkAndUpload() {
         this.existingFiles = {};
+        this.checkingFiles = true;
+        this.checkingFilesCount = this.pendingFiles.length;
+        this.jobWindowCollapsed = false;
         var file_paths = this.pendingFiles.map((f) => '/' + f.name);
 
         this.fetcher('check_drive_files_workspace', {
@@ -1061,10 +1104,12 @@ export async function viewer(fields, e) {
           type: 'file',
         })
           .then(() => {
+            this.checkingFiles = false;
             // No conflicts — upload all
             this.startUpload(false);
           })
           .catch((err) => {
+            this.checkingFiles = false;
             if (err.code === -764) {
               (err.files || []).forEach((file, index) => {
                 if (file.code === -764) {
@@ -1094,16 +1139,19 @@ export async function viewer(fields, e) {
 
         filesToUpload.forEach((file) => {
           const jobId = crypto.randomUUID();
+          const isUpdate = this.overrideAction === 'replace' && file.name in this.existingFiles;
           this.uploadJobs.push({
             id: jobId,
             name: file.name,
             progress: 0,
             status: 'uploading',
+            file: file,
+            isUpdate: isUpdate,
           });
-          this.uploadSingleFile(file, jobId);
+          this.uploadSingleFile(file, jobId, isUpdate);
         });
       },
-      uploadSingleFile(file, jobId) {
+      uploadSingleFile(file, jobId, isUpdate) {
         let formData = new FormData();
         formData.append('file', file, file.name);
 
@@ -1134,7 +1182,7 @@ export async function viewer(fields, e) {
           _domain = e._session.opt.regional_server === 'dev.xuda.ai' ? 'dev.xuda.ai' : 'xuda.ai';
         }
 
-        if (this.overrideAction === 'replace' && file.name in this.existingFiles) {
+        if (isUpdate) {
           formData.append('file_path', '/' + file.name);
           formData.append('file_name', file.name);
           request.open('POST', 'https://' + _domain + '/cpi/update_drive_file_workspace');
@@ -1174,10 +1222,36 @@ export async function viewer(fields, e) {
         request.onerror = () => {
           const job = this.uploadJobs.find((j) => j.id === jobId);
           if (job) job.status = 'error';
+          if (this.uploadsInProgress === 0) {
+            this.refreshDirectory(false, true);
+          }
         };
 
         request.send(formData);
       },
+      retryUpload(job) {
+        job.status = 'uploading';
+        job.progress = 0;
+        this.uploadSingleFile(job.file, job.id, job.isUpdate);
+      },
+      retryAllFailed() {
+        this.uploadJobs.filter(j => j.status === 'error').forEach(job => {
+          this.retryUpload(job);
+        });
+      },
+      navigateFailed(direction) {
+        const failedJobs = this.uploadJobs.filter(j => j.status === 'error');
+        if (!failedJobs.length) return;
+        this.failedNavIndex = (this.failedNavIndex + direction + failedJobs.length) % failedJobs.length;
+        const targetJob = failedJobs[this.failedNavIndex];
+        const refEl = this.$refs['job-' + targetJob.id];
+        const el = Array.isArray(refEl) ? refEl[0] : refEl;
+        if (el && this.$refs.jobListRef) {
+          el.scrollIntoView({ behavior: 'smooth', block: 'center' });
+          el.classList.add('bg-red-50');
+          setTimeout(() => el.classList.remove('bg-red-50'), 1500);
+        }
+      },
 
       removeLastSearch($event) {
         if (!$event.target.value) {
@@ -1224,6 +1298,12 @@ export async function viewer(fields, e) {
       uploadsInProgress() {
         return this.uploadJobs.filter((j) => j.status === 'uploading').length;
       },
+      uploadsDone() {
+        return this.uploadJobs.filter(j => j.status === 'done').length;
+      },
+      uploadsFailed() {
+        return this.uploadJobs.filter(j => j.status === 'error').length;
+      },
       acceptTypes() {
         if (fields.file_upload_mime_type_preset) {
           switch (fields.file_upload_mime_type_preset) {