@abtnode/ux 1.16.14-beta-ab7f615e → 1.16.14-beta-cb53c14b

package/es/blocklet/notification/email.js

@@ -0,0 +1,257 @@
+import { Box, Button, FormControl, FormControlLabel, Switch, TextField } from '@mui/material';
+import pick from 'lodash/pick';
+import { useMemoizedFn } from 'ahooks';
+import { Controller, useForm } from 'react-hook-form';
+import { useLocaleContext } from '@arcblock/ux/lib/Locale/context';
+import Toast from '@arcblock/ux/lib/Toast';
+import isEmail from 'validator/lib/isEmail';
+import isURL from 'validator/lib/isURL';
+import isPort from 'validator/lib/isPort';
+import { useNodeContext } from '../../contexts/node';
+import { useBlockletContext } from '../../contexts/blocklet';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+const defaultFormValues = {
+  enabled: false,
+  secure: false,
+  from: '',
+  host: '',
+  port: '',
+  user: '',
+  password: ''
+};
+function NotificationEmail() {
+  const {
+    api
+  } = useNodeContext();
+  const {
+    blocklet
+  } = useBlockletContext();
+  const {
+    t
+  } = useLocaleContext();
+  const did = blocklet?.meta?.did;
+  const config = Object.assign({
+    ...defaultFormValues
+  }, blocklet?.settings?.notification?.email || {});
+  const {
+    handleSubmit,
+    control,
+    formState,
+    watch,
+    reset
+  } = useForm({
+    defaultValues: pick(config, Object.keys(defaultFormValues))
+  });
+  const enabled = watch('enabled');
+  const onSubmit = useMemoizedFn(async data => {
+    try {
+      const {
+        blocklet: blockletChanged
+      } = await api.configNotification({
+        input: {
+          did,
+          notification: JSON.stringify({
+            email: data
+          })
+        }
+      });
+      const defaultValues = Object.assign({
+        ...defaultFormValues
+      }, blockletChanged?.settings?.notification?.email || {});
+      // 将当前表单的默认值重置为新的数据，这样能够修正页面的 isDirty 数据
+      reset(defaultValues);
+      Toast.success(t('oauth.saveSuccess'));
+    } catch (err) {
+      Toast.error(err.message || t('oauth.saveFailed'));
+    }
+  });
+  const validateFrom = useMemoizedFn(value => {
+    const val = value?.trim();
+    if (!val) {
+      return t('notification.email.fromRequired');
+    }
+    if (!isEmail(val)) {
+      return t('notification.email.fromInvalid');
+    }
+    return true;
+  });
+  const validateHost = useMemoizedFn(value => {
+    const val = value?.trim();
+    if (!val) {
+      return t('notification.email.hostRequired');
+    }
+    if (!isURL(val, {
+      require_host: false,
+      protocols: []
+    })) {
+      return t('notification.email.hostInvalid');
+    }
+    return true;
+  });
+  const validatePort = useMemoizedFn(val => {
+    if (!val) {
+      return t('notification.email.portRequired');
+    }
+    if (!isPort(val)) {
+      return t('notification.email.portInvalid');
+    }
+    return true;
+  });
+  const validateUser = useMemoizedFn(val => {
+    if (!val?.trim()) {
+      return t('notification.email.userRequired');
+    }
+    return true;
+  });
+  const validatePassword = useMemoizedFn(val => {
+    if (!val?.trim()) {
+      return t('notification.email.passwordRequired');
+    }
+    return true;
+  });
+  const noop = useMemoizedFn(() => true);
+  return /*#__PURE__*/_jsx(Box, {
+    children: /*#__PURE__*/_jsxs("form", {
+      onSubmit: handleSubmit(onSubmit),
+      disabled: true,
+      children: [/*#__PURE__*/_jsx(Controller, {
+        name: "enabled",
+        control: control,
+        render: ({
+          field
+        }) => /*#__PURE__*/_jsx(FormControlLabel, {
+          control: /*#__PURE__*/_jsx(Switch, {
+            checked: field.value,
+            ...field
+          }),
+          label: t('notification.email.enable'),
+          sx: {
+            marginBottom: '8px'
+          }
+        })
+      }), /*#__PURE__*/_jsx(Controller, {
+        name: "from",
+        control: control,
+        rules: {
+          validate: enabled ? validateFrom : noop
+        },
+        render: ({
+          field
+        }) => /*#__PURE__*/_jsx(FormControl, {
+          fullWidth: true,
+          children: /*#__PURE__*/_jsx(TextField, {
+            ...field,
+            label: t('notification.email.from'),
+            error: !!formState.errors[field.name],
+            helperText: formState.errors[field.name]?.message || '　',
+            disabled: !enabled
+          })
+        })
+      }), /*#__PURE__*/_jsx(Controller, {
+        name: "host",
+        control: control,
+        rules: {
+          validate: enabled ? validateHost : noop
+        },
+        render: ({
+          field
+        }) => /*#__PURE__*/_jsx(FormControl, {
+          fullWidth: true,
+          children: /*#__PURE__*/_jsx(TextField, {
+            ...field,
+            error: !!formState.errors[field.name],
+            label: t('notification.email.host'),
+            helperText: formState.errors[field.name]?.message || '　',
+            disabled: !enabled
+          })
+        })
+      }), /*#__PURE__*/_jsx(Controller, {
+        name: "port",
+        control: control,
+        rules: {
+          validate: enabled ? validatePort : noop
+        },
+        render: ({
+          field
+        }) => /*#__PURE__*/_jsx(FormControl, {
+          fullWidth: true,
+          children: /*#__PURE__*/_jsx(TextField, {
+            ...field,
+            type: "number",
+            error: !!formState.errors[field.name],
+            label: t('notification.email.port'),
+            helperText: formState.errors[field.name]?.message || '　',
+            disabled: !enabled
+          })
+        })
+      }), /*#__PURE__*/_jsx(Controller, {
+        name: "user",
+        control: control,
+        rules: {
+          validate: enabled ? validateUser : noop
+        },
+        render: ({
+          field
+        }) => /*#__PURE__*/_jsx(FormControl, {
+          fullWidth: true,
+          children: /*#__PURE__*/_jsx(TextField, {
+            ...field,
+            error: !!formState.errors[field.name],
+            label: t('notification.email.user'),
+            helperText: formState.errors[field.name]?.message || '　',
+            disabled: !enabled
+          })
+        })
+      }), /*#__PURE__*/_jsx(Controller, {
+        name: "password",
+        control: control,
+        rules: {
+          validate: enabled ? validatePassword : noop
+        },
+        render: ({
+          field
+        }) => /*#__PURE__*/_jsx(FormControl, {
+          fullWidth: true,
+          children: /*#__PURE__*/_jsx(TextField, {
+            ...field,
+            type: "password",
+            error: !!formState.errors[field.name],
+            label: t('notification.email.password'),
+            helperText: formState.errors[field.name]?.message || '　',
+            disabled: !enabled
+          })
+        })
+      }), /*#__PURE__*/_jsx(Controller, {
+        name: "secure",
+        control: control,
+        rules: {
+          validate: noop
+        },
+        render: ({
+          field
+        }) => /*#__PURE__*/_jsx(FormControl, {
+          fullWidth: true,
+          children: /*#__PURE__*/_jsx(FormControlLabel, {
+            control: /*#__PURE__*/_jsx(Switch, {
+              checked: field.value,
+              ...field,
+              disabled: !enabled
+            }),
+            label: t('notification.email.secure'),
+            style: {
+              marginBottom: 16
+            }
+          })
+        })
+      }), /*#__PURE__*/_jsx(Button, {
+        type: "submit",
+        variant: "contained",
+        onSubmit: handleSubmit(onSubmit),
+        disabled: !formState.isDirty,
+        children: t('oauth.save')
+      })]
+    })
+  });
+}
+export default NotificationEmail;

