Skip to content

Commit 642d1eb

Browse files
talhainvenxiontalhainvenxion
committed
fixed selected user issue fixed while updating user
1 parent 82c310d commit 642d1eb

File tree

2 files changed

+115
-86
lines changed

2 files changed

+115
-86
lines changed

‎src/ui/layouts/settings/Organization/UpdateMember.tsx‎

Lines changed: 63 additions & 39 deletions
Original file line numberDiff line numberDiff line change
@@ -25,17 +25,16 @@ import { httpMethods } from '../../../../api/constants';
2525
import { apiUrl } from '../../../../api/apiUrl';
2626
import { sessionSelectors, rolesSelectors } from '../../../../redux/selectors';
2727
import { useSelector } from '../../../hooks';
28-
import axios from 'axios'
29-
import Select, { StylesConfig } from 'react-select'
28+
import axios from 'axios';
29+
import Select, { StylesConfig } from 'react-select';
3030

3131
export const UpdateMember: React.FC<{ member: any }> = ({ member }) => {
32-
3332
const preRole = member?.roles?.map((e: any) => {
34-
return { value: e.id, label: e.name }
35-
})
33+
return { value: e.id, label: e.name };
34+
});
3635

37-
const [username, setUsername] = useState('')
38-
const [password, setPassword] = useState('')
36+
const [username, setUsername] = useState('');
37+
const [password, setPassword] = useState('');
3938
const [popupOpen, setPopupOpen] = useState(false);
4039
const [submitting, setSubmitting] = useState(false);
4140
const [role, setRole] = useState(preRole);
@@ -46,17 +45,17 @@ export const UpdateMember: React.FC<{ member: any }> = ({ member }) => {
4645
const authenticationToken = authToken ? authToken : '';
4746

4847
const allRoles = roles?.map((e) => {
49-
return { value: e.id, label: e.name }
50-
})
48+
return { value: e.id, label: e.name };
49+
});
5150

5251
const handleChange = (value: string) => {
5352
setRole(value);
54-
}
53+
};
5554

5655
useEffect(() => {
57-
setUsername(member?.name)
56+
setUsername(member?.name);
5857
// eslint-disable-next-line
59-
}, [])
58+
}, [member]);
6059

6160
const onUpdate = async () => {
6261
setSubmitting(true);
@@ -80,25 +79,32 @@ export const UpdateMember: React.FC<{ member: any }> = ({ member }) => {
8079
'Content-Type': 'application/json',
8180
},
8281
data: { name: username },
83-
})
82+
});
8483
}
8584

86-
const { data } = await axios.get(`${process.env.REACT_APP_BASE_API_URL}/role_assignments?user_name_or_id=${member?.name}`, { headers: { Authorization: `Bearer ${authToken}` } })
87-
85+
const {
86+
data,
87+
} = await axios.get(
88+
`${process.env.REACT_APP_BASE_API_URL}/role_assignments?user_name_or_id=${member?.name}`,
89+
{ headers: { Authorization: `Bearer ${authToken}` } },
90+
);
91+
8892
for (let index = 0; index < data?.length; index++) {
8993
const singleDelRole = data[index];
90-
await axios.delete(`https://appserver.zenml.io/api/v1/role_assignments/${singleDelRole?.id}`,
91-
{ headers: { Authorization: `Bearer ${authToken}` } }
92-
)
94+
await axios.delete(
95+
`https://appserver.zenml.io/api/v1/role_assignments/${singleDelRole?.id}`,
96+
{ headers: { Authorization: `Bearer ${authToken}` } },
97+
);
9398
}
9499

95100
for (let index = 0; index < role.length; index++) {
96101
const singleRole = role[index];
97-
await axios.post(`${process.env.REACT_APP_BASE_API_URL}/role_assignments`,
102+
await axios.post(
103+
`${process.env.REACT_APP_BASE_API_URL}/role_assignments`,
98104
// @ts-ignore
99105
{ user: member.id, role: singleRole?.value },
100-
{ headers: { Authorization: `Bearer ${authToken}` } }
101-
)
106+
{ headers: { Authorization: `Bearer ${authToken}` } },
107+
);
102108
}
103109

104110
setSubmitting(false);
@@ -127,47 +133,63 @@ export const UpdateMember: React.FC<{ member: any }> = ({ member }) => {
127133
description: err.response?.data?.detail[1],
128134
type: toasterTypes.failure,
129135
}),
130-
)
136+
);
131137
}
132138
};
133139

