wip: zen

packages/console/app/src/routes/workspace-picker.tsx

@@ -1,4 +1,4 @@
-import { query, useParams, action, createAsync, redirect } from "@solidjs/router"
+import { query, useParams, action, createAsync, redirect, useSubmission } from "@solidjs/router"
 import { For, Show, createEffect, onCleanup } from "solid-js"
 import { createStore } from "solid-js/store"
 import { withActor } from "~/context/auth.withActor"
@@ -42,6 +42,7 @@ const createWorkspace = action(async (form: FormData) => {
 export function WorkspacePicker() {
   const params = useParams()
   const workspaces = createAsync(() => getWorkspaces())
+  const submission = useSubmission(createWorkspace)
   const [store, setStore] = createStore({
     showForm: false,
     showDropdown: false,
@@ -135,8 +136,8 @@ export function WorkspacePicker() {
               <button type="button" data-color="ghost" onClick={() => setStore("showForm", false)}>
                 Cancel
               </button>
-              <button type="submit" data-color="primary">
-                Create
+              <button type="submit" data-color="primary" disabled={submission.pending}>
+                {submission.pending ? "Creating..." : "Create"}
               </button>
             </div>
           </div>

packages/console/app/src/routes/workspace/[id].tsx

@@ -24,10 +24,10 @@ export default function WorkspaceLayout(props: RouteSectionProps) {
               <A href={`/workspace/${params.id}/billing`} activeClass="active" data-nav-button>
                 Billing
               </A>
+              <A href={`/workspace/${params.id}/settings`} activeClass="active" data-nav-button>
+                Settings
+              </A>
             </Show>
-            <A href={`/workspace/${params.id}/settings`} activeClass="active" data-nav-button>
-              Settings
-            </A>
           </div>
         </nav>
         <div data-component="workspace-content">{props.children}</div>

packages/console/core/src/actor.ts

@@ -69,7 +69,7 @@ export namespace Actor {
 
   export const assertAdmin = () => {
     if (userRole() === "admin") return
-    throw new Error(`Expected admin user, got ${userRole()}`)
+    throw new Error(`Action not allowed. Ask your workspace admin to perform this action.`)
   }
 
   export function workspace() {

packages/console/core/src/workspace.ts

@@ -52,6 +52,7 @@ export namespace Workspace {
       name: z.string().min(1).max(255),
     }),
     async ({ name }) => {
+      Actor.assertAdmin()
       const workspaceID = Actor.workspace()
       return await Database.use((tx) =>
         tx