admin/WealthySmart
1
0
Fork 0
mirror of https://github.com/escalante29/WealthySmart.git synced 2026-07-17 16:08:47 +02:00
Code Issues Actions Packages Projects Releases Wiki Activity

Add accounts expansion, analytics, exchange rates, API tokens, PWA support, and UI overhaul
All checks were successful
Deploy to VPS / deploy (push) Successful in 45s
Details

Browse Source 
- Expand Account model with account_type (pension, savings, liability, crypto), new banks/currencies (BTC, XMR, FCL, ROP, VOL, MEMP, MPAT, MORTGAGE), and next_payment field
- Add exchange rate endpoint (BCCR integration), analytics endpoint, paste-import for transactions, and API token management
- Add PWA manifest, service worker, and app icons
- Redesign dashboard, transactions, transfers, and login pages with theme support
- Add billing cycle selector, confirm dialog, and paste import modal components
- One-time DB reset in deploy workflow for schema migration

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
Carlos Escalante
2026-03-21 18:23:47 -06:00
parent 1257b0dd61
commit 0a8e00e227
39 changed files with 2247 additions and 220 deletions
Download Patch File Download Diff File Expand all files Collapse all files

141
frontend/src/components/PasteImportModal.tsx Normal file
View File

@@ -0,0 +1,141 @@
import { useState } from 'react';
import { X, ClipboardPaste, CheckCircle, AlertTriangle } from 'lucide-react';
import api, { type ImportResult } from '../api';
interface Props {
onClose: () => void;
onImported: () => void;
}
export default function PasteImportModal({ onClose, onImported }: Props) {
const [text, setText] = useState('');
const [bank, setBank] = useState('BAC');
const [source, setSource] = useState('CREDIT_CARD');
const [importing, setImporting] = useState(false);
const [result, setResult] = useState<ImportResult | null>(null);
const handleImport = async () => {
if (!text.trim()) return;
setImporting(true);
try {
const { data } = await api.post<ImportResult>('/import/paste', { text, bank, source });
setResult(data);
if (data.imported > 0) onImported();
} catch (err) {
console.error(err);
} finally {
setImporting(false);
}
};
const inputClass =
'w-full bg-input-bg border border-border rounded-lg px-3 py-2.5 text-sm text-text-primary placeholder-text-faint focus:outline-none focus:border-[#606C38]/50 focus:ring-1 focus:ring-[#606C38]/20 transition-colors';
const labelClass = 'block text-xs font-medium text-text-secondary mb-1 uppercase tracking-wider';
return (
<div className="fixed inset-0 z-50 flex items-center justify-center bg-black/60 backdrop-blur-sm p-4">
<div className="bg-surface border border-border rounded-xl w-full max-w-2xl max-h-[90vh] overflow-y-auto">
<div className="flex items-center justify-between px-5 py-4 border-b border-border">
<div className="flex items-center gap-2">
<ClipboardPaste className="w-4 h-4 text-[#606C38] dark:text-[#7a8a4a]" />
<h3 className="font-semibold">Import Bank Statement</h3>
</div>
<button onClick={onClose} className="text-text-muted hover:text-text-primary transition-colors">
<X className="w-5 h-5" />
</button>
</div>
<div className="p-5 space-y-4">
{!result ? (
<>
<div className="grid grid-cols-2 gap-4">
<div>
<label className={labelClass}>Bank</label>
<select className={inputClass} value={bank} onChange={(e) => setBank(e.target.value)}>
<option value="BAC">BAC</option>
<option value="BCR">BCR</option>
<option value="DAVIVIENDA">Davivienda</option>
</select>
</div>
<div>
<label className={labelClass}>Source</label>
<select className={inputClass} value={source} onChange={(e) => setSource(e.target.value)}>
<option value="CREDIT_CARD">Credit Card</option>
<option value="CASH">Cash</option>
<option value="TRANSFER">Transfer</option>
</select>
</div>
</div>
<div>
<label className={labelClass}>Statement Text</label>
<textarea
className={`${inputClass} h-48 font-mono text-xs resize-y`}
value={text}
onChange={(e) => setText(e.target.value)}
placeholder={`Paste bank statement lines here...\n\nFormat: DD/MM/YYYY\tMERCHANT\\CITY\\COUNTRY\tAMOUNT CRC`}
/>
<p className="text-xs text-text-faint mt-1">
One transaction per line. Tab-separated columns.
</p>
</div>
<div className="flex gap-3 pt-2">
<button
type="button"
onClick={onClose}
className="flex-1 px-4 py-2.5 rounded-lg text-sm font-medium text-text-secondary border border-border hover:bg-surface-hover transition-colors"
>
Cancel
</button>
<button
onClick={handleImport}
disabled={importing || !text.trim()}
className="flex-1 px-4 py-2.5 rounded-lg text-sm font-medium bg-[#606C38] hover:bg-[#7a8a4a] text-white dark:text-[#FEFAE0] transition-colors disabled:opacity-50"
>
{importing ? 'Importing...' : 'Import'}
</button>
</div>
</>
) : (
<div className="space-y-4">
<div className="flex items-center gap-3 p-4 bg-[#606C38]/10 border border-[#606C38]/20 rounded-lg">
<CheckCircle className="w-5 h-5 text-[#606C38] dark:text-[#7a8a4a] flex-shrink-0" />
<div>
<p className="font-medium text-[#606C38] dark:text-[#7a8a4a]">Import Complete</p>
<p className="text-sm text-text-secondary mt-1">
{result.imported} imported
{result.duplicates > 0 && ` · ${result.duplicates} duplicates skipped`}
</p>
</div>
</div>
{result.errors.length > 0 && (
<div className="p-4 bg-amber-500/10 border border-amber-500/20 rounded-lg">
<div className="flex items-center gap-2 mb-2">
<AlertTriangle className="w-4 h-4 text-amber-500 dark:text-amber-400" />
<span className="text-sm font-medium text-amber-600 dark:text-amber-400">
{result.errors.length} errors
</span>
</div>
<ul className="text-xs text-text-secondary space-y-1 font-mono max-h-32 overflow-y-auto">
{result.errors.map((err, i) => (
<li key={i}>{err}</li>
))}
</ul>
</div>
)}
<button
onClick={onClose}
className="w-full px-4 py-2.5 rounded-lg text-sm font-medium bg-[#606C38] hover:bg-[#7a8a4a] text-white dark:text-[#FEFAE0] transition-colors"
>
Done
</button>
</div>
)}
</div>
</div>
</div>
);
}