DRYing the project

app/static/js/gallery-infinite.js

@@ -4,6 +4,9 @@
 (function() {
   'use strict';
 
+  // Use shared TagUtils module
+  const { getTagIcon, getTagDisplayName, escapeHtml, createTagChipHtml } = window.TagUtils || {};
+
   // Configuration
   const CONFIG = {
     SCROLL_THRESHOLD: 1200,      // px from bottom to trigger load
@@ -187,21 +190,6 @@
     return section;
   }
 
-  // Tag icon mapping (matches showcase.js and bulk-select.js)
-  function getTagIcon(kind) {
-    const icons = {
-      artist: '🎨',
-      archive: '🗜️',
-      character: '👤',
-      series: '📺',
-      fandom: '🎭',
-      rating: '⚠️',
-      source: '🌐',
-      post: '📌'
-    };
-    return icons[kind] || '#';
-  }
-
   // Create a single image element
   function createImageElement(img) {
     const item = document.createElement('div');
@@ -211,15 +199,10 @@
     item.dataset.type = img.is_video ? 'video' : 'image';
     item.dataset.filename = img.filename;
 
-    // Build tag overlay HTML with icons
+    // Build tag overlay HTML with icons using shared utility
     let tagsHtml = '';
     if (img.tags && img.tags.length > 0) {
-      const tagChips = img.tags.map(t => {
-        const displayName = t.name.includes(':') ? t.name.split(':')[1] : t.name;
-        const icon = getTagIcon(t.kind);
-        const prefix = icon !== '#' ? icon + ' ' : '#';
-        return `<a class="tag-chip" href="/gallery?tag=${encodeURIComponent(t.name)}" title="Filter by ${t.name}" onclick="event.stopPropagation()">${prefix}${displayName}</a>`;
-      }).join('');
+      const tagChips = img.tags.map(t => createTagChipHtml(t)).join('');
       tagsHtml = `<div class="tag-overlay">${tagChips}</div>`;
     }