Speed up Wereldexport map loading dramatically.

Limit world overview payload, optimize SQL joins, cache bundle and tiles, reuse map instance, and show loading state.

cockpit/static/js/export-intel-map.js

@@ -170,6 +170,10 @@ window.ExportIntelMap = (function () {
   function init(containerId) {
     var el = document.getElementById(containerId);
     if (!el || !window.L) return null;
+    if (map && map.getContainer() === el) {
+      invalidateMapSize();
+      return map;
+    }
     if (map) {
       map.remove();
       map = null;

cockpit/static/js/export-intel.js

@@ -26,6 +26,8 @@ function exportIntelApp() {
     mapHalalMode: false,
     mapHalalMin: 55,
     mapError: '',
+    mapLoading: false,
+    mapTruncated: false,
     halalTopMarkets: [],
     halalTopEntities: [],
     listFocusId: null,
@@ -242,13 +244,7 @@ function exportIntelApp() {
       var base = '/api/export-intel';
       var fq = this.filterQs();
       if (this.tab === 'map') {
-        var mapQs = this.filterQs();
-        var mt = this.mapTypesParam();
-        if (mt.entity_type) mapQs += '&entity_type=' + encodeURIComponent(mt.entity_type);
-        else if (mt.entity_types) mapQs += '&entity_types=' + encodeURIComponent(mt.entity_types);
-        var rm = await fetch(base + '/entities?limit=200' + mapQs).then((x) => x.json());
-        this.entities = rm.items || [];
-        this.resultCount = rm.total != null ? rm.total : this.entities.length;
+        return;
       } else if (this.tab === 'distributors') {
         var types = 'distributor,wholesaler,importer,logistics';
         var et = this.entityTypeFilter ? '&entity_type=' + encodeURIComponent(this.entityTypeFilter) : '';
@@ -307,6 +303,8 @@ function exportIntelApp() {
 
     async loadMap() {
       this.clearListFocus();
+      this.mapLoading = true;
+      this.mapError = '';
       var url = '/api/export-intel/map/bundle';
       var qs = [];
       if (this.country) qs.push('country=' + encodeURIComponent(this.country));
@@ -320,16 +318,27 @@ function exportIntelApp() {
       if (this.filterCrmStatus === 'linked') qs.push('crm_linked=true');
       if (this.filterCrmStatus === 'not_linked') qs.push('crm_linked=false');
       if (qs.length) url += '?' + qs.join('&');
-      var bundle = await fetch(url).then((r) => r.json());
+      var bundle;
+      try {
+        bundle = await fetch(url).then((r) => r.json());
+      } catch (e) {
+        this.mapLoading = false;
+        this.mapError = 'Kaart laden mislukt. Probeer opnieuw.';
+        return;
+      }
       this.halalTopMarkets = (bundle.meta && bundle.meta.top_markets) || [];
       this.halalTopEntities = (bundle.meta && bundle.meta.top_halal_entities) || [];
+      this.entities = (bundle.meta && bundle.meta.sidebar_entities) || this.halalTopEntities || [];
+      this.resultCount = (bundle.meta && bundle.meta.entity_count) || this.entities.length;
+      this.mapTruncated = !!(bundle.meta && bundle.meta.truncated);
       if (!window.L || !window.ExportIntelMap) {
         this.mapError = 'Kaart kon niet laden. Vernieuw de pagina (Ctrl+F5).';
+        this.mapLoading = false;
         return;
       }
       this.mapError = '';
       if (window.ExportIntelMap) {
-        if (!document.getElementById('ei-map')) return;
+        if (!document.getElementById('ei-map')) { this.mapLoading = false; return; }
         var self = this;
         window.ExportIntelMap.init('ei-map');
         window.ExportIntelMap.setOnEntityClick(function (id) { self.openEntity(id); });
@@ -340,6 +349,7 @@ function exportIntelApp() {
           if (t && t.lat && t.lon) window.ExportIntelMap.flyTo(t.lat, t.lon, t.map_zoom || 6);
         }
       }
+      this.mapLoading = false;
     },
 
     setTab(id, el) {