From 9981486b9c34ea7ea1ab42cb2f423fe68cad1a9e Mon Sep 17 00:00:00 2001
From: majkshkurti <majkshkurti@outlook.com>
Date: Thu, 5 Sep 2024 14:23:37 +0200
Subject: [PATCH] fix: wms

---
 .../web/components/modals/DatasetExternal.tsx | 21 +++++++++----------
 apps/web/lib/transformers/wms.ts              |  4 ++--
 2 files changed, 12 insertions(+), 13 deletions(-)

diff --git a/apps/web/components/modals/DatasetExternal.tsx b/apps/web/components/modals/DatasetExternal.tsx
index 9ce3c7cb..53bf9e64 100644
--- a/apps/web/components/modals/DatasetExternal.tsx
+++ b/apps/web/components/modals/DatasetExternal.tsx
@@ -71,7 +71,6 @@ interface DatasetExternalProps {
 interface ExternalDatasetType {
   name: string;
   value: DataType;
-  urlPlaceholder: string;
   icon: ICON_NAME;
 }
 
@@ -85,25 +84,21 @@ const externalDatasetTypes: ExternalDatasetType[] = [
   {
     name: "Web Feature Service (WFS)",
     value: vectorDataType.Enum.wfs,
-    urlPlaceholder: "https://serviceurl.com",
     icon: ICON_NAME.WFS,
   },
   {
     name: "Web Map Service (WMS)",
     value: imageryDataType.Enum.wms,
-    urlPlaceholder: "https://serviceurl.com",
     icon: ICON_NAME.WMS,
   },
   {
     name: "Web Map Tile Service (WMTS)",
     value: imageryDataType.Enum.wmts,
-    urlPlaceholder: "https://serviceurl.com",
     icon: ICON_NAME.WMTS,
   },
   {
     name: "XYZ Tiles",
     value: "xyz",
-    urlPlaceholder: "https://serviceurl.com/{z}/{x}/{y}",
     icon: ICON_NAME.XYZ,
   },
 ];
@@ -243,7 +238,7 @@ const getNestedLayerMultiSelectionTableBody = (
   type
 ) => {
   if (depth > 4) return null;
-
+  console.log(layers);
   return (
     <React.Fragment>
       {layers.map((layer) => (
@@ -581,20 +576,24 @@ const DatasetExternal: React.FC<DatasetExternalProps> = ({ open, onClose, projec
         capabilities?.type === imageryDataType.Enum.wmts ||
         (capabilities?.type === imageryDataType.Enum.xyz && capabilities.directUrl)
       ) {
-        let layers;
+        let layers = [] as string[];
         let url = externalUrl;
         const legendUrls = [] as string[];
         if (capabilities.type === imageryDataType.Enum.wms) {
-          layers = selectedDatasets.map((d) => d.Name);
           if (!externalUrl) return;
-          const baseUrl = getBaseUrl(externalUrl);
+          let styles = [] as string[];
           const version = capabilities.capabilities?.version;
-          url = generateWmsUrl(baseUrl, layers, version);
+          const baseUrl = getBaseUrl(externalUrl);
           selectedDatasets.forEach((dataset) => {
             const _layer = dataset.Name;
-            const legendGraphicUrl = generateLayerGetLegendGraphicUrl(baseUrl, _layer, "default", version);
+            const styleName = dataset.Style[0]?.Name; //todo: WMS can have multiple styles. This has to be handled in the future.
+            if (!styleName || !_layer) return;
+            layers.push(_layer);
+            styles.push(styleName);
+            const legendGraphicUrl = generateLayerGetLegendGraphicUrl(baseUrl, _layer, styleName, version);
             legendUrls.push(legendGraphicUrl);
           });
+          url = generateWmsUrl(baseUrl, layers, styles, version);
         } else if (capabilities.type === imageryDataType.Enum.wmts) {
           if (capabilities.directUrl) {
             url = convertWmtsToXYZUrl(capabilities.directUrl);
diff --git a/apps/web/lib/transformers/wms.ts b/apps/web/lib/transformers/wms.ts
index 7db3d506..329d2ba1 100644
--- a/apps/web/lib/transformers/wms.ts
+++ b/apps/web/lib/transformers/wms.ts
@@ -11,12 +11,12 @@ export const DEFAULT_VERSION = '1.3.0';
  * @returns {string} - The generated WMS URL with the specified parameters.
  */
 
-export const generateWmsUrl = (baseUrl, layers, version?, dpi?) => {
+export const generateWmsUrl = (baseUrl, layers, styles, version?, dpi?) => {
   const width = 256;
   const height = 256;
   const _dpi = dpi || 90;
   const _version = version || DEFAULT_VERSION;
-  return `${baseUrl}?bbox={bbox-epsg-3857}&service=WMS&REQUEST=GetMap&layers=${layers}&FORMAT=image/png&TRANSPARENT=true&WIDTH=${width}&HEIGHT=${height}&SRS=EPSG:3857&CRS=EPSG:3857&VERSION=${_version}&STYLES=default&DPI=${_dpi}&MAP_RESOLUTION=${_dpi}&FORMAT_OPTIONS=dpi:${_dpi}`;
+  return `${baseUrl}?bbox={bbox-epsg-3857}&service=WMS&REQUEST=GetMap&layers=${layers}&FORMAT=image/png&TRANSPARENT=true&WIDTH=${width}&HEIGHT=${height}&SRS=EPSG:3857&CRS=EPSG:3857&VERSION=${_version}&STYLES=${styles}&DPI=${_dpi}&MAP_RESOLUTION=${_dpi}&FORMAT_OPTIONS=dpi:${_dpi}`;
 };