134-
135140
const colourStyles: StylesConfig<any> = {
136-
control: (styles: any) => ({ ...styles, fontSize: '1.6rem', fontFamily: 'Rubik', color: '#424240' }),
141+
control: (styles: any) => ({
142+
...styles,
143+
fontSize: '1.6rem',
144+
fontFamily: 'Rubik',
145+
color: '#424240',
146+
}),
137147
option: (styles: any) => {
138148
return {
139149
...styles,
140-
fontSize: '1.6rem', fontFamily: 'Rubik', color: '#424240'
150+
fontSize: '1.6rem',
151+
fontFamily: 'Rubik',
152+
color: '#424240',
141153
};
142-
}
143-
}
144-
154+
},
155+
};
145156

146157
return (
147158
<>
148159
{popupOpen && (
149160
<Popup onClose={() => setPopupOpen(false)}>
150-
151161
<FlexBox.Row alignItems="center" justifyContent="space-between">
152-
<H3 bold color="darkGrey">{translate('updateMemberPopup.title')}</H3>
162+
<H3 bold color="darkGrey">
163+
{translate('updateMemberPopup.title')}
164+
</H3>
153165
</FlexBox.Row>
154-
<Box marginTop="sm"><Paragraph>{`${translate('updateMemberPopup.text')} ${member?.name}.`}</Paragraph></Box>
155-
156-
<Box marginTop='lg'>
166+
<Box marginTop="sm">
167+
<Paragraph>{`${translate('updateMemberPopup.text')} ${
168+
member?.name
169+
}.`}</Paragraph>
170+
</Box>
157171

172+
<Box marginTop="lg">
158173
<Box>
159174
<FormTextField
160175
label={translate('updateMemberPopup.form.username.label')}
161176
labelColor="#000"
162-
placeholder={translate('updateMemberPopup.form.username.placeholder')}
177+
placeholder={translate(
178+
'updateMemberPopup.form.username.placeholder',
179+
)}
163180
value={username ? username : ''}
164181
onChange={(val: string) => setUsername(val)}
165182
/>
166183
</Box>
167184

168-
<Box marginTop='md'>
169-
<Paragraph size="body" style={{ color: 'black' }}><label htmlFor={username}>{'Roles'}</label></Paragraph>
170-
<Select options={allRoles} isMulti onChange={(e: any) => handleChange(e)}
185+
<Box marginTop="md">
186+
<Paragraph size="body" style={{ color: 'black' }}>
187+
<label htmlFor={username}>{'Roles'}</label>
188+
</Paragraph>
189+
<Select
190+
options={allRoles}
191+
isMulti
192+
onChange={(e: any) => handleChange(e)}
171193
value={role}
172194
placeholder={'Roles'}
173195
styles={colourStyles}
@@ -179,7 +201,9 @@ export const UpdateMember: React.FC<{ member: any }> = ({ member }) => {
179201
<FormPasswordField
180202
label={translate('updateMemberPopup.form.password.label')}
181203
labelColor="#000"
182-
placeholder={translate('updateMemberPopup.form.password.placeholder')}
204+
placeholder={translate(
205+
'updateMemberPopup.form.password.placeholder',
206+
)}
183207
value={password}
184208
onChange={(val: string) => setPassword(val)}
185209
error={{
@@ -215,4 +239,4 @@ export const UpdateMember: React.FC<{ member: any }> = ({ member }) => {
215239
</Box>
216240
</>
217241
);
218-
};
242+
};

‎src/ui/layouts/settings/Organization/tokenPopup.tsx‎

Lines changed: 52 additions & 47 deletions
Original file line numberDiff line numberDiff line change
@@ -20,12 +20,11 @@ import { Popup } from '../../common/Popup';
2020
import { organizationSelectors } from '../../../../redux/selectors';
2121

2222
export const TokenPopup: React.FC<{
23-
id: string;
24-
username: string;
25-
active: boolean
26-
}> = ({ id, username, active }) => {
27-
28-
const [popupOpen, setPopupOpen] = useState(false)
23+
id: string;
24+
username: string;
25+
active: boolean;
26+
}> = ({ id, username, active }) => {
27+
const [popupOpen, setPopupOpen] = useState(false);
2928
const [submitting, setSubmitting] = useState(false);
3029
const [showTokField, setShowTokField] = useState(false);
3130

@@ -34,29 +33,28 @@ export const TokenPopup: React.FC<{
3433
const inviteCode = useSelector(organizationSelectors.inviteForCode);
3534

3635
const generateToken = () => {
37-
setSubmitting(true);
38-
dispatch(
39-
organizationActions.inviteByCode({
40-
username,
41-
onFailure: (errorText: string) => {
42-
dispatch(
43-
showToasterAction({
44-
description: errorText,
45-
type: toasterTypes.failure,
46-
}),
47-
);
48-
setSubmitting(false);
49-
setPopupOpen(false)
50-
},
51-
onSuccess: () => {
52-
setSubmitting(false);
53-
setShowTokField(true)
54-
}
36+
setSubmitting(true);
37+
dispatch(
38+
organizationActions.inviteByCode({
39+
username,
40+
onFailure: (errorText: string) => {
41+
dispatch(
42+
showToasterAction({
43+
description: errorText,
44+
type: toasterTypes.failure,
5545
}),
5646
);
57-
}
58-
59-
47+
setSubmitting(false);
48+
setPopupOpen(false);
49+
},
50+
onSuccess: () => {
51+
setSubmitting(false);
52+
setShowTokField(true);
53+
},
54+
}),
55+
);
56+
};
57+
6058
const onClose = () => {
6159
setShowTokField(false);
6260
setSubmitting(false);
@@ -65,25 +63,32 @@ export const TokenPopup: React.FC<{
6563

6664
return (
6765
<>
68-
<Paragraph style={{ color:'#8045FF', cursor: 'pointer' }} onClick={() => setPopupOpen(true)} >{!active && 'Pending'}</Paragraph>
69-
70-
{popupOpen && (
71-
<Popup onClose={onClose}>
72-
<FlexBox.Row alignItems="center" justifyContent="space-between">
73-
<H3 bold color="darkGrey">
74-
{translate('popup.generateInviteModal.title')}
75-
</H3>
76-
</FlexBox.Row>
77-
<Box marginTop="md">
78-
<Paragraph>{`${translate('popup.generateInviteModal.text')} ${username}. This will invalidate the currently active token.`}</Paragraph>
66+
<Paragraph
67+
style={{ color: '#8045FF', cursor: 'pointer' }}
68+
onClick={() => setPopupOpen(true)}
69+
>
70+
{!active && 'Pending'}
71+
</Paragraph>
72+
73+
{popupOpen && (
74+
<Popup onClose={onClose}>
75+
<FlexBox.Row alignItems="center" justifyContent="space-between">
76+
<H3 bold color="darkGrey">
77+
{translate('popup.generateInviteModal.title')}
78+
</H3>
79+
</FlexBox.Row>
80+
<Box marginTop="md">
81+
<Paragraph>{`${translate(
82+
'popup.generateInviteModal.text',
83+
)} ${username}. This will invalidate the currently active token.`}</Paragraph>
7984
</Box>
8085
<Box marginTop="xl">
8186
<Box>
8287
<FlexBox.Row marginBottom="md">
8388
<Box style={{ width: showTokField ? '100%' : '70%' }}>
8489
<FormTextField
8590
label={translate('popup.username.label')}
86-
labelColor='#000'
91+
labelColor="#000"
8792
placeholder={translate('popup.username.placeholder')}
8893
value={username}
8994
disabled
@@ -107,14 +112,14 @@ export const TokenPopup: React.FC<{
107112
</FlexBox.Row>
108113

109114
{showTokField && (
110-
<Box marginTop='lg'>
111-
<CopyField
112-
label={`Invitation Link - please send this to ${username} for this user to finish their registration`}
113-
value={`${window.location.origin}/signup?user=${id}&username=${username}&token=${inviteCode}`}
114-
disabled
115-
/>
116-
</Box>
117-
)}
115+
<Box marginTop="lg">
116+
<CopyField
117+
label={`Invitation Link - please send this to ${username} for this user to finish their registration`}
118+
value={`${window.location.origin}/signup?user=${id}&username=${username}&token=${inviteCode}`}
119+
disabled
120+
/>
121+
</Box>
122+
)}
118123
</Box>
119124
</Box>
120125
</Popup>

0 commit comments

Comments
 (0)