@nocobase/client 0.7.4-alpha.7 → 0.7.5-alpha.1

package/lib/schema-initializer/style.less

@@ -0,0 +1,4 @@
+.nb-menu-item-group {
+  max-height: 60vh;
+  overflow: auto;
+}

package/lib/schema-templates/SchemaTemplateManagerProvider.js

@@ -100,11 +100,8 @@ var useSchemaTemplate = function useSchemaTemplate() {
 
   var fieldSchema = (0, _react.useFieldSchema)();
   var schemaId = fieldSchema['x-uid'];
-  var templateKey = fieldSchema['x-template-key'];
-  console.log('templateKey', {
-    schemaId: schemaId,
-    templateKey: templateKey
-  });
+  var templateKey = fieldSchema['x-template-key']; // console.log('templateKey', { schemaId, templateKey })
+
   return (0, _react2.useMemo)(function () {
     return getTemplateBySchema(fieldSchema);
   }, [schemaId, templateKey]);

package/lib/system-settings/SystemSettingsShortcut.js

@@ -217,6 +217,13 @@ var schema = {
         'x-component': 'Checkbox',
         'x-decorator': 'FormItem'
       },
+      smsAuthEnabled: {
+        type: 'boolean',
+        default: false,
+        'x-content': '{{t("Enable SMS authentication")}}',
+        'x-component': 'Checkbox',
+        'x-decorator': 'FormItem'
+      },
       footer1: {
         type: 'void',
         'x-component': 'Action.Drawer.Footer',

package/lib/user/SigninPage.d.ts

@@ -1,4 +1,13 @@
-export declare const useSignin: () => {
+import { ISchema } from '@formily/react';
+export declare const usePasswordSignIn: () => {
     run(): Promise<void>;
 };
-export declare const SigninPage: () => JSX.Element;
+export declare function usePhoneSignIn(): {
+    run(): Promise<void>;
+};
+export interface SigninPageProps {
+    schema?: ISchema;
+    components?: any;
+    scope?: any;
+}
+export declare const SigninPage: (props: SigninPageProps) => JSX.Element;

package/lib/user/SigninPage.js

@@ -1,29 +1,46 @@
 "use strict";
 
+function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.useSignin = exports.SigninPage = void 0;
+exports.usePasswordSignIn = exports.SigninPage = void 0;
+exports.usePhoneSignIn = usePhoneSignIn;
 
 var _react = require("@formily/react");
 
-var _shared = require("@formily/shared");
+var _antd = require("antd");
+
+var _react2 = _interopRequireWildcard(require("react"));
 
-var _react2 = _interopRequireDefault(require("react"));
+var _reactI18next = require("react-i18next");
 
 var _reactRouterDom = require("react-router-dom");
 
 var _ = require("..");
 
+var _VerificationCode = _interopRequireDefault(require("./VerificationCode"));
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
 function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) { try { var info = gen[key](arg); var value = info.value; } catch (error) { reject(error); return; } if (info.done) { resolve(value); } else { Promise.resolve(value).then(_next, _throw); } }
 
 function _asyncToGenerator(fn) { return function () { var self = this, args = arguments; return new Promise(function (resolve, reject) { var gen = fn.apply(self, args); function _next(value) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value); } function _throw(err) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err); } _next(undefined); }); }; }
 
-var schema = {
+var passwordForm = {
   type: 'object',
-  name: (0, _shared.uid)(),
+  name: 'passwordForm',
   'x-component': 'FormV2',
   properties: {
     email: {
@@ -59,41 +76,33 @@ var schema = {
             htmlType: 'submit',
             block: true,
             type: 'primary',
-            useAction: '{{ useSignin }}',
+            useAction: '{{ usePasswordSignIn }}',
             style: {
               width: '100%'
             }
           }
         }
       }
-    },
-    link: {
-      type: 'void',
-      'x-component': 'div',
-      'x-visible': '{{allowSignUp}}',
-      properties: {
-        link: {
-          title: '{{t("Create an account")}}',
-          type: 'void',
-          'x-component': 'Link',
-          'x-content': '{{t("Create an account")}}',
-          'x-component-props': {
-            to: '/signup'
-          }
-        }
-      }
     }
   }
 };
 
