Update README.md files (#70)

* update documentation

* update homepage resource types list and resource enpoint

* update client bundle

geonode_mapstore_client/client/README.md

@@ -1,30 +1,45 @@
-# MapStore GeoNode client
-
-## Development setup
-
-Start the development application locally:
-
-- create a `env.json` file in `geonode_mapstore_client/client` directory with needed variables
-```js
-// env.json file
-{
-    "DEV_SERVER_HOST": "eg: my-geonode-host.org"
-}
-```
-- `npm install`
-- `npm start`
-
-The application runs at `https://localhost:8081` afterwards.
-
-Note: localhost uses `https` protocol to connect a remote GeoNode instance
-
-## Compile bundle
-
-- `npm run compile`
-
-or run `build.sh` for the complete build process
-
-## Tools
-
-- node v12.14.1
-- npm 6.13.4
+# GeoNode MapStore Client Project
+
+This directory is the root folder where to initialize all the npm scripts. See the main [README.md](../../README.md) for more information about this directory.
+
+This project contains following applications:
+
+- [MapStore js API](#mapStore-js-api)
+- [GeoStory](#geostory)
+- [Homepage](#homepage)
+
+## MapStore js API
+Api used inside django templates to show map and layer viewers
+
+## GeoStory
+This application allow to show and edit stories with map and geospatial data
+## Homepage
+
+This single application is an alternative homepage that interact with the GeoNode API v2 and shows available resources. You can enable this app by replacing the content of the index.html of a GeoNode project with the [home.html](home.html) template.
+
+The homepage configuration file is located in [localConfig.json](static/mapstore/configs/localConfig.json) and it exposes specific properties to customize the homepage theme and structure:
+
+- @prop {object} `geoNodeApi`
+- @prop {object} `supportedLocales`
+- @prop {object} `geoNodeConfiguration`
+- @prop {object} geoNodeConfiguration.`theme`
+  - @prop {object} geoNodeConfiguration.`theme.variant`
+  - @prop {object} geoNodeConfiguration.`theme.navbar`
+  - @prop {object} geoNodeConfiguration.`theme.hero`
+  - @prop {object} geoNodeConfiguration.`theme...`
+- @prop {object} geoNodeConfiguration.`filters`
+  - @prop {object} geoNodeConfiguration.`filters.fields`
+  - @prop {object} geoNodeConfiguration.`filters.fields.options`
+  - @prop {object} geoNodeConfiguration.`filters.order`
+  - @prop {object} geoNodeConfiguration.`filters.order.defaultLabelId`
+  - @prop {object} geoNodeConfiguration.`filters.order.options`
+  - @prop {object} geoNodeConfiguration.`filters.extent`
+  - @prop {object} geoNodeConfiguration.`filters.extent.layers`
+  - @prop {object} geoNodeConfiguration.`filters.extent.style`
+- @prop {object} geoNodeConfiguration.`navbar`
+  - @prop {object} geoNodeConfiguration.`navbar.logo`
+  - @prop {object} geoNodeConfiguration.`navbar.items`
+- @prop {object} geoNodeConfiguration.`menu`
+  - @prop {object} geoNodeConfiguration.`menu.items`
+- @prop {object} geoNodeConfiguration.`footer`
+  - @prop {object} geoNodeConfiguration.`footer.items`

geonode_mapstore_client/client/js/api.js

@@ -68,7 +68,7 @@ window.initMapstore2Api = function(config, resolve) {
         setSupportedLocales(locale);
     };
     // Note: maptype is provided by the page template
-    import(`./components/${maptype}/ArcGisMapServer`) // eslint-disable-line
+    import('./components/' + maptype + '/ArcGisMapServer') // eslint-disable-line
         .then(() => {
             if (config === 'preview') {
                 import('./previewPlugins')

geonode_mapstore_client/client/js/api/geonode/v2/index.js

@@ -18,25 +18,28 @@ import isString from 'lodash/isString';
 import castArray from 'lodash/castArray';
 import { getUserInfo } from '@js/api/geonode/v1';
 import { getConfigProp } from '@mapstore/framework/utils/ConfigUtils';
+import { setFilterById } from '@js/utils/GNSearchUtils';
 
 let endpoints = {
     // default values
-    'base_resources': '/api/v2/base_resources',
+    'resources': '/api/v2/resources',
     'documents': '/api/v2/documents',
     'layers': '/api/v2/layers',
     'maps': '/api/v2/maps',
     'geoapps': '/api/v2/geoapps',
     'geostories': '/api/v2/geostories',
-    'users': '/api/v2/users'
+    'users': '/api/v2/users',
+    'resource_types': '/api/v2/resources/resource_types'
 };
 
-const RESOURCES = 'base_resources';
+const RESOURCES = 'resources';
 const DOCUMENTS = 'documents';
 // const LAYERS = 'layers';
 const MAPS = 'maps';
 const GEOAPPS = 'geoapps';
 const GEOSTORIES = 'geostories';
 const USERS = 'users';
+const RESOURCE_TYPES = 'resource_types';
 // const GROUPS = 'groups';
 
 const requestOptions = (name, requestFunc) => {
@@ -77,7 +80,7 @@ function addQueryString(requestUrl, params) {
 }
 
 export const setEndpoints = (data) => {
-    endpoints = data;
+    endpoints = { ...endpoints, ...data };
 };
 
 export const getEndpoints = () => {
@@ -279,6 +282,31 @@ export const getConfiguration = (configUrl) => {
         });
 };
 
+
+let availableResourceTypes;
+export const getResourceTypes = ({}, filterKey = 'resource-types') => {
+    if (availableResourceTypes) {
+        return new Promise(resolve => resolve(availableResourceTypes));
+    }
+    return axios.get(parseDevHostname(endpoints[RESOURCE_TYPES]))
+        .then(({ data }) => {
+            availableResourceTypes = (data?.resource_types || [])
+                .map((value) => {
+                    const selectOption = {
+                        value: value,
+                        label: value
+                    };
+                    const resourceType = {
+                        value,
+                        selectOption
+                    };
+                    setFilterById(filterKey + value, resourceType);
+                    return resourceType;
+                });
+            return [...availableResourceTypes];
+        });
+};
+
 export default {
     getEndpoints,
     getResources,
@@ -290,5 +318,6 @@ export default {
     getDocumentsByDocType,
     getUserByPk,
     getAccountInfo,
-    getConfiguration
+    getConfiguration,
+    getResourceTypes
 };

geonode_mapstore_client/client/js/components/home/DetailsPanel.jsx

@@ -67,7 +67,7 @@ function DetailsPanel({
         embed,
         icon,
         name
-    } = resource && (types[resource.doc_type] || types[resource.polymorphic_ctype]) || {};
+    } = resource && (types[resource.doc_type] || types[resource.resource_type]) || {};
     const embedUrl = embed && embed.replace('{pk}', resource.pk);
 
     return (

geonode_mapstore_client/client/js/components/home/ResourceCard.jsx

@@ -26,7 +26,7 @@ const ResourceCard = forwardRef(({
 
     const res = data;
     const types = getTypesInfo();
-    const { icon } = types[res.doc_type] || types[res.polymorphic_ctype] || {};
+    const { icon } = types[res.doc_type] || types[res.resource_type] || {};
     return (
         <Card
             ref={ref}
@@ -35,7 +35,7 @@ const ResourceCard = forwardRef(({
             <a
                 className="gn-resource-card-link"
                 href={formatHref({
-                    pathname: `/search/${res.polymorphic_ctype}/${res.pk}`
+                    pathname: `/search/${res.resource_type}/${res.pk}`
                 })}
             />
             <Card.Img
@@ -49,7 +49,7 @@ const ResourceCard = forwardRef(({
                             <Tag
                                 href={formatHref({
                                     query: {
-                                        'filter{polymorphic_ctype_id.in}': res.polymorphic_ctype_id
+                                        'filter{resource_type.in}': res.resource_type
                                     }
                                 })}>
                                 <FaIcon name={icon} />

geonode_mapstore_client/client/js/routes/Home.jsx

@@ -46,6 +46,7 @@ import {
     getRegions,
     getOwners
 } from '@js/api/geonode/v1';
+import { getResourceTypes } from '@js/api/geonode/v2';
 
 const DEFAULT_SUGGESTIONS = [];
 const DEFAULT_RESOURCES = [];
@@ -113,6 +114,15 @@ const ConnectedDetailsPanel = connect(
 )(DetailsPanel);
 
 const suggestionsRequestTypes = {
+    resourceTypes: {
+        filterKey: 'filter{resource_type.in}',
+        loadOptions: (q, params) => getResourceTypes({ ...params, q }, 'filter{resource_type.in}')
+            .then(results => ({
+                options: results
+                    .map(({ selectOption }) => selectOption)
+            }))
+            .catch(() => null)
+    },
     categories: {
         filterKey: 'filter{category.identifier.in}',
         loadOptions: (q, params) => getCategories({ ...params, q }, 'filter{category.identifier.in}')

geonode_mapstore_client/client/js/utils/GNSearchUtils.js

@@ -79,7 +79,7 @@ export const getResourceTypesInfo = () => ({
         icon: 'file',
         name: 'Document'
     },
-    'geo story': {
+    'geostory': {
         icon: 'book-open',
         embed: '/apps/{pk}/embed',
         name: 'GeoStory'

geonode_mapstore_client/client/package.json

@@ -21,18 +21,25 @@
     "start": "mapstore-project start geonode",
     "test": "mapstore-project test geonode",
     "test:watch": "mapstore-project test:watch geonode",
-    "update-project": "mapstore-project update geonode"
+    "update-project": "mapstore-project update geonode",
+    "lint": "eslint js --ext .jsx,.js"
   },
   "author": "GeoSolutions",
   "license": "BSD-2-Clause",
   "devDependencies": {
-    "@mapstore/project": "git+https://github.com/geosolutions-it/mapstore-project.git#30ac4deb06bfd71d5078a3171463eaab3990bd91"
+    "@mapstore/project": "1.0.1"
   },
   "dependencies": {
     "@fortawesome/fontawesome-free": "5.15.1",
     "bootstrap-v4": "npm:[email protected]",
     "js-cookie": "2.2.1",
     "mapstore": "file:MapStore2",
     "react-bootstrap-v1": "npm:[email protected]"
+  },
+  "geonode": {
+    "devServer": {
+      "host": "localhost:8000",
+      "protocol": "http"
+    }
   }
 }

geonode_mapstore_client/client/static/mapstore/configs/localConfig.json

@@ -62,16 +62,10 @@
             "fields": {
                 "options": [
                     {
-                        "id": "polymorphic_ctype_id",
                         "labelId": "gnhome.resourceTypes",
                         "placeholderId": "gnhome.resourceTypesPlaceholder",
                         "type": "select",
-                        "options": [
-                            "58",
-                            "52",
-                            "57",
-                            "62"
-                        ]
+                        "suggestionsRequestKey": "resourceTypes"
                     },
                     {
                         "labelId": "gnhome.categories",

geonode_mapstore_client/client/version.txt

@@ -1 +1 @@
-geonode-mapstore-client-v2.0.9-e6216cdd9cb80d3a15602ea9382af23f117c2ddf
+geonode-mapstore-client-v2.0.9-a2da04d3491f9e5b7c15d4e426e083f21b40ac88

geonode_mapstore_client/static/mapstore/configs/localConfig.json

@@ -62,16 +62,10 @@
             "fields": {
                 "options": [
                     {
-                        "id": "polymorphic_ctype_id",
                         "labelId": "gnhome.resourceTypes",
                         "placeholderId": "gnhome.resourceTypesPlaceholder",
                         "type": "select",
-                        "options": [
-                            "58",
-                            "52",
-                            "57",
-                            "62"
-                        ]
+                        "suggestionsRequestKey": "resourceTypes"
                     },
                     {
                         "labelId": "gnhome.categories",

geonode_mapstore_client/static/mapstore/version.txt

@@ -1 +1 @@
-geonode-mapstore-client-v2.0.9-e6216cdd9cb80d3a15602ea9382af23f117c2ddf
+geonode-mapstore-client-v2.0.9-a2da04d3491f9e5b7c15d4e426e083f21b40ac88