categories now only once defined in db.php, not longer multiple hardcoded definitions

public/api/db.php

@@ -1,8 +1,8 @@
 <?php
 // =====================================================================
-// Database Helper
+// Database Helper Functions
-// Provides PDO Connection to Database and shared miscellaneous
+// Provides PDO Connection, JSON Response Helpers, Category Definitions
-// Functions for all API Endpoints.
+// and shared miscellaneous Functions for all API Endpoints.
 // =====================================================================
 
 require_once __DIR__ . '/init.php';

public/index.php

@@ -56,7 +56,7 @@ if (!$municipality) {
     <!-- Leaflet Polyline Measurement Tool -->
     <!-- <link rel="stylesheet" href="https://ppete2.github.io/Leaflet.PolylineMeasure/Leaflet.PolylineMeasure.css"> -->
 
-    <!-- Font Awesome 6 for Icons -->
+    <!-- Font Awesome for Icons -->
     <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css">
 
     <!-- Application Styles -->
@@ -339,6 +339,9 @@ if (!$municipality) {
             zoom: <?= $municipality['default_zoom'] ?>,
             primaryColor: "<?= htmlspecialchars($municipality['primary_color'], ENT_QUOTES) ?>"
         };
+
+        // Category Definitions from Database
+        var CATEGORIES = <?= json_encode(get_categories(), JSON_UNESCAPED_UNICODE) ?>;
     </script>
 
     <!-- Application Logic -->

public/js/app.js

@@ -19,17 +19,6 @@ const API_URL = 'api/contributions.php';
 // Current User Name, set via Login Modal, stored in sessionStorage
 let currentUser = sessionStorage.getItem('webgis_user') || '';
 
-// Category Definitions with Labels, Icons, and Colors
-const CATEGORIES = {
-    consumption: { label: 'Geschäfte',   faIcon: 'fa-cart-shopping', color: '#C00000' },
-    building:    { label: 'Bauen',       faIcon: 'fa-building',      color: '#E65100' },
-    energy:      { label: 'Energie',     faIcon: 'fa-bolt',          color: '#FFC000' },
-    environment: { label: 'Umwelt',      faIcon: 'fa-seedling',      color: '#92D050' },
-    mobility:    { label: 'Mobilität',   faIcon: 'fa-bus',           color: '#0070C0' },
-    industry:    { label: 'Industrie',   faIcon: 'fa-industry',      color: '#7030A0' },
-    other:       { label: 'Sonstiges',   faIcon: 'fa-thumbtack',     color: '#7F7F7F' }
-};
-
 // Application State
 let map;                                      // Leaflet Map Instance
 let sidebar;                                  // Sidebar Instance