webextension: fix useEffect dependency tracking

This commit is contained in:
Florian Dold 2021-12-08 11:03:50 +01:00
parent 5b1f779b12
commit 73dabdf43a
No known key found for this signature in database
GPG Key ID: D2E4F00F29D02A4B
2 changed files with 10 additions and 4 deletions

View File

@ -134,6 +134,8 @@ export function PayPage({
const foundAmount = foundBalance
? Amounts.parseOrThrow(foundBalance.available)
: undefined;
// We use a string here so that dependency tracking for useEffect works properly
const foundAmountStr = foundAmount ? Amounts.stringify(foundAmount) : undefined;
useEffect(() => {
if (!talerPayUri) return;
@ -142,6 +144,7 @@ export function PayPage({
const p = await wxApi.preparePay(talerPayUri);
setPayStatus(p);
} catch (e) {
console.log("Got error while trying to pay", e);
if (e instanceof OperationFailedError) {
setPayErrMsg(e);
}
@ -151,7 +154,7 @@ export function PayPage({
}
};
doFetch();
}, [talerPayUri, foundAmount]);
}, [talerPayUri, foundAmountStr]);
if (!talerPayUri) {
return <span>missing pay uri</span>;

View File

@ -13,7 +13,7 @@
You should have received a copy of the GNU General Public License along with
TALER; see the file COPYING. If not, see <http://www.gnu.org/licenses/>
*/
import { ExchangesListRespose, NotificationType } from "@gnu-taler/taler-util";
import { NotificationType } from "@gnu-taler/taler-util";
import { useEffect, useState } from "preact/hooks";
import * as wxApi from "../wxApi";
@ -30,7 +30,10 @@ interface HookError {
export type HookResponse<T> = HookOk<T> | HookError | undefined;
//"withdraw-group-finished"
export function useAsyncAsHook<T>(fn: () => Promise<T>, updateOnNotification?: Array<NotificationType>): HookResponse<T> {
export function useAsyncAsHook<T>(
fn: () => Promise<T>,
updateOnNotification?: Array<NotificationType>,
): HookResponse<T> {
const [result, setHookResponse] = useState<HookResponse<T>>(undefined);
useEffect(() => {
async function doAsync() {
@ -46,7 +49,7 @@ export function useAsyncAsHook<T>(fn: () => Promise<T>, updateOnNotification?: A
doAsync();
if (updateOnNotification && updateOnNotification.length > 0) {
return wxApi.onUpdateNotification(updateOnNotification, () => {
doAsync()
doAsync();
});
}
}, []);