Function updateParentModelGroupThumbnailCarousel

renderer.js:19274–19343

(thumbnailWrap, imageElement, thumbnails)

  bar.appendChild(favBtn);
  updateEngagementBarDisplay(bar, rating, favorite);

  return bar;
}

// Helper function to create a DOM element for a model item
function createModelItem(model, viewMode = null, thumbPriority = THUMB_PRIORITY_BACKGROUND) {
  const view = viewMode || currentGridView;
  const item = document.createElement('div');
  item.className = `file-item file-item-${view}`;
  item.dataset.filepath = model.filePath;

  if (isInSelectedModels(model.filePath)) {
    item.classList.add('selected');
  }

  // Print status element
  const printStatus = document.createElement('div');
  printStatus.className = 'print-status' + (model.printed ? ' printed' : '');
  printStatus.textContent = model.printed ? 'Printed' : 'Not Printed';
  printStatus.style.cursor = 'pointer';
  printStatus.title = 'Click to toggle printed status';
  
  // Add click handler to toggle printed status
  printStatus.addEventListener('click', async (e) => {
    e.preventDefault();
    e.stopPropagation(); // Prevent triggering file item click
    
    // Get current model state to ensure we have the latest printed status
    const currentModel = await window.electron.getModel(model.filePath);
    if (currentModel) {
      const newPrintedStatus = !currentModel.printed;
      await autoSaveModel('printed', newPrintedStatus, model.filePath);
    }
  });
  
  item.appendChild(printStatus);

  // Archive status element (for models inside ZIP archives)
  const isZipEntry = model.filePath && model.filePath.includes('::');
  let archiveStatus = null;
  if (isZipEntry) {
    archiveStatus = document.createElement('div');
    archiveStatus.className = 'archive-status';
    archiveStatus.textContent = 'Archive';
    item.appendChild(archiveStatus);
  }

  // Define thumbnail sizes based on view mode (optimized)
  const previewPx = view === 'preview' ? getPreviewTileSizePx() : 0;
  const thumbnailSizes = {
    'list': { width: '48px', height: '48px' },      // Slightly larger for better visibility
    'preview': { width: `${previewPx}px`, height: `${previewPx}px` },
    'detailed': { width: '276px', height: '276px' }  // Optimized large thumbnail
  };
  
  const thumbSize = thumbnailSizes[view] || thumbnailSizes['detailed'];
  
  // Thumbnail container with size based on view mode