port-nimara-client-portal/docs/minio-file-browser.md

MinIO File Browser Integration

This document describes the MinIO S3-compatible file browser integration in the Port Nimara Client Portal.

Features

• File Management: Upload, download, delete, and view files
• Folder Organization: Create and navigate folder structures
• File Preview: View images and PDFs directly in the browser
• Search: Quick file search functionality
• Audit Logging: Track all file operations with user information
• Drag & Drop: Easy file uploads with drag and drop support
• Size Limit: 50MB maximum file size per upload

Configuration

Environment Variables

Add the following to your .env file:

NUXT_MINIO_ACCESS_KEY=your-minio-access-key
NUXT_MINIO_SECRET_KEY=your-minio-secret-key

MinIO Settings

The MinIO configuration is set in nuxt.config.ts:

minio: {
  endPoint: "s3.portnimara.com",
  port: 9000,
  useSSL: true,
  bucketName: "client-portal",
}

File Structure

server/
├── api/
│   └── files/
│       ├── list.ts         # List files and folders
│       ├── upload.ts       # Upload files
│       ├── download.ts     # Generate download URLs
│       ├── delete.ts       # Delete files/folders
│       ├── create-folder.ts # Create new folders
│       └── preview.ts      # Generate preview URLs
├── utils/
│   └── minio.ts           # MinIO client utilities

pages/
└── dashboard/
    └── file-browser.vue   # Main file browser page

components/
├── FileUploader.vue       # File upload component
└── FilePreviewModal.vue   # File preview modal

API Endpoints

List Files

• GET /api/files/list
• Query params: prefix (folder path), recursive (boolean)

Upload Files

• POST /api/files/upload
• Body: FormData with files
• Query params: path (current folder)

Download File

• GET /api/files/download
• Query params: fileName

Delete File/Folder

• POST /api/files/delete
• Body: { fileName, isFolder }

Create Folder

• POST /api/files/create-folder
• Body: { folderPath }

Preview File

• GET /api/files/preview
• Query params: fileName

Usage

1. Navigate to "File Browser" from the dashboard menu
2. Use the interface to:
   • Upload files by dragging or clicking "Upload Files"
   • Create folders with "New Folder" button
   • Navigate folders by clicking on them
   • Preview images and PDFs by clicking the eye icon
   • Download files with the download icon
   • Delete files/folders with the delete icon

Audit Logging

All file operations are logged with:

• User email
• Action type (upload, download, delete, create_folder)
• File path
• Timestamp
• IP address
• Success status

Currently logs to console, but can be easily integrated with your database.

Security

• All operations require authentication
• File names are sanitized to prevent security issues
• Presigned URLs expire after 1 hour
• 50MB file size limit enforced

Supported File Types

All file types are supported for upload/download. Preview is available for:

• Images: JPG, JPEG, PNG, GIF, SVG, WebP
• Documents: PDF

Future Enhancements

• Database storage for audit logs
• File sharing with expiration
• Bulk operations
• File versioning
• Integration with Interest management (link files to specific interests)