fix: role field in invite & User dialog.

This commit is contained in:
elforjani13
2021-11-26 19:48:19 +02:00
parent 64bf223458
commit 313d0f3d0f
7 changed files with 53 additions and 36 deletions

View File

@@ -9,7 +9,7 @@ const Schema = Yup.object().shape({
.matches()
.required()
.label(intl.get('phone_number_')),
role_name: Yup.string().required().label(intl.get('roles.label.role_name_')),
role_id: Yup.string().required().label(intl.get('roles.label.role_name_')),
});
export const UserFormSchema = Schema;

View File

@@ -24,7 +24,7 @@ function UserFormContent({
closeDialog,
}) {
const { isSubmitting } = useFormikContext();
const { dialogName } = useUserFormContext();
const { dialogName, roles } = useUserFormContext();
const handleClose = () => {
closeDialog(dialogName);
@@ -89,24 +89,26 @@ function UserFormContent({
)}
</FastField>
{/* ----------- Role name ----------- */}
<FastField name={'role_name'}>
<FastField name={'role_id'}>
{({ form, field: { value }, meta: { error, touched } }) => (
<FormGroup
label={<T id={'roles.label.role_name'} />}
labelInfo={<FieldRequiredHint />}
className={classNames('form-group--role_name', CLASSES.FILL)}
helperText={<ErrorMessage name="role_id" />}
className={classNames(CLASSES.FILL, 'form-group--role_name')}
intent={inputIntent({ error, touched })}
>
<ListSelect
items={[]}
// onItemSelect={(item) => {
// form.setFieldValue('role_name', item.role_id);
// }}
items={roles}
onItemSelect={({ id }) => {
form.setFieldValue('role_id', id);
}}
selectedItem={value}
selectedItemProp={'role_id '}
// textProp={'role_name'}
// labelProp={'role_id '}
selectedItemProp={'id'}
textProp={'name'}
// labelProp={'id '}
popoverProps={{ minimal: true }}
intent={inputIntent({ error, touched })}
/>
</FormGroup>
)}

View File

@@ -1,5 +1,5 @@
import React, { createContext, useContext } from 'react';
import { useEditUser, useUser } from 'hooks/query';
import { useEditUser, useUser, useRoles } from 'hooks/query';
import { DialogContent } from 'components';
@@ -17,6 +17,9 @@ function UserFormProvider({ userId, dialogName, ...props }) {
enabled: !!userId,
});
// fetch roles list.
const { data: roles, isLoading: isRolesLoading } = useRoles();
const isEditMode = userId;
// Provider state.
@@ -28,10 +31,14 @@ function UserFormProvider({ userId, dialogName, ...props }) {
EditUserMutate,
isEditMode,
roles,
};
return (
<DialogContent isLoading={isUserLoading} name={'user-form'}>
<DialogContent
isLoading={isUserLoading || isRolesLoading}
name={'user-form'}
>
<UserFormContext.Provider value={provider} {...props} />
</DialogContent>
);