Update ArcgGis approach

django_project/frontend/src/components/ArcGisAuthorization/index.jsx

@@ -0,0 +1,47 @@
+/**
+ * GeoSight is UNICEF's geospatial web-based business intelligence platform.
+ *
+ * Contact : [email protected]
+ *
+ * .. note:: This program is free software; you can redistribute it and/or modify
+ *     it under the terms of the GNU Affero General Public License as published by
+ *     the Free Software Foundation; either version 3 of the License, or
+ *     (at your option) any later version.
+ *
+ * __author__ = '[email protected]'
+ * __date__ = '05/09/2023'
+ * __copyright__ = ('Copyright 2023, Unicef')
+ */
+
+import React from "react";
+import Cookies from "js-cookie";
+import LoginIcon from '@mui/icons-material/Login';
+
+
+/**
+ * ArcGis authorization
+ */
+
+export default function ArcGisAuthorization({ data }) {
+  const arcGisDomain = data.url.split('rest')[0]
+
+  const { authUrl, clientId } = {
+    authUrl: 'https://www.arcgis.com/sharing/rest/oauth2/authorize/',
+    clientId: 'wEv82B8xVKlg9TUv'
+  }
+
+  function onReceivedMessage(event) {
+    if (event.origin === document.location.origin) {
+      Cookies.set(arcGisDomain, event.data)
+      document.location.reload();
+    }
+  }
+
+  /** Login to arcgis **/
+  const login = () => {
+    window.open(`${authUrl}?client_id=${clientId}&redirect_uri=${document.location.origin}/arcgis-callback&response_type=token&expiration=20160`, "popup", "popup=true");
+    window.addEventListener('message', onReceivedMessage, false);
+  }
+
+  return <LoginIcon onClick={login}/>
+}

django_project/frontend/src/components/SidePanelTree/Description/index.js

@@ -22,6 +22,7 @@ import CustomPopover from "../../CustomPopover";
 import { fetchingData } from "../../../Requests";
 import { formatDateTime } from "../../../utils/main";
 import { InfoFillIcon } from "../../Icons/"
+import ArcGisAuthorization from "../../ArcGisAuthorization";
 
 import './style.scss';
 
@@ -65,9 +66,9 @@ export default function LayerDescription({ layer }) {
         setLoading(false)
       }
     )
-
   }
 
+  const contextLayerNeedLogin = layerType === LAYER_TYPE_CONTEXT_LAYER && ["token required", "invalid token."].includes(layer?.error?.toLowerCase())
   return (
     <div
       className={'LayerInfoIcon InfoIcon LayerIcon' + (layer?.error ? ' Error' : '')}>
@@ -83,12 +84,18 @@ export default function LayerDescription({ layer }) {
               horizontal: 'left',
             }}
             Button={
-              <InfoFillIcon fontSize={"small"}/>
+              contextLayerNeedLogin ?
+                <div>
+                  <ArcGisAuthorization data={layer}/>
+                </div> :
+                <InfoFillIcon fontSize={"small"}/>
             }
             showOnHover={true}
           >
             <div className='LayerInfoPopover'>
-              {layer.error}
+              {
+                contextLayerNeedLogin ? "You need to authorize to access this resource by click this icon" : layer.error
+              }
             </div>
           </CustomPopover>
           :

django_project/frontend/src/components/SidePanelTree/index.jsx

@@ -292,9 +292,11 @@ export default function SidePanelTreeView(
                 </span>
               }
             />
-            {treeData.data?.legend && selected.indexOf(nodesDataId) >= 0 ?
-              <div
-                dangerouslySetInnerHTML={{ __html: treeData.data?.legend }}></div> : ''}
+            {
+              treeData.data?.legend && selected.indexOf(nodesDataId) >= 0 ?
+                <div
+                  dangerouslySetInnerHTML={{ __html: treeData.data?.legend }}></div> : ''
+            }
           </div> : groupSelectable ?
             <FormControlLabel
               className='GroupSelectable'
@@ -310,9 +312,11 @@ export default function SidePanelTreeView(
             <Highlighted text={treeData.name ? treeData.name : 'No Name'}
                          highlight={filterText}/>
       }>
-      {Array.isArray(treeData.children)
-        ? treeData.children.map((node) => renderTree(node))
-        : null}
+      {
+        Array.isArray(treeData.children)
+          ? treeData.children.map((node) => renderTree(node))
+          : null
+      }
     </TreeItem>
   };
 

