Redesign the terminal frontend and page style

app/api/projects/[id]/environment/route.ts

@@ -2,13 +2,10 @@ import type { Environment } from '@prisma/client'
 import { NextResponse } from 'next/server'
 
 import { verifyProjectAccess, withAuth } from '@/lib/api-auth'
+import { EnvironmentCategory } from '@/lib/const'
 import { prisma } from '@/lib/db'
 
-type GroupedEnvironments = {
-  general: Environment[]
-  auth: Environment[]
-  payment: Environment[]
-}
+type GroupedEnvironments = Record<string, Environment[]>
 
 type GetEnvironmentsResponse = { error: string } | GroupedEnvironments
 
@@ -25,12 +22,16 @@ export const GET = withAuth<GetEnvironmentsResponse>(async (_req, context, sessi
       orderBy: { createdAt: 'asc' },
     })
 
-    // Group environment variables by category
-    const grouped = {
-      general: environments.filter((e) => !e.category || e.category === 'general'),
-      auth: environments.filter((e) => e.category === 'auth'),
-      payment: environments.filter((e) => e.category === 'payment'),
-    }
+    // Group environment variables by category (dynamically based on EnvironmentCategory enum)
+    const grouped: GroupedEnvironments = {}
+
+    // Initialize all categories from enum
+    Object.values(EnvironmentCategory).forEach((category) => {
+      grouped[category] = environments.filter((e) => e.category === category)
+    })
+
+    // Add general category for null/undefined categories
+    grouped.general = environments.filter((e) => !e.category)
 
     return NextResponse.json(grouped)
   } catch (error) {

app/projects/[id]/layout.tsx

@@ -1,11 +1,8 @@
 import { redirect } from 'next/navigation';
 import { notFound } from 'next/navigation';
 
-import ContentWrapper from '@/components/content-wrapper';
-import PersistentTerminal from '@/components/persistent-terminal';
 import PrimarySidebar from '@/components/sidebars/primary-sidebar';
 import ProjectSidebar from '@/components/sidebars/project-sidebar';
-import { TerminalProvider } from '@/components/terminal-provider';
 import { auth } from '@/lib/auth';
 import { prisma } from '@/lib/db';
 
@@ -40,31 +37,23 @@ export default async function ProjectLayout({
     notFound();
   }
 
-
-  return (
-    <TerminalProvider>
-      <div className="h-screen flex text-foreground overflow-hidden">
-        {/* Primary Sidebar - VSCode style */}
-        <PrimarySidebar currentProjectId={id} userId={session.user.id} />
-
-        {/* Secondary Sidebar - Project Settings */}
-        <ProjectSidebar
-          project={project}
-          sandboxes={project.sandboxes}
-          envVars={project.environments}
-        />
 
-        {/* Main Content Area */}
-        <ContentWrapper projectId={id}>
-          <div className="flex-1 flex flex-col min-w-0 relative">
-            {/* Regular Page Content */}
-            {children}
-          </div>
-        </ContentWrapper>
-
-        {/* Persistent Terminal (hidden by default) - separate from main content */}
-        <PersistentTerminal projectId={id} />
+  return (
+    <div className="h-screen flex text-foreground overflow-hidden">
+      {/* Primary Sidebar - VSCode style */}
+      <PrimarySidebar currentProjectId={id} userId={session.user.id} />
+
+      {/* Secondary Sidebar - Project Settings */}
+      <ProjectSidebar
+        project={project}
+        sandboxes={project.sandboxes}
+        envVars={project.environments}
+      />
+
+      {/* Main Content Area */}
+      <div className="flex-1 flex flex-col min-w-0 relative overflow-hidden">
+        {children}
       </div>
-    </TerminalProvider>
+    </div>
   );
 }