+
{w.name}
-
{w.currency}
+
+ {w.currency}
+
{walletBalanceFormatter.format(w.balance)}
diff --git a/apps/frontend/src/lib/api.ts b/apps/frontend/src/lib/api.ts
index 6af7cae..2b7efa2 100644
--- a/apps/frontend/src/lib/api.ts
+++ b/apps/frontend/src/lib/api.ts
@@ -339,7 +339,12 @@ export type Wallet = {
export type WalletMovement = {
id: number;
walletId: number;
- type: "DEPOSIT" | "WITHDRAWAL" | "TRANSFER_IN" | "TRANSFER_OUT" | "ADJUSTMENT";
+ type:
+ | "DEPOSIT"
+ | "WITHDRAWAL"
+ | "TRANSFER_IN"
+ | "TRANSFER_OUT"
+ | "ADJUSTMENT";
amount: number;
description: string | null;
referenceWalletId: number | null;
@@ -390,10 +395,7 @@ export function deleteWallet(id: number): Promise
{
return mutator(`/api/wallets/${id}`, "DELETE");
}
-export function depositWallet(
- id: number,
- data: DepositInput,
-): Promise {
+export function depositWallet(id: number, data: DepositInput): Promise {
return mutator(`/api/wallets/${id}/deposit`, "POST", data);
}
@@ -418,9 +420,7 @@ export function setDefaultWallet(id: number): Promise {
return mutator(`/api/wallets/${id}/default`, "PUT");
}
-export function getWalletMovements(
- id: number,
-): Promise {
+export function getWalletMovements(id: number): Promise {
return fetcher(`/api/wallets/${id}/movements`);
}
@@ -447,6 +447,21 @@ export function getWalletMovementsFiltered(
);
}
+// Settings
+
+export type Setting = {
+ key: string;
+ value: string;
+};
+
+export function getSettings(): Promise {
+ return fetcher("/api/settings");
+}
+
+export function updateSetting(key: string, value: string): Promise {
+ return mutator("/api/settings", "PUT", { key, value });
+}
+
// Telegram
export type TelegramStatus = {
diff --git a/apps/frontend/src/lib/queries.ts b/apps/frontend/src/lib/queries.ts
index 478524b..4bd1b9f 100644
--- a/apps/frontend/src/lib/queries.ts
+++ b/apps/frontend/src/lib/queries.ts
@@ -6,23 +6,23 @@ import {
} from "@tanstack/react-query";
import {
type AdjustBalanceInput,
+ adjustBalance as adjustBalanceApi,
type CreateNonPeriodicExpenseInput,
type CreatePeriodicExpenseInput,
type CreateWalletInput,
- type DepositInput,
- type TransferInput,
- type WalletMovementsFilter,
createNonPeriodicExpense as createNonPeriodicExpenseApi,
createPeriodicExpense as createPeriodicExpenseApi,
+ createWallet as createWalletApi,
+ type DepositInput,
deletePeriodicExpense as deletePeriodicExpenseApi,
+ deleteWallet as deleteWalletApi,
depositWallet as depositWalletApi,
- adjustBalance as adjustBalanceApi,
fetchQuotes,
generateMonthlyExpense as generateMonthlyExpenseApi,
+ generateTelegramCode,
getDailyMinMax,
getDailyQuotes,
getExpenses,
- generateTelegramCode,
getHistoricalMinMax,
getMonthlyPayedTotal,
getMonthlyTotals,
@@ -30,23 +30,25 @@ import {
getPeriodicExpenses,
getQuoteHistory,
getQuotes,
+ getSettings,
getTelegramStatus,
getTotalPending,
getWalletMovements,
getWalletMovementsFiltered,
getWallets,
- setDefaultWallet as setDefaultWalletApi,
importExpenses,
importPeriodicExpenses,
type PayExpenseInput,
payExpense as payExpenseApi,
+ setDefaultWallet as setDefaultWalletApi,
+ type TransferInput,
+ transferWallet as transferWalletApi,
type UpdateExpenseInput,
updateExpense as updateExpenseApi,
updatePeriodicExpense as updatePeriodicExpenseApi,
- createWallet as createWalletApi,
+ updateSetting as updateSettingApi,
updateWallet as updateWalletApi,
- deleteWallet as deleteWalletApi,
- transferWallet as transferWalletApi,
+ type WalletMovementsFilter,
} from "./api";
export const quoteKeys = {
@@ -422,6 +424,31 @@ export function useWalletMovementsFiltered(filter: WalletMovementsFilter) {
});
}
+// Settings
+
+export const settingKeys = {
+ all: ["settings"] as const,
+};
+
+export function useSettings() {
+ return useQuery({
+ queryKey: settingKeys.all,
+ queryFn: getSettings,
+ staleTime: 60_000,
+ });
+}
+
+export function useUpdateSetting() {
+ const queryClient = useQueryClient();
+ return useMutation({
+ mutationFn: ({ key, value }: { key: string; value: string }) =>
+ updateSettingApi(key, value),
+ onSuccess: () => {
+ queryClient.invalidateQueries({ queryKey: settingKeys.all });
+ },
+ });
+}
+
// Telegram
export function useTelegramStatus() {
diff --git a/apps/frontend/src/routes/_authenticated/settings.tsx b/apps/frontend/src/routes/_authenticated/settings.tsx
index ca471a3..8955522 100644
--- a/apps/frontend/src/routes/_authenticated/settings.tsx
+++ b/apps/frontend/src/routes/_authenticated/settings.tsx
@@ -1,12 +1,14 @@
import { createFileRoute } from "@tanstack/react-router";
import { Check, Copy, RefreshCw } from "lucide-react";
-import { useState } from "react";
+import { useEffect, useState } from "react";
import { Button } from "@/components/ui/button";
import { Input } from "@/components/ui/input";
import { useAuth } from "@/lib/auth-context";
import {
useGenerateTelegramCode,
+ useSettings,
useTelegramStatus,
+ useUpdateSetting,
} from "@/lib/queries";
export const Route = createFileRoute("/_authenticated/settings")({
@@ -126,11 +128,79 @@ function SettingsPage() {
+
+
);
}
+function SalaryMultiplierSection() {
+ const { data: settings, isLoading } = useSettings();
+ const updateSetting = useUpdateSetting();
+ const current =
+ settings?.find((s) => s.key === "salary_multiplier")?.value ?? "4500";
+ const [localValue, setLocalValue] = useState(current);
+ const [success, setSuccess] = useState(false);
+
+ useEffect(() => {
+ if (settings) {
+ const val = settings.find((s) => s.key === "salary_multiplier")?.value;
+ if (val) setLocalValue(val);
+ }
+ }, [settings]);
+
+ async function handleSave() {
+ setSuccess(false);
+ await updateSetting.mutateAsync({
+ key: "salary_multiplier",
+ value: localValue,
+ });
+ setSuccess(true);
+ setTimeout(() => setSuccess(false), 2000);
+ }
+
+ return (
+
+
+
+ Multiplicador de sueldo
+
+
+ Valor para calcular el sueldo (Sueldo = BELO bid x este valor)
+
+
+
+ {isLoading ? (
+
Cargando...
+ ) : (
+
+
+ setLocalValue(e.target.value)}
+ className="w-32"
+ />
+
+
+ {success && (
+
+ Multiplicador actualizado correctamente
+
+ )}
+
+ )}
+
+ );
+}
+
function TelegramSection() {
const { data: status, isLoading } = useTelegramStatus();
const {