From f93bdb29ffb2a1e1972666948ae6c8499c046ab4 Mon Sep 17 00:00:00 2001 From: allyoucanmap Date: Wed, 14 Oct 2020 12:12:22 +0200 Subject: [PATCH] replace save and saveAs plugin with custom ones to improve the saving workflow --- .../client/js/actions/gnresource.js | 48 ++++ .../client/js/actions/gnsave.js | 57 +++++ .../client/js/api/geonode/adapter/index.js | 40 ++++ .../client/js/api/geonode/v2/index.js | 29 +++ .../client/js/epics/gnsave.js | 136 +++++++++++ geonode_mapstore_client/client/js/plugins.js | 4 +- .../client/js/plugins/Save.jsx | 89 ++++++++ .../client/js/plugins/SaveAs.jsx | 92 ++++++++ .../client/js/plugins/save/SaveModal.jsx | 212 ++++++++++++++++++ .../client/js/reducers/gnresource.js | 54 +++++ .../client/js/reducers/gnsave.js | 43 ++++ .../client/js/utils/APIUtils.js | 25 +++ .../client/prod-webpack.config.js | 15 +- .../client/webpack.config.js | 13 +- 14 files changed, 847 insertions(+), 10 deletions(-) create mode 100644 geonode_mapstore_client/client/js/actions/gnresource.js create mode 100644 geonode_mapstore_client/client/js/actions/gnsave.js create mode 100644 geonode_mapstore_client/client/js/api/geonode/adapter/index.js create mode 100644 geonode_mapstore_client/client/js/api/geonode/v2/index.js create mode 100644 geonode_mapstore_client/client/js/epics/gnsave.js create mode 100644 geonode_mapstore_client/client/js/plugins/Save.jsx create mode 100644 geonode_mapstore_client/client/js/plugins/SaveAs.jsx create mode 100644 geonode_mapstore_client/client/js/plugins/save/SaveModal.jsx create mode 100644 geonode_mapstore_client/client/js/reducers/gnresource.js create mode 100644 geonode_mapstore_client/client/js/reducers/gnsave.js create mode 100644 geonode_mapstore_client/client/js/utils/APIUtils.js diff --git a/geonode_mapstore_client/client/js/actions/gnresource.js b/geonode_mapstore_client/client/js/actions/gnresource.js new file mode 100644 index 0000000000..21abfc9f6b --- /dev/null +++ b/geonode_mapstore_client/client/js/actions/gnresource.js @@ -0,0 +1,48 @@ +/* + * Copyright 2020, GeoSolutions Sas. + * All rights reserved. + * + * This source code is licensed under the BSD-style license found in the + * LICENSE file in the root directory of this source tree. +*/ + +export const RESOURCE_LOADING = 'GEONODE:RESOURCE_LOADING'; +export const SET_RESOURCE = 'GEONODE:SET_RESOURCE'; +export const RESOURCE_ERROR = 'GEONODE:RESOURCE_ERROR'; +export const UPDATE_RESOURCE_PROPERTIES = 'GEONODE:UPDATE_RESOURCE_PROPERTIES'; +export const SET_RESOURCE_TYPE = 'GEONODE:SET_RESOURCE_TYPE'; + +export function resourceLoading() { + return { + type: RESOURCE_LOADING + }; +} + +export function setResource(data) { + return { + type: SET_RESOURCE, + data + }; +} + +export function setResourceType(resourceType) { + return { + type: SET_RESOURCE_TYPE, + resourceType + }; +} + + +export function resourceError(error) { + return { + type: RESOURCE_ERROR, + error + }; +} + +export function updateResourceProperties(properties) { + return { + type: UPDATE_RESOURCE_PROPERTIES, + properties + }; +} diff --git a/geonode_mapstore_client/client/js/actions/gnsave.js b/geonode_mapstore_client/client/js/actions/gnsave.js new file mode 100644 index 0000000000..ea43f0bb0b --- /dev/null +++ b/geonode_mapstore_client/client/js/actions/gnsave.js @@ -0,0 +1,57 @@ +/* + * Copyright 2020, GeoSolutions Sas. + * All rights reserved. + * + * This source code is licensed under the BSD-style license found in the + * LICENSE file in the root directory of this source tree. +*/ + +export const SAVING_RESOURCE = 'GEONODE:SAVING_RESOURCE'; +export const SAVE_SUCCESS = 'GEONODE:SAVE_SUCCESS'; +export const SAVE_ERROR = 'GEONODE:SAVE_ERROR'; +export const CLEAR_SAVE = 'GEONODE:CLEAR_SAVE'; +export const SAVE_CONTENT = 'GEONODE:SAVE_CONTENT'; +export const UPDATE_RESOURCE_BEFORE_SAVE = 'GEONODE:UPDATE_RESOURCE_BEFORE_SAVE'; + +export function savingResource() { + return { + type: SAVING_RESOURCE + }; +} + +export function saveSuccess(success) { + return { + type: SAVE_SUCCESS, + success + }; +} + +export function saveError(error) { + return { + type: SAVE_ERROR, + error + }; +} + +export function clearSave(error) { + return { + type: CLEAR_SAVE, + error + }; +} + +export function saveContent(metadata, id) { + return { + type: SAVE_CONTENT, + metadata, + id + }; +} + +export function updateResourceBeforeSave(id) { + return { + type: UPDATE_RESOURCE_BEFORE_SAVE, + id + }; +} + diff --git a/geonode_mapstore_client/client/js/api/geonode/adapter/index.js b/geonode_mapstore_client/client/js/api/geonode/adapter/index.js new file mode 100644 index 0000000000..8a01a7ae18 --- /dev/null +++ b/geonode_mapstore_client/client/js/api/geonode/adapter/index.js @@ -0,0 +1,40 @@ +/* + * Copyright 2020, GeoSolutions Sas. + * All rights reserved. + * + * This source code is licensed under the BSD-style license found in the + * LICENSE file in the root directory of this source tree. + */ + +import axios from '@mapstore/framework/libs/ajax'; +import { getConfigProp } from '@mapstore/framework/utils/ConfigUtils'; +import { parseDevHostname } from '@js/utils/APIUtils'; + +export const creatMapStoreMap = (body = {}) => { + const baseUrl = getConfigProp('genode_rest_api') || '/mapstore/rest/'; + return axios.post(parseDevHostname(`${baseUrl}resources/`), + body, + { + timeout: 10000, + params: { + full: true + } + }) + .then(({ data }) => data); +}; + +export const updateMapStoreMap = (id, body = {}) => { + const baseUrl = getConfigProp('genode_rest_api') || '/mapstore/rest/'; + return axios.patch(parseDevHostname(`${baseUrl}resources/${id}/`), + body, + { + params: { + full: true + } + }) + .then(({ data }) => data); +}; + +export default { + creatMapStoreMap +}; diff --git a/geonode_mapstore_client/client/js/api/geonode/v2/index.js b/geonode_mapstore_client/client/js/api/geonode/v2/index.js new file mode 100644 index 0000000000..254282b433 --- /dev/null +++ b/geonode_mapstore_client/client/js/api/geonode/v2/index.js @@ -0,0 +1,29 @@ +/* + * Copyright 2020, GeoSolutions Sas. + * All rights reserved. + * + * This source code is licensed under the BSD-style license found in the + * LICENSE file in the root directory of this source tree. + */ + +import axios from '@mapstore/framework/libs/ajax'; +import { parseDevHostname } from '@js/utils/APIUtils'; + +let endpoints = { + 'base_resources': '/api/v2/base_resources' +}; + +const RESOURCES = 'base_resources'; +// const GROUPS = 'groups'; +// const LAYERS = 'layers'; +// const MAPS = 'maps'; +// const USERS = 'users'; + +export const getResourceByPk = (pk) => { + return axios.get(parseDevHostname(`${endpoints[RESOURCES]}/${pk}`)) + .then(({ data }) => data.resource); +}; + +export default { + getResourceByPk +}; diff --git a/geonode_mapstore_client/client/js/epics/gnsave.js b/geonode_mapstore_client/client/js/epics/gnsave.js new file mode 100644 index 0000000000..cd696c7f82 --- /dev/null +++ b/geonode_mapstore_client/client/js/epics/gnsave.js @@ -0,0 +1,136 @@ +/* + * Copyright 2020, GeoSolutions Sas. + * All rights reserved. + * + * This source code is licensed under the BSD-style license found in the + * LICENSE file in the root directory of this source tree. + */ + +import { Observable } from 'rxjs'; +import { mapSelector } from '@mapstore/framework/selectors/map'; +import { layersSelector, groupsSelector } from '@mapstore/framework/selectors/layers'; +import { backgroundListSelector } from '@mapstore/framework/selectors/backgroundselector'; +import { mapOptionsToSaveSelector } from '@mapstore/framework/selectors/mapsave'; +import { textSearchConfigSelector, bookmarkSearchConfigSelector } from '@mapstore/framework/selectors/searchconfig'; +import { saveMapConfiguration } from '@mapstore/framework/utils/MapUtils'; +import { getConfigProp } from '@mapstore/framework/utils/ConfigUtils'; +import { + creatMapStoreMap, + updateMapStoreMap +} from '@js/api/geonode/adapter'; +import { + SAVE_CONTENT, + UPDATE_RESOURCE_BEFORE_SAVE, + saveSuccess, + saveError, + savingResource +} from '@js/actions/gnsave'; +import { + resourceLoading, + setResource, + resourceError, + updateResourceProperties +} from '@js/actions/gnresource'; +import { getResourceByPk } from '@js/api/geonode/v2'; + +const SaveAPI = { + map: (state, metadata, id) => { + const map = mapSelector(state); + const layers = layersSelector(state); + const groups = groupsSelector(state); + const backgrounds = backgroundListSelector(state); + const textSearchConfig = textSearchConfigSelector(state); + const bookmarkSearchConfig = bookmarkSearchConfigSelector(state); + const additionalOptions = mapOptionsToSaveSelector(state); + const data = saveMapConfiguration( + map, + layers, + groups, + backgrounds, + textSearchConfig, + bookmarkSearchConfig, + additionalOptions + ); + const name = metadata.name; + const description = metadata.description; + const thumbnail = metadata.thumbnail; + const body = { + name, + data, + attributes: [{ + type: 'string', + name: 'title', + value: name, + label: 'Title' + }, + { + type: 'string', + name: 'abstract', + value: description, + label: 'Abstract' + }, + ...(thumbnail + ? [{ + type: 'string', + name: 'thumbnail', + value: thumbnail, + label: 'Thumbnail' + }] + : []) + ] + }; + return id + ? updateMapStoreMap(id, { ...body, id }) + : creatMapStoreMap(body) + .then((response) => { + window.location.href = `${getConfigProp('geonode_url')}maps/${response.id}/edit`; + return response.data; + }); + } +}; + +export const gnSaveContent = (action$, store) => + action$.ofType(SAVE_CONTENT) + .switchMap((action) => { + const state = store.getState(); + const contentType = state.gnresource?.type || 'map'; + return Observable.defer(() => SaveAPI[contentType](state, action.metadata, action.id)) + .switchMap((response) => { + return Observable.of( + saveSuccess(response), + updateResourceProperties({ + 'title': action.metadata.name, + 'abstract': action.metadata.description, + 'thumbnail_url': action.metadata.thumbnail + }) + ); + }) + .catch((error) => { + return Observable.of(saveError(error.data || error.message)); + }) + .startWith(savingResource()); + }); + +export const gnUpdateResource = (action$, store) => + action$.ofType(UPDATE_RESOURCE_BEFORE_SAVE) + .switchMap((action) => { + const state = store.getState(); + const currentResource = state.gnresource?.data || {}; + if ( !action.id + || currentResource.pk && action.id && currentResource.pk + '' === action.id + '') { + return Observable.empty(); + } + return Observable.defer(() => getResourceByPk(action.id)) + .switchMap((resource) => { + return Observable.of(setResource(resource)); + }) + .catch((error) => { + return Observable.of(resourceError(error.data || error.message)); + }) + .startWith(resourceLoading()); + }); + +export default { + gnSaveContent, + gnUpdateResource +}; diff --git a/geonode_mapstore_client/client/js/plugins.js b/geonode_mapstore_client/client/js/plugins.js index df0ed048a8..9e4d079f9e 100644 --- a/geonode_mapstore_client/client/js/plugins.js +++ b/geonode_mapstore_client/client/js/plugins.js @@ -39,8 +39,8 @@ module.exports = { NotificationsPlugin: require('../MapStore2/web/client/plugins/Notifications'), FeatureEditorPlugin: require('../MapStore2/web/client/plugins/FeatureEditor').default, QueryPanelPlugin: require('../MapStore2/web/client/plugins/QueryPanel'), - SavePlugin: require('../MapStore2/web/client/plugins/Save').default, - SaveAsPlugin: require('../MapStore2/web/client/plugins/SaveAs').default, + SavePlugin: require('@js/plugins/Save').default, + SaveAsPlugin: require('@js/plugins/SaveAs').default, MetadataExplorerPlugin: require('../MapStore2/web/client/plugins/MetadataExplorer'), GridContainerPlugin: require('../MapStore2/web/client/plugins/GridContainer'), StyleEditorPlugin: require('../MapStore2/web/client/plugins/StyleEditor'), diff --git a/geonode_mapstore_client/client/js/plugins/Save.jsx b/geonode_mapstore_client/client/js/plugins/Save.jsx new file mode 100644 index 0000000000..73005e55f2 --- /dev/null +++ b/geonode_mapstore_client/client/js/plugins/Save.jsx @@ -0,0 +1,89 @@ +/* + * Copyright 2020, GeoSolutions Sas. + * All rights reserved. + * + * This source code is licensed under the BSD-style license found in the + * LICENSE file in the root directory of this source tree. + */ + +import React from 'react'; +import { connect } from 'react-redux'; +import { createSelector } from 'reselect'; +import { createPlugin } from '@mapstore/framework/utils/PluginsUtils'; +import {toggleControl} from '@mapstore/framework/actions/controls'; +import Message from '@mapstore/framework/components/I18N/Message'; +import { Glyphicon } from 'react-bootstrap'; +import { mapInfoSelector } from '@mapstore/framework/selectors/map'; +import { + saveContent, + clearSave, + updateResourceBeforeSave +} from '@js/actions/gnsave'; +import { isLoggedIn } from '@mapstore/framework/selectors/security'; +import gnresource from '@js/reducers/gnresource'; +import gnsave from '@js/reducers/gnsave'; +import gnsaveEpics from '@js/epics/gnsave'; +import SaveModal from '@js/plugins/save/SaveModal'; + +function Save(props) { + return ( + + ); +} + +const SavePlugin = connect( + createSelector([ + state => state?.controls?.save?.enabled, + mapInfoSelector, + state => state?.gnresource?.data, + state => state?.gnresource?.loading, + state => state?.gnsave?.saving, + state => state?.gnsave?.error, + state => state?.gnsave?.success + ], (enabled, mapInfo, resource, loading, saving, error, success) => ({ + enabled, + contentId: mapInfo?.id, + resource, + loading, + saving, + error, + success + })), + { + onClose: toggleControl.bind(null, 'save', null), + onInit: updateResourceBeforeSave, + onSave: saveContent, + onClear: clearSave + } +)(Save); + +export default createPlugin('Save', { + component: SavePlugin, + containers: { + BurgerMenu: { + name: 'save', + position: 30, + text: , + icon: , + action: toggleControl.bind(null, 'save', null), + selector: createSelector( + isLoggedIn, + mapInfoSelector, + (loggedIn, { canEdit, id } = {}) => ({ + style: loggedIn && id && canEdit ? {} : { display: 'none' } + }) + ) + } + }, + epics: { + ...gnsaveEpics + }, + reducers: { + gnresource, + gnsave + } +}); diff --git a/geonode_mapstore_client/client/js/plugins/SaveAs.jsx b/geonode_mapstore_client/client/js/plugins/SaveAs.jsx new file mode 100644 index 0000000000..59b5fd7960 --- /dev/null +++ b/geonode_mapstore_client/client/js/plugins/SaveAs.jsx @@ -0,0 +1,92 @@ +/* + * Copyright 2020, GeoSolutions Sas. + * All rights reserved. + * + * This source code is licensed under the BSD-style license found in the + * LICENSE file in the root directory of this source tree. + */ + +import React from 'react'; +import { connect } from 'react-redux'; +import { createSelector } from 'reselect'; +import indexOf from 'lodash/indexOf'; +import { createPlugin } from '@mapstore/framework/utils/PluginsUtils'; +import {toggleControl} from '@mapstore/framework/actions/controls'; +import Message from '@mapstore/framework/components/I18N/Message'; +import { Glyphicon } from 'react-bootstrap'; +import { mapInfoSelector } from '@mapstore/framework/selectors/map'; +import { isLoggedIn } from '@mapstore/framework/selectors/security'; +import { + saveContent, + clearSave, + updateResourceBeforeSave +} from '@js/actions/gnsave'; + +import gnresource from '@js/reducers/gnresource'; +import gnsave from '@js/reducers/gnsave'; +import gnsaveEpics from '@js/epics/gnsave'; +import SaveModal from '@js/plugins/save/SaveModal'; + +function SaveAs(props) { + return ( + + ); +} + +const SaveAsPlugin = connect( + createSelector([ + state => state?.controls?.saveAs?.enabled, + mapInfoSelector, + state => state?.gnresource?.data, + state => state?.gnresource?.loading, + state => state?.gnsave?.saving, + state => state?.gnsave?.error, + state => state?.gnsave?.success + ], (enabled, mapInfo, resource, loading, saving, error, success) => ({ + enabled, + contentId: mapInfo?.id, + resource, + loading, + saving, + error, + success + })), + { + onClose: toggleControl.bind(null, 'saveAs', null), + onInit: updateResourceBeforeSave, + onSave: saveContent, + onClear: clearSave + } +)(SaveAs); + +export default createPlugin('SaveAs', { + component: SaveAsPlugin, + containers: { + BurgerMenu: { + name: 'saveAs', + position: 30, + text: , + icon: , + action: toggleControl.bind(null, 'saveAs', null), + selector: (state) => { + if (state?.controls?.saveAs?.allowedRoles) { + return indexOf( + state.controls.saveAs.allowedRoles, + state && state.security && state.security.user && state.security.user.role) !== -1 + ? {} : { style: { display: 'none' } }; + } + return { style: isLoggedIn(state) ? {} : { display: 'none' } }; + } + } + }, + epics: { + ...gnsaveEpics + }, + reducers: { + gnresource, + gnsave + } +}); diff --git a/geonode_mapstore_client/client/js/plugins/save/SaveModal.jsx b/geonode_mapstore_client/client/js/plugins/save/SaveModal.jsx new file mode 100644 index 0000000000..ad3e60603a --- /dev/null +++ b/geonode_mapstore_client/client/js/plugins/save/SaveModal.jsx @@ -0,0 +1,212 @@ +/* + * Copyright 2020, GeoSolutions Sas. + * All rights reserved. + * + * This source code is licensed under the BSD-style license found in the + * LICENSE file in the root directory of this source tree. + */ + +import React, { useState, useEffect, useRef } from 'react'; +import PropTypes from 'prop-types'; +import ResizableModal from '@mapstore/framework/components/misc/ResizableModal'; +import Thumbnail from '@mapstore/framework/components/misc/Thumbnail'; +import Message from '@mapstore/framework/components/I18N/Message'; +import { Form, FormGroup, ControlLabel, FormControl as FormControlRB, Alert } from 'react-bootstrap'; +import localizedProps from '@mapstore/framework/components/misc/enhancers/localizedProps'; +import Loader from '@mapstore/framework/components/misc/Loader'; +const FormControl = localizedProps('placeholder')(FormControlRB); + +function SaveModal({ + update, + error, + success, + labelId, + resource, + contentId, + saving, + loading, + enabled, + onClose, + onSave, + onInit, + onClear +}) { + + const [thumbnail, setThumbnail] = useState(); + const [thumbnailError, setThumbnailError] = useState(); + const [name, setName] = useState(''); + const [description, setDescription] = useState(''); + const [nameValidation, setNameValidation] = useState(false); + + const state = useRef(); + state.current = { + contentId, + resource + }; + + useEffect(() => { + if (enabled) { + onInit(state.current.contentId); + } else { + onClear(); + } + }, [ enabled ]); + + useEffect(() => { + if (!loading) { + const res = state.current.resource || {}; + setThumbnail(res.thumbnail_url); + setName(res.title); + setDescription(res.abstract); + setThumbnailError(false); + setNameValidation(!res.title + ? 'error' + : undefined); + } + }, [ enabled, loading ]); + + const isLoading = loading || saving; + + return ( + } + show={enabled} + fitContent + clickOutEnabled={false} + buttons={isLoading + ? [] + : [ + { + text: , + onClick: () => onClose() + }, + { + text: , + disabled: !!nameValidation, + onClick: () => onSave({ + thumbnail, + name, + description + }, update ? contentId : undefined) + } + ]} + onClose={isLoading ? null : () => onClose()} + > + {error && +
+ } + {success && +
+ } +
+ + + + + } + onUpdate={(data) => { + setThumbnail(data); + setThumbnailError(false); + }} + onError={(newThumbnailError) => { + setThumbnailError(newThumbnailError); + }} + /> + {thumbnailError &&
+
+
{thumbnailError.indexOf && thumbnailError.indexOf('FORMAT') !== -1 && }
+
{thumbnailError.indexOf && thumbnailError.indexOf('SIZE') !== -1 && }
+
} + + + + + + { + setName(event.target.value); + setNameValidation(!event.target.value + ? 'error' + : undefined); + }} + onBlur={(event) => { + setNameValidation(!event.target.value + ? 'error' + : undefined + ); + }} + /> + + + + + + setDescription(event.target.value)} + /> + +
+ {isLoading &&
+ +
} + + ); +} + +SaveModal.propTypes = { + update: PropTypes.bool, + labelId: PropTypes.string, + contentId: PropTypes.oneOfType([ PropTypes.string, PropTypes.number ]), + resource: PropTypes.object, + loading: PropTypes.bool, + enabled: PropTypes.bool, + onClose: PropTypes.func, + onSave: PropTypes.func, + onInit: PropTypes.func, + onClear: PropTypes.func, + error: PropTypes.oneOfType([ PropTypes.string, PropTypes.object ]), + success: PropTypes.oneOfType([ PropTypes.string, PropTypes.object ]) +}; + +SaveModal.defaultProps = { + update: false, + resource: {}, + loading: false, + enabled: false, + onClose: () => {}, + onSave: () => {}, + onInit: () => {}, + onClear: () => {} +}; + +export default SaveModal; diff --git a/geonode_mapstore_client/client/js/reducers/gnresource.js b/geonode_mapstore_client/client/js/reducers/gnresource.js new file mode 100644 index 0000000000..e6bdc39c8a --- /dev/null +++ b/geonode_mapstore_client/client/js/reducers/gnresource.js @@ -0,0 +1,54 @@ +/* + * Copyright 2020, GeoSolutions Sas. + * All rights reserved. + * + * This source code is licensed under the BSD-style license found in the + * LICENSE file in the root directory of this source tree. +*/ + +import { + RESOURCE_LOADING, + SET_RESOURCE, + RESOURCE_ERROR, + UPDATE_RESOURCE_PROPERTIES +} from '@js/actions/gnresource'; + +function gnresource(state = {}, action) { + switch (action.type) { + case RESOURCE_LOADING: { + return { + ...state, + loading: true + }; + } + case SET_RESOURCE: { + return { + ...state, + error: null, + data: action.data, + loading: false + }; + } + case RESOURCE_ERROR: { + return { + ...state, + data: null, + error: action.error, + loading: false + }; + } + case UPDATE_RESOURCE_PROPERTIES: { + return { + ...state, + data: { + ...state.data, + ...action.properties + } + }; + } + default: + return state; + } +} + +export default gnresource; diff --git a/geonode_mapstore_client/client/js/reducers/gnsave.js b/geonode_mapstore_client/client/js/reducers/gnsave.js new file mode 100644 index 0000000000..b9a138cbfa --- /dev/null +++ b/geonode_mapstore_client/client/js/reducers/gnsave.js @@ -0,0 +1,43 @@ +/* + * Copyright 2020, GeoSolutions Sas. + * All rights reserved. + * + * This source code is licensed under the BSD-style license found in the + * LICENSE file in the root directory of this source tree. +*/ + +import { + SAVING_RESOURCE, + SAVE_SUCCESS, + SAVE_ERROR, + CLEAR_SAVE +} from '@js/actions/gnsave'; + +function gnsave(state = {}, action) { + switch (action.type) { + case SAVING_RESOURCE: { + return { + saving: true + }; + } + case SAVE_SUCCESS: { + return { + success: action.success, + saving: false + }; + } + case SAVE_ERROR: { + return { + error: action.error, + saving: false + }; + } + case CLEAR_SAVE: { + return {}; + } + default: + return state; + } +} + +export default gnsave; diff --git a/geonode_mapstore_client/client/js/utils/APIUtils.js b/geonode_mapstore_client/client/js/utils/APIUtils.js new file mode 100644 index 0000000000..01064b33b7 --- /dev/null +++ b/geonode_mapstore_client/client/js/utils/APIUtils.js @@ -0,0 +1,25 @@ +/* + * Copyright 2020, GeoSolutions Sas. + * All rights reserved. + * + * This source code is licensed under the BSD-style license found in the + * LICENSE file in the root directory of this source tree. + */ + +import url from 'url'; + +export const parseDevHostname = (requestUrl) => { + if (__DEVTOOLS__ && requestUrl.indexOf('localhost:8000') !== -1) { + const parsedUrl = url.parse(requestUrl); + return url.format({ + ...parsedUrl, + hostname: null, + host: null, + protocol: null, + port: null, + href: null, + slashes: null + }); + } + return requestUrl; +}; diff --git a/geonode_mapstore_client/client/prod-webpack.config.js b/geonode_mapstore_client/client/prod-webpack.config.js index 662d3f4076..66e8ffae42 100644 --- a/geonode_mapstore_client/client/prod-webpack.config.js +++ b/geonode_mapstore_client/client/prod-webpack.config.js @@ -6,10 +6,12 @@ const themeEntries = { }; const extractThemesPlugin = require('./MapStore2/build/themes.js').extractThemesPlugin; -module.exports = require('./MapStore2/build/buildConfig')({ +module.exports = require('./MapStore2/build/buildConfig')( + { 'ms2-geonode-api': path.join(__dirname, "js", "api") }, - themeEntries, { + themeEntries, + { base: __dirname, dist: path.join(__dirname, "../static/mapstore/dist"), framework: path.join(__dirname, "MapStore2", "web", "client"), @@ -18,5 +20,10 @@ module.exports = require('./MapStore2/build/buildConfig')({ extractThemesPlugin, true, "/static/mapstore/dist/", - '.msgapi' -); \ No newline at end of file + '.msgapi', + [], + { + '@mapstore/framework': path.resolve(__dirname, 'MapStore2', 'web', 'client'), + '@js': path.resolve(__dirname, 'js') + } +); diff --git a/geonode_mapstore_client/client/webpack.config.js b/geonode_mapstore_client/client/webpack.config.js index 30e2582dc2..2813c515b3 100644 --- a/geonode_mapstore_client/client/webpack.config.js +++ b/geonode_mapstore_client/client/webpack.config.js @@ -26,7 +26,12 @@ module.exports = assign({}, require('./MapStore2/build/buildConfig')( extractThemesPlugin, false, `/static/mapstore/dist/`, - '.msgapi' + '.msgapi', + [], + { + '@mapstore/framework': path.resolve(__dirname, 'MapStore2', 'web', 'client'), + '@js': path.resolve(__dirname, 'js') + } ), { devServer: { https: protocol === 'https' ? true : false, @@ -37,9 +42,9 @@ module.exports = assign({}, require('./MapStore2/build/buildConfig')( path.join(__dirname), path.join(__dirname, '..', 'static') ], - before: function (app) { + before: function(app) { const hashRegex = /\.[a-zA-Z0-9]{1,}\.js/; - app.use(function (req, res, next) { + app.use(function(req, res, next) { // remove hash from requests to use the local js if (req.url.indexOf('/static/geonode/js/ms2/utils/') !== -1 || req.url.indexOf('/ms2-geonode-api') !== -1) { @@ -81,4 +86,4 @@ module.exports = assign({}, require('./MapStore2/build/buildConfig')( } ] } -}); \ No newline at end of file +});