add file fetching data to the ws server

This commit is contained in:
Ishaan Dey 2024-04-26 21:57:30 -04:00
parent 4e7d6d1a97
commit 66b873454d
6 changed files with 101 additions and 32 deletions

View File

@ -13,10 +13,13 @@ const getSandboxFiles = (id) => __awaiter(void 0, void 0, void 0, function* () {
const sandboxRes = yield fetch(`https://storage.ishaan1013.workers.dev/api?sandboxId=${id}`); const sandboxRes = yield fetch(`https://storage.ishaan1013.workers.dev/api?sandboxId=${id}`);
const sandboxData = yield sandboxRes.json(); const sandboxData = yield sandboxRes.json();
const paths = sandboxData.objects.map((obj) => obj.key); const paths = sandboxData.objects.map((obj) => obj.key);
return processFiles(paths, id); const processedFiles = yield processFiles(paths, id);
// console.log("processedFiles.fileData:", processedFiles.fileData)
return processedFiles;
}); });
const processFiles = (paths, id) => { const processFiles = (paths, id) => __awaiter(void 0, void 0, void 0, function* () {
const root = { id: "/", type: "folder", name: "/", children: [] }; const root = { id: "/", type: "folder", name: "/", children: [] };
const fileData = [];
paths.forEach((path) => { paths.forEach((path) => {
const allParts = path.split("/"); const allParts = path.split("/");
if (allParts[1] !== id) { if (allParts[1] !== id) {
@ -38,6 +41,7 @@ const processFiles = (paths, id) => {
if (isFile) { if (isFile) {
const file = { id: path, type: "file", name: part }; const file = { id: path, type: "file", name: part };
current.children.push(file); current.children.push(file);
fileData.push({ id: path, data: "" });
} }
else { else {
const folder = { const folder = {
@ -52,6 +56,23 @@ const processFiles = (paths, id) => {
} }
} }
}); });
return root.children; yield Promise.all(fileData.map((file) => __awaiter(void 0, void 0, void 0, function* () {
}; const data = yield fetchFileContent(file.id);
file.data = data;
})));
return {
files: root.children,
fileData,
};
});
const fetchFileContent = (fileId) => __awaiter(void 0, void 0, void 0, function* () {
try {
const fileRes = yield fetch(`https://storage.ishaan1013.workers.dev/api?fileId=${fileId}`);
return yield fileRes.text();
}
catch (error) {
console.error("ERROR fetching file:", error);
return "";
}
});
exports.default = getSandboxFiles; exports.default = getSandboxFiles;

View File

@ -31,7 +31,6 @@ const io = new socket_io_1.Server(httpServer, {
const handshakeSchema = zod_1.z.object({ const handshakeSchema = zod_1.z.object({
userId: zod_1.z.string(), userId: zod_1.z.string(),
sandboxId: zod_1.z.string(), sandboxId: zod_1.z.string(),
type: zod_1.z.enum(["node", "react"]),
EIO: zod_1.z.string(), EIO: zod_1.z.string(),
transport: zod_1.z.string(), transport: zod_1.z.string(),
}); });
@ -44,7 +43,7 @@ io.use((socket, next) => __awaiter(void 0, void 0, void 0, function* () {
next(new Error("Invalid request.")); next(new Error("Invalid request."));
return; return;
} }
const { sandboxId, userId, type } = parseQuery.data; const { sandboxId, userId } = parseQuery.data;
const dbUser = yield fetch(`http://localhost:8787/api/user?id=${userId}`); const dbUser = yield fetch(`http://localhost:8787/api/user?id=${userId}`);
const dbUserJSON = (yield dbUser.json()); const dbUserJSON = (yield dbUser.json());
console.log("dbUserJSON:", dbUserJSON); console.log("dbUserJSON:", dbUserJSON);
@ -61,7 +60,6 @@ io.use((socket, next) => __awaiter(void 0, void 0, void 0, function* () {
} }
socket.data = { socket.data = {
id: sandboxId, id: sandboxId,
type,
userId, userId,
}; };
next(); next();
@ -69,11 +67,7 @@ io.use((socket, next) => __awaiter(void 0, void 0, void 0, function* () {
io.on("connection", (socket) => __awaiter(void 0, void 0, void 0, function* () { io.on("connection", (socket) => __awaiter(void 0, void 0, void 0, function* () {
const data = socket.data; const data = socket.data;
const sandboxFiles = yield (0, getSandboxFiles_1.default)(data.id); const sandboxFiles = yield (0, getSandboxFiles_1.default)(data.id);
// fetch all file data TODO socket.emit("loaded", sandboxFiles.files);
// socket.emit("loaded", {
// rootContent: await fetchDir("/workspace", "")
// });
// initHandlers(socket, replId);
})); }));
httpServer.listen(port, () => { httpServer.listen(port, () => {
console.log(`Server running on port ${port}`); console.log(`Server running on port ${port}`);

View File

@ -1,4 +1,12 @@
import { R2Files, Sandbox, TFile, TFolder, User } from "./types" import {
R2FileBody,
R2Files,
Sandbox,
TFile,
TFileData,
TFolder,
User,
} from "./types"
const getSandboxFiles = async (id: string) => { const getSandboxFiles = async (id: string) => {
const sandboxRes = await fetch( const sandboxRes = await fetch(
@ -7,11 +15,14 @@ const getSandboxFiles = async (id: string) => {
const sandboxData: R2Files = await sandboxRes.json() const sandboxData: R2Files = await sandboxRes.json()
const paths = sandboxData.objects.map((obj) => obj.key) const paths = sandboxData.objects.map((obj) => obj.key)
return processFiles(paths, id) const processedFiles = await processFiles(paths, id)
// console.log("processedFiles.fileData:", processedFiles.fileData)
return processedFiles
} }
const processFiles = (paths: string[], id: string): (TFile | TFolder)[] => { const processFiles = async (paths: string[], id: string) => {
const root: TFolder = { id: "/", type: "folder", name: "/", children: [] } const root: TFolder = { id: "/", type: "folder", name: "/", children: [] }
const fileData: TFileData[] = []
paths.forEach((path) => { paths.forEach((path) => {
const allParts = path.split("/") const allParts = path.split("/")
@ -36,6 +47,7 @@ const processFiles = (paths: string[], id: string): (TFile | TFolder)[] => {
if (isFile) { if (isFile) {
const file: TFile = { id: path, type: "file", name: part } const file: TFile = { id: path, type: "file", name: part }
current.children.push(file) current.children.push(file)
fileData.push({ id: path, data: "" })
} else { } else {
const folder: TFolder = { const folder: TFolder = {
id: path, id: path,
@ -50,7 +62,29 @@ const processFiles = (paths: string[], id: string): (TFile | TFolder)[] => {
} }
}) })
return root.children await Promise.all(
fileData.map(async (file) => {
const data = await fetchFileContent(file.id)
file.data = data
})
)
return {
files: root.children,
fileData,
}
}
const fetchFileContent = async (fileId: string): Promise<string> => {
try {
const fileRes = await fetch(
`https://storage.ishaan1013.workers.dev/api?fileId=${fileId}`
)
return await fileRes.text()
} catch (error) {
console.error("ERROR fetching file:", error)
return ""
}
} }
export default getSandboxFiles export default getSandboxFiles

View File

@ -22,7 +22,6 @@ const io = new Server(httpServer, {
const handshakeSchema = z.object({ const handshakeSchema = z.object({
userId: z.string(), userId: z.string(),
sandboxId: z.string(), sandboxId: z.string(),
type: z.enum(["node", "react"]),
EIO: z.string(), EIO: z.string(),
transport: z.string(), transport: z.string(),
}) })
@ -40,7 +39,7 @@ io.use(async (socket, next) => {
return return
} }
const { sandboxId, userId, type } = parseQuery.data const { sandboxId, userId } = parseQuery.data
const dbUser = await fetch(`http://localhost:8787/api/user?id=${userId}`) const dbUser = await fetch(`http://localhost:8787/api/user?id=${userId}`)
const dbUserJSON = (await dbUser.json()) as User const dbUserJSON = (await dbUser.json()) as User
@ -63,7 +62,6 @@ io.use(async (socket, next) => {
socket.data = { socket.data = {
id: sandboxId, id: sandboxId,
type,
userId, userId,
} }
@ -74,18 +72,11 @@ io.on("connection", async (socket) => {
const data = socket.data as { const data = socket.data as {
userId: string userId: string
id: string id: string
type: "node" | "react"
} }
const sandboxFiles = await getSandboxFiles(data.id) const sandboxFiles = await getSandboxFiles(data.id)
// fetch all file data TODO socket.emit("loaded", sandboxFiles.files)
// socket.emit("loaded", {
// rootContent: await fetchDir("/workspace", "")
// });
// initHandlers(socket, replId);
}) })
httpServer.listen(port, () => { httpServer.listen(port, () => {

View File

@ -27,6 +27,11 @@ export type TFile = {
name: string name: string
} }
export type TFileData = {
id: string
data: string
}
export type R2Files = { export type R2Files = {
objects: R2FileData[] objects: R2FileData[]
truncated: boolean truncated: boolean
@ -43,3 +48,12 @@ export type R2FileData = {
version: string version: string
key: string key: string
} }
export type R2FileBody = R2FileData & {
body: ReadableStream
bodyUsed: boolean
arrayBuffer: Promise<ArrayBuffer>
text: Promise<string>
json: Promise<any>
blob: Promise<Blob>
}

View File

@ -20,11 +20,26 @@ export default {
if (method === 'GET') { if (method === 'GET') {
const params = url.searchParams; const params = url.searchParams;
const sandboxId = params.get('sandboxId'); const sandboxId = params.get('sandboxId');
if (!sandboxId) { const fileId = params.get('fileId');
return invalidRequest;
} if (sandboxId) {
const res = await env.R2.list({ prefix: `projects/${sandboxId}` }); const res = await env.R2.list({ prefix: `projects/${sandboxId}` });
return new Response(JSON.stringify(res), { status: 200 }); return new Response(JSON.stringify(res), { status: 200 });
} else if (fileId) {
const obj = await env.R2.get(fileId);
if (obj === null) {
return new Response(`${fileId} not found`, { status: 404 });
}
const headers = new Headers();
headers.set('etag', obj.httpEtag);
obj.writeHttpMetadata(headers);
const text = await obj.text();
return new Response(text, {
headers,
});
} else return invalidRequest;
} else if (method === 'POST') { } else if (method === 'POST') {
return new Response('Hello, world!'); return new Response('Hello, world!');
} else return methodNotAllowed; } else return methodNotAllowed;