-var useSignin = function useSignin() {
+function useRedirect() {
   var _location$query;
 
+  var next = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '/admin';
   var location = (0, _reactRouterDom.useLocation)();
   var history = (0, _reactRouterDom.useHistory)();
+  var redirect = location === null || location === void 0 ? void 0 : (_location$query = location['query']) === null || _location$query === void 0 ? void 0 : _location$query.redirect;
+  return (0, _react2.useCallback)(function () {
+    history.push(redirect || '/admin');
+  }, [redirect]);
+}
+
+var usePasswordSignIn = function usePasswordSignIn() {
   var form = (0, _react.useForm)();
   var api = (0, _.useAPIClient)();
-  var redirect = location === null || location === void 0 ? void 0 : (_location$query = location['query']) === null || _location$query === void 0 ? void 0 : _location$query.redirect;
+  var redirect = useRedirect();
   return {
     run: function run() {
       return _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee() {
@@ -109,7 +118,7 @@ var useSignin = function useSignin() {
                 return api.auth.signIn(form.values);
 
               case 4:
-                history.push(redirect || '/admin');
+                redirect();
 
               case 5:
               case "end":
@@ -122,21 +131,128 @@ var useSignin = function useSignin() {
   };
 };
 
-exports.useSignin = useSignin;
+exports.usePasswordSignIn = usePasswordSignIn;
+var phoneForm = {
+  type: 'object',
+  name: 'phoneForm',
+  'x-component': 'Form',
+  properties: {
+    phone: {
+      type: 'string',
+      required: true,
+      'x-component': 'Input',
+      'x-validator': 'phone',
+      'x-decorator': 'FormItem',
+      'x-component-props': {
+        placeholder: '{{t("Phone")}}',
+        style: {}
+      }
+    },
+    code: {
+      type: 'string',
+      required: true,
+      'x-component': 'VerificationCode',
+      'x-component-props': {
+        actionType: 'users:signin',
+        targetFieldName: 'phone'
+      },
+      'x-decorator': 'FormItem'
+    },
+    actions: {
+      title: '{{t("Sign in")}}',
+      type: 'void',
+      'x-component': 'Action',
+      'x-component-props': {
+        htmlType: 'submit',
+        block: true,
+        type: 'primary',
+        useAction: '{{ usePhoneSignIn }}',
+        style: {
+          width: '100%'
+        }
+      }
+    }
+  }
+};
+
+function usePhoneSignIn() {
+  var form = (0, _react.useForm)();
+  var api = (0, _.useAPIClient)();
+  var redirect = useRedirect();
+  return {
+    run: function run() {
+      return _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee2() {
+        return regeneratorRuntime.wrap(function _callee2$(_context2) {
+          while (1) {
+            switch (_context2.prev = _context2.next) {
+              case 0:
+                _context2.next = 2;
+                return form.submit();
+
+              case 2:
+                _context2.next = 4;
+                return api.auth.signIn(form.values, 'sms');
+
+              case 4:
+                redirect();
+
+              case 5:
+              case "end":
+                return _context2.stop();
+            }
+          }
+        }, _callee2);
+      }))();
+    }
+  };
+}
+
+var SigninPage = function SigninPage(props) {
+  var _ctx$data;
 
-var SigninPage = function SigninPage() {
-  var _ctx$data, _ctx$data$data;
+  var _useTranslation = (0, _reactI18next.useTranslation)(),
+      t = _useTranslation.t;
 
   (0, _.useCurrentDocumentTitle)('Signin');
   var ctx = (0, _.useSystemSettings)();
-  var allowSignUp = ctx === null || ctx === void 0 ? void 0 : (_ctx$data = ctx.data) === null || _ctx$data === void 0 ? void 0 : (_ctx$data$data = _ctx$data.data) === null || _ctx$data$data === void 0 ? void 0 : _ctx$data$data.allowSignUp;
-  return /*#__PURE__*/_react2.default.createElement("div", null, /*#__PURE__*/_react2.default.createElement(_.SchemaComponent, {
+
+  var _ref = (ctx === null || ctx === void 0 ? void 0 : (_ctx$data = ctx.data) === null || _ctx$data === void 0 ? void 0 : _ctx$data.data) || {},
+      allowSignUp = _ref.allowSignUp,
+      smsAuthEnabled = _ref.smsAuthEnabled;
+
+  var schema = props.schema,
+      components = props.components,
+      scope = props.scope;
+  return /*#__PURE__*/_react2.default.createElement("div", null, smsAuthEnabled ? /*#__PURE__*/_react2.default.createElement(_antd.Tabs, {
+    defaultActiveKey: "password"
+  }, /*#__PURE__*/_react2.default.createElement(_antd.Tabs.TabPane, {
+    tab: t('Sign in via account'),
+    key: "password"
+  }, /*#__PURE__*/_react2.default.createElement(_.SchemaComponent, {
     scope: {
-      useSignin: useSignin,
-      allowSignUp: allowSignUp
+      usePasswordSignIn: usePasswordSignIn
     },
-    schema: schema
-  }));
+    schema: schema || passwordForm
+  })), /*#__PURE__*/_react2.default.createElement(_antd.Tabs.TabPane, {
+    tab: t('Sign in via phone'),
+    key: "phone"
+  }, /*#__PURE__*/_react2.default.createElement(_.SchemaComponent, {
+    schema: phoneForm,
+    scope: _objectSpread({
+      usePhoneSignIn: usePhoneSignIn
+    }, scope),
+    components: _objectSpread({
+      VerificationCode: _VerificationCode.default
+    }, components)
+  }))) : /*#__PURE__*/_react2.default.createElement(_.SchemaComponent, {
+    components: _objectSpread({}, components),
+    scope: _objectSpread({
+      usePasswordSignIn: usePasswordSignIn
+    }, scope),
+    schema: schema || passwordForm
+  }), allowSignUp && /*#__PURE__*/_react2.default.createElement("div", null, /*#__PURE__*/_react2.default.createElement(_reactRouterDom.Link, {
+    to: "/signup"
+  }, t('Create an account'))));
 };
 
 exports.SigninPage = SigninPage;

package/lib/user/SignupPage.d.ts

@@ -1,4 +1,10 @@
+import { ISchema } from '@formily/react';
 export declare const useSignup: () => {
     run(): Promise<void>;
 };
-export declare const SignupPage: () => JSX.Element;
+export interface SignupPageProps {
+    schema?: ISchema;
+    components?: any;
+    scope?: any;
+}
+export declare const SignupPage: (props: SignupPageProps) => JSX.Element;

package/lib/user/SignupPage.js

@@ -13,17 +13,27 @@ var _antd = require("antd");
 
 var _react2 = _interopRequireDefault(require("react"));
 
+var _reactI18next = require("react-i18next");
+
 var _reactRouterDom = require("react-router-dom");
 
 var _ = require("..");
 
+var _VerificationCode = _interopRequireDefault(require("./VerificationCode"));
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
 function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) { try { var info = gen[key](arg); var value = info.value; } catch (error) { reject(error); return; } if (info.done) { resolve(value); } else { Promise.resolve(value).then(_next, _throw); } }
 
 function _asyncToGenerator(fn) { return function () { var self = this, args = arguments; return new Promise(function (resolve, reject) { var gen = fn.apply(self, args); function _next(value) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value); } function _throw(err) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err); } _next(undefined); }); }; }
 
