refactor: replace useTransactionStore with useCreditTransactionStore in credit-related components

src/components/layout/credits-balance-button.tsx

@@ -4,13 +4,13 @@ import { getCreditBalanceAction } from '@/actions/get-credit-balance';
 import { Button } from '@/components/ui/button';
 import { useLocaleRouter } from '@/i18n/navigation';
 import { Routes } from '@/routes';
-import { useTransactionStore } from '@/stores/transaction-store';
+import { useCreditTransactionStore } from '@/stores/transaction-store';
 import { CoinsIcon, Loader2Icon } from 'lucide-react';
 import { useEffect, useState } from 'react';
 
 export function CreditsBalanceButton() {
   const router = useLocaleRouter();
-  const { refreshTrigger } = useTransactionStore();
+  const { refreshTrigger } = useCreditTransactionStore();
   const [credits, setCredits] = useState<number>(0);
   const [loading, setLoading] = useState(true);
 

src/components/layout/credits-balance-menu.tsx

@@ -3,7 +3,7 @@
 import { getCreditBalanceAction } from '@/actions/get-credit-balance';
 import { useLocaleRouter } from '@/i18n/navigation';
 import { Routes } from '@/routes';
-import { useTransactionStore } from '@/stores/transaction-store';
+import { useCreditTransactionStore } from '@/stores/transaction-store';
 import { CoinsIcon, Loader2Icon } from 'lucide-react';
 import { useTranslations } from 'next-intl';
 import { useEffect, useState } from 'react';
@@ -11,7 +11,7 @@ import { useEffect, useState } from 'react';
 export function CreditsBalanceMenu() {
   const t = useTranslations('Marketing.avatar');
   const router = useLocaleRouter();
-  const { refreshTrigger } = useTransactionStore();
+  const { refreshTrigger } = useCreditTransactionStore();
   const [credits, setCredits] = useState<number>(0);
   const [loading, setLoading] = useState(true);
 

src/components/settings/credits/credit-packages.tsx

@@ -15,7 +15,7 @@ import { useLocaleRouter } from '@/i18n/navigation';
 import { formatPrice } from '@/lib/formatter';
 import { cn } from '@/lib/utils';
 import { Routes } from '@/routes';
-import { useTransactionStore } from '@/stores/transaction-store';
+import { useCreditTransactionStore } from '@/stores/transaction-store';
 import { CircleCheckBigIcon, CoinsIcon, Loader2Icon } from 'lucide-react';
 import { useTranslations } from 'next-intl';
 import { useSearchParams } from 'next/navigation';
@@ -31,7 +31,7 @@ export function CreditPackages() {
   const t = useTranslations('Dashboard.settings.credits.packages');
   const [loadingCredits, setLoadingCredits] = useState(true);
   const [credits, setCredits] = useState<number | null>(null);
-  const { refreshTrigger, triggerRefresh } = useTransactionStore();
+  const { refreshTrigger, triggerRefresh } = useCreditTransactionStore();
   const currentUser = useCurrentUser();
   const searchParams = useSearchParams();
   const localeRouter = useLocaleRouter();

src/components/settings/credits/credit-transactions-page.tsx

@@ -3,7 +3,7 @@
 import { getCreditTransactionsAction } from '@/actions/get-credit-transactions';
 import type { CreditTransaction } from '@/components/settings/credits/credit-transactions-table';
 import { CreditTransactionsTable } from '@/components/settings/credits/credit-transactions-table';
-import { useTransactionStore } from '@/stores/transaction-store';
+import { useCreditTransactionStore } from '@/stores/transaction-store';
 import type { SortingState } from '@tanstack/react-table';
 import { useTranslations } from 'next-intl';
 import { useEffect, useState } from 'react';
@@ -20,7 +20,7 @@ export function CreditTransactionsPageClient() {
     { id: 'createdAt', desc: true },
   ]);
   const [loading, setLoading] = useState(false);
-  const { refreshTrigger } = useTransactionStore();
+  const { refreshTrigger } = useCreditTransactionStore();
 
   const fetchData = async () => {
     setLoading(true);

src/stores/transaction-store.ts

@@ -1,11 +1,14 @@
-import { create } from "zustand";
+import { create } from 'zustand';
 
-interface TransactionStore {
+interface CreditTransactionStore {
   refreshTrigger: number;
   triggerRefresh: () => void;
 }
 
-export const useTransactionStore = create<TransactionStore>((set) => ({
+export const useCreditTransactionStore = create<CreditTransactionStore>(
-  refreshTrigger: 0,
+  (set) => ({
-  triggerRefresh: () => set((state) => ({ refreshTrigger: state.refreshTrigger + 1 })),
+    refreshTrigger: 0,
-}));
+    triggerRefresh: () =>
+      set((state) => ({ refreshTrigger: state.refreshTrigger + 1 })),
+  })
+);