(core) Make ProfileDialog wait consistently for work to finish before closing.

Summary: - Added functionality to modal.ts to allow pending work to delay the closing of the dialog.

Test Plan: Added a test case that tickled a failure previously.

Reviewers: georgegevoian

Reviewed By: georgegevoian

Differential Revision: https://phab.getgrist.com/D3071
This commit is contained in:
Dmitry S
2021-10-12 11:59:12 -04:00
parent 9d1cc89dc9
commit 16eb158673
3 changed files with 141 additions and 51 deletions

View File

@@ -27,7 +27,6 @@ function showProfileContent(ctl: IModalControl, owner: MultiHolder, appModel: Ap
const isNameValid = Computed.create(owner, nameEdit, (use, val) => checkName(val));
let needsReload = false;
let closeBtn: Element;
async function fetchApiKey() { apiKey.set(await appModel.api.fetchApiKey()); }
async function createApiKey() { apiKey.set(await appModel.api.createApiKey()); }
@@ -46,17 +45,18 @@ function showProfileContent(ctl: IModalControl, owner: MultiHolder, appModel: Ap
async function updateUserName(val: string) {
const user = userObs.get();
if (user && val && val !== user.name) {
closeBtn.toggleAttribute('disabled', true);
try {
await appModel.api.updateUserName(val);
await fetchAll();
needsReload = true;
} finally {
closeBtn.toggleAttribute('disabled', false);
}
await appModel.api.updateUserName(val);
await fetchAll();
needsReload = true;
}
}
owner.onDispose(() => {
if (needsReload) {
appModel.topAppModel.initialize();
}
});
return [
cssModalTitle('User Profile'),
cssModalWidth('fixed-wide'),
@@ -70,7 +70,7 @@ function showProfileContent(ctl: IModalControl, owner: MultiHolder, appModel: Ap
transientInput(
{
initialValue: user.name,
save: (val) => isNameValid.get() && updateUserName(val),
save: ctl.doWork(async (val) => isNameValid.get() && updateUserName(val)),
close: () => { isEditingName.set(false); nameEdit.set(''); },
},
dom.on('input', (ev, el) => nameEdit.set(el.value)),
@@ -105,21 +105,17 @@ function showProfileContent(ctl: IModalControl, owner: MultiHolder, appModel: Ap
cssDataRow(cssSubHeader('API Key'), cssContent(
dom.create(ApiKey, {
apiKey,
onCreate: createApiKey,
onDelete: deleteApiKey,
onCreate: ctl.doWork(createApiKey),
onDelete: ctl.doWork(deleteApiKey),
anonymous: false,
})
)),
)
)),
cssModalButtons(
closeBtn = bigPrimaryButton('Close',
dom.on('click', () => {
if (needsReload) {
appModel.topAppModel.initialize();
}
ctl.close();
}),
bigPrimaryButton('Close',
dom.boolAttr('disabled', ctl.workInProgress),
dom.on('click', () => ctl.close()),
testId('modal-confirm')
),
),