-var schema = {
+var signupPageSchema = {
   type: 'object',
   name: (0, _shared.uid)(),
   'x-component': 'FormV2',
@@ -39,6 +49,29 @@ var schema = {
         style: {}
       }
     },
+    phone: {
+      type: 'string',
+      required: true,
+      'x-component': 'Input',
+      'x-validator': 'phone',
+      'x-decorator': 'FormItem',
+      'x-component-props': {
+        placeholder: '{{t("Phone")}}',
+        style: {}
+      },
+      'x-visible': '{{smsAuthEnabled}}'
+    },
+    code: {
+      type: 'string',
+      required: true,
+      'x-component': 'VerificationCode',
+      'x-component-props': {
+        actionType: 'users:signup',
+        targetFieldName: 'phone'
+      },
+      'x-decorator': 'FormItem',
+      'x-visible': '{{smsAuthEnabled}}'
+    },
     password: {
       type: 'string',
       required: true,
@@ -65,7 +98,6 @@ var schema = {
       'x-decorator': 'FormItem',
       'x-component-props': {
         placeholder: '{{t("Confirm password")}}',
-        checkStrength: true,
         style: {}
       },
       'x-reactions': [{
@@ -118,6 +150,10 @@ var useSignup = function useSignup() {
   var history = (0, _reactRouterDom.useHistory)();
   var form = (0, _react.useForm)();
   var api = (0, _.useAPIClient)();
+
+  var _useTranslation = (0, _reactI18next.useTranslation)(),
+      t = _useTranslation.t;
+
   return {
     run: function run() {
       return _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee() {
@@ -135,7 +171,7 @@ var useSignup = function useSignup() {
                 });
 
               case 4:
-                _antd.message.success('注册成功，即将跳转登录页');
+                _antd.message.success('Sign up successfully, and automatically jump to the sign in page');
 
                 setTimeout(function () {
                   history.push('/signin');
@@ -154,12 +190,15 @@ var useSignup = function useSignup() {
 
 exports.useSignup = useSignup;
 
-var SignupPage = function SignupPage() {
-  var _ctx$data, _ctx$data$data;
+var SignupPage = function SignupPage(props) {
+  var _ctx$data;
 
   (0, _.useCurrentDocumentTitle)('Signup');
   var ctx = (0, _.useSystemSettings)();
-  var allowSignUp = ctx === null || ctx === void 0 ? void 0 : (_ctx$data = ctx.data) === null || _ctx$data === void 0 ? void 0 : (_ctx$data$data = _ctx$data.data) === null || _ctx$data$data === void 0 ? void 0 : _ctx$data$data.allowSignUp;
+
+  var _ref = (ctx === null || ctx === void 0 ? void 0 : (_ctx$data = ctx.data) === null || _ctx$data === void 0 ? void 0 : _ctx$data.data) || {},
+      allowSignUp = _ref.allowSignUp,
+      smsAuthEnabled = _ref.smsAuthEnabled;
 
   if (!allowSignUp) {
     return /*#__PURE__*/_react2.default.createElement(_reactRouterDom.Redirect, {
@@ -167,11 +206,18 @@ var SignupPage = function SignupPage() {
     });
   }
 
+  var schema = props.schema,
+      components = props.components,
+      scope = props.scope;
   return /*#__PURE__*/_react2.default.createElement(_.SchemaComponent, {
-    schema: schema,
-    scope: {
-      useSignup: useSignup
-    }
+    schema: schema || signupPageSchema,
+    components: _objectSpread({
+      VerificationCode: _VerificationCode.default
+    }, components),
+    scope: _objectSpread({
+      useSignup: useSignup,
+      smsAuthEnabled: smsAuthEnabled
+    }, scope)
   });
 };
 

package/lib/user/VerificationCode.d.ts

@@ -0,0 +1,7 @@
+/// <reference types="react" />
+export default function VerificationCode({ targetFieldName, actionType, value, onChange }: {
+    targetFieldName?: string;
+    actionType: any;
+    value: any;
+    onChange: any;
+}): JSX.Element;

package/lib/user/VerificationCode.js

@@ -0,0 +1,148 @@
+"use strict";
+
+function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = VerificationCode;
+
+var _reactI18next = require("react-i18next");
+
+var _css = require("@emotion/css");
+
+var _apiClient = require("../api-client");
+
+var _react = require("@formily/react");
+
+var _react2 = _interopRequireWildcard(require("react"));
+
+var _antd = require("antd");
+
+var _templateObject;
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
+
+function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) { try { var info = gen[key](arg); var value = info.value; } catch (error) { reject(error); return; } if (info.done) { resolve(value); } else { Promise.resolve(value).then(_next, _throw); } }
+
+function _asyncToGenerator(fn) { return function () { var self = this, args = arguments; return new Promise(function (resolve, reject) { var gen = fn.apply(self, args); function _next(value) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value); } function _throw(err) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err); } _next(undefined); }); }; }
+
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
+
+function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
+
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+
+function VerificationCode(_ref) {
+  var _ref$targetFieldName = _ref.targetFieldName,
+      targetFieldName = _ref$targetFieldName === void 0 ? 'phone' : _ref$targetFieldName,
+      actionType = _ref.actionType,
+      value = _ref.value,
+      onChange = _ref.onChange;
+
+  var _useTranslation = (0, _reactI18next.useTranslation)(),
+      t = _useTranslation.t;
+
+  var api = (0, _apiClient.useAPIClient)();
+  var form = (0, _react.useForm)();
+
+  var _useState = (0, _react2.useState)(0),
+      _useState2 = _slicedToArray(_useState, 2),
+      count = _useState2[0],
+      setCountdown = _useState2[1];
+
+  var timer = (0, _react2.useRef)(null);
+  (0, _react2.useEffect)(function () {
+    if (count <= 0 && timer.current) {
+      clearInterval(timer.current);
+    }
+  }, [count]);
+
+  function onGetCode() {
+    return _onGetCode.apply(this, arguments);
+  }
+
+  function _onGetCode() {
+    _onGetCode = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee() {
+      var _yield$api$resource$c, data, expiresIn;
+
+      return regeneratorRuntime.wrap(function _callee$(_context) {
+        while (1) {
+          switch (_context.prev = _context.next) {
+            case 0:
+              if (!(count > 0)) {
+                _context.next = 2;
+                break;
+              }
+
+              return _context.abrupt("return");
+
+            case 2:
+              _context.prev = 2;
+              _context.next = 5;
+              return api.resource('verifications').create({
+                values: {
+                  type: actionType,
+                  phone: form.values[targetFieldName]
+                }
+              });
+
+            case 5:
+              _yield$api$resource$c = _context.sent;
+              data = _yield$api$resource$c.data.data;
+
+              _antd.message.success(t('Operation succeeded'));
+
+              if (value) {
+                onChange('');
+              }
+
+              expiresIn = data.expiresAt ? Math.ceil((Date.parse(data.expiresAt) - Date.now()) / 1000) : 60;
+              setCountdown(expiresIn);
+              timer.current = setInterval(function () {
+                setCountdown(function (count) {
+                  return count - 1;
+                });
+              }, 1000);
+              _context.next = 17;
+              break;
+
+            case 14:
+              _context.prev = 14;
+              _context.t0 = _context["catch"](2);
+              console.error(_context.t0);
+
+            case 17:
+            case "end":
+              return _context.stop();
+          }
+        }
+      }, _callee, null, [[2, 14]]);
+    }));
+    return _onGetCode.apply(this, arguments);
+  }
+
+  ;
+  return /*#__PURE__*/_react2.default.createElement("fieldset", {
+    className: (0, _css.css)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n      display: flex;\n      gap: .5em;\n    "])))
+  }, /*#__PURE__*/_react2.default.createElement(_antd.Input, {
+    value: value,
+    onChange: onChange,
+    placeholder: t('Verification code')
+  }), /*#__PURE__*/_react2.default.createElement(_antd.Button, {
+    onClick: onGetCode,
+    disabled: count > 0
+  }, count > 0 ? t('Retry after {{count}} seconds', {
+    count: count
+  }) : t('Send code')));
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nocobase/client",
-  "version": "0.7.4-alpha.7",
+  "version": "0.7.5-alpha.1",
   "license": "Apache-2.0",
   "licenses": [
     {
@@ -19,12 +19,13 @@
     "@formily/antd": "2.0.20",
     "@formily/core": "2.0.20",
     "@formily/react": "2.0.20",
-    "@nocobase/sdk": "0.7.4-alpha.7",
-    "@nocobase/utils": "0.7.4-alpha.7",
+    "@nocobase/sdk": "0.7.5-alpha.1",
+    "@nocobase/utils": "0.7.5-alpha.1",
     "ahooks": "^3.0.5",
     "antd": "~4.19.5",
     "axios": "^0.26.1",
     "classnames": "^2.3.1",
+    "cronstrue": "^2.11.0",
     "file-saver": "^2.0.5",
     "i18next": "^21.6.0",
     "json-templates": "^4.2.0",
@@ -38,6 +39,7 @@
     "react-hotkeys-hook": "^3.4.7",
     "react-i18next": "^11.15.1",
     "react-image-lightbox": "^5.1.4",
+    "react-js-cron": "^1.4.0",
     "react-quill": "^1.3.5",
     "react-router-dom": "^5.2.0",
     "react-to-print": "^2.14.7",
@@ -55,5 +57,5 @@
     "@types/marked": "^4.0.1",
     "axios-mock-adapter": "^1.20.0"
   },
-  "gitHead": "77f22e6da464d19be111835316faf4b94cd80413"
+  "gitHead": "f6eb27b68185bb0c0b4c2cfca1df84205a9b9173"
 }