@nocobase/plugin-map 0.9.4-alpha.2 → 0.10.0-alpha.2

package/lib/client/block/MapBlock.d.ts

@@ -1 +1,2 @@
-export declare const MapBlock: (props: any) => JSX.Element;
+import React from 'react';
+export declare const MapBlock: (props: any) => React.JSX.Element;

package/lib/client/block/MapBlock.js

@@ -322,7 +322,7 @@ const MapBlockDrawer = props => {
     }
     return buf;
   }, null), [fieldSchema]);
-  return schema && _react2().default.createElement(_client().ActionContext.Provider, {
+  return schema && _react2().default.createElement(_client().ActionContextProvider, {
     value: {
       visible: !!record,
       setVisible

package/lib/client/block/MapBlockDesigner.d.ts

@@ -1 +1,2 @@
-export declare const MapBlockDesigner: () => JSX.Element;
+import React from 'react';
+export declare const MapBlockDesigner: () => React.JSX.Element;

package/lib/client/block/MapBlockInitializer.d.ts

@@ -1 +1,2 @@
-export declare const MapBlockInitializer: (props: any) => JSX.Element;
+import React from 'react';
+export declare const MapBlockInitializer: (props: any) => React.JSX.Element;

package/lib/client/block/MapBlockProvider.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
 export declare const MapBlockContext: React.Context<any>;
-export declare const MapBlockProvider: (props: any) => JSX.Element;
+export declare const MapBlockProvider: (props: any) => React.JSX.Element;
 export declare const useMapBlockContext: () => any;
 export declare const useMapBlockProps: () => any;

package/lib/client/block/utils.d.ts

@@ -53,4 +53,5 @@ export declare const createMapBlockSchema: (options: any) => import("@formily/re
     "x-editable"?: boolean;
     "x-read-only"?: boolean;
     "x-read-pretty"?: boolean;
+    "x-compile-omitted"?: string[];
 }>;

package/lib/client/components/AMap.js

@@ -61,9 +61,9 @@ function _react2() {
   };
   return data;
 }
-function _reactRouter() {
-  const data = require("react-router");
-  _reactRouter = function _reactRouter() {
+function _reactRouterDom() {
+  const data = require("react-router-dom");
+  _reactRouterDom = function _reactRouterDom() {
     return data;
   };
   return data;
@@ -152,8 +152,8 @@ const AMapComponent = _react2().default.forwardRef((props, ref) => {
   }, [props === null || props === void 0 ? void 0 : props.type, fieldSchema === null || fieldSchema === void 0 ? void 0 : fieldSchema.name]);
   const overlay = (0, _react2().useRef)();
   const _editor = (0, _react2().useRef)(null);
-  const history = (0, _reactRouter().useHistory)();
-  const id = (0, _react2().useRef)(`nocobase-map-${type}-${Date.now().toString(32)}`);
+  const navigate = (0, _reactRouterDom().useNavigate)();
+  const id = (0, _react2().useRef)(`nocobase-map-${type || ''}-${Date.now().toString(32)}`);
   const _useState5 = (0, _react2().useState)(_objectSpread({
       strokeWeight: 5,
       strokeColor: '#4e9bff',
@@ -348,7 +348,7 @@ const AMapComponent = _react2().default.forwardRef((props, ref) => {
       version: '2.0',
       plugins: ['AMap.MouseTool', 'AMap.PolygonEditor', 'AMap.PolylineEditor', 'AMap.CircleEditor']
     }).then(amap => {
-      requestIdleCallback(() => {
+      return requestIdleCallback(() => {
         map.current = new amap.Map(id.current, {
           resizeEnable: true,
           zoom
@@ -358,10 +358,14 @@ const AMapComponent = _react2().default.forwardRef((props, ref) => {
         forceUpdate([]);
       });
     }).catch(err => {
-      if (err.includes('多个不一致的 key')) {
-        setErrMessage(t('The AccessKey is incorrect, please check it'));
-      } else {
-        setErrMessage(err);
+      if (typeof err === 'string') {
+        if (err.includes('多个不一致的 key')) {
+          setErrMessage(t('The AccessKey is incorrect, please check it'));
+        } else {
+          setErrMessage(err);
+        }
+      } else if ((err === null || err === void 0 ? void 0 : err.type) === 'error') {
+        setErrMessage('Something went wrong, please refresh the page and try again');
       }
     });
     return () => {
@@ -389,7 +393,7 @@ const AMapComponent = _react2().default.forwardRef((props, ref) => {
     return _react2().default.createElement(_antd().Alert, {
       action: _react2().default.createElement(_antd().Button, {
         type: "primary",
-        onClick: () => history.push('/admin/settings/map-configuration/configuration')
+        onClick: () => navigate('/admin/settings/map-configuration/configuration')
       }, t('Go to the configuration page')),
       message: errMessage || t('Please configure the AccessKey and SecurityJsCode first'),
       type: "error"
@@ -402,7 +406,15 @@ const AMapComponent = _react2().default.forwardRef((props, ref) => {
       `,
     id: id.current,
     style: props === null || props === void 0 ? void 0 : props.style
-  }, !disabled ? _react2().default.createElement(_react2().default.Fragment, null, _react2().default.createElement(_Search.default, {
+  }, !aMap.current && _react2().default.createElement("div", {
+    className: (0, _css().css)`
+            position: absolute;
+            inset: 0;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+          `
+  }, _react2().default.createElement(_antd().Spin, null)), !disabled ? _react2().default.createElement(_react2().default.Fragment, null, _react2().default.createElement(_Search.default, {
     toCenter: toCenter,
     aMap: aMap.current
   }), _react2().default.createElement("div", {

package/lib/client/components/Configuration.d.ts

@@ -1,2 +1,3 @@
-declare const Configuration: () => JSX.Element;
+import React from 'react';
+declare const Configuration: () => React.JSX.Element;
 export default Configuration;

package/lib/client/components/Designer.d.ts

@@ -1,2 +1,3 @@
-declare const Designer: () => JSX.Element;
+import React from 'react';
+declare const Designer: () => React.JSX.Element;
 export default Designer;

package/lib/client/components/ReadPretty.d.ts

@@ -1,2 +1,3 @@
-declare const ReadPretty: (props: any) => JSX.Element;
+import React from 'react';
+declare const ReadPretty: (props: any) => React.JSX.Element;
 export default ReadPretty;

package/lib/client/components/Search.d.ts

@@ -1,6 +1,7 @@
+import React from 'react';
 interface SearchProps {
     aMap: any;
     toCenter: (p: any) => void;
 }
-declare const Search: (props: SearchProps) => JSX.Element;
+declare const Search: (props: SearchProps) => React.JSX.Element;
 export default Search;

package/lib/client/index.d.ts

@@ -1,4 +1,4 @@
 import React from 'react';
 import './locale';
-declare const _default: React.NamedExoticComponent<object>;
-export default _default;
+declare const MapProvider: React.NamedExoticComponent<object>;
+export default MapProvider;

package/lib/client/index.js

@@ -32,7 +32,7 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
 function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typeof key === "symbol" ? key : String(key); }
 function _toPrimitive(input, hint) { if (typeof input !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (typeof res !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
-var _default = _react().default.memo(props => {
+const MapProvider = _react().default.memo(props => {
   const ctx = (0, _react().useContext)(_client().CollectionManagerContext);
   const _useMapTranslation = (0, _locale.useMapTranslation)(),
     t = _useMapTranslation.t;
@@ -59,4 +59,6 @@ var _default = _react().default.memo(props => {
     })
   }, props.children))))));
 });
+MapProvider.displayName = 'MapProvider';
+var _default = MapProvider;
 exports.default = _default;

package/package.json

@@ -2,19 +2,19 @@
   "name": "@nocobase/plugin-map",
   "displayName": "Map",
   "displayName.zh-CN": "地图",
-  "version": "0.9.4-alpha.2",
+  "version": "0.10.0-alpha.2",
   "description": "Provide map fields and blocks",
   "description.zh-CN": "提供地图字段和区块",
   "license": "AGPL-3.0",
   "main": "./lib/index.js",
   "types": "./lib/index.d.ts",
   "devDependencies": {
-    "@nocobase/server": "0.9.4-alpha.2",
-    "@nocobase/test": "0.9.4-alpha.2"
+    "@nocobase/server": "0.10.0-alpha.2",
+    "@nocobase/test": "0.10.0-alpha.2"
   },
   "dependencies": {
     "@amap/amap-jsapi-loader": "^1.0.1",
     "@amap/amap-jsapi-types": "^0.0.10"
   },
-  "gitHead": "2bc19a85bf9425aa220b6c467315c8087f333a7e"
+  "gitHead": "85028ae1733fcbd46ecd5d291dacbdc175f7f073"
 }

package/src/client/block/MapBlock.tsx

@@ -1,7 +1,14 @@
 import { CheckOutlined, EnvironmentOutlined, ExpandOutlined } from '@ant-design/icons';
 import { css } from '@emotion/css';
 import { RecursionField, Schema, useFieldSchema } from '@formily/react';
-import { ActionContext, RecordProvider, useCollection, useCompile, useFilterAPI, useProps } from '@nocobase/client';
+import {
+  ActionContextProvider,
+  RecordProvider,
+  useCollection,
+  useCompile,
+  useFilterAPI,
+  useProps,
+} from '@nocobase/client';
 import { useMemoizedFn } from 'ahooks';
 import { Button, Space } from 'antd';
 import React, { useEffect, useMemo, useRef, useState } from 'react';
@@ -272,11 +279,11 @@ const MapBlockDrawer = (props) => {
 
   return (
     schema && (
-      <ActionContext.Provider value={{ visible: !!record, setVisible }}>
+      <ActionContextProvider value={{ visible: !!record, setVisible }}>
         <RecordProvider record={record}>
           <RecursionField schema={schema} name={schema.name} />
         </RecordProvider>
-      </ActionContext.Provider>
+      </ActionContextProvider>
     )
   );
 };

package/src/client/block/index.tsx

@@ -8,7 +8,7 @@ import { MapBlockInitializer } from './MapBlockInitializer';
 import { MapBlockProvider, useMapBlockProps } from './MapBlockProvider';
 
 export const MapBlockOptions: React.FC = (props) => {
-  const items = useContext(SchemaInitializerContext);
+  const items = useContext<any>(SchemaInitializerContext);
   const children = items.BlockInitializers.items[0].children;
 
   useEffect(() => {

package/src/client/components/AMap.tsx

@@ -5,9 +5,9 @@ import { css } from '@emotion/css';
 import { useFieldSchema } from '@formily/react';
 import { useCollection } from '@nocobase/client';
 import { useMemoizedFn } from 'ahooks';
-import { Alert, Button, Modal } from 'antd';
+import { Alert, Button, Modal, Spin } from 'antd';
 import React, { useEffect, useCallback, useRef, useState, useMemo, useImperativeHandle } from 'react';
-import { useHistory } from 'react-router';
+import { useNavigate } from 'react-router-dom';
 import { useMapConfiguration } from '../hooks';
 import { useMapTranslation } from '../locale';
 import Search from './Search';
@@ -101,8 +101,8 @@ const AMapComponent = React.forwardRef<AMapForwardedRefProps, AMapComponentProps
 
   const overlay = useRef<AMap.Polygon>();
   const editor = useRef(null);
-  const history = useHistory();
-  const id = useRef(`nocobase-map-${type}-${Date.now().toString(32)}`);
+  const navigate = useNavigate();
+  const id = useRef(`nocobase-map-${type || ''}-${Date.now().toString(32)}`);
 
   const [commonOptions] = useState<AMap.PolylineOptions & AMap.PolygonOptions>({
     strokeWeight: 5,
@@ -316,7 +316,7 @@ const AMapComponent = React.forwardRef<AMapForwardedRefProps, AMapComponentProps
       plugins: ['AMap.MouseTool', 'AMap.PolygonEditor', 'AMap.PolylineEditor', 'AMap.CircleEditor'],
     })
       .then((amap) => {
-        requestIdleCallback(() => {
+        return requestIdleCallback(() => {
           map.current = new amap.Map(id.current, {
             resizeEnable: true,
             zoom,
@@ -327,10 +327,14 @@ const AMapComponent = React.forwardRef<AMapForwardedRefProps, AMapComponentProps
         });
       })
       .catch((err) => {
-        if (err.includes('多个不一致的 key')) {
-          setErrMessage(t('The AccessKey is incorrect, please check it'));
-        } else {
-          setErrMessage(err);
+        if (typeof err === 'string') {
+          if (err.includes('多个不一致的 key')) {
+            setErrMessage(t('The AccessKey is incorrect, please check it'));
+          } else {
+            setErrMessage(err);
+          }
+        } else if (err?.type === 'error') {
+          setErrMessage('Something went wrong, please refresh the page and try again');
         }
       });
 
@@ -360,7 +364,7 @@ const AMapComponent = React.forwardRef<AMapForwardedRefProps, AMapComponentProps
     return (
       <Alert
         action={
-          <Button type="primary" onClick={() => history.push('/admin/settings/map-configuration/configuration')}>
+          <Button type="primary" onClick={() => navigate('/admin/settings/map-configuration/configuration')}>
             {t('Go to the configuration page')}
           </Button>
         }
@@ -379,6 +383,19 @@ const AMapComponent = React.forwardRef<AMapForwardedRefProps, AMapComponentProps
       id={id.current}
       style={props?.style}
     >
+      {!aMap.current && (
+        <div
+          className={css`
+            position: absolute;
+            inset: 0;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+          `}
+        >
+          <Spin />
+        </div>
+      )}
       {!disabled ? (
         <>
           <Search toCenter={toCenter} aMap={aMap.current} />

package/src/client/index.tsx

@@ -13,7 +13,7 @@ import { MapInitializer } from './initialize';
 import { useMapTranslation } from './locale';
 import './locale';
 
-export default React.memo((props) => {
+const MapProvider = React.memo((props) => {
   const ctx = useContext(CollectionManagerContext);
   const { t } = useMapTranslation();
   return (
@@ -45,3 +45,6 @@ export default React.memo((props) => {
     </CurrentAppInfoProvider>
   );
 });
+MapProvider.displayName = 'MapProvider';
+
+export default MapProvider;