django_project/frontend/src/components/SidePanelTree/style.scss

@@ -37,6 +37,10 @@
 
       .MuiTreeItem-content {
         flex-direction: row-reverse;
+
+        &.Mui-disabled {
+          opacity: 1;
+        }
       }
     }
   }

django_project/frontend/src/pages/Dashboard/LeftPanel/ContextLayers/Layer.jsx

@@ -1,24 +1,25 @@
 /**
-* GeoSight is UNICEF's geospatial web-based business intelligence platform.
-*
-* Contact : [email protected]
-*
-* .. note:: This program is free software; you can redistribute it and/or modify
-*     it under the terms of the GNU Affero General Public License as published by
-*     the Free Software Foundation; either version 3 of the License, or
-*     (at your option) any later version.
-*
-* __author__ = '[email protected]'
-* __date__ = '13/06/2023'
-* __copyright__ = ('Copyright 2023, Unicef')
-*/
+ * GeoSight is UNICEF's geospatial web-based business intelligence platform.
+ *
+ * Contact : [email protected]
+ *
+ * .. note:: This program is free software; you can redistribute it and/or modify
+ *     it under the terms of the GNU Affero General Public License as published by
+ *     the Free Software Foundation; either version 3 of the License, or
+ *     (at your option) any later version.
+ *
+ * __author__ = '[email protected]'
+ * __date__ = '13/06/2023'
+ * __copyright__ = ('Copyright 2023, Unicef')
+ */
 
 /* ==========================================================================
    Return layer
    ========================================================================== */
 
 import React from 'react';
 
+import Cookies from "js-cookie";
 import EsriData from "../../../../utils/esri/esri-data";
 import { dictDeepCopy } from "../../../../utils/main";
 import { popupTemplate } from "../../MapLibre/Popup";
@@ -41,8 +42,9 @@ export function RasterTileLayer(
 export async function ArcgisLayer(
   layerData, layerFn, legendFn, errorFn, onEachFeature, objectFn
 ) {
+  const arcGisDomain = layerData.url.split('rest')[0]
   const options = {
-    token: layerData.token
+    token: layerData.token ? layerData.token : Cookies.get(arcGisDomain)
   };
   const esriData = new EsriData(
     layerData.name, layerData.url,

django_project/frontend/templates/frontend/arcgis_callback.html

@@ -0,0 +1,15 @@
+<!DOCTYPE html>
+<head></head>
+<body>
+<script>
+  // try to match an access token in window.location.hash
+  const match = (window.location.hash) ? window.location.hash.match(/#access_token=([^&]+)/) : false;
+  // if we found an access token in the URL pass the token up to a global function in
+  if (match[1]) {
+    const parentWindow = (window.opener && window.opener.parent) ? window.opener.parent : window
+    parentWindow.postMessage(match[1]);
+  }
+  window.close();
+</script>
+</body>
+</html>

django_project/frontend/urls/__init__.py

@@ -17,6 +17,7 @@
 from django.conf.urls import url
 from django.urls import include
 
+from frontend.views.arcgis_callback import ArcGisCallbackView
 from frontend.views.georepo_auth_failed import GeoRepoAuthFailedPageView
 from frontend.views.home import HomePageView
 from frontend.views.login import LoginPageView
@@ -44,5 +45,6 @@
     url(r'^georepo_auth_failed/', GeoRepoAuthFailedPageView.as_view(),
         name='georepo_auth_failed'),
     url(r'^admin/', include(admin_url)),
+    url(r'^arcgis-callback', ArcGisCallbackView.as_view()),
     url(r'^$', HomePageView.as_view(), name='home-view'),
 ]

django_project/frontend/views/arcgis_callback.py

@@ -0,0 +1,23 @@
+# coding=utf-8
+"""
+GeoSight is UNICEF's geospatial web-based business intelligence platform.
+
+Contact : [email protected]
+
+.. note:: This program is free software; you can redistribute it and/or modify
+    it under the terms of the GNU Affero General Public License as published by
+    the Free Software Foundation; either version 3 of the License, or
+    (at your option) any later version.
+
+"""
+__author__ = '[email protected]'
+__date__ = '05/09/2023'
+__copyright__ = ('Copyright 2023, Unicef')
+
+from django.views.generic import TemplateView
+
+
+class ArcGisCallbackView(TemplateView):
+    """ArcGisCallback View."""
+
+    template_name = 'frontend/arcgis_callback.html'