@cosmoops/connect-sdk 0.38.0 → 0.40.0

package/dist/esm/client/components/event-type-form.js

@@ -3,7 +3,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useMemo, useState } from "react";
 import { Button, Input, Label, ListBox, Modal, Select, TextArea, TextField } from "@heroui/react";
 import { useConnect, useConnectWorkspaceMembers } from "../provider.js";
-import { useAvailabilitySchedules, useCreateEventType } from "../use-scheduling.js";
+import { useAvailabilitySchedules, useCreateEventType, useManageableEventTypes, useUpdateEventType, } from "../use-scheduling.js";
 const LOCATION_LABELS = {
     phone: "Phone call",
     address: "In person",
@@ -11,40 +11,113 @@ const LOCATION_LABELS = {
 };
 const LOCATION_KINDS = ["phone", "address", "link"];
 /**
- * Creates the first thing a workspace can be booked for, from inside a host
- * application rather than a link-out to Connect.
+ * Creates or edits an appointment type, from inside a host application
+ * rather than a link-out to Connect.
  *
  * **Needs a schedule to exist first** - the picker reads `useAvailabilitySchedules`
  * and renders "Set up availability first" with nothing to submit if none
  * exists yet. Pair this with `ConnectAvailabilityFormModal` in a setup flow
  * rather than assuming one.
  *
+ * **That gate waits for the read, and the order matters.** Both bridge reads
+ * answer `[]` while they are in flight, so testing `schedules.length === 0`
+ * first showed "Set up availability first" to everybody who opened this -
+ * including, for a second or two, somebody pressing Edit on an appointment
+ * type that provably *has* a schedule. A load state wearing an empty state's
+ * words is worse than a spinner: it reads as a verdict, and on a slow
+ * connection it is the only thing the modal ever says. A failed read is named
+ * as a failure for the same reason - it is not the same fact as "none exist".
+ *
  * **Host is a specific member, never a team.** There is no groups read in
  * this bridge, so a round-robin team host stays a Console-only capability -
- * defaults to whoever is signed in, with an optional picker from the
- * workspace's own roster.
+ * defaults to whoever is signed in on create, with an optional picker from
+ * the workspace's own roster. **Editing a group-hosted row is refused
+ * inline** - the modal shows a notice instead of a form, because this
+ * surface cannot represent (and so cannot safely resend) a team host.
+ *
+ * This outer component only decides *which* message or form to show; the
+ * form itself is `EventTypeFields` below, mounted with `key={editing?.id}` -
+ * see that component's own doc comment for why.
  */
-export function ConnectEventTypeFormModal({ isOpen, onOpenChange, onCreated, }) {
-    const { session } = useConnect();
+export function ConnectEventTypeFormModal({ isOpen, onOpenChange, eventTypeId = null, onSaved, }) {
+    const isEdit = eventTypeId !== null;
     const { data: membersData } = useConnectWorkspaceMembers();
-    const { schedules } = useAvailabilitySchedules();
-    const members = useMemo(() => membersData?.members ?? [], [membersData]);
+    const { schedules, isLoading: isLoadingSchedules, error: schedulesError, } = useAvailabilitySchedules();
+    const { eventTypes: manageableEventTypes, isLoading: isLoadingEventTypes, error: eventTypesError, } = useManageableEventTypes();
+    const members = membersData?.members ?? [];
+    const editing = isEdit ? manageableEventTypes.find((row) => row.id === eventTypeId) ?? null : null;
+    /** A group host cannot be represented (or safely resent) by this form. */
+    const isUnrepresentableHost = isEdit && editing?.host.kind === "group";
+    /*
+     * Everything this modal decides from depends on a read, so the two
+     * not-yet-answered states come first - see this component's doc comment.
+     * An edit also waits for the row itself: `editing` is `null` both while the
+     * list is loading and when it has arrived without this id, and only the
+     * second of those is a real answer.
+     */
+    const isLoading = isLoadingSchedules || (isEdit && (isLoadingEventTypes || (!editing && !eventTypesError)));
+    const readError = schedulesError ?? (isEdit ? eventTypesError : null);
+    let body;
+    if (isLoading) {
+        body = _jsx("p", { className: "text-sm text-muted", children: "Loading\u2026" });
+    }
+    else if (readError) {
+        body = (_jsx("p", { className: "text-sm text-muted", children: "That could not be loaded just now. Close this and try again." }));
+    }
+    else if (isUnrepresentableHost) {
+        body = (_jsx("p", { className: "text-sm text-muted", children: "This appointment type is hosted by a team, which this screen cannot show or change. Edit it in Connect." }));
+    }
+    else if (schedules.length === 0) {
+        body = (_jsx("p", { className: "text-sm text-muted", children: "Set up availability first - an appointment type needs working hours to book against." }));
+    }
+    else if (isEdit && !editing) {
+        /*
+         * The list arrived and does not hold this id - deleted, or never visible
+         * to this caller. Distinct from the load above, which is why that one
+         * cannot be allowed to borrow these words either.
+         */
+        body = _jsx("p", { className: "text-sm text-muted", children: "That appointment type no longer exists." });
+    }
+    else {
+        body = (_jsx(EventTypeFields, { editing: editing, schedules: schedules, members: members, onCancel: () => onOpenChange(false), onSaved: (saved) => {
+                onSaved?.(saved);
+                onOpenChange(false);
+            } }, editing?.id ?? "create"));
+    }
+    return (_jsx(Modal, { isOpen: isOpen, onOpenChange: onOpenChange, children: _jsx(Modal.Backdrop, { children: _jsx(Modal.Container, { children: _jsxs(Modal.Dialog, { className: "sm:max-w-140", children: [_jsx(Modal.CloseTrigger, {}), _jsx(Modal.Header, { children: _jsx(Modal.Heading, { children: isEdit ? "Edit appointment type" : "New appointment type" }) }), _jsx(Modal.Body, { children: body })] }) }) }) }));
+}
+/**
+ * The form itself, mounted fresh (via the parent's `key`) for each distinct
+ * record it edits - or once for create. That remount is what initializes
+ * every field straight from `editing` with a plain `useState(initial)`
+ * rather than a `useEffect` copying it in after the fact: `editing` arrives
+ * asynchronously (`useManageableEventTypes` is a bridge read), and the
+ * parent already withholds this component until it has landed, so there is
+ * no later moment for a field to overwrite a half-typed edit.
+ */
+function EventTypeFields({ editing, schedules, members, onCancel, onSaved, }) {
+    const isEdit = editing !== null;
+    const { session } = useConnect();
     const defaultHostId = useMemo(() => {
         const self = members.find((member) => member.userId === session?.user?.userId);
         return self?.memberId ?? members[0]?.memberId ?? "";
     }, [members, session?.user?.userId]);
-    const [name, setName] = useState("");
-    const [description, setDescription] = useState("");
-    const [durationMinutes, setDurationMinutes] = useState(30);
-    const [bufferBefore, setBufferBefore] = useState(5);
-    const [bufferAfter, setBufferAfter] = useState(5);
-    const [scheduleId, setScheduleId] = useState("");
-    const [hostMemberId, setHostMemberId] = useState("");
-    const [locationKind, setLocationKind] = useState("phone");
-    const [locationValue, setLocationValue] = useState("");
+    const [name, setName] = useState(editing?.name ?? "");
+    const [description, setDescription] = useState(editing?.description ?? "");
+    const [durationMinutes, setDurationMinutes] = useState(editing?.durationMinutes ?? 30);
+    const [bufferBefore, setBufferBefore] = useState(editing?.bufferBeforeMinutes ?? 5);
+    const [bufferAfter, setBufferAfter] = useState(editing?.bufferAfterMinutes ?? 5);
+    const [scheduleId, setScheduleId] = useState(editing?.scheduleId ?? "");
+    const [hostMemberId, setHostMemberId] = useState(editing?.host.kind === "member" ? editing.host.memberId : "");
+    const [locationKind, setLocationKind] = useState(editing?.location.kind ?? "phone");
+    const [locationValue, setLocationValue] = useState(editing?.location.value ?? "");
     const effectiveScheduleId = scheduleId || schedules[0]?.id || "";
     const effectiveHostMemberId = hostMemberId || defaultHostId;
-    const { createEventType, isPending, error, clearError } = useCreateEventType();
+    const { createEventType, isPending: isCreating, error: createError, clearError: clearCreateError } = useCreateEventType();
+    const { updateEventType, isPending: isUpdating, error: updateError, clearError: clearUpdateError } = useUpdateEventType();
+    const isPending = isCreating || isUpdating;
+    const error = isEdit ? updateError : createError;
+    const clearError = isEdit ? clearUpdateError : clearCreateError;
     const isFormValid = name.trim().length > 0 &&
         durationMinutes >= 5 &&
         durationMinutes <= 480 &&
@@ -57,7 +130,7 @@ export function ConnectEventTypeFormModal({ isOpen, onOpenChange, onCreated, })
             return;
         clearError();
         const trimmedDescription = description.trim();
-        const created = await createEventType({
+        const shared = {
             name: name.trim(),
             description: trimmedDescription.length > 0 ? trimmedDescription : null,
             durationMinutes,
@@ -69,11 +142,12 @@ export function ConnectEventTypeFormModal({ isOpen, onOpenChange, onCreated, })
                 kind: locationKind,
                 value: locationValue.trim().length > 0 ? locationValue.trim() : null,
             },
-        });
-        if (created) {
-            onCreated?.(created);
-            onOpenChange(false);
-        }
+        };
+        const saved = isEdit
+            ? await updateEventType({ eventTypeId: editing.id, ...shared })
+            : await createEventType(shared);
+        if (saved)
+            onSaved(saved);
     };
-    return (_jsx(Modal, { isOpen: isOpen, onOpenChange: onOpenChange, children: _jsx(Modal.Backdrop, { children: _jsx(Modal.Container, { children: _jsxs(Modal.Dialog, { className: "sm:max-w-140", children: [_jsx(Modal.CloseTrigger, {}), _jsx(Modal.Header, { children: _jsx(Modal.Heading, { children: "New appointment type" }) }), _jsx(Modal.Body, { children: schedules.length === 0 ? (_jsx("p", { className: "text-sm text-muted", children: "Set up availability first - an appointment type needs working hours to book against." })) : (_jsxs("form", { onSubmit: handleSubmit, className: "flex flex-col gap-4", children: [_jsxs(TextField, { isRequired: true, variant: "secondary", children: [_jsx(Label, { children: "Name" }), _jsx(Input, { placeholder: "Consultation", value: name, onChange: (e) => setName(e.currentTarget.value), disabled: isPending, autoFocus: true })] }), _jsxs(TextField, { variant: "secondary", children: [_jsx(Label, { children: "Description" }), _jsx(TextArea, { placeholder: "What this appointment is for", value: description, onChange: (e) => setDescription(e.currentTarget.value), disabled: isPending, rows: 2 })] }), _jsxs("div", { className: "grid gap-4 sm:grid-cols-3", children: [_jsxs(TextField, { isRequired: true, variant: "secondary", children: [_jsx(Label, { children: "Length (min)" }), _jsx(Input, { type: "number", value: String(durationMinutes), onChange: (e) => setDurationMinutes(Number(e.currentTarget.value)), disabled: isPending })] }), _jsxs(TextField, { variant: "secondary", children: [_jsx(Label, { children: "Gap before" }), _jsx(Input, { type: "number", value: String(bufferBefore), onChange: (e) => setBufferBefore(Number(e.currentTarget.value)), disabled: isPending })] }), _jsxs(TextField, { variant: "secondary", children: [_jsx(Label, { children: "Gap after" }), _jsx(Input, { type: "number", value: String(bufferAfter), onChange: (e) => setBufferAfter(Number(e.currentTarget.value)), disabled: isPending })] })] }), schedules.length > 1 && (_jsxs(Select, { variant: "secondary", value: effectiveScheduleId, onChange: (value) => setScheduleId(String(value)), isDisabled: isPending, children: [_jsx(Label, { children: "Availability" }), _jsxs(Select.Trigger, { children: [_jsx(Select.Value, {}), _jsx(Select.Indicator, {})] }), _jsx(Select.Popover, { children: _jsx(ListBox, { children: schedules.map((schedule) => (_jsxs(ListBox.Item, { id: schedule.id, textValue: schedule.name, children: [schedule.name, _jsx(ListBox.ItemIndicator, {})] }, schedule.id))) }) })] })), members.length > 1 && (_jsxs(Select, { variant: "secondary", value: effectiveHostMemberId, onChange: (value) => setHostMemberId(String(value)), isDisabled: isPending, children: [_jsx(Label, { children: "Who hosts it" }), _jsxs(Select.Trigger, { children: [_jsx(Select.Value, {}), _jsx(Select.Indicator, {})] }), _jsx(Select.Popover, { children: _jsx(ListBox, { children: members.map((member) => (_jsxs(ListBox.Item, { id: member.memberId, textValue: member.displayName ?? member.email, children: [member.displayName ?? member.email, _jsx(ListBox.ItemIndicator, {})] }, member.memberId))) }) })] })), _jsxs("div", { className: "grid gap-4 sm:grid-cols-2", children: [_jsxs(Select, { variant: "secondary", value: locationKind, onChange: (value) => setLocationKind(value), isDisabled: isPending, children: [_jsx(Label, { children: "Where" }), _jsxs(Select.Trigger, { children: [_jsx(Select.Value, {}), _jsx(Select.Indicator, {})] }), _jsx(Select.Popover, { children: _jsx(ListBox, { children: LOCATION_KINDS.map((kind) => (_jsxs(ListBox.Item, { id: kind, textValue: LOCATION_LABELS[kind], children: [LOCATION_LABELS[kind], _jsx(ListBox.ItemIndicator, {})] }, kind))) }) })] }), _jsxs(TextField, { variant: "secondary", children: [_jsx(Label, { children: "Details" }), _jsx(TextArea, { placeholder: locationKind === "address" ? "Where to come" : "Left blank is fine", value: locationValue, onChange: (e) => setLocationValue(e.currentTarget.value), disabled: isPending, rows: 2 })] })] }), error && _jsx("p", { className: "text-sm text-danger", children: error }), _jsxs("div", { className: "flex justify-end gap-2", children: [_jsx(Button, { type: "button", variant: "secondary", onPress: () => onOpenChange(false), isDisabled: isPending, children: "Cancel" }), _jsx(Button, { type: "submit", variant: "primary", isDisabled: !isFormValid, children: isPending ? "Saving..." : "Create" })] })] })) })] }) }) }) }));
+    return (_jsxs("form", { onSubmit: handleSubmit, className: "flex flex-col gap-4", children: [_jsxs(TextField, { isRequired: true, variant: "secondary", children: [_jsx(Label, { children: "Name" }), _jsx(Input, { placeholder: "Consultation", value: name, onChange: (e) => setName(e.currentTarget.value), disabled: isPending, autoFocus: true })] }), _jsxs(TextField, { variant: "secondary", children: [_jsx(Label, { children: "Description" }), _jsx(TextArea, { placeholder: "What this appointment is for", value: description, onChange: (e) => setDescription(e.currentTarget.value), disabled: isPending, rows: 2 })] }), _jsxs("div", { className: "grid gap-4 sm:grid-cols-3", children: [_jsxs(TextField, { isRequired: true, variant: "secondary", children: [_jsx(Label, { children: "Length (min)" }), _jsx(Input, { type: "number", value: String(durationMinutes), onChange: (e) => setDurationMinutes(Number(e.currentTarget.value)), disabled: isPending })] }), _jsxs(TextField, { variant: "secondary", children: [_jsx(Label, { children: "Gap before" }), _jsx(Input, { type: "number", value: String(bufferBefore), onChange: (e) => setBufferBefore(Number(e.currentTarget.value)), disabled: isPending })] }), _jsxs(TextField, { variant: "secondary", children: [_jsx(Label, { children: "Gap after" }), _jsx(Input, { type: "number", value: String(bufferAfter), onChange: (e) => setBufferAfter(Number(e.currentTarget.value)), disabled: isPending })] })] }), schedules.length > 1 && (_jsxs(Select, { variant: "secondary", value: effectiveScheduleId, onChange: (value) => setScheduleId(String(value)), isDisabled: isPending, children: [_jsx(Label, { children: "Availability" }), _jsxs(Select.Trigger, { children: [_jsx(Select.Value, {}), _jsx(Select.Indicator, {})] }), _jsx(Select.Popover, { children: _jsx(ListBox, { children: schedules.map((schedule) => (_jsxs(ListBox.Item, { id: schedule.id, textValue: schedule.name, children: [schedule.name, _jsx(ListBox.ItemIndicator, {})] }, schedule.id))) }) })] })), members.length > 1 && (_jsxs(Select, { variant: "secondary", value: effectiveHostMemberId, onChange: (value) => setHostMemberId(String(value)), isDisabled: isPending, children: [_jsx(Label, { children: "Who hosts it" }), _jsxs(Select.Trigger, { children: [_jsx(Select.Value, {}), _jsx(Select.Indicator, {})] }), _jsx(Select.Popover, { children: _jsx(ListBox, { children: members.map((member) => (_jsxs(ListBox.Item, { id: member.memberId, textValue: member.displayName ?? member.email, children: [member.displayName ?? member.email, _jsx(ListBox.ItemIndicator, {})] }, member.memberId))) }) })] })), _jsxs("div", { className: "grid gap-4 sm:grid-cols-2", children: [_jsxs(Select, { variant: "secondary", value: locationKind, onChange: (value) => setLocationKind(value), isDisabled: isPending, children: [_jsx(Label, { children: "Where" }), _jsxs(Select.Trigger, { children: [_jsx(Select.Value, {}), _jsx(Select.Indicator, {})] }), _jsx(Select.Popover, { children: _jsx(ListBox, { children: LOCATION_KINDS.map((kind) => (_jsxs(ListBox.Item, { id: kind, textValue: LOCATION_LABELS[kind], children: [LOCATION_LABELS[kind], _jsx(ListBox.ItemIndicator, {})] }, kind))) }) })] }), _jsxs(TextField, { variant: "secondary", children: [_jsx(Label, { children: "Details" }), _jsx(TextArea, { placeholder: locationKind === "address" ? "Where to come" : "Left blank is fine", value: locationValue, onChange: (e) => setLocationValue(e.currentTarget.value), disabled: isPending, rows: 2 })] })] }), error && _jsx("p", { className: "text-sm text-danger", children: error }), _jsxs("div", { className: "flex justify-end gap-2", children: [_jsx(Button, { type: "button", variant: "secondary", onPress: onCancel, isDisabled: isPending, children: "Cancel" }), _jsx(Button, { type: "submit", variant: "primary", isDisabled: !isFormValid, children: isPending ? "Saving..." : isEdit ? "Save changes" : "Create" })] })] }));
 }

