diff --git a/src/components/AccountSummary.astro b/src/components/AccountSummary.astro index d15f22f..8cd4b6e 100644 --- a/src/components/AccountSummary.astro +++ b/src/components/AccountSummary.astro @@ -1,6 +1,6 @@ --- -import { formatCurrency } from '../utils'; import type { Account } from '../types'; +import { formatCurrency } from '../utils'; interface Props { account: Account; diff --git a/src/components/AccountSummary.tsx b/src/components/AccountSummary.tsx index 96158f0..64b411d 100644 --- a/src/components/AccountSummary.tsx +++ b/src/components/AccountSummary.tsx @@ -1,14 +1,11 @@ -import React, { useState, useEffect } from 'react'; import { useStore } from '@nanostores/react'; +import type React from 'react'; +import { useEffect, useState } from 'react'; +import { currentAccountId as currentAccountIdStore, refreshKey } from '../stores/transactionStore'; import type { Account } from '../types'; import { formatCurrency } from '../utils'; -import { currentAccountId as currentAccountIdStore, refreshKey } from '../stores/transactionStore'; -interface AccountSummaryProps { - // No props needed, data comes from store and fetch -} - -export default function AccountSummary({}: AccountSummaryProps) { +export default function AccountSummary() { const currentAccountId = useStore(currentAccountIdStore); const refreshCounter = useStore(refreshKey); const [account, setAccount] = useState(null); @@ -42,7 +39,7 @@ export default function AccountSummary({}: AccountSummaryProps) { }; fetchDetails(); - }, [currentAccountId, refreshCounter]); + }, [currentAccountId]); // Determine content based on state let balanceContent: React.ReactNode; diff --git a/src/components/AddTransactionForm.tsx b/src/components/AddTransactionForm.tsx index 03f6b1b..225fca7 100644 --- a/src/components/AddTransactionForm.tsx +++ b/src/components/AddTransactionForm.tsx @@ -1,18 +1,16 @@ -import React, { useState, useEffect } from 'react'; import { useStore } from '@nanostores/react'; -import type { Transaction } from '../types'; +import type React from 'react'; +import { useEffect, useState } from 'react'; // Import store atoms and actions import { - currentAccountId as currentAccountIdStore, - transactionToEdit as transactionToEditStore, cancelEditingTransaction, + currentAccountId as currentAccountIdStore, transactionSaved, + transactionToEdit as transactionToEditStore, } from '../stores/transactionStore'; +import type { Transaction } from '../types'; -// Remove props that now come from the store -interface AddTransactionFormProps {} - -export default function AddTransactionForm({}: AddTransactionFormProps) { +export default function AddTransactionForm() { // --- Read state from store --- const currentAccountId = useStore(currentAccountIdStore); const transactionToEdit = useStore(transactionToEditStore); @@ -44,7 +42,7 @@ export default function AddTransactionForm({}: AddTransactionFormProps) { try { const dateObj = new Date(transactionToEdit.date); // Check if date is valid before formatting - if (!isNaN(dateObj.getTime())) { + if (!Number.isNaN(dateObj.getTime())) { // Directly format the date object (usually interpreted as UTC midnight) // into the YYYY-MM-DD format required by the input. // No timezone adjustment needed here. @@ -87,8 +85,8 @@ export default function AddTransactionForm({}: AddTransactionFormProps) { if (!amount) { errors.push('Amount is required'); } else { - const amountNum = parseFloat(amount); - if (isNaN(amountNum)) { + const amountNum = Number.parseFloat(amount); + if (Number.isNaN(amountNum)) { errors.push('Amount must be a valid number'); } else if (amountNum === 0) { errors.push('Amount cannot be zero'); @@ -98,8 +96,8 @@ export default function AddTransactionForm({}: AddTransactionFormProps) { errors.push('Date is required'); } else { try { - const dateObj = new Date(date + 'T00:00:00'); // Treat input as local date - if (isNaN(dateObj.getTime())) { + const dateObj = new Date(`${date}T00:00:00`); // Treat input as local date + if (Number.isNaN(dateObj.getTime())) { errors.push('Invalid date format'); } } catch (e) { @@ -134,7 +132,7 @@ export default function AddTransactionForm({}: AddTransactionFormProps) { accountId: currentAccountId, date: date, // Send as YYYY-MM-DD string description: description.trim(), - amount: parseFloat(amount), + amount: Number.parseFloat(amount), }; const method = editingId ? 'PUT' : 'POST'; diff --git a/src/components/MainContent.astro b/src/components/MainContent.astro index 99a1570..663ef0f 100644 --- a/src/components/MainContent.astro +++ b/src/components/MainContent.astro @@ -1,6 +1,6 @@ --- -import TransactionTable from './TransactionTable.tsx'; import type { Account } from '../types'; +import TransactionTable from './TransactionTable.tsx'; interface Props { account: Account; diff --git a/src/components/Sidebar.astro b/src/components/Sidebar.astro index 4ec558f..bb84d1c 100644 --- a/src/components/Sidebar.astro +++ b/src/components/Sidebar.astro @@ -1,7 +1,7 @@ --- +import type { Account } from '../types'; import AccountSummary from './AccountSummary.tsx'; // Import the React component instead of the Astro one import AddTransactionForm from './AddTransactionForm.tsx'; -import type { Account } from '../types'; interface Props { accounts: Account[]; diff --git a/src/components/TransactionTable.astro b/src/components/TransactionTable.astro index 7f27a34..6968582 100644 --- a/src/components/TransactionTable.astro +++ b/src/components/TransactionTable.astro @@ -1,6 +1,6 @@ --- -import { formatCurrency, formatDate } from '../utils'; import type { Transaction } from '../types'; +import { formatCurrency, formatDate } from '../utils'; interface Props { transactions: Transaction[]; @@ -10,7 +10,7 @@ const { transactions } = Astro.props; // Sort transactions by date descending for display const sortedTransactions = [...transactions].sort( - (a, b) => new Date(b.date).getTime() - new Date(a.date).getTime() + (a, b) => new Date(b.date).getTime() - new Date(a.date).getTime(), ); // TODO: UI/UX Improvements diff --git a/src/components/TransactionTable.tsx b/src/components/TransactionTable.tsx index ff4ce84..ed5ffa5 100644 --- a/src/components/TransactionTable.tsx +++ b/src/components/TransactionTable.tsx @@ -1,17 +1,15 @@ -import React, { useState, useEffect } from 'react'; import { useStore } from '@nanostores/react'; +import React, { useState, useEffect } from 'react'; +import { + currentAccountId as currentAccountIdStore, + refreshKey, + startEditingTransaction, + triggerRefresh, +} from '../stores/transactionStore'; import type { Transaction } from '../types'; import { formatCurrency, formatDate } from '../utils'; -import { - startEditingTransaction, - currentAccountId as currentAccountIdStore, - triggerRefresh, - refreshKey, -} from '../stores/transactionStore'; -interface TransactionTableProps {} - -export default function TransactionTable({}: TransactionTableProps) { +export default function TransactionTable() { const currentAccountId = useStore(currentAccountIdStore); const refreshCounter = useStore(refreshKey); @@ -44,10 +42,10 @@ export default function TransactionTable({}: TransactionTableProps) { }; fetchTransactions(); - }, [currentAccountId, refreshCounter]); + }, [currentAccountId]); const sortedTransactions = [...transactions].sort( - (a, b) => new Date(b.date).getTime() - new Date(a.date).getTime() + (a, b) => new Date(b.date).getTime() - new Date(a.date).getTime(), ); const handleDelete = async (txnId: string) => { @@ -76,7 +74,7 @@ export default function TransactionTable({}: TransactionTableProps) { console.log(`Transaction ${txnId} deleted successfully.`); setTransactions((currentTransactions) => - currentTransactions.filter((txn) => txn.id !== txnId) + currentTransactions.filter((txn) => txn.id !== txnId), ); triggerRefresh(); @@ -139,6 +137,7 @@ export default function TransactionTable({}: TransactionTableProps) {