=Timeline block, and feed block updated. DataStore.js refactored to not blo...

Jake Vanderwerf

2025-11-23 d7dbe7fee362d587dfc334135d9581b6216a4295

 assets/js/concise/DataStore.js

@@ -1,314 +1,986 @@
/**
 * ExtendedDataStore - A flexible IndexedDB wrapper with HTTP caching
 * DataStore - Singleton pattern managing multiple store namespaces
 *
 * Configuration-based approach for different storage needs:
 * - Configurable endpoint, keyPath, and indexes
 * - Built-in ETag and If-Modified-Since support
 * - Automatic DOM reference stripping
 * - TTL-based cache invalidation
 *
 * All notifications:
 *
      this.store.subscribe((event, data) => {
         switch (event) {
            case 'data-loaded':
               break;
            case 'item-saved':
               break;
            case 'items-saved':
               break;
            case 'item-deleted':
               break;
            case 'data-cleared':
               break;
            case 'filters-changed':
               break;
            case 'filters-cleared':
               break;
            case 'cache-cleared':
               break;
         }
      });
 * Usage:
 *   window.jvbStore = new DataStore();
 *   this.store = window.jvbStore.register('feed', { config });
 */
class DataStore {
   constructor(config = {}) {
      // Core configuration with sensible defaults
      this.config = {
         // Storage configuration
         name: 'default',
         version: 1,
         storeName: 'items',
         keyPath: 'id',
         indexes: [], // Array of {name, keyPath, unique}
   constructor() {
      // Singleton pattern
      if (DataStore.instance) {
         return DataStore.instance;
      }
      DataStore.instance = this;

         // API configuration
         endpoint: null,
         saveToServer: false,
         apiBase: jvbSettings.api,
         headers: {},
         filters: {},
         required:  null, //any required filters before fetching
         icon: null,
         getBlobs: null,
      // Shared resources
      this.databases = new Map();      // Shared IndexedDB connections
      this.stores = new Map();         // Registered store namespaces
      this.subscribers = new Map();    // Per-store event subscribers
      this.pendingInits = new Map();   // Track initialization promises
      this.fetchQueue = [];

         // Cache configuration
         TTL: 3600000, // 1 hour default
         useHttpCaching: true, // ETag and If-Modified-Since
         cacheKeyStrategy: 'filters', // How to generate cache keys

         // UI configuration
         showLoading: true,

         // Features
         stripDOMReferences: true,
         storeBlobs: false,

         ...config
      };

      // Initialize base properties
      this.db = null;
      this.data = new Map();
      this.cache = new Map();
      this.isFetching = false;
      this.pendingFetch = null;
      this.httpHeaders = new Map();
      this.subscribers = new Set();
      this.currentRequest = null;
      this.filters = this.config.filters??{};

      // Set up headers
      this.headers = {
         'X-WP-Nonce': jvbSettings?.nonce,
         ...this.config.headers
      };

      // Global state
      this._initialized = false;
      this.body = document.body;
      this.loading = document.querySelector('dialog.loading');

      // Auto-initialize
      this.initDB();
      this.init();

      // Cleanup on page unload
      window.addEventListener('beforeunload', () => this.destroy());
   }

   /**
    * Initialize IndexedDB with configurable schema
    */
   async initDB() {
   async init() {
      if (this._initialized) return;
      this._initialized = true;

      if (!('indexedDB' in window)) {
         console.warn('IndexedDB not supported');
         return;
      }

      const dbName = `jvb_${this.config.name}_db`;
      const request = indexedDB.open(dbName, this.config.version);

      request.onupgradeneeded = (e) => {
         const db = e.target.result;

         // Create main store with configurable keyPath
         if (!db.objectStoreNames.contains(this.config.storeName)) {
            const store = db.createObjectStore(this.config.storeName, {
               keyPath: this.config.keyPath
            });

            // Add configured indexes
            this.config.indexes.forEach(index => {
               store.createIndex(
                  index.name,
                  index.keyPath || index.name,
                  { unique: index.unique || false }
               );
            });
         }

         // Cache store for HTTP responses
         if (this.config.endpoint && !db.objectStoreNames.contains('cache')) {
            const cacheStore = db.createObjectStore('cache', { keyPath: 'key' });
            cacheStore.createIndex('timestamp', 'timestamp', { unique: false });
            cacheStore.createIndex('endpoint', 'endpoint', { unique: false });
            cacheStore.createIndex('filters', 'filters', { unique: false });
         }

         // HTTP headers store for ETag/If-Modified-Since
         if (this.config.useHttpCaching && !db.objectStoreNames.contains('headers')) {
            db.createObjectStore('headers', { keyPath: 'key' });
         }

         if (this.config.storeBlobs && !db.objectStoreNames.contains('blobs')) {
            db.createObjectStore('blobs', { keyPath: 'uploadId' });
         }

         // Call optional schema extension
         if (this.config.onUpgrade) {
            this.config.onUpgrade(db, e.oldVersion, e.newVersion);
         }
      };

      request.onsuccess = async (e) => {
         this.db = e.target.result;

         // Load cache and headers BEFORE fetching (only if stores exist)
         const loadTasks = [this.loadFromDB()];

         if (this.db.objectStoreNames.contains('cache')) {
            loadTasks.push(this.loadCache());
         }

         if (this.config.useHttpCaching && this.db.objectStoreNames.contains('headers')) {
            loadTasks.push(this.loadHeaders());
         }

         await Promise.all(loadTasks);

         this.notify('db-init');

         // Now fetch if needed (cache might already have data)
         if (this.config.endpoint) {
            this.fetch();
         }
      };

      request.onerror = (e) => {
         console.error(`IndexedDB error for ${dbName}:`, e);
         if (this.config.onError) {
            this.config.onError(e);
         }
      };
   }

   /**
    * Load all data from IndexedDB
    * Register a new store namespace
    */
   async loadFromDB() {
      if (!this.db) return;
   register(name, config = {}) {
      if (this.stores.has(name)) {
         console.warn(`Store "${name}" already registered`);
         return this.getStoreAPI(name);
      }

      return new Promise(async (resolve, reject) => {
         const tx = this.db.transaction([this.config.storeName], 'readonly');
         const store = tx.objectStore(this.config.storeName);
         const request = store.getAll();
      if (!config.keyPath) {
         throw new Error(`Store "${name}" requires a keyPath`);
      }

         request.onsuccess = async (e) => {
            const items = e.target.result;
      const store = {
         name,
         config: {
            // Storage
            dbName: `jvb_${name}_db`,
            version: 1,
            storeName: 'items',
            keyPath: 'id',
            indexes: [],

            // Restore FormData for ALL items on startup
            for (const item of items) {
               if (item.data?._isFormData && this.config.getBlobs) {
                  item.data = await this.objectToFormData(item.data);
               }
               const key = this.getItemKey(item);
               this.data.set(key, item);
            // API
            endpoint: null,
            apiBase: jvbSettings.api,
            filters: {},
            required: null,

            // Cache
            TTL: 3600000, // 1 hour
            useHttpCaching: true,

            // Behavior
            showLoading: false,
            delayFetch: true,
            validateData: true, // Validate data is serializable

            ...config
         },

         // State
         db: null,
         data: new Map(),
         cache: new Map(),
         httpHeaders: new Map(),
         filters: { ...config.filters },
         isFetching: false,
         currentRequest: null,
         lastResponse: null,
         _initialized: false
      };

      store.config.headers = {
         'X-WP-Nonce': jvbSettings?.nonce,
         ...store.config.headers
      };

      this.stores.set(name, store);
      this.subscribers.set(name, new Set());

      // Initialize database asynchronously
      this.initStoreDB(name).catch(error => {
         console.error(`Failed to initialize store "${name}":`, error);
      });

      return this.getStoreAPI(name);
   }

   /**
    * Get the API object for a registered store
    */
   getStoreAPI(name) {
      const api = {
         // Data methods
         fetch: () => this.fetch(name),
         save: (item) => this.save(name, item),
         delete: (id) => this.delete(name, id),
         get: (id) => this.get(name, id),
         getAll: () => this.getAll(name),
         getFiltered: () => this.getFiltered(name),
         clear: () => this.clear(name),

         // Filter methods
         setFilter: (key, value) => this.setFilter(name, key, value),
         setFilters: (filters) => this.setFilters(name, filters),
         removeFilter: (key) => this.removeFilter(name, key),
         clearFilters: () => this.clearFilters(name),

         // Cache methods
         clearCache: () => this.clearCache(name),
         clearHttpHeaders: (key) => this.clearHttpHeaders(name, key),

         // Event methods
         subscribe: (callback) => this.subscribe(name, callback),

         // Utility
         ensureInitialized: () => this.ensureStoreInitialized(name),

         // Exposed properties (read-only)
         get filters() {
            return { ...api.getStore().filters };
         },
         get lastResponse() {
            return api.getStore().lastResponse;
         },
         get data() {
            return api.getStore().data;
         },

         getStore: () => this.stores.get(name)
      };

      return api;
   }

   /**
    * Normalize data before saving - convert Sets/Maps automatically
    */
   normalizeForStorage(obj) {
      if (obj === null || obj === undefined) return obj;

      // Convert Set to Array
      if (obj instanceof Set) {
         return Array.from(obj);
      }

      // Convert Map to Object
      if (obj instanceof Map) {
         return Object.fromEntries(obj);
      }

      // Handle Arrays
      if (Array.isArray(obj)) {
         return obj.map(item => this.normalizeForStorage(item));
      }

      // Handle Objects
      if (typeof obj === 'object') {
         const normalized = {};
         for (const [key, value] of Object.entries(obj)) {
            normalized[key] = this.normalizeForStorage(value);
         }
         return normalized;
      }

      return obj;
   }

   /**
    * Strip DOM references from object
    */
   stripDOMReferences(obj, visited = new WeakSet()) {
      if (obj === null || obj === undefined) return obj;

      const type = typeof obj;
      if (type === 'string' || type === 'number' || type === 'boolean') {
         return obj;
      }

      // Prevent circular references
      if (type === 'object' && visited.has(obj)) {
         return '[Circular]';
      }

      // Remove DOM elements
      if (obj instanceof HTMLElement ||
         obj instanceof NodeList ||
         obj instanceof HTMLCollection ||
         obj.nodeType !== undefined) {
         return null;
      }

      // Handle Date
      if (obj instanceof Date) {
         return obj;
      }

      // Handle Arrays
      if (Array.isArray(obj)) {
         visited.add(obj);
         return obj.map(item => this.stripDOMReferences(item, visited)).filter(v => v !== null);
      }

      // Handle Objects
      if (type === 'object') {
         visited.add(obj);
         const cleaned = {};
         for (const [key, value] of Object.entries(obj)) {
            const cleanedValue = this.stripDOMReferences(value, visited);
            if (cleanedValue !== null) {
               cleaned[key] = cleanedValue;
            }
         }
         return cleaned;
      }

            this.notify('data-loaded', { count: items.length });
            resolve(items);
      return obj;
   }

   /**
    * Initialize database for a specific store
    */
   async initStoreDB(name) {
      const store = this.stores.get(name);
      if (!store || store._initialized) return;

      if (this.pendingInits.has(name)) {
         return this.pendingInits.get(name);
      }

      const initPromise = this._performStoreInit(name);
      this.pendingInits.set(name, initPromise);

      try {
         await initPromise;
         store._initialized = true;
      } finally {
         this.pendingInits.delete(name);
      }
   }

   async _performStoreInit(name) {
      const store = this.stores.get(name);
      const { dbName, version } = store.config;

      try {
         if (!this.databases.has(dbName)) {
            const db = await this.openDatabase(dbName, version, (db) => {
               this.setupStores(db, store.config);
            });
            this.databases.set(dbName, db);
         }

         store.db = this.databases.get(dbName);
         this.loadStoreDataInBackground(name);
         this.notify(name, 'db-init');

      } catch (error) {
         console.error(`Failed to initialize database for store "${name}":`, error);
         throw error;
      }
   }

   openDatabase(dbName, version, onUpgrade) {
      return new Promise((resolve, reject) => {
         const request = indexedDB.open(dbName, version);

         request.onupgradeneeded = (e) => {
            if (onUpgrade) {
               onUpgrade(e.target.result, e.oldVersion, e.newVersion);
            }
         };

         request.onerror = (e) => reject(e);
         request.onsuccess = (e) => resolve(e.target.result);
         request.onerror = (e) => reject(e.target.error);
         request.onblocked = () => {
            console.warn(`Database ${dbName} blocked. Close other tabs.`);
         };
      });
   }

   setupStores(db, config) {
      // Main store
      if (!db.objectStoreNames.contains(config.storeName)) {
         const store = db.createObjectStore(config.storeName, {
            keyPath: config.keyPath
         });

         config.indexes.forEach(index => {
            store.createIndex(
               index.name,
               index.keyPath || index.name,
               { unique: index.unique || false }
            );
         });
      }

   /**
    * Load main data from IndexedDB
    */
   async loadData() {
      if (!this.db) return;
      // Cache store
      if (config.endpoint && !db.objectStoreNames.contains('cache')) {
         const cacheStore = db.createObjectStore('cache', { keyPath: 'key' });
         cacheStore.createIndex('timestamp', 'timestamp', { unique: false });
      }

      return new Promise((resolve, reject) => {
         const tx = this.db.transaction([this.config.storeName], 'readonly');
         const store = tx.objectStore(this.config.storeName);
         const request = store.getAll();
      // HTTP headers store
      if (config.useHttpCaching && !db.objectStoreNames.contains('headers')) {
         db.createObjectStore('headers', { keyPath: 'key' });
      }
   }

   loadStoreDataInBackground(name) {
      const store = this.stores.get(name);
      if (!store?.db) return;

      const tasks = [
         this.loadStoreData(name),
         this.loadStoreCache(name),
         this.loadStoreHeaders(name)
      ];

      Promise.all(tasks)
         .then(() => {
            this.notify(name, 'data-ready');

            // Add to fetch queue instead of immediate fetch
            if (store.config.endpoint && store.config.delayFetch) {
               this.fetchQueue.push(name);

               // Start processing queue if not already running
               if (this.fetchQueue.length === 1) {
                  this.processFetchQueue();
               }
            } else if (store.config.endpoint && !store.config.delayFetch) {
               // Immediate fetch
               if ('requestIdleCallback' in window) {
                  requestIdleCallback(() => this.fetch(name), { timeout: 2000 });
               } else {
                  setTimeout(() => this.fetch(name), 100);
               }
            }
         })
         .catch(error => {
            console.error(`Background load error for store "${name}":`, error);
         });
   }

   async processFetchQueue() {
      if (this.fetchQueue.length === 0) return;

      const name = this.fetchQueue.shift();
      const store = this.stores.get(name);

      if (!store) {
         // Store was removed, continue with next
         return this.processFetchQueue();
      }

      try {
         await this.fetch(name);
      } catch (error) {
         console.error(`Queue fetch error for "${name}":`, error);
      }

      // Process next item with idle callback
      if (this.fetchQueue.length > 0) {
         if ('requestIdleCallback' in window) {
            requestIdleCallback(() => this.processFetchQueue(), { timeout: 2000 });
         } else {
            setTimeout(() => this.processFetchQueue(), 50);
         }
      }
   }

   async loadStoreData(name) {
      const store = this.stores.get(name);
      if (!store?.db) return;

      return new Promise((resolve) => {
         const tx = store.db.transaction([store.config.storeName], 'readonly');
         const objectStore = tx.objectStore(store.config.storeName);
         const request = objectStore.getAll();

         request.onsuccess = (e) => {
            e.target.result.forEach(item => {
               // Strip DOM references if needed
               const cleaned = this.config.stripDOMReferences
                  ? this.stripDOMReferences(item)
                  : item;
            const items = e.target.result || [];
            items.forEach(item => {
               const key = this.getItemKey(item, store.config.keyPath);
               store.data.set(key, item);
            });
            this.notify(name, 'data-loaded', { count: items.length });
            resolve(items);
         };

               const key = this.getItemKey(cleaned);
               this.data.set(key, cleaned);
         request.onerror = () => resolve([]);
      });
   }

   async loadStoreCache(name) {
      const store = this.stores.get(name);
      if (!store?.db || !store.db.objectStoreNames.contains('cache')) return;

      return new Promise((resolve) => {
         const tx = store.db.transaction(['cache'], 'readonly');
         const objectStore = tx.objectStore('cache');
         const request = objectStore.getAll();

         request.onsuccess = (e) => {
            (e.target.result || []).forEach(item => {
               if (this.isCacheValid(item, store.config.TTL)) {
                  store.cache.set(item.key, item);
               }
            });
            resolve();
         };

         request.onerror = (e) => reject(e);
         request.onerror = () => resolve();
      });
   }

   /**
    * Strip DOM references from an object (recursive)
    */
   stripDOMReferences(obj) {
      if (!obj || typeof obj !== 'object') return obj;
   async loadStoreHeaders(name) {
      const store = this.stores.get(name);
      if (!store?.db || !store.db.objectStoreNames.contains('headers')) return;

      // Handle arrays
      return new Promise((resolve) => {
         const tx = store.db.transaction(['headers'], 'readonly');
         const objectStore = tx.objectStore('headers');
         const request = objectStore.getAll();

         request.onsuccess = (e) => {
            (e.target.result || []).forEach(header => {
               store.httpHeaders.set(header.key, header);
            });
            resolve();
         };

         request.onerror = () => resolve();
      });
   }

   async ensureStoreInitialized(name) {
      const store = this.stores.get(name);
      if (!store) {
         throw new Error(`Store "${name}" not registered`);
      }

      if (!store._initialized) {
         await this.initStoreDB(name);
      }
   }

   async fetch(name) {
      await this.ensureStoreInitialized(name);

      const store = this.stores.get(name);

      if (store.isFetching) return;

      // Check required filters
      if (store.config.required) {
         const required = Array.isArray(store.config.required)
            ? store.config.required
            : [store.config.required];

         const missing = required.some(key =>
            !store.filters[key] || store.filters[key] === ''
         );

         if (missing) return;
      }

      store.isFetching = true;

      try {
         // Check cache
         const cacheKey = this.generateCacheKey(store.filters);
         const cached = store.cache.get(cacheKey);

         if (cached && this.isCacheValid(cached, store.config.TTL)) {
            this.notify(name, 'data-loaded', {
               cached: true,
               items: cached.items || []
            });
            return cached;
         }

         if (store.config.showLoading) {
            this.setLoading(true);
         }

         const url = this.buildFetchUrl(name);
         const headers = { ...store.config.headers };
         const cachedHeaders = store.httpHeaders.get(cacheKey);

         if (store.config.useHttpCaching && cachedHeaders) {
            if (cachedHeaders.etag) {
               headers['If-None-Match'] = cachedHeaders.etag;
            }
            if (cachedHeaders.lastModified) {
               headers['If-Modified-Since'] = cachedHeaders.lastModified;
            }
         }

         const controller = new AbortController();
         store.currentRequest = controller;

         const response = await fetch(url, {
            method: 'GET',
            headers,
            signal: controller.signal
         });

         if (response.status === 304 && cached) {
            this.notify(name, 'data-loaded', {
               cached: true,
               notModified: true,
               items: cached.items || []
            });
            return cached;
         }

         if (!response.ok) {
            throw new Error(`HTTP ${response.status}: ${response.statusText}`);
         }

         const data = await response.json();

         if (store.config.useHttpCaching) {
            this.storeResponseHeaders(name, cacheKey, response);
         }

         await this.processFetchedData(name, data, cacheKey);

         this.notify(name, 'data-loaded', {
            cached: false,
            items: data.items || []
         });

         return data;

      } catch (error) {
         if (error.name !== 'AbortError') {
            console.error(`Fetch error for store "${name}":`, error);
            this.notify(name, 'fetch-error', { error });
         }
         throw error;

      } finally {
         store.isFetching = false;
         store.currentRequest = null;

         if (store.config.showLoading) {
            this.setLoading(false);
         }
      }
   }

   buildFetchUrl(name) {
      const store = this.stores.get(name);
      const params = new URLSearchParams();

      Object.entries(store.filters).forEach(([key, value]) => {
         if (value !== null && value !== undefined && value !== '') {
            if (typeof value === 'object') {
               params.set(key, JSON.stringify(value));
            } else {
               params.set(key, value);
            }
         }
      });

      const baseUrl = store.config.apiBase + store.config.endpoint;
      return params.toString() ? `${baseUrl}?${params}` : baseUrl;
   }

   async processFetchedData(name, data, cacheKey) {
      const store = this.stores.get(name);
      const items = data.items || [];

      for (const item of items) {
         await this.save(name, item);
      }

      const cacheEntry = {
         key: cacheKey,
         items: items.map(item => this.getItemKey(item, store.config.keyPath)),
         timestamp: Date.now(),
         endpoint: store.config.endpoint,
         filters: { ...store.filters }
      };

      store.cache.set(cacheKey, cacheEntry);
      await this.saveToCache(name, cacheKey, cacheEntry);

      store.lastResponse = {
         has_more: data.has_more || false,
         total: data.total || items.length,
         pages: data.pages || 1
      };
   }

   /**
    * Save item to store
    * IMPORTANT: Item must be serializable (no DOM, FormData, Blobs)
    */
   async save(name, item) {
      const store = this.stores.get(name);

      // Auto-normalize Sets/Maps
      let processed = this.normalizeForStorage(item);
      processed = this.stripDOMReferences(processed);

      // Validate data is serializable
      if (store.config.validateData) {
         const validation = this.validateSerializable(processed);
         if (!validation.valid) {
            console.error(`Cannot save non-serializable data to store "${name}":`, validation.error);
            throw new Error(`Non-serializable data: ${validation.error}`);
         }
      }

      const key = this.getItemKey(processed, store.config.keyPath);

      // Store in memory
      store.data.set(key, item);

      // Store in IndexedDB
      if (store.db) {
         const tx = store.db.transaction([store.config.storeName], 'readwrite');
         const objectStore = tx.objectStore(store.config.storeName);
         await objectStore.put(processed);
      }

      this.notify(name, 'item-saved', { item, key });
      return key;
   }

   /**
    * Validate that data is IndexedDB-serializable
    * Rejects: DOM elements, FormData, Blobs, Functions, etc.
    */
   validateSerializable(obj, path = 'root') {
      // Primitives are fine
      if (obj === null || obj === undefined) {
         return { valid: true };
      }

      const type = typeof obj;
      if (type === 'string' || type === 'number' || type === 'boolean') {
         return { valid: true };
      }

      // Functions cannot be serialized
      if (type === 'function') {
         return {
            valid: false,
            error: `Function at ${path}`
         };
      }

      // Date is serializable
      if (obj instanceof Date) {
         return { valid: true };
      }

      // Reject DOM elements
      if (obj instanceof HTMLElement ||
         obj instanceof NodeList ||
         obj instanceof HTMLCollection ||
         (obj.nodeType !== undefined)) {
         return {
            valid: false,
            error: `DOM element at ${path}`
         };
      }

      // Reject FormData
      if (obj instanceof FormData) {
         return {
            valid: false,
            error: `FormData at ${path}. Convert to object first.`
         };
      }

      // Reject Blobs/Files
      if (obj instanceof Blob || obj instanceof File) {
         return {
            valid: false,
            error: `Blob/File at ${path}. Handle file uploads separately.`
         };
      }

      // Arrays
      if (Array.isArray(obj)) {
         return obj.map(item => this.stripDOMReferences(item));
         for (let i = 0; i < obj.length; i++) {
            const result = this.validateSerializable(obj[i], `${path}[${i}]`);
            if (!result.valid) return result;
         }
         return { valid: true };
      }

      // Handle objects
      const cleaned = {};
      for (const [key, value] of Object.entries(obj)) {
         // Skip DOM-related properties
         if (this.isDOMReference(key, value)) {
            continue;
      // Plain objects
      if (type === 'object') {
         // Check for Sets/Maps (IndexedDB doesn't support them)
         if (obj instanceof Set) {
            return {
               valid: false,
               error: `Set at ${path}. Convert to Array first: Array.from(set)`
            };
         }
         if (obj instanceof Map) {
            return {
               valid: false,
               error: `Map at ${path}. Convert to Object first: Object.fromEntries(map)`
            };
         }

         // Handle Set/Map collections
         if (value instanceof Set) {
            cleaned[key] = Array.from(value);
         } else if (value instanceof Map) {
            cleaned[key] = Object.fromEntries(value);
         } else if (typeof value === 'object' && value !== null) {
            cleaned[key] = this.stripDOMReferences(value);
         } else {
            cleaned[key] = value;
         // Check all properties
         for (const [key, value] of Object.entries(obj)) {
            const result = this.validateSerializable(value, `${path}.${key}`);
            if (!result.valid) return result;
         }
         return { valid: true };
      }

      return {
         valid: false,
         error: `Unknown type at ${path}: ${type}`
      };
   }

   async delete(name, id) {
      const store = this.stores.get(name);
      store.data.delete(id);

      if (store.db) {
         const tx = store.db.transaction([store.config.storeName], 'readwrite');
         const objectStore = tx.objectStore(store.config.storeName);
         await objectStore.delete(id);
      }

      this.notify(name, 'item-deleted', { id });
   }

   get(name, id) {
      const store = this.stores.get(name);
      return store.data.get(id);
   }

   getAll(name) {
      const store = this.stores.get(name);
      return Array.from(store.data.values());
   }

   getFiltered(name) {
      const store = this.stores.get(name);
      const cacheKey = this.generateCacheKey(store.filters);
      const cacheEntry = store.cache.get(cacheKey);

      if (cacheEntry && cacheEntry.items) {
         return cacheEntry.items.reduce((acc, id) => {
            const item = store.data.get(id);
            if (item) acc.push(item);
            return acc;
         }, []);
      }

      return this.getAll(name);
   }

   async clear(name) {
      const store = this.stores.get(name);
      store.data.clear();
      store.cache.clear();

      if (store.db) {
         const tx = store.db.transaction([store.config.storeName], 'readwrite');
         const objectStore = tx.objectStore(store.config.storeName);
         await objectStore.clear();
      }

      this.notify(name, 'data-cleared');
   }

   setFilter(name, key, value) {
      const store = this.stores.get(name);
      const oldValue = store.filters[key];

      if (value === null || value === undefined || value === '') {
         delete store.filters[key];
      } else {
         store.filters[key] = value;
      }

      this.notify(name, 'filters-changed', {
         filters: store.filters,
         changed: { key, oldValue, newValue: value }
      });

      if (store.config.endpoint) {
         this.fetch(name);
      }
   }

   async setFilters(name, filters) {
      const store = this.stores.get(name);

      const hasChanges = Object.keys(filters).some(
         key => store.filters[key] !== filters[key]
      );

      if (!hasChanges) return;

      store.filters = { ...store.filters, ...filters };

      this.notify(name, 'filters-changed', {
         filters: store.filters,
         changed: filters
      });

      if (store.config.endpoint) {
         await this.fetch(name);
      }
   }

   removeFilter(name, key) {
      const store = this.stores.get(name);
      const oldValue = store.filters[key];

      if (oldValue !== undefined) {
         delete store.filters[key];

         this.notify(name, 'filters-changed', {
            filters: store.filters,
            removed: { key, oldValue }
         });

         if (store.config.endpoint) {
            this.fetch(name);
         }
      }

      return cleaned;
   }

   /**
    * Check if a property is a DOM reference
    */
   isDOMReference(key, value) {
      // Check value types
      if (value instanceof HTMLElement ||
         value instanceof NodeList ||
         value instanceof HTMLCollection ||
         (value && value.nodeType !== undefined)) {
         return true;
   clearFilters(name) {
      const store = this.stores.get(name);
      const oldFilters = { ...store.filters };

      store.filters = { ...store.config.filters };

      this.notify(name, 'filters-cleared', {
         oldFilters,
         filters: store.filters
      });

      if (store.config.endpoint) {
         this.fetch(name);
      }

      // Check key names - use exact match or word boundaries
      const domKeys = ['element', 'el', 'dom', 'node', 'ui', 'container', 'wrapper'];
      const lowerKey = key.toLowerCase();

      // Only match if it's the exact key OR starts/ends with the pattern
      if (domKeys.includes(lowerKey) ||
         domKeys.some(k => lowerKey === k || lowerKey.startsWith(k + '_') || lowerKey.endsWith('_' + k))) {
         return true;
      }

      return false;
   }

   /**
    * Get the key for an item based on configured keyPath
    */
   getItemKey(item) {
      if (typeof this.config.keyPath === 'function') {
         return this.config.keyPath(item);
   clearCache(name) {
      const store = this.stores.get(name);
      store.cache.clear();

      if (store.db && store.db.objectStoreNames.contains('cache')) {
         const tx = store.db.transaction(['cache'], 'readwrite');
         const objectStore = tx.objectStore('cache');
         objectStore.clear();
      }

      // Support nested keypaths like 'meta.id'
      const keys = this.config.keyPath.split('.');
      this.notify(name, 'cache-cleared');
   }

   clearHttpHeaders(name, cacheKey = null) {
      const store = this.stores.get(name);

      if (cacheKey) {
         store.httpHeaders.delete(cacheKey);

         if (store.db && store.db.objectStoreNames.contains('headers')) {
            const tx = store.db.transaction(['headers'], 'readwrite');
            const objectStore = tx.objectStore('headers');
            objectStore.delete(cacheKey);
         }
      } else {
         store.httpHeaders.clear();

         if (store.db && store.db.objectStoreNames.contains('headers')) {
            const tx = store.db.transaction(['headers'], 'readwrite');
            const objectStore = tx.objectStore('headers');
            objectStore.clear();
         }
      }
   }

   subscribe(name, callback) {
      const subscribers = this.subscribers.get(name);
      subscribers.add(callback);
      return () => subscribers.delete(callback);
   }

   notify(name, event, data = {}) {
      const subscribers = this.subscribers.get(name);
      if (!subscribers) return;

      subscribers.forEach(callback => {
         try {
            callback(event, data);
         } catch (error) {
            console.error(`Subscriber error for store "${name}":`, error);
         }
      });
   }

   storeResponseHeaders(name, key, response) {
      const store = this.stores.get(name);

      const headers = {
         key,
         etag: response.headers.get('ETag'),
         lastModified: response.headers.get('Last-Modified'),
         timestamp: Date.now()
      };

      store.httpHeaders.set(key, headers);

      if (store.db && store.db.objectStoreNames.contains('headers')) {
         const tx = store.db.transaction(['headers'], 'readwrite');
         const objectStore = tx.objectStore('headers');
         objectStore.put(headers);
      }
   }

   async saveToCache(name, key, data) {
      const store = this.stores.get(name);
      if (!store.db || !store.db.objectStoreNames.contains('cache')) return;

      const tx = store.db.transaction(['cache'], 'readwrite');
      const objectStore = tx.objectStore('cache');
      await objectStore.put(data);
   }

   generateCacheKey(filters) {
      const normalized = Object.keys(filters)
         .sort()
         .reduce((acc, key) => {
            acc[key] = filters[key];
            return acc;
         }, {});

      return JSON.stringify(normalized);
   }

   isCacheValid(entry, ttl) {
      if (!entry || !entry.timestamp) return false;
      const age = Date.now() - entry.timestamp;
      return age < ttl;
   }

   getItemKey(item, keyPath) {
      if (typeof keyPath === 'function') {
         return keyPath(item);
      }

      const keys = keyPath.split('.');
      let value = item;

      for (const key of keys) {
@@ -318,789 +990,31 @@
      return value;
   }

   /**
    * Save a single item
    */
   /**
    * Save a single item
    */
   async save(item) {
      const key = this.getItemKey(item);

      // Keep ORIGINAL item in memory (with FormData intact)
      this.data.set(key, item);  // ← Store original

      // Create cleaned version ONLY for IndexedDB
      let cleaned = { ...item };
      if (cleaned.data instanceof FormData) {
         cleaned.data = this.formDataToObject(cleaned.data);
      }

      if (this.config.stripDOMReferences) {
         cleaned = this.stripDOMReferences(cleaned);
      }

      // Persist cleaned version to IndexedDB
      await this.saveToDB(cleaned);

      if(this.config.endpoint){
         this.saveToServer(item);
      }

      this.notify('item-saved', { item: cleaned, key });

      return cleaned;
   }

   /**
    * Convert FormData to plain object for storage
    */
   formDataToObject(formData) {
      const obj = {
         _isFormData: true, // Flag to reconstruct later
         entries: {}
      };

      for (const [key, value] of formData.entries()) {
         // Skip File/Blob objects - they're stored separately
         if (value instanceof File || value instanceof Blob) {
            continue;
         }

         // Handle multiple values for same key
         if (obj.entries[key]) {
            if (!Array.isArray(obj.entries[key])) {
               obj.entries[key] = [obj.entries[key]];
            }
            obj.entries[key].push(value);
         } else {
            obj.entries[key] = value;
         }
      }

      return obj;
   }

   /**
    * Convert stored object back to FormData
    */
   async objectToFormData(obj) {
      if (!obj._isFormData) return obj;

      const formData = new FormData();

      for (const [key, value] of Object.entries(obj.entries)) {
         if (Array.isArray(value)) {
            value.forEach(v => formData.append(key, v));
         } else {
            formData.append(key, value);
         }
      }
      // Restore files from external blob store (UploadManager)
      if (this.config.getBlobs && obj.entries.upload_ids) {
         const uploadIds = JSON.parse(obj.entries.upload_ids);
         const blobs = await this.config.getBlobs(uploadIds);  // ← Await here

         for (const blobData of blobs) {
            if (blobData) {
               const file = new File(
                  [blobData.data],
                  blobData.name,
                  { type: blobData.type, lastModified: blobData.lastModified }
               );
               formData.append('files[]', file);
            }
         }
      }

      return formData;
   }

   /**
    * Save item to IndexedDB
    */
   async saveToDB(item) {
      if (!this.db) return;

      return new Promise((resolve, reject) => {
         const tx = this.db.transaction([this.config.storeName], 'readwrite');
         const store = tx.objectStore(this.config.storeName);
         const request = store.put(item);

         request.onsuccess = () => resolve();
         request.onerror = (e) => reject(e);
      });
   }

   /**
    * Batch save multiple items
    */
   async saveMany(items) {
      if (!this.db) return;

      const tx = this.db.transaction([this.config.storeName], 'readwrite');
      const store = tx.objectStore(this.config.storeName);

      const promises = items.map(item => {
         const cleaned = this.config.stripDOMReferences
            ? this.stripDOMReferences(item)
            : item;

         const key = this.getItemKey(cleaned);
         this.data.set(key, cleaned);

         return store.put(cleaned);
      });

      await Promise.all(promises);
      this.notify('items-saved', { count: items.length });
   }

   /**
    * Get a single item
    */
   get(key) {
      return this.data.get(key);  // ← Returns original with FormData
   }

   /**
    * Get all items
    */
   getAll() {
      return Array.from(this.data.values());
   }

   /**
    * Delete an item
    */
   async delete(key, storeName = null) {
      this.data.delete(key);

      if (!storeName) {
         storeName = this.config.storeName;
      }
      if (this.db) {
         const tx = this.db.transaction([storeName], 'readwrite');
         const store = tx.objectStore(storeName);
         await store.delete(key);
      }

      this.notify('item-deleted', { key });
   }

   async saveBlob(key, blob) {
      if (!this.db) return;

      const tx = this.db.transaction(['blobs'], 'readwrite');
      const store = tx.objectStore('blobs');
      await store.put({
         uploadId: key,  // Match keyPath
         data: blob,
         type: blob.type,
         name: blob.name,
         lastModified: blob.lastModified || Date.now()
      });
   }

   async getBlob(key) {
      if (!this.db) return null;

      return new Promise(resolve => {
         const tx = this.db.transaction(['blobs'], 'readonly');
         const request = tx.objectStore('blobs').get(key);
         request.onsuccess = () => resolve(request.result);
         request.onerror = () => resolve(null);
      });
   }

   /**
    * Clear all data
    */
   async clear() {
      this.data.clear();
      this.cache.clear();
      this.httpHeaders.clear();

      if (this.domCache) {
         this.domCache.clear();
      }

      if (this.db) {
         const stores = [this.config.storeName];
         if (this.config.endpoint) stores.push('cache');
         if (this.config.useHttpCaching) stores.push('headers');

         const tx = this.db.transaction(stores, 'readwrite');
         stores.forEach(storeName => {
            if (this.db.objectStoreNames.contains(storeName)) {
               tx.objectStore(storeName).clear();
            }
         });
      }

      this.notify('data-cleared');
   }

   /**
    * Fetch data from server with HTTP caching
    */
   async fetch(options = {}) {
      if (!this.config.endpoint) {
         throw new Error('No endpoint configured for fetch');
      }
      const {
         filters = this.filters,
         headers = {},
      } = options;

      if (this.config.required && this.filters[this.config.required] === ''){
         console.log(this.config.storeName+ ': Not fetch as we don\'t have the required items');
         return;
      }

      // PREVENT CONCURRENT FETCHES FOR SAME DATA
      const cacheKey = this.generateCacheKey(filters);
      console.log('CacheKey: ', cacheKey);

      // If already fetching this exact query, return a promise that resolves when done
      if (this.isFetching && this.currentCacheKey === cacheKey) {
         return new Promise((resolve) => {
            // Store multiple waiting promises if needed
            if (!this.pendingFetches) {
               this.pendingFetches = [];
            }
            this.pendingFetches.push(resolve);
         });
      }

      this.isFetching = true;
      this.currentCacheKey = cacheKey;
      let fetchResult = null; // Capture result for pending fetches

      if (this.config.showLoading) {
         this.setLoading(true);
      }

      //Check Cached data
      const cachedData = this.cache.get(cacheKey);
      console.log('Cached Data: ', cachedData);
      if (cachedData && this.isCacheValid(cachedData)) {
         console.log('Returning cached data: ');
         this.isFetching = false;
         this.currentCacheKey = null;
         if (this.config.showLoading) {
            this.setLoading(false);
         }
         return cachedData.data;
      }

      // Build request headers with HTTP caching
      const requestHeaders = {
         ...this.headers,
         ...headers
      };

      if (this.config.useHttpCaching) {
         const httpCache = this.httpHeaders.get(cacheKey);
         if (httpCache) {
            if (httpCache.etag) {
               requestHeaders['If-None-Match'] = httpCache.etag;
            }
            if (httpCache.lastModified) {
               requestHeaders['If-Modified-Since'] = httpCache.lastModified;
            }
         }
      }

      // Build URL with filters
      const cleanedFilters = this.cleanFilters(filters);
      const params = new URLSearchParams(cleanedFilters);
      const url = `${this.config.apiBase}${this.config.endpoint}${params.toString() ? '?' + params : ''}`;

      try {
         const response = await fetch(url, {
            method: 'GET',
            headers: requestHeaders
         });

         // Handle 304 Not Modified
         if (response.status === 304 && cachedData) {
            // Update timestamp but keep existing data
            cachedData.timestamp = Date.now();
            cachedData.fromCache = true;
            cachedData.isError = false;
            this.saveCache(cacheKey, cachedData);
            console.log(this.config.storeName+' Data loaded from cache');
            this.notify('data-loaded', cachedData);
            fetchResult = cachedData.data;
            return cachedData.data;
         }

         if (!response.ok) {
            throw new Error(`HTTP ${response.status}: ${response.statusText}`);
         }

         const data = await response.json();

         // Store HTTP caching headers
         if (this.config.useHttpCaching) {
            this.storeResponseHeaders(cacheKey, response);
         }

         // Cache the response
         const cacheEntry = {
            key: cacheKey,
            data: data,
            timestamp: Date.now(),
            endpoint: this.config.endpoint,
            filters: filters
         };
         console.log(this.config.storeName + 'Fetched fresh from server');

         this.cache.set(cacheKey, cacheEntry);
         this.saveCache(cacheKey, cacheEntry);

         let items = (Array.isArray(data)) ? data : data.items;
         await this.saveMany(items);

         this.notify('data-loaded', {
            data: {
               items: items,
               ...data
            },
            count: items.length,
            filters: filters,
            fromCache: false,
            isError: false
         });

         fetchResult = data;
         return data;

      } catch (error) {
         console.error('Fetch error:', error);

         // Return cached data if available, even if expired
         if (cachedData) {
            console.warn('Using stale cache due to fetch error');
            cachedData.isError = true;
            this.notify('data-loaded', cachedData);
            fetchResult = cachedData.data;
            return cachedData.data;
         }

         throw error;
      } finally {
         if (this.config.showLoading) {
            this.setLoading(false);
         }

         this.isFetching = false;
         this.currentCacheKey = null;

         // Resolve any pending fetches that were waiting
         if (this.pendingFetches && this.pendingFetches.length > 0) {
            this.pendingFetches.forEach(resolve => resolve(fetchResult));
            this.pendingFetches = [];
         }
      }
   }

   /**
    * Fetch data from server with HTTP caching
    */
   async saveToServer(item) {
      if (!this.config.saveToServer || !jvbSettings.currentUser) {
         return;
      }
      if (!this.config.endpoint && this.config.saveToServer) {
         throw new Error('No endpoint configured for saving to server');
      }

      let requestBody;
      let headers = this.config.headers;
      headers['X-WP-Nonce'] = jvbSettings.nonce;
      if (item instanceof FormData) {
         item.append('user', jvbSettings.currentUser);
         requestBody = item;

         // console.log('Sending formData: ');
         // for (const pair of requestBody.entries()) {
         //    console.log(pair[0], pair[1]);
         // }
      } else {
         requestBody = JSON.stringify({
            ...item,
            user: jvbSettings.currentUser
         });
         // console.log('Sending data: ', {
         //    ...operation.data,
         //    id: operation.id,
         //    user: this.user
         // });

         headers['Content-Type'] = 'application/json';
      }

      const response = await fetch(
         `${this.config.apiBase}${this.config.endpoint}`,
         {
            method: 'POST',
            headers: headers,
            body: requestBody
         }
      );

      const result = await response.json();
      this.notify(
         'saved-to-server',
         {
            success: result.ok && result.success
         }
      );
   }

   cleanFilters(filters) {
      const cleaned = {};
      Object.entries(filters).forEach(([key, value]) => {
         if (value !== null && value !== undefined && value !== '') {
            // Handle special cases based on existing patterns
            if (key === 'taxonomies' && typeof value === 'object') {
               Object.entries(value).forEach(([taxName, terms]) => {
                  if (Array.isArray(terms) && terms.length > 0) {
                     cleaned[`tax_${taxName}`] = terms.join(',');
                  } else if (terms) {
                     cleaned[`tax_${taxName}`] = terms;
                  }
               });
            } else if (key === 'date' && typeof value === 'object') {
               if (value.after) cleaned.after = value.after;
               if (value.before) cleaned.before = value.before;
            } else {
               cleaned[key] = value;
            }
         }
      });
      return cleaned;
   }

   /**
    * Generate cache key from filters
    */
   generateCacheKey(filters) {
      if (this.config.cacheKeyStrategy === 'custom' && this.config.generateCacheKey) {
         return this.config.generateCacheKey(filters);
      }

      // Default strategy: sort keys and create string
      const sorted = Object.keys(filters)
         .sort()
         .reduce((acc, key) => {
            acc[key] = filters[key];
            return acc;
         }, {});

      return JSON.stringify(sorted);
   }

   setFilter(key, value) {
      if (!this.filters) {
         this.filters = {};
      }
      const oldValue = this.filters[key];
      if (oldValue === value) {
         return;
      }else if (value === '' || value === null || value === undefined) {
         delete this.filters[key];
      } else {
         this.filters[key] = value;
      }

      this.notify('filters-changed', {
         filters: this.filters,
         changed: { key, oldValue, newValue: value }
      });

      // Auto-fetch if endpoint is configured
      if (this.config.endpoint) {
         window.debouncer.schedule(
            this.config.endpoint,
            this.fetch.bind(this),
            100
         );
      }
   }


   /**
    * Remove a filter
    */
   removeFilter(key) {
      const oldValue = this.filters[key];

      if (oldValue !== undefined) {
         delete this.filters[key];
         this.notify('filters-changed', {
            filters: this.filters,
            removed: { key, oldValue }
         });

         // Auto-fetch if endpoint is configured
         if (this.config.endpoint) {
            window.debouncer.schedule(
               this.config.endpoint,
               this.fetch.bind(this),
               100
            );
         }
      }
   }

   /**
    * Clear all filters
    */
   clearFilters() {
      const oldFilters = { ...this.filters };
      //Restore baseline filters
      this.filters = this.config.filters;

      this.notify('filters-cleared', {
         oldFilters,
         filters: this.filters
      });

      // Auto-fetch if endpoint is configured
      if (this.config.endpoint) {
         this.fetch();
      }
   }

   /**
    * Set multiple filters at once
    */
   async setFilters(filters) {
      const hasChanges = Object.keys(filters).some(
         key => this.filters[key] !== filters[key]
      );

      if (!hasChanges) {
         return;
      }

      this.filters = { ...this.filters, ...filters };

      this.notify('filters-changed', {
         filters: this.filters,
         changed: filters,
      });

      // Only fetch if endpoint configured
      if (this.config.endpoint) {
         window.debouncer.schedule(
            this.config.endpoint,
            this.fetch.bind(this),
            100
         );
      }
   }

   /**
    * Check if cache entry is still valid
    */
   isCacheValid(cacheEntry) {
      if (!cacheEntry || !cacheEntry.timestamp) return false;

      const age = Date.now() - cacheEntry.timestamp;
      return age < this.config.TTL;
   }

   /**
    * Store HTTP response headers for caching
    */
   storeResponseHeaders(key, response) {
      const headers = {
         key,
         etag: response.headers.get('ETag'),
         lastModified: response.headers.get('Last-Modified'),
         timestamp: Date.now()
      };

      this.httpHeaders.set(key, headers);

      if (this.db && this.db.objectStoreNames.contains('headers')) {
         const tx = this.db.transaction(['headers'], 'readwrite');
         const store = tx.objectStore('headers');
         store.put(headers);
      }
   }

   /**
    * Save cache entry to IndexedDB
    */
   async saveCache(key, data) {
      if (!this.db || !this.db.objectStoreNames.contains('cache')) return;

      const tx = this.db.transaction(['cache'], 'readwrite');
      const store = tx.objectStore('cache');
      await store.put(data);
   }

   /**
    * Load cache from IndexedDB
    */
   async loadCache() {
      if (!this.db) return;

      return new Promise((resolve) => {
         const tx = this.db.transaction(['cache'], 'readonly');
         const store = tx.objectStore('cache');
         const request = store.getAll();

         request.onsuccess = (e) => {
            e.target.result.forEach(item => {
               if (this.isCacheValid(item)) {
                  this.cache.set(item.key, item);
               }
            });
            resolve();
         };
      });
   }

   /**
    * Load HTTP headers from IndexedDB
    */
   async loadHeaders() {
      if (!this.db) return;

      return new Promise((resolve) => {
         const tx = this.db.transaction(['headers'], 'readonly');
         const store = tx.objectStore('headers');
         const request = store.getAll();

         request.onsuccess = (e) => {
            e.target.result.forEach(header => {
               this.httpHeaders.set(header.key, header);
            });
            resolve();
         };
      });
   }


   /**
    * Subscribe to store events
    */
   subscribe(callback) {
      this.subscribers.add(callback);
      return () => this.subscribers.delete(callback);
   }

   /**
    * Notify subscribers of events
    */
   notify(event, data = {}) {
      this.subscribers.forEach(callback => {
         try {
            callback(event, data);
         } catch (error) {
            console.error('Subscriber error:', error);
         }
      });
   }

   /**
    * Query items using an index
    */
   async query(indexName, value) {
      if (!this.db) return [];

      return new Promise((resolve, reject) => {
         const tx = this.db.transaction([this.config.storeName], 'readonly');
         const store = tx.objectStore(this.config.storeName);

         if (!store.indexNames.contains(indexName)) {
            reject(new Error(`Index ${indexName} does not exist`));
            return;
         }

         const index = store.index(indexName);
         const request = value !== undefined
            ? index.getAll(value)
            : index.getAll();

         request.onsuccess = (e) => {
            const results = e.target.result.map(item => {
               return this.config.stripDOMReferences
                  ? this.stripDOMReferences(item)
                  : item;
            });
            resolve(results);
         };

         request.onerror = (e) => reject(e);
      });
   }

   /**
    * Count items in store
    */
   async count() {
      if (!this.db) return this.data.size;

      return new Promise((resolve, reject) => {
         const tx = this.db.transaction([this.config.storeName], 'readonly');
         const store = tx.objectStore(this.config.storeName);
         const request = store.count();

         request.onsuccess = (e) => resolve(e.target.result);
         request.onerror = (e) => reject(e);
      });
   }


   setLoading(on) {
      console.log('Setting Loading ' + (on) ? 'on' : 'off' + ' from '.this.config.storeName);
      this.body.classList.toggle('loading', on);
      if (on) {
         this.loading.showModal();
         this.loading?.showModal();
      } else {
         this.loading.close();
         this.loading?.close();
      }

   }

   /**
    * Cleanup and destroy
    */
   destroy() {
      if (this.currentRequest) {
         this.currentRequest.abort();
      }
      this.stores.forEach(store => {
         if (store.currentRequest) {
            store.currentRequest.abort();
         }
      });

      this.databases.forEach(db => db.close());
      this.stores.clear();
      this.subscribers.clear();
      this.data.clear();
      this.cache.clear();
      this.httpHeaders.clear();

      if (this.db) {
         this.db.close();
         this.db = null;
      }
   }

   clearCache() {
      this.cache.clear();

      if (this.db) {
         const tx = this.db.transaction(['cache'], 'readwrite');
         const store = tx.objectStore('cache');
         store.clear();
      }

      this.notify('cache-cleared');
      this.databases.clear();
      this.pendingInits.clear();
   }
}

// Export for use
window.jvbStore = DataStore;
// Initialize singleton on DOMContentLoaded
document.addEventListener('DOMContentLoaded', function() {
   window.jvbStore = new DataStore();
});