package/dist/esm/client/components/workspace-switcher.js

@@ -4,6 +4,7 @@ import { useState } from "react";
 import { Button, Dropdown, ListBox, Separator } from "@heroui/react";
 import { ChevronsUpDown, Plus } from "lucide-react";
 import { useConnect, useConnectUser, useConnectWorkspaces } from "../provider.js";
+import { ConnectCreateWorkspaceModal } from "./create-workspace-form.js";
 import { m } from "./motion.js";
 import { SidebarLabel, sidebarRowClass, useConnectShell } from "./shell-context.js";
 /** `Acme Logistics` -> `AL`. The collapsed rail's whole label for a workspace. */
@@ -11,9 +12,6 @@ function workspaceInitials(name) {
     const parts = name.trim().split(/\s+/).filter(Boolean);
     return (parts.slice(0, 2).map((part) => part[0]).join("") || "?").toUpperCase();
 }
-function openExternal(url) {
-    window.open(url, "_blank", "noopener,noreferrer");
-}
 /**
  * Switches which workspace this application is looking at.
  *
@@ -28,9 +26,9 @@ function openExternal(url) {
  * a workspace is *created*, so hiding it at one workspace would guarantee
  * nobody ever reached two. `alwaysShow` is the escape hatch for a partner
  * application that wants that same discoverability without becoming Connect:
- * it keeps the dropdown open below two workspaces and adds a row that sends
- * the member to Connect to actually create one, since there is nothing here
- * that can.
+ * it keeps the dropdown open below two workspaces and adds a row that opens
+ * `<ConnectCreateWorkspaceModal>` inline, auto-switching into the result when
+ * that is possible - see `handleCreated` below.
  *
  * **Authorization is the data, not a prop.** The list comes from the caller's
  * own session (`GET /workspaces` takes no user id), so a workspace the user
@@ -50,12 +48,13 @@ function openExternal(url) {
  * `onSwitched` defaults to.
  */
 export function ConnectWorkspaceSwitcher({ onSwitched, row = true, className, alwaysShow = false, }) {
-    const { mutateResource, appUrl } = useConnect();
+    const { mutateResource } = useConnect();
     const { collapsed } = useConnectShell();
     const user = useConnectUser();
-    const { data, isLoading } = useConnectWorkspaces();
+    const { data, isLoading, refetch } = useConnectWorkspaces();
     const [switching, setSwitching] = useState(null);
     const [error, setError] = useState(null);
+    const [isCreateOpen, setIsCreateOpen] = useState(false);
     const workspaces = data?.workspaces ?? [];
     // Nothing loaded yet. Deliberately renders `null` rather than a skeleton:
     // this sits in persistent chrome, and a placeholder that resolves to
@@ -90,11 +89,45 @@ export function ConnectWorkspaceSwitcher({ onSwitched, row = true, className, al
             setSwitching(null);
         }
     };
+    /**
+     * After a successful create: bring the new row into this list (it is
+     * created, not switched to - see `ConnectCreateWorkspaceModal`'s doc
+     * comment), then move into it when that is actually possible.
+     *
+     * Deliberately **not** `handleSwitch` - that function's `selectable()`
+     * guard requires `subscribed`, which a workspace this young never is, so
+     * calling it here would silently do nothing. `SwitchWorkspaceUseCase`
+     * itself has no subscription gate, only membership/MFA/audience, so this
+     * calls the bridge directly and only withholds on `inAudience` - a
+     * workspace of a type this application is not sold to, which `switch`
+     * really does refuse.
+     */
+    const handleCreated = async (workspace) => {
+        setIsCreateOpen(false);
+        refetch();
+        if (!workspace.inAudience)
+            return;
+        setSwitching(workspace.workspaceId);
+        setError(null);
+        try {
+            await mutateResource("/workspaces/switch", { workspaceId: workspace.workspaceId });
+            if (onSwitched) {
+                onSwitched(workspace);
+            }
+            else {
+                window.location.reload();
+            }
+        }
+        catch (cause) {
+            setError(cause instanceof Error ? cause.message : "Workspace created, but could not switch to it");
+            setSwitching(null);
+        }
+    };
     return (_jsxs("div", { className: row ? "" : className, children: [_jsxs(Dropdown, { children: [row ? (
                     // A 32px tile rather than a 20px glyph, so the initials land on the
                     // same optical centre the avatar below them uses - see
                     // `SIDEBAR_ROW_TILE`. Collapsed, this tile *is* the switcher.
-                    _jsxs(Button, { variant: "tertiary", "aria-label": `Workspace: ${label}. Switch workspace`, className: sidebarRowClass({ tile: true, className }), children: [_jsx("span", { className: "flex size-8 shrink-0 items-center justify-center rounded-lg bg-accent-soft text-xs font-semibold text-accent", children: workspaceInitials(label) }), _jsx(SidebarLabel, { className: "text-sm font-medium text-foreground", children: label }), _jsx(m.span, { className: "shrink-0 text-muted", animate: { opacity: collapsed ? 0 : 1 }, transition: collapsed ? { duration: 0.1 } : { duration: 0.18, delay: 0.1 }, "aria-hidden": true, children: _jsx(ChevronsUpDown, { className: "size-4" }) })] })) : (_jsxs(Button, { variant: "secondary", size: "sm", className: "w-full justify-between", children: [_jsx("span", { className: "truncate", children: label }), _jsx(ChevronsUpDown, { className: "size-4 shrink-0 text-muted", "aria-hidden": "true" })] })), _jsx(Dropdown.Popover, { children: _jsxs(ListBox, { children: [workspaces.map((workspace) => (_jsxs(ListBox.Item, { id: workspace.workspaceId, textValue: workspace.name, isDisabled: !selectable(workspace) || switching !== null, onAction: () => void handleSwitch(workspace), children: [_jsxs("div", { className: "min-w-0", children: [_jsx("p", { className: "truncate text-sm", children: workspace.name }), selectable(workspace) ? null : (_jsx("p", { className: "truncate text-xs text-muted", children: reasonUnavailable(workspace) }))] }), _jsx(ListBox.ItemIndicator, {})] }, workspace.workspaceId))), alwaysShow ? (_jsxs(_Fragment, { children: [workspaces.length > 0 && _jsx(Separator, {}), _jsxs(ListBox.Item, { id: "__create_workspace", textValue: "Create workspace", onAction: () => openExternal(appUrl), children: [_jsx(Plus, { className: "size-4 shrink-0 text-muted", "aria-hidden": true }), _jsx("p", { className: "truncate text-sm", children: "Create workspace" })] })] })) : null] }) })] }), error && !collapsed ? _jsx("p", { className: "mt-1 px-2 text-xs text-danger", children: error }) : null] }));
+                    _jsxs(Button, { variant: "tertiary", "aria-label": `Workspace: ${label}. Switch workspace`, className: sidebarRowClass({ tile: true, className }), children: [_jsx("span", { className: "flex size-8 shrink-0 items-center justify-center rounded-lg bg-accent-soft text-xs font-semibold text-accent", children: workspaceInitials(label) }), _jsx(SidebarLabel, { className: "text-sm font-medium text-foreground", children: label }), _jsx(m.span, { className: "shrink-0 text-muted", animate: { opacity: collapsed ? 0 : 1 }, transition: collapsed ? { duration: 0.1 } : { duration: 0.18, delay: 0.1 }, "aria-hidden": true, children: _jsx(ChevronsUpDown, { className: "size-4" }) })] })) : (_jsxs(Button, { variant: "secondary", size: "sm", className: "w-full justify-between", children: [_jsx("span", { className: "truncate", children: label }), _jsx(ChevronsUpDown, { className: "size-4 shrink-0 text-muted", "aria-hidden": "true" })] })), _jsx(Dropdown.Popover, { children: _jsxs(ListBox, { children: [workspaces.map((workspace) => (_jsxs(ListBox.Item, { id: workspace.workspaceId, textValue: workspace.name, isDisabled: !selectable(workspace) || switching !== null, onAction: () => void handleSwitch(workspace), children: [_jsxs("div", { className: "min-w-0", children: [_jsx("p", { className: "truncate text-sm", children: workspace.name }), selectable(workspace) ? null : (_jsx("p", { className: "truncate text-xs text-muted", children: reasonUnavailable(workspace) }))] }), _jsx(ListBox.ItemIndicator, {})] }, workspace.workspaceId))), alwaysShow ? (_jsxs(_Fragment, { children: [workspaces.length > 0 && _jsx(Separator, {}), _jsxs(ListBox.Item, { id: "__create_workspace", textValue: "Create workspace", onAction: () => setIsCreateOpen(true), children: [_jsx(Plus, { className: "size-4 shrink-0 text-muted", "aria-hidden": true }), _jsx("p", { className: "truncate text-sm", children: "Create workspace" })] })] })) : null] }) })] }), error && !collapsed ? _jsx("p", { className: "mt-1 px-2 text-xs text-danger", children: error }) : null, alwaysShow ? (_jsx(ConnectCreateWorkspaceModal, { isOpen: isCreateOpen, onOpenChange: setIsCreateOpen, onCreated: (workspace) => void handleCreated(workspace) })) : null] }));
 }
 /** Belongs to the user, and usable here. The same two facts `switch` enforces. */
 function selectable(workspace) {

package/dist/esm/client/index.js

@@ -147,6 +147,11 @@ isFreePlan,
 groupPlansByTier, resolvePlanGroup, } from "./components/plan-pricing.js";
 export { ConnectWorkspaceSwitcher } from "./components/workspace-switcher.js";
 export { useConnectWorkspaces, useConnectWorkspaceMembers } from "./provider.js";
