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

chore: formatting the code of recent changes

Browse Source
This commit is contained in:
Akhileshrangani4 2024-11-29 13:05:35 -05:00
parent fbc56dc7fd
commit ba7a1dcc2c
13 changed files with 956 additions and 911 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

31
backend/database/src/index.ts
View File

@ -325,7 +325,18 @@ export default {
const body = await request.json()
const { id, name, email, username, avatarUrl, createdAt, generations, tier, tierExpiresAt, lastResetDate } = userSchema.parse(body)
const {
id,
name,
email,
username,
avatarUrl,
createdAt,
generations,
tier,
tierExpiresAt,
lastResetDate,
} = userSchema.parse(body)
const res = await db
.insert(user)
.values({
@ -418,7 +429,10 @@ export default {
return json({ exists: !!exists })
}
return methodNotAllowed
} else if (path === "/api/user/increment-generations" && method === "POST") {
} else if (
path === "/api/user/increment-generations" &&
method === "POST"
) {
const schema = z.object({
userId: z.string(),
})
@ -449,7 +463,7 @@ export default {
tier,
tierExpiresAt: tierExpiresAt.getTime(),
// Reset generations when upgrading tier
generations: 0
generations: 0,
})
.where(eq(user.id, userId))
.get()
@ -472,14 +486,19 @@ export default {
}
const now = new Date()
const lastReset = dbUser.lastResetDate ? new Date(dbUser.lastResetDate) : new Date(0)
const lastReset = dbUser.lastResetDate
? new Date(dbUser.lastResetDate)
: new Date(0)
if (now.getMonth() !== lastReset.getMonth() || now.getFullYear() !== lastReset.getFullYear()) {
if (
now.getMonth() !== lastReset.getMonth() ||
now.getFullYear() !== lastReset.getFullYear()
) {
await db
.update(user)
.set({
generations: 0,
lastResetDate: now.getTime()
lastResetDate: now.getTime(),
})
.where(eq(user.id, userId))
.get()

20
frontend/app/api/ai/route.ts
View File

@ -43,7 +43,8 @@ export async function POST(request: Request) {
const userData = await dbUser.json()
// Get tier settings
const tierSettings = TIERS[userData.tier as keyof typeof TIERS] || TIERS.FREE
const tierSettings =
TIERS[userData.tier as keyof typeof TIERS] || TIERS.FREE
if (userData.generations >= tierSettings.generations) {
return new Response(
`AI generation limit reached for your ${userData.tier || "FREE"} tier`,
@ -58,27 +59,29 @@ export async function POST(request: Request) {
isEditMode,
fileName,
line,
templateType
templateType,
} = await request.json()
// Get template configuration
const templateConfig = templateConfigs[templateType]
// Create template context
const templateContext = templateConfig ? `
const templateContext = templateConfig
? `
Project Template: ${templateConfig.name}
File Structure:
${Object.entries(templateConfig.fileStructure)
.map(([path, info]) => `${path} - ${info.description}`)
.join('\n')}
.join("\n")}
Conventions:
${templateConfig.conventions.join('\n')}
${templateConfig.conventions.join("\n")}
Dependencies:
${JSON.stringify(templateConfig.dependencies, null, 2)}
` : ''
`
: ""
// Create system message based on mode
let systemMessage
@ -146,7 +149,10 @@ ${activeFileContent ? `Active File Content:\n${activeFileContent}\n` : ""}`
new ReadableStream({
async start(controller) {
for await (const chunk of stream) {
if (chunk.type === "content_block_delta" && chunk.delta.type === "text_delta") {
if (
chunk.type === "content_block_delta" &&
chunk.delta.type === "text_delta"
) {
controller.enqueue(encoder.encode(chunk.delta.text))
}
}

4
frontend/components/editor/AIChat/index.tsx
View File

@ -75,8 +75,8 @@ export default function AIChat({
useEffect(() => {
const container = chatContainerRef.current
if (container) {
container.addEventListener('scroll', handleScroll)
return () => container.removeEventListener('scroll', handleScroll)
container.addEventListener("scroll", handleScroll)
return () => container.removeEventListener("scroll", handleScroll)
}
}, [])

9
frontend/components/editor/AIChat/lib/chatUtils.ts
View File

@ -131,8 +131,7 @@ export const handleSend = async (
}))
// Fetch AI response for chat message component
const response = await fetch("/api/ai",
{
const response = await fetch("/api/ai", {
method: "POST",
headers: {
"Content-Type": "application/json",
@ -145,8 +144,7 @@ export const handleSend = async (
templateType: templateType,
}),
signal: abortControllerRef.current.signal,
}
)
})
// Throw error if response is not ok
if (!response.ok) {
@ -201,7 +199,8 @@ export const handleSend = async (
console.error("Error fetching AI response:", error)
const errorMessage = {
role: "assistant" as const,
content: error.message || "Sorry, I encountered an error. Please try again.",
content:
error.message || "Sorry, I encountered an error. Please try again.",
}
setMessages((prev) => [...prev, errorMessage])
}

10
frontend/components/editor/generate.tsx
View File

@ -66,15 +66,17 @@ export default function GenerateInput({
"Content-Type": "application/json",
},
body: JSON.stringify({
messages: [{
messages: [
{
role: "user",
content: regenerate ? currentPrompt : input
}],
content: regenerate ? currentPrompt : input,
},
],
context: null,
activeFileContent: data.code,
isEditMode: true,
fileName: data.fileName,
line: data.line
line: data.line,
}),
})

13
frontend/components/profile/index.tsx
View File

@ -231,7 +231,10 @@ function ProfileCard({
<div className="flex flex-col items-center gap-2">
<p className="text-xs text-muted-foreground">{joinedAt}</p>
{typeof generations === "number" && (
<SubscriptionBadge generations={generations} tier={tier as keyof typeof TIERS} />
<SubscriptionBadge
generations={generations}
tier={tier as keyof typeof TIERS}
/>
)}
</div>
</>
@ -445,7 +448,13 @@ const StatsItem = ({ icon: Icon, label }: StatsItemProps) => (
// #endregion
// #region Sub Badge
const SubscriptionBadge = ({ generations, tier = "FREE" }: { generations: number, tier?: keyof typeof TIERS }) => {
const SubscriptionBadge = ({
generations,
tier = "FREE",
}: {
generations: number
tier?: keyof typeof TIERS
}) => {
return (
<div className="flex gap-2 items-center">
<Badge variant="secondary" className="text-sm cursor-pointer">

34
frontend/components/ui/userButton.tsx
View File

@ -43,7 +43,11 @@ const TIER_INFO = {
},
} as const
export default function UserButton({ userData: initialUserData }: { userData: User }) {
export default function UserButton({
userData: initialUserData,
}: {
userData: User
}) {
const [userData, setUserData] = useState<User>(initialUserData)
const [isOpen, setIsOpen] = useState(false)
const { signOut } = useClerk()
@ -57,7 +61,7 @@ export default function UserButton({ userData: initialUserData }: { userData: Us
headers: {
Authorization: `${process.env.NEXT_PUBLIC_WORKERS_KEY}`,
},
cache: 'no-store'
cache: "no-store",
}
)
if (res.ok) {
@ -75,9 +79,12 @@ export default function UserButton({ userData: initialUserData }: { userData: Us
}
}, [isOpen])
const tierInfo = TIER_INFO[userData.tier as keyof typeof TIER_INFO] || TIER_INFO.FREE
const tierInfo =
TIER_INFO[userData.tier as keyof typeof TIER_INFO] || TIER_INFO.FREE
const TierIcon = tierInfo.icon
const usagePercentage = Math.floor((userData.generations || 0) * 100 / tierInfo.limit)
const usagePercentage = Math.floor(
((userData.generations || 0) * 100) / tierInfo.limit
)
const handleUpgrade = async () => {
router.push(`/@${userData.username}`)
@ -98,7 +105,6 @@ export default function UserButton({ userData: initialUserData }: { userData: Us
<DropdownMenuSeparator />
<DropdownMenuItem className="cursor-pointer" asChild>
<Link href={"/dashboard"}>
<LayoutDashboard className="mr-2 size-4" />
@ -114,12 +120,13 @@ export default function UserButton({ userData: initialUserData }: { userData: Us
</DropdownMenuItem>
<DropdownMenuSeparator />
<div className="py-1.5 px-2 w-full">
<div className="flex items-center justify-between">
<div className="flex items-center gap-1.5">
<TierIcon className={`h-4 w-4 ${tierInfo.color}`} />
<span className="text-sm font-medium">{userData.tier || "FREE"} Plan</span>
<span className="text-sm font-medium">
{userData.tier || "FREE"} Plan
</span>
</div>
{(userData.tier === "FREE" || userData.tier === "PRO") && (
<Button
@ -139,15 +146,19 @@ export default function UserButton({ userData: initialUserData }: { userData: Us
<div className="w-full">
<div className="flex items-center justify-between text-sm text-muted-foreground mb-2">
<span>AI Usage</span>
<span>{userData.generations}/{tierInfo.limit}</span>
<span>
{userData.generations}/{tierInfo.limit}
</span>
</div>
<div className="rounded-full w-full h-2 overflow-hidden bg-secondary mb-1">
<div
className={`h-full rounded-full transition-all duration-300 ${
usagePercentage > 90 ? 'bg-red-500' :
usagePercentage > 75 ? 'bg-yellow-500' :
tierInfo.color.replace('text-', 'bg-')
usagePercentage > 90
? "bg-red-500"
: usagePercentage > 75
? "bg-yellow-500"
: tierInfo.color.replace("text-", "bg-")
}`}
style={{
width: `${Math.min(usagePercentage, 100)}%`,
@ -173,4 +184,3 @@ export default function UserButton({ userData: initialUserData }: { userData: Us
</DropdownMenu>
)
}

2
frontend/lib/data/index.ts
View File

@ -38,6 +38,6 @@ export const projectTemplates: {
name: "PHP",
description: "PHP development environment",
icon: "/project-icons/php.svg",
disabled: false
disabled: false,
},
]

162
frontend/lib/templates/index.ts
View File

@ -1,7 +1,7 @@
export interface TemplateConfig {
id: string
name: string,
runCommand: string,
name: string
runCommand: string
fileStructure: {
[key: string]: {
purpose: string
@ -25,67 +25,67 @@ export interface TemplateConfig {
fileStructure: {
"src/": {
purpose: "source",
description: "Contains all React components and application logic"
description: "Contains all React components and application logic",
},
"src/components/": {
purpose: "components",
description: "Reusable React components"
description: "Reusable React components",
},
"src/lib/": {
purpose: "utilities",
description: "Utility functions and shared code"
description: "Utility functions and shared code",
},
"src/App.tsx": {
purpose: "entry",
description: "Main application component"
description: "Main application component",
},
"src/index.tsx": {
purpose: "entry",
description: "Application entry point"
description: "Application entry point",
},
"src/index.css": {
purpose: "styles",
description: "Global CSS styles"
description: "Global CSS styles",
},
"public/": {
purpose: "static",
description: "Static assets and index.html"
description: "Static assets and index.html",
},
"tsconfig.json": {
purpose: "config",
description: "TypeScript configuration"
description: "TypeScript configuration",
},
"vite.config.ts": {
purpose: "config",
description: "Vite bundler configuration"
description: "Vite bundler configuration",
},
"package.json": {
purpose: "config",
description: "Project dependencies and scripts"
}
description: "Project dependencies and scripts",
},
},
conventions: [
"Use functional components with hooks",
"Follow React naming conventions (PascalCase for components)",
"Keep components small and focused",
"Use TypeScript for type safety"
"Use TypeScript for type safety",
],
dependencies: {
"@radix-ui/react-icons": "^1.3.0",
"@radix-ui/react-slot": "^1.1.0",
"class-variance-authority": "^0.7.0",
"clsx": "^2.1.1",
clsx: "^2.1.1",
"lucide-react": "^0.441.0",
"react": "^18.3.1",
react: "^18.3.1",
"react-dom": "^18.3.1",
"tailwind-merge": "^2.5.2",
"tailwindcss-animate": "^1.0.7"
"tailwindcss-animate": "^1.0.7",
},
scripts: {
"dev": "vite",
"build": "tsc && vite build",
"preview": "vite preview",
}
dev: "vite",
build: "tsc && vite build",
preview: "vite preview",
},
},
// Next.js template config
nextjs: {
@ -95,71 +95,71 @@ export interface TemplateConfig {
fileStructure: {
"pages/": {
purpose: "routing",
description: "Page components and API routes"
description: "Page components and API routes",
},
"pages/api/": {
purpose: "api",
description: "API route handlers"
description: "API route handlers",
},
"pages/_app.tsx": {
purpose: "entry",
description: "Application wrapper component"
description: "Application wrapper component",
},
"pages/index.tsx": {
purpose: "page",
description: "Homepage component"
description: "Homepage component",
},
"public/": {
purpose: "static",
description: "Static assets and files"
description: "Static assets and files",
},
"styles/": {
purpose: "styles",
description: "CSS modules and global styles"
description: "CSS modules and global styles",
},
"styles/globals.css": {
purpose: "styles",
description: "Global CSS styles"
description: "Global CSS styles",
},
"styles/Home.module.css": {
purpose: "styles",
description: "Homepage-specific styles"
description: "Homepage-specific styles",
},
"next.config.js": {
purpose: "config",
description: "Next.js configuration"
description: "Next.js configuration",
},
"next-env.d.ts": {
purpose: "types",
description: "Next.js TypeScript declarations"
description: "Next.js TypeScript declarations",
},
"tsconfig.json": {
purpose: "config",
description: "TypeScript configuration"
description: "TypeScript configuration",
},
"package.json": {
purpose: "config",
description: "Project dependencies and scripts"
}
description: "Project dependencies and scripts",
},
},
conventions: [
"Use file-system based routing",
"Keep API routes in pages/api",
"Use CSS Modules for component styles",
"Follow Next.js data fetching patterns"
"Follow Next.js data fetching patterns",
],
dependencies: {
"next": "^14.1.0",
"react": "^18.2.0",
next: "^14.1.0",
react: "^18.2.0",
"react-dom": "18.2.0",
"tailwindcss": "^3.4.1"
tailwindcss: "^3.4.1",
},
scripts: {
"dev": "next dev",
"build": "next build",
"start": "next start",
"lint": "next lint",
}
dev: "next dev",
build: "next build",
start: "next start",
lint: "next lint",
},
},
// Streamlit template config
streamlit: {
@ -169,35 +169,35 @@ export interface TemplateConfig {
fileStructure: {
"main.py": {
purpose: "entry",
description: "Main Streamlit application file"
description: "Main Streamlit application file",
},
"requirements.txt": {
purpose: "dependencies",
description: "Python package dependencies"
description: "Python package dependencies",
},
"Procfile": {
Procfile: {
purpose: "deployment",
description: "Deployment configuration for hosting platforms"
description: "Deployment configuration for hosting platforms",
},
"venv/": {
purpose: "environment",
description: "Python virtual environment directory"
}
description: "Python virtual environment directory",
},
},
conventions: [
"Use Streamlit components for UI",
"Follow PEP 8 style guide",
"Keep dependencies in requirements.txt",
"Use virtual environment for isolation"
"Use virtual environment for isolation",
],
dependencies: {
"streamlit": "^1.40.0",
"altair": "^5.5.0"
streamlit: "^1.40.0",
altair: "^5.5.0",
},
scripts: {
"start": "streamlit run main.py",
"dev": "./venv/bin/streamlit run main.py --server.runOnSave true"
}
start: "streamlit run main.py",
dev: "./venv/bin/streamlit run main.py --server.runOnSave true",
},
},
// HTML template config
vanillajs: {
@ -207,43 +207,43 @@ export interface TemplateConfig {
fileStructure: {
"index.html": {
purpose: "entry",
description: "Main HTML entry point"
description: "Main HTML entry point",
},
"style.css": {
purpose: "styles",
description: "Global CSS styles"
description: "Global CSS styles",
},
"script.js": {
purpose: "scripts",
description: "JavaScript application logic"
description: "JavaScript application logic",
},
"package.json": {
purpose: "config",
description: "Project dependencies and scripts"
description: "Project dependencies and scripts",
},
"package-lock.json": {
purpose: "config",
description: "Locked dependency versions"
description: "Locked dependency versions",
},
"vite.config.js": {
purpose: "config",
description: "Vite bundler configuration"
}
description: "Vite bundler configuration",
},
},
conventions: [
"Use semantic HTML elements",
"Keep CSS modular and organized",
"Write clean, modular JavaScript",
"Follow modern ES6+ practices"
"Follow modern ES6+ practices",
],
dependencies: {
"vite": "^5.0.12"
vite: "^5.0.12",
},
scripts: {
"dev": "vite",
"build": "vite build",
"preview": "vite preview"
}
dev: "vite",
build: "vite build",
preview: "vite preview",
},
},
// PHP template config
php: {
@ -253,38 +253,38 @@ export interface TemplateConfig {
fileStructure: {
"index.php": {
purpose: "entry",
description: "Main PHP entry point"
description: "Main PHP entry point",
},
"package.json": {
purpose: "config",
description: "Frontend dependencies and scripts"
description: "Frontend dependencies and scripts",
},
"package-lock.json": {
purpose: "config",
description: "Locked dependency versions"
description: "Locked dependency versions",
},
"vite.config.js": {
purpose: "config",
description: "Vite configuration for frontend assets"
description: "Vite configuration for frontend assets",
},
"node_modules/": {
purpose: "dependencies",
description: "Frontend dependency files"
}
description: "Frontend dependency files",
},
},
conventions: [
"Follow PSR-12 coding standards",
"Use modern PHP 8+ features",
"Organize assets with Vite",
"Keep PHP logic separate from presentation"
"Keep PHP logic separate from presentation",
],
dependencies: {
"vite": "^5.0.0"
vite: "^5.0.0",
},
scripts: {
"dev": "vite",
"build": "vite build",
"preview": "vite preview"
}
}
dev: "vite",
build: "vite build",
preview: "vite preview",
},
},
}