feat(web): add workflow creation and editing functionality

- Introduced WorkflowNewPage and WorkflowEditPage for creating and editing workflows.
- Updated App component to include new routes for workflow management.
- Enhanced workflow diagram generation in workflow-mermaid.js for better visualization.
- Modified WorkflowsPage to support navigation to the new workflow pages.
- Improved HomePage links to direct users to the correct workflow edit paths.

packages/web/src/App.jsx

@@ -9,6 +9,7 @@ import { ScriptsPage } from "./pages/ScriptsPage.jsx";
 import { ScriptDryRunPage } from "./pages/ScriptDryRunPage.jsx";
 import { ScriptEditPage, ScriptNewPage } from "./pages/ScriptEditPage.jsx";
 import { WorkflowsPage } from "./pages/WorkflowsPage.jsx";
+import { WorkflowEditPage, WorkflowNewPage } from "./pages/WorkflowEditPage.jsx";
 import { EventsPage } from "./pages/EventsPage.jsx";
 import { EventDetailPage } from "./pages/EventDetailPage.jsx";
 import { UsersPage } from "./pages/UsersPage.jsx";
@@ -51,6 +52,8 @@ export function App() {
         <Route path="/scripts/:name/dry-run" element={<ScriptDryRunPage />} />
         <Route path="/scripts/:name/edit" element={<ScriptEditPage />} />
         <Route path="/workflows" element={<WorkflowsPage />} />
+        <Route path="/workflows/new" element={<WorkflowNewPage />} />
+        <Route path="/workflows/:owner/:file/edit" element={<WorkflowEditPage />} />
         <Route path="/events" element={<EventsPage />} />
         <Route path="/events/:id" element={<EventDetailPage />} />
         {user.role === "admin" ? (