// Root shell component — routing only. Each route's content is its own
// page component under `./pages/`; this file just maps paths to them.
import { Redirect, Route, Router, Switch, useSearch } from "wouter-preact";
import { MOVED_ROUTES, movedHref } from "./shell/routes.js";
import { Shell } from "./shell/Shell.js";
import { useGuardedLocation } from "./shell/useGuardedLocation.js";
import { AgentsPage } from "./pages/agents/AgentsPage.js";
import { AgentTerminalPage } from "./pages/agents/AgentTerminalPage.js";
import { MessagesPage } from "./pages/messages/MessagesPage.js";
import { NEW_FLOW_PATH } from "./pages/notifications/FlowDraft.js";
import { FlowEditorPage } from "./pages/notifications/FlowEditorPage.js";
import { NotificationsPage } from "./pages/notifications/NotificationsPage.js";
import { ComponentsPage } from "./pages/ComponentsPage.js";
import { JobsPage } from "./pages/JobsPage.js";
import { ReportsPage } from "./pages/reports/ReportsPage.js";
import { StartPage } from "./pages/StartPage.js";
import { Panel } from "./ui/panel/Panel.js";

// An address from before the tabs were folded together: replace it with the
// tab that holds the page now, query kept.
function MovedTo({ from }: { from: string }) {
  return <Redirect to={movedHref(from, useSearch()) ?? "/"} replace />;
}

function NotFound() {
  return (
    <Panel title="404" icon="🧭">
      <p>no route here.</p>
    </Panel>
  );
}

export function App() {
  return (
    <Router hook={useGuardedLocation}>
      <Shell>
        <Switch>
          <Route path="/" component={StartPage} />
          <Route path="/reports" component={ReportsPage} />
          {Object.keys(MOVED_ROUTES).map((from) => (
            <Route key={from} path={from}>
              <MovedTo from={from} />
            </Route>
          ))}
          <Route path="/agents" component={AgentsPage} />
          <Route path="/agents/:name/terminal" component={AgentTerminalPage} />
          <Route
            path="/agents/:name/subagents/:subagent/terminal"
            component={AgentTerminalPage}
          />
          <Route path="/jobs" component={JobsPage} />
          <Route path="/messages" component={MessagesPage} />
          <Route path="/notifications" component={NotificationsPage} />
          <Route path={NEW_FLOW_PATH}>
            <FlowEditorPage params={{ flowId: "" }} isNew />
          </Route>
          <Route path="/notifications/:flowId" component={FlowEditorPage} />
          <Route path="/components" component={ComponentsPage} />
          <Route component={NotFound} />
        </Switch>
      </Shell>
    </Router>
  );
}