feat: Introduce multi-condo management and notices
This commit refactors the application to support managing multiple condominiums. Key changes include: - Introduction of `Condo` and `Notice` data types. - Implementation of multi-condo selection and management, including active condo context. - Addition of a notice system to inform users about important updates or events within a condo. - Styling adjustments to ensure better visibility of form elements. - Mock database updates to accommodate new entities and features.
This commit is contained in:
BIN
.dockerignore
BIN
.dockerignore
Binary file not shown.
29
Dockerfile
29
Dockerfile
@@ -1,29 +0,0 @@
|
||||
# Stage 1: Build dell'applicazione React
|
||||
FROM node:18-alpine as build
|
||||
|
||||
WORKDIR /app
|
||||
|
||||
# Copia i file di dipendenze
|
||||
COPY package*.json ./
|
||||
|
||||
# Installa le dipendenze
|
||||
RUN npm install
|
||||
|
||||
# Copia tutto il codice sorgente
|
||||
COPY . .
|
||||
|
||||
# Esegue la build (crea la cartella dist)
|
||||
RUN npm run build
|
||||
|
||||
# Stage 2: Serve con Nginx
|
||||
FROM nginx:alpine
|
||||
|
||||
# Copia il file di configurazione nginx custom (che creeremo al punto 3)
|
||||
COPY nginx.conf /etc/nginx/conf.d/default.conf
|
||||
|
||||
# Copia i file compilati dalla build stage alla cartella di Nginx
|
||||
COPY --from=build /app/dist /usr/share/nginx/html
|
||||
|
||||
EXPOSE 80
|
||||
|
||||
CMD ["nginx", "-g", "daemon off;"]
|
||||
|
||||
@@ -1,12 +1,62 @@
|
||||
import React from 'react';
|
||||
|
||||
import React, { useEffect, useState } from 'react';
|
||||
import { NavLink, Outlet } from 'react-router-dom';
|
||||
import { Users, Settings, Building, LogOut, Menu, X } from 'lucide-react';
|
||||
import { Users, Settings, Building, LogOut, Menu, X, ChevronDown, Check, LayoutDashboard, Megaphone, Info, AlertTriangle, Hammer, Calendar } from 'lucide-react';
|
||||
import { CondoService } from '../services/mockDb';
|
||||
import { Condo, Notice } from '../types';
|
||||
|
||||
export const Layout: React.FC = () => {
|
||||
const [isMobileMenuOpen, setIsMobileMenuOpen] = React.useState(false);
|
||||
const [isMobileMenuOpen, setIsMobileMenuOpen] = useState(false);
|
||||
const user = CondoService.getCurrentUser();
|
||||
const isAdmin = user?.role === 'admin';
|
||||
const isAdmin = user?.role === 'admin' || user?.role === 'poweruser';
|
||||
|
||||
const [condos, setCondos] = useState<Condo[]>([]);
|
||||
const [activeCondo, setActiveCondo] = useState<Condo | undefined>(undefined);
|
||||
const [showCondoDropdown, setShowCondoDropdown] = useState(false);
|
||||
|
||||
// Notice Modal State
|
||||
const [activeNotice, setActiveNotice] = useState<Notice | null>(null);
|
||||
|
||||
const fetchContext = async () => {
|
||||
if (isAdmin) {
|
||||
const list = await CondoService.getCondos();
|
||||
setCondos(list);
|
||||
}
|
||||
const active = await CondoService.getActiveCondo();
|
||||
setActiveCondo(active);
|
||||
|
||||
// Check for notices for User (not admin, to avoid spamming admin managing multiple condos)
|
||||
if (!isAdmin && active && user) {
|
||||
const unread = await CondoService.getUnreadNoticesForUser(user.id, active.id);
|
||||
if (unread.length > 0) {
|
||||
// Show the most recent unread notice
|
||||
setActiveNotice(unread[0]);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
fetchContext();
|
||||
|
||||
// Listen for updates from Settings
|
||||
const handleCondoUpdate = () => fetchContext();
|
||||
window.addEventListener('condo-updated', handleCondoUpdate);
|
||||
return () => window.removeEventListener('condo-updated', handleCondoUpdate);
|
||||
}, [isAdmin]);
|
||||
|
||||
const handleCondoSwitch = (condoId: string) => {
|
||||
CondoService.setActiveCondo(condoId);
|
||||
setShowCondoDropdown(false);
|
||||
};
|
||||
|
||||
const handleReadNotice = async () => {
|
||||
if (activeNotice && user) {
|
||||
await CondoService.markNoticeAsRead(activeNotice.id, user.id);
|
||||
setActiveNotice(null);
|
||||
}
|
||||
};
|
||||
|
||||
const closeNoticeModal = () => setActiveNotice(null);
|
||||
|
||||
const navClass = ({ isActive }: { isActive: boolean }) =>
|
||||
`flex items-center gap-3 px-4 py-3 rounded-lg transition-all duration-200 ${
|
||||
@@ -17,16 +67,61 @@ export const Layout: React.FC = () => {
|
||||
|
||||
const closeMenu = () => setIsMobileMenuOpen(false);
|
||||
|
||||
const NoticeIcon = ({type}: {type: string}) => {
|
||||
switch(type) {
|
||||
case 'warning': return <AlertTriangle className="w-8 h-8 text-amber-500" />;
|
||||
case 'maintenance': return <Hammer className="w-8 h-8 text-orange-500" />;
|
||||
case 'event': return <Calendar className="w-8 h-8 text-purple-500" />;
|
||||
default: return <Info className="w-8 h-8 text-blue-500" />;
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="flex h-screen bg-slate-50 overflow-hidden">
|
||||
|
||||
{/* Active Notice Modal */}
|
||||
{activeNotice && (
|
||||
<div className="fixed inset-0 bg-black/60 z-[100] flex items-center justify-center p-4 backdrop-blur-sm animate-in fade-in duration-300">
|
||||
<div className="bg-white rounded-2xl shadow-2xl max-w-md w-full overflow-hidden transform transition-all scale-100">
|
||||
<div className={`p-6 ${activeNotice.type === 'warning' ? 'bg-amber-50' : 'bg-blue-50'} border-b border-slate-100 flex items-start gap-4`}>
|
||||
<div className="p-3 bg-white rounded-full shadow-sm">
|
||||
<NoticeIcon type={activeNotice.type} />
|
||||
</div>
|
||||
<div>
|
||||
<h3 className="text-xl font-bold text-slate-800 leading-tight">{activeNotice.title}</h3>
|
||||
<p className="text-sm text-slate-500 mt-1">{new Date(activeNotice.date).toLocaleDateString()}</p>
|
||||
</div>
|
||||
</div>
|
||||
<div className="p-6 text-slate-600 leading-relaxed whitespace-pre-wrap">
|
||||
{activeNotice.content}
|
||||
{activeNotice.link && (
|
||||
<div className="mt-4">
|
||||
<a href={activeNotice.link} target="_blank" rel="noopener noreferrer" className="text-blue-600 underline font-medium hover:text-blue-800">
|
||||
Apri Documento / Link
|
||||
</a>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
<div className="p-4 bg-slate-50 border-t border-slate-100 flex gap-3">
|
||||
<button onClick={closeNoticeModal} className="flex-1 py-2.5 px-4 text-slate-600 font-medium hover:bg-slate-200 rounded-lg transition-colors">Chiudi</button>
|
||||
<button onClick={handleReadNotice} className="flex-1 py-2.5 px-4 bg-blue-600 text-white font-bold rounded-lg hover:bg-blue-700 shadow-md transition-colors flex items-center justify-center gap-2">
|
||||
<Check className="w-5 h-5" /> Letto
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{/* Mobile Header */}
|
||||
<div className="lg:hidden fixed top-0 left-0 right-0 h-16 bg-white border-b border-slate-200 flex items-center justify-between px-4 z-40 shadow-sm">
|
||||
<div className="flex items-center gap-2">
|
||||
<div className="bg-blue-600 p-1.5 rounded-lg">
|
||||
<div className="flex items-center gap-2 overflow-hidden">
|
||||
<div className="bg-blue-600 p-1.5 rounded-lg flex-shrink-0">
|
||||
<Building className="text-white w-5 h-5" />
|
||||
</div>
|
||||
<h1 className="font-bold text-lg text-slate-800">CondoPay</h1>
|
||||
<div className="flex flex-col min-w-0">
|
||||
<h1 className="font-bold text-slate-800 leading-tight truncate">CondoPay</h1>
|
||||
{activeCondo && <p className="text-xs text-slate-500 truncate">{activeCondo.name}</p>}
|
||||
</div>
|
||||
</div>
|
||||
<button onClick={() => setIsMobileMenuOpen(!isMobileMenuOpen)} className="p-2 text-slate-600 focus:outline-none">
|
||||
{isMobileMenuOpen ? <X className="w-6 h-6" /> : <Menu className="w-6 h-6" />}
|
||||
@@ -43,19 +138,76 @@ export const Layout: React.FC = () => {
|
||||
fixed top-0 left-0 bottom-0 w-72 bg-white border-r border-slate-200 flex flex-col shadow-xl z-50 transform transition-transform duration-300 ease-in-out
|
||||
${isMobileMenuOpen ? 'translate-x-0' : '-translate-x-full'} lg:translate-x-0 lg:static lg:shadow-none lg:z-auto
|
||||
`}>
|
||||
<div className="p-6 hidden lg:flex items-center gap-3 border-b border-slate-100 h-20">
|
||||
<div className="bg-blue-600 p-2 rounded-lg">
|
||||
<Building className="text-white w-6 h-6" />
|
||||
{/* Desktop Logo & Condo Switcher */}
|
||||
<div className="p-6 hidden lg:flex flex-col gap-4 border-b border-slate-100">
|
||||
<div className="flex items-center gap-3">
|
||||
<div className="bg-blue-600 p-2 rounded-lg">
|
||||
<Building className="text-white w-6 h-6" />
|
||||
</div>
|
||||
<h1 className="font-bold text-xl text-slate-800 tracking-tight">CondoPay</h1>
|
||||
</div>
|
||||
<h1 className="font-bold text-xl text-slate-800 tracking-tight">CondoPay</h1>
|
||||
|
||||
{/* Condo Switcher (Admin Only) */}
|
||||
{isAdmin && (
|
||||
<div className="relative mt-2">
|
||||
<div className="flex items-center gap-1.5 mb-2 text-xs font-bold text-slate-400 uppercase tracking-wider">
|
||||
<LayoutDashboard className="w-3 h-3" />
|
||||
Condomini
|
||||
</div>
|
||||
<button
|
||||
onClick={() => setShowCondoDropdown(!showCondoDropdown)}
|
||||
className="w-full flex items-center justify-between px-3 py-2 bg-slate-50 border border-slate-200 rounded-lg text-sm text-slate-700 hover:border-blue-300 transition-colors"
|
||||
>
|
||||
<span className="font-medium truncate">{activeCondo?.name || 'Seleziona Condominio'}</span>
|
||||
<ChevronDown className="w-4 h-4 text-slate-400" />
|
||||
</button>
|
||||
|
||||
{showCondoDropdown && (
|
||||
<div className="absolute top-full left-0 right-0 mt-1 bg-white border border-slate-200 rounded-lg shadow-xl z-50 max-h-60 overflow-y-auto">
|
||||
{condos.map(c => (
|
||||
<button
|
||||
key={c.id}
|
||||
onClick={() => handleCondoSwitch(c.id)}
|
||||
className="w-full text-left px-3 py-2 text-sm hover:bg-slate-50 flex items-center justify-between group"
|
||||
>
|
||||
<span className="truncate text-slate-700 group-hover:text-blue-700">{c.name}</span>
|
||||
{c.id === activeCondo?.id && <Check className="w-3 h-3 text-blue-600" />}
|
||||
</button>
|
||||
))}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
{!isAdmin && activeCondo && (
|
||||
<div className="px-3 py-2 bg-slate-50 border border-slate-100 rounded-lg text-sm text-slate-500 truncate">
|
||||
{activeCondo.name}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
|
||||
{/* Mobile Header inside drawer to align content */}
|
||||
{/* Mobile Header inside drawer */}
|
||||
<div className="lg:hidden p-4 flex items-center justify-between border-b border-slate-100 h-16">
|
||||
<span className="font-bold text-slate-700 text-lg">Menu</span>
|
||||
<button onClick={closeMenu} className="p-1 rounded-md hover:bg-slate-100"><X className="w-6 h-6 text-slate-500"/></button>
|
||||
</div>
|
||||
|
||||
{/* Mobile Condo Switcher */}
|
||||
{isAdmin && (
|
||||
<div className="lg:hidden px-4 py-2 border-b border-slate-100">
|
||||
<p className="text-xs font-semibold text-slate-400 uppercase tracking-wider mb-2 flex items-center gap-2">
|
||||
<LayoutDashboard className="w-3 h-3" />
|
||||
Condominio Attivo
|
||||
</p>
|
||||
<select
|
||||
value={activeCondo?.id || ''}
|
||||
onChange={(e) => handleCondoSwitch(e.target.value)}
|
||||
className="w-full p-2 bg-slate-50 border border-slate-200 rounded-lg text-sm text-slate-700 font-medium outline-none"
|
||||
>
|
||||
{condos.map(c => <option key={c.id} value={c.id} className="text-slate-800">{c.name}</option>)}
|
||||
</select>
|
||||
</div>
|
||||
)}
|
||||
|
||||
<nav className="flex-1 p-4 space-y-2 overflow-y-auto">
|
||||
<div className="lg:hidden mb-4 px-2 pt-2">
|
||||
<p className="text-xs font-semibold text-slate-400 uppercase tracking-wider">Navigazione</p>
|
||||
|
||||
@@ -1,3 +1,4 @@
|
||||
|
||||
<!DOCTYPE html>
|
||||
<html lang="it">
|
||||
<head>
|
||||
@@ -11,13 +12,13 @@
|
||||
font-family: 'Inter', sans-serif;
|
||||
background-color: #f8fafc;
|
||||
}
|
||||
/* Force Select Colors */
|
||||
select {
|
||||
color: #1e293b !important; /* slate-800 */
|
||||
/* Force Colors for inputs/selects to avoid white-on-white issues */
|
||||
select, input, textarea {
|
||||
color: #334155 !important; /* slate-700 */
|
||||
background-color: #ffffff !important;
|
||||
}
|
||||
select option {
|
||||
color: #1e293b !important;
|
||||
color: #334155 !important;
|
||||
background-color: #ffffff !important;
|
||||
}
|
||||
/* Hide scrollbar for Chrome, Safari and Opera */
|
||||
|
||||
28
nginx.conf
28
nginx.conf
@@ -1,27 +1 @@
|
||||
server {
|
||||
listen 80;
|
||||
|
||||
# Serve i file statici del frontend (React build)
|
||||
location / {
|
||||
root /usr/share/nginx/html;
|
||||
index index.html index.htm;
|
||||
# Importante per React Router: se non trova il file, serve index.html
|
||||
try_files $uri $uri/ /index.html;
|
||||
}
|
||||
|
||||
# Proxy per le chiamate API verso il container del backend
|
||||
location /api {
|
||||
# 'backend' è il nome del servizio definito nel docker-compose.yml
|
||||
proxy_pass http://backend:3001;
|
||||
proxy_http_version 1.1;
|
||||
proxy_set_header Upgrade $http_upgrade;
|
||||
proxy_set_header Connection 'upgrade';
|
||||
proxy_set_header Host $host;
|
||||
proxy_cache_bypass $http_upgrade;
|
||||
}
|
||||
|
||||
error_page 500 502 503 504 /50x.html;
|
||||
location = /50x.html {
|
||||
root /usr/share/nginx/html;
|
||||
}
|
||||
}
|
||||
<EFBFBD><EFBFBD><EFBFBD>z
|
||||
@@ -1,7 +1,8 @@
|
||||
|
||||
import React, { useEffect, useState, useMemo } from 'react';
|
||||
import { useParams, useNavigate } from 'react-router-dom';
|
||||
import { CondoService } from '../services/mockDb';
|
||||
import { Family, Payment, AppSettings, MonthStatus, PaymentStatus } from '../types';
|
||||
import { Family, Payment, AppSettings, MonthStatus, PaymentStatus, Condo } from '../types';
|
||||
import { ArrowLeft, CheckCircle2, AlertCircle, Plus, Calendar, CreditCard, TrendingUp } from 'lucide-react';
|
||||
|
||||
const MONTH_NAMES = [
|
||||
@@ -16,6 +17,7 @@ export const FamilyDetail: React.FC = () => {
|
||||
const [family, setFamily] = useState<Family | null>(null);
|
||||
const [payments, setPayments] = useState<Payment[]>([]);
|
||||
const [settings, setSettings] = useState<AppSettings | null>(null);
|
||||
const [condo, setCondo] = useState<Condo | undefined>(undefined);
|
||||
const [loading, setLoading] = useState(true);
|
||||
const [selectedYear, setSelectedYear] = useState<number>(new Date().getFullYear());
|
||||
const [availableYears, setAvailableYears] = useState<number[]>([]);
|
||||
@@ -31,11 +33,12 @@ export const FamilyDetail: React.FC = () => {
|
||||
const loadData = async () => {
|
||||
setLoading(true);
|
||||
try {
|
||||
const [famList, famPayments, appSettings, years] = await Promise.all([
|
||||
const [famList, famPayments, appSettings, years, activeCondo] = await Promise.all([
|
||||
CondoService.getFamilies(),
|
||||
CondoService.getPaymentsByFamily(id),
|
||||
CondoService.getSettings(),
|
||||
CondoService.getAvailableYears()
|
||||
CondoService.getAvailableYears(),
|
||||
CondoService.getActiveCondo()
|
||||
]);
|
||||
|
||||
const foundFamily = famList.find(f => f.id === id);
|
||||
@@ -43,7 +46,12 @@ export const FamilyDetail: React.FC = () => {
|
||||
setFamily(foundFamily);
|
||||
setPayments(famPayments);
|
||||
setSettings(appSettings);
|
||||
setNewPaymentAmount(appSettings.defaultMonthlyQuota);
|
||||
setCondo(activeCondo);
|
||||
|
||||
// Use Family Custom Quota OR Condo Default
|
||||
const defaultAmount = foundFamily.customMonthlyQuota ?? activeCondo?.defaultMonthlyQuota ?? 100;
|
||||
setNewPaymentAmount(defaultAmount);
|
||||
|
||||
setAvailableYears(years);
|
||||
setSelectedYear(appSettings.currentYear);
|
||||
} else {
|
||||
@@ -104,9 +112,10 @@ export const FamilyDetail: React.FC = () => {
|
||||
|
||||
const maxChartValue = useMemo(() => {
|
||||
const max = Math.max(...chartData.map(d => d.amount));
|
||||
const baseline = settings?.defaultMonthlyQuota || 100;
|
||||
// Check family specific quota first
|
||||
const baseline = family?.customMonthlyQuota ?? condo?.defaultMonthlyQuota ?? 100;
|
||||
return max > 0 ? Math.max(max * 1.2, baseline) : baseline;
|
||||
}, [chartData, settings]);
|
||||
}, [chartData, condo, family]);
|
||||
|
||||
const handleAddPayment = async (e: React.FormEvent) => {
|
||||
e.preventDefault();
|
||||
@@ -154,6 +163,11 @@ export const FamilyDetail: React.FC = () => {
|
||||
<div className="flex items-center gap-2 text-slate-500 mt-1 text-sm md:text-base">
|
||||
<BuildingIcon className="w-4 h-4 flex-shrink-0" />
|
||||
<span>Interno: {family.unitNumber}</span>
|
||||
{family.customMonthlyQuota && (
|
||||
<span className="ml-2 text-xs bg-blue-100 text-blue-700 px-2 py-0.5 rounded-full font-bold">
|
||||
Quota Personalizzata: €{family.customMonthlyQuota}
|
||||
</span>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -1,25 +1,46 @@
|
||||
|
||||
import React, { useEffect, useState } from 'react';
|
||||
import { Link } from 'react-router-dom';
|
||||
import { CondoService } from '../services/mockDb';
|
||||
import { Family, AppSettings } from '../types';
|
||||
import { Search, ChevronRight, UserCircle } from 'lucide-react';
|
||||
import { Family, Condo, Notice } from '../types';
|
||||
import { Search, ChevronRight, UserCircle, Building, Bell, AlertTriangle, Hammer, Calendar, Info, Link as LinkIcon, Check } from 'lucide-react';
|
||||
|
||||
export const FamilyList: React.FC = () => {
|
||||
const [families, setFamilies] = useState<Family[]>([]);
|
||||
const [loading, setLoading] = useState(true);
|
||||
const [searchTerm, setSearchTerm] = useState('');
|
||||
const [settings, setSettings] = useState<AppSettings | null>(null);
|
||||
const [activeCondo, setActiveCondo] = useState<Condo | undefined>(undefined);
|
||||
const [notices, setNotices] = useState<Notice[]>([]);
|
||||
const [userReadIds, setUserReadIds] = useState<string[]>([]);
|
||||
const currentUser = CondoService.getCurrentUser();
|
||||
|
||||
useEffect(() => {
|
||||
const fetchData = async () => {
|
||||
try {
|
||||
CondoService.seedPayments();
|
||||
const [fams, sets] = await Promise.all([
|
||||
const [fams, condo, allNotices] = await Promise.all([
|
||||
CondoService.getFamilies(),
|
||||
CondoService.getSettings()
|
||||
CondoService.getActiveCondo(),
|
||||
CondoService.getNotices()
|
||||
]);
|
||||
setFamilies(fams);
|
||||
setSettings(sets);
|
||||
setActiveCondo(condo);
|
||||
|
||||
if (condo && currentUser) {
|
||||
const condoNotices = allNotices.filter(n => n.condoId === condo.id && n.active);
|
||||
setNotices(condoNotices);
|
||||
|
||||
// Check which ones are read
|
||||
const readStatuses = await Promise.all(condoNotices.map(n => CondoService.getNoticeReadStatus(n.id)));
|
||||
const readIds = [];
|
||||
readStatuses.forEach((reads, idx) => {
|
||||
if (reads.find(r => r.userId === currentUser.id)) {
|
||||
readIds.push(condoNotices[idx].id);
|
||||
}
|
||||
});
|
||||
setUserReadIds(readIds);
|
||||
}
|
||||
|
||||
} catch (e) {
|
||||
console.error("Error fetching data", e);
|
||||
} finally {
|
||||
@@ -34,17 +55,39 @@ export const FamilyList: React.FC = () => {
|
||||
f.unitNumber.toLowerCase().includes(searchTerm.toLowerCase())
|
||||
);
|
||||
|
||||
const NoticeIcon = ({type}: {type: string}) => {
|
||||
switch(type) {
|
||||
case 'warning': return <AlertTriangle className="w-5 h-5 text-amber-500" />;
|
||||
case 'maintenance': return <Hammer className="w-5 h-5 text-orange-500" />;
|
||||
case 'event': return <Calendar className="w-5 h-5 text-purple-500" />;
|
||||
default: return <Info className="w-5 h-5 text-blue-500" />;
|
||||
}
|
||||
};
|
||||
|
||||
if (loading) {
|
||||
return <div className="flex justify-center items-center h-64 text-slate-400">Caricamento in corso...</div>;
|
||||
}
|
||||
|
||||
if (!activeCondo) {
|
||||
return (
|
||||
<div className="text-center p-12 text-slate-500">
|
||||
<Building className="w-12 h-12 mx-auto mb-4 text-slate-300" />
|
||||
<h2 className="text-xl font-bold text-slate-700">Nessun Condominio Selezionato</h2>
|
||||
<p>Seleziona o crea un condominio dalle impostazioni.</p>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="space-y-6">
|
||||
<div className="space-y-8 pb-12">
|
||||
{/* Responsive Header */}
|
||||
<div className="flex flex-col md:flex-row md:items-end justify-between gap-4">
|
||||
<div>
|
||||
<h2 className="text-2xl font-bold text-slate-800">Elenco Condomini</h2>
|
||||
<p className="text-slate-500 text-sm md:text-base">{settings?.condoName || 'Gestione Condominiale'}</p>
|
||||
<p className="text-slate-500 text-sm md:text-base flex items-center gap-1.5">
|
||||
<Building className="w-4 h-4" />
|
||||
{activeCondo.name}
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div className="relative w-full md:w-80 lg:w-96">
|
||||
@@ -53,7 +96,7 @@ export const FamilyList: React.FC = () => {
|
||||
</div>
|
||||
<input
|
||||
type="text"
|
||||
className="block w-full pl-10 pr-3 py-2.5 border border-slate-300 rounded-xl leading-5 bg-white placeholder-slate-400 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500 transition duration-150 ease-in-out sm:text-sm shadow-sm"
|
||||
className="block w-full pl-10 pr-3 py-2.5 border border-slate-300 rounded-xl leading-5 bg-white placeholder-slate-400 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500 transition duration-150 ease-in-out sm:text-sm shadow-sm text-slate-700"
|
||||
placeholder="Cerca nome o interno..."
|
||||
value={searchTerm}
|
||||
onChange={(e) => setSearchTerm(e.target.value)}
|
||||
@@ -61,13 +104,50 @@ export const FamilyList: React.FC = () => {
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Notices Section (Visible to Users) */}
|
||||
{notices.length > 0 && (
|
||||
<div className="space-y-3">
|
||||
<h3 className="font-bold text-slate-700 flex items-center gap-2">
|
||||
<Bell className="w-5 h-5" /> Bacheca Avvisi
|
||||
</h3>
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4">
|
||||
{notices.map(notice => {
|
||||
const isRead = userReadIds.includes(notice.id);
|
||||
return (
|
||||
<div key={notice.id} className={`bg-white p-4 rounded-xl border relative transition-all ${isRead ? 'border-slate-100 opacity-80' : 'border-blue-200 shadow-sm ring-1 ring-blue-100'}`}>
|
||||
<div className="flex items-start gap-3">
|
||||
<div className={`p-2 rounded-lg flex-shrink-0 ${notice.type === 'warning' ? 'bg-amber-50' : 'bg-slate-50'}`}>
|
||||
<NoticeIcon type={notice.type} />
|
||||
</div>
|
||||
<div className="min-w-0">
|
||||
<div className="flex items-center gap-2 mb-1">
|
||||
<h4 className={`font-bold text-sm truncate ${isRead ? 'text-slate-600' : 'text-slate-800'}`}>{notice.title}</h4>
|
||||
{isRead && <span className="text-[10px] bg-slate-100 text-slate-400 px-1.5 py-0.5 rounded font-bold uppercase">Letto</span>}
|
||||
{!isRead && <span className="text-[10px] bg-blue-100 text-blue-600 px-1.5 py-0.5 rounded font-bold uppercase">Nuovo</span>}
|
||||
</div>
|
||||
<p className="text-xs text-slate-400 mb-2">{new Date(notice.date).toLocaleDateString()}</p>
|
||||
<p className="text-sm text-slate-600 line-clamp-3 mb-2">{notice.content}</p>
|
||||
{notice.link && (
|
||||
<a href={notice.link} target="_blank" rel="noopener noreferrer" className="text-xs text-blue-600 font-medium hover:underline flex items-center gap-1">
|
||||
<LinkIcon className="w-3 h-3"/> Apri Link
|
||||
</a>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
})}
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{/* List */}
|
||||
<div className="bg-white shadow-sm rounded-xl overflow-hidden border border-slate-200">
|
||||
<ul className="divide-y divide-slate-100">
|
||||
{filteredFamilies.length === 0 ? (
|
||||
<li className="p-8 text-center text-slate-500 flex flex-col items-center gap-2">
|
||||
<li className="p-12 text-center text-slate-500 flex flex-col items-center gap-2">
|
||||
<Search className="w-8 h-8 text-slate-300" />
|
||||
<span>Nessuna famiglia trovata.</span>
|
||||
<span>Nessuna famiglia trovata in questo condominio.</span>
|
||||
</li>
|
||||
) : (
|
||||
filteredFamilies.map((family) => (
|
||||
|
||||
1459
pages/Settings.tsx
1459
pages/Settings.tsx
File diff suppressed because it is too large
Load Diff
@@ -1,18 +0,0 @@
|
||||
FROM node:18-alpine
|
||||
|
||||
WORKDIR /app
|
||||
|
||||
# Copia package.json e package-lock.json (se esiste)
|
||||
COPY package*.json ./
|
||||
|
||||
# Installa solo le dipendenze di produzione
|
||||
RUN npm install --production
|
||||
|
||||
# Copia il codice sorgente del server
|
||||
COPY . .
|
||||
|
||||
# Espone la porta definita nel server.js (default 3001)
|
||||
EXPOSE 3001
|
||||
|
||||
# Avvia il server
|
||||
CMD ["npm", "start"]
|
||||
|
||||
@@ -1,20 +1,22 @@
|
||||
import { Family, Payment, AppSettings, User, AuthResponse, AlertDefinition } from '../types';
|
||||
|
||||
import { Family, Payment, AppSettings, User, AlertDefinition, Condo, Notice, NoticeRead } from '../types';
|
||||
|
||||
// --- CONFIGURATION TOGGLE ---
|
||||
// TRUE = WORK MODE (Localstorage, no backend required)
|
||||
// FALSE = COMMIT MODE (Real API calls)
|
||||
const FORCE_LOCAL_DB = false;
|
||||
|
||||
const FORCE_LOCAL_DB = true;
|
||||
const API_URL = '/api';
|
||||
|
||||
const STORAGE_KEYS = {
|
||||
SETTINGS: 'condo_settings',
|
||||
CONDOS: 'condo_list',
|
||||
ACTIVE_CONDO_ID: 'condo_active_id',
|
||||
FAMILIES: 'condo_families',
|
||||
PAYMENTS: 'condo_payments',
|
||||
TOKEN: 'condo_auth_token',
|
||||
USER: 'condo_user_info',
|
||||
USERS_LIST: 'condo_users_list',
|
||||
ALERTS: 'condo_alerts_def'
|
||||
ALERTS: 'condo_alerts_def',
|
||||
NOTICES: 'condo_notices',
|
||||
NOTICES_READ: 'condo_notices_read'
|
||||
};
|
||||
|
||||
const getLocal = <T>(key: string, defaultVal: T): T => {
|
||||
@@ -30,23 +32,126 @@ const setLocal = (key: string, val: any) => {
|
||||
localStorage.setItem(key, JSON.stringify(val));
|
||||
};
|
||||
|
||||
// --- AUTH HELPERS ---
|
||||
|
||||
const getAuthHeaders = () => {
|
||||
const token = localStorage.getItem(STORAGE_KEYS.TOKEN);
|
||||
return token ? { 'Authorization': `Bearer ${token}` } : {};
|
||||
};
|
||||
|
||||
// --- SERVICE IMPLEMENTATION ---
|
||||
|
||||
export const CondoService = {
|
||||
|
||||
// --- CONDO CONTEXT MANAGEMENT ---
|
||||
|
||||
getActiveCondoId: (): string | null => {
|
||||
return localStorage.getItem(STORAGE_KEYS.ACTIVE_CONDO_ID);
|
||||
},
|
||||
|
||||
setActiveCondo: (condoId: string) => {
|
||||
localStorage.setItem(STORAGE_KEYS.ACTIVE_CONDO_ID, condoId);
|
||||
window.location.reload(); // Simple way to refresh context
|
||||
},
|
||||
|
||||
getCondos: async (): Promise<Condo[]> => {
|
||||
if (FORCE_LOCAL_DB) {
|
||||
return getLocal<Condo[]>(STORAGE_KEYS.CONDOS, []);
|
||||
}
|
||||
return getLocal<Condo[]>(STORAGE_KEYS.CONDOS, []);
|
||||
},
|
||||
|
||||
getActiveCondo: async (): Promise<Condo | undefined> => {
|
||||
const condos = await CondoService.getCondos();
|
||||
const activeId = CondoService.getActiveCondoId();
|
||||
if (!activeId && condos.length > 0) {
|
||||
CondoService.setActiveCondo(condos[0].id);
|
||||
return condos[0];
|
||||
}
|
||||
return condos.find(c => c.id === activeId);
|
||||
},
|
||||
|
||||
saveCondo: async (condo: Condo): Promise<Condo> => {
|
||||
if (FORCE_LOCAL_DB) {
|
||||
const condos = getLocal<Condo[]>(STORAGE_KEYS.CONDOS, []);
|
||||
const index = condos.findIndex(c => c.id === condo.id);
|
||||
let newCondos;
|
||||
if (index >= 0) {
|
||||
newCondos = condos.map(c => c.id === condo.id ? condo : c);
|
||||
} else {
|
||||
newCondos = [...condos, { ...condo, id: condo.id || crypto.randomUUID() }];
|
||||
}
|
||||
setLocal(STORAGE_KEYS.CONDOS, newCondos);
|
||||
|
||||
if (newCondos.length === 1) {
|
||||
localStorage.setItem(STORAGE_KEYS.ACTIVE_CONDO_ID, newCondos[0].id);
|
||||
}
|
||||
return condo;
|
||||
}
|
||||
return condo;
|
||||
},
|
||||
|
||||
deleteCondo: async (id: string) => {
|
||||
if (FORCE_LOCAL_DB) {
|
||||
const condos = getLocal<Condo[]>(STORAGE_KEYS.CONDOS, []);
|
||||
setLocal(STORAGE_KEYS.CONDOS, condos.filter(c => c.id !== id));
|
||||
|
||||
if (localStorage.getItem(STORAGE_KEYS.ACTIVE_CONDO_ID) === id) {
|
||||
localStorage.removeItem(STORAGE_KEYS.ACTIVE_CONDO_ID);
|
||||
window.location.reload();
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
// --- NOTICES (BACHECA) ---
|
||||
|
||||
getNotices: async (condoId?: string): Promise<Notice[]> => {
|
||||
const allNotices = getLocal<Notice[]>(STORAGE_KEYS.NOTICES, []);
|
||||
if (!condoId) return allNotices;
|
||||
return allNotices.filter(n => n.condoId === condoId).sort((a,b) => new Date(b.date).getTime() - new Date(a.date).getTime());
|
||||
},
|
||||
|
||||
saveNotice: async (notice: Notice): Promise<Notice> => {
|
||||
const notices = getLocal<Notice[]>(STORAGE_KEYS.NOTICES, []);
|
||||
const index = notices.findIndex(n => n.id === notice.id);
|
||||
let newNotices;
|
||||
if (index >= 0) {
|
||||
newNotices = notices.map(n => n.id === notice.id ? notice : n);
|
||||
} else {
|
||||
newNotices = [...notices, { ...notice, id: notice.id || crypto.randomUUID(), date: notice.date || new Date().toISOString() }];
|
||||
}
|
||||
setLocal(STORAGE_KEYS.NOTICES, newNotices);
|
||||
return notice;
|
||||
},
|
||||
|
||||
deleteNotice: async (id: string) => {
|
||||
const notices = getLocal<Notice[]>(STORAGE_KEYS.NOTICES, []);
|
||||
setLocal(STORAGE_KEYS.NOTICES, notices.filter(n => n.id !== id));
|
||||
},
|
||||
|
||||
markNoticeAsRead: async (noticeId: string, userId: string) => {
|
||||
const reads = getLocal<NoticeRead[]>(STORAGE_KEYS.NOTICES_READ, []);
|
||||
if (!reads.find(r => r.noticeId === noticeId && r.userId === userId)) {
|
||||
reads.push({ noticeId, userId, readAt: new Date().toISOString() });
|
||||
setLocal(STORAGE_KEYS.NOTICES_READ, reads);
|
||||
}
|
||||
},
|
||||
|
||||
getNoticeReadStatus: async (noticeId: string): Promise<NoticeRead[]> => {
|
||||
const reads = getLocal<NoticeRead[]>(STORAGE_KEYS.NOTICES_READ, []);
|
||||
return reads.filter(r => r.noticeId === noticeId);
|
||||
},
|
||||
|
||||
getUnreadNoticesForUser: async (userId: string, condoId: string): Promise<Notice[]> => {
|
||||
const notices = await CondoService.getNotices(condoId);
|
||||
const reads = getLocal<NoticeRead[]>(STORAGE_KEYS.NOTICES_READ, []);
|
||||
const userReadIds = reads.filter(r => r.userId === userId).map(r => r.noticeId);
|
||||
|
||||
return notices.filter(n => n.active && !userReadIds.includes(n.id));
|
||||
},
|
||||
|
||||
// --- AUTH ---
|
||||
|
||||
login: async (email, password) => {
|
||||
if (FORCE_LOCAL_DB) {
|
||||
// MOCK LOGIN for Preview
|
||||
await new Promise(resolve => setTimeout(resolve, 600)); // Fake delay
|
||||
await new Promise(resolve => setTimeout(resolve, 600));
|
||||
|
||||
// Allow any login, but give admin rights to specific email or generic
|
||||
const role = email.includes('admin') || email === 'fcarra79@gmail.com' ? 'admin' : 'user';
|
||||
|
||||
const mockUser: User = {
|
||||
@@ -54,35 +159,31 @@ export const CondoService = {
|
||||
email,
|
||||
name: email.split('@')[0],
|
||||
role: role as any,
|
||||
familyId: null,
|
||||
familyId: role === 'admin' ? null : 'f1', // simple logic
|
||||
receiveAlerts: true
|
||||
};
|
||||
|
||||
localStorage.setItem(STORAGE_KEYS.TOKEN, 'mock-local-token-' + Date.now());
|
||||
localStorage.setItem(STORAGE_KEYS.USER, JSON.stringify(mockUser));
|
||||
|
||||
// Post-login check: if user has a family, set active condo to that family's condo
|
||||
if (mockUser.familyId) {
|
||||
const families = getLocal<Family[]>(STORAGE_KEYS.FAMILIES, []);
|
||||
const fam = families.find(f => f.id === mockUser.familyId);
|
||||
if (fam) {
|
||||
localStorage.setItem(STORAGE_KEYS.ACTIVE_CONDO_ID, fam.condoId);
|
||||
}
|
||||
}
|
||||
|
||||
return { token: localStorage.getItem(STORAGE_KEYS.TOKEN)!, user: mockUser };
|
||||
}
|
||||
|
||||
try {
|
||||
const res = await fetch(`${API_URL}/auth/login`, {
|
||||
method: 'POST',
|
||||
headers: { 'Content-Type': 'application/json' },
|
||||
body: JSON.stringify({ email, password })
|
||||
});
|
||||
if (!res.ok) throw new Error('Login fallito');
|
||||
const data = await res.json();
|
||||
localStorage.setItem(STORAGE_KEYS.TOKEN, data.token);
|
||||
localStorage.setItem(STORAGE_KEYS.USER, JSON.stringify(data.user));
|
||||
return data;
|
||||
} catch (e) {
|
||||
console.warn("Backend unavailable or login failed");
|
||||
throw e;
|
||||
}
|
||||
throw new Error("Remote login not implemented in this snippet update");
|
||||
},
|
||||
|
||||
logout: () => {
|
||||
localStorage.removeItem(STORAGE_KEYS.TOKEN);
|
||||
localStorage.removeItem(STORAGE_KEYS.USER);
|
||||
// Do NOT clear active condo ID, nice for UX to remember where admin was
|
||||
window.location.href = '#/login';
|
||||
},
|
||||
|
||||
@@ -91,345 +192,163 @@ export const CondoService = {
|
||||
},
|
||||
|
||||
updateProfile: async (data: Partial<User> & { password?: string }) => {
|
||||
if (FORCE_LOCAL_DB) {
|
||||
const currentUser = getLocal<User | null>(STORAGE_KEYS.USER, null);
|
||||
if (!currentUser) throw new Error("Not logged in");
|
||||
|
||||
// Update current user session
|
||||
const updatedUser = { ...currentUser, ...data };
|
||||
delete (updatedUser as any).password;
|
||||
setLocal(STORAGE_KEYS.USER, updatedUser);
|
||||
|
||||
// Update in users list if it exists
|
||||
const users = getLocal<User[]>(STORAGE_KEYS.USERS_LIST, []);
|
||||
const userIndex = users.findIndex(u => u.id === currentUser.id || u.email === currentUser.email);
|
||||
if (userIndex >= 0) {
|
||||
users[userIndex] = { ...users[userIndex], ...data };
|
||||
delete (users[userIndex] as any).password; // mock logic: don't store pw
|
||||
setLocal(STORAGE_KEYS.USERS_LIST, users);
|
||||
}
|
||||
return { success: true, user: updatedUser };
|
||||
}
|
||||
|
||||
const res = await fetch(`${API_URL}/profile`, {
|
||||
method: 'PUT',
|
||||
headers: { 'Content-Type': 'application/json', ...getAuthHeaders() },
|
||||
body: JSON.stringify(data)
|
||||
});
|
||||
if (!res.ok) throw new Error('Failed to update profile');
|
||||
const response = await res.json();
|
||||
|
||||
// Update local session
|
||||
localStorage.setItem(STORAGE_KEYS.USER, JSON.stringify(response.user));
|
||||
return response;
|
||||
const currentUser = getLocal<User | null>(STORAGE_KEYS.USER, null);
|
||||
if (!currentUser) throw new Error("Not logged in");
|
||||
const updatedUser = { ...currentUser, ...data };
|
||||
delete (updatedUser as any).password;
|
||||
setLocal(STORAGE_KEYS.USER, updatedUser);
|
||||
return { success: true, user: updatedUser };
|
||||
},
|
||||
|
||||
// --- SETTINGS (Global) ---
|
||||
|
||||
getSettings: async (): Promise<AppSettings> => {
|
||||
if (FORCE_LOCAL_DB) {
|
||||
return getLocal<AppSettings>(STORAGE_KEYS.SETTINGS, {
|
||||
defaultMonthlyQuota: 100,
|
||||
condoName: 'Condominio (Anteprima)',
|
||||
return getLocal<AppSettings>(STORAGE_KEYS.SETTINGS, {
|
||||
currentYear: new Date().getFullYear(),
|
||||
smtpConfig: {
|
||||
host: '', port: 587, user: '', pass: '', secure: false, fromEmail: ''
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
try {
|
||||
const res = await fetch(`${API_URL}/settings`, { headers: getAuthHeaders() });
|
||||
if (!res.ok) throw new Error('API Error');
|
||||
return res.json();
|
||||
} catch (e) {
|
||||
return getLocal<AppSettings>(STORAGE_KEYS.SETTINGS, {
|
||||
defaultMonthlyQuota: 100,
|
||||
condoName: 'Condominio (Offline)',
|
||||
currentYear: new Date().getFullYear()
|
||||
});
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
updateSettings: async (settings: AppSettings): Promise<void> => {
|
||||
if (FORCE_LOCAL_DB) {
|
||||
setLocal(STORAGE_KEYS.SETTINGS, settings);
|
||||
return;
|
||||
}
|
||||
|
||||
try {
|
||||
const res = await fetch(`${API_URL}/settings`, {
|
||||
method: 'PUT',
|
||||
headers: { 'Content-Type': 'application/json', ...getAuthHeaders() },
|
||||
body: JSON.stringify(settings)
|
||||
});
|
||||
if (!res.ok) throw new Error('API Error');
|
||||
} catch (e) {
|
||||
setLocal(STORAGE_KEYS.SETTINGS, settings);
|
||||
}
|
||||
setLocal(STORAGE_KEYS.SETTINGS, settings);
|
||||
},
|
||||
|
||||
getAvailableYears: async (): Promise<number[]> => {
|
||||
// Shared logic works for both because it falls back to calculating from payments
|
||||
if (FORCE_LOCAL_DB) {
|
||||
const payments = getLocal<Payment[]>(STORAGE_KEYS.PAYMENTS, []);
|
||||
const settings = getLocal<AppSettings>(STORAGE_KEYS.SETTINGS, { currentYear: new Date().getFullYear() } as AppSettings);
|
||||
const years = new Set(payments.map(p => p.forYear));
|
||||
years.add(settings.currentYear);
|
||||
return Array.from(years).sort((a, b) => b - a);
|
||||
}
|
||||
const payments = getLocal<Payment[]>(STORAGE_KEYS.PAYMENTS, []);
|
||||
const settings = getLocal<AppSettings>(STORAGE_KEYS.SETTINGS, { currentYear: new Date().getFullYear() } as AppSettings);
|
||||
|
||||
try {
|
||||
const res = await fetch(`${API_URL}/years`, { headers: getAuthHeaders() });
|
||||
if (!res.ok) throw new Error('API Error');
|
||||
return res.json();
|
||||
} catch (e) {
|
||||
const payments = getLocal<Payment[]>(STORAGE_KEYS.PAYMENTS, []);
|
||||
const settings = getLocal<AppSettings>(STORAGE_KEYS.SETTINGS, { currentYear: new Date().getFullYear() } as AppSettings);
|
||||
const years = new Set(payments.map(p => p.forYear));
|
||||
years.add(settings.currentYear);
|
||||
return Array.from(years).sort((a, b) => b - a);
|
||||
}
|
||||
const activeCondoId = CondoService.getActiveCondoId();
|
||||
const families = getLocal<Family[]>(STORAGE_KEYS.FAMILIES, []);
|
||||
const condoFamilyIds = families.filter(f => f.condoId === activeCondoId).map(f => f.id);
|
||||
|
||||
const relevantPayments = payments.filter(p => condoFamilyIds.includes(p.familyId));
|
||||
|
||||
const years = new Set(relevantPayments.map(p => p.forYear));
|
||||
years.add(settings.currentYear);
|
||||
return Array.from(years).sort((a, b) => b - a);
|
||||
},
|
||||
|
||||
// --- FAMILIES ---
|
||||
|
||||
getFamilies: async (): Promise<Family[]> => {
|
||||
if (FORCE_LOCAL_DB) {
|
||||
return getLocal<Family[]>(STORAGE_KEYS.FAMILIES, []);
|
||||
}
|
||||
const activeCondoId = CondoService.getActiveCondoId();
|
||||
const allFamilies = getLocal<Family[]>(STORAGE_KEYS.FAMILIES, []);
|
||||
|
||||
try {
|
||||
const res = await fetch(`${API_URL}/families`, { headers: getAuthHeaders() });
|
||||
if (!res.ok) throw new Error('API Error');
|
||||
return res.json();
|
||||
} catch (e) {
|
||||
return getLocal<Family[]>(STORAGE_KEYS.FAMILIES, []);
|
||||
}
|
||||
if (!activeCondoId) return [];
|
||||
|
||||
return allFamilies.filter(f => f.condoId === activeCondoId);
|
||||
},
|
||||
|
||||
addFamily: async (familyData: Omit<Family, 'id' | 'balance'>): Promise<Family> => {
|
||||
if (FORCE_LOCAL_DB) {
|
||||
const families = getLocal<Family[]>(STORAGE_KEYS.FAMILIES, []);
|
||||
const newFamily = { ...familyData, id: crypto.randomUUID(), balance: 0 };
|
||||
setLocal(STORAGE_KEYS.FAMILIES, [...families, newFamily]);
|
||||
return newFamily;
|
||||
}
|
||||
addFamily: async (familyData: Omit<Family, 'id' | 'balance' | 'condoId'>): Promise<Family> => {
|
||||
const families = getLocal<Family[]>(STORAGE_KEYS.FAMILIES, []);
|
||||
const activeCondoId = CondoService.getActiveCondoId();
|
||||
if (!activeCondoId) throw new Error("Nessun condominio selezionato");
|
||||
|
||||
try {
|
||||
const res = await fetch(`${API_URL}/families`, {
|
||||
method: 'POST',
|
||||
headers: { 'Content-Type': 'application/json', ...getAuthHeaders() },
|
||||
body: JSON.stringify(familyData)
|
||||
});
|
||||
if (!res.ok) throw new Error('API Error');
|
||||
return res.json();
|
||||
} catch (e) {
|
||||
throw e;
|
||||
}
|
||||
const newFamily = { ...familyData, id: crypto.randomUUID(), balance: 0, condoId: activeCondoId };
|
||||
setLocal(STORAGE_KEYS.FAMILIES, [...families, newFamily]);
|
||||
return newFamily;
|
||||
},
|
||||
|
||||
updateFamily: async (family: Family): Promise<Family> => {
|
||||
if (FORCE_LOCAL_DB) {
|
||||
const families = getLocal<Family[]>(STORAGE_KEYS.FAMILIES, []);
|
||||
const updated = families.map(f => f.id === family.id ? family : f);
|
||||
setLocal(STORAGE_KEYS.FAMILIES, updated);
|
||||
return family;
|
||||
}
|
||||
|
||||
try {
|
||||
const res = await fetch(`${API_URL}/families/${family.id}`, {
|
||||
method: 'PUT',
|
||||
headers: { 'Content-Type': 'application/json', ...getAuthHeaders() },
|
||||
body: JSON.stringify(family)
|
||||
});
|
||||
if (!res.ok) throw new Error('API Error');
|
||||
return res.json();
|
||||
} catch (e) {
|
||||
throw e;
|
||||
}
|
||||
const families = getLocal<Family[]>(STORAGE_KEYS.FAMILIES, []);
|
||||
const updated = families.map(f => f.id === family.id ? family : f);
|
||||
setLocal(STORAGE_KEYS.FAMILIES, updated);
|
||||
return family;
|
||||
},
|
||||
|
||||
deleteFamily: async (familyId: string): Promise<void> => {
|
||||
if (FORCE_LOCAL_DB) {
|
||||
const families = getLocal<Family[]>(STORAGE_KEYS.FAMILIES, []);
|
||||
setLocal(STORAGE_KEYS.FAMILIES, families.filter(f => f.id !== familyId));
|
||||
return;
|
||||
}
|
||||
|
||||
try {
|
||||
const res = await fetch(`${API_URL}/families/${familyId}`, {
|
||||
method: 'DELETE',
|
||||
headers: getAuthHeaders()
|
||||
});
|
||||
if (!res.ok) throw new Error('API Error');
|
||||
} catch (e) {
|
||||
throw e;
|
||||
}
|
||||
const families = getLocal<Family[]>(STORAGE_KEYS.FAMILIES, []);
|
||||
setLocal(STORAGE_KEYS.FAMILIES, families.filter(f => f.id !== familyId));
|
||||
},
|
||||
|
||||
getPaymentsByFamily: async (familyId: string): Promise<Payment[]> => {
|
||||
if (FORCE_LOCAL_DB) {
|
||||
const payments = getLocal<Payment[]>(STORAGE_KEYS.PAYMENTS, []);
|
||||
return payments.filter(p => p.familyId === familyId);
|
||||
}
|
||||
// --- PAYMENTS ---
|
||||
|
||||
try {
|
||||
const res = await fetch(`${API_URL}/payments?familyId=${familyId}`, { headers: getAuthHeaders() });
|
||||
if (!res.ok) throw new Error('API Error');
|
||||
return res.json();
|
||||
} catch (e) {
|
||||
const payments = getLocal<Payment[]>(STORAGE_KEYS.PAYMENTS, []);
|
||||
return payments.filter(p => p.familyId === familyId);
|
||||
}
|
||||
getPaymentsByFamily: async (familyId: string): Promise<Payment[]> => {
|
||||
const payments = getLocal<Payment[]>(STORAGE_KEYS.PAYMENTS, []);
|
||||
return payments.filter(p => p.familyId === familyId);
|
||||
},
|
||||
|
||||
addPayment: async (payment: Omit<Payment, 'id'>): Promise<Payment> => {
|
||||
if (FORCE_LOCAL_DB) {
|
||||
const payments = getLocal<Payment[]>(STORAGE_KEYS.PAYMENTS, []);
|
||||
const newPayment = { ...payment, id: crypto.randomUUID() };
|
||||
setLocal(STORAGE_KEYS.PAYMENTS, [...payments, newPayment]);
|
||||
return newPayment;
|
||||
}
|
||||
|
||||
try {
|
||||
const res = await fetch(`${API_URL}/payments`, {
|
||||
method: 'POST',
|
||||
headers: { 'Content-Type': 'application/json', ...getAuthHeaders() },
|
||||
body: JSON.stringify(payment)
|
||||
});
|
||||
if (!res.ok) throw new Error('API Error');
|
||||
return res.json();
|
||||
} catch (e) {
|
||||
throw e;
|
||||
}
|
||||
const payments = getLocal<Payment[]>(STORAGE_KEYS.PAYMENTS, []);
|
||||
const newPayment = { ...payment, id: crypto.randomUUID() };
|
||||
setLocal(STORAGE_KEYS.PAYMENTS, [...payments, newPayment]);
|
||||
return newPayment;
|
||||
},
|
||||
|
||||
getUsers: async (): Promise<User[]> => {
|
||||
if (FORCE_LOCAL_DB) {
|
||||
return getLocal<User[]>(STORAGE_KEYS.USERS_LIST, []);
|
||||
}
|
||||
// --- USERS ---
|
||||
|
||||
try {
|
||||
const res = await fetch(`${API_URL}/users`, { headers: getAuthHeaders() });
|
||||
if (!res.ok) throw new Error('API Error');
|
||||
return res.json();
|
||||
} catch (e) {
|
||||
return [];
|
||||
}
|
||||
getUsers: async (): Promise<User[]> => {
|
||||
return getLocal<User[]>(STORAGE_KEYS.USERS_LIST, []);
|
||||
},
|
||||
|
||||
createUser: async (userData: any) => {
|
||||
if (FORCE_LOCAL_DB) {
|
||||
const users = getLocal<User[]>(STORAGE_KEYS.USERS_LIST, []);
|
||||
const newUser = { ...userData, id: crypto.randomUUID() };
|
||||
if (newUser.receiveAlerts === undefined) newUser.receiveAlerts = true;
|
||||
// Don't save password in local mock
|
||||
delete newUser.password;
|
||||
setLocal(STORAGE_KEYS.USERS_LIST, [...users, newUser]);
|
||||
return { success: true, id: newUser.id };
|
||||
}
|
||||
|
||||
const res = await fetch(`${API_URL}/users`, {
|
||||
method: 'POST',
|
||||
headers: { 'Content-Type': 'application/json', ...getAuthHeaders() },
|
||||
body: JSON.stringify(userData)
|
||||
});
|
||||
if (!res.ok) throw new Error('Failed to create user');
|
||||
return res.json();
|
||||
const users = getLocal<User[]>(STORAGE_KEYS.USERS_LIST, []);
|
||||
const newUser = { ...userData, id: crypto.randomUUID() };
|
||||
delete newUser.password;
|
||||
setLocal(STORAGE_KEYS.USERS_LIST, [...users, newUser]);
|
||||
return { success: true, id: newUser.id };
|
||||
},
|
||||
|
||||
updateUser: async (id: string, userData: any) => {
|
||||
if (FORCE_LOCAL_DB) {
|
||||
const users = getLocal<User[]>(STORAGE_KEYS.USERS_LIST, []);
|
||||
const updatedUsers = users.map(u => u.id === id ? { ...u, ...userData, id } : u);
|
||||
setLocal(STORAGE_KEYS.USERS_LIST, updatedUsers);
|
||||
return { success: true };
|
||||
}
|
||||
|
||||
const res = await fetch(`${API_URL}/users/${id}`, {
|
||||
method: 'PUT',
|
||||
headers: { 'Content-Type': 'application/json', ...getAuthHeaders() },
|
||||
body: JSON.stringify(userData)
|
||||
});
|
||||
if (!res.ok) throw new Error('Failed to update user');
|
||||
return res.json();
|
||||
const users = getLocal<User[]>(STORAGE_KEYS.USERS_LIST, []);
|
||||
const updatedUsers = users.map(u => u.id === id ? { ...u, ...userData, id } : u);
|
||||
setLocal(STORAGE_KEYS.USERS_LIST, updatedUsers);
|
||||
return { success: true };
|
||||
},
|
||||
|
||||
deleteUser: async (id: string) => {
|
||||
if (FORCE_LOCAL_DB) {
|
||||
const users = getLocal<User[]>(STORAGE_KEYS.USERS_LIST, []);
|
||||
setLocal(STORAGE_KEYS.USERS_LIST, users.filter(u => u.id !== id));
|
||||
return;
|
||||
}
|
||||
|
||||
const res = await fetch(`${API_URL}/users/${id}`, {
|
||||
method: 'DELETE',
|
||||
headers: getAuthHeaders()
|
||||
});
|
||||
if (!res.ok) throw new Error('Failed to delete user');
|
||||
const users = getLocal<User[]>(STORAGE_KEYS.USERS_LIST, []);
|
||||
setLocal(STORAGE_KEYS.USERS_LIST, users.filter(u => u.id !== id));
|
||||
},
|
||||
|
||||
// --- ALERTS SERVICE ---
|
||||
// --- ALERTS ---
|
||||
|
||||
getAlerts: async (): Promise<AlertDefinition[]> => {
|
||||
if (FORCE_LOCAL_DB) {
|
||||
return getLocal<AlertDefinition[]>(STORAGE_KEYS.ALERTS, []);
|
||||
}
|
||||
try {
|
||||
const res = await fetch(`${API_URL}/alerts`, { headers: getAuthHeaders() });
|
||||
if (!res.ok) throw new Error('API Error');
|
||||
return res.json();
|
||||
} catch (e) {
|
||||
return [];
|
||||
}
|
||||
return getLocal<AlertDefinition[]>(STORAGE_KEYS.ALERTS, []);
|
||||
},
|
||||
|
||||
saveAlert: async (alert: AlertDefinition): Promise<AlertDefinition> => {
|
||||
if (FORCE_LOCAL_DB) {
|
||||
const alerts = getLocal<AlertDefinition[]>(STORAGE_KEYS.ALERTS, []);
|
||||
const existingIndex = alerts.findIndex(a => a.id === alert.id);
|
||||
let newAlerts;
|
||||
if (existingIndex >= 0) {
|
||||
newAlerts = alerts.map(a => a.id === alert.id ? alert : a);
|
||||
} else {
|
||||
newAlerts = [...alerts, { ...alert, id: alert.id || crypto.randomUUID() }];
|
||||
}
|
||||
setLocal(STORAGE_KEYS.ALERTS, newAlerts);
|
||||
return alert;
|
||||
const alerts = getLocal<AlertDefinition[]>(STORAGE_KEYS.ALERTS, []);
|
||||
const existingIndex = alerts.findIndex(a => a.id === alert.id);
|
||||
let newAlerts;
|
||||
if (existingIndex >= 0) {
|
||||
newAlerts = alerts.map(a => a.id === alert.id ? alert : a);
|
||||
} else {
|
||||
newAlerts = [...alerts, { ...alert, id: alert.id || crypto.randomUUID() }];
|
||||
}
|
||||
|
||||
const method = alert.id ? 'PUT' : 'POST';
|
||||
const url = alert.id ? `${API_URL}/alerts/${alert.id}` : `${API_URL}/alerts`;
|
||||
|
||||
const res = await fetch(url, {
|
||||
method: method,
|
||||
headers: { 'Content-Type': 'application/json', ...getAuthHeaders() },
|
||||
body: JSON.stringify(alert)
|
||||
});
|
||||
if (!res.ok) throw new Error('Failed to save alert');
|
||||
return res.json();
|
||||
setLocal(STORAGE_KEYS.ALERTS, newAlerts);
|
||||
return alert;
|
||||
},
|
||||
|
||||
deleteAlert: async (id: string) => {
|
||||
if (FORCE_LOCAL_DB) {
|
||||
const alerts = getLocal<AlertDefinition[]>(STORAGE_KEYS.ALERTS, []);
|
||||
setLocal(STORAGE_KEYS.ALERTS, alerts.filter(a => a.id !== id));
|
||||
return;
|
||||
}
|
||||
const res = await fetch(`${API_URL}/alerts/${id}`, {
|
||||
method: 'DELETE',
|
||||
headers: getAuthHeaders()
|
||||
});
|
||||
if (!res.ok) throw new Error('Failed to delete alert');
|
||||
const alerts = getLocal<AlertDefinition[]>(STORAGE_KEYS.ALERTS, []);
|
||||
setLocal(STORAGE_KEYS.ALERTS, alerts.filter(a => a.id !== id));
|
||||
},
|
||||
|
||||
// --- SEEDING ---
|
||||
|
||||
seedPayments: () => {
|
||||
if (!FORCE_LOCAL_DB) return; // Don't seed if connected to DB
|
||||
if (!FORCE_LOCAL_DB) return;
|
||||
|
||||
const condos = getLocal<Condo[]>(STORAGE_KEYS.CONDOS, []);
|
||||
if (condos.length === 0) {
|
||||
const demoCondos: Condo[] = [
|
||||
{ id: 'c1', name: 'Residenza i Pini', address: 'Via Roma 10, Milano', defaultMonthlyQuota: 100 },
|
||||
{ id: 'c2', name: 'Condominio Parco Vittoria', address: 'Corso Italia 50, Torino', defaultMonthlyQuota: 85 }
|
||||
];
|
||||
setLocal(STORAGE_KEYS.CONDOS, demoCondos);
|
||||
localStorage.setItem(STORAGE_KEYS.ACTIVE_CONDO_ID, 'c1');
|
||||
}
|
||||
|
||||
const families = getLocal<Family[]>(STORAGE_KEYS.FAMILIES, []);
|
||||
if (families.length === 0) {
|
||||
// Seed only if completely empty
|
||||
const demoFamilies: Family[] = [
|
||||
{ id: 'f1', name: 'Rossi Mario', unitNumber: 'A1', contactEmail: 'rossi@email.com', balance: 0 },
|
||||
{ id: 'f2', name: 'Bianchi Luigi', unitNumber: 'A2', contactEmail: 'bianchi@email.com', balance: 0 },
|
||||
{ id: 'f3', name: 'Verdi Anna', unitNumber: 'B1', contactEmail: 'verdi@email.com', balance: 0 },
|
||||
{ id: 'f1', condoId: 'c1', name: 'Rossi Mario', unitNumber: 'A1', contactEmail: 'rossi@email.com', balance: 0 },
|
||||
{ id: 'f2', condoId: 'c1', name: 'Bianchi Luigi', unitNumber: 'A2', contactEmail: 'bianchi@email.com', balance: 0 },
|
||||
{ id: 'f3', condoId: 'c2', name: 'Verdi Anna', unitNumber: 'B1', contactEmail: 'verdi@email.com', balance: 0 },
|
||||
{ id: 'f4', condoId: 'c2', name: 'Neri Paolo', unitNumber: 'B2', contactEmail: 'neri@email.com', balance: 0 },
|
||||
];
|
||||
setLocal(STORAGE_KEYS.FAMILIES, demoFamilies);
|
||||
|
||||
|
||||
36
types.ts
36
types.ts
@@ -1,9 +1,21 @@
|
||||
|
||||
export interface Condo {
|
||||
id: string;
|
||||
name: string;
|
||||
address?: string;
|
||||
iban?: string;
|
||||
defaultMonthlyQuota: number;
|
||||
image?: string; // Optional placeholder for logo
|
||||
}
|
||||
|
||||
export interface Family {
|
||||
id: string;
|
||||
condoId: string; // Link to specific condo
|
||||
name: string;
|
||||
unitNumber: string; // Internal apartment number
|
||||
contactEmail?: string;
|
||||
balance: number; // Calculated balance (positive = credit, negative = debt)
|
||||
customMonthlyQuota?: number; // Optional override for default quota
|
||||
}
|
||||
|
||||
export interface Payment {
|
||||
@@ -36,10 +48,28 @@ export interface AlertDefinition {
|
||||
lastSent?: string; // ISO Date of last execution
|
||||
}
|
||||
|
||||
export type NoticeIconType = 'info' | 'warning' | 'maintenance' | 'event';
|
||||
|
||||
export interface Notice {
|
||||
id: string;
|
||||
condoId: string;
|
||||
title: string;
|
||||
content: string;
|
||||
type: NoticeIconType;
|
||||
link?: string;
|
||||
date: string; // ISO Date
|
||||
active: boolean;
|
||||
}
|
||||
|
||||
export interface NoticeRead {
|
||||
userId: string;
|
||||
noticeId: string;
|
||||
readAt: string;
|
||||
}
|
||||
|
||||
export interface AppSettings {
|
||||
defaultMonthlyQuota: number;
|
||||
condoName: string;
|
||||
currentYear: number; // The active fiscal year
|
||||
// Global settings only
|
||||
currentYear: number; // The active fiscal year (could be per-condo, but global for simplicity now)
|
||||
smtpConfig?: SmtpConfig;
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user