Compare commits
7 Commits
b3d7e312c4
..
master
| Author | SHA1 | Date | |
|---|---|---|---|
| 6e33a19d41 | |||
| 641f634dfa | |||
| 689c5105fe | |||
| dffa4c5a77 | |||
| c040b9e62d | |||
| 39bf84cd0e | |||
| b989b6e8e8 |
@@ -1,33 +1,7 @@
|
|||||||
import { Card, CardContent, CardHeader } from '@/components/ui/Card';
|
import { Card, CardContent, CardHeader } from '@/components/ui/Card';
|
||||||
import type { Company } from '@/types/Company';
|
|
||||||
import type { User } from '@/types/user';
|
|
||||||
import { Loader } from '@/components/ui/Loader';
|
|
||||||
import { Building } from "lucide-react";
|
import { Building } from "lucide-react";
|
||||||
|
|
||||||
interface InformationWidgetProps {
|
export function InformationWidget() {
|
||||||
user: User;
|
|
||||||
company: Company;
|
|
||||||
isLoading: boolean;
|
|
||||||
error: string;
|
|
||||||
}
|
|
||||||
|
|
||||||
function setVipBadge(vip_level: string | undefined) {
|
|
||||||
switch (vip_level?.toLowerCase()) {
|
|
||||||
case "platinum":
|
|
||||||
return <span className="px-2 py-1 bg-amber-600 text-white text-xs font-bold rounded shadow-sm mr-2 tracking-wider">{vip_level?.toUpperCase()}</span>;
|
|
||||||
case "premium":
|
|
||||||
return <span className="px-2 py-1 bg-violet-600 text-white text-xs font-bold rounded shadow-sm mr-2 tracking-wider">{vip_level?.toUpperCase()}</span>;
|
|
||||||
default:
|
|
||||||
return <span className="px-2 py-1 bg-blue-600 text-white text-xs font-bold rounded shadow-sm mr-2 tracking-wider">{vip_level?.toUpperCase()}</span>;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
export const InformationWidget: React.FC<InformationWidgetProps> = ({
|
|
||||||
user,
|
|
||||||
company,
|
|
||||||
isLoading,
|
|
||||||
error,
|
|
||||||
}) => {
|
|
||||||
return (
|
return (
|
||||||
<Card>
|
<Card>
|
||||||
<CardHeader className="p-6 border-slate-100">
|
<CardHeader className="p-6 border-slate-100">
|
||||||
@@ -38,27 +12,23 @@ export const InformationWidget: React.FC<InformationWidgetProps> = ({
|
|||||||
</CardHeader>
|
</CardHeader>
|
||||||
|
|
||||||
<CardContent>
|
<CardContent>
|
||||||
{isLoading && !error && <Loader />}
|
<dl className="space-y-4 text-sm">
|
||||||
{!isLoading && !error && (
|
<div>
|
||||||
<dl className="space-y-4 text-sm">
|
<dt className="text-slate-500 font-medium">Entité Légale</dt>
|
||||||
<div>
|
<dd className="mt-1 font-semibold text-slate-900">Cabinet Juridique Example & Associés</dd>
|
||||||
<dt className="text-slate-500 font-medium">Entité Légale</dt>
|
</div>
|
||||||
<dd className="mt-1 font-semibold text-slate-900">{company?.name}</dd>
|
<div>
|
||||||
</div>
|
<dt className="text-slate-500 font-medium">Administrateur du compte</dt>
|
||||||
<div>
|
<dd className="mt-1 text-slate-900">Direction Générale (direction@example.com)</dd>
|
||||||
<dt className="text-slate-500 font-medium">Administrateur du compte</dt>
|
</div>
|
||||||
<dd className="mt-1 text-slate-900">{user?.role} {user?.name}</dd>
|
<div>
|
||||||
<dd className="mt-1 text-slate-500">Email : {user?.emailVisibility && user?.email}{!user?.emailVisibility && "caché"}</dd>
|
<dt className="text-slate-500 font-medium">Niveau d'Infogérance (SLA)</dt>
|
||||||
</div>
|
<dd className="mt-1 flex items-center">
|
||||||
<div>
|
<span className="px-2 py-1 bg-blue-900 text-white text-xs font-bold rounded shadow-sm mr-2 tracking-wider">VIP PLATINUM</span>
|
||||||
<dt className="text-slate-500 font-medium">Niveau d'Infogérance (SLA)</dt>
|
<span className="text-slate-700 font-medium">Couverture 24/7 (99.99%)</span>
|
||||||
<dd className="mt-1 flex items-center">
|
</dd>
|
||||||
{setVipBadge(company?.vip_level)}
|
</div>
|
||||||
<span className="text-slate-700 font-medium">Couverture 24/7 (99.99%)</span>
|
</dl>
|
||||||
</dd>
|
|
||||||
</div>
|
|
||||||
</dl>
|
|
||||||
)}
|
|
||||||
</CardContent>
|
</CardContent>
|
||||||
</Card>
|
</Card>
|
||||||
);
|
);
|
||||||
|
|||||||
@@ -1,30 +0,0 @@
|
|||||||
import { pb } from "@/services/pocketbase";
|
|
||||||
import type { Company } from "@/types/Company";
|
|
||||||
import type { User } from "@/types/user";
|
|
||||||
import { useEffect, useState } from "react";
|
|
||||||
|
|
||||||
export const useUserInformations = () => {
|
|
||||||
const [user, setUser] = useState<User | null>(null);
|
|
||||||
const [company, setCompany] = useState<Company | null>(null);
|
|
||||||
const [isLoading, setIsLoading] = useState(true);
|
|
||||||
const [error, setError] = useState<string | null>(null);
|
|
||||||
|
|
||||||
useEffect(() => {
|
|
||||||
const fetchInformations = async () => {
|
|
||||||
setIsLoading(true);
|
|
||||||
try {
|
|
||||||
const userRecords = await pb.collection('aegis_users').getFullList<User>();
|
|
||||||
setUser(userRecords[0]);
|
|
||||||
const companyRecords = await pb.collection('aegis_companies').getFullList<Company>();
|
|
||||||
setCompany(companyRecords[0])
|
|
||||||
} catch (err) {
|
|
||||||
setError("Erreur lors de la récupération des infos utilisateur :"+err);
|
|
||||||
} finally {
|
|
||||||
setIsLoading(false);
|
|
||||||
}
|
|
||||||
};
|
|
||||||
fetchInformations();
|
|
||||||
}, []);
|
|
||||||
|
|
||||||
return { user, company, isLoading, error };
|
|
||||||
};
|
|
||||||
@@ -1,29 +1,29 @@
|
|||||||
import PageHeader from "@/components/ui/PageHeader";
|
import PageHeader from "@/components/ui/PageHeader";
|
||||||
import AccessWidget from "@/components/widgets/AccessWidget";
|
import AccessWidget from "@/components/widgets/AccessWidget";
|
||||||
import InformationWidget from "@/components/widgets/InformationWidget";
|
import InformationWidget from "@/components/widgets/InformationWidget";
|
||||||
import { useUserInformations } from "@/hooks/useUserInformations";
|
|
||||||
|
|
||||||
export default function AccountSettings() {
|
export default function AccountSettings() {
|
||||||
const { user, company, isLoading, error } = useUserInformations();
|
|
||||||
return (
|
return (
|
||||||
<div className="font-sans relative min-h-[calc(100vh-4rem)]">
|
<div className="font-sans relative min-h-[calc(100vh-4rem)]">
|
||||||
|
|
||||||
|
|
||||||
{/* Contenu Principal */}
|
{/* Contenu Principal */}
|
||||||
<main className="max-w-7xl mx-auto px-8 sm:px-8 space-y-6 m-4">
|
<main className="max-w-7xl mx-auto px-8 sm:px-8 space-y-6 m-4">
|
||||||
{/* Header */}
|
{/* Header */}
|
||||||
<PageHeader
|
<PageHeader
|
||||||
title="Paramètres du compte"
|
title="Paramètres du compte"
|
||||||
description="Gestion de la sécurité et informations contractuelles" />
|
description="Gestion de la sécurité et informations contractuelles" />
|
||||||
|
|
||||||
<div className="grid grid-cols-1 lg:grid-cols-2 gap-8">
|
<div className="grid grid-cols-1 lg:grid-cols-2 gap-8">
|
||||||
|
|
||||||
{/* Colonne 1 : Sécurité */}
|
{/* Colonne 1 : Sécurité */}
|
||||||
<AccessWidget />
|
<AccessWidget/>
|
||||||
|
|
||||||
{/* Colonne 2 : Organisation & Contrat */}
|
{/* Colonne 2 : Organisation & Contrat */}
|
||||||
<InformationWidget
|
<InformationWidget/>
|
||||||
user={user}
|
|
||||||
company={company}
|
|
||||||
isLoading={isLoading}
|
|
||||||
error={error}
|
|
||||||
/>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
</main>
|
</main>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
|
|||||||
@@ -1,8 +0,0 @@
|
|||||||
export interface Company {
|
|
||||||
id: string;
|
|
||||||
name: string;
|
|
||||||
no: string;
|
|
||||||
vip_level: string;
|
|
||||||
created: string;
|
|
||||||
updated: string
|
|
||||||
}
|
|
||||||
@@ -1,12 +0,0 @@
|
|||||||
export interface User {
|
|
||||||
id: string;
|
|
||||||
email: string;
|
|
||||||
emailVisibility: boolean;
|
|
||||||
verified: boolean;
|
|
||||||
name: string;
|
|
||||||
role: string;
|
|
||||||
company: string;
|
|
||||||
mfa_enabled: boolean;
|
|
||||||
created: string;
|
|
||||||
updated: string
|
|
||||||
}
|
|
||||||
Reference in New Issue
Block a user