Styled Container - Copy this React, Mui Component to your project
Photo Album Manager 1. Mục Tiêu Xây dựng một hệ thống quản lý album ảnh với giao diện admin hiện đại, tập trung vào hai chức năng chính: Quản lý lưu trữ (Enhanced Storage Manager) Quản lý thùng rác (Server Trash) 2. Yêu Cầu Chức Năng 2.1. Enhanced Storage Manager Giao Diện Chính: Hiển thị tổng quan về dung lượng lưu trữ Bảng quản lý với các cột: Tên thư mục, Kích thước, Ngày tạo, Thao tác Hỗ trợ phân trang và tìm kiếm Chức Năng: Xem chi tiết dung lượng từng thư mục Xóa nhiều mục cùng lúc (batch delete) Dọn dẹp storage tự động Hiển thị cảnh báo khi dung lượng gần đầy Tối Ưu Hiệu Suất: Lazy loading cho danh sách dài Cache dữ liệu thường xuyên truy cập Xử lý bất đồng bộ cho các thao tác nặng 2.2. Server Trash Giao Diện: Hiển thị danh sách album đã xóa dạng grid Mỗi album hiển thị: Ảnh bìa, tên, số lượng ảnh, ngày xóa Thanh công cụ với các thao tác hàng loạt Chức Năng: Khôi phục album (đơn lẻ/hàng loạt) Xóa vĩnh viễn (đơn lẻ/hàng loạt) Tự động xóa sau 30 ngày Tìm kiếm và lọc album trong thùng rác 3. Yêu Cầu Kỹ Thuật 3.1. Frontend Công Nghệ: Next.js cho SSR Material UI cho giao diện React Query cho quản lý state UI/UX: Responsive trên mọi thiết bị Loading states rõ ràng Thông báo kết quả thao tác Xác nhận các thao tác quan trọng 3.2. Backend API Endpoints: /api/storage/stats: Thống kê dung lượng /api/storage/cleanup: Dọn dẹp storage /api/albums/trash: Quản lý thùng rác Xử Lý Storage: Soft delete cho album và ảnh Cơ chế backup trước khi xóa Tối ưu không gian lưu trữ 3.3. Database Cấu Trúc: Bảng albums: Thêm trường deleted_at, is_deleted Bảng storage_stats: Lưu thống kê dung lượng Indexes: Optimize cho truy vấn thùng rác Index cho tìm kiếm và sắp xếp 4. Bảo Mật Xác thực JWT cho mọi API Phân quyền theo user Validate input/output Rate limiting cho API calls 5. Monitoring Log các thao tác xóa/khôi phục Theo dõi dung lượng storage Cảnh báo khi gần đầy Track performance metrics 6. Testing Unit tests cho core functions Integration tests cho API E2E tests cho UI flows Performance testing 7. Documentation API documentation Deployment guide User manual Troubleshooting guide 8. Deployment CI/CD pipeline Backup strategy Rollback plan Performance monitoring
