@abtnode/ux 1.16.26-beta-5251ab18 → 1.16.26-beta-351de484

package/es/store/item.js

@@ -1,8 +1,9 @@
-import { makeStyles } from '@mui/styles';
-import { Typography, Button, ButtonGroup, CircularProgress } from '@mui/material';
+import { makeStyles, styled } from '@mui/styles';
+import { Typography, Button, ButtonGroup, CircularProgress, Box, Tooltip, tooltipClasses } from '@mui/material';
 import LaunchIcon from '@mui/icons-material/Launch';
 import PublishIcon from '@mui/icons-material/BackupOutlined';
 import LinkOutlinedIcon from '@mui/icons-material/LinkOutlined';
+import AdminPanelSettingsIcon from '@mui/icons-material/AdminPanelSettings';
 import DoneIcon from '@mui/icons-material/Done';
 import PropTypes from 'prop-types';
 import { useEffect, useState } from 'react';
@@ -13,7 +14,8 @@ import DeleteStore from './delete';
 import { useNodeContext } from '../contexts/node';
 import { formatError } from '../util';
 import ConnectActions from './connect-actions';
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import DidAddress from '../did-address';
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 const useStyles = makeStyles(() => ({
   buttonText: {
     textTransform: 'none !important'
@@ -62,6 +64,28 @@ const useStyles = makeStyles(() => ({
     backgroundColor: '#e0e0e0'
   }
 }));
+const WhiteTooltip = styled(({
+  className,
+  ...props
+}) => /*#__PURE__*/_jsx(Tooltip, {
+  ...props,
+  classes: {
+    popper: className
+  }
+}))(({
+  theme
+}) => ({
+  [`& .${tooltipClasses.tooltip}`]: {
+    backgroundColor: '#fff',
+    color: 'rgba(0, 0, 0, 0.87)',
+    maxWidth: 220,
+    borderRadius: 8,
+    padding: theme.spacing(2),
+    fontSize: theme.typography.pxToRem(12),
+    border: '1px solid rgba(0,0,0,0.08)',
+    boxShadow: '0px 4px 8px rgba(0, 0, 0, 0.05)'
+  }
+}));
 export default function StoreItem({
   teamDid,
   projectId,
@@ -70,7 +94,7 @@ export default function StoreItem({
   onDelete,
   kind,
   published,
-  connected,
+  connectedStore,
   releaseType,
   onPublish
 }) {
@@ -83,6 +107,7 @@ export default function StoreItem({
   } = useNodeContext();
   const [loading, setLoading] = useState(false);
   const isPublish = kind === 'publish';
+  const connected = !!connectedStore;
   const handleOpenUrl = e => {
     e.stopPropagation();
     if (isPublish) {
@@ -101,7 +126,8 @@ export default function StoreItem({
         did: teamDid,
         storeUrl: store.url,
         storeId: store.id,
-        storeName: store.name
+        storeName: store.name,
+        projectId
       }
     }).then(res => {
       if (!res?.url) {
@@ -145,18 +171,24 @@ export default function StoreItem({
   }, [connected]);
   return /*#__PURE__*/_jsxs("div", {
     className: classes.box,
-    children: [loading && /*#__PURE__*/_jsx(CircularProgress, {
+    children: [!isPublish && loading && /*#__PURE__*/_jsx(CircularProgress, {
       sx: {
         marginRight: 2
       },
       size: 16
     }), /*#__PURE__*/_jsxs("div", {
       className: classes.menuName,
-      children: [/*#__PURE__*/_jsx(Typography, {
-        component: "span",
-        className: classes.title,
-        variant: "subtitle1",
-        children: store.name
+      children: [/*#__PURE__*/_jsx(Box, {
+        sx: {
+          display: 'flex',
+          flexDirection: 'row'
+        },
+        children: /*#__PURE__*/_jsx(Typography, {
+          component: "span",
+          className: classes.title,
+          variant: "subtitle1",
+          children: store.name
+        })
       }), /*#__PURE__*/_jsx(Typography, {
         className: classes.url,
         component: "span",
@@ -165,7 +197,29 @@ export default function StoreItem({
       })]
     }), /*#__PURE__*/_jsxs("div", {
       className: classes.actions,
-      children: [isPublish && /*#__PURE__*/_jsxs(ButtonGroup, {
+      children: [connectedStore && /*#__PURE__*/_jsx(WhiteTooltip, {
+        placement: "left",
+        title: /*#__PURE__*/_jsxs(_Fragment, {
+          children: [/*#__PURE__*/_jsx(Typography, {
+            component: "span",
+            className: classes.title,
+            variant: "subtitle1",
+            children: connectedStore.developerName
+          }), /*#__PURE__*/_jsx(DidAddress, {
+            size: 14,
+            responsive: true,
+            did: connectedStore.developerDid
+          })]
+        }),
+        children: /*#__PURE__*/_jsx(AdminPanelSettingsIcon, {
+          sx: {
+            color: 'rgba(10,10,60,0.3)',
+            fontSize: 22,
+            marginRight: 1,
+            cursor: 'help'
+          }
+        })
+      }), isPublish && /*#__PURE__*/_jsxs(ButtonGroup, {
         disabled: loading,
         variant: "outlined",
         sx: {
@@ -176,10 +230,16 @@ export default function StoreItem({
           sx: {
             paddingLeft: 2,
             paddingRight: 2,
-            fontSize: 15
+            fontSize: 15,
+            width: 130
           },
           onClick: handleConnectToStore,
-          children: [/*#__PURE__*/_jsx(LinkOutlinedIcon, {
+          children: [loading ? /*#__PURE__*/_jsx(CircularProgress, {
+            sx: {
+              marginRight: 1
+            },
+            size: 16
+          }) : /*#__PURE__*/_jsx(LinkOutlinedIcon, {
             sx: {
               marginRight: 1
             }
@@ -189,9 +249,15 @@ export default function StoreItem({
           sx: {
             paddingLeft: 2,
             paddingRight: 2,
-            fontSize: 15
+            fontSize: 15,
+            width: 130
           },
-          children: [/*#__PURE__*/_jsx(DoneIcon, {
+          children: [loading ? /*#__PURE__*/_jsx(CircularProgress, {
+            sx: {
+              marginRight: 1
+            },
+            size: 16
+          }) : /*#__PURE__*/_jsx(DoneIcon, {
             sx: {
               marginRight: 1
             }
@@ -200,15 +266,23 @@ export default function StoreItem({
           sx: {
             paddingLeft: 2,
             paddingRight: 2,
-            fontSize: 15
+            fontSize: 15,
+            width: 130
           },
           onClick: handleUploadToStore,
-          children: [/*#__PURE__*/_jsx(PublishIcon, {
+          children: [loading ? /*#__PURE__*/_jsx(CircularProgress, {
             sx: {
               marginRight: 1
+            },
+            size: 16
+          }) : /*#__PURE__*/_jsx(PublishIcon, {
+            sx: {
+              marginRight: 1,
+              fontSize: 20
             }
           }), t('common.upload')]
         }), /*#__PURE__*/_jsx(ConnectActions, {
+          projectId: projectId,
           connected: connected,
           store: store,
           onDelete: onDelete,
@@ -242,7 +316,12 @@ StoreItem.propTypes = {
   kind: PropTypes.string,
   teamDid: PropTypes.string.isRequired,
   published: PropTypes.bool,
-  connected: PropTypes.bool,
+  connectedStore: PropTypes.shape({
+    storeId: PropTypes.string,
+    storeUrl: PropTypes.string,
+    developerDid: PropTypes.string,
+    developerName: PropTypes.string
+  }),
   projectId: PropTypes.string,
   releaseId: PropTypes.string,
   releaseType: PropTypes.string,
@@ -259,7 +338,7 @@ StoreItem.propTypes = {
 StoreItem.defaultProps = {
   kind: 'store',
   published: false,
-  connected: false,
+  connectedStore: null,
   releaseId: '',
   projectId: '',
   releaseType: '',

package/es/team/members/index.js

@@ -5,7 +5,7 @@ import styled from '@emotion/styled';
 import isEmpty from 'lodash/isEmpty';
 import PropTypes from 'prop-types';
 import classnames from 'classnames';
-import { Badge, IconButton, Tooltip, Checkbox, Box, FormControlLabel } from '@mui/material';
+import { Badge, IconButton, Tooltip, Checkbox, Box, FormControlLabel, useMediaQuery } from '@mui/material';
 import Dialog, { useConfirm } from '@arcblock/ux/lib/Dialog';
 import AddIcon from '@mui/icons-material/Add';
 import LoopIcon from '@mui/icons-material/Loop';
@@ -20,7 +20,7 @@ import Datatable, { getDurableData } from '@arcblock/ux/lib/Datatable';
 import RelativeTime from '@arcblock/ux/lib/RelativeTime';
 import Toast from '@arcblock/ux/lib/Toast';
 import { USER_TYPE } from '@abtnode/constant';
-import { TeamEvents } from '@blocklet/constant';
+import { TeamEvents, PROVIDER_NAME } from '@blocklet/constant';
 import useUrlState from '@ahooksjs/use-url-state';
 import { useMemoizedFn, useMount } from 'ahooks';
 import { UserSessions } from '@blocklet/ui-react';
@@ -140,6 +140,7 @@ export default function MemberList({
   const {
     appIdList = []
   } = useBlockletContext();
+  const isMobile = useMediaQuery(theme => theme.breakpoints.down('md'));
   const {
     teamDid,
     invitations,
@@ -303,7 +304,8 @@ export default function MemberList({
       customBodyRender: e => {
         return /*#__PURE__*/_jsx(DidAddress, {
           size: 14,
-          responsive: true,
+          responsive: !isMobile,
+          compact: isMobile,
           copyable: false,
           did: e
         });
@@ -314,9 +316,14 @@ export default function MemberList({
     name: 'lastLoginAt',
     options: {
       customBodyRender: e => {
-        return /*#__PURE__*/_jsx(RelativeTime, {
-          value: e,
-          locale: locale
+        return /*#__PURE__*/_jsx(Box, {
+          sx: {
+            minWidth: '100px'
+          },
+          children: /*#__PURE__*/_jsx(RelativeTime, {
+            value: e,
+            locale: locale
+          })
         });
       }
     }
@@ -335,12 +342,7 @@ export default function MemberList({
       customBodyRenderLite: rowIndex => {
         const user = users[rowIndex];
         const source = user.sourceProvider || USER_TYPE.WALLET;
-        const providerNameMap = {
-          auth0: 'Auth0',
-          wallet: 'DID wallet',
-          federated: 'Federated'
-        };
-        const providerName = providerNameMap[source] || source;
+        const providerName = PROVIDER_NAME[source] || source;
         if (user.sourceAppPid) {
           return `${providerName} (${t('team.member.federated')})`;
         }
@@ -684,7 +686,8 @@ const Div = styled.div`
       }
     }
     .right {
-      flex-grow: 1;
+      flex: 1;
+      overflow: auto;
     }
   }
 

package/es/team/members/member.js

@@ -15,7 +15,7 @@ import AllowLoginIcon from '@arcblock/icons/lib/AllowLoginIcon';
 import { getTextColor } from '@abtnode/auth/lib/util/create-passport-svg';
 import { useReactive } from 'ahooks';
 import { USER_TYPE } from '@abtnode/constant';
-import { LOGIN_PROVIDER, TeamEvents } from '@blocklet/constant';
+import { LOGIN_PROVIDER, PROVIDER_NAME, TeamEvents } from '@blocklet/constant';
 import Tag from '../../tag';
 import DidAddress from '../../did-address';
 import Permission from '../../permission';
@@ -130,11 +130,6 @@ export default function Member({
     await getData(teamDid, changedUser.did);
     pageState.tab = defaultTab;
   };
-  const providerNameMap = {
-    auth0: 'Auth0',
-    wallet: 'DID wallet',
-    federated: 'Federated'
-  };
 
   // tab
   const Info = () => {
@@ -149,7 +144,7 @@ export default function Member({
       value: /*#__PURE__*/_jsx(Box, {
         display: "flex",
         alignItems: "center",
-        children: providerNameMap[pageState.user?.sourceProvider || USER_TYPE.WALLET] || pageState.user?.sourceProvider
+        children: PROVIDER_NAME[pageState.user?.sourceProvider || USER_TYPE.WALLET] || pageState.user?.sourceProvider
       })
     }, {
       name: t('team.member.allowLogin'),

package/lib/blocklet/{oauth → authentication/federated}/federated-detail-dialog.js

@@ -18,8 +18,8 @@ var _Dialog = _interopRequireDefault(require("@arcblock/ux/lib/Dialog"));
 var _Stars = _interopRequireDefault(require("@mui/icons-material/Stars"));
 var _isUrl = _interopRequireDefault(require("is-url"));
 var _urlJoin = _interopRequireDefault(require("url-join"));
-var _blocklet = require("../../contexts/blocklet");
-var _node = require("../../contexts/node");
+var _blocklet = require("../../../contexts/blocklet");
+var _node = require("../../../contexts/node");
 var _jsxRuntime = require("react/jsx-runtime");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 const FederatedDetailDialog = /*#__PURE__*/(0, _react.forwardRef)((props, ref) => {

package/lib/blocklet/{oauth → authentication/federated}/federated-join-dialog.js

@@ -14,8 +14,8 @@ var _material = require("@mui/material");
 var _Theme = require("@arcblock/ux/lib/Theme");
 var _noop = _interopRequireDefault(require("lodash/noop"));
 var _isUrl = _interopRequireDefault(require("is-url"));
-var _blocklet = require("../../contexts/blocklet");
-var _node = require("../../contexts/node");
+var _blocklet = require("../../../contexts/blocklet");
+var _node = require("../../../contexts/node");
 var _jsxRuntime = require("react/jsx-runtime");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 const FederatedJoinDialog = /*#__PURE__*/(0, _react.forwardRef)((props, ref) => {

package/lib/blocklet/{oauth → authentication/federated}/federated-site-list.js

@@ -16,9 +16,9 @@ var _ahooks = require("ahooks");
 var _Button = _interopRequireDefault(require("@arcblock/ux/lib/Button"));
 var _Toast = _interopRequireDefault(require("@arcblock/ux/lib/Toast"));
 var _constant = require("@blocklet/constant");
-var _blocklet = require("../../contexts/blocklet");
-var _node = require("../../contexts/node");
-var _confirm = _interopRequireDefault(require("../../hooks/confirm"));
+var _blocklet = require("../../../contexts/blocklet");
+var _node = require("../../../contexts/node");
+var _confirm = _interopRequireDefault(require("../../../hooks/confirm"));
 var _federatedDetailDialog = _interopRequireDefault(require("./federated-detail-dialog"));
 var _federatedInviteDialog = _interopRequireDefault(require("./federated-invite-dialog"));
 var _jsxRuntime = require("react/jsx-runtime");

package/lib/blocklet/{oauth/federated.js → authentication/federated/index.js}

@@ -11,7 +11,7 @@ var _ahooks = require("ahooks");
 var _Button = _interopRequireDefault(require("@arcblock/ux/lib/Button"));
 var _material = require("@mui/material");
 var _Toast = _interopRequireDefault(require("@arcblock/ux/lib/Toast"));
-var _blocklet = require("../../contexts/blocklet");
+var _blocklet = require("../../../contexts/blocklet");
 var _federatedSiteList = _interopRequireDefault(require("./federated-site-list"));
 var _federatedJoinDialog = _interopRequireDefault(require("./federated-join-dialog"));
 var _federatedInviteDialog = _interopRequireDefault(require("./federated-invite-dialog"));

package/lib/blocklet/{oauth → authentication}/index.js

@@ -10,7 +10,7 @@ var _Tabs = _interopRequireDefault(require("@arcblock/ux/lib/Tabs"));
 var _material = require("@mui/material");
 var _ahooks = require("ahooks");
 var _react = require("react");
-var _auth = _interopRequireDefault(require("./auth0"));
+var _oauth = _interopRequireDefault(require("./oauth"));
 var _commonSettings = _interopRequireDefault(require("./common-settings"));
 var _federated = _interopRequireDefault(require("./federated"));
 var _jsxRuntime = require("react/jsx-runtime");
@@ -37,9 +37,9 @@ function OAuth() {
     label: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Box, {
       textAlign: "center",
       width: "100%",
-      children: "Auth0"
+      children: t('oauth.oauth')
     }),
-    value: 'auth0'
+    value: 'oauth'
   }, {
     label: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Box, {
       textAlign: "center",
@@ -48,9 +48,11 @@ function OAuth() {
     }),
     value: 'more'
   }];
-  const [currentTab, setCurrentTab] = (0, _react.useState)(tabs[0].value);
+
+  // tabs[0].value
+  const [currentTab, setCurrentTab] = (0, _react.useState)('oauth');
   const contents = (0, _ahooks.useCreation)(() => ({
-    auth0: /*#__PURE__*/(0, _jsxRuntime.jsx)(_auth.default, {}),
+    oauth: /*#__PURE__*/(0, _jsxRuntime.jsx)(_oauth.default, {}),
     federated: /*#__PURE__*/(0, _jsxRuntime.jsx)(_federated.default, {}),
     more: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Box, {
       children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Empty.default, {

package/lib/blocklet/authentication/oauth/apple.js

@@ -0,0 +1,226 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _material = require("@mui/material");
+var _pick = _interopRequireDefault(require("lodash/pick"));
+var _ahooks = require("ahooks");
+var _reactHookForm = require("react-hook-form");
+var _context = require("@arcblock/ux/lib/Locale/context");
+var _Toast = _interopRequireDefault(require("@arcblock/ux/lib/Toast"));
+var _node = require("../../../contexts/node");
+var _blocklet = require("../../../contexts/blocklet");
+var _switchControl = _interopRequireDefault(require("../../component/switch-control"));
+var _jsxRuntime = require("react/jsx-runtime");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+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(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
+function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+function OAuthApple() {
+  var _blocklet$meta, _blocklet$settings;
+  const {
+    api
+  } = (0, _node.useNodeContext)();
+  const {
+    blocklet
+  } = (0, _blocklet.useBlockletContext)();
+  const {
+    t
+  } = (0, _context.useLocaleContext)();
+  const did = blocklet === null || blocklet === void 0 || (_blocklet$meta = blocklet.meta) === null || _blocklet$meta === void 0 ? void 0 : _blocklet$meta.did;
+  const authData = Object.assign({
+    enabled: false,
+    teamId: '',
+    serviceId: '',
+    keyId: '',
+    authKey: ''
+  }, (blocklet === null || blocklet === void 0 || (_blocklet$settings = blocklet.settings) === null || _blocklet$settings === void 0 || (_blocklet$settings = _blocklet$settings.oauth) === null || _blocklet$settings === void 0 ? void 0 : _blocklet$settings.apple) || {});
+  const {
+    handleSubmit,
+    control,
+    formState,
+    watch,
+    reset
+  } = (0, _reactHookForm.useForm)({
+    defaultValues: (0, _pick.default)(authData, ['enabled', 'teamId', 'serviceId', 'keyId', 'authKey'])
+  });
+  const enabled = watch('enabled');
+  const onSubmit = (0, _ahooks.useMemoizedFn)(async data => {
+    try {
+      var _blockletChanged$sett;
+      const {
+        blocklet: blockletChanged
+      } = await api.configOAuth({
+        input: {
+          did,
+          oauth: JSON.stringify({
+            apple: data
+          })
+        }
+      });
+      const defaultValues = Object.assign({
+        enabled: false,
+        teamId: '',
+        serviceId: '',
+        keyId: '',
+        authKey: ''
+      }, (blockletChanged === null || blockletChanged === void 0 || (_blockletChanged$sett = blockletChanged.settings) === null || _blockletChanged$sett === void 0 || (_blockletChanged$sett = _blockletChanged$sett.oauth) === null || _blockletChanged$sett === void 0 ? void 0 : _blockletChanged$sett.apple) || {});
+      // 将当前表单的默认值重置为新的数据，这样能够修正页面的 isDirty 数据
+      reset(defaultValues);
+      _Toast.default.success(t('oauth.saveSuccess'));
+    } catch (err) {
+      _Toast.default.error(err.message || t('oauth.saveFailed'));
+    }
+  });
+  const validateTeamId = (0, _ahooks.useMemoizedFn)(val => {
+    if (!(val !== null && val !== void 0 && val.trim())) {
+      return t('oauth.apple.teamIdDescribe');
+    }
+    return true;
+  });
+  const validateServiceId = (0, _ahooks.useMemoizedFn)(val => {
+    if (!(val !== null && val !== void 0 && val.trim())) {
+      return t('oauth.apple.serviceIdDescribe');
+    }
+    return true;
+  });
+  const validateKeyId = (0, _ahooks.useMemoizedFn)(val => {
+    if (!(val !== null && val !== void 0 && val.trim())) {
+      return t('oauth.apple.keyIdDescribe');
+    }
+    return true;
+  });
+  const validateAuthKey = (0, _ahooks.useMemoizedFn)(val => {
+    if (!(val !== null && val !== void 0 && val.trim())) {
+      return t('oauth.apple.authKeyDescribe');
+    }
+    return true;
+  });
+  const noop = (0, _ahooks.useMemoizedFn)(() => true);
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Box, {
+    children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("form", {
+      onSubmit: handleSubmit(onSubmit),
+      disabled: true,
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactHookForm.Controller, {
+        name: "enabled",
+        control: control,
+        render: _ref => {
+          let {
+            field
+          } = _ref;
+          return /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.FormControlLabel, {
+            control: /*#__PURE__*/(0, _jsxRuntime.jsx)(_switchControl.default, _objectSpread({
+              checked: field.value,
+              style: {
+                marginRight: '6px'
+              }
+            }, field)),
+            label: t('oauth.apple.enable'),
+            sx: {
+              marginBottom: 2,
+              ml: 1
+            }
+          });
+        }
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactHookForm.Controller, {
+        name: "teamId",
+        control: control,
+        rules: {
+          validate: enabled ? validateTeamId : noop
+        },
+        render: _ref2 => {
+          var _formState$errors$fie;
+          let {
+            field
+          } = _ref2;
+          return /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.FormControl, {
+            fullWidth: true,
+            children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.TextField, _objectSpread(_objectSpread({}, field), {}, {
+              error: !!formState.errors[field.name],
+              label: t('oauth.apple.teamId'),
+              helperText: ((_formState$errors$fie = formState.errors[field.name]) === null || _formState$errors$fie === void 0 ? void 0 : _formState$errors$fie.message) || '　',
+              disabled: !enabled
+            }))
+          });
+        }
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactHookForm.Controller, {
+        name: "serviceId",
+        control: control,
+        rules: {
+          validate: enabled ? validateServiceId : noop
+        },
+        render: _ref3 => {
+          var _formState$errors$fie2;
+          let {
+            field
+          } = _ref3;
+          return /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.FormControl, {
+            fullWidth: true,
+            children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.TextField, _objectSpread(_objectSpread({}, field), {}, {
+              error: !!formState.errors[field.name],
+              label: t('oauth.apple.serviceId'),
+              helperText: ((_formState$errors$fie2 = formState.errors[field.name]) === null || _formState$errors$fie2 === void 0 ? void 0 : _formState$errors$fie2.message) || '　',
+              disabled: !enabled
+            }))
+          });
+        }
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactHookForm.Controller, {
+        name: "keyId",
+        control: control,
+        rules: {
+          validate: enabled ? validateKeyId : noop
+        },
+        render: _ref4 => {
+          var _formState$errors$fie3;
+          let {
+            field
+          } = _ref4;
+          return /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.FormControl, {
+            fullWidth: true,
+            children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.TextField, _objectSpread(_objectSpread({}, field), {}, {
+              error: !!formState.errors[field.name],
+              label: t('oauth.apple.keyId'),
+              helperText: ((_formState$errors$fie3 = formState.errors[field.name]) === null || _formState$errors$fie3 === void 0 ? void 0 : _formState$errors$fie3.message) || '　',
+              disabled: !enabled
+            }))
+          });
+        }
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactHookForm.Controller, {
+        name: "authKey",
+        control: control,
+        rules: {
+          validate: enabled ? validateAuthKey : noop
+        },
+        render: _ref5 => {
+          var _formState$errors$fie4;
+          let {
+            field
+          } = _ref5;
+          return /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.FormControl, {
+            fullWidth: true,
+            children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.TextField, _objectSpread(_objectSpread({}, field), {}, {
+              type: "password",
+              multiline: true,
+              rows: 4,
+              label: t('oauth.apple.authKey'),
+              error: !!formState.errors[field.name],
+              helperText: ((_formState$errors$fie4 = formState.errors[field.name]) === null || _formState$errors$fie4 === void 0 ? void 0 : _formState$errors$fie4.message) || '　',
+              disabled: !enabled
+            }))
+          });
+        }
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Button, {
+        type: "submit",
+        variant: "contained",
+        onSubmit: handleSubmit(onSubmit),
+        disabled: !formState.isDirty,
+        children: t('oauth.save')
+      })]
+    })
+  });
+}
+var _default = exports.default = OAuthApple;