package/es/blocklet/notification/index.js

@@ -0,0 +1,49 @@
+import Empty from '@arcblock/ux/lib/Empty';
+import { LocaleContext } from '@arcblock/ux/lib/Locale/context';
+import Tabs from '@arcblock/ux/lib/Tabs';
+import { Box } from '@mui/material';
+import { useCreation } from 'ahooks';
+import { useContext, useState } from 'react';
+import NotificationEmail from './email';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+const tabs = [{
+  label: /*#__PURE__*/_jsx(Box, {
+    textAlign: "center",
+    width: "100%",
+    children: "Email"
+  }),
+  value: 'email'
+}, {
+  label: /*#__PURE__*/_jsx(Box, {
+    textAlign: "center",
+    width: "100%",
+    children: "More"
+  }),
+  value: 'more'
+}];
+function BlockletNotification() {
+  const [currentTab, setCurrentTab] = useState(tabs[0].value);
+  const {
+    t
+  } = useContext(LocaleContext);
+  const contents = useCreation(() => ({
+    email: /*#__PURE__*/_jsx(NotificationEmail, {}),
+    more: /*#__PURE__*/_jsx(Box, {
+      children: /*#__PURE__*/_jsx(Empty, {
+        children: t('notification.comingSoon')
+      })
+    })
+  }), [t]);
+  return /*#__PURE__*/_jsxs(Box, {
+    children: [/*#__PURE__*/_jsx(Tabs, {
+      tabs: tabs,
+      current: currentTab,
+      onChange: setCurrentTab
+    }), /*#__PURE__*/_jsx(Box, {
+      marginTop: "10px",
+      children: contents[currentTab]
+    })]
+  });
+}
+export default BlockletNotification;

