Store host info in state so the modal doesn't update after reloading managers

This commit is contained in:
Eric Rosenbaum 2021-08-27 10:20:37 -04:00
parent a6b7ef3c4b
commit 5aa1b8c8e7

View file

@ -27,10 +27,17 @@ const TransferHostConfirmation = ({
hostId,
selectedId
}) => {
const currentHostUsername = items.find(item => item.id === hostId).username;
const currentHostImage = items.find(item => item.id === hostId).profile.images['90x90'];
const newHostUsername = items.find(item => item.id === selectedId).username;
const newHostImage = items.find(item => item.id === selectedId).profile.images['90x90'];
// Initialize host info so it does not get updated after we reload the manager list
const [hostInfo] = useState(() => {
const currentHostItem = items.find(item => item.id === hostId);
const newHostItem = items.find(item => item.id === selectedId);
return {
currentHostUsername: currentHostItem.username,
currentHostImage: currentHostItem.profile.images['90x90'],
newHostUsername: newHostItem.username,
newHostImage: newHostItem.profile.images['90x90']
};
});
const [passwordInputValue, setPasswordInputValue] = useState('');
const [submitting, setSubmitting] = useState(false);
const [validationError, setValidationError] = useState(null);
@ -46,13 +53,13 @@ const TransferHostConfirmation = ({
const handleSubmit = () => {
setSubmitting(true);
handleTransferHost(passwordInputValue, newHostUsername, selectedId)
handleTransferHost(passwordInputValue, hostInfo.newHostUsername, selectedId)
.then(() => handleLoadManagers(true)) // reload the list of managers, to get them in the correct order
.then(() => {
handleClose();
successAlert({
id: 'studio.alertTransfer',
values: {name: newHostUsername}
values: {name: hostInfo.newHostUsername}
});
})
.catch(e => {
@ -86,8 +93,8 @@ const TransferHostConfirmation = ({
className="transfer-outcome-tile"
key={hostId}
id={hostId}
image={currentHostImage}
username={currentHostUsername}
image={hostInfo.currentHostImage}
username={hostInfo.currentHostUsername}
isCreator={false}
/>
</div>
@ -103,8 +110,8 @@ const TransferHostConfirmation = ({
className="transfer-outcome-tile"
key={selectedId}
id={selectedId}
image={newHostImage}
username={newHostUsername}
image={hostInfo.newHostImage}
username={hostInfo.newHostUsername}
isCreator={false}
/>
</div>