feat: integrate MinIO for file storage and management
- Added MinIO as a dependency in package.json. - Updated FilePreview component to simplify file type checks. - Refactored file removal API to delete files from MinIO instead of the filesystem. - Modified file serving API to fetch files from MinIO. - Changed file upload API to upload files directly to MinIO and store metadata in the database. - Enhanced environment configuration to include MinIO settings. - Updated file type utility to handle file extensions more robustly. - Created a new utility for MinIO client configuration and bucket management.
This commit is contained in:
@@ -12,6 +12,8 @@ export function FilePreview({ fileId, fileType }: FilePreviewProps) {
|
||||
const [mediaSrc, setMediaSrc] = useState<string | null>(null);
|
||||
const [error, setError] = useState<string | null>(null);
|
||||
|
||||
console.log("File Type:", fileType);
|
||||
|
||||
useEffect(() => {
|
||||
if (!fileId) {
|
||||
setError("File ID is required.");
|
||||
@@ -53,7 +55,7 @@ export function FilePreview({ fileId, fileType }: FilePreviewProps) {
|
||||
return <div>Loading...</div>;
|
||||
}
|
||||
|
||||
if (getFileType(fileType).startsWith("video")) {
|
||||
if (fileType.startsWith("video")) {
|
||||
return (
|
||||
<video
|
||||
controls
|
||||
@@ -64,7 +66,7 @@ export function FilePreview({ fileId, fileType }: FilePreviewProps) {
|
||||
</video>
|
||||
);
|
||||
}
|
||||
if (getFileType(fileType).startsWith("audio")) {
|
||||
if (fileType.startsWith("audio")) {
|
||||
return (
|
||||
<audio
|
||||
controls
|
||||
@@ -75,29 +77,31 @@ export function FilePreview({ fileId, fileType }: FilePreviewProps) {
|
||||
</audio>
|
||||
);
|
||||
}
|
||||
if (getFileType(fileType).startsWith("image")) {
|
||||
if (fileType.startsWith("image")) {
|
||||
return <img src={mediaSrc} alt="Media preview" className="max-w-full max-h-96 rounded-lg shadow-md" />;
|
||||
}
|
||||
|
||||
if (getFileType(fileType).startsWith("text")) {
|
||||
if (fileType.startsWith("text")) {
|
||||
return (
|
||||
<img src="/icons/files/text.svg" alt="Text file preview" className="max-w-full max-h-96 rounded-lg invert" />
|
||||
);
|
||||
}
|
||||
if (getFileType(fileType).startsWith("archive")) {
|
||||
if (fileType.startsWith("archive")) {
|
||||
return (
|
||||
<img src="/icons/files/archive.svg" alt="Archive file preview" className="max-w-full max-h-96 rounded-lg invert" />
|
||||
);
|
||||
}
|
||||
if (getFileType(fileType).startsWith("code") || getFileType(fileType).startsWith("markdown")) {
|
||||
if (fileType.startsWith("code") || fileType.startsWith("markdown")) {
|
||||
return (
|
||||
<img src="/icons/files/code.svg" alt="Code file preview" className="max-w-full max-h-96 rounded-lg invert" />
|
||||
);
|
||||
}
|
||||
// if (getFileType(fileType).startsWith("markdown")) {
|
||||
// if (fileType.startsWith("markdown")) {
|
||||
// return;
|
||||
// }
|
||||
|
||||
// log file type
|
||||
console.log("Unsupported file type:", fileType);
|
||||
|
||||
return;
|
||||
}
|
||||
@@ -1,13 +1,11 @@
|
||||
import { NextResponse } from "next/server";
|
||||
import { db } from "~/server/db";
|
||||
import { auth } from "~/server/auth";
|
||||
import path from "path";
|
||||
import { promises as fs } from "fs";
|
||||
import { minioClient } from "~/utils/minioClient";
|
||||
import { notifyClients } from "~/utils/notifyClients";
|
||||
|
||||
export async function DELETE(req: Request) {
|
||||
const session = await auth();
|
||||
|
||||
if (!session?.user) {
|
||||
return NextResponse.json({ error: "Unauthorized" }, { status: 401 });
|
||||
}
|
||||
@@ -18,32 +16,25 @@ export async function DELETE(req: Request) {
|
||||
return NextResponse.json({ error: "Invalid request body" }, { status: 400 });
|
||||
}
|
||||
|
||||
const resource = await db.file.findUnique({
|
||||
where: { id: body.id },
|
||||
});
|
||||
|
||||
if (!resource) {
|
||||
const file = await db.file.findUnique({ where: { id: body.id } });
|
||||
if (!file) {
|
||||
return NextResponse.json({ error: "File not found" }, { status: 404 });
|
||||
}
|
||||
|
||||
if (resource.uploadedById !== session.user.id) {
|
||||
if (file.uploadedById !== session.user.id) {
|
||||
return NextResponse.json({ error: "You are not authorized to delete this file" }, { status: 403 });
|
||||
}
|
||||
|
||||
const filePath = path.join(process.cwd(), "uploads", path.basename(body.id));
|
||||
await fs.unlink(filePath).catch((err) => {
|
||||
console.error("Error deleting file from filesystem:", err);
|
||||
});
|
||||
const objectName = `${file.id}-${file.name}`;
|
||||
await minioClient.removeObject(process.env.MINIO_BUCKET || "file-hosting", objectName);
|
||||
|
||||
await db.file.delete({
|
||||
where: { id: body.id },
|
||||
});
|
||||
await db.file.delete({ where: { id: body.id } });
|
||||
|
||||
notifyClients({ type: "file-removed", fileId: body.id });
|
||||
|
||||
return NextResponse.json({ message: "File deleted successfully" });
|
||||
} catch (error) {
|
||||
console.error("Error deleting file:", error);
|
||||
console.error("Error deleting file from MinIO:", error);
|
||||
return NextResponse.json({ error: "Failed to delete file" }, { status: 500 });
|
||||
}
|
||||
}
|
||||
@@ -1,7 +1,6 @@
|
||||
import { NextResponse } from "next/server";
|
||||
import path from "path";
|
||||
import { promises as fs } from "fs";
|
||||
import { db } from "~/server/db";
|
||||
import { minioClient } from "~/utils/minioClient";
|
||||
import { getFileType } from "~/utils/fileType";
|
||||
|
||||
export async function GET(req: Request) {
|
||||
@@ -22,24 +21,31 @@ export async function GET(req: Request) {
|
||||
return NextResponse.json({ error: "File not found" }, { status: 404 });
|
||||
}
|
||||
|
||||
// Construct the file path
|
||||
const filePath = path.join(process.cwd(), "uploads", file.id);
|
||||
const bucketName = process.env.MINIO_BUCKET || "file-hosting";
|
||||
const objectName = `${file.id}-${file.name}`; // Construct the object name in MinIO
|
||||
|
||||
// Read the file from the filesystem
|
||||
const fileBuffer = await fs.readFile(filePath);
|
||||
|
||||
const mimeType = getFileType(path.extname(file.name)); // Get the MIME type based on the file extension
|
||||
// Fetch the file from MinIO
|
||||
const stream = await minioClient.getObject(bucketName, objectName);
|
||||
|
||||
const mimeType = getFileType(file.name); // Get the MIME type based on the file extension
|
||||
|
||||
// Return the file as a binary response
|
||||
return new Response(fileBuffer, {
|
||||
const readableStream = new ReadableStream({
|
||||
start(controller) {
|
||||
stream.on("data", (chunk) => controller.enqueue(chunk));
|
||||
stream.on("end", () => controller.close());
|
||||
stream.on("error", (err) => controller.error(err));
|
||||
},
|
||||
});
|
||||
|
||||
return new Response(readableStream, {
|
||||
headers: {
|
||||
"Content-Type": mimeType,
|
||||
"Content-Disposition": `inline; filename="${file.name}"`,
|
||||
},
|
||||
});
|
||||
} catch (error) {
|
||||
console.error("Error fetching file:", error);
|
||||
console.error("Error fetching file from MinIO:", error);
|
||||
return NextResponse.json({ error: "Failed to fetch file" }, { status: 500 });
|
||||
}
|
||||
}
|
||||
+19
-42
@@ -1,12 +1,10 @@
|
||||
import { NextResponse } from "next/server";
|
||||
import { promises as fs } from "fs";
|
||||
import path from "path";
|
||||
import { db } from "~/server/db";
|
||||
import { auth } from "~/server/auth";
|
||||
import Busboy from "busboy";
|
||||
import { Readable } from "stream";
|
||||
import { notifyClients } from "~/utils/notifyClients";
|
||||
import crypto from "crypto";
|
||||
import { db } from "~/server/db";
|
||||
import { auth } from "~/server/auth";
|
||||
import { minioClient, ensureBucketExists } from "~/utils/minioClient";
|
||||
|
||||
export const config = {
|
||||
api: {
|
||||
@@ -16,15 +14,12 @@ export const config = {
|
||||
|
||||
export async function POST(req: Request) {
|
||||
const session = await auth();
|
||||
// generate id for the file
|
||||
const guid = crypto.randomUUID();
|
||||
|
||||
if (!session?.user) {
|
||||
return NextResponse.json({ error: "Unauthorized" }, { status: 401 });
|
||||
}
|
||||
|
||||
const uploadDir = path.join(process.cwd(), "uploads");
|
||||
await fs.mkdir(uploadDir, { recursive: true });
|
||||
const bucketName = process.env.MINIO_BUCKET || "file-hosting";
|
||||
await ensureBucketExists(bucketName);
|
||||
|
||||
return new Promise<Response>((resolve, reject) => {
|
||||
const busboy = Busboy({ headers: { "content-type": req.headers.get("content-type") ?? "" } });
|
||||
@@ -35,57 +30,39 @@ export async function POST(req: Request) {
|
||||
fileName = info.filename || "uploaded-file";
|
||||
const chunks: Buffer[] = [];
|
||||
|
||||
// Check if a file with the same name already exists for the user
|
||||
const existingFile = await db.file.findFirst({
|
||||
where: {
|
||||
name: fileName,
|
||||
uploadedById: session.user.id,
|
||||
},
|
||||
});
|
||||
|
||||
if (existingFile) {
|
||||
// Modify the file name to make it unique
|
||||
const fileExtension = path.extname(fileName);
|
||||
const baseName = path.basename(fileName, fileExtension);
|
||||
fileName = `${baseName}-${Date.now()}${fileExtension}`;
|
||||
}
|
||||
|
||||
file.on("data", (chunk) => {
|
||||
chunks.push(chunk);
|
||||
});
|
||||
|
||||
file.on("end", () => {
|
||||
file.on("end", async () => {
|
||||
fileBuffer = Buffer.concat(chunks);
|
||||
});
|
||||
});
|
||||
|
||||
busboy.on("finish", () => {
|
||||
void (async () => {
|
||||
// Generate a unique ID for the file
|
||||
const fileId = crypto.randomUUID();
|
||||
const objectName = `${fileId}-${fileName}`;
|
||||
|
||||
try {
|
||||
const filePath = path.join(uploadDir, guid);
|
||||
await fs.writeFile(filePath, fileBuffer);
|
||||
// Upload the file to MinIO
|
||||
await minioClient.putObject(bucketName, objectName, fileBuffer);
|
||||
|
||||
// Save file metadata to the database
|
||||
const newFile = await db.file.create({
|
||||
data: {
|
||||
id: guid,
|
||||
url: `/share?id=${guid}`,
|
||||
id: fileId,
|
||||
url: `/share?id=${fileId}`,
|
||||
name: fileName,
|
||||
size: fileBuffer.length,
|
||||
extension: path.extname(fileName),
|
||||
extension: info.mimeType,
|
||||
uploadedById: session.user.id,
|
||||
},
|
||||
});
|
||||
|
||||
// Notify clients about the new file
|
||||
notifyClients({ type: "file-added", file: newFile });
|
||||
|
||||
resolve(NextResponse.json({ message: "File uploaded successfully" }));
|
||||
resolve(NextResponse.json({ message: "File uploaded successfully", file: newFile }));
|
||||
} catch (error) {
|
||||
console.error("Error handling upload:", error);
|
||||
resolve(NextResponse.json({ error: "Failed to upload file" }, { status: 500 }));
|
||||
console.error("Error uploading file to MinIO:", error);
|
||||
reject(new Error("Failed to upload file"));
|
||||
}
|
||||
})();
|
||||
});
|
||||
});
|
||||
|
||||
busboy.on("error", (error: unknown) => {
|
||||
|
||||
+10
-1
@@ -19,7 +19,11 @@ export const env = createEnv({
|
||||
NODE_ENV: z
|
||||
.enum(["development", "test", "production"])
|
||||
.default("development"),
|
||||
|
||||
MINIO_ENDPOINT: z.string(),
|
||||
MINIO_PORT: z.string(),
|
||||
MINIO_ACCESS_KEY: z.string(),
|
||||
MINIO_SECRET_KEY: z.string(),
|
||||
MINIO_BUCKET: z.string(),
|
||||
},
|
||||
|
||||
/**
|
||||
@@ -43,6 +47,11 @@ export const env = createEnv({
|
||||
DATABASE_URL: process.env.DATABASE_URL,
|
||||
NODE_ENV: process.env.NODE_ENV,
|
||||
NEXT_PUBLIC_PAGE_URL: process.env.NEXT_PUBLIC_PAGE_URL,
|
||||
MINIO_ENDPOINT: process.env.MINIO_ENDPOINT,
|
||||
MINIO_PORT: process.env.MINIO_PORT,
|
||||
MINIO_ACCESS_KEY: process.env.MINIO_ACCESS_KEY,
|
||||
MINIO_SECRET_KEY: process.env.MINIO_SECRET_KEY,
|
||||
MINIO_BUCKET: process.env.MINIO_BUCKET,
|
||||
},
|
||||
/**
|
||||
* Run `build` or `dev` with `SKIP_ENV_VALIDATION` to skip env validation. This is especially
|
||||
|
||||
+27
-26
@@ -1,31 +1,32 @@
|
||||
// This function takes a file name as input and returns the file type based on its extension.
|
||||
|
||||
export function getFileType(extension: string): string {
|
||||
export function getFileType(fileName: string): string {
|
||||
const extension = fileName.split(".").pop()?.toLowerCase();
|
||||
const fileTypes: Record<string, string> = {
|
||||
".mp4": "video/mp4",
|
||||
".webm": "video/webm",
|
||||
".ogg": "video/ogg",
|
||||
".jpg": "image/jpeg",
|
||||
".jpeg": "image/jpeg",
|
||||
".png": "image/png",
|
||||
".gif": "image/gif",
|
||||
".svg": "image/svg+xml",
|
||||
".mp3": "audio/mpeg",
|
||||
".wav": "audio/wav",
|
||||
".zip": "archive/zip",
|
||||
".rar": "archive/rar",
|
||||
".pdf": "text/pdf",
|
||||
".txt": "text/plain",
|
||||
".c": "code/c",
|
||||
".cpp": "code/cpp",
|
||||
".py": "code/python",
|
||||
".js": "code/javascript",
|
||||
".html": "code/html",
|
||||
".css": "code/css",
|
||||
".md": "markdown/markdown",
|
||||
".json": "code/json",
|
||||
".xml": "code/xml",
|
||||
".csv": "code/csv",
|
||||
"mp4": "video/mp4",
|
||||
"webm": "video/webm",
|
||||
"ogg": "video/ogg",
|
||||
"jpg": "image/jpeg",
|
||||
"jpeg": "image/jpeg",
|
||||
"png": "image/png",
|
||||
"gif": "image/gif",
|
||||
"svg": "image/svg+xml",
|
||||
"mp3": "audio/mpeg",
|
||||
"wav": "audio/wav",
|
||||
"zip": "archive/zip",
|
||||
"rar": "archive/rar",
|
||||
"pdf": "text/pdf",
|
||||
"txt": "text/plain",
|
||||
"c": "code/c",
|
||||
"cpp": "code/cpp",
|
||||
"py": "code/python",
|
||||
"js": "code/javascript",
|
||||
"html": "code/html",
|
||||
"css": "code/css",
|
||||
"md": "markdown/markdown",
|
||||
"json": "code/json",
|
||||
"xml": "code/xml",
|
||||
"csv": "code/csv",
|
||||
};
|
||||
return fileTypes[extension] || "unknown";
|
||||
return extension ? fileTypes[extension] || "unknown" : "unknown";
|
||||
};
|
||||
@@ -0,0 +1,19 @@
|
||||
import { Client } from "minio";
|
||||
import { env } from "~/env";
|
||||
|
||||
export const minioClient = new Client({
|
||||
endPoint: env.MINIO_ENDPOINT,
|
||||
port: parseInt(env.MINIO_PORT, 10),
|
||||
useSSL: false, // Set to true if using HTTPS
|
||||
accessKey: env.MINIO_ACCESS_KEY,
|
||||
secretKey: env.MINIO_SECRET_KEY,
|
||||
});
|
||||
|
||||
// Ensure the bucket exists
|
||||
export async function ensureBucketExists(bucketName: string) {
|
||||
const exists = await minioClient.bucketExists(bucketName);
|
||||
if (!exists) {
|
||||
await minioClient.makeBucket(bucketName, "us-east-1");
|
||||
console.log(`Bucket "${bucketName}" created.`);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user