frontend/scripts/03_workspace_shell.sh

#!/usr/bin/env bash
set -Eeuo pipefail

ROOT="$(cd "$(dirname "${BASH_SOURCE[0]}")/.." && pwd)"
cd "$ROOT"

mkdir -p components/layout

cat > components/layout/WorkspaceShell.jsx <<'EOC'
"use client";

import { useState } from "react";

import FileExplorer from "../explorer/FileExplorer";
import CodeEditor from "../editor/CodeEditor";
import AIChatPanel from "../chat/AIChatPanel";
import TerminalPanel from "../terminal/TerminalPanel";
import AgentMonitor from "../dashboards/AgentMonitor";

export default function WorkspaceShell() {

const [left,setLeft]=useState(true);
const [right,setRight]=useState(true);
const [bottom,setBottom]=useState(true);

return (

<div className="workspace-shell">

<header className="workspace-header">

<div className="workspace-logo">
DOLOR3V
</div>

<div className="workspace-title">
Autonomous AI Workspace
</div>

<div className="workspace-actions">

<button>Preview</button>

<button>Build</button>

<button>Deploy</button>

<button>Settings</button>

</div>

</header>

<div className="workspace-body">

{left &&

<aside className="workspace-left">
<FileExplorer/>
</aside>

}

<main className="workspace-main">

<CodeEditor/>

</main>

{right &&

<aside className="workspace-right">

<AIChatPanel/>

<AgentMonitor/>

</aside>

}

</div>

{bottom &&

<footer className="workspace-terminal">

<TerminalPanel/>

</footer>

}

</div>

);

}
EOC

grep -q "workspace-shell" app/globals.css || cat >> app/globals.css <<'EOC'

.workspace-shell{
height:100vh;
display:grid;
grid-template-rows:64px 1fr 260px;
background:#020617;
color:#fff;
}

.workspace-header{
display:flex;
align-items:center;
justify-content:space-between;
padding:0 20px;
background:#0f172a;
border-bottom:1px solid #1e293b;
}

.workspace-logo{
font-size:22px;
font-weight:700;
color:#38bdf8;
}

.workspace-title{
font-size:15px;
font-weight:600;
}

.workspace-actions{
display:flex;
gap:10px;
}

.workspace-actions button{
background:#1e293b;
color:white;
padding:10px 18px;
border:none;
border-radius:8px;
cursor:pointer;
}

.workspace-body{
display:grid;
grid-template-columns:280px 1fr 380px;
overflow:hidden;
}

.workspace-left{
border-right:1px solid #1e293b;
overflow:auto;
}

.workspace-main{
overflow:hidden;
}

.workspace-right{
border-left:1px solid #1e293b;
display:flex;
flex-direction:column;
overflow:auto;
}

.workspace-terminal{
border-top:1px solid #1e293b;
overflow:hidden;
}

EOC

echo "Workspace shell installed."