refactor(webui): adopt semantic workspace actions

webui/src/features/projects/ProjectsPage.tsx

@@ -13,8 +13,7 @@ import {
   useState,
   type FormEvent
 } from "react";
-import { ActionToolbar,
+import { Button,
-  Button,
   Dialog,
   DocumentationHelpLink,
   DismissibleAlert,
@@ -30,6 +29,7 @@ import { ActionToolbar,
   StatePanel,
   StatusBadge,
   hasScope,
+  WorkspaceActionBar,
   WorkspaceFrame,
   type PlatformRouteContext
 } from "@govoplan/core-webui";
@@ -213,7 +213,13 @@ export default function ProjectsPage({ settings, auth }: PlatformRouteContext) {
   return (
     <main className="projects-page">
       <WorkspaceFrame className="projects-shell" label="Projects workspace" interfaceId="projects.workspace" helpContextId="projects.page.workspace" helpModuleId="projects">
-        <ActionToolbar surface="panel-header" className="projects-toolbar">
+        <WorkspaceActionBar
+          scope="workspace"
+          variant="collection"
+          refreshable
+          reloadAction={{ onReload: () => void reload(), loading }}
+          className="projects-toolbar"
+          contextActions={<>
             <FilterBar as="form" surface="control" wrap="never" width="default" className="projects-search" onSubmit={submitSearch}>
             <Search size={17} aria-hidden="true" />
             <input
@@ -234,16 +240,17 @@ export default function ProjectsPage({ settings, auth }: PlatformRouteContext) {
             </select>
             </label>
             <span className="projects-count">{total} objects</span>
-          <DocumentationHelpLink
+          </>}
+          helpAction={<DocumentationHelpLink
             reference={{ topicId: "projects.module-boundary", documentationType: "user" }}
             label="Open Projects documentation"
-          />
+          />}
-          {canWrite &&
+          createAction={canWrite ?
             <Button type="button" variant="primary" onClick={openCreate}>
               <Plus size={16} aria-hidden="true" /> New
             </Button>
-          }
+          : undefined}
-        </ActionToolbar>
+        />
         {error &&
           <DismissibleAlert tone="error" onDismiss={() => setError("")}>
             {error}