fcarra/Condopay
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Update ExtraordinaryUser.tsx

Browse Source
This commit is contained in:
Francesco Carrà
2025-12-09 23:39:48 +01:00
committed by GitHub
parent 3fe4ce4266
commit 6f70631b78
1 changed files with 22 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

25
pages/ExtraordinaryUser.tsx
View File

@@ -2,17 +2,25 @@
import React, { useEffect, useState } from 'react';
import { CondoService } from '../services/mockDb';
import { PayPalScriptProvider, PayPalButtons } from "@paypal/react-paypal-js";
import { Briefcase, Calendar, CheckCircle2 } from 'lucide-react';
import { Briefcase, Calendar, CheckCircle2, AlertCircle } from 'lucide-react';
export const ExtraordinaryUser: React.FC = () => {
const [expenses, setExpenses] = useState<any[]>([]); // Using any for composite object from specific API
const [loading, setLoading] = useState(true);
const [paypalClientId, setPaypalClientId] = useState<string>('');
const [successMsg, setSuccessMsg] = useState('');
const [hasFamily, setHasFamily] = useState(true);
useEffect(() => {
const load = async () => {
try {
const user = CondoService.getCurrentUser();
if (!user?.familyId) {
setHasFamily(false);
setLoading(false);
return;
}
const [myExp, condo] = await Promise.all([
CondoService.getMyExpenses(),
CondoService.getActiveCondo()
@@ -44,6 +52,17 @@ export const ExtraordinaryUser: React.FC = () => {
if (loading) return <div className="p-8 text-center text-slate-400">Caricamento spese...</div>;
if (!hasFamily) {
return (
<div className="p-8 text-center bg-amber-50 rounded-xl border border-amber-200 text-amber-800">
<AlertCircle className="w-12 h-12 mx-auto mb-3 text-amber-500" />
<h3 className="text-lg font-bold mb-2">Nessuna Famiglia Associata</h3>
<p>Il tuo utente (probabilmente Admin) non è collegato ad alcuna famiglia, quindi non ci sono spese personali da mostrare.</p>
<p className="text-sm mt-2 text-amber-700">Vai in Impostazioni &gt; Utenti e associa il tuo account a una famiglia per testare questa vista.</p>
</div>
);
}
return (
<div className="space-y-6 pb-20 animate-fade-in">
<div>
@@ -97,12 +116,12 @@ export const ExtraordinaryUser: React.FC = () => {
<div className="w-full bg-blue-200 h-1.5 rounded-full overflow-hidden">
<div
className="bg-blue-600 h-full transition-all duration-500"
style={{ width: `${(exp.myShare.amountPaid / exp.myShare.amountDue) * 100}%` }}
style={{ width: `${Math.min(100, (exp.myShare.amountPaid / exp.myShare.amountDue) * 100)}%` }}
/>
</div>
<div className="flex justify-between text-xs mt-1 text-blue-600">
<span>Versato: € {exp.myShare.amountPaid.toFixed(2)}</span>
<span>Restante: € {remaining.toFixed(2)}</span>
<span>Restante: € {Math.max(0, remaining).toFixed(2)}</span>
</div>
</div>
</div>