frontend structiure generated

wagfarm-ui/js/app.js

@@ -0,0 +1,109 @@
+import LogsModule from './entities/logs.js';
+import AssetsModule from './entities/assets.js';
+import TaxonomiesModule from './entities/taxonomies.js';
+
+// State to track which entity type is active
+let activeEntityType = 'logs';
+
+document.addEventListener('DOMContentLoaded', () => {
+  // Initialize navigation
+  setupNavigation();
+  
+  // Load the default entity type
+  loadEntityList(activeEntityType);
+  
+  // Setup form handlers
+  setupFormHandlers();
+});
+
+function setupNavigation() {
+  const navLinks = document.querySelectorAll('.nav-link');
+  
+  navLinks.forEach(link => {
+    link.addEventListener('click', (e) => {
+      e.preventDefault();
+      const entityType = e.target.dataset.entity;
+      
+      // Update active link
+      navLinks.forEach(l => l.classList.remove('active'));
+      e.target.classList.add('active');
+      
+      // Update active entity and load data
+      activeEntityType = entityType;
+      loadEntityList(entityType);
+      
+      // Show the appropriate form
+      document.querySelectorAll('.entity-form').forEach(form => {
+        form.style.display = 'none';
+      });
+      document.getElementById(`${entityType}-form-container`).style.display = 'block';
+    });
+  });
+}
+
+async function loadEntityList(entityType) {
+  // Clear previous content
+  document.getElementById('entity-list').innerHTML = '<p>Loading...</p>';
+  
+  try {
+    let entities;
+    
+    // Get data based on entity type
+    switch(entityType) {
+      case 'logs':
+        entities = await LogsModule.getAllLogs();
+        LogsModule.renderLogsList(entities, 'entity-list');
+        break;
+      case 'assets':
+        entities = await AssetsModule.getAllAssets();
+        AssetsModule.renderAssetsList(entities, 'entity-list');
+        break;
+      case 'taxonomies':
+        entities = await TaxonomiesModule.getAllTaxonomies();
+        TaxonomiesModule.renderTaxonomiesList(entities, 'entity-list');
+        break;
+    }
+  } catch (error) {
+    document.getElementById('entity-list').innerHTML = `<p>Error loading data: ${error.message}</p>`;
+  }
+}
+
+function setupFormHandlers() {
+  // Log creation form
+  document.getElementById('log-create-form').addEventListener('submit', async (e) => {
+    e.preventDefault();
+    const formData = new FormData(e.target);
+    const logData = {
+      title: formData.get('title'),
+      date: formData.get('date'),
+      description: formData.get('description')
+      // Add more fields as needed
+    };
+    
+    try {
+      await LogsModule.createLog(logData);
+      e.target.reset();
+      if (activeEntityType === 'logs') {
+        loadEntityList('logs');
+      }
+      showNotification('Log created successfully');
+    } catch (error) {
+      showNotification(`Error: ${error.message}`, 'error');
+    }
+  });
+  
+  // Add similar handlers for assets and taxonomies
+}
+
+function showNotification(message, type = 'success') {
+  const notification = document.createElement('div');
+  notification.className = `notification ${type}`;
+  notification.textContent = message;
+  
+  document.body.appendChild(notification);
+  
+  // Remove after 3 seconds
+  setTimeout(() => {
+    notification.remove();
+  }, 3000);
+}