Skip to content
Snippets Groups Projects
Select Git revision
  • fc8df8815e0cf2476f0f2d3d00eebd68ec3daa17
  • master default protected
  • v3-modify-mail
  • snyk-fix-207483a1e839c807f95a55077e86527d
  • translations_3b5aa4f3c755059914cfa23d7d2edcde_ru
  • translations_6e4a5e377a3e50f17e6402264fdbfcc6_ru
  • translations_3b5aa4f3c755059914cfa23d7d2edcde_fa_IR
  • translations_en-yml--master_fa_IR
  • snyk-fix-7d634f2eb65555f41bf06d6af930e812
  • translations_en-yml--master_ar
  • translations_3b5aa4f3c755059914cfa23d7d2edcde_el
  • jfederico-patch-1
  • v2
  • v3
  • v1
  • release-3.1.0.2
  • release-3.1.0.1
  • release-3.1.0
  • release-2.14.8.4
  • release-3.0.9.1
  • release-3.0.9
  • release-3.0.8.1
  • release-2.14.8.3
  • release-3.0.8
  • release-3.0.7.1
  • release-2.14.8.2
  • release-3.0.7
  • release-3.0.6.1
  • release-3.0.6
  • release-3.0.5.4
  • release-3.0.5.3
  • release-2.14.8.1
  • release-3.0.5.2
  • release-3.0.5.1
  • release-3.0.5
35 results

admin.rake

Blame
  • UpdateUserForm.jsx 2.95 KiB
    import React from 'react';
    import { Button, Stack } from 'react-bootstrap';
    import PropTypes from 'prop-types';
    import { useTranslation } from 'react-i18next';
    import Form from '../../../shared_components/forms/Form';
    import FormControl from '../../../shared_components/forms/FormControl';
    import useUpdateUser from '../../../../hooks/mutations/users/useUpdateUser';
    import Spinner from '../../../shared_components/utilities/Spinner';
    import { useAuth } from '../../../../contexts/auth/AuthProvider';
    import useRoles from '../../../../hooks/queries/admin/roles/useRoles';
    import FormSelect from '../../../shared_components/forms/controls/FormSelect';
    import Option from '../../../shared_components/utilities/Option';
    import useLocales from '../../../../hooks/queries/locales/useLocales';
    import useUpdateUserForm from '../../../../hooks/forms/users/user/useUpdateUserForm';
    import PermissionChecker from '../../../../helpers/PermissionChecker';
    
    export default function UpdateUserForm({ user }) {
      const currentUser = useAuth();
      const localesAPI = useLocales();
      const updateUserAPI = useUpdateUser(user?.id);
      const { t } = useTranslation();
    
      const { methods, fields, reset } = useUpdateUserForm({
        defaultValues: {
          name: user?.name,
          email: user?.email,
          language: user?.language,
          role_id: user?.role?.id,
        },
      });
    
      const canUpdateRole = PermissionChecker.hasManageUsers(currentUser);
      const rolesAPI = useRoles({ enabled: canUpdateRole });
    
      return (
        <Form methods={methods} onSubmit={updateUserAPI.mutate}>
          <FormControl field={fields.name} type="text" />
          <FormControl field={fields.email} type="email" readOnly />
          <FormSelect field={fields.language} variant="dropdown">
            {
              Object.keys(localesAPI.data || {}).map((code) => <Option key={code} value={code}>{localesAPI.data[code]}</Option>)
            }
          </FormSelect>
          {(canUpdateRole && rolesAPI.data) && (
            <FormSelect field={fields.role_id} variant="dropdown">
              {
                rolesAPI.data.map((role) => <Option key={role.id} value={role.id}>{role.name}</Option>)
              }
            </FormSelect>
          )}
          <Stack direction="horizontal" gap={2} className="float-end">
            <Button variant="neutral" onClick={reset}> { t('cancel') } </Button>
            <Button variant="brand" type="submit" disabled={updateUserAPI.isLoading}>
              { t('update') }
              {updateUserAPI.isLoading && <Spinner className="me-2" />}
            </Button>
          </Stack>
        </Form>
      );
    }
    
    UpdateUserForm.propTypes = {
      user: PropTypes.shape({
        id: PropTypes.string.isRequired,
        avatar: PropTypes.string.isRequired,
        name: PropTypes.string.isRequired,
        email: PropTypes.string.isRequired,
        provider: PropTypes.string.isRequired,
        role: PropTypes.shape({
          id: PropTypes.string.isRequired,
          name: PropTypes.string.isRequired,
          color: PropTypes.string.isRequired,
        }).isRequired,
        language: PropTypes.string.isRequired,
      }).isRequired,
    };