chore: refresh table after ban or unban user

This commit is contained in:
javayhu 2025-05-11 11:46:43 +08:00
parent bcb1e0ef9d
commit 245dfaa6e1
3 changed files with 21 additions and 1 deletions

View File

@ -25,6 +25,7 @@ import { authClient } from '@/lib/auth-client';
import type { User } from '@/lib/auth-types';
import { formatDate } from '@/lib/formatter';
import { cn } from '@/lib/utils';
import { useUsersStore } from '@/stores/users-store';
import {
CalendarIcon,
Loader2Icon,
@ -48,6 +49,7 @@ export function UserDetailViewer({ user }: UserDetailViewerProps) {
const [error, setError] = useState<string | undefined>();
const [banReason, setBanReason] = useState('');
const [banExpiresAt, setBanExpiresAt] = useState<Date | undefined>();
const triggerRefresh = useUsersStore((state) => state.triggerRefresh);
const handleBan = async () => {
if (!banReason) {
@ -76,6 +78,8 @@ export function UserDetailViewer({ user }: UserDetailViewerProps) {
// Reset form
setBanReason('');
setBanExpiresAt(undefined);
// Trigger refresh
triggerRefresh();
} catch (err) {
const error = err as Error;
console.error('Failed to ban user:', error);
@ -101,6 +105,8 @@ export function UserDetailViewer({ user }: UserDetailViewerProps) {
});
toast.success(t('unban.success'));
// Trigger refresh
triggerRefresh();
} catch (err) {
const error = err as Error;
console.error('Failed to unban user:', error);

View File

@ -3,6 +3,7 @@
import { getUsersAction } from '@/actions/get-users';
import { UsersTable } from '@/components/admin/users-table';
import type { User } from '@/lib/auth-types';
import { useUsersStore } from '@/stores/users-store';
import type { SortingState } from '@tanstack/react-table';
import { useTranslations } from 'next-intl';
import { useEffect, useState } from 'react';
@ -17,6 +18,7 @@ export function UsersPageClient() {
const [total, setTotal] = useState(0);
const [loading, setLoading] = useState(false);
const [sorting, setSorting] = useState<SortingState>([]);
const refreshTrigger = useUsersStore((state) => state.refreshTrigger);
useEffect(() => {
const fetchUsers = async () => {
@ -49,7 +51,7 @@ export function UsersPageClient() {
};
fetchUsers();
}, [pageIndex, pageSize, search, sorting]);
}, [pageIndex, pageSize, search, sorting, refreshTrigger]);
return (
<>

12
src/stores/users-store.ts Normal file
View File

@ -0,0 +1,12 @@
import { create } from 'zustand';
interface UsersState {
refreshTrigger: number;
triggerRefresh: () => void;
}
export const useUsersStore = create<UsersState>((set) => ({
refreshTrigger: 0,
triggerRefresh: () =>
set((state) => ({ refreshTrigger: state.refreshTrigger + 1 })),
}));