frontend/scripts/05_terminal_workspace.sh

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

ROOT="$(pwd)"

mkdir -p \
components/terminal \
components/statusbar \
components/sidebar

cat > components/terminal/ProductionTerminal.jsx <<'EOC'
"use client";

import {useEffect,useRef} from "react";
import {Terminal} from "@xterm/xterm";
import {FitAddon} from "@xterm/addon-fit";
import "@xterm/xterm/css/xterm.css";

export default function ProductionTerminal(){

const ref=useRef(null);

useEffect(()=>{

const term=new Terminal({
cursorBlink:true,
fontSize:13,
theme:{
background:"#020617",
foreground:"#e2e8f0",
cursor:"#38bdf8"
}
});

const fit=new FitAddon();

term.loadAddon(fit);
term.open(ref.current);
fit.fit();

term.writeln("Dolor3V Studio Terminal");
term.writeln("-----------------------");
term.writeln("Workspace Ready");
term.write("$ ");

window.addEventListener("resize",()=>fit.fit());

return()=>term.dispose();

},[]);

return(
<div
ref={ref}
className="w-full h-full"
/>
);

}
EOC

cat > components/statusbar/StatusBar.jsx <<'EOC'
"use client";

export default function StatusBar(){

return(
<div className="h-8 bg-slate-950 border-t border-slate-800 flex items-center justify-between px-4 text-xs">

<span>Dolor3V Studio</span>

<span>Ready</span>

</div>
);

}
EOC

cat > components/sidebar/ActivityBar.jsx <<'EOC'
"use client";

const items=[
"Explorer",
"Search",
"Git",
"Build",
"Deploy",
"AI"
];

export default function ActivityBar(){

return(

<div className="w-14 bg-slate-950 border-r border-slate-800 flex flex-col">

{items.map(x=>(
<button
key={x}
className="h-14 hover:bg-slate-800"
title={x}
>
{x[0]}
</button>
))}

</div>

);

}
EOC

cat > components/terminal/index.js <<'EOC'
export {default} from "./ProductionTerminal";
EOC

echo
echo "[1/4] Terminal created"
echo "[2/4] Activity bar created"
echo "[3/4] Status bar created"

test -f components/terminal/ProductionTerminal.jsx
test -f components/statusbar/StatusBar.jsx
test -f components/sidebar/ActivityBar.jsx

echo "[4/4] Terminal workspace installed."