+// The write half of the workspace switcher - opening another workspace under
+// the signed-in user's own tenant, from inside a host application rather
+// than a link-out to Connect's own "Create workspace" button.
+export { ConnectCreateWorkspaceModal } from "./components/create-workspace-form.js";
+export { useCreateWorkspace } from "./use-workspaces.js";
 export { ConnectBookingCalendar } from "./components/booking-calendar.js";
 export { ConnectBookingDialog, ConnectBookingDetail } from "./components/booking-dialogs.js";
 // The write half of scheduling - a workspace's own first-time setup, not a
@@ -155,5 +160,5 @@ export { ConnectBookingDialog, ConnectBookingDetail } from "./components/booking
 // step instead of a link-out to Connect's own Calendar settings.
 export { ConnectAvailabilityFormModal } from "./components/availability-form.js";
 export { ConnectEventTypeFormModal } from "./components/event-type-form.js";
-export { useBookableEventTypes, useAvailabilitySchedules, useCreateAvailabilitySchedule, useCreateEventType, useAvailableSlots, useBookings, useBookingActions, } from "./use-scheduling.js";
+export { useBookableEventTypes, useAvailabilitySchedules, useCreateAvailabilitySchedule, useUpdateAvailabilitySchedule, useManageableEventTypes, useCreateEventType, useUpdateEventType, useAvailableSlots, useBookings, useBookingActions, } from "./use-scheduling.js";
 export { layoutBookings, dayColumns, zonedInstant, } from "./components/booking-grid.js";

