Jake Vanderwerf
2026-01-25 b38f03c0e7218762d90fa5092696b127f24f36db
assets/js/concise/Queue.js
@@ -134,6 +134,7 @@
            actions: {
               cancel: 'button.cancel',
               retry: 'button.retry',
               refresh: 'button.refresh',
               dismiss: 'button.dismiss',
            }
         },
@@ -198,6 +199,13 @@
            return;
         }
         const refreshPage = window.targetCheck(e, this.selectors.actions.refresh);
         if (refreshPage) {
            this.handleRefresh(opId);
            return;
         }
         const clear = window.targetCheck(e, this.selectors.actions.clear);
         if (clear) {
            this.opActions('completed', 'dismiss').then(()=>{});
@@ -295,22 +303,90 @@
      this.store.subscribe((event, data) => {
         switch (event) {
            case 'data-loaded':
               const serverOps = this.store.getAll();
               serverOps.forEach(serverOp => {
                  const localOp = this.queue.get(serverOp.id);
                  const mapped = this.mapServerOperation(serverOp);
                  this.queue.set(mapped.id, mapped);
                  // Notify if changed
                  if (localOp && localOp.status !== mapped.status) {
                     this.notify('operation-status', mapped);
                  }
               });
               this.maybeStartPolling();
               this.updateUI();
               break;
            case 'items-save':
               this.maybeStartPolling();
               this.updateUI();
               break;
            case 'item-saved':
               if (data.previousItem && data.previousItem.status !== data.item.status) {
                  this.updateOperationStatus(data.item.id, data.item.status);
               if (data.item) {
                  this.queue.set(data.item.id, data.item);
                  if (data.previousItem?.status !== data.item.status) {
                     this.notify('operation-status', data.item);
                  }
               }
               this.maybeStartPolling();
               break;
            default:
               break;
         }
      });
   }
   /**
    * Handle refresh button click - clears cache for the relevant store
    */
   handleRefresh(opId) {
      const op = this.getQueue(opId);
      if (!op) return;
      // Determine which store to refresh based on operation type
      let storeName = null;
      // Map operation types to store names
      const typeToStore = {
         'content_update': op.data?.posts ? Object.values(op.data.posts)[0]?.content : null,
         'batch_creation': op.data?.content,
         'image_upload': 'uploads',
         'video_upload': 'uploads',
         'document_upload': 'uploads',
      };
      storeName = typeToStore[op.type];
      // If we found a store name, clear its cache
      if (storeName && window.jvbStore) {
         const store = window.jvbStore.stores.get(storeName);
         if (store) {
            window.jvbStore.clearCache(storeName);
            window.jvbStore.fetch(storeName);
            // Give visual feedback
            const button = this.items.get(opId)?.ui?.actions?.refresh;
            if (button) {
               const originalText = button.querySelector('span').textContent;
               button.querySelector('span').textContent = 'Refreshed!';
               button.disabled = true;
               setTimeout(() => {
                  button.querySelector('span').textContent = originalText;
                  button.disabled = false;
               }, 2000);
            }
         }
      } else {
         // Fallback: just reload the page if we can't determine the store
         if (confirm('Refresh the page to see changes?')) {
            window.location.reload();
         }
      }
   }
   /****************************************************************************
    OPERATIONS
   ****************************************************************************/
@@ -356,14 +432,16 @@
      const existingOps = Array.from(this.getAllQueue()).filter(op=> {
         return op.status === 'queued' &&
         op.endpoint === item.endpoint &&
         op.canMerge
            op.endpoint === item.endpoint &&
            op.canMerge
      });
      if (existingOps.length > 0) {
         const existing = existingOps[0];
         existing.data = window.deepMerge(existing.data, item.data);
         existing.timestamp = Date.now();
         this.setQueue(existing);
         this.updateOperationStatus(existing.id, existing.status);
         this.updateUI();
         this.trackActivity();
@@ -844,6 +922,9 @@
            item.ui.actions['retry'].hidden = op.status !=='failed';
         }
         if (item.ui.actions.dismiss) item.ui.actions.dismiss.hidden = this.pendingStatuses.includes(op.status);
         if (item.ui.actions.refresh) {
            item.ui.actions.refresh.hidden = op.status !== 'completed';
         }
      }
      getProgress(op) {
         if (op.progress) return op.progress;
@@ -901,7 +982,7 @@
         case 'processing':
            return item.progress ? `${item.progress}% complete` : 'Processing...';
         case 'completed':
            return 'Successfully completed';
            return 'Successfully completed. Refresh to see changes.';
         case 'failed':
            return `Failed: ${item.lastError || 'Unknown error'} (Retry ${item.retries}/${2})`;
         case 'failed_permanent':
@@ -919,6 +1000,38 @@
      this.isProcessing = on;
      this.ui.toggle.button.classList.toggle('saving', on);
   }
   /**
    * Map server operation format to frontend format
    * Server uses: type, data (requestData), status (from state/outcome)
    * Frontend uses: endpoint, data, status, headers, method, etc.
    */
   mapServerOperation(serverOp) {
      const localOp = this.queue.get(serverOp.id);
      // If we have local operation data, preserve it
      if (localOp && localOp.endpoint) {
         return {
            ...localOp,
            ...serverOp,
            endpoint: localOp.endpoint,
            method: localOp.method,
            headers: localOp.headers,
         };
      }
      // Minimal mapping for server-only operations
      // Extract endpoint from type if possible, otherwise use type
      const endpoint = serverOp.type ? serverOp.type.replace('_update', '').replace('_', '/') : 'unknown';
      return {
         ...serverOp,
         endpoint: endpoint,
         method: 'POST',
         headers: { ...this.headers },
      };
   }
   /****************************************************************************
    SUBSCRIPTION
    ****************************************************************************/