TNT-Flo/sandbox-web-ide
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

add ai generations limit + random bug fixes

Browse Source
This commit is contained in:
Ishaan Dey
2024-05-05 16:51:30 -07:00
parent 09ead6073b
commit 47ce5db223
20 changed files with 330 additions and 122 deletions
Download Patch File Download Diff File Expand all files Collapse all files

47
backend/server/dist/index.js vendored
View File

@ -65,14 +65,14 @@ io.use((socket, next) => __awaiter(void 0, void 0, void 0, function* () {
return;
}
socket.data = {
id: sandboxId,
userId,
sandboxId: sandboxId,
};
next();
}));
io.on("connection", (socket) => __awaiter(void 0, void 0, void 0, function* () {
const data = socket.data;
const sandboxFiles = yield (0, utils_1.getSandboxFiles)(data.id);
const sandboxFiles = yield (0, utils_1.getSandboxFiles)(data.sandboxId);
sandboxFiles.fileData.forEach((file) => {
const filePath = path_1.default.join(dirName, file.id);
fs_1.default.mkdirSync(path_1.default.dirname(filePath), { recursive: true });
@ -113,7 +113,7 @@ io.on("connection", (socket) => __awaiter(void 0, void 0, void 0, function* () {
socket.on("createFile", (name) => __awaiter(void 0, void 0, void 0, function* () {
try {
yield ratelimit_1.createFileRL.consume(data.userId, 1);
const id = `projects/${data.id}/${name}`;
const id = `projects/${data.sandboxId}/${name}`;
fs_1.default.writeFile(path_1.default.join(dirName, id), "", function (err) {
if (err)
throw err;
@ -165,7 +165,7 @@ io.on("connection", (socket) => __awaiter(void 0, void 0, void 0, function* () {
});
sandboxFiles.fileData = sandboxFiles.fileData.filter((f) => f.id !== fileId);
yield (0, utils_1.deleteFile)(fileId);
const newFiles = yield (0, utils_1.getSandboxFiles)(data.id);
const newFiles = yield (0, utils_1.getSandboxFiles)(data.sandboxId);
callback(newFiles.files);
}
catch (e) {
@ -184,7 +184,7 @@ io.on("connection", (socket) => __awaiter(void 0, void 0, void 0, function* () {
const pty = (0, node_pty_1.spawn)(os_1.default.platform() === "win32" ? "cmd.exe" : "bash", [], {
name: "xterm",
cols: 100,
cwd: path_1.default.join(dirName, "projects", data.id),
cwd: path_1.default.join(dirName, "projects", data.sandboxId),
});
const onData = pty.onData((data) => {
socket.emit("terminalResponse", {
@ -213,37 +213,26 @@ io.on("connection", (socket) => __awaiter(void 0, void 0, void 0, function* () {
}
});
socket.on("generateCode", (fileName, code, line, instructions, callback) => __awaiter(void 0, void 0, void 0, function* () {
console.log("Generating code...");
const res = yield fetch(`https://api.cloudflare.com/client/v4/accounts/${process.env.CF_USER_ID}/ai/run/@cf/meta/llama-3-8b-instruct`, {
const fetchPromise = fetch(`http://localhost:8787/api/sandbox/generate`, {
method: "POST",
headers: {
"Content-Type": "application/json",
Authorization: `Bearer ${process.env.CF_API_TOKEN}`,
},
body: JSON.stringify({
messages: [
{
role: "system",
content: "You are an expert coding assistant. You read code from a file, and you suggest new code to add to the file. You may be given instructions on what to generate, which you should follow. You should generate code that is correct, efficient, and follows best practices. You should also generate code that is clear and easy to read. When you generate code, you should only return the code, and nothing else. You should not include backticks in the code you generate.",
},
{
role: "user",
content: `The file is called ${fileName}.`,
},
{
role: "user",
content: `Here are my instructions on what to generate: ${instructions}.`,
},
{
role: "user",
content: `Suggest me code to insert at line ${line} in my file. Give only the code, and NOTHING else. DO NOT include backticks in your response. My code file content is as follows
${code}`,
},
],
userId: data.userId,
}),
});
const json = yield res.json();
const generateCodePromise = (0, utils_1.generateCode)({
fileName,
code,
line,
instructions,
});
const [fetchResponse, generateCodeResponse] = yield Promise.all([
fetchPromise,
generateCodePromise,
]);
const json = yield generateCodeResponse.json();
callback(json);
}));
socket.on("disconnect", () => {

34
backend/server/dist/utils.js vendored
View File

@ -9,7 +9,7 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
});
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.deleteFile = exports.saveFile = exports.renameFile = exports.createFile = exports.getSandboxFiles = void 0;
exports.generateCode = exports.deleteFile = exports.saveFile = exports.renameFile = exports.createFile = exports.getSandboxFiles = void 0;
const getSandboxFiles = (id) => __awaiter(void 0, void 0, void 0, function* () {
const sandboxRes = yield fetch(`https://storage.ishaan1013.workers.dev/api?sandboxId=${id}`);
const sandboxData = yield sandboxRes.json();
@ -121,3 +121,35 @@ const deleteFile = (fileId) => __awaiter(void 0, void 0, void 0, function* () {
return res.ok;
});
exports.deleteFile = deleteFile;
const generateCode = (_a) => __awaiter(void 0, [_a], void 0, function* ({ fileName, code, line, instructions, }) {
return yield fetch(`https://api.cloudflare.com/client/v4/accounts/${process.env.CF_USER_ID}/ai/run/@cf/meta/llama-3-8b-instruct`, {
method: "POST",
headers: {
"Content-Type": "application/json",
Authorization: `Bearer ${process.env.CF_API_TOKEN}`,
},
body: JSON.stringify({
messages: [
{
role: "system",
content: "You are an expert coding assistant. You read code from a file, and you suggest new code to add to the file. You may be given instructions on what to generate, which you should follow. You should generate code that is correct, efficient, and follows best practices. You should also generate code that is clear and easy to read. When you generate code, you should only return the code, and nothing else. You should not include backticks in the code you generate.",
},
{
role: "user",
content: `The file is called ${fileName}.`,
},
{
role: "user",
content: `Here are my instructions on what to generate: ${instructions}.`,
},
{
role: "user",
content: `Suggest me code to insert at line ${line} in my file. Give only the code, and NOTHING else. DO NOT include backticks in your response. My code file content is as follows
${code}`,
},
],
}),
});
});
exports.generateCode = generateCode;

70
backend/server/src/index.ts
View File

@ -11,6 +11,7 @@ import { User } from "./types"
import {
createFile,
deleteFile,
generateCode,
getSandboxFiles,
renameFile,
saveFile,
@ -81,8 +82,8 @@ io.use(async (socket, next) => {
}
socket.data = {
id: sandboxId,
userId,
sandboxId: sandboxId,
}
next()
@ -91,10 +92,10 @@ io.use(async (socket, next) => {
io.on("connection", async (socket) => {
const data = socket.data as {
userId: string
id: string
sandboxId: string
}
const sandboxFiles = await getSandboxFiles(data.id)
const sandboxFiles = await getSandboxFiles(data.sandboxId)
sandboxFiles.fileData.forEach((file) => {
const filePath = path.join(dirName, file.id)
fs.mkdirSync(path.dirname(filePath), { recursive: true })
@ -142,7 +143,7 @@ io.on("connection", async (socket) => {
try {
await createFileRL.consume(data.userId, 1)
const id = `projects/${data.id}/${name}`
const id = `projects/${data.sandboxId}/${name}`
fs.writeFile(path.join(dirName, id), "", function (err) {
if (err) throw err
@ -206,7 +207,7 @@ io.on("connection", async (socket) => {
await deleteFile(fileId)
const newFiles = await getSandboxFiles(data.id)
const newFiles = await getSandboxFiles(data.sandboxId)
callback(newFiles.files)
} catch (e) {
socket.emit("rateLimit", "Rate limited: file deletion. Please slow down.")
@ -226,7 +227,7 @@ io.on("connection", async (socket) => {
const pty = spawn(os.platform() === "win32" ? "cmd.exe" : "bash", [], {
name: "xterm",
cols: 100,
cwd: path.join(dirName, "projects", data.id),
cwd: path.join(dirName, "projects", data.sandboxId),
})
const onData = pty.onData((data) => {
@ -269,42 +270,29 @@ io.on("connection", async (socket) => {
instructions: string,
callback
) => {
console.log("Generating code...")
const res = await fetch(
`https://api.cloudflare.com/client/v4/accounts/${process.env.CF_USER_ID}/ai/run/@cf/meta/llama-3-8b-instruct`,
{
method: "POST",
headers: {
"Content-Type": "application/json",
Authorization: `Bearer ${process.env.CF_API_TOKEN}`,
},
body: JSON.stringify({
messages: [
{
role: "system",
content:
"You are an expert coding assistant. You read code from a file, and you suggest new code to add to the file. You may be given instructions on what to generate, which you should follow. You should generate code that is correct, efficient, and follows best practices. You should also generate code that is clear and easy to read. When you generate code, you should only return the code, and nothing else. You should not include backticks in the code you generate.",
},
{
role: "user",
content: `The file is called ${fileName}.`,
},
{
role: "user",
content: `Here are my instructions on what to generate: ${instructions}.`,
},
{
role: "user",
content: `Suggest me code to insert at line ${line} in my file. Give only the code, and NOTHING else. DO NOT include backticks in your response. My code file content is as follows
${code}`,
},
],
}),
}
)
const fetchPromise = fetch(`http://localhost:8787/api/sandbox/generate`, {
method: "POST",
headers: {
"Content-Type": "application/json",
},
body: JSON.stringify({
userId: data.userId,
}),
})
const json = await res.json()
const generateCodePromise = generateCode({
fileName,
code,
line,
instructions,
})
const [fetchResponse, generateCodeResponse] = await Promise.all([
fetchPromise,
generateCodePromise,
])
const json = await generateCodeResponse.json()
callback(json)
}
)

16
backend/server/src/types.ts
View File

@ -4,11 +4,9 @@ export type User = {
id: string
name: string
email: string
generations: number
sandbox: Sandbox[]
usersToSandboxes: {
userId: string
sandboxId: string
}[]
usersToSandboxes: UsersToSandboxes[]
}
export type Sandbox = {
@ -17,10 +15,12 @@ export type Sandbox = {
type: "react" | "node"
visibility: "public" | "private"
userId: string
usersToSandboxes: {
userId: string
sandboxId: string
}[]
usersToSandboxes: UsersToSandboxes[]
}
export type UsersToSandboxes = {
userId: string
sandboxId: string
}
export type TFolder = {

46
backend/server/src/utils.ts
View File

@ -134,3 +134,49 @@ export const deleteFile = async (fileId: string) => {
})
return res.ok
}
export const generateCode = async ({
fileName,
code,
line,
instructions,
}: {
fileName: string
code: string
line: number
instructions: string
}) => {
return await fetch(
`https://api.cloudflare.com/client/v4/accounts/${process.env.CF_USER_ID}/ai/run/@cf/meta/llama-3-8b-instruct`,
{
method: "POST",
headers: {
"Content-Type": "application/json",
Authorization: `Bearer ${process.env.CF_API_TOKEN}`,
},
body: JSON.stringify({
messages: [
{
role: "system",
content:
"You are an expert coding assistant. You read code from a file, and you suggest new code to add to the file. You may be given instructions on what to generate, which you should follow. You should generate code that is correct, efficient, and follows best practices. You should also generate code that is clear and easy to read. When you generate code, you should only return the code, and nothing else. You should not include backticks in the code you generate.",
},
{
role: "user",
content: `The file is called ${fileName}.`,
},
{
role: "user",
content: `Here are my instructions on what to generate: ${instructions}.`,
},
{
role: "user",
content: `Suggest me code to insert at line ${line} in my file. Give only the code, and NOTHING else. DO NOT include backticks in your response. My code file content is as follows
${code}`,
},
],
}),
}
)
}