package/dist/esm/client/use-scheduling.js

@@ -25,6 +25,16 @@ export function useAvailabilitySchedules() {
     const { data, isLoading, error } = useConnectResource("/scheduling/schedules");
     return { schedules: data?.schedules ?? [], isLoading, error };
 }
+/**
+ * The richer read `ConnectEventTypeFormModal`'s edit mode needs - everything
+ * `useBookableEventTypes`'s booking catalogue deliberately withholds. See
+ * the bridge route's own doc comment for why this is a separate read rather
+ * than a wider response on that one. Includes inactive rows.
+ */
+export function useManageableEventTypes() {
+    const { data, isLoading, error, refetch } = useConnectResource("/scheduling/event-types/manage");
+    return { eventTypes: data?.eventTypes ?? [], isLoading, error, refetch };
+}
 /**
  * Gives a workspace its first working hours.
  *
@@ -41,6 +51,16 @@ export function useCreateAvailabilitySchedule() {
         createSchedule: (input) => run("/scheduling/schedules", input),
     };
 }
+/** Edits an existing availability schedule. Every field optional - send only what changed. */
+export function useUpdateAvailabilitySchedule() {
+    const { run, isPending, error, clearError } = useResourceAction();
+    return {
+        isPending,
+        error,
+        clearError,
+        updateSchedule: (input) => run("/scheduling/schedules/update", input),
+    };
+}
 /**
  * Creates the first thing a workspace can be booked for.
  *
@@ -57,6 +77,20 @@ export function useCreateEventType() {
         createEventType: (input) => run("/scheduling/event-types", input),
     };
 }
+/**
+ * Edits an existing appointment type. Every field optional - send only what
+ * changed. `hostMemberId` omitted leaves the host untouched, including a
+ * *group* host this surface cannot represent.
+ */
+export function useUpdateEventType() {
+    const { run, isPending, error, clearError } = useResourceAction();
+    return {
+        isPending,
+        error,
+        clearError,
+        updateEventType: (input) => run("/scheduling/event-types/update", input),
+    };
+}
 /**
  * Free times for one appointment type.
  *

package/dist/esm/client/use-workspaces.js

@@ -0,0 +1,38 @@
+"use client";
+import { useCallback, useState } from "react";
+import { useConnect } from "./provider.js";
+/**
+ * Opens another workspace under the tenant the signed-in user already owns.
+ *
+ * **Not optimistic**, same posture as every write in `use-scheduling.ts`:
+ * whether the tenant's plan still has room for another workspace is a
+ * question only the server can answer, and a modal that closes before that
+ * answer comes back is the lie a two-phase write exists to avoid.
+ *
+ * The result is a `UserWorkspace` row with `isActive`/`subscribed` both
+ * `false` - creating does not switch the session to it, and the workspace has
+ * no subscription yet. Pair with `<ConnectWorkspaceSwitcher>`'s own
+ * `mutateResource("/workspaces/switch", ...)` call to move into it, guarded
+ * on `inAudience` the same way that component's `selectable()` already is.
+ */
+export function useCreateWorkspace() {
+    const { mutateResource } = useConnect();
+    const [isPending, setPending] = useState(false);
+    const [error, setError] = useState(null);
+    const createWorkspace = useCallback(async (input) => {
+        setPending(true);
+        setError(null);
+        try {
+            const result = await mutateResource("/workspaces", input);
+            return result.workspace;
+        }
+        catch (cause) {
+            setError(cause instanceof Error ? cause.message : "Could not create that workspace.");
+            return null;
+        }
+        finally {
+            setPending(false);
+        }
+    }, [mutateResource]);
+    return { isPending, error, clearError: () => setError(null), createWorkspace };
+}

