refactor: improve formatting, type safety, and component organization
- Adjusted inconsistent formatting for better readability across components and services. - Enhanced type safety by adding placeholders for ignored error parameters and improving types across services. - Improved component organization by reordering imports consistently and applying formatting updates in UI components.
This commit is contained in:
@@ -1,8 +1,8 @@
|
||||
"use client";
|
||||
|
||||
import { Loader2, Shield, ShieldAlert, ShieldCheck } from "lucide-react";
|
||||
import { useState } from "react";
|
||||
import { toast } from "sonner";
|
||||
import { Shield, ShieldCheck, ShieldAlert, Loader2 } from "lucide-react";
|
||||
import { Button } from "@/components/ui/button";
|
||||
import {
|
||||
Card,
|
||||
@@ -18,8 +18,8 @@ import {
|
||||
InputOTPSeparator,
|
||||
InputOTPSlot,
|
||||
} from "@/components/ui/input-otp";
|
||||
import { AuthService } from "@/services/auth.service";
|
||||
import { useAuth } from "@/providers/auth-provider";
|
||||
import { AuthService } from "@/services/auth.service";
|
||||
|
||||
export function TwoFactorSetup() {
|
||||
const { user, refreshUser } = useAuth();
|
||||
@@ -36,7 +36,7 @@ export function TwoFactorSetup() {
|
||||
setQrCode(data.qrCodeUrl);
|
||||
setSecret(data.secret);
|
||||
setStep("setup");
|
||||
} catch (error) {
|
||||
} catch (_error) {
|
||||
toast.error("Erreur lors de la configuration de la 2FA.");
|
||||
} finally {
|
||||
setIsLoading(false);
|
||||
@@ -52,7 +52,7 @@ export function TwoFactorSetup() {
|
||||
await refreshUser();
|
||||
setStep("idle");
|
||||
setOtpValue("");
|
||||
} catch (error) {
|
||||
} catch (_error) {
|
||||
toast.error("Code invalide. Veuillez réessayer.");
|
||||
} finally {
|
||||
setIsLoading(false);
|
||||
@@ -68,14 +68,14 @@ export function TwoFactorSetup() {
|
||||
await refreshUser();
|
||||
setStep("idle");
|
||||
setOtpValue("");
|
||||
} catch (error) {
|
||||
} catch (_error) {
|
||||
toast.error("Code invalide. Veuillez réessayer.");
|
||||
} finally {
|
||||
setIsLoading(false);
|
||||
}
|
||||
};
|
||||
|
||||
// Note: We need a way to know if 2FA is enabled.
|
||||
// Note: We need a way to know if 2FA is enabled.
|
||||
// Assuming user object might have twoFactorEnabled property or similar.
|
||||
// For now, let's assume it's on the user object (we might need to add it to the type).
|
||||
const isEnabled = (user as any)?.twoFactorEnabled;
|
||||
@@ -89,7 +89,8 @@ export function TwoFactorSetup() {
|
||||
<CardTitle>Double Authentification (2FA)</CardTitle>
|
||||
</div>
|
||||
<CardDescription>
|
||||
Ajoutez une couche de sécurité supplémentaire à votre compte en utilisant une application d'authentification.
|
||||
Ajoutez une couche de sécurité supplémentaire à votre compte en utilisant
|
||||
une application d'authentification.
|
||||
</CardDescription>
|
||||
</CardHeader>
|
||||
<CardContent>
|
||||
@@ -101,7 +102,9 @@ export function TwoFactorSetup() {
|
||||
</div>
|
||||
<div className="flex-1">
|
||||
<p className="font-bold">La 2FA est activée</p>
|
||||
<p className="text-sm text-muted-foreground">Votre compte est protégé par un code temporaire.</p>
|
||||
<p className="text-sm text-muted-foreground">
|
||||
Votre compte est protégé par un code temporaire.
|
||||
</p>
|
||||
</div>
|
||||
<Button variant="outline" size="sm" onClick={() => setStep("verify")}>
|
||||
Désactiver
|
||||
@@ -114,10 +117,21 @@ export function TwoFactorSetup() {
|
||||
</div>
|
||||
<div className="flex-1">
|
||||
<p className="font-bold">La 2FA n'est pas activée</p>
|
||||
<p className="text-sm text-muted-foreground">Activez la 2FA pour mieux protéger votre compte.</p>
|
||||
<p className="text-sm text-muted-foreground">
|
||||
Activez la 2FA pour mieux protéger votre compte.
|
||||
</p>
|
||||
</div>
|
||||
<Button variant="primary" size="sm" onClick={handleSetup} disabled={isLoading}>
|
||||
{isLoading ? <Loader2 className="h-4 w-4 animate-spin" /> : "Configurer"}
|
||||
<Button
|
||||
variant="default"
|
||||
size="sm"
|
||||
onClick={handleSetup}
|
||||
disabled={isLoading}
|
||||
>
|
||||
{isLoading ? (
|
||||
<Loader2 className="h-4 w-4 animate-spin" />
|
||||
) : (
|
||||
"Configurer"
|
||||
)}
|
||||
</Button>
|
||||
</>
|
||||
)}
|
||||
@@ -133,7 +147,8 @@ export function TwoFactorSetup() {
|
||||
<CardHeader>
|
||||
<CardTitle>Configurer la 2FA</CardTitle>
|
||||
<CardDescription>
|
||||
Scannez le QR Code ci-dessous avec votre application d'authentification (Google Authenticator, Authy, etc.).
|
||||
Scannez le QR Code ci-dessous avec votre application d'authentification
|
||||
(Google Authenticator, Authy, etc.).
|
||||
</CardDescription>
|
||||
</CardHeader>
|
||||
<CardContent className="flex flex-col items-center gap-6">
|
||||
@@ -143,13 +158,17 @@ export function TwoFactorSetup() {
|
||||
</div>
|
||||
)}
|
||||
<div className="w-full space-y-2">
|
||||
<p className="text-sm font-medium text-center">Ou entrez ce code manuellement :</p>
|
||||
<p className="text-sm font-medium text-center">
|
||||
Ou entrez ce code manuellement :
|
||||
</p>
|
||||
<code className="block p-2 bg-muted text-center rounded text-xs font-mono break-all">
|
||||
{secret}
|
||||
</code>
|
||||
</div>
|
||||
<div className="flex flex-col items-center gap-4 w-full border-t pt-6">
|
||||
<p className="text-sm font-medium">Entrez le code à 6 chiffres pour confirmer :</p>
|
||||
<p className="text-sm font-medium">
|
||||
Entrez le code à 6 chiffres pour confirmer :
|
||||
</p>
|
||||
<InputOTP maxLength={6} value={otpValue} onChange={setOtpValue}>
|
||||
<InputOTPGroup>
|
||||
<InputOTPSlot index={0} />
|
||||
@@ -166,9 +185,18 @@ export function TwoFactorSetup() {
|
||||
</div>
|
||||
</CardContent>
|
||||
<CardFooter className="flex justify-between">
|
||||
<Button variant="ghost" onClick={() => setStep("idle")}>Annuler</Button>
|
||||
<Button onClick={handleEnable} disabled={otpValue.length !== 6 || isLoading}>
|
||||
{isLoading ? <Loader2 className="h-4 w-4 animate-spin" /> : "Activer la 2FA"}
|
||||
<Button variant="ghost" onClick={() => setStep("idle")}>
|
||||
Annuler
|
||||
</Button>
|
||||
<Button
|
||||
onClick={handleEnable}
|
||||
disabled={otpValue.length !== 6 || isLoading}
|
||||
>
|
||||
{isLoading ? (
|
||||
<Loader2 className="h-4 w-4 animate-spin" />
|
||||
) : (
|
||||
"Activer la 2FA"
|
||||
)}
|
||||
</Button>
|
||||
</CardFooter>
|
||||
</Card>
|
||||
@@ -181,7 +209,8 @@ export function TwoFactorSetup() {
|
||||
<CardHeader>
|
||||
<CardTitle>Désactiver la 2FA</CardTitle>
|
||||
<CardDescription>
|
||||
Veuillez entrer le code de votre application pour désactiver la double authentification.
|
||||
Veuillez entrer le code de votre application pour désactiver la double
|
||||
authentification.
|
||||
</CardDescription>
|
||||
</CardHeader>
|
||||
<CardContent className="flex flex-col items-center gap-6">
|
||||
@@ -200,9 +229,19 @@ export function TwoFactorSetup() {
|
||||
</InputOTP>
|
||||
</CardContent>
|
||||
<CardFooter className="flex justify-between">
|
||||
<Button variant="ghost" onClick={() => setStep("idle")}>Annuler</Button>
|
||||
<Button variant="destructive" onClick={handleDisable} disabled={otpValue.length !== 6 || isLoading}>
|
||||
{isLoading ? <Loader2 className="h-4 w-4 animate-spin" /> : "Confirmer la désactivation"}
|
||||
<Button variant="ghost" onClick={() => setStep("idle")}>
|
||||
Annuler
|
||||
</Button>
|
||||
<Button
|
||||
variant="destructive"
|
||||
onClick={handleDisable}
|
||||
disabled={otpValue.length !== 6 || isLoading}
|
||||
>
|
||||
{isLoading ? (
|
||||
<Loader2 className="h-4 w-4 animate-spin" />
|
||||
) : (
|
||||
"Confirmer la désactivation"
|
||||
)}
|
||||
</Button>
|
||||
</CardFooter>
|
||||
</Card>
|
||||
|
||||
Reference in New Issue
Block a user