@os-team/profile 1.0.48 → 1.0.50

package/dist/cjs/components/profile/ProfileDrawerContent.js

@@ -16,6 +16,7 @@ var _ProfileContext = require("./ProfileContext");
 var _ProfileButton = _interopRequireDefault(require("./ProfileButton"));
 var _ProfileUpdateNameModal = _interopRequireDefault(require("./ProfileUpdateNameModal"));
 var _ProfileUpdatePasswordModal = _interopRequireDefault(require("./ProfileUpdatePasswordModal"));
+var _getErrorMessage = _interopRequireDefault(require("../../utils/getErrorMessage"));
 var _ProfileDrawerContentUpdateAvatarMutation, _ProfileDrawerContentSignOutMutation, _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7;
 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); }
@@ -23,8 +24,8 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
 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 _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 = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
 var AvatarContainer = _styled.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  align-items: center;\n"])));
@@ -54,9 +55,7 @@ var DeleteAvatarButton = function DeleteAvatarButton() {
         }
       },
       onError: function onError(error) {
-        var _source, _source$errors, _source$errors$;
-        // eslint-disable-next-line @typescript-eslint/no-explicit-any
-        _core.message.error((_source = error.source) === null || _source === void 0 ? void 0 : (_source$errors = _source.errors) === null || _source$errors === void 0 ? void 0 : (_source$errors$ = _source$errors[0]) === null || _source$errors$ === void 0 ? void 0 : _source$errors$.message);
+        return _core.message.error((0, _getErrorMessage.default)(error));
       },
       onCompleted: function onCompleted() {
         _core.message.success(t('profile:updated'));
@@ -91,9 +90,7 @@ var UpdateAvatarButton = function UpdateAvatarButton(_ref) {
         avatar: file
       },
       onError: function onError(error) {
-        var _source2, _source2$errors, _source2$errors$;
-        // eslint-disable-next-line @typescript-eslint/no-explicit-any
-        _core.message.error((_source2 = error.source) === null || _source2 === void 0 ? void 0 : (_source2$errors = _source2.errors) === null || _source2$errors === void 0 ? void 0 : (_source2$errors$ = _source2$errors[0]) === null || _source2$errors$ === void 0 ? void 0 : _source2$errors$.message);
+        return _core.message.error((0, _getErrorMessage.default)(error));
       },
       onCompleted: function onCompleted() {
         _core.message.success(t('profile:updated'));
@@ -162,9 +159,7 @@ var SignOutButton = function SignOutButton() {
     commit({
       variables: {},
       onError: function onError(error) {
-        var _source3, _source3$errors, _source3$errors$;
-        // eslint-disable-next-line @typescript-eslint/no-explicit-any
-        _core.message.error((_source3 = error.source) === null || _source3 === void 0 ? void 0 : (_source3$errors = _source3.errors) === null || _source3$errors === void 0 ? void 0 : (_source3$errors$ = _source3$errors[0]) === null || _source3$errors$ === void 0 ? void 0 : _source3$errors$.message);
+        return _core.message.error((0, _getErrorMessage.default)(error));
       },
       onCompleted: function onCompleted() {
         window.location.href = '/auth/';

package/dist/cjs/components/profile/ProfileDrawerContent.js.map

@@ -1 +1 @@
-{"version":3,"file":"ProfileDrawerContent.js","names":["AvatarContainer","styled","div","UserContent","FullName","p","theme","sizes","large","Email","clr","inputColorPlaceholder","ActionsContainer","Footer","HiddenInput","input","profileDrawerContentUpdateAvatarMutation","DeleteAvatarButton","useTranslation","t","useMutation","commit","loading","handler","useCallback","variables","avatar","onError","error","message","source","errors","onCompleted","success","UpdateAvatarButton","hasAvatar","fileInputRef","useRef","e","target","files","file","uploadables","current","value","click","UpdateNameButton","hasName","useState","modalVisibility","setModalVisibility","ChangePasswordButton","SignOutButton","window","location","href","ProfileDrawerContent","actions","children","useProfile","email","firstName","lastName","fullName","useMemo","filter","i","join"],"sources":["../../../../src/lib/components/profile/ProfileDrawerContent.tsx"],"sourcesContent":["import React, { useCallback, useMemo, useRef, useState } from 'react';\nimport { message, ThemeSwitcher } from '@os-design/core';\nimport styled from '@emotion/styled';\nimport { clr } from '@os-design/theming';\nimport { useTranslation } from 'react-i18next';\nimport { useMutation } from 'react-relay/hooks';\nimport { graphql } from 'babel-plugin-relay/macro';\nimport UserAvatar from './UserAvatar';\nimport { useProfile } from './ProfileContext';\nimport ProfileButton from './ProfileButton';\nimport ProfileUpdateNameModal from './ProfileUpdateNameModal';\nimport ProfileUpdatePasswordModal from './ProfileUpdatePasswordModal';\nimport { ProfileDrawerContentSignOutMutation } from './__generated__/ProfileDrawerContentSignOutMutation.graphql';\nimport { ProfileDrawerContentUpdateAvatarMutation } from './__generated__/ProfileDrawerContentUpdateAvatarMutation.graphql';\n\nexport interface ProfileDrawerContentProps {\n  /**\n   * Additional actions placed under the avatar.\n   * @default undefined\n   */\n  actions?: React.ReactNode;\n  /**\n   * The children.\n   */\n  children?: React.ReactNode;\n}\n\nconst AvatarContainer = styled.div`\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  align-items: center;\n`;\n\nconst UserContent = styled.div`\n  margin-top: 1em;\n`;\n\nconst FullName = styled.div`\n  font-size: ${(p) => p.theme.sizes.large}em;\n  font-weight: 500;\n  text-align: center;\n  line-height: 1.2;\n`;\n\nconst Email = styled.div`\n  color: ${(p) => clr(p.theme.inputColorPlaceholder)};\n  margin-top: 0.2em;\n  text-align: center;\n`;\n\nconst ActionsContainer = styled.div`\n  margin-top: 1.5em;\n`;\n\nconst Footer = styled.div`\n  display: flex;\n  justify-content: center;\n  margin-top: auto;\n  padding-top: 1.5em;\n`;\n\nconst HiddenInput = styled.input`\n  display: none;\n`;\n\nconst profileDrawerContentUpdateAvatarMutation = graphql`\n  mutation ProfileDrawerContentUpdateAvatarMutation(\n    $input: UpdateAvatarInput!\n  ) {\n    updateAvatar(input: $input) {\n      id\n      avatar\n    }\n  }\n`;\n\nconst DeleteAvatarButton: React.FC = () => {\n  const { t } = useTranslation(['profile']);\n\n  const [commit, loading] =\n    useMutation<ProfileDrawerContentUpdateAvatarMutation>(\n      profileDrawerContentUpdateAvatarMutation\n    );\n\n  const handler = useCallback(() => {\n    commit({\n      variables: {\n        input: { avatar: null },\n      },\n      onError: (error) => {\n        // eslint-disable-next-line @typescript-eslint/no-explicit-any\n        message.error((error as any).source?.errors?.[0]?.message);\n      },\n      onCompleted: () => {\n        message.success(t('profile:updated'));\n      },\n    });\n  }, [commit, t]);\n\n  return (\n    <ProfileButton loading={loading} onClick={handler}>\n      {t('profile:deleteAvatar')}\n    </ProfileButton>\n  );\n};\n\ninterface UpdateAvatarButtonProps {\n  hasAvatar: boolean;\n}\n\nconst UpdateAvatarButton: React.FC<UpdateAvatarButtonProps> = ({\n  hasAvatar,\n}) => {\n  const { t } = useTranslation(['profile']);\n  const fileInputRef = useRef<HTMLInputElement>(null);\n\n  const [commit, loading] =\n    useMutation<ProfileDrawerContentUpdateAvatarMutation>(\n      profileDrawerContentUpdateAvatarMutation\n    );\n\n  const handler = useCallback(\n    (e) => {\n      const target = e.target as HTMLInputElement | null;\n      if (!target) return;\n\n      const { files } = target;\n      if (!files) return;\n\n      const file = files[0];\n\n      commit({\n        variables: {\n          input: {},\n        },\n        uploadables: { avatar: file },\n        onError: (error) => {\n          // eslint-disable-next-line @typescript-eslint/no-explicit-any\n          message.error((error as any).source?.errors?.[0]?.message);\n        },\n        onCompleted: () => {\n          message.success(t('profile:updated'));\n        },\n      });\n    },\n    [commit, t]\n  );\n\n  return (\n    <>\n      <ProfileButton\n        loading={loading}\n        onClick={() => {\n          if (!fileInputRef.current) return;\n          fileInputRef.current.value = '';\n          fileInputRef.current.click();\n        }}\n      >\n        {t(`profile:${hasAvatar ? 'changeAvatar' : 'setAvatar'}`)}\n      </ProfileButton>\n\n      <HiddenInput\n        type='file'\n        accept='image/jpeg,image/png,image/webp'\n        onChange={handler}\n        ref={fileInputRef}\n      />\n    </>\n  );\n};\n\ninterface UpdateNameButtonProps {\n  hasName: boolean;\n}\n\nconst UpdateNameButton: React.FC<UpdateNameButtonProps> = ({ hasName }) => {\n  const { t } = useTranslation(['profile']);\n  const [modalVisibility, setModalVisibility] = useState(false);\n\n  return (\n    <>\n      <ProfileButton onClick={() => setModalVisibility(true)}>\n        {t(`profile:${hasName ? 'changeName' : 'setName'}`)}\n      </ProfileButton>\n\n      <ProfileUpdateNameModal\n        visibility={modalVisibility}\n        onClose={() => setModalVisibility(false)}\n      />\n    </>\n  );\n};\n\nconst ChangePasswordButton: React.FC = () => {\n  const { t } = useTranslation(['profile']);\n  const [modalVisibility, setModalVisibility] = useState(false);\n\n  return (\n    <>\n      <ProfileButton onClick={() => setModalVisibility(true)}>\n        {t('profile:changePassword')}\n      </ProfileButton>\n\n      <ProfileUpdatePasswordModal\n        visibility={modalVisibility}\n        onClose={() => setModalVisibility(false)}\n      />\n    </>\n  );\n};\n\nconst SignOutButton: React.FC = () => {\n  const { t } = useTranslation(['profile']);\n\n  const [commit, loading] =\n    useMutation<ProfileDrawerContentSignOutMutation>(graphql`\n      mutation ProfileDrawerContentSignOutMutation {\n        signOut {\n          ok\n        }\n      }\n    `);\n\n  const handler = useCallback(() => {\n    commit({\n      variables: {},\n      onError: (error) => {\n        // eslint-disable-next-line @typescript-eslint/no-explicit-any\n        message.error((error as any).source?.errors?.[0]?.message);\n      },\n      onCompleted: () => {\n        window.location.href = '/auth/';\n      },\n    });\n  }, [commit]);\n\n  return (\n    <ProfileButton danger loading={loading} onClick={handler}>\n      {t('profile:signOut')}\n    </ProfileButton>\n  );\n};\n\nconst ProfileDrawerContent: React.FC<ProfileDrawerContentProps> = ({\n  actions,\n  children,\n}) => {\n  const { email, firstName, lastName, avatar } = useProfile();\n\n  const fullName = useMemo(\n    () => [firstName, lastName].filter((i) => i).join(' '),\n    [firstName, lastName]\n  );\n\n  return (\n    <>\n      <AvatarContainer>\n        <UserAvatar size='10em' />\n        <UserContent>\n          {fullName && <FullName>{fullName}</FullName>}\n          <Email>{email}</Email>\n        </UserContent>\n      </AvatarContainer>\n\n      <ActionsContainer>\n        {avatar && <DeleteAvatarButton />}\n\n        <UpdateAvatarButton hasAvatar={!!avatar} />\n        <UpdateNameButton hasName={!!fullName} />\n        <ChangePasswordButton />\n\n        {actions}\n\n        <SignOutButton />\n\n        {children}\n      </ActionsContainer>\n\n      <Footer>\n        <ThemeSwitcher />\n      </Footer>\n    </>\n  );\n};\n\nexport default ProfileDrawerContent;\n"],"mappings":"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"}
+{"version":3,"file":"ProfileDrawerContent.js","names":["AvatarContainer","styled","div","UserContent","FullName","p","theme","sizes","large","Email","clr","inputColorPlaceholder","ActionsContainer","Footer","HiddenInput","input","profileDrawerContentUpdateAvatarMutation","DeleteAvatarButton","useTranslation","t","useMutation","commit","loading","handler","useCallback","variables","avatar","onError","error","message","getErrorMessage","onCompleted","success","UpdateAvatarButton","hasAvatar","fileInputRef","useRef","e","target","files","file","uploadables","current","value","click","UpdateNameButton","hasName","useState","modalVisibility","setModalVisibility","ChangePasswordButton","SignOutButton","window","location","href","ProfileDrawerContent","actions","children","useProfile","email","firstName","lastName","fullName","useMemo","filter","i","join"],"sources":["../../../../src/lib/components/profile/ProfileDrawerContent.tsx"],"sourcesContent":["import React, { useCallback, useMemo, useRef, useState } from 'react';\nimport { message, ThemeSwitcher } from '@os-design/core';\nimport styled from '@emotion/styled';\nimport { clr } from '@os-design/theming';\nimport { useTranslation } from 'react-i18next';\nimport { useMutation } from 'react-relay/hooks';\nimport { graphql } from 'babel-plugin-relay/macro';\nimport UserAvatar from './UserAvatar';\nimport { useProfile } from './ProfileContext';\nimport ProfileButton from './ProfileButton';\nimport ProfileUpdateNameModal from './ProfileUpdateNameModal';\nimport ProfileUpdatePasswordModal from './ProfileUpdatePasswordModal';\nimport { ProfileDrawerContentSignOutMutation } from './__generated__/ProfileDrawerContentSignOutMutation.graphql';\nimport { ProfileDrawerContentUpdateAvatarMutation } from './__generated__/ProfileDrawerContentUpdateAvatarMutation.graphql';\nimport getErrorMessage from '../../utils/getErrorMessage';\n\nexport interface ProfileDrawerContentProps {\n  /**\n   * Additional actions placed under the avatar.\n   * @default undefined\n   */\n  actions?: React.ReactNode;\n  /**\n   * The children.\n   */\n  children?: React.ReactNode;\n}\n\nconst AvatarContainer = styled.div`\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  align-items: center;\n`;\n\nconst UserContent = styled.div`\n  margin-top: 1em;\n`;\n\nconst FullName = styled.div`\n  font-size: ${(p) => p.theme.sizes.large}em;\n  font-weight: 500;\n  text-align: center;\n  line-height: 1.2;\n`;\n\nconst Email = styled.div`\n  color: ${(p) => clr(p.theme.inputColorPlaceholder)};\n  margin-top: 0.2em;\n  text-align: center;\n`;\n\nconst ActionsContainer = styled.div`\n  margin-top: 1.5em;\n`;\n\nconst Footer = styled.div`\n  display: flex;\n  justify-content: center;\n  margin-top: auto;\n  padding-top: 1.5em;\n`;\n\nconst HiddenInput = styled.input`\n  display: none;\n`;\n\nconst profileDrawerContentUpdateAvatarMutation = graphql`\n  mutation ProfileDrawerContentUpdateAvatarMutation(\n    $input: UpdateAvatarInput!\n  ) {\n    updateAvatar(input: $input) {\n      id\n      avatar\n    }\n  }\n`;\n\nconst DeleteAvatarButton: React.FC = () => {\n  const { t } = useTranslation(['profile']);\n\n  const [commit, loading] =\n    useMutation<ProfileDrawerContentUpdateAvatarMutation>(\n      profileDrawerContentUpdateAvatarMutation\n    );\n\n  const handler = useCallback(() => {\n    commit({\n      variables: {\n        input: { avatar: null },\n      },\n      onError: (error) => message.error(getErrorMessage(error)),\n      onCompleted: () => {\n        message.success(t('profile:updated'));\n      },\n    });\n  }, [commit, t]);\n\n  return (\n    <ProfileButton loading={loading} onClick={handler}>\n      {t('profile:deleteAvatar')}\n    </ProfileButton>\n  );\n};\n\ninterface UpdateAvatarButtonProps {\n  hasAvatar: boolean;\n}\n\nconst UpdateAvatarButton: React.FC<UpdateAvatarButtonProps> = ({\n  hasAvatar,\n}) => {\n  const { t } = useTranslation(['profile']);\n  const fileInputRef = useRef<HTMLInputElement>(null);\n\n  const [commit, loading] =\n    useMutation<ProfileDrawerContentUpdateAvatarMutation>(\n      profileDrawerContentUpdateAvatarMutation\n    );\n\n  const handler = useCallback(\n    (e) => {\n      const target = e.target as HTMLInputElement | null;\n      if (!target) return;\n\n      const { files } = target;\n      if (!files) return;\n\n      const file = files[0];\n\n      commit({\n        variables: {\n          input: {},\n        },\n        uploadables: { avatar: file },\n        onError: (error) => message.error(getErrorMessage(error)),\n        onCompleted: () => {\n          message.success(t('profile:updated'));\n        },\n      });\n    },\n    [commit, t]\n  );\n\n  return (\n    <>\n      <ProfileButton\n        loading={loading}\n        onClick={() => {\n          if (!fileInputRef.current) return;\n          fileInputRef.current.value = '';\n          fileInputRef.current.click();\n        }}\n      >\n        {t(`profile:${hasAvatar ? 'changeAvatar' : 'setAvatar'}`)}\n      </ProfileButton>\n\n      <HiddenInput\n        type='file'\n        accept='image/jpeg,image/png,image/webp'\n        onChange={handler}\n        ref={fileInputRef}\n      />\n    </>\n  );\n};\n\ninterface UpdateNameButtonProps {\n  hasName: boolean;\n}\n\nconst UpdateNameButton: React.FC<UpdateNameButtonProps> = ({ hasName }) => {\n  const { t } = useTranslation(['profile']);\n  const [modalVisibility, setModalVisibility] = useState(false);\n\n  return (\n    <>\n      <ProfileButton onClick={() => setModalVisibility(true)}>\n        {t(`profile:${hasName ? 'changeName' : 'setName'}`)}\n      </ProfileButton>\n\n      <ProfileUpdateNameModal\n        visibility={modalVisibility}\n        onClose={() => setModalVisibility(false)}\n      />\n    </>\n  );\n};\n\nconst ChangePasswordButton: React.FC = () => {\n  const { t } = useTranslation(['profile']);\n  const [modalVisibility, setModalVisibility] = useState(false);\n\n  return (\n    <>\n      <ProfileButton onClick={() => setModalVisibility(true)}>\n        {t('profile:changePassword')}\n      </ProfileButton>\n\n      <ProfileUpdatePasswordModal\n        visibility={modalVisibility}\n        onClose={() => setModalVisibility(false)}\n      />\n    </>\n  );\n};\n\nconst SignOutButton: React.FC = () => {\n  const { t } = useTranslation(['profile']);\n\n  const [commit, loading] =\n    useMutation<ProfileDrawerContentSignOutMutation>(graphql`\n      mutation ProfileDrawerContentSignOutMutation {\n        signOut {\n          ok\n        }\n      }\n    `);\n\n  const handler = useCallback(() => {\n    commit({\n      variables: {},\n      onError: (error) => message.error(getErrorMessage(error)),\n      onCompleted: () => {\n        window.location.href = '/auth/';\n      },\n    });\n  }, [commit]);\n\n  return (\n    <ProfileButton danger loading={loading} onClick={handler}>\n      {t('profile:signOut')}\n    </ProfileButton>\n  );\n};\n\nconst ProfileDrawerContent: React.FC<ProfileDrawerContentProps> = ({\n  actions,\n  children,\n}) => {\n  const { email, firstName, lastName, avatar } = useProfile();\n\n  const fullName = useMemo(\n    () => [firstName, lastName].filter((i) => i).join(' '),\n    [firstName, lastName]\n  );\n\n  return (\n    <>\n      <AvatarContainer>\n        <UserAvatar size='10em' />\n        <UserContent>\n          {fullName && <FullName>{fullName}</FullName>}\n          <Email>{email}</Email>\n        </UserContent>\n      </AvatarContainer>\n\n      <ActionsContainer>\n        {avatar && <DeleteAvatarButton />}\n\n        <UpdateAvatarButton hasAvatar={!!avatar} />\n        <UpdateNameButton hasName={!!fullName} />\n        <ChangePasswordButton />\n\n        {actions}\n\n        <SignOutButton />\n\n        {children}\n      </ActionsContainer>\n\n      <Footer>\n        <ThemeSwitcher />\n      </Footer>\n    </>\n  );\n};\n\nexport default ProfileDrawerContent;\n"],"mappings":";;;;;;;AAAA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AAGA;AAA0D;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAc1D,IAAMA,eAAe,GAAGC,eAAM,CAACC,GAAG,wKAKjC;AAED,IAAMC,WAAW,GAAGF,eAAM,CAACC,GAAG,6FAE7B;AAED,IAAME,QAAQ,GAAGH,eAAM,CAACC,GAAG,iKACZ,UAACG,CAAC;EAAA,OAAKA,CAAC,CAACC,KAAK,CAACC,KAAK,CAACC,KAAK;AAAA,EAIxC;AAED,IAAMC,KAAK,GAAGR,eAAM,CAACC,GAAG,uIACb,UAACG,CAAC;EAAA,OAAK,IAAAK,YAAG,EAACL,CAAC,CAACC,KAAK,CAACK,qBAAqB,CAAC;AAAA,EAGnD;AAED,IAAMC,gBAAgB,GAAGX,eAAM,CAACC,GAAG,+FAElC;AAED,IAAMW,MAAM,GAAGZ,eAAM,CAACC,GAAG,mKAKxB;AAED,IAAMY,WAAW,GAAGb,eAAM,CAACc,KAAK,2FAE/B;AAED,IAAMC,wCAAwC,8kBAS7C;AAED,IAAMC,kBAA4B,GAAG,SAA/BA,kBAA4B,GAAS;EACzC,sBAAc,IAAAC,4BAAc,EAAC,CAAC,SAAS,CAAC,CAAC;IAAjCC,CAAC,mBAADA,CAAC;EAET,mBACE,IAAAC,kBAAW,EACTJ,wCAAwC,CACzC;IAAA;IAHIK,MAAM;IAAEC,OAAO;EAKtB,IAAMC,OAAO,GAAG,IAAAC,kBAAW,EAAC,YAAM;IAChCH,MAAM,CAAC;MACLI,SAAS,EAAE;QACTV,KAAK,EAAE;UAAEW,MAAM,EAAE;QAAK;MACxB,CAAC;MACDC,OAAO,EAAE,iBAACC,KAAK;QAAA,OAAKC,aAAO,CAACD,KAAK,CAAC,IAAAE,wBAAe,EAACF,KAAK,CAAC,CAAC;MAAA;MACzDG,WAAW,EAAE,uBAAM;QACjBF,aAAO,CAACG,OAAO,CAACb,CAAC,CAAC,iBAAiB,CAAC,CAAC;MACvC;IACF,CAAC,CAAC;EACJ,CAAC,EAAE,CAACE,MAAM,EAAEF,CAAC,CAAC,CAAC;EAEf,oBACE,6BAAC,sBAAa;IAAC,OAAO,EAAEG,OAAQ;IAAC,OAAO,EAAEC;EAAQ,GAC/CJ,CAAC,CAAC,sBAAsB,CAAC,CACZ;AAEpB,CAAC;AAMD,IAAMc,kBAAqD,GAAG,SAAxDA,kBAAqD,OAErD;EAAA,IADJC,SAAS,QAATA,SAAS;EAET,uBAAc,IAAAhB,4BAAc,EAAC,CAAC,SAAS,CAAC,CAAC;IAAjCC,CAAC,oBAADA,CAAC;EACT,IAAMgB,YAAY,GAAG,IAAAC,aAAM,EAAmB,IAAI,CAAC;EAEnD,oBACE,IAAAhB,kBAAW,EACTJ,wCAAwC,CACzC;IAAA;IAHIK,MAAM;IAAEC,OAAO;EAKtB,IAAMC,OAAO,GAAG,IAAAC,kBAAW,EACzB,UAACa,CAAC,EAAK;IACL,IAAMC,MAAM,GAAGD,CAAC,CAACC,MAAiC;IAClD,IAAI,CAACA,MAAM,EAAE;IAEb,IAAQC,KAAK,GAAKD,MAAM,CAAhBC,KAAK;IACb,IAAI,CAACA,KAAK,EAAE;IAEZ,IAAMC,IAAI,GAAGD,KAAK,CAAC,CAAC,CAAC;IAErBlB,MAAM,CAAC;MACLI,SAAS,EAAE;QACTV,KAAK,EAAE,CAAC;MACV,CAAC;MACD0B,WAAW,EAAE;QAAEf,MAAM,EAAEc;MAAK,CAAC;MAC7Bb,OAAO,EAAE,iBAACC,KAAK;QAAA,OAAKC,aAAO,CAACD,KAAK,CAAC,IAAAE,wBAAe,EAACF,KAAK,CAAC,CAAC;MAAA;MACzDG,WAAW,EAAE,uBAAM;QACjBF,aAAO,CAACG,OAAO,CAACb,CAAC,CAAC,iBAAiB,CAAC,CAAC;MACvC;IACF,CAAC,CAAC;EACJ,CAAC,EACD,CAACE,MAAM,EAAEF,CAAC,CAAC,CACZ;EAED,oBACE,yEACE,6BAAC,sBAAa;IACZ,OAAO,EAAEG,OAAQ;IACjB,OAAO,EAAE,mBAAM;MACb,IAAI,CAACa,YAAY,CAACO,OAAO,EAAE;MAC3BP,YAAY,CAACO,OAAO,CAACC,KAAK,GAAG,EAAE;MAC/BR,YAAY,CAACO,OAAO,CAACE,KAAK,EAAE;IAC9B;EAAE,GAEDzB,CAAC,mBAAYe,SAAS,GAAG,cAAc,GAAG,WAAW,EAAG,CAC3C,eAEhB,6BAAC,WAAW;IACV,IAAI,EAAC,MAAM;IACX,MAAM,EAAC,iCAAiC;IACxC,QAAQ,EAAEX,OAAQ;IAClB,GAAG,EAAEY;EAAa,EAClB,CACD;AAEP,CAAC;AAMD,IAAMU,gBAAiD,GAAG,SAApDA,gBAAiD,QAAoB;EAAA,IAAdC,OAAO,SAAPA,OAAO;EAClE,uBAAc,IAAA5B,4BAAc,EAAC,CAAC,SAAS,CAAC,CAAC;IAAjCC,CAAC,oBAADA,CAAC;EACT,gBAA8C,IAAA4B,eAAQ,EAAC,KAAK,CAAC;IAAA;IAAtDC,eAAe;IAAEC,kBAAkB;EAE1C,oBACE,yEACE,6BAAC,sBAAa;IAAC,OAAO,EAAE;MAAA,OAAMA,kBAAkB,CAAC,IAAI,CAAC;IAAA;EAAC,GACpD9B,CAAC,mBAAY2B,OAAO,GAAG,YAAY,GAAG,SAAS,EAAG,CACrC,eAEhB,6BAAC,+BAAsB;IACrB,UAAU,EAAEE,eAAgB;IAC5B,OAAO,EAAE;MAAA,OAAMC,kBAAkB,CAAC,KAAK,CAAC;IAAA;EAAC,EACzC,CACD;AAEP,CAAC;AAED,IAAMC,oBAA8B,GAAG,SAAjCA,oBAA8B,GAAS;EAC3C,uBAAc,IAAAhC,4BAAc,EAAC,CAAC,SAAS,CAAC,CAAC;IAAjCC,CAAC,oBAADA,CAAC;EACT,iBAA8C,IAAA4B,eAAQ,EAAC,KAAK,CAAC;IAAA;IAAtDC,eAAe;IAAEC,kBAAkB;EAE1C,oBACE,yEACE,6BAAC,sBAAa;IAAC,OAAO,EAAE;MAAA,OAAMA,kBAAkB,CAAC,IAAI,CAAC;IAAA;EAAC,GACpD9B,CAAC,CAAC,wBAAwB,CAAC,CACd,eAEhB,6BAAC,mCAA0B;IACzB,UAAU,EAAE6B,eAAgB;IAC5B,OAAO,EAAE;MAAA,OAAMC,kBAAkB,CAAC,KAAK,CAAC;IAAA;EAAC,EACzC,CACD;AAEP,CAAC;AAED,IAAME,aAAuB,GAAG,SAA1BA,aAAuB,GAAS;EACpC,uBAAc,IAAAjC,4BAAc,EAAC,CAAC,SAAS,CAAC,CAAC;IAAjCC,CAAC,oBAADA,CAAC;EAET,oBACE,IAAAC,kBAAW,siBAMT;IAAA;IAPGC,MAAM;IAAEC,OAAO;EAStB,IAAMC,OAAO,GAAG,IAAAC,kBAAW,EAAC,YAAM;IAChCH,MAAM,CAAC;MACLI,SAAS,EAAE,CAAC,CAAC;MACbE,OAAO,EAAE,iBAACC,KAAK;QAAA,OAAKC,aAAO,CAACD,KAAK,CAAC,IAAAE,wBAAe,EAACF,KAAK,CAAC,CAAC;MAAA;MACzDG,WAAW,EAAE,uBAAM;QACjBqB,MAAM,CAACC,QAAQ,CAACC,IAAI,GAAG,QAAQ;MACjC;IACF,CAAC,CAAC;EACJ,CAAC,EAAE,CAACjC,MAAM,CAAC,CAAC;EAEZ,oBACE,6BAAC,sBAAa;IAAC,MAAM;IAAC,OAAO,EAAEC,OAAQ;IAAC,OAAO,EAAEC;EAAQ,GACtDJ,CAAC,CAAC,iBAAiB,CAAC,CACP;AAEpB,CAAC;AAED,IAAMoC,oBAAyD,GAAG,SAA5DA,oBAAyD,QAGzD;EAAA,IAFJC,OAAO,SAAPA,OAAO;IACPC,QAAQ,SAARA,QAAQ;EAER,kBAA+C,IAAAC,0BAAU,GAAE;IAAnDC,KAAK,eAALA,KAAK;IAAEC,SAAS,eAATA,SAAS;IAAEC,QAAQ,eAARA,QAAQ;IAAEnC,MAAM,eAANA,MAAM;EAE1C,IAAMoC,QAAQ,GAAG,IAAAC,cAAO,EACtB;IAAA,OAAM,CAACH,SAAS,EAAEC,QAAQ,CAAC,CAACG,MAAM,CAAC,UAACC,CAAC;MAAA,OAAKA,CAAC;IAAA,EAAC,CAACC,IAAI,CAAC,GAAG,CAAC;EAAA,GACtD,CAACN,SAAS,EAAEC,QAAQ,CAAC,CACtB;EAED,oBACE,yEACE,6BAAC,eAAe,qBACd,6BAAC,mBAAU;IAAC,IAAI,EAAC;EAAM,EAAG,eAC1B,6BAAC,WAAW,QACTC,QAAQ,iBAAI,6BAAC,QAAQ,QAAEA,QAAQ,CAAY,eAC5C,6BAAC,KAAK,QAAEH,KAAK,CAAS,CACV,CACE,eAElB,6BAAC,gBAAgB,QACdjC,MAAM,iBAAI,6BAAC,kBAAkB,OAAG,eAEjC,6BAAC,kBAAkB;IAAC,SAAS,EAAE,CAAC,CAACA;EAAO,EAAG,eAC3C,6BAAC,gBAAgB;IAAC,OAAO,EAAE,CAAC,CAACoC;EAAS,EAAG,eACzC,6BAAC,oBAAoB,OAAG,EAEvBN,OAAO,eAER,6BAAC,aAAa,OAAG,EAEhBC,QAAQ,CACQ,eAEnB,6BAAC,MAAM,qBACL,6BAAC,mBAAa,OAAG,CACV,CACR;AAEP,CAAC;AAAC,eAEaF,oBAAoB;AAAA"}

package/dist/cjs/components/profile/ProfileUpdateNameModal.js

@@ -5,22 +5,24 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _react = _interopRequireWildcard(require("react"));
 var _core = require("@os-design/core");
+var _form = require("@os-design/form");
+var _react = _interopRequireWildcard(require("react"));
 var _reactI18next = require("react-i18next");
-var _formUtils = require("@os-team/form-utils");
 var _hooks = require("react-relay/hooks");
-var _ProfileUpdateNameForm = _interopRequireDefault(require("./ProfileUpdateNameForm"));
+var _handleFormErrors = _interopRequireDefault(require("../../utils/handleFormErrors"));
+var _FormError = _interopRequireDefault(require("../shared/FormError"));
 var _ProfileContext = require("./ProfileContext");
 var _ProfileUpdateNameModalMutation;
 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 _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 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 _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 = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 var ProfileUpdateNameModal = function ProfileUpdateNameModal(_ref) {
   var visibility = _ref.visibility,
@@ -30,21 +32,15 @@ var ProfileUpdateNameModal = function ProfileUpdateNameModal(_ref) {
   var _useProfile = (0, _ProfileContext.useProfile)(),
     firstName = _useProfile.firstName,
     lastName = _useProfile.lastName;
-  var _useState = (0, _react.useState)({}),
-    _useState2 = _slicedToArray(_useState, 2),
-    fieldErrors = _useState2[0],
-    setFieldErrors = _useState2[1];
-  var _useState3 = (0, _react.useState)(),
-    _useState4 = _slicedToArray(_useState3, 2),
-    formError = _useState4[0],
-    setFormError = _useState4[1];
-  var _useState5 = (0, _react.useState)({
+  var initValues = (0, _react.useMemo)(function () {
+    return {
       firstName: firstName || '',
       lastName: lastName || ''
-    }),
-    _useState6 = _slicedToArray(_useState5, 2),
-    data = _useState6[0],
-    setData = _useState6[1];
+    };
+  }, [firstName, lastName]);
+  var _useForm = (0, _form.useForm)(initValues),
+    form = _useForm.form,
+    Field = _useForm.Field;
   var _useMutation = (0, _hooks.useMutation)(_ProfileUpdateNameModalMutation !== void 0 ? _ProfileUpdateNameModalMutation : (_ProfileUpdateNameModalMutation = require("./__generated__/ProfileUpdateNameModalMutation.graphql"), _ProfileUpdateNameModalMutation.hash && _ProfileUpdateNameModalMutation.hash !== "7264a05b6738d5417df9f1dc462486aa" && console.error("The definition of 'ProfileUpdateNameModalMutation' appears to have changed. Run `relay-compiler` to update the generated files to receive the expected data."), _ProfileUpdateNameModalMutation)),
     _useMutation2 = _slicedToArray(_useMutation, 2),
     commit = _useMutation2[0],
@@ -52,42 +48,22 @@ var ProfileUpdateNameModal = function ProfileUpdateNameModal(_ref) {
 
   // Reset the data if the modal is visible
   (0, _react.useEffect)(function () {
-    if (visibility) {
-      setData({
-        firstName: firstName || '',
-        lastName: lastName || ''
-      });
-    }
-  }, [firstName, lastName, visibility]);
+    if (visibility) form.reset();
+  }, [form, visibility]);
   var onSubmit = (0, _react.useCallback)(function () {
     commit({
       variables: {
-        input: data
+        input: form.values.getAll()
       },
       onError: function onError(error) {
-        (0, _formUtils.handleFormErrors)(error, {
-          setFieldErrors: setFieldErrors,
-          setFormError: setFormError
-        });
+        return (0, _handleFormErrors.default)(form, error);
       },
       onCompleted: function onCompleted() {
-        setFieldErrors({});
-        setFormError(undefined);
         _core.message.success(t('profile:updated'));
         onClose();
       }
     });
-  }, [commit, data, onClose, t]);
-  var formContext = (0, _react.useMemo)(function () {
-    return {
-      data: data,
-      setData: setData,
-      fieldErrors: fieldErrors,
-      setFieldErrors: setFieldErrors,
-      formError: formError,
-      setFormError: setFormError
-    };
-  }, [data, fieldErrors, formError]);
+  }, [commit, form, onClose, t]);
   return /*#__PURE__*/_react.default.createElement(_core.Modal, {
     title: t('profile:updateNameModal.title'),
     visible: visibility,
@@ -95,9 +71,31 @@ var ProfileUpdateNameModal = function ProfileUpdateNameModal(_ref) {
     okLoading: loading,
     onOk: onSubmit,
     onClose: onClose
-  }, /*#__PURE__*/_react.default.createElement(_formUtils.FormContext.Provider, {
-    value: formContext
-  }, /*#__PURE__*/_react.default.createElement(_ProfileUpdateNameForm.default, null)));
+  }, /*#__PURE__*/_react.default.createElement(_form.FormProvider, {
+    form: form
+  }, /*#__PURE__*/_react.default.createElement(_core.Form, null, /*#__PURE__*/_react.default.createElement(Field, {
+    name: "firstName",
+    render: function render(props, _ref2) {
+      var error = _ref2.error;
+      return /*#__PURE__*/_react.default.createElement(_core.FormItem, {
+        label: t('profile:updateNameModal.firstName.label'),
+        error: error
+      }, /*#__PURE__*/_react.default.createElement(_core.Input, _extends({
+        placeholder: t('profile:updateNameModal.firstName.placeholder')
+      }, props)));
+    }
+  }), /*#__PURE__*/_react.default.createElement(Field, {
+    name: "lastName",
+    render: function render(props, _ref3) {
+      var error = _ref3.error;
+      return /*#__PURE__*/_react.default.createElement(_core.FormItem, {
+        label: t('profile:updateNameModal.lastName.label'),
+        error: error
+      }, /*#__PURE__*/_react.default.createElement(_core.Input, _extends({
+        placeholder: t('profile:updateNameModal.lastName.placeholder')
+      }, props)));
+    }
+  }), /*#__PURE__*/_react.default.createElement(_FormError.default, null))));
 };
 var _default = ProfileUpdateNameModal;
 exports.default = _default;

package/dist/cjs/components/profile/ProfileUpdateNameModal.js.map

@@ -1 +1 @@
-{"version":3,"file":"ProfileUpdateNameModal.js","names":["ProfileUpdateNameModal","visibility","onClose","useTranslation","t","useProfile","firstName","lastName","useState","fieldErrors","setFieldErrors","formError","setFormError","data","setData","useMutation","commit","loading","useEffect","onSubmit","useCallback","variables","input","onError","error","handleFormErrors","onCompleted","undefined","message","success","formContext","useMemo"],"sources":["../../../../src/lib/components/profile/ProfileUpdateNameModal.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useMemo, useState } from 'react';\nimport { message, Modal } from '@os-design/core';\nimport { useTranslation } from 'react-i18next';\nimport { Constraint, handleFormErrors, FormContext } from '@os-team/form-utils';\nimport { graphql } from 'babel-plugin-relay/macro';\nimport { useMutation } from 'react-relay/hooks';\nimport ProfileUpdateNameForm, {\n  ProfileUpdateNameFormData,\n} from './ProfileUpdateNameForm';\nimport { useProfile } from './ProfileContext';\nimport { ProfileUpdateNameModalMutation } from './__generated__/ProfileUpdateNameModalMutation.graphql';\n\ninterface ProfileUpdateNameModalProps {\n  visibility: boolean;\n  onClose: () => void;\n}\n\nconst ProfileUpdateNameModal: React.FC<ProfileUpdateNameModalProps> = ({\n  visibility,\n  onClose,\n}) => {\n  const { t } = useTranslation(['profile']);\n  const { firstName, lastName } = useProfile();\n\n  const [fieldErrors, setFieldErrors] = useState<Record<string, Constraint>>(\n    {}\n  );\n  const [formError, setFormError] = useState<string | undefined>();\n  const [data, setData] = useState<ProfileUpdateNameFormData>({\n    firstName: firstName || '',\n    lastName: lastName || '',\n  });\n\n  const [commit, loading] = useMutation<ProfileUpdateNameModalMutation>(graphql`\n    mutation ProfileUpdateNameModalMutation($input: UpdateProfileInput!) {\n      updateProfile(input: $input) {\n        firstName\n        lastName\n      }\n    }\n  `);\n\n  // Reset the data if the modal is visible\n  useEffect(() => {\n    if (visibility) {\n      setData({\n        firstName: firstName || '',\n        lastName: lastName || '',\n      });\n    }\n  }, [firstName, lastName, visibility]);\n\n  const onSubmit = useCallback(() => {\n    commit({\n      variables: {\n        input: data,\n      },\n      onError: (error) => {\n        handleFormErrors(error, { setFieldErrors, setFormError });\n      },\n      onCompleted: () => {\n        setFieldErrors({});\n        setFormError(undefined);\n        message.success(t('profile:updated'));\n        onClose();\n      },\n    });\n  }, [commit, data, onClose, t]);\n\n  const formContext = useMemo(\n    () => ({\n      data,\n      setData,\n      fieldErrors,\n      setFieldErrors,\n      formError,\n      setFormError,\n    }),\n    [data, fieldErrors, formError]\n  );\n\n  return (\n    <Modal\n      title={t('profile:updateNameModal.title')}\n      visible={visibility}\n      okText={t('profile:update')}\n      okLoading={loading}\n      onOk={onSubmit}\n      onClose={onClose}\n    >\n      <FormContext.Provider value={formContext}>\n        <ProfileUpdateNameForm />\n      </FormContext.Provider>\n    </Modal>\n  );\n};\n\nexport default ProfileUpdateNameModal;\n"],"mappings":";;;;;;;AAAA;AACA;AACA;AACA;AAEA;AACA;AAGA;AAA8C;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQ9C,IAAMA,sBAA6D,GAAG,SAAhEA,sBAA6D,OAG7D;EAAA,IAFJC,UAAU,QAAVA,UAAU;IACVC,OAAO,QAAPA,OAAO;EAEP,sBAAc,IAAAC,4BAAc,EAAC,CAAC,SAAS,CAAC,CAAC;IAAjCC,CAAC,mBAADA,CAAC;EACT,kBAAgC,IAAAC,0BAAU,GAAE;IAApCC,SAAS,eAATA,SAAS;IAAEC,QAAQ,eAARA,QAAQ;EAE3B,gBAAsC,IAAAC,eAAQ,EAC5C,CAAC,CAAC,CACH;IAAA;IAFMC,WAAW;IAAEC,cAAc;EAGlC,iBAAkC,IAAAF,eAAQ,GAAsB;IAAA;IAAzDG,SAAS;IAAEC,YAAY;EAC9B,iBAAwB,IAAAJ,eAAQ,EAA4B;MAC1DF,SAAS,EAAEA,SAAS,IAAI,EAAE;MAC1BC,QAAQ,EAAEA,QAAQ,IAAI;IACxB,CAAC,CAAC;IAAA;IAHKM,IAAI;IAAEC,OAAO;EAKpB,mBAA0B,IAAAC,kBAAW,8fAOnC;IAAA;IAPKC,MAAM;IAAEC,OAAO;;EAStB;EACA,IAAAC,gBAAS,EAAC,YAAM;IACd,IAAIjB,UAAU,EAAE;MACda,OAAO,CAAC;QACNR,SAAS,EAAEA,SAAS,IAAI,EAAE;QAC1BC,QAAQ,EAAEA,QAAQ,IAAI;MACxB,CAAC,CAAC;IACJ;EACF,CAAC,EAAE,CAACD,SAAS,EAAEC,QAAQ,EAAEN,UAAU,CAAC,CAAC;EAErC,IAAMkB,QAAQ,GAAG,IAAAC,kBAAW,EAAC,YAAM;IACjCJ,MAAM,CAAC;MACLK,SAAS,EAAE;QACTC,KAAK,EAAET;MACT,CAAC;MACDU,OAAO,EAAE,iBAACC,KAAK,EAAK;QAClB,IAAAC,2BAAgB,EAACD,KAAK,EAAE;UAAEd,cAAc,EAAdA,cAAc;UAAEE,YAAY,EAAZA;QAAa,CAAC,CAAC;MAC3D,CAAC;MACDc,WAAW,EAAE,uBAAM;QACjBhB,cAAc,CAAC,CAAC,CAAC,CAAC;QAClBE,YAAY,CAACe,SAAS,CAAC;QACvBC,aAAO,CAACC,OAAO,CAACzB,CAAC,CAAC,iBAAiB,CAAC,CAAC;QACrCF,OAAO,EAAE;MACX;IACF,CAAC,CAAC;EACJ,CAAC,EAAE,CAACc,MAAM,EAAEH,IAAI,EAAEX,OAAO,EAAEE,CAAC,CAAC,CAAC;EAE9B,IAAM0B,WAAW,GAAG,IAAAC,cAAO,EACzB;IAAA,OAAO;MACLlB,IAAI,EAAJA,IAAI;MACJC,OAAO,EAAPA,OAAO;MACPL,WAAW,EAAXA,WAAW;MACXC,cAAc,EAAdA,cAAc;MACdC,SAAS,EAATA,SAAS;MACTC,YAAY,EAAZA;IACF,CAAC;EAAA,CAAC,EACF,CAACC,IAAI,EAAEJ,WAAW,EAAEE,SAAS,CAAC,CAC/B;EAED,oBACE,6BAAC,WAAK;IACJ,KAAK,EAAEP,CAAC,CAAC,+BAA+B,CAAE;IAC1C,OAAO,EAAEH,UAAW;IACpB,MAAM,EAAEG,CAAC,CAAC,gBAAgB,CAAE;IAC5B,SAAS,EAAEa,OAAQ;IACnB,IAAI,EAAEE,QAAS;IACf,OAAO,EAAEjB;EAAQ,gBAEjB,6BAAC,sBAAW,CAAC,QAAQ;IAAC,KAAK,EAAE4B;EAAY,gBACvC,6BAAC,8BAAqB,OAAG,CACJ,CACjB;AAEZ,CAAC;AAAC,eAEa9B,sBAAsB;AAAA"}
+{"version":3,"file":"ProfileUpdateNameModal.js","names":["ProfileUpdateNameModal","visibility","onClose","useTranslation","t","useProfile","firstName","lastName","initValues","useMemo","useForm","form","Field","useMutation","commit","loading","useEffect","reset","onSubmit","useCallback","variables","input","values","getAll","onError","error","handleFormErrors","onCompleted","message","success","props"],"sources":["../../../../src/lib/components/profile/ProfileUpdateNameModal.tsx"],"sourcesContent":["import { Form, FormItem, Input, message, Modal } from '@os-design/core';\nimport { FormProvider, useForm } from '@os-design/form';\nimport { graphql } from 'babel-plugin-relay/macro';\nimport React, { useCallback, useEffect, useMemo } from 'react';\nimport { useTranslation } from 'react-i18next';\nimport { useMutation } from 'react-relay/hooks';\nimport handleFormErrors from '../../utils/handleFormErrors';\nimport FormError from '../shared/FormError';\nimport { useProfile } from './ProfileContext';\nimport { ProfileUpdateNameModalMutation } from './__generated__/ProfileUpdateNameModalMutation.graphql';\n\ninterface ProfileUpdateNameFormData {\n  firstName: string;\n  lastName: string;\n}\n\ninterface ProfileUpdateNameModalProps {\n  visibility: boolean;\n  onClose: () => void;\n}\n\nconst ProfileUpdateNameModal: React.FC<ProfileUpdateNameModalProps> = ({\n  visibility,\n  onClose,\n}) => {\n  const { t } = useTranslation(['profile']);\n  const { firstName, lastName } = useProfile();\n\n  const initValues = useMemo(\n    () => ({ firstName: firstName || '', lastName: lastName || '' }),\n    [firstName, lastName]\n  );\n\n  const { form, Field } = useForm<ProfileUpdateNameFormData>(initValues);\n\n  const [commit, loading] = useMutation<ProfileUpdateNameModalMutation>(graphql`\n    mutation ProfileUpdateNameModalMutation($input: UpdateProfileInput!) {\n      updateProfile(input: $input) {\n        firstName\n        lastName\n      }\n    }\n  `);\n\n  // Reset the data if the modal is visible\n  useEffect(() => {\n    if (visibility) form.reset();\n  }, [form, visibility]);\n\n  const onSubmit = useCallback(() => {\n    commit({\n      variables: {\n        input: form.values.getAll(),\n      },\n      onError: (error) => handleFormErrors(form, error),\n      onCompleted: () => {\n        message.success(t('profile:updated'));\n        onClose();\n      },\n    });\n  }, [commit, form, onClose, t]);\n\n  return (\n    <Modal\n      title={t('profile:updateNameModal.title')}\n      visible={visibility}\n      okText={t('profile:update')}\n      okLoading={loading}\n      onOk={onSubmit}\n      onClose={onClose}\n    >\n      <FormProvider form={form}>\n        <Form>\n          <Field\n            name='firstName'\n            render={(props, { error }) => (\n              <FormItem\n                label={t('profile:updateNameModal.firstName.label')}\n                error={error}\n              >\n                <Input\n                  placeholder={t(\n                    'profile:updateNameModal.firstName.placeholder'\n                  )}\n                  {...props}\n                />\n              </FormItem>\n            )}\n          />\n\n          <Field\n            name='lastName'\n            render={(props, { error }) => (\n              <FormItem\n                label={t('profile:updateNameModal.lastName.label')}\n                error={error}\n              >\n                <Input\n                  placeholder={t(\n                    'profile:updateNameModal.lastName.placeholder'\n                  )}\n                  {...props}\n                />\n              </FormItem>\n            )}\n          />\n\n          <FormError />\n        </Form>\n      </FormProvider>\n    </Modal>\n  );\n};\n\nexport default ProfileUpdateNameModal;\n"],"mappings":"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"}

package/dist/cjs/components/profile/ProfileUpdatePasswordModal.js

@@ -5,42 +5,35 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _react = _interopRequireWildcard(require("react"));
 var _core = require("@os-design/core");
-var _hooks = require("react-relay/hooks");
+var _form = require("@os-design/form");
+var _react = _interopRequireWildcard(require("react"));
 var _reactI18next = require("react-i18next");
-var _formUtils = require("@os-team/form-utils");
-var _ProfileUpdatePasswordForm = _interopRequireDefault(require("./ProfileUpdatePasswordForm"));
+var _hooks = require("react-relay/hooks");
+var _handleFormErrors = _interopRequireDefault(require("../../utils/handleFormErrors"));
+var _FormError = _interopRequireDefault(require("../shared/FormError"));
 var _ProfileUpdatePasswordModalMutation;
 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 _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 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 _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 = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 var ProfileUpdatePasswordModal = function ProfileUpdatePasswordModal(_ref) {
   var visibility = _ref.visibility,
     onClose = _ref.onClose;
   var _useTranslation = (0, _reactI18next.useTranslation)(['profile']),
     t = _useTranslation.t;
-  var _useState = (0, _react.useState)({}),
-    _useState2 = _slicedToArray(_useState, 2),
-    fieldErrors = _useState2[0],
-    setFieldErrors = _useState2[1];
-  var _useState3 = (0, _react.useState)(),
-    _useState4 = _slicedToArray(_useState3, 2),
-    formError = _useState4[0],
-    setFormError = _useState4[1];
-  var _useState5 = (0, _react.useState)({
+  var _useForm = (0, _form.useForm)({
       currentPassword: '',
       password: ''
     }),
-    _useState6 = _slicedToArray(_useState5, 2),
-    data = _useState6[0],
-    setData = _useState6[1];
+    form = _useForm.form,
+    Field = _useForm.Field;
   var _useMutation = (0, _hooks.useMutation)(_ProfileUpdatePasswordModalMutation !== void 0 ? _ProfileUpdatePasswordModalMutation : (_ProfileUpdatePasswordModalMutation = require("./__generated__/ProfileUpdatePasswordModalMutation.graphql"), _ProfileUpdatePasswordModalMutation.hash && _ProfileUpdatePasswordModalMutation.hash !== "efa37ccbe82fbace709f7e3992643c05" && console.error("The definition of 'ProfileUpdatePasswordModalMutation' appears to have changed. Run `relay-compiler` to update the generated files to receive the expected data."), _ProfileUpdatePasswordModalMutation)),
     _useMutation2 = _slicedToArray(_useMutation, 2),
     commit = _useMutation2[0],
@@ -48,42 +41,22 @@ var ProfileUpdatePasswordModal = function ProfileUpdatePasswordModal(_ref) {
 
   // Reset the data if the modal is visible
   (0, _react.useEffect)(function () {
-    if (visibility) {
-      setData({
-        currentPassword: '',
-        password: ''
-      });
-    }
-  }, [visibility]);
+    if (visibility) form.reset();
+  }, [form, visibility]);
   var onSubmit = (0, _react.useCallback)(function () {
     commit({
       variables: {
-        input: data
+        input: form.values.getAll()
       },
       onError: function onError(error) {
-        (0, _formUtils.handleFormErrors)(error, {
-          setFieldErrors: setFieldErrors,
-          setFormError: setFormError
-        });
+        return (0, _handleFormErrors.default)(form, error);
       },
       onCompleted: function onCompleted() {
-        setFieldErrors({});
-        setFormError(undefined);
         _core.message.success(t('profile:updatePasswordModal.success'));
         onClose();
       }
     });
-  }, [commit, data, onClose, t]);
-  var formContext = (0, _react.useMemo)(function () {
-    return {
-      data: data,
-      setData: setData,
-      fieldErrors: fieldErrors,
-      setFieldErrors: setFieldErrors,
-      formError: formError,
-      setFormError: setFormError
-    };
-  }, [data, fieldErrors, formError]);
+  }, [commit, form, onClose, t]);
   return /*#__PURE__*/_react.default.createElement(_core.Modal, {
     title: t('profile:updatePasswordModal.title'),
     visible: visibility,
@@ -91,9 +64,35 @@ var ProfileUpdatePasswordModal = function ProfileUpdatePasswordModal(_ref) {
     okLoading: loading,
     onOk: onSubmit,
     onClose: onClose
-  }, /*#__PURE__*/_react.default.createElement(_formUtils.FormContext.Provider, {
-    value: formContext
-  }, /*#__PURE__*/_react.default.createElement(_ProfileUpdatePasswordForm.default, null)));
+  }, /*#__PURE__*/_react.default.createElement(_form.FormProvider, {
+    form: form
+  }, /*#__PURE__*/_react.default.createElement(_core.Form, null, /*#__PURE__*/_react.default.createElement(Field, {
+    name: "currentPassword",
+    render: function render(props, _ref2) {
+      var error = _ref2.error;
+      return /*#__PURE__*/_react.default.createElement(_core.FormItem, {
+        label: t('profile:updatePasswordModal.currentPassword.label'),
+        error: error
+      }, /*#__PURE__*/_react.default.createElement(_core.InputPassword, _extends({
+        placeholder: t('profile:updatePasswordModal.currentPassword.placeholder')
+      }, props)));
+    }
+  }), /*#__PURE__*/_react.default.createElement(Field, {
+    name: "password",
+    render: function render(props, _ref3) {
+      var error = _ref3.error;
+      return /*#__PURE__*/_react.default.createElement(_core.FormItem, {
+        label: t('profile:updatePasswordModal.newPassword.label'),
+        error: error
+      }, /*#__PURE__*/_react.default.createElement(_core.InputPassword, _extends({
+        placeholder: t('profile:updatePasswordModal.newPassword.placeholder'),
+        showStrengthMeter: true,
+        strengthNames: t('profile:updatePasswordModal.passwordStrengthNames', {
+          returnObjects: true
+        })
+      }, props)));
+    }
+  }), /*#__PURE__*/_react.default.createElement(_FormError.default, null))));
 };
 var _default = ProfileUpdatePasswordModal;
 exports.default = _default;

package/dist/cjs/components/profile/ProfileUpdatePasswordModal.js.map

@@ -1 +1 @@
-{"version":3,"file":"ProfileUpdatePasswordModal.js","names":["ProfileUpdatePasswordModal","visibility","onClose","useTranslation","t","useState","fieldErrors","setFieldErrors","formError","setFormError","currentPassword","password","data","setData","useMutation","commit","loading","useEffect","onSubmit","useCallback","variables","input","onError","error","handleFormErrors","onCompleted","undefined","message","success","formContext","useMemo"],"sources":["../../../../src/lib/components/profile/ProfileUpdatePasswordModal.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useMemo, useState } from 'react';\nimport { message, Modal } from '@os-design/core';\nimport { graphql } from 'babel-plugin-relay/macro';\nimport { useMutation } from 'react-relay/hooks';\nimport { useTranslation } from 'react-i18next';\nimport { Constraint, handleFormErrors, FormContext } from '@os-team/form-utils';\nimport ProfileUpdatePasswordForm, {\n  ProfileUpdatePasswordFormData,\n} from './ProfileUpdatePasswordForm';\nimport { ProfileUpdatePasswordModalMutation } from './__generated__/ProfileUpdatePasswordModalMutation.graphql';\n\ninterface ProfileUpdatePasswordModalProps {\n  visibility: boolean;\n  onClose: () => void;\n}\n\nconst ProfileUpdatePasswordModal: React.FC<ProfileUpdatePasswordModalProps> = ({\n  visibility,\n  onClose,\n}) => {\n  const { t } = useTranslation(['profile']);\n\n  const [fieldErrors, setFieldErrors] = useState<Record<string, Constraint>>(\n    {}\n  );\n  const [formError, setFormError] = useState<string | undefined>();\n  const [data, setData] = useState<ProfileUpdatePasswordFormData>({\n    currentPassword: '',\n    password: '',\n  });\n\n  const [commit, loading] =\n    useMutation<ProfileUpdatePasswordModalMutation>(graphql`\n      mutation ProfileUpdatePasswordModalMutation(\n        $input: UpdatePasswordInput!\n      ) {\n        updatePassword(input: $input) {\n          id\n        }\n      }\n    `);\n\n  // Reset the data if the modal is visible\n  useEffect(() => {\n    if (visibility) {\n      setData({\n        currentPassword: '',\n        password: '',\n      });\n    }\n  }, [visibility]);\n\n  const onSubmit = useCallback(() => {\n    commit({\n      variables: {\n        input: data,\n      },\n      onError: (error) => {\n        handleFormErrors(error, { setFieldErrors, setFormError });\n      },\n      onCompleted: () => {\n        setFieldErrors({});\n        setFormError(undefined);\n        message.success(t('profile:updatePasswordModal.success'));\n        onClose();\n      },\n    });\n  }, [commit, data, onClose, t]);\n\n  const formContext = useMemo(\n    () => ({\n      data,\n      setData,\n      fieldErrors,\n      setFieldErrors,\n      formError,\n      setFormError,\n    }),\n    [data, fieldErrors, formError]\n  );\n\n  return (\n    <Modal\n      title={t('profile:updatePasswordModal.title')}\n      visible={visibility}\n      okText={t('profile:updatePasswordModal.button')}\n      okLoading={loading}\n      onOk={onSubmit}\n      onClose={onClose}\n    >\n      <FormContext.Provider value={formContext}>\n        <ProfileUpdatePasswordForm />\n      </FormContext.Provider>\n    </Modal>\n  );\n};\n\nexport default ProfileUpdatePasswordModal;\n"],"mappings":";;;;;;;AAAA;AACA;AAEA;AACA;AACA;AACA;AAEqC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQrC,IAAMA,0BAAqE,GAAG,SAAxEA,0BAAqE,OAGrE;EAAA,IAFJC,UAAU,QAAVA,UAAU;IACVC,OAAO,QAAPA,OAAO;EAEP,sBAAc,IAAAC,4BAAc,EAAC,CAAC,SAAS,CAAC,CAAC;IAAjCC,CAAC,mBAADA,CAAC;EAET,gBAAsC,IAAAC,eAAQ,EAC5C,CAAC,CAAC,CACH;IAAA;IAFMC,WAAW;IAAEC,cAAc;EAGlC,iBAAkC,IAAAF,eAAQ,GAAsB;IAAA;IAAzDG,SAAS;IAAEC,YAAY;EAC9B,iBAAwB,IAAAJ,eAAQ,EAAgC;MAC9DK,eAAe,EAAE,EAAE;MACnBC,QAAQ,EAAE;IACZ,CAAC,CAAC;IAAA;IAHKC,IAAI;IAAEC,OAAO;EAKpB,mBACE,IAAAC,kBAAW,8hBAQT;IAAA;IATGC,MAAM;IAAEC,OAAO;;EAWtB;EACA,IAAAC,gBAAS,EAAC,YAAM;IACd,IAAIhB,UAAU,EAAE;MACdY,OAAO,CAAC;QACNH,eAAe,EAAE,EAAE;QACnBC,QAAQ,EAAE;MACZ,CAAC,CAAC;IACJ;EACF,CAAC,EAAE,CAACV,UAAU,CAAC,CAAC;EAEhB,IAAMiB,QAAQ,GAAG,IAAAC,kBAAW,EAAC,YAAM;IACjCJ,MAAM,CAAC;MACLK,SAAS,EAAE;QACTC,KAAK,EAAET;MACT,CAAC;MACDU,OAAO,EAAE,iBAACC,KAAK,EAAK;QAClB,IAAAC,2BAAgB,EAACD,KAAK,EAAE;UAAEhB,cAAc,EAAdA,cAAc;UAAEE,YAAY,EAAZA;QAAa,CAAC,CAAC;MAC3D,CAAC;MACDgB,WAAW,EAAE,uBAAM;QACjBlB,cAAc,CAAC,CAAC,CAAC,CAAC;QAClBE,YAAY,CAACiB,SAAS,CAAC;QACvBC,aAAO,CAACC,OAAO,CAACxB,CAAC,CAAC,qCAAqC,CAAC,CAAC;QACzDF,OAAO,EAAE;MACX;IACF,CAAC,CAAC;EACJ,CAAC,EAAE,CAACa,MAAM,EAAEH,IAAI,EAAEV,OAAO,EAAEE,CAAC,CAAC,CAAC;EAE9B,IAAMyB,WAAW,GAAG,IAAAC,cAAO,EACzB;IAAA,OAAO;MACLlB,IAAI,EAAJA,IAAI;MACJC,OAAO,EAAPA,OAAO;MACPP,WAAW,EAAXA,WAAW;MACXC,cAAc,EAAdA,cAAc;MACdC,SAAS,EAATA,SAAS;MACTC,YAAY,EAAZA;IACF,CAAC;EAAA,CAAC,EACF,CAACG,IAAI,EAAEN,WAAW,EAAEE,SAAS,CAAC,CAC/B;EAED,oBACE,6BAAC,WAAK;IACJ,KAAK,EAAEJ,CAAC,CAAC,mCAAmC,CAAE;IAC9C,OAAO,EAAEH,UAAW;IACpB,MAAM,EAAEG,CAAC,CAAC,oCAAoC,CAAE;IAChD,SAAS,EAAEY,OAAQ;IACnB,IAAI,EAAEE,QAAS;IACf,OAAO,EAAEhB;EAAQ,gBAEjB,6BAAC,sBAAW,CAAC,QAAQ;IAAC,KAAK,EAAE2B;EAAY,gBACvC,6BAAC,kCAAyB,OAAG,CACR,CACjB;AAEZ,CAAC;AAAC,eAEa7B,0BAA0B;AAAA"}
+{"version":3,"file":"ProfileUpdatePasswordModal.js","names":["ProfileUpdatePasswordModal","visibility","onClose","useTranslation","t","useForm","currentPassword","password","form","Field","useMutation","commit","loading","useEffect","reset","onSubmit","useCallback","variables","input","values","getAll","onError","error","handleFormErrors","onCompleted","message","success","props","returnObjects"],"sources":["../../../../src/lib/components/profile/ProfileUpdatePasswordModal.tsx"],"sourcesContent":["import { Form, FormItem, InputPassword, message, Modal } from '@os-design/core';\nimport { FormProvider, useForm } from '@os-design/form';\nimport { graphql } from 'babel-plugin-relay/macro';\nimport React, { useCallback, useEffect } from 'react';\nimport { useTranslation } from 'react-i18next';\nimport { useMutation } from 'react-relay/hooks';\nimport handleFormErrors from '../../utils/handleFormErrors';\nimport FormError from '../shared/FormError';\nimport { ProfileUpdatePasswordModalMutation } from './__generated__/ProfileUpdatePasswordModalMutation.graphql';\n\ninterface ProfileUpdatePasswordFormData {\n  currentPassword: string;\n  password: string;\n}\n\ninterface ProfileUpdatePasswordModalProps {\n  visibility: boolean;\n  onClose: () => void;\n}\n\nconst ProfileUpdatePasswordModal: React.FC<ProfileUpdatePasswordModalProps> = ({\n  visibility,\n  onClose,\n}) => {\n  const { t } = useTranslation(['profile']);\n\n  const { form, Field } = useForm<ProfileUpdatePasswordFormData>({\n    currentPassword: '',\n    password: '',\n  });\n\n  const [commit, loading] =\n    useMutation<ProfileUpdatePasswordModalMutation>(graphql`\n      mutation ProfileUpdatePasswordModalMutation(\n        $input: UpdatePasswordInput!\n      ) {\n        updatePassword(input: $input) {\n          id\n        }\n      }\n    `);\n\n  // Reset the data if the modal is visible\n  useEffect(() => {\n    if (visibility) form.reset();\n  }, [form, visibility]);\n\n  const onSubmit = useCallback(() => {\n    commit({\n      variables: {\n        input: form.values.getAll(),\n      },\n      onError: (error) => handleFormErrors(form, error),\n      onCompleted: () => {\n        message.success(t('profile:updatePasswordModal.success'));\n        onClose();\n      },\n    });\n  }, [commit, form, onClose, t]);\n\n  return (\n    <Modal\n      title={t('profile:updatePasswordModal.title')}\n      visible={visibility}\n      okText={t('profile:updatePasswordModal.button')}\n      okLoading={loading}\n      onOk={onSubmit}\n      onClose={onClose}\n    >\n      <FormProvider form={form}>\n        <Form>\n          <Field\n            name='currentPassword'\n            render={(props, { error }) => (\n              <FormItem\n                label={t('profile:updatePasswordModal.currentPassword.label')}\n                error={error}\n              >\n                <InputPassword\n                  placeholder={t(\n                    'profile:updatePasswordModal.currentPassword.placeholder'\n                  )}\n                  {...props}\n                />\n              </FormItem>\n            )}\n          />\n\n          <Field\n            name='password'\n            render={(props, { error }) => (\n              <FormItem\n                label={t('profile:updatePasswordModal.newPassword.label')}\n                error={error}\n              >\n                <InputPassword\n                  placeholder={t(\n                    'profile:updatePasswordModal.newPassword.placeholder'\n                  )}\n                  showStrengthMeter\n                  strengthNames={t(\n                    'profile:updatePasswordModal.passwordStrengthNames',\n                    { returnObjects: true }\n                  )}\n                  {...props}\n                />\n              </FormItem>\n            )}\n          />\n\n          <FormError />\n        </Form>\n      </FormProvider>\n    </Modal>\n  );\n};\n\nexport default ProfileUpdatePasswordModal;\n"],"mappings":";;;;;;;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AAA4C;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAa5C,IAAMA,0BAAqE,GAAG,SAAxEA,0BAAqE,OAGrE;EAAA,IAFJC,UAAU,QAAVA,UAAU;IACVC,OAAO,QAAPA,OAAO;EAEP,sBAAc,IAAAC,4BAAc,EAAC,CAAC,SAAS,CAAC,CAAC;IAAjCC,CAAC,mBAADA,CAAC;EAET,eAAwB,IAAAC,aAAO,EAAgC;MAC7DC,eAAe,EAAE,EAAE;MACnBC,QAAQ,EAAE;IACZ,CAAC,CAAC;IAHMC,IAAI,YAAJA,IAAI;IAAEC,KAAK,YAALA,KAAK;EAKnB,mBACE,IAAAC,kBAAW,8hBAQT;IAAA;IATGC,MAAM;IAAEC,OAAO;;EAWtB;EACA,IAAAC,gBAAS,EAAC,YAAM;IACd,IAAIZ,UAAU,EAAEO,IAAI,CAACM,KAAK,EAAE;EAC9B,CAAC,EAAE,CAACN,IAAI,EAAEP,UAAU,CAAC,CAAC;EAEtB,IAAMc,QAAQ,GAAG,IAAAC,kBAAW,EAAC,YAAM;IACjCL,MAAM,CAAC;MACLM,SAAS,EAAE;QACTC,KAAK,EAAEV,IAAI,CAACW,MAAM,CAACC,MAAM;MAC3B,CAAC;MACDC,OAAO,EAAE,iBAACC,KAAK;QAAA,OAAK,IAAAC,yBAAgB,EAACf,IAAI,EAAEc,KAAK,CAAC;MAAA;MACjDE,WAAW,EAAE,uBAAM;QACjBC,aAAO,CAACC,OAAO,CAACtB,CAAC,CAAC,qCAAqC,CAAC,CAAC;QACzDF,OAAO,EAAE;MACX;IACF,CAAC,CAAC;EACJ,CAAC,EAAE,CAACS,MAAM,EAAEH,IAAI,EAAEN,OAAO,EAAEE,CAAC,CAAC,CAAC;EAE9B,oBACE,6BAAC,WAAK;IACJ,KAAK,EAAEA,CAAC,CAAC,mCAAmC,CAAE;IAC9C,OAAO,EAAEH,UAAW;IACpB,MAAM,EAAEG,CAAC,CAAC,oCAAoC,CAAE;IAChD,SAAS,EAAEQ,OAAQ;IACnB,IAAI,EAAEG,QAAS;IACf,OAAO,EAAEb;EAAQ,gBAEjB,6BAAC,kBAAY;IAAC,IAAI,EAAEM;EAAK,gBACvB,6BAAC,UAAI,qBACH,6BAAC,KAAK;IACJ,IAAI,EAAC,iBAAiB;IACtB,MAAM,EAAE,gBAACmB,KAAK;MAAA,IAAIL,KAAK,SAALA,KAAK;MAAA,oBACrB,6BAAC,cAAQ;QACP,KAAK,EAAElB,CAAC,CAAC,mDAAmD,CAAE;QAC9D,KAAK,EAAEkB;MAAM,gBAEb,6BAAC,mBAAa;QACZ,WAAW,EAAElB,CAAC,CACZ,yDAAyD;MACzD,GACEuB,KAAK,EACT,CACO;IAAA;EACX,EACF,eAEF,6BAAC,KAAK;IACJ,IAAI,EAAC,UAAU;IACf,MAAM,EAAE,gBAACA,KAAK;MAAA,IAAIL,KAAK,SAALA,KAAK;MAAA,oBACrB,6BAAC,cAAQ;QACP,KAAK,EAAElB,CAAC,CAAC,+CAA+C,CAAE;QAC1D,KAAK,EAAEkB;MAAM,gBAEb,6BAAC,mBAAa;QACZ,WAAW,EAAElB,CAAC,CACZ,qDAAqD,CACrD;QACF,iBAAiB;QACjB,aAAa,EAAEA,CAAC,CACd,mDAAmD,EACnD;UAAEwB,aAAa,EAAE;QAAK,CAAC;MACvB,GACED,KAAK,EACT,CACO;IAAA;EACX,EACF,eAEF,6BAAC,kBAAS,OAAG,CACR,CACM,CACT;AAEZ,CAAC;AAAC,eAEa3B,0BAA0B;AAAA"}

package/dist/cjs/components/session/SessionList.js

@@ -19,11 +19,11 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
 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 _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 = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
-var sessionListFragment = _SessionList_sessions !== void 0 ? _SessionList_sessions : (_SessionList_sessions = require("./__generated__/SessionList_sessions.graphql"), _SessionList_sessions.hash && _SessionList_sessions.hash !== "1b21c937c7ba795f09bfcb5ada7d2510" && console.error("The definition of 'SessionList_sessions' appears to have changed. Run `relay-compiler` to update the generated files to receive the expected data."), _SessionList_sessions);
+var sessionsFragment = _SessionList_sessions !== void 0 ? _SessionList_sessions : (_SessionList_sessions = require("./__generated__/SessionList_sessions.graphql"), _SessionList_sessions.hash && _SessionList_sessions.hash !== "1b21c937c7ba795f09bfcb5ada7d2510" && console.error("The definition of 'SessionList_sessions' appears to have changed. Run `relay-compiler` to update the generated files to receive the expected data."), _SessionList_sessions);
 var Title = _styled.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  font-weight: 500;\n  margin: 1em 1em 0.5em;\n"])));
 exports.Title = Title;
 var List = _styled.default.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  border-top: 1px solid ", ";\n  border-bottom: 1px solid ", ";\n"])), function (p) {
@@ -38,7 +38,7 @@ var SESSION_LIST_PADDING_VERTICAL = 0.5;
 exports.SESSION_LIST_PADDING_VERTICAL = SESSION_LIST_PADDING_VERTICAL;
 var SessionList = function SessionList(_ref) {
   var sessionsKey = _ref.sessionsKey;
-  var _useFragment = (0, _hooks.useFragment)(sessionListFragment, sessionsKey),
+  var _useFragment = (0, _hooks.useFragment)(sessionsFragment, sessionsKey),
     sessions = _useFragment.sessions;
   var _useTranslation = (0, _reactI18next.useTranslation)(['profile']),
     t = _useTranslation.t;

package/dist/cjs/components/session/SessionList.js.map

@@ -1 +1 @@
-{"version":3,"file":"SessionList.js","names":["sessionListFragment","Title","styled","div","List","p","clr","theme","listItemColorBorder","DestroyAllOtherSessionsButton","Button","OtherSessions","SESSION_LIST_PADDING_VERTICAL","SessionList","sessionsKey","useFragment","sessions","useTranslation","t","currentSession","useMemo","find","session","current","otherSessions","filter","sort","a","b","Date","lastSeenAt","getTime","useMutation","commitDestroyAllOtherSessions","loadingDestroyAllOtherSessions","destroyAllOtherSessions","useCallback","variables","updater","store","record","get","sessionRecords","getLinkedRecords","setLinkedRecords","item","getDataID","id","onError","error","message","onCompleted","success","length","map"],"sources":["../../../../src/lib/components/session/SessionList.tsx"],"sourcesContent":["import React, { useCallback, useMemo } from 'react';\nimport graphql from 'babel-plugin-relay/macro';\nimport { useFragment, useMutation } from 'react-relay/hooks';\nimport { Button, message } from '@os-design/core';\nimport styled from '@emotion/styled';\nimport { useTranslation } from 'react-i18next';\nimport { clr } from '@os-design/theming';\nimport { SessionList_sessions$key } from './__generated__/SessionList_sessions.graphql';\nimport SessionListItem from './SessionListItem';\nimport { SessionListDestroyAllOtherSessionsMutation } from './__generated__/SessionListDestroyAllOtherSessionsMutation.graphql';\n\nconst sessionListFragment = graphql`\n  fragment SessionList_sessions on Query\n  @refetchable(queryName: \"SessionListRefetchQuery\") {\n    sessions {\n      id\n      current\n      lastSeenAt\n      ...SessionListItem_session\n    }\n  }\n`;\n\ninterface SessionListProps {\n  sessionsKey: SessionList_sessions$key;\n}\n\nexport const Title = styled.div`\n  font-weight: 500;\n  margin: 1em 1em 0.5em;\n`;\n\nexport const List = styled.div`\n  border-top: 1px solid ${(p) => clr(p.theme.listItemColorBorder)};\n  border-bottom: 1px solid ${(p) => clr(p.theme.listItemColorBorder)};\n`;\n\nconst DestroyAllOtherSessionsButton = styled(Button)`\n  & > span {\n    flex: 1;\n    text-align: left;\n  }\n`;\n\nconst OtherSessions = styled.div`\n  margin-top: 2em;\n`;\n\nexport const SESSION_LIST_PADDING_VERTICAL = 0.5;\n\nconst SessionList: React.FC<SessionListProps> = ({ sessionsKey }) => {\n  const { sessions } = useFragment(sessionListFragment, sessionsKey);\n  const { t } = useTranslation(['profile']);\n\n  const currentSession = useMemo(\n    () => sessions.find((session) => session.current),\n    [sessions]\n  );\n\n  const otherSessions = useMemo(\n    () =>\n      sessions\n        .filter((session) => !session.current)\n        .sort(\n          (a, b) =>\n            new Date(b.lastSeenAt).getTime() - new Date(a.lastSeenAt).getTime()\n        ),\n    [sessions]\n  );\n\n  const [commitDestroyAllOtherSessions, loadingDestroyAllOtherSessions] =\n    useMutation<SessionListDestroyAllOtherSessionsMutation>(graphql`\n      mutation SessionListDestroyAllOtherSessionsMutation {\n        destroyAllOtherSessions {\n          ok\n        }\n      }\n    `);\n\n  const destroyAllOtherSessions = useCallback(() => {\n    commitDestroyAllOtherSessions({\n      variables: {},\n      updater: (store) => {\n        const record = store.get('client:root');\n        if (!record) return;\n\n        const sessionRecords = record.getLinkedRecords('sessions');\n        if (!sessionRecords) return;\n\n        record.setLinkedRecords(\n          sessionRecords.filter(\n            (item) => item.getDataID() === currentSession?.id\n          ),\n          'sessions'\n        );\n      },\n      onError: (error) => {\n        message.error(error.message);\n      },\n      onCompleted: () => {\n        message.success(t('profile:sessions.destroyedAllOther'));\n      },\n    });\n  }, [commitDestroyAllOtherSessions, currentSession?.id, t]);\n\n  return (\n    <>\n      {currentSession && (\n        <>\n          <Title>{t('profile:sessions.current')}</Title>\n          <List>\n            <SessionListItem sessionKey={currentSession} hideLastSeenAt />\n          </List>\n        </>\n      )}\n\n      {otherSessions.length > 0 && (\n        <>\n          <DestroyAllOtherSessionsButton\n            type='ghost'\n            danger\n            size='small'\n            wide='always'\n            loading={loadingDestroyAllOtherSessions}\n            onClick={destroyAllOtherSessions}\n          >\n            {t('profile:sessions.destroyAllOther')}\n          </DestroyAllOtherSessionsButton>\n\n          <OtherSessions>\n            <Title>\n              {t('profile:sessions.other')} ({otherSessions.length})\n            </Title>\n            <List>\n              {otherSessions.map((session) => (\n                <SessionListItem key={session.id} sessionKey={session} />\n              ))}\n            </List>\n          </OtherSessions>\n        </>\n      )}\n    </>\n  );\n};\n\nexport default SessionList;\n"],"mappings":"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"}
+{"version":3,"file":"SessionList.js","names":["sessionsFragment","Title","styled","div","List","p","clr","theme","listItemColorBorder","DestroyAllOtherSessionsButton","Button","OtherSessions","SESSION_LIST_PADDING_VERTICAL","SessionList","sessionsKey","useFragment","sessions","useTranslation","t","currentSession","useMemo","find","session","current","otherSessions","filter","sort","a","b","Date","lastSeenAt","getTime","useMutation","commitDestroyAllOtherSessions","loadingDestroyAllOtherSessions","destroyAllOtherSessions","useCallback","variables","updater","store","record","get","sessionRecords","getLinkedRecords","setLinkedRecords","item","getDataID","id","onError","error","message","onCompleted","success","length","map"],"sources":["../../../../src/lib/components/session/SessionList.tsx"],"sourcesContent":["import React, { useCallback, useMemo } from 'react';\nimport graphql from 'babel-plugin-relay/macro';\nimport { useFragment, useMutation } from 'react-relay/hooks';\nimport { Button, message } from '@os-design/core';\nimport styled from '@emotion/styled';\nimport { useTranslation } from 'react-i18next';\nimport { clr } from '@os-design/theming';\nimport { SessionList_sessions$key } from './__generated__/SessionList_sessions.graphql';\nimport SessionListItem from './SessionListItem';\nimport { SessionListDestroyAllOtherSessionsMutation } from './__generated__/SessionListDestroyAllOtherSessionsMutation.graphql';\n\nconst sessionsFragment = graphql`\n  fragment SessionList_sessions on Query\n  @refetchable(queryName: \"SessionListRefetchQuery\") {\n    sessions {\n      id\n      current\n      lastSeenAt\n      ...SessionListItem_session\n    }\n  }\n`;\n\ninterface SessionListProps {\n  sessionsKey: SessionList_sessions$key;\n}\n\nexport const Title = styled.div`\n  font-weight: 500;\n  margin: 1em 1em 0.5em;\n`;\n\nexport const List = styled.div`\n  border-top: 1px solid ${(p) => clr(p.theme.listItemColorBorder)};\n  border-bottom: 1px solid ${(p) => clr(p.theme.listItemColorBorder)};\n`;\n\nconst DestroyAllOtherSessionsButton = styled(Button)`\n  & > span {\n    flex: 1;\n    text-align: left;\n  }\n`;\n\nconst OtherSessions = styled.div`\n  margin-top: 2em;\n`;\n\nexport const SESSION_LIST_PADDING_VERTICAL = 0.5;\n\nconst SessionList: React.FC<SessionListProps> = ({ sessionsKey }) => {\n  const { sessions } = useFragment(sessionsFragment, sessionsKey);\n  const { t } = useTranslation(['profile']);\n\n  const currentSession = useMemo(\n    () => sessions.find((session) => session.current),\n    [sessions]\n  );\n\n  const otherSessions = useMemo(\n    () =>\n      sessions\n        .filter((session) => !session.current)\n        .sort(\n          (a, b) =>\n            new Date(b.lastSeenAt).getTime() - new Date(a.lastSeenAt).getTime()\n        ),\n    [sessions]\n  );\n\n  const [commitDestroyAllOtherSessions, loadingDestroyAllOtherSessions] =\n    useMutation<SessionListDestroyAllOtherSessionsMutation>(graphql`\n      mutation SessionListDestroyAllOtherSessionsMutation {\n        destroyAllOtherSessions {\n          ok\n        }\n      }\n    `);\n\n  const destroyAllOtherSessions = useCallback(() => {\n    commitDestroyAllOtherSessions({\n      variables: {},\n      updater: (store) => {\n        const record = store.get('client:root');\n        if (!record) return;\n\n        const sessionRecords = record.getLinkedRecords('sessions');\n        if (!sessionRecords) return;\n\n        record.setLinkedRecords(\n          sessionRecords.filter(\n            (item) => item.getDataID() === currentSession?.id\n          ),\n          'sessions'\n        );\n      },\n      onError: (error) => {\n        message.error(error.message);\n      },\n      onCompleted: () => {\n        message.success(t('profile:sessions.destroyedAllOther'));\n      },\n    });\n  }, [commitDestroyAllOtherSessions, currentSession?.id, t]);\n\n  return (\n    <>\n      {currentSession && (\n        <>\n          <Title>{t('profile:sessions.current')}</Title>\n          <List>\n            <SessionListItem sessionKey={currentSession} hideLastSeenAt />\n          </List>\n        </>\n      )}\n\n      {otherSessions.length > 0 && (\n        <>\n          <DestroyAllOtherSessionsButton\n            type='ghost'\n            danger\n            size='small'\n            wide='always'\n            loading={loadingDestroyAllOtherSessions}\n            onClick={destroyAllOtherSessions}\n          >\n            {t('profile:sessions.destroyAllOther')}\n          </DestroyAllOtherSessionsButton>\n\n          <OtherSessions>\n            <Title>\n              {t('profile:sessions.other')} ({otherSessions.length})\n            </Title>\n            <List>\n              {otherSessions.map((session) => (\n                <SessionListItem key={session.id} sessionKey={session} />\n              ))}\n            </List>\n          </OtherSessions>\n        </>\n      )}\n    </>\n  );\n};\n\nexport default SessionList;\n"],"mappings":"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"}

package/dist/cjs/components/session/SessionListItem.js

@@ -28,14 +28,14 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
 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 _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 _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 _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
 function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread 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 _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
 function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
-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 _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 _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
 var sessionListItemFragment = _SessionListItem_session !== void 0 ? _SessionListItem_session : (_SessionListItem_session = require("./__generated__/SessionListItem_session.graphql"), _SessionListItem_session.hash && _SessionListItem_session.hash !== "c73c341c5f6e75f7bef7402186ce242b" && console.error("The definition of 'SessionListItem_session' appears to have changed. Run `relay-compiler` to update the generated files to receive the expected data."), _SessionListItem_session);
 var Container = _styled.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  display: flex;\n  position: relative;\n  padding: 0.5em 0;\n  overflow: hidden;\n\n  &:not(:last-of-type) {\n    border-bottom: 1px solid ", ";\n  }\n\n  @media (hover: hover) {\n    // Hide actions by default\n    & > nav {\n      opacity: 0;\n    }\n\n    // Display actions either on focus, or on hover\n    &:hover,\n    &:focus-within {\n      & > nav {\n        opacity: 1;\n      }\n    }\n  }\n\n  ", ";\n"])), function (p) {