package/es/blocklet/oauth/auth0.js

@@ -0,0 +1,145 @@
+import { Box, Button, FormControl, FormControlLabel, TextField } from '@mui/material';
+import pick from 'lodash/pick';
+import { useMemoizedFn } from 'ahooks';
+import { Controller, useForm } from 'react-hook-form';
+import { useLocaleContext } from '@arcblock/ux/lib/Locale/context';
+import Toast from '@arcblock/ux/lib/Toast';
+import { useNodeContext } from '../../contexts/node';
+import { useBlockletContext } from '../../contexts/blocklet';
+import SwitchControl from '../component/switch-control';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+function OAuthAuth0() {
+  const {
+    api
+  } = useNodeContext();
+  const {
+    blocklet
+  } = useBlockletContext();
+  const {
+    t
+  } = useLocaleContext();
+  // TODO: @zhanghan 将来需要换成 permanent did
+  const did = blocklet?.meta?.did;
+  const auth0 = Object.assign({
+    enabled: false,
+    domain: '',
+    clientId: ''
+  }, blocklet?.settings?.oauth?.auth0 || {});
+  const {
+    handleSubmit,
+    control,
+    formState,
+    watch,
+    reset
+  } = useForm({
+    defaultValues: pick(auth0, ['domain', 'clientId', 'enabled'])
+  });
+  const enabled = watch('enabled');
+  const onSubmit = useMemoizedFn(async data => {
+    try {
+      const {
+        blocklet: blockletChanged
+      } = await api.configOAuth({
+        input: {
+          did,
+          oauth: JSON.stringify({
+            auth0: data
+          })
+        }
+      });
+      const defaultValues = Object.assign({
+        enabled: false,
+        domain: '',
+        clientId: ''
+      }, blockletChanged?.settings?.oauth?.auth0 || {});
+      // 将当前表单的默认值重置为新的数据，这样能够修正页面的 isDirty 数据
+      reset(defaultValues);
+      Toast.success(t('oauth.saveSuccess'));
+    } catch (err) {
+      Toast.error(err.message || t('oauth.saveFailed'));
+    }
+  });
+  const validateDomain = useMemoizedFn(val => {
+    if (!val?.trim()) {
+      return t('oauth.auth0.domainDescribe');
+    }
+    return true;
+  });
+  const validateClientId = useMemoizedFn(val => {
+    if (!val?.trim()) {
+      return t('oauth.auth0.clientIdDescribe');
+    }
+    return true;
+  });
+  const noop = useMemoizedFn(() => true);
+  return /*#__PURE__*/_jsx(Box, {
+    children: /*#__PURE__*/_jsxs("form", {
+      onSubmit: handleSubmit(onSubmit),
+      disabled: true,
+      children: [/*#__PURE__*/_jsx(Controller, {
+        name: "enabled",
+        control: control,
+        render: ({
+          field
+        }) => /*#__PURE__*/_jsx(FormControlLabel, {
+          control: /*#__PURE__*/_jsx(SwitchControl, {
+            checked: field.value,
+            style: {
+              marginRight: '6px'
+            },
+            ...field
+          }),
+          label: t('oauth.auth0.enable'),
+          sx: {
+            marginBottom: 2,
+            ml: 1
+          }
+        })
+      }), /*#__PURE__*/_jsx(Controller, {
+        name: "domain",
+        control: control,
+        rules: {
+          validate: enabled ? validateDomain : noop
+        },
+        render: ({
+          field
+        }) => /*#__PURE__*/_jsx(FormControl, {
+          fullWidth: true,
+          children: /*#__PURE__*/_jsx(TextField, {
+            ...field,
+            label: t('oauth.auth0.domain'),
+            error: !!formState.errors[field.name],
+            helperText: formState.errors[field.name]?.message || '　',
+            disabled: !enabled
+          })
+        })
+      }), /*#__PURE__*/_jsx(Controller, {
+        name: "clientId",
+        control: control,
+        rules: {
+          validate: enabled ? validateClientId : noop
+        },
+        render: ({
+          field
+        }) => /*#__PURE__*/_jsx(FormControl, {
+          fullWidth: true,
+          children: /*#__PURE__*/_jsx(TextField, {
+            ...field,
+            error: !!formState.errors[field.name],
+            label: t('oauth.auth0.clientId'),
+            helperText: formState.errors[field.name]?.message || '　',
+            disabled: !enabled
+          })
+        })
+      }), /*#__PURE__*/_jsx(Button, {
+        type: "submit",
+        variant: "contained",
+        onSubmit: handleSubmit(onSubmit),
+        disabled: !formState.isDirty,
+        children: t('oauth.save')
+      })]
+    })
+  });
+}
+export default OAuthAuth0;

