fix: remove repetitive quota refresh interval

This commit is contained in:
Ethan Stewart 2024-04-29 16:52:58 +08:00
parent b87919114c
commit 5214ea58ae
4 changed files with 31 additions and 17 deletions

View File

@ -1,6 +1,6 @@
import { useTranslation } from "react-i18next";
import { useDispatch, useSelector } from "react-redux";
import { selectAuthenticated, selectUsername } from "@/store/auth.ts";
import auth, { selectAuthenticated, selectUsername } from "@/store/auth.ts";
import {
closeMarket,
selectCurrent,
@ -8,7 +8,7 @@ import {
selectMaskItem,
useConversationActions,
} from "@/store/chat.ts";
import React, { useRef, useState } from "react";
import React, { useCallback, useRef, useState } from "react";
import { ConversationInstance } from "@/api/types.tsx";
import { useToast } from "@/components/ui/use-toast.ts";
import { extractMessage, filterMessage } from "@/utils/processor.ts";
@ -46,6 +46,9 @@ import { goAuth } from "@/utils/app.ts";
import Avatar from "@/components/Avatar.tsx";
import { cn } from "@/components/ui/lib/utils.ts";
import { getNumberMemory } from "@/utils/memory.ts";
import { refreshSubscription } from "@/store/subscription.ts";
import { refreshQuota } from "@/store/quota.ts";
import { AppDispatch } from "@/store";
type Operation = {
target: ConversationInstance | null;
@ -329,11 +332,25 @@ function SidebarConversationList({
function SidebarMenu() {
const username = useSelector(selectUsername);
const dispatch: AppDispatch = useDispatch();
const updateQuota = useCallback(() => {
dispatch(refreshQuota()); // 调用 refreshQuota 更新配额
}, [dispatch]);
const handleRefreshSubscription = async () => {
if (!auth) {
return;
}
await refreshSubscription(dispatch);
};
return (
<div className={`sidebar-menu`}>
<Separator orientation={`horizontal`} className={`mb-2`} />
<MenuBar className={`menu-bar`}>
<Button variant={`ghost`} className={`sidebar-wrapper`}>
<Button variant={`ghost`} className={`sidebar-wrapper`}
onClick={() => {
updateQuota();
handleRefreshSubscription();
}}>
<Avatar username={username} />
<span className={`username`}>{username}</span>
<MoreHorizontal className={`h-4 w-4`} />

View File

@ -98,10 +98,7 @@ function QuotaDialog() {
const dispatch = useDispatch();
useEffectAsync(async () => {
if (!auth) return;
const task = setInterval(() => refreshQuota(dispatch), 5000);
await refreshQuota(dispatch);
return () => clearInterval(task);
await refreshQuota();
}, [auth]);
return (
@ -322,7 +319,7 @@ function QuotaDialog() {
}),
});
setRedeem("");
await refreshQuota(dispatch);
await refreshQuota();
} else {
toast({
title: t("buy.exchange-failed"),

View File

@ -115,10 +115,7 @@ function SubscriptionDialog() {
const dispatch = useDispatch();
useEffectAsync(async () => {
if (!auth) return;
const task = setInterval(() => refreshSubscription(dispatch), 10000);
await refreshSubscription(dispatch);
return () => clearInterval(task);
}, [auth]);
return (

View File

@ -1,5 +1,5 @@
import { createSlice } from "@reduxjs/toolkit";
import { AppDispatch, RootState } from "./index.ts";
import { createAsyncThunk, createSlice } from '@reduxjs/toolkit';
import { RootState } from "./index.ts";
import { getQuota } from "@/api/quota.ts";
export const quotaSlice = createSlice({
@ -49,7 +49,10 @@ export const quotaValueSelector = (state: RootState): number =>
state.quota.quota;
export const quotaSelector = (state: RootState): number => state.quota.quota;
export const refreshQuota = async (dispatch: AppDispatch) => {
const quota = await getQuota();
dispatch(setQuota(quota));
};
export const refreshQuota = createAsyncThunk(
'quota/refreshQuota',
async (_, { dispatch }) => {
const quota = await getQuota();
dispatch(setQuota(quota));
}
);