Compare commits
14 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
0382b21a65
|
||
|
|
764c4c07c8
|
||
|
|
68b5071f6d
|
||
|
|
f5c90b0ae4
|
||
|
|
c8820a71b6
|
||
|
|
9b714716f6
|
||
|
|
3a5550d6eb
|
||
|
|
07cdb741b3
|
||
|
|
02796e4e1f
|
||
|
|
951b38db67
|
||
|
|
a90aba2748
|
||
|
|
3f0b1e5119
|
||
|
|
aff8acebf8
|
||
|
|
a721b4041c
|
@@ -24,7 +24,8 @@
|
||||
"rules": {
|
||||
"recommended": true,
|
||||
"suspicious": {
|
||||
"noUnknownAtRules": "off"
|
||||
"noUnknownAtRules": "off",
|
||||
"noExplicitAny": "off"
|
||||
},
|
||||
"style": {
|
||||
"useImportType": "off"
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "@memegoat/backend",
|
||||
"version": "1.1.1",
|
||||
"version": "1.3.0",
|
||||
"description": "",
|
||||
"author": "",
|
||||
"private": true,
|
||||
@@ -13,7 +13,7 @@
|
||||
"scripts": {
|
||||
"build": "nest build",
|
||||
"lint": "biome check",
|
||||
"lint:write": "biome check --write",
|
||||
"lint:write": "biome check --write --unsafe",
|
||||
"format": "biome format --write",
|
||||
"start": "nest start",
|
||||
"start:dev": "nest start --watch",
|
||||
@@ -107,7 +107,7 @@
|
||||
"coverageDirectory": "../coverage",
|
||||
"testEnvironment": "node",
|
||||
"transformIgnorePatterns": [
|
||||
"node_modules/(?!(.pnpm/)?(jose|@noble|uuid)/)"
|
||||
"node_modules/(?!(.pnpm/)?(jose|@noble|uuid))"
|
||||
],
|
||||
"transform": {
|
||||
"^.+\\.(t|j)sx?$": "ts-jest"
|
||||
|
||||
@@ -24,6 +24,7 @@ import { ConfigService } from "@nestjs/config";
|
||||
import { Test, TestingModule } from "@nestjs/testing";
|
||||
import { AuthController } from "./auth.controller";
|
||||
import { AuthService } from "./auth.service";
|
||||
import { BootstrapService } from "./bootstrap.service";
|
||||
|
||||
jest.mock("iron-session", () => ({
|
||||
getIronSession: jest.fn().mockResolvedValue({
|
||||
@@ -44,6 +45,10 @@ describe("AuthController", () => {
|
||||
refresh: jest.fn(),
|
||||
};
|
||||
|
||||
const mockBootstrapService = {
|
||||
consumeToken: jest.fn(),
|
||||
};
|
||||
|
||||
const mockConfigService = {
|
||||
get: jest
|
||||
.fn()
|
||||
@@ -55,6 +60,7 @@ describe("AuthController", () => {
|
||||
controllers: [AuthController],
|
||||
providers: [
|
||||
{ provide: AuthService, useValue: mockAuthService },
|
||||
{ provide: BootstrapService, useValue: mockBootstrapService },
|
||||
{ provide: ConfigService, useValue: mockConfigService },
|
||||
],
|
||||
}).compile();
|
||||
@@ -75,7 +81,6 @@ describe("AuthController", () => {
|
||||
password: "password",
|
||||
username: "test",
|
||||
};
|
||||
// biome-ignore lint/suspicious/noExplicitAny: Necessary to avoid defining full DTO in test
|
||||
await controller.register(dto as any);
|
||||
expect(authService.register).toHaveBeenCalledWith(dto);
|
||||
});
|
||||
|
||||
@@ -1,9 +1,19 @@
|
||||
import { Body, Controller, Headers, Post, Req, Res } from "@nestjs/common";
|
||||
import {
|
||||
Body,
|
||||
Controller,
|
||||
Get,
|
||||
Headers,
|
||||
Post,
|
||||
Query,
|
||||
Req,
|
||||
Res,
|
||||
} from "@nestjs/common";
|
||||
import { ConfigService } from "@nestjs/config";
|
||||
import { Throttle } from "@nestjs/throttler";
|
||||
import type { Request, Response } from "express";
|
||||
import { getIronSession } from "iron-session";
|
||||
import { AuthService } from "./auth.service";
|
||||
import { BootstrapService } from "./bootstrap.service";
|
||||
import { LoginDto } from "./dto/login.dto";
|
||||
import { RegisterDto } from "./dto/register.dto";
|
||||
import { Verify2faDto } from "./dto/verify-2fa.dto";
|
||||
@@ -13,6 +23,7 @@ import { getSessionOptions, SessionData } from "./session.config";
|
||||
export class AuthController {
|
||||
constructor(
|
||||
private readonly authService: AuthService,
|
||||
private readonly bootstrapService: BootstrapService,
|
||||
private readonly configService: ConfigService,
|
||||
) {}
|
||||
|
||||
@@ -120,4 +131,12 @@ export class AuthController {
|
||||
session.destroy();
|
||||
return res.json({ message: "User logged out" });
|
||||
}
|
||||
|
||||
@Get("bootstrap-admin")
|
||||
async bootstrapAdmin(
|
||||
@Query("token") token: string,
|
||||
@Query("username") username: string,
|
||||
) {
|
||||
return this.bootstrapService.consumeToken(token, username);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -3,6 +3,7 @@ import { SessionsModule } from "../sessions/sessions.module";
|
||||
import { UsersModule } from "../users/users.module";
|
||||
import { AuthController } from "./auth.controller";
|
||||
import { AuthService } from "./auth.service";
|
||||
import { BootstrapService } from "./bootstrap.service";
|
||||
import { AuthGuard } from "./guards/auth.guard";
|
||||
import { OptionalAuthGuard } from "./guards/optional-auth.guard";
|
||||
import { RolesGuard } from "./guards/roles.guard";
|
||||
@@ -15,6 +16,7 @@ import { RbacRepository } from "./repositories/rbac.repository";
|
||||
providers: [
|
||||
AuthService,
|
||||
RbacService,
|
||||
BootstrapService,
|
||||
RbacRepository,
|
||||
AuthGuard,
|
||||
OptionalAuthGuard,
|
||||
|
||||
114
backend/src/auth/bootstrap.service.spec.ts
Normal file
114
backend/src/auth/bootstrap.service.spec.ts
Normal file
@@ -0,0 +1,114 @@
|
||||
import { UnauthorizedException } from "@nestjs/common";
|
||||
import { ConfigService } from "@nestjs/config";
|
||||
import { Test, TestingModule } from "@nestjs/testing";
|
||||
import { UsersService } from "../users/users.service";
|
||||
import { BootstrapService } from "./bootstrap.service";
|
||||
import { RbacService } from "./rbac.service";
|
||||
|
||||
describe("BootstrapService", () => {
|
||||
let service: BootstrapService;
|
||||
let rbacService: RbacService;
|
||||
let _usersService: UsersService;
|
||||
|
||||
const mockRbacService = {
|
||||
countAdmins: jest.fn(),
|
||||
assignRoleToUser: jest.fn(),
|
||||
};
|
||||
|
||||
const mockUsersService = {
|
||||
findPublicProfile: jest.fn(),
|
||||
};
|
||||
|
||||
const mockConfigService = {
|
||||
get: jest.fn(),
|
||||
};
|
||||
|
||||
beforeEach(async () => {
|
||||
jest.clearAllMocks();
|
||||
const module: TestingModule = await Test.createTestingModule({
|
||||
providers: [
|
||||
BootstrapService,
|
||||
{ provide: RbacService, useValue: mockRbacService },
|
||||
{ provide: UsersService, useValue: mockUsersService },
|
||||
{ provide: ConfigService, useValue: mockConfigService },
|
||||
],
|
||||
}).compile();
|
||||
|
||||
service = module.get<BootstrapService>(BootstrapService);
|
||||
rbacService = module.get<RbacService>(RbacService);
|
||||
_usersService = module.get<UsersService>(UsersService);
|
||||
});
|
||||
|
||||
it("should be defined", () => {
|
||||
expect(service).toBeDefined();
|
||||
});
|
||||
|
||||
describe("onApplicationBootstrap", () => {
|
||||
it("should generate a token if no admin exists", async () => {
|
||||
mockRbacService.countAdmins.mockResolvedValue(0);
|
||||
const generateTokenSpy = jest.spyOn(
|
||||
service as any,
|
||||
"generateBootstrapToken",
|
||||
);
|
||||
|
||||
await service.onApplicationBootstrap();
|
||||
|
||||
expect(rbacService.countAdmins).toHaveBeenCalled();
|
||||
expect(generateTokenSpy).toHaveBeenCalled();
|
||||
});
|
||||
|
||||
it("should not generate a token if admin exists", async () => {
|
||||
mockRbacService.countAdmins.mockResolvedValue(1);
|
||||
const generateTokenSpy = jest.spyOn(
|
||||
service as any,
|
||||
"generateBootstrapToken",
|
||||
);
|
||||
|
||||
await service.onApplicationBootstrap();
|
||||
|
||||
expect(rbacService.countAdmins).toHaveBeenCalled();
|
||||
expect(generateTokenSpy).not.toHaveBeenCalled();
|
||||
});
|
||||
});
|
||||
|
||||
describe("consumeToken", () => {
|
||||
it("should throw UnauthorizedException if token is invalid", async () => {
|
||||
mockRbacService.countAdmins.mockResolvedValue(0);
|
||||
await service.onApplicationBootstrap();
|
||||
|
||||
await expect(service.consumeToken("wrong-token", "user1")).rejects.toThrow(
|
||||
UnauthorizedException,
|
||||
);
|
||||
});
|
||||
|
||||
it("should throw UnauthorizedException if user not found", async () => {
|
||||
mockRbacService.countAdmins.mockResolvedValue(0);
|
||||
await service.onApplicationBootstrap();
|
||||
const token = (service as any).bootstrapToken;
|
||||
|
||||
mockUsersService.findPublicProfile.mockResolvedValue(null);
|
||||
|
||||
await expect(service.consumeToken(token, "user1")).rejects.toThrow(
|
||||
UnauthorizedException,
|
||||
);
|
||||
});
|
||||
|
||||
it("should assign admin role and invalidate token on success", async () => {
|
||||
mockRbacService.countAdmins.mockResolvedValue(0);
|
||||
await service.onApplicationBootstrap();
|
||||
const token = (service as any).bootstrapToken;
|
||||
|
||||
const mockUser = { uuid: "user-uuid", username: "user1" };
|
||||
mockUsersService.findPublicProfile.mockResolvedValue(mockUser);
|
||||
|
||||
const result = await service.consumeToken(token, "user1");
|
||||
|
||||
expect(rbacService.assignRoleToUser).toHaveBeenCalledWith(
|
||||
"user-uuid",
|
||||
"admin",
|
||||
);
|
||||
expect((service as any).bootstrapToken).toBeNull();
|
||||
expect(result.message).toContain("user1 is now an administrator");
|
||||
});
|
||||
});
|
||||
});
|
||||
67
backend/src/auth/bootstrap.service.ts
Normal file
67
backend/src/auth/bootstrap.service.ts
Normal file
@@ -0,0 +1,67 @@
|
||||
import * as crypto from "node:crypto";
|
||||
import {
|
||||
Injectable,
|
||||
Logger,
|
||||
OnApplicationBootstrap,
|
||||
UnauthorizedException,
|
||||
} from "@nestjs/common";
|
||||
import { ConfigService } from "@nestjs/config";
|
||||
import { UsersService } from "../users/users.service";
|
||||
import { RbacService } from "./rbac.service";
|
||||
|
||||
@Injectable()
|
||||
export class BootstrapService implements OnApplicationBootstrap {
|
||||
private readonly logger = new Logger(BootstrapService.name);
|
||||
private bootstrapToken: string | null = null;
|
||||
|
||||
constructor(
|
||||
private readonly rbacService: RbacService,
|
||||
private readonly usersService: UsersService,
|
||||
private readonly configService: ConfigService,
|
||||
) {}
|
||||
|
||||
async onApplicationBootstrap() {
|
||||
const adminCount = await this.rbacService.countAdmins();
|
||||
if (adminCount === 0) {
|
||||
this.generateBootstrapToken();
|
||||
}
|
||||
}
|
||||
|
||||
private generateBootstrapToken() {
|
||||
this.bootstrapToken = crypto.randomBytes(32).toString("hex");
|
||||
const domain = this.configService.get("DOMAIN_NAME") || "localhost";
|
||||
const protocol = domain.includes("localhost") ? "http" : "https";
|
||||
const url = `${protocol}://${domain}/auth/bootstrap-admin`;
|
||||
|
||||
this.logger.warn("SECURITY ALERT: No administrator found in database.");
|
||||
this.logger.warn(
|
||||
"To create the first administrator, use the following endpoint:",
|
||||
);
|
||||
this.logger.warn(
|
||||
`Endpoint: GET ${url}?token=${this.bootstrapToken}&username=votre_nom_utilisateur`,
|
||||
);
|
||||
this.logger.warn(
|
||||
'Exemple: curl -X GET "http://localhost/auth/bootstrap-admin?token=...&username=..."',
|
||||
);
|
||||
this.logger.warn("This token is one-time use only.");
|
||||
}
|
||||
|
||||
async consumeToken(token: string, username: string) {
|
||||
if (!this.bootstrapToken || token !== this.bootstrapToken) {
|
||||
throw new UnauthorizedException("Invalid or expired bootstrap token");
|
||||
}
|
||||
|
||||
const user = await this.usersService.findPublicProfile(username);
|
||||
if (!user) {
|
||||
throw new UnauthorizedException(`User ${username} not found`);
|
||||
}
|
||||
|
||||
await this.rbacService.assignRoleToUser(user.uuid, "admin");
|
||||
this.bootstrapToken = null; // One-time use
|
||||
|
||||
this.logger.log(
|
||||
`User ${username} has been promoted to administrator via bootstrap token.`,
|
||||
);
|
||||
return { message: `User ${username} is now an administrator` };
|
||||
}
|
||||
}
|
||||
@@ -18,7 +18,11 @@ export class RbacService implements OnApplicationBootstrap {
|
||||
if (count === 0) {
|
||||
this.logger.log("No roles found, seeding default roles...");
|
||||
const defaultRoles = [
|
||||
{ name: "Administrator", slug: "admin", description: "Full system access" },
|
||||
{
|
||||
name: "Administrator",
|
||||
slug: "admin",
|
||||
description: "Full system access",
|
||||
},
|
||||
{
|
||||
name: "Moderator",
|
||||
slug: "moderator",
|
||||
@@ -51,4 +55,12 @@ export class RbacService implements OnApplicationBootstrap {
|
||||
async getUserPermissions(userId: string) {
|
||||
return this.rbacRepository.findPermissionsByUserId(userId);
|
||||
}
|
||||
|
||||
async countAdmins() {
|
||||
return this.rbacRepository.countAdmins();
|
||||
}
|
||||
|
||||
async assignRoleToUser(userId: string, roleSlug: string) {
|
||||
return this.rbacRepository.assignRole(userId, roleSlug);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -47,6 +47,15 @@ export class RbacRepository {
|
||||
return result.length;
|
||||
}
|
||||
|
||||
async countAdmins(): Promise<number> {
|
||||
const result = await this.databaseService.db
|
||||
.select({ count: usersToRoles.userId })
|
||||
.from(usersToRoles)
|
||||
.innerJoin(roles, eq(usersToRoles.roleId, roles.id))
|
||||
.where(eq(roles.slug, "admin"));
|
||||
return result.length;
|
||||
}
|
||||
|
||||
async createRole(name: string, slug: string, description?: string) {
|
||||
return this.databaseService.db
|
||||
.insert(roles)
|
||||
@@ -57,4 +66,25 @@ export class RbacRepository {
|
||||
})
|
||||
.returning();
|
||||
}
|
||||
|
||||
async assignRole(userId: string, roleSlug: string) {
|
||||
const role = await this.databaseService.db
|
||||
.select()
|
||||
.from(roles)
|
||||
.where(eq(roles.slug, roleSlug))
|
||||
.limit(1);
|
||||
|
||||
if (!role[0]) {
|
||||
throw new Error(`Role with slug ${roleSlug} not found`);
|
||||
}
|
||||
|
||||
return this.databaseService.db
|
||||
.insert(usersToRoles)
|
||||
.values({
|
||||
userId,
|
||||
roleId: role[0].id,
|
||||
})
|
||||
.onConflictDoNothing()
|
||||
.returning();
|
||||
}
|
||||
}
|
||||
|
||||
@@ -10,6 +10,7 @@ import {
|
||||
Param,
|
||||
ParseBoolPipe,
|
||||
ParseIntPipe,
|
||||
Patch,
|
||||
Post,
|
||||
Query,
|
||||
Req,
|
||||
@@ -185,4 +186,11 @@ export class ContentsController {
|
||||
removeAdmin(@Param("id") id: string) {
|
||||
return this.contentsService.removeAdmin(id);
|
||||
}
|
||||
|
||||
@Patch(":id/admin")
|
||||
@UseGuards(AuthGuard, RolesGuard)
|
||||
@Roles("admin")
|
||||
updateAdmin(@Param("id") id: string, @Body() updateContentDto: any) {
|
||||
return this.contentsService.updateAdmin(id, updateContentDto);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -184,6 +184,16 @@ export class ContentsService {
|
||||
return deleted;
|
||||
}
|
||||
|
||||
async updateAdmin(id: string, data: any) {
|
||||
this.logger.log(`Updating content ${id} by admin`);
|
||||
const updated = await this.contentsRepository.update(id, data);
|
||||
|
||||
if (updated) {
|
||||
await this.clearContentsCache();
|
||||
}
|
||||
return updated;
|
||||
}
|
||||
|
||||
async findOne(idOrSlug: string, userId?: string) {
|
||||
const content = await this.contentsRepository.findOne(idOrSlug, userId);
|
||||
if (!content) return null;
|
||||
|
||||
@@ -404,6 +404,15 @@ export class ContentsRepository {
|
||||
return deleted;
|
||||
}
|
||||
|
||||
async update(id: string, data: Partial<typeof contents.$inferInsert>) {
|
||||
const [updated] = await this.databaseService.db
|
||||
.update(contents)
|
||||
.set({ ...data, updatedAt: new Date() })
|
||||
.where(eq(contents.id, id))
|
||||
.returning();
|
||||
return updated;
|
||||
}
|
||||
|
||||
async findBySlug(slug: string) {
|
||||
const [result] = await this.databaseService.db
|
||||
.select()
|
||||
|
||||
@@ -8,7 +8,6 @@ jest.mock("minio");
|
||||
describe("S3Service", () => {
|
||||
let service: S3Service;
|
||||
let configService: ConfigService;
|
||||
// biome-ignore lint/suspicious/noExplicitAny: Fine for testing purposes
|
||||
let minioClient: any;
|
||||
|
||||
beforeEach(async () => {
|
||||
|
||||
@@ -14,4 +14,12 @@ export class UpdateUserDto {
|
||||
@IsOptional()
|
||||
@IsString()
|
||||
avatarUrl?: string;
|
||||
|
||||
@IsOptional()
|
||||
@IsString()
|
||||
status?: "active" | "verification" | "suspended" | "pending" | "deleted";
|
||||
|
||||
@IsOptional()
|
||||
@IsString()
|
||||
role?: string;
|
||||
}
|
||||
|
||||
@@ -64,7 +64,7 @@ export class UsersRepository {
|
||||
}
|
||||
|
||||
async findAll(limit: number, offset: number) {
|
||||
return await this.databaseService.db
|
||||
const result = await this.databaseService.db
|
||||
.select({
|
||||
uuid: users.uuid,
|
||||
username: users.username,
|
||||
@@ -77,6 +77,8 @@ export class UsersRepository {
|
||||
.from(users)
|
||||
.limit(limit)
|
||||
.offset(offset);
|
||||
|
||||
return result;
|
||||
}
|
||||
|
||||
async findByUsername(username: string) {
|
||||
|
||||
@@ -112,6 +112,16 @@ export class UsersController {
|
||||
return this.usersService.remove(uuid);
|
||||
}
|
||||
|
||||
@Patch("admin/:uuid")
|
||||
@UseGuards(AuthGuard, RolesGuard)
|
||||
@Roles("admin")
|
||||
updateAdmin(
|
||||
@Param("uuid") uuid: string,
|
||||
@Body() updateUserDto: UpdateUserDto,
|
||||
) {
|
||||
return this.usersService.update(uuid, updateUserDto);
|
||||
}
|
||||
|
||||
// Double Authentification (2FA)
|
||||
@Post("me/2fa/setup")
|
||||
@UseGuards(AuthGuard)
|
||||
|
||||
@@ -100,7 +100,14 @@ export class UsersService {
|
||||
|
||||
async update(uuid: string, data: UpdateUserDto) {
|
||||
this.logger.log(`Updating user profile for ${uuid}`);
|
||||
const result = await this.usersRepository.update(uuid, data);
|
||||
|
||||
const { role, ...userData } = data;
|
||||
|
||||
const result = await this.usersRepository.update(uuid, userData);
|
||||
|
||||
if (role) {
|
||||
await this.rbacService.assignRoleToUser(uuid, role);
|
||||
}
|
||||
|
||||
if (result[0]) {
|
||||
await this.clearUserCache(result[0].username);
|
||||
|
||||
@@ -92,6 +92,21 @@ Cette page documente tous les points de terminaison disponibles sur l'API Memego
|
||||
**Réponses :**
|
||||
- `200 OK` : Déconnexion réussie.
|
||||
</Accordion>
|
||||
|
||||
<Accordion title="GET /auth/bootstrap-admin">
|
||||
Élève les privilèges d'un utilisateur au rang d'administrateur.
|
||||
<Callout type="warn">
|
||||
Cette route n'est active que si aucun administrateur n'existe en base de données. Le token est affiché dans les logs de la console au démarrage.
|
||||
</Callout>
|
||||
|
||||
**Query Params :**
|
||||
- `token` (string) : Token à usage unique généré par le système.
|
||||
- `username` (string) : Nom de l'utilisateur à promouvoir.
|
||||
|
||||
**Réponses :**
|
||||
- `200 OK` : Utilisateur promu.
|
||||
- `401 Unauthorized` : Token invalide ou utilisateur non trouvé.
|
||||
</Accordion>
|
||||
</Accordions>
|
||||
|
||||
### 👤 Utilisateurs (`/users`)
|
||||
|
||||
@@ -1,12 +1,13 @@
|
||||
{
|
||||
"name": "@memegoat/frontend",
|
||||
"version": "1.1.1",
|
||||
"version": "1.3.0",
|
||||
"private": true,
|
||||
"scripts": {
|
||||
"dev": "next dev",
|
||||
"build": "next build",
|
||||
"start": "next start",
|
||||
"lint": "biome check",
|
||||
"lint:write": "biome check --write",
|
||||
"format": "biome format --write"
|
||||
},
|
||||
"dependencies": {
|
||||
|
||||
@@ -0,0 +1,149 @@
|
||||
"use client";
|
||||
|
||||
import { useEffect, useState } from "react";
|
||||
import { useForm } from "react-hook-form";
|
||||
import { Button } from "@/components/ui/button";
|
||||
import {
|
||||
Dialog,
|
||||
DialogContent,
|
||||
DialogFooter,
|
||||
DialogHeader,
|
||||
DialogTitle,
|
||||
} from "@/components/ui/dialog";
|
||||
import {
|
||||
Form,
|
||||
FormControl,
|
||||
FormField,
|
||||
FormItem,
|
||||
FormLabel,
|
||||
FormMessage,
|
||||
} from "@/components/ui/form";
|
||||
import { Input } from "@/components/ui/input";
|
||||
import { Textarea } from "@/components/ui/textarea";
|
||||
import { CategoryService } from "@/services/category.service";
|
||||
import type { Category } from "@/types/content";
|
||||
|
||||
interface CategoryDialogProps {
|
||||
category?: Category | null;
|
||||
open: boolean;
|
||||
onOpenChange: (open: boolean) => void;
|
||||
onSuccess: () => void;
|
||||
}
|
||||
|
||||
export function CategoryDialog({
|
||||
category,
|
||||
open,
|
||||
onOpenChange,
|
||||
onSuccess,
|
||||
}: CategoryDialogProps) {
|
||||
const [loading, setLoading] = useState(false);
|
||||
|
||||
const form = useForm<Partial<Category>>({
|
||||
defaultValues: {
|
||||
name: "",
|
||||
description: "",
|
||||
iconUrl: "",
|
||||
},
|
||||
});
|
||||
|
||||
useEffect(() => {
|
||||
if (category) {
|
||||
form.reset({
|
||||
name: category.name,
|
||||
description: category.description || "",
|
||||
iconUrl: category.iconUrl || "",
|
||||
});
|
||||
} else {
|
||||
form.reset({
|
||||
name: "",
|
||||
description: "",
|
||||
iconUrl: "",
|
||||
});
|
||||
}
|
||||
}, [category, form]);
|
||||
|
||||
const onSubmit = async (values: Partial<Category>) => {
|
||||
setLoading(true);
|
||||
try {
|
||||
if (category) {
|
||||
await CategoryService.update(category.id, values);
|
||||
} else {
|
||||
await CategoryService.create(values);
|
||||
}
|
||||
onSuccess();
|
||||
onOpenChange(false);
|
||||
} catch (error) {
|
||||
console.error(error);
|
||||
} finally {
|
||||
setLoading(false);
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<Dialog open={open} onOpenChange={onOpenChange}>
|
||||
<DialogContent>
|
||||
<DialogHeader>
|
||||
<DialogTitle>
|
||||
{category ? "Modifier la catégorie" : "Créer une catégorie"}
|
||||
</DialogTitle>
|
||||
</DialogHeader>
|
||||
<Form {...form}>
|
||||
<form onSubmit={form.handleSubmit(onSubmit)} className="space-y-4">
|
||||
<FormField
|
||||
control={form.control}
|
||||
name="name"
|
||||
rules={{ required: "Le nom est requis" }}
|
||||
render={({ field }) => (
|
||||
<FormItem>
|
||||
<FormLabel>Nom</FormLabel>
|
||||
<FormControl>
|
||||
<Input {...field} placeholder="Nom de la catégorie" />
|
||||
</FormControl>
|
||||
<FormMessage />
|
||||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
<FormField
|
||||
control={form.control}
|
||||
name="description"
|
||||
render={({ field }) => (
|
||||
<FormItem>
|
||||
<FormLabel>Description</FormLabel>
|
||||
<FormControl>
|
||||
<Textarea {...field} placeholder="Description (optionnel)" />
|
||||
</FormControl>
|
||||
<FormMessage />
|
||||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
<FormField
|
||||
control={form.control}
|
||||
name="iconUrl"
|
||||
render={({ field }) => (
|
||||
<FormItem>
|
||||
<FormLabel>URL de l'icône</FormLabel>
|
||||
<FormControl>
|
||||
<Input {...field} placeholder="https://..." />
|
||||
</FormControl>
|
||||
<FormMessage />
|
||||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
<DialogFooter>
|
||||
<Button
|
||||
type="button"
|
||||
variant="outline"
|
||||
onClick={() => onOpenChange(false)}
|
||||
>
|
||||
Annuler
|
||||
</Button>
|
||||
<Button type="submit" disabled={loading}>
|
||||
{loading ? "Enregistrement..." : "Enregistrer"}
|
||||
</Button>
|
||||
</DialogFooter>
|
||||
</form>
|
||||
</Form>
|
||||
</DialogContent>
|
||||
</Dialog>
|
||||
);
|
||||
}
|
||||
@@ -1,6 +1,9 @@
|
||||
"use client";
|
||||
|
||||
import { useEffect, useState } from "react";
|
||||
import { Edit, Plus, Trash2 } from "lucide-react";
|
||||
import Image from "next/image";
|
||||
import { useCallback, useEffect, useState } from "react";
|
||||
import { Button } from "@/components/ui/button";
|
||||
import { Skeleton } from "@/components/ui/skeleton";
|
||||
import {
|
||||
Table,
|
||||
@@ -12,24 +15,57 @@ import {
|
||||
} from "@/components/ui/table";
|
||||
import { CategoryService } from "@/services/category.service";
|
||||
import type { Category } from "@/types/content";
|
||||
import { CategoryDialog } from "./category-dialog";
|
||||
|
||||
export default function AdminCategoriesPage() {
|
||||
const [categories, setCategories] = useState<Category[]>([]);
|
||||
const [loading, setLoading] = useState(true);
|
||||
const [dialogOpen, setDialogOpen] = useState(false);
|
||||
const [selectedCategory, setSelectedCategory] = useState<Category | null>(
|
||||
null,
|
||||
);
|
||||
|
||||
useEffect(() => {
|
||||
const fetchCategories = useCallback(() => {
|
||||
setLoading(true);
|
||||
CategoryService.getAll()
|
||||
.then(setCategories)
|
||||
.catch((err) => console.error(err))
|
||||
.finally(() => setLoading(false));
|
||||
}, []);
|
||||
|
||||
useEffect(() => {
|
||||
fetchCategories();
|
||||
}, [fetchCategories]);
|
||||
|
||||
const handleDelete = async (id: string) => {
|
||||
if (!confirm("Êtes-vous sûr de vouloir supprimer cette catégorie ?")) return;
|
||||
try {
|
||||
await CategoryService.remove(id);
|
||||
setCategories(categories.filter((c) => c.id !== id));
|
||||
} catch (error) {
|
||||
console.error(error);
|
||||
}
|
||||
};
|
||||
|
||||
const handleEdit = (category: Category) => {
|
||||
setSelectedCategory(category);
|
||||
setDialogOpen(true);
|
||||
};
|
||||
|
||||
const handleCreate = () => {
|
||||
setSelectedCategory(null);
|
||||
setDialogOpen(true);
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="flex-1 space-y-4 p-4 pt-6 md:p-8">
|
||||
<div className="flex items-center justify-between">
|
||||
<h2 className="text-3xl font-bold tracking-tight">
|
||||
Catégories ({categories.length})
|
||||
</h2>
|
||||
<Button onClick={handleCreate}>
|
||||
<Plus className="mr-2 h-4 w-4" /> Ajouter une catégorie
|
||||
</Button>
|
||||
</div>
|
||||
<div className="rounded-md border bg-card">
|
||||
<Table>
|
||||
@@ -38,6 +74,7 @@ export default function AdminCategoriesPage() {
|
||||
<TableHead>Nom</TableHead>
|
||||
<TableHead>Slug</TableHead>
|
||||
<TableHead>Description</TableHead>
|
||||
<TableHead className="w-[100px]"></TableHead>
|
||||
</TableRow>
|
||||
</TableHeader>
|
||||
<TableBody>
|
||||
@@ -54,11 +91,14 @@ export default function AdminCategoriesPage() {
|
||||
<TableCell>
|
||||
<Skeleton className="h-4 w-[250px]" />
|
||||
</TableCell>
|
||||
<TableCell>
|
||||
<Skeleton className="h-8 w-8 rounded-full" />
|
||||
</TableCell>
|
||||
</TableRow>
|
||||
))
|
||||
) : categories.length === 0 ? (
|
||||
<TableRow>
|
||||
<TableCell colSpan={3} className="text-center h-24">
|
||||
<TableCell colSpan={4} className="text-center h-24">
|
||||
Aucune catégorie trouvée.
|
||||
</TableCell>
|
||||
</TableRow>
|
||||
@@ -66,18 +106,55 @@ export default function AdminCategoriesPage() {
|
||||
categories.map((category) => (
|
||||
<TableRow key={category.id}>
|
||||
<TableCell className="font-medium whitespace-nowrap">
|
||||
{category.name}
|
||||
<div className="flex items-center gap-2">
|
||||
{category.iconUrl && (
|
||||
<div className="relative h-6 w-6">
|
||||
<Image
|
||||
src={category.iconUrl}
|
||||
alt=""
|
||||
fill
|
||||
className="rounded object-cover"
|
||||
/>
|
||||
</div>
|
||||
)}
|
||||
{category.name}
|
||||
</div>
|
||||
</TableCell>
|
||||
<TableCell className="whitespace-nowrap">{category.slug}</TableCell>
|
||||
<TableCell className="text-muted-foreground">
|
||||
{category.description || "Aucune description"}
|
||||
</TableCell>
|
||||
<TableCell>
|
||||
<div className="flex items-center gap-2">
|
||||
<Button
|
||||
variant="ghost"
|
||||
size="icon"
|
||||
onClick={() => handleEdit(category)}
|
||||
>
|
||||
<Edit className="h-4 w-4" />
|
||||
</Button>
|
||||
<Button
|
||||
variant="ghost"
|
||||
size="icon"
|
||||
onClick={() => handleDelete(category.id)}
|
||||
className="text-destructive hover:text-destructive hover:bg-destructive/10"
|
||||
>
|
||||
<Trash2 className="h-4 w-4" />
|
||||
</Button>
|
||||
</div>
|
||||
</TableCell>
|
||||
</TableRow>
|
||||
))
|
||||
)}
|
||||
</TableBody>
|
||||
</Table>
|
||||
</div>
|
||||
<CategoryDialog
|
||||
open={dialogOpen}
|
||||
onOpenChange={setDialogOpen}
|
||||
category={selectedCategory}
|
||||
onSuccess={fetchCategories}
|
||||
/>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -0,0 +1,155 @@
|
||||
"use client";
|
||||
|
||||
import { useEffect, useState } from "react";
|
||||
import { useForm } from "react-hook-form";
|
||||
import { Button } from "@/components/ui/button";
|
||||
import {
|
||||
Dialog,
|
||||
DialogContent,
|
||||
DialogFooter,
|
||||
DialogHeader,
|
||||
DialogTitle,
|
||||
} from "@/components/ui/dialog";
|
||||
import {
|
||||
Form,
|
||||
FormControl,
|
||||
FormField,
|
||||
FormItem,
|
||||
FormLabel,
|
||||
FormMessage,
|
||||
} from "@/components/ui/form";
|
||||
import { Input } from "@/components/ui/input";
|
||||
import {
|
||||
Select,
|
||||
SelectContent,
|
||||
SelectItem,
|
||||
SelectTrigger,
|
||||
SelectValue,
|
||||
} from "@/components/ui/select";
|
||||
import { CategoryService } from "@/services/category.service";
|
||||
import { ContentService } from "@/services/content.service";
|
||||
import type { Category, Content } from "@/types/content";
|
||||
|
||||
interface ContentEditDialogProps {
|
||||
content: Content | null;
|
||||
open: boolean;
|
||||
onOpenChange: (open: boolean) => void;
|
||||
onSuccess: () => void;
|
||||
}
|
||||
|
||||
export function ContentEditDialog({
|
||||
content,
|
||||
open,
|
||||
onOpenChange,
|
||||
onSuccess,
|
||||
}: ContentEditDialogProps) {
|
||||
const [loading, setLoading] = useState(false);
|
||||
const [categories, setCategories] = useState<Category[]>([]);
|
||||
|
||||
const form = useForm<{ title: string; categoryId: string }>({
|
||||
defaultValues: {
|
||||
title: "",
|
||||
categoryId: "",
|
||||
},
|
||||
});
|
||||
|
||||
useEffect(() => {
|
||||
CategoryService.getAll().then(setCategories).catch(console.error);
|
||||
}, []);
|
||||
|
||||
useEffect(() => {
|
||||
if (content) {
|
||||
form.reset({
|
||||
title: content.title,
|
||||
categoryId: content.categoryId || "none",
|
||||
});
|
||||
}
|
||||
}, [content, form]);
|
||||
|
||||
const onSubmit = async (values: { title: string; categoryId: string }) => {
|
||||
if (!content) return;
|
||||
setLoading(true);
|
||||
try {
|
||||
const data = {
|
||||
...values,
|
||||
categoryId: values.categoryId === "none" ? null : values.categoryId,
|
||||
};
|
||||
await ContentService.updateAdmin(content.id, data);
|
||||
onSuccess();
|
||||
onOpenChange(false);
|
||||
} catch (error) {
|
||||
console.error(error);
|
||||
} finally {
|
||||
setLoading(false);
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<Dialog open={open} onOpenChange={onOpenChange}>
|
||||
<DialogContent>
|
||||
<DialogHeader>
|
||||
<DialogTitle>Modifier le contenu</DialogTitle>
|
||||
</DialogHeader>
|
||||
<Form {...form}>
|
||||
<form onSubmit={form.handleSubmit(onSubmit)} className="space-y-4">
|
||||
<FormField
|
||||
control={form.control}
|
||||
name="title"
|
||||
rules={{ required: "Le titre est requis" }}
|
||||
render={({ field }) => (
|
||||
<FormItem>
|
||||
<FormLabel>Titre</FormLabel>
|
||||
<FormControl>
|
||||
<Input {...field} placeholder="Titre du contenu" />
|
||||
</FormControl>
|
||||
<FormMessage />
|
||||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
<FormField
|
||||
control={form.control}
|
||||
name="categoryId"
|
||||
render={({ field }) => (
|
||||
<FormItem>
|
||||
<FormLabel>Catégorie</FormLabel>
|
||||
<Select
|
||||
onValueChange={field.onChange}
|
||||
defaultValue={field.value}
|
||||
value={field.value}
|
||||
>
|
||||
<FormControl>
|
||||
<SelectTrigger>
|
||||
<SelectValue placeholder="Sélectionner une catégorie" />
|
||||
</SelectTrigger>
|
||||
</FormControl>
|
||||
<SelectContent>
|
||||
<SelectItem value="none">Sans catégorie</SelectItem>
|
||||
{categories.map((cat) => (
|
||||
<SelectItem key={cat.id} value={cat.id}>
|
||||
{cat.name}
|
||||
</SelectItem>
|
||||
))}
|
||||
</SelectContent>
|
||||
</Select>
|
||||
<FormMessage />
|
||||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
<DialogFooter>
|
||||
<Button
|
||||
type="button"
|
||||
variant="outline"
|
||||
onClick={() => onOpenChange(false)}
|
||||
>
|
||||
Annuler
|
||||
</Button>
|
||||
<Button type="submit" disabled={loading}>
|
||||
{loading ? "Enregistrement..." : "Enregistrer"}
|
||||
</Button>
|
||||
</DialogFooter>
|
||||
</form>
|
||||
</Form>
|
||||
</DialogContent>
|
||||
</Dialog>
|
||||
);
|
||||
}
|
||||
@@ -2,8 +2,15 @@
|
||||
|
||||
import { format } from "date-fns";
|
||||
import { fr } from "date-fns/locale";
|
||||
import { Download, Eye, Image as ImageIcon, Trash2, Video } from "lucide-react";
|
||||
import { useEffect, useState } from "react";
|
||||
import {
|
||||
Download,
|
||||
Edit,
|
||||
Eye,
|
||||
Image as ImageIcon,
|
||||
Trash2,
|
||||
Video,
|
||||
} from "lucide-react";
|
||||
import { useCallback, useEffect, useState } from "react";
|
||||
import { Badge } from "@/components/ui/badge";
|
||||
import { Button } from "@/components/ui/button";
|
||||
import { Skeleton } from "@/components/ui/skeleton";
|
||||
@@ -17,13 +24,17 @@ import {
|
||||
} from "@/components/ui/table";
|
||||
import { ContentService } from "@/services/content.service";
|
||||
import type { Content } from "@/types/content";
|
||||
import { ContentEditDialog } from "./content-edit-dialog";
|
||||
|
||||
export default function AdminContentsPage() {
|
||||
const [contents, setContents] = useState<Content[]>([]);
|
||||
const [loading, setLoading] = useState(true);
|
||||
const [totalCount, setTotalCount] = useState(0);
|
||||
const [selectedContent, setSelectedContent] = useState<Content | null>(null);
|
||||
const [dialogOpen, setDialogOpen] = useState(false);
|
||||
|
||||
useEffect(() => {
|
||||
const fetchContents = useCallback(() => {
|
||||
setLoading(true);
|
||||
ContentService.getExplore({ limit: 20 })
|
||||
.then((res) => {
|
||||
setContents(res.data);
|
||||
@@ -33,6 +44,10 @@ export default function AdminContentsPage() {
|
||||
.finally(() => setLoading(false));
|
||||
}, []);
|
||||
|
||||
useEffect(() => {
|
||||
fetchContents();
|
||||
}, [fetchContents]);
|
||||
|
||||
const handleDelete = async (id: string) => {
|
||||
if (!confirm("Êtes-vous sûr de vouloir supprimer ce contenu ?")) return;
|
||||
|
||||
@@ -45,6 +60,11 @@ export default function AdminContentsPage() {
|
||||
}
|
||||
};
|
||||
|
||||
const handleEdit = (content: Content) => {
|
||||
setSelectedContent(content);
|
||||
setDialogOpen(true);
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="flex-1 space-y-4 p-4 pt-6 md:p-8">
|
||||
<div className="flex items-center justify-between">
|
||||
@@ -61,7 +81,7 @@ export default function AdminContentsPage() {
|
||||
<TableHead>Auteur</TableHead>
|
||||
<TableHead>Stats</TableHead>
|
||||
<TableHead>Date</TableHead>
|
||||
<TableHead className="w-[50px]"></TableHead>
|
||||
<TableHead className="w-[100px]"></TableHead>
|
||||
</TableRow>
|
||||
</TableHeader>
|
||||
<TableBody>
|
||||
@@ -84,11 +104,14 @@ export default function AdminContentsPage() {
|
||||
<TableCell>
|
||||
<Skeleton className="h-4 w-[100px]" />
|
||||
</TableCell>
|
||||
<TableCell>
|
||||
<Skeleton className="h-8 w-8 rounded-full" />
|
||||
</TableCell>
|
||||
</TableRow>
|
||||
))
|
||||
) : contents.length === 0 ? (
|
||||
<TableRow>
|
||||
<TableCell colSpan={5} className="text-center h-24">
|
||||
<TableCell colSpan={6} className="text-center h-24">
|
||||
Aucun contenu trouvé.
|
||||
</TableCell>
|
||||
</TableRow>
|
||||
@@ -132,14 +155,23 @@ export default function AdminContentsPage() {
|
||||
{format(new Date(content.createdAt), "dd/MM/yyyy", { locale: fr })}
|
||||
</TableCell>
|
||||
<TableCell>
|
||||
<Button
|
||||
variant="ghost"
|
||||
size="icon"
|
||||
onClick={() => handleDelete(content.id)}
|
||||
className="text-destructive hover:text-destructive hover:bg-destructive/10"
|
||||
>
|
||||
<Trash2 className="h-4 w-4" />
|
||||
</Button>
|
||||
<div className="flex items-center gap-2">
|
||||
<Button
|
||||
variant="ghost"
|
||||
size="icon"
|
||||
onClick={() => handleEdit(content)}
|
||||
>
|
||||
<Edit className="h-4 w-4" />
|
||||
</Button>
|
||||
<Button
|
||||
variant="ghost"
|
||||
size="icon"
|
||||
onClick={() => handleDelete(content.id)}
|
||||
className="text-destructive hover:text-destructive hover:bg-destructive/10"
|
||||
>
|
||||
<Trash2 className="h-4 w-4" />
|
||||
</Button>
|
||||
</div>
|
||||
</TableCell>
|
||||
</TableRow>
|
||||
))
|
||||
@@ -147,6 +179,12 @@ export default function AdminContentsPage() {
|
||||
</TableBody>
|
||||
</Table>
|
||||
</div>
|
||||
<ContentEditDialog
|
||||
content={selectedContent}
|
||||
open={dialogOpen}
|
||||
onOpenChange={setDialogOpen}
|
||||
onSuccess={fetchContents}
|
||||
/>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -2,8 +2,8 @@
|
||||
|
||||
import { format } from "date-fns";
|
||||
import { fr } from "date-fns/locale";
|
||||
import { Trash2 } from "lucide-react";
|
||||
import { useEffect, useState } from "react";
|
||||
import { Edit, Trash2 } from "lucide-react";
|
||||
import { useCallback, useEffect, useState } from "react";
|
||||
import { Badge } from "@/components/ui/badge";
|
||||
import { Button } from "@/components/ui/button";
|
||||
import { Skeleton } from "@/components/ui/skeleton";
|
||||
@@ -17,13 +17,17 @@ import {
|
||||
} from "@/components/ui/table";
|
||||
import { UserService } from "@/services/user.service";
|
||||
import type { User } from "@/types/user";
|
||||
import { UserEditDialog } from "./user-edit-dialog";
|
||||
|
||||
export default function AdminUsersPage() {
|
||||
const [users, setUsers] = useState<User[]>([]);
|
||||
const [loading, setLoading] = useState(true);
|
||||
const [totalCount, setTotalCount] = useState(0);
|
||||
const [selectedUser, setSelectedUser] = useState<User | null>(null);
|
||||
const [dialogOpen, setDialogOpen] = useState(false);
|
||||
|
||||
useEffect(() => {
|
||||
const fetchUsers = useCallback(() => {
|
||||
setLoading(true);
|
||||
UserService.getUsersAdmin()
|
||||
.then((res) => {
|
||||
setUsers(res.data);
|
||||
@@ -35,6 +39,10 @@ export default function AdminUsersPage() {
|
||||
.finally(() => setLoading(false));
|
||||
}, []);
|
||||
|
||||
useEffect(() => {
|
||||
fetchUsers();
|
||||
}, [fetchUsers]);
|
||||
|
||||
const handleDelete = async (uuid: string) => {
|
||||
if (
|
||||
!confirm(
|
||||
@@ -52,6 +60,11 @@ export default function AdminUsersPage() {
|
||||
}
|
||||
};
|
||||
|
||||
const handleEdit = (user: User) => {
|
||||
setSelectedUser(user);
|
||||
setDialogOpen(true);
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="flex-1 space-y-4 p-4 pt-6 md:p-8">
|
||||
<div className="flex items-center justify-between">
|
||||
@@ -68,7 +81,7 @@ export default function AdminUsersPage() {
|
||||
<TableHead>Rôle</TableHead>
|
||||
<TableHead>Status</TableHead>
|
||||
<TableHead>Date d'inscription</TableHead>
|
||||
<TableHead className="w-[50px]"></TableHead>
|
||||
<TableHead className="w-[100px]"></TableHead>
|
||||
</TableRow>
|
||||
</TableHeader>
|
||||
<TableBody>
|
||||
@@ -91,11 +104,14 @@ export default function AdminUsersPage() {
|
||||
<TableCell>
|
||||
<Skeleton className="h-4 w-[100px]" />
|
||||
</TableCell>
|
||||
<TableCell>
|
||||
<Skeleton className="h-8 w-8 rounded-full" />
|
||||
</TableCell>
|
||||
</TableRow>
|
||||
))
|
||||
) : users.length === 0 ? (
|
||||
<TableRow>
|
||||
<TableCell colSpan={5} className="text-center h-24">
|
||||
<TableCell colSpan={6} className="text-center h-24">
|
||||
Aucun utilisateur trouvé.
|
||||
</TableCell>
|
||||
</TableRow>
|
||||
@@ -113,7 +129,15 @@ export default function AdminUsersPage() {
|
||||
</Badge>
|
||||
</TableCell>
|
||||
<TableCell>
|
||||
<Badge variant={user.status === "active" ? "success" : "destructive"}>
|
||||
<Badge
|
||||
variant={
|
||||
user.status === "active"
|
||||
? "success"
|
||||
: user.status === "suspended"
|
||||
? "destructive"
|
||||
: "secondary"
|
||||
}
|
||||
>
|
||||
{user.status}
|
||||
</Badge>
|
||||
</TableCell>
|
||||
@@ -121,14 +145,19 @@ export default function AdminUsersPage() {
|
||||
{format(new Date(user.createdAt), "PPP", { locale: fr })}
|
||||
</TableCell>
|
||||
<TableCell>
|
||||
<Button
|
||||
variant="ghost"
|
||||
size="icon"
|
||||
onClick={() => handleDelete(user.uuid)}
|
||||
className="text-destructive hover:text-destructive hover:bg-destructive/10"
|
||||
>
|
||||
<Trash2 className="h-4 w-4" />
|
||||
</Button>
|
||||
<div className="flex items-center gap-2">
|
||||
<Button variant="ghost" size="icon" onClick={() => handleEdit(user)}>
|
||||
<Edit className="h-4 w-4" />
|
||||
</Button>
|
||||
<Button
|
||||
variant="ghost"
|
||||
size="icon"
|
||||
onClick={() => handleDelete(user.uuid)}
|
||||
className="text-destructive hover:text-destructive hover:bg-destructive/10"
|
||||
>
|
||||
<Trash2 className="h-4 w-4" />
|
||||
</Button>
|
||||
</div>
|
||||
</TableCell>
|
||||
</TableRow>
|
||||
))
|
||||
@@ -136,6 +165,12 @@ export default function AdminUsersPage() {
|
||||
</TableBody>
|
||||
</Table>
|
||||
</div>
|
||||
<UserEditDialog
|
||||
user={selectedUser}
|
||||
open={dialogOpen}
|
||||
onOpenChange={setDialogOpen}
|
||||
onSuccess={fetchUsers}
|
||||
/>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
153
frontend/src/app/(dashboard)/admin/users/user-edit-dialog.tsx
Normal file
153
frontend/src/app/(dashboard)/admin/users/user-edit-dialog.tsx
Normal file
@@ -0,0 +1,153 @@
|
||||
"use client";
|
||||
|
||||
import { useEffect, useState } from "react";
|
||||
import { useForm } from "react-hook-form";
|
||||
import { Button } from "@/components/ui/button";
|
||||
import {
|
||||
Dialog,
|
||||
DialogContent,
|
||||
DialogFooter,
|
||||
DialogHeader,
|
||||
DialogTitle,
|
||||
} from "@/components/ui/dialog";
|
||||
import {
|
||||
Form,
|
||||
FormControl,
|
||||
FormField,
|
||||
FormItem,
|
||||
FormLabel,
|
||||
FormMessage,
|
||||
} from "@/components/ui/form";
|
||||
import {
|
||||
Select,
|
||||
SelectContent,
|
||||
SelectItem,
|
||||
SelectTrigger,
|
||||
SelectValue,
|
||||
} from "@/components/ui/select";
|
||||
import { UserService } from "@/services/user.service";
|
||||
import type { User } from "@/types/user";
|
||||
|
||||
interface UserEditDialogProps {
|
||||
user: User | null;
|
||||
open: boolean;
|
||||
onOpenChange: (open: boolean) => void;
|
||||
onSuccess: () => void;
|
||||
}
|
||||
|
||||
export function UserEditDialog({
|
||||
user,
|
||||
open,
|
||||
onOpenChange,
|
||||
onSuccess,
|
||||
}: UserEditDialogProps) {
|
||||
const [loading, setLoading] = useState(false);
|
||||
|
||||
const form = useForm<Partial<User>>({
|
||||
defaultValues: {
|
||||
role: "user",
|
||||
status: "active",
|
||||
},
|
||||
});
|
||||
|
||||
useEffect(() => {
|
||||
if (user) {
|
||||
form.reset({
|
||||
role: user.role || "user",
|
||||
status: user.status || "active",
|
||||
});
|
||||
}
|
||||
}, [user, form]);
|
||||
|
||||
const onSubmit = async (values: Partial<User>) => {
|
||||
if (!user) return;
|
||||
setLoading(true);
|
||||
try {
|
||||
await UserService.updateAdmin(user.uuid, values);
|
||||
onSuccess();
|
||||
onOpenChange(false);
|
||||
} catch (error) {
|
||||
console.error(error);
|
||||
} finally {
|
||||
setLoading(false);
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<Dialog open={open} onOpenChange={onOpenChange}>
|
||||
<DialogContent>
|
||||
<DialogHeader>
|
||||
<DialogTitle>Modifier l'utilisateur @{user?.username}</DialogTitle>
|
||||
</DialogHeader>
|
||||
<Form {...form}>
|
||||
<form onSubmit={form.handleSubmit(onSubmit)} className="space-y-4">
|
||||
<FormField
|
||||
control={form.control}
|
||||
name="role"
|
||||
render={({ field }) => (
|
||||
<FormItem>
|
||||
<FormLabel>Rôle</FormLabel>
|
||||
<Select
|
||||
onValueChange={field.onChange}
|
||||
defaultValue={field.value}
|
||||
value={field.value}
|
||||
>
|
||||
<FormControl>
|
||||
<SelectTrigger>
|
||||
<SelectValue placeholder="Sélectionner un rôle" />
|
||||
</SelectTrigger>
|
||||
</FormControl>
|
||||
<SelectContent>
|
||||
<SelectItem value="user">Utilisateur</SelectItem>
|
||||
<SelectItem value="moderator">Modérateur</SelectItem>
|
||||
<SelectItem value="admin">Administrateur</SelectItem>
|
||||
</SelectContent>
|
||||
</Select>
|
||||
<FormMessage />
|
||||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
<FormField
|
||||
control={form.control}
|
||||
name="status"
|
||||
render={({ field }) => (
|
||||
<FormItem>
|
||||
<FormLabel>Statut</FormLabel>
|
||||
<Select
|
||||
onValueChange={field.onChange}
|
||||
defaultValue={field.value}
|
||||
value={field.value}
|
||||
>
|
||||
<FormControl>
|
||||
<SelectTrigger>
|
||||
<SelectValue placeholder="Sélectionner un statut" />
|
||||
</SelectTrigger>
|
||||
</FormControl>
|
||||
<SelectContent>
|
||||
<SelectItem value="active">Actif</SelectItem>
|
||||
<SelectItem value="suspended">Suspendu</SelectItem>
|
||||
<SelectItem value="pending">En attente</SelectItem>
|
||||
</SelectContent>
|
||||
</Select>
|
||||
<FormMessage />
|
||||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
<DialogFooter>
|
||||
<Button
|
||||
type="button"
|
||||
variant="outline"
|
||||
onClick={() => onOpenChange(false)}
|
||||
>
|
||||
Annuler
|
||||
</Button>
|
||||
<Button type="submit" disabled={loading}>
|
||||
{loading ? "Enregistrement..." : "Enregistrer"}
|
||||
</Button>
|
||||
</DialogFooter>
|
||||
</form>
|
||||
</Form>
|
||||
</DialogContent>
|
||||
</Dialog>
|
||||
);
|
||||
}
|
||||
@@ -11,4 +11,18 @@ export const CategoryService = {
|
||||
const { data } = await api.get<Category>(`/categories/${id}`);
|
||||
return data;
|
||||
},
|
||||
|
||||
async create(category: Partial<Category>): Promise<Category> {
|
||||
const { data } = await api.post<Category>("/categories", category);
|
||||
return data;
|
||||
},
|
||||
|
||||
async update(id: string, category: Partial<Category>): Promise<Category> {
|
||||
const { data } = await api.patch<Category>(`/categories/${id}`, category);
|
||||
return data;
|
||||
},
|
||||
|
||||
async remove(id: string): Promise<void> {
|
||||
await api.delete(`/categories/${id}`);
|
||||
},
|
||||
};
|
||||
|
||||
@@ -65,4 +65,9 @@ export const ContentService = {
|
||||
async removeAdmin(id: string): Promise<void> {
|
||||
await api.delete(`/contents/${id}/admin`);
|
||||
},
|
||||
|
||||
async updateAdmin(id: string, update: Partial<Content>): Promise<Content> {
|
||||
const { data } = await api.patch<Content>(`/contents/${id}/admin`, update);
|
||||
return data;
|
||||
},
|
||||
};
|
||||
|
||||
@@ -34,6 +34,11 @@ export const UserService = {
|
||||
await api.delete(`/users/${uuid}`);
|
||||
},
|
||||
|
||||
async updateAdmin(uuid: string, update: Partial<User>): Promise<User> {
|
||||
const { data } = await api.patch<User>(`/users/admin/${uuid}`, update);
|
||||
return data;
|
||||
},
|
||||
|
||||
async updateAvatar(file: File): Promise<User> {
|
||||
const formData = new FormData();
|
||||
formData.append("file", file);
|
||||
|
||||
@@ -18,6 +18,7 @@ export interface Content {
|
||||
favoritesCount: number;
|
||||
isLiked?: boolean;
|
||||
tags: (string | Tag)[];
|
||||
categoryId?: string | null;
|
||||
category?: Category;
|
||||
authorId: string;
|
||||
author: User;
|
||||
@@ -36,6 +37,7 @@ export interface Category {
|
||||
name: string;
|
||||
slug: string;
|
||||
description?: string;
|
||||
iconUrl?: string;
|
||||
}
|
||||
|
||||
export interface PaginatedResponse<T> {
|
||||
|
||||
@@ -6,7 +6,7 @@ export interface User {
|
||||
displayName?: string;
|
||||
avatarUrl?: string;
|
||||
bio?: string;
|
||||
role?: "user" | "admin";
|
||||
role?: "user" | "admin" | "moderator";
|
||||
status?: "active" | "verification" | "suspended" | "pending" | "deleted";
|
||||
createdAt: string;
|
||||
}
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "@memegoat/source",
|
||||
"version": "1.1.1",
|
||||
"version": "1.3.0",
|
||||
"description": "",
|
||||
"scripts": {
|
||||
"version:get": "cmake -P version.cmake GET",
|
||||
@@ -13,9 +13,13 @@
|
||||
"build:back": "pnpm run -F @memegoat/backend build",
|
||||
"build:docs": "pnpm run -F @memegoat/documentation build",
|
||||
"lint": "pnpm run lint:back && pnpm run lint:front && pnpm run lint:docs",
|
||||
"lint:fix": "pnpm run lint:back:fix && pnpm run lint:front:fix && pnpm run lint:docs:fix",
|
||||
"lint:back": "pnpm run -F @memegoat/backend lint",
|
||||
"lint:back:fix": "pnpm run -F @memegoat/backend lint:write",
|
||||
"lint:front": "pnpm run -F @memegoat/frontend lint",
|
||||
"lint:front:fix": "pnpm run -F @memegoat/frontend lint:write",
|
||||
"lint:docs": "pnpm run -F @memegoat/documentation lint",
|
||||
"lint:docs:fix": "pnpm run -F @memegoat/documentation lint:write",
|
||||
"test": "pnpm run test:back && pnpm run test:front",
|
||||
"test:back": "pnpm run -F @memegoat/backend test",
|
||||
"test:front": "pnpm run -F @memegoat/frontend test",
|
||||
|
||||
Reference in New Issue
Block a user