package/es/blocklet/oauth/common-settings.js

@@ -0,0 +1,133 @@
+import { useLocaleContext } from '@arcblock/ux/lib/Locale/context';
+import Box from '@mui/material/Box';
+import { Controller, useForm } from 'react-hook-form';
+import Button from '@mui/material/Button';
+import FormControl from '@mui/material/FormControl';
+import Slider from '@mui/material/Slider';
+import Stack from '@mui/material/Stack';
+import Toast from '@arcblock/ux/lib/Toast';
+import { useMemoizedFn } from 'ahooks';
+import pick from 'lodash/pick';
+import { useBlockletContext } from '../../contexts/blocklet';
+import { useNodeContext } from '../../contexts/node';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+const defaultForm = {
+  ttl: 86400 * 7
+};
+function fixTtl(data, reverse = false) {
+  const ttl = reverse ? data.ttl * 86400 : data.ttl / 86400;
+  return {
+    ...data,
+    ttl
+  };
+}
+export default function CommonSettings() {
+  const {
+    api
+  } = useNodeContext();
+  const {
+    blocklet
+  } = useBlockletContext();
+  const did = blocklet?.meta?.did;
+  const sessionSettings = Object.assign({}, defaultForm, blocklet?.settings?.session || {});
+  const {
+    handleSubmit,
+    control,
+    formState,
+    reset
+  } = useForm({
+    defaultValues: pick(fixTtl(sessionSettings), ['ttl'])
+  });
+  const {
+    t
+  } = useLocaleContext();
+  const onSubmit = useMemoizedFn(async data => {
+    try {
+      const {
+        blocklet: blockletChanged
+      } = await api.updateAppSessionConfig({
+        input: {
+          did,
+          config: fixTtl(data, true)
+        }
+      });
+      const defaultValues = Object.assign({}, defaultForm, pick(blockletChanged?.settings?.session || {}, ['ttl']));
+      // 将当前表单的默认值重置为新的数据，这样能够修正页面的 isDirty 数据
+      reset(fixTtl(defaultValues));
+      Toast.success(t('common.configSuccess'));
+    } catch (err) {
+      Toast.error(err.message);
+    }
+  });
+  return /*#__PURE__*/_jsx(Box, {
+    children: /*#__PURE__*/_jsxs("form", {
+      onSubmit: handleSubmit(onSubmit),
+      disabled: true,
+      children: [/*#__PURE__*/_jsx(Controller, {
+        name: "ttl",
+        control: control,
+        render: ({
+          field
+        }) => /*#__PURE__*/_jsx(FormControl, {
+          fullWidth: true,
+          sx: {
+            mb: 2
+          },
+          children: /*#__PURE__*/_jsxs(Stack, {
+            px: 3,
+            children: [/*#__PURE__*/_jsx(Box, {
+              mx: -3,
+              my: 0.5,
+              children: t('blocklet.config.session.ttl', {
+                day: field.value
+              })
+            }), /*#__PURE__*/_jsx(Slider, {
+              ...field,
+              defaultValue: 7,
+              step: 1,
+              marks: [{
+                value: 1,
+                label: t('blocklet.config.session.day', {
+                  day: 1
+                })
+              }, {
+                value: 7,
+                label: t('blocklet.config.session.days', {
+                  day: 7
+                })
+              }, {
+                value: 14,
+                label: t('blocklet.config.session.days', {
+                  day: 14
+                })
+              }, {
+                value: 21,
+                label: t('blocklet.config.session.days', {
+                  day: 21
+                })
+              }, {
+                value: 30,
+                label: t('blocklet.config.session.days', {
+                  day: 30
+                })
+              }],
+              min: 1,
+              max: 30,
+              valueLabelDisplay: "auto",
+              style: {
+                maxWidth: '360px'
+              }
+            })]
+          })
+        })
+      }), /*#__PURE__*/_jsx(Button, {
+        type: "submit",
+        variant: "contained",
+        onSubmit: handleSubmit(onSubmit),
+        disabled: !formState.isDirty,
+        children: t('oauth.save')
+      })]
+    })
+  });
+}