feat: Add loading to delete confirmation dialog

This commit is contained in:
twwu
2024-10-31 16:44:04 +08:00
parent 7d4f8e0082
commit 837990cb80

View File

@ -39,6 +39,10 @@ const Action: FC<Props> = ({
setFalse: hidePluginInfo, setFalse: hidePluginInfo,
}] = useBoolean(false) }] = useBoolean(false)
const mutateInstalledPluginList = usePluginPageContext(v => v.mutateInstalledPluginList) const mutateInstalledPluginList = usePluginPageContext(v => v.mutateInstalledPluginList)
const [deleting, {
setTrue: showDeleting,
setFalse: hideDeleting,
}] = useBoolean(false)
const handleFetchNewVersion = () => { } const handleFetchNewVersion = () => { }
@ -48,7 +52,9 @@ const Action: FC<Props> = ({
}] = useBoolean(false) }] = useBoolean(false)
const handleDelete = useCallback(async () => { const handleDelete = useCallback(async () => {
showDeleting()
const res = await uninstallPlugin(pluginId) const res = await uninstallPlugin(pluginId)
hideDeleting()
if (res.success) { if (res.success) {
hideDeleteConfirm() hideDeleteConfirm()
mutateInstalledPluginList() mutateInstalledPluginList()
@ -99,23 +105,21 @@ const Action: FC<Props> = ({
onHide={hidePluginInfo} onHide={hidePluginInfo}
/> />
)} )}
{ <Confirm
isShowDeleteConfirm && ( isShow={isShowDeleteConfirm}
<Confirm title={t(`${i18nPrefix}.delete`)}
isShow content={
title={t(`${i18nPrefix}.delete`)} <div>
content={ {t(`${i18nPrefix}.deleteContentLeft`)}<span className='system-md-semibold'>{pluginName}</span>{t(`${i18nPrefix}.deleteContentRight`)}<br />
<div> {/* // todo: add usedInApps */}
{t(`${i18nPrefix}.deleteContentLeft`)}<span className='system-md-semibold'>{pluginName}</span>{t(`${i18nPrefix}.deleteContentRight`)}<br /> {/* {usedInApps > 0 && t(`${i18nPrefix}.usedInApps`, { num: usedInApps })} */}
{/* // todo: add usedInApps */} </div>
{/* {usedInApps > 0 && t(`${i18nPrefix}.usedInApps`, { num: usedInApps })} */} }
</div> onCancel={hideDeleteConfirm}
} onConfirm={handleDelete}
onCancel={hideDeleteConfirm} isLoading={deleting}
onConfirm={handleDelete} isDisabled={deleting}
/> />
)
}
</div> </div>
) )
} }