support loading COG layers from query params

docs/developer-guide/map-query-parameters.md

@@ -343,7 +343,7 @@ Requirements:
 - The number of layers should match the number of sources
 - The source name can be a string that must match a catalog service name present in the map or an object that defines an external catalog (see example)
 
-Supported layer types are WMS, WMTS, WFS, 3D Tiles and GeoJSON.
+Supported layer types are WMS, WMTS, WFS, COG, 3D Tiles and GeoJSON.
 
 Example:
 
@@ -372,6 +372,21 @@ GET `#/viewer/config?actions=[{"type":"CATALOG:ADD_LAYERS_FROM_CATALOGS","layers
 
 Number of objects passed to the options can be different to the number of layers, in this case options will be applied to the first X layers, where X is the length of options array.
 
+The COG service endpoint does not contain a default property for the name of the layer and it returns only a single record for this reason the name used in the layers array will be used to apply the title to the added COG layer:
+
+```json
+{
+    "type": "CATALOG:ADD_LAYERS_FROM_CATALOGS",
+    "layers": ["My huge remote satellite COG"],
+    "sources": [{ "type":"cog", "url":"https://example.com/satellite_imagery.tif" }]
+}
+```
+
+GET: `#/viewer/config?actions=[{"type":"CATALOG:ADD_LAYERS_FROM_CATALOGS","layers":["My huge remote satellite COG"],"sources":[{"type":"cog","url":"https://example.com/satellite_imagery.tif"}]}]`
+
+!!! note
+    Depending on the internal structure optimization done on the remote COG source, the map load time might be long. Furthermore, it is not feasible to cancel metadata fetching for the COG layer(s) when loading layers via query parameters.
+
 The 3D tiles service endpoint does not contain a default property for the name of the layer and it returns only a single record for this reason the name used in the layers array will be used to apply the title to the added 3D Tiles layer:
 
 ```json

web/client/api/catalog/COG.js

@@ -34,6 +34,7 @@ const searchAndPaginate = (layers, startPosition, maxRecords, text) => {
 let capabilitiesCache = {};
 export const getRecords = (_url, startPosition, maxRecords, text, info = {}) => {
     const service = get(info, 'options.service');
+    const controller = get(info, 'options.controller');
     let layers = [];
     if (service.records) {
         // each record/url corresponds to a layer
@@ -46,7 +47,6 @@ export const getRecords = (_url, startPosition, maxRecords, text, info = {}) =>
                 sources: record.sources ?? [{url}],
                 options: record.options ?? (service.options || {})
             };
-            const controller = get(info, 'options.controller');
             const isSave = get(info, 'options.save', false);
             const cached = capabilitiesCache[url];
             if (cached && new Date().getTime() < cached.timestamp + (ConfigUtils.getConfigProp('cacheExpire') || 60) * 1000) {
@@ -68,6 +68,25 @@ export const getRecords = (_url, startPosition, maxRecords, text, info = {}) =>
         });
     }
     return Promise.all([...layers]).then((_layers) => {
+        if (!_layers.length) {
+            let layer = {
+                ...service,
+                title: text,
+                identifier: _url,
+                type: COG_LAYER_TYPE,
+                sources: [{url: _url}],
+                options: service.options || {}
+            };
+            return LayerUtils.getLayerConfig({url: _url, layer, controller})
+                .then(lyr => {
+                    const records = [lyr];
+                    return {
+                        numberOfRecordsMatched: 1,
+                        numberOfRecordsReturned: 1,
+                        records
+                    };
+                }).catch(() => ({...layer}));
+        }
         return searchAndPaginate(_layers, startPosition, maxRecords, text);
     });
 };

web/client/epics/catalog.js

@@ -176,7 +176,7 @@ export default (API) => ({
                         const layerOptionsParam = get(options, i, searchOptionsSelector(state));
                         // use the selected layer text as title for 3d tiles
                         // because currently we get only a single record for this service type
-                        const layerOptions = format === '3dtiles' || format === 'geojson'
+                        const layerOptions = format === '3dtiles' || format === 'geojson' || format === 'cog'
                             ? {
                                 ...layerOptionsParam,
                                 title: isObject(layerOptionsParam?.title)