package/dist/esm/server/client.js

@@ -175,4 +175,4 @@ export class ConnectClient {
     }
 }
 /** Kept in step with `package.json` by `sdk.test.ts`. */
-export const SDK_VERSION = "0.38.0";
+export const SDK_VERSION = "0.40.0";

package/dist/esm/server/handler.js

@@ -738,8 +738,8 @@ export function createConnectHandler(options) {
          */
         "STORE": async (request) => storeRoute(request),
         /**
-         * The workspace switcher's three reads, forwarded with the caller's own
-         * session token.
+         * The workspace switcher's reads and writes, forwarded with the caller's
+         * own session token.
          *
          * `POST /workspaces/switch` is the only bridge route that *changes the
          * caller's session*, so it writes the new token back through the same
@@ -751,6 +751,14 @@ export function createConnectHandler(options) {
          * A partner with no `session.write` cannot re-persist a rotated token, so
          * switching is simply absent for them rather than half-working - the same
          * treatment `/signin` and `/callback` already get.
+         *
+         * `POST /workspaces` opens another workspace under the caller's own
+         * tenant and does not rotate anything - it does not switch the session,
+         * same as Connect's own "Create workspace" button. Every guard
+         * (ownership, the plan's workspace allowance, the business-email-domain
+         * rule) lives server-side in `CreateWorkspaceUseCase`; this route is a
+         * plain forward with the caller's session token, exactly like the reads
+         * beside it.
          */
         /*
          * Push notifications - the browser half, and deliberately only that half.
@@ -807,6 +815,20 @@ export function createConnectHandler(options) {
             return json(await client.push.revokeDevice(body.id, { asUser: token }));
         },
         "GET /workspaces": async (request) => json({ workspaces: await client.workspaces.list({ asUser: await requireToken(request) }) }),
+        "POST /workspaces": async (request) => {
+            const token = await requireToken(request);
+            const body = (await request.json().catch(() => null));
+            if (typeof body?.name !== "string" || (body.type !== "individual" && body.type !== "business")) {
+                throw new ConnectError({
+                    status: 400,
+                    code: "validation_error",
+                    message: "name and type are required",
+                    endpoint: "POST /workspaces",
+                });
+            }
+            const workspace = await client.workspaces.create({ name: body.name, type: body.type }, { asUser: token });
+            return json({ workspace });
+        },
         "GET /workspaces/members": async (request) => json({ members: await client.workspaces.members({ asUser: await requireToken(request) }) }),
         "POST /workspaces/switch": async (request) => {
             const token = await requireToken(request);
@@ -890,6 +912,58 @@ export function createConnectHandler(options) {
                 asUser,
             }), 201);
         },
+        /*
+         * The richer read `ConnectEventTypeFormModal`'s edit mode needs - see
+         * `listManageableEventTypes`'s own doc comment for why this is a separate
+         * route from the catalogue above rather than a wider response on it.
+         */
+        "GET /scheduling/event-types/manage": async (request) => {
+            const { workspaceId } = await requireWorkspace(request);
+            const asUser = await requireToken(request);
+            return json({
+                eventTypes: await client.scheduling.listManageableEventTypes(workspaceId, { asUser }),
+            });
+        },
+        /*
+         * A fixed path with the id in the body, not `/scheduling/event-types/{id}` -
+         * this table is matched by exact string, the same reason the booking
+         * actions below take their id this way rather than as a path segment.
+         */
+        "POST /scheduling/event-types/update": async (request) => {
+            const { workspaceId } = await requireWorkspace(request);
+            const asUser = await requireToken(request);
+            const body = (await request.json().catch(() => null));
+            if (typeof body?.eventTypeId !== "string") {
+                throw new ConnectError({
+                    status: 400,
+                    code: "validation_error",
+                    message: "eventTypeId is required",
+                    endpoint: "/scheduling/event-types/update",
+                });
+            }
+            return json(await client.scheduling.updateEventType({
+                workspaceId,
+                eventTypeId: body.eventTypeId,
+                name: typeof body.name === "string" ? body.name : undefined,
+                description: typeof body.description === "string" || body.description === null
+                    ? body.description
+                    : undefined,
+                durationMinutes: typeof body.durationMinutes === "number" ? body.durationMinutes : undefined,
+                bufferBeforeMinutes: typeof body.bufferBeforeMinutes === "number" ? body.bufferBeforeMinutes : undefined,
+                bufferAfterMinutes: typeof body.bufferAfterMinutes === "number" ? body.bufferAfterMinutes : undefined,
+                hostMemberId: typeof body.hostMemberId === "string" ? body.hostMemberId : undefined,
+                scheduleId: typeof body.scheduleId === "string" ? body.scheduleId : undefined,
+                location: body.location && typeof body.location.kind === "string"
+                    ? {
+                        kind: body.location.kind,
+                        value: typeof body.location.value === "string" ? body.location.value : null,
+                    }
+                    : undefined,
+                publicBookingEnabled: typeof body.publicBookingEnabled === "boolean" ? body.publicBookingEnabled : undefined,
+                active: typeof body.active === "boolean" ? body.active : undefined,
+                asUser,
+            }));
+        },
         /*
          * The working-hours templates an appointment type can point at - read
          * before a setup UI offers to create one, so it can tell "none yet" from
@@ -928,6 +1002,33 @@ export function createConnectHandler(options) {
                 asUser,
             }), 201);
         },
+        /*
+         * A fixed path with the id in the body, same reasoning as the event
+         * type's own `update` route above.
+         */
+        "POST /scheduling/schedules/update": async (request) => {
+            const { workspaceId } = await requireWorkspace(request);
+            const asUser = await requireToken(request);
+            const body = (await request.json().catch(() => null));
+            if (typeof body?.scheduleId !== "string") {
+                throw new ConnectError({
+                    status: 400,
+                    code: "validation_error",
+                    message: "scheduleId is required",
+                    endpoint: "/scheduling/schedules/update",
+                });
+            }
+            return json(await client.scheduling.updateSchedule({
+                workspaceId,
+                scheduleId: body.scheduleId,
+                name: typeof body.name === "string" ? body.name : undefined,
+                timezone: typeof body.timezone === "string" ? body.timezone : undefined,
+                weeklyHours: typeof body.weeklyHours === "object" && body.weeklyHours !== null
+                    ? body.weeklyHours
+                    : undefined,
+                asUser,
+            }));
+        },
         "GET /scheduling/slots": async (request) => {
             const { workspaceId } = await requireWorkspace(request);
             const asUser = await requireToken(request);

package/dist/esm/server/resources/scheduling.js

@@ -73,6 +73,9 @@ export class SchedulingResource {
      * Needs a schedule - create or pick one with `listSchedules`/`createSchedule`
      * first. The slug for a future public booking link is derived from `name`
      * server-side; you cannot choose one.
+     *
+     * Answers the richer *manageable* shape, not `BookableEventType` - you just
+     * created this row and are about to manage it, not book against it.
      */
     createEventType(input) {
         return request(this.transport, {
@@ -93,6 +96,70 @@ export class SchedulingResource {
             headers: actingAs(input.asUser),
         });
     }
+    /**
+     * The richer read `createEventType`/`updateEventType`'s edit mode needs -
+     * everything `listEventTypes`'s booking catalogue deliberately withholds,
+     * because this is the opposite audience: a member managing their own
+     * calendar, not a widget rendering someone else's. Includes inactive rows,
+     * since an edit screen is exactly where one gets reactivated.
+     */
+    async listManageableEventTypes(workspaceId, options = {}) {
+        const result = await request(this.transport, {
+            method: "GET",
+            path: "/scheduling/event-types/manage",
+            query: { workspaceId },
+            headers: actingAs(options.asUser),
+        });
+        return result.eventTypes ?? [];
+    }
+    /**
+     * Edits an existing availability schedule.
+     *
+     * Narrower than what the workspace's own Calendar settings can do, the
+     * same way `createSchedule` is: `ownerMemberId` and date overrides stay
+     * untouched, since this surface never sets either.
+     */
+    updateSchedule(input) {
+        return request(this.transport, {
+            method: "PUT",
+            path: `/scheduling/schedules/${encodeURIComponent(input.scheduleId)}`,
+            json: {
+                workspaceId: input.workspaceId,
+                name: input.name,
+                timezone: input.timezone,
+                weeklyHours: input.weeklyHours,
+            },
+            headers: actingAs(input.asUser),
+        });
+    }
+    /**
+     * Edits an existing appointment type.
+     *
+     * `hostMemberId` omitted leaves the host untouched, including a *group*
+     * host this surface cannot represent - so an edit that says nothing about
+     * the host can never accidentally overwrite a team assignment made in
+     * Connect.
+     */
+    updateEventType(input) {
+        return request(this.transport, {
+            method: "PUT",
+            path: `/scheduling/event-types/${encodeURIComponent(input.eventTypeId)}`,
+            json: {
+                workspaceId: input.workspaceId,
+                name: input.name,
+                description: input.description,
+                durationMinutes: input.durationMinutes,
+                bufferBeforeMinutes: input.bufferBeforeMinutes,
+                bufferAfterMinutes: input.bufferAfterMinutes,
+                hostMemberId: input.hostMemberId,
+                scheduleId: input.scheduleId,
+                location: input.location,
+                publicBookingEnabled: input.publicBookingEnabled,
+                active: input.active,
+            },
+            headers: actingAs(input.asUser),
+        });
+    }
     /**
      * Free times for one appointment type over one window.
      *