89 lines
2.3 KiB
TypeScript
89 lines
2.3 KiB
TypeScript
import { useState, useEffect } from "react";
|
|
import { invoke } from "@tauri-apps/api/core";
|
|
import { open } from "@tauri-apps/plugin-dialog";
|
|
import { Chat } from "./components/Chat";
|
|
import "./App.css";
|
|
|
|
function App() {
|
|
const [projectPath, setProjectPath] = useState<string | null>(null);
|
|
const [errorMsg, setErrorMsg] = useState<string | null>(null);
|
|
|
|
useEffect(() => {
|
|
invoke<string | null>("get_current_project")
|
|
.then((path) => {
|
|
if (path) setProjectPath(path);
|
|
})
|
|
.catch((e) => console.error(e));
|
|
}, []);
|
|
|
|
async function closeProject() {
|
|
try {
|
|
await invoke("close_project");
|
|
setProjectPath(null);
|
|
} catch (e) {
|
|
console.error(e);
|
|
}
|
|
}
|
|
|
|
async function selectProject() {
|
|
try {
|
|
setErrorMsg(null);
|
|
// Open native folder picker
|
|
const selected = await open({
|
|
directory: true,
|
|
multiple: false,
|
|
});
|
|
|
|
if (selected === null) {
|
|
// User cancelled selection
|
|
return;
|
|
}
|
|
|
|
// Invoke backend command to verify and set state
|
|
// Note: invoke argument names must match Rust function args
|
|
const confirmedPath = await invoke<string>("open_project", {
|
|
path: selected,
|
|
});
|
|
setProjectPath(confirmedPath);
|
|
} catch (e) {
|
|
console.error(e);
|
|
setErrorMsg(
|
|
typeof e === "string" ? e : "An error occurred opening the project.",
|
|
);
|
|
}
|
|
}
|
|
|
|
return (
|
|
<main
|
|
className="container"
|
|
style={{ height: "100vh", padding: 0, maxWidth: "100%" }}
|
|
>
|
|
{!projectPath ? (
|
|
<div
|
|
className="selection-screen"
|
|
style={{ padding: "2rem", maxWidth: "800px", margin: "0 auto" }}
|
|
>
|
|
<h1>AI Code Assistant</h1>
|
|
<p>
|
|
Please select a project folder to start the Story-Driven Spec
|
|
Workflow.
|
|
</p>
|
|
<button onClick={selectProject}>Open Project Directory</button>
|
|
</div>
|
|
) : (
|
|
<div className="workspace" style={{ height: "100%" }}>
|
|
<Chat projectPath={projectPath} onCloseProject={closeProject} />
|
|
</div>
|
|
)}
|
|
|
|
{errorMsg && (
|
|
<div className="error-message" style={{ marginTop: "20px" }}>
|
|
<p style={{ color: "red" }}>Error: {errorMsg}</p>
|
|
</div>
|
|
)}
|
|
</main>
|
|
);
|
|
}
|
|
|
|
export default App;
|