@kortix/ui 0.14.8 → 0.14.9

package/dist/workspace/spaces/create-channel-dialog.js

@@ -0,0 +1,158 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { ApiError } from '@kortix/sdk';
+import { useCreateProjectSpace, usePrivateChannelsAvailable, useUpdateProjectSpace } from '@kortix/sdk/react';
+import { spaceSlug } from '../../_vendor/kortix-shared.js';
+import { LockSimpleIcon } from '@phosphor-icons/react';
+import { useId, useState } from 'react';
+import { useTranslations } from '../../i18n/index.js';
+import { uiRoutes } from '../../lib/routes.js';
+import { Button } from '../../primitives/button.js';
+import { Field, FieldDescription, FieldGroup, FieldLabel } from '../../primitives/field.js';
+import { Input } from '../../primitives/input.js';
+import { Switch } from '../../primitives/switch.js';
+import Loading from '../../primitives/loading.js';
+import { Modal, ModalBody, ModalContent, ModalDescription, ModalFooter, ModalHeader, ModalTitle, } from '../../primitives/modal.js';
+import { useOptionalSidebar } from '../../primitives/sidebar.js';
+import { successToast } from '../../primitives/toast.js';
+import { UiLink as Link, useUiRouter } from '../../providers/ui-provider.js';
+/** The API accepts up to 80; the slug keeps the first 40 slug characters. */
+const NAME_MAX = 80;
+const DESCRIPTION_MAX = 160;
+/**
+ * "Create a channel": a name with a live `#slug` preview, an optional
+ * description and "Private" (only the people added to it see it), shown
+ * only where the spaces list says `private_channels_available`. Every error stays in the dialog (the SDK call does not toast).
+ * On success the dialog closes and the new channel opens.
+ *
+ * With `space` it renames that channel instead: the same fields, filled in,
+ * and the page follows the new slug.
+ */
+export function CreateChannelDialog({ projectId, open, onOpenChange, space, }) {
+    const t = useTranslations('spaces.create');
+    const tI18nComplete = useTranslations('hardcodedUi.i18nComplete');
+    const id = useId();
+    const router = useUiRouter();
+    const sidebar = useOptionalSidebar();
+    const create = useCreateProjectSpace(projectId);
+    const update = useUpdateProjectSpace(projectId);
+    const pending = create.isPending || update.isPending;
+    const [name, setName] = useState('');
+    const [description, setDescription] = useState('');
+    const [isPrivate, setIsPrivate] = useState(false);
+    // "Private" shows only where the server allows it.
+    const privateAvailable = usePrivateChannelsAvailable(projectId).data === true;
+    const [error, setError] = useState(null);
+    // A rename opens on the channel's current name and description (set while
+    // rendering, the moment it opens, so the first frame already shows them).
+    const fillFor = open && space ? space.space_id : null;
+    const [filledFor, setFilledFor] = useState(null);
+    if (fillFor !== filledFor) {
+        setFilledFor(fillFor);
+        if (space && fillFor) {
+            setName(space.name);
+            setDescription(space.description ?? '');
+        }
+    }
+    const slug = spaceSlug(name);
+    // A manager outside a private channel renames it and nothing else (D1), from the private-channel list.
+    const nameOnly = space?.visibility === 'private' && space.is_member === false;
+    const close = () => {
+        if (pending)
+            return;
+        setName('');
+        setDescription('');
+        setIsPrivate(false);
+        setError(null);
+        onOpenChange(false);
+    };
+    const onError = (err) => {
+        if (err instanceof ApiError && err.status === 409 && err.code === 'slug_taken') {
+            const archivedId = err.data?.archived === true && typeof err.data.space_id === 'string' ? err.data.space_id : null;
+            setError({ kind: 'taken', slug, archivedId, canEdit: err.data?.can_edit !== false });
+        }
+        else if (err instanceof ApiError && err.status === 400 && err.code === 'invalid_name') {
+            setError({ kind: 'invalid' });
+        }
+        else if (err instanceof ApiError && err.status === 409 && err.code === 'private_channels_unavailable') {
+            setError({ kind: 'unavailable' });
+        }
+        else {
+            setError({ kind: 'failed' });
+        }
+    };
+    const submit = () => {
+        if (pending)
+            return;
+        if (!name.trim())
+            return setError({ kind: 'empty' });
+        if (!slug)
+            return setError({ kind: 'invalid' });
+        const done = (saved) => {
+            setName('');
+            setDescription('');
+            setIsPrivate(false);
+            setError(null);
+            onOpenChange(false);
+            const href = uiRoutes().channel(projectId, saved.slug ?? slug);
+            if (space) {
+                successToast(t('renamed'));
+                if (saved.slug !== space.slug && !nameOnly)
+                    router.replace(href);
+                return;
+            }
+            successToast(t('created'));
+            // On a phone the dialog opens from the sidebar sheet: close it so the channel shows.
+            sidebar?.setOpenMobile(false);
+            router.push(href);
+        };
+        if (space) {
+            update.mutate({
+                spaceId: space.space_id,
+                input: {
+                    name: name.trim(),
+                    // Only a changed description is sent.
+                    ...(description.trim() !== (space.description ?? '') ? { description: description.trim() || null } : {}),
+                },
+            }, { onSuccess: done, onError });
+            return;
+        }
+        create.mutate({
+            name: name.trim(),
+            ...(description.trim() ? { description: description.trim() } : {}),
+            ...(isPrivate ? { visibility: 'private' } : {}),
+        }, { onSuccess: done, onError });
+    };
+    let errorText = null;
+    if (error?.kind === 'empty')
+        errorText = t('nameRequired');
+    else if (error?.kind === 'invalid')
+        errorText = t('invalidName');
+    else if (error?.kind === 'failed')
+        errorText = t(space ? 'renameFailed' : 'failed');
+    else if (error?.kind === 'unavailable')
+        errorText = t('privateUnavailable');
+    else if (error?.kind === 'taken') {
+        const { slug: takenSlug, archivedId, canEdit } = error;
+        // An archived channel's page offers Unarchive when it knows the channel's id
+        // and the caller may edit the channel; otherwise it says who may.
+        const takenHref = uiRoutes().channel(projectId, takenSlug);
+        const archivedQuery = archivedId ? `?archived=${encodeURIComponent(archivedId)}${canEdit ? '' : '&locked=1'}` : '';
+        errorText = t.rich('slugTaken', {
+            slug: takenSlug,
+            link: (chunks) => (_jsx(Link, { href: `${takenHref}${archivedQuery}`, onClick: close, className: "text-foreground underline underline-offset-4", children: chunks })),
+        });
+    }
+    return (_jsx(Modal, { open: open, onOpenChange: (next) => !next && close(), children: _jsxs(ModalContent, { className: "lg:max-w-md", children: [_jsxs(ModalHeader, { children: [_jsx(ModalTitle, { children: t(space ? 'renameTitle' : 'title') }), _jsx(ModalDescription, { children: t(space ? 'renameDescription' : isPrivate ? 'descriptionPrivate' : 'description') })] }), _jsxs("form", { onSubmit: (event) => {
+                        event.preventDefault();
+                        submit();
+                    }, children: [_jsx(ModalBody, { children: _jsxs(FieldGroup, { className: "gap-5", children: [_jsxs(Field, { className: "gap-1.5", children: [_jsx(FieldLabel, { htmlFor: `${id}-name`, children: t('nameLabel') }), _jsx(Input, { id: `${id}-name`, autoComplete: "off", spellCheck: false, autoFocus: true, value: name, maxLength: NAME_MAX, placeholder: t('namePlaceholder'), "aria-invalid": error && error.kind !== 'failed' && error.kind !== 'unavailable' ? true : undefined, "aria-describedby": `${id}-name-hint`, onChange: (event) => {
+                                                    setName(event.target.value);
+                                                    if (error)
+                                                        setError(null);
+                                                } }), _jsxs(FieldDescription, { id: `${id}-name-hint`, className: error ? 'text-destructive' : 'font-mono', children: [_jsx("span", { "aria-live": "polite", children: errorText }), errorText ? null : `#${slug || t('slugPlaceholder')}`] })] }), nameOnly ? null : _jsxs(Field, { className: "gap-1.5", children: [_jsx(FieldLabel, { htmlFor: `${id}-description`, children: t('descriptionLabel') }), _jsx(Input, { id: `${id}-description`, autoComplete: "off", value: description, maxLength: DESCRIPTION_MAX, placeholder: t('descriptionPlaceholder'), onChange: (event) => setDescription(event.target.value) })] }), space || !privateAvailable ? null : (_jsxs(Field, { orientation: "horizontal", className: "items-start justify-between gap-4", children: [_jsxs("div", { className: "min-w-0 space-y-0.5", children: [_jsxs(FieldLabel, { htmlFor: `${id}-private`, className: "flex items-center gap-1.5", children: [_jsx(LockSimpleIcon, { className: "size-3.5 shrink-0" }), t('privateLabel')] }), _jsxs(FieldDescription, { id: `${id}-private-hint`, children: [t('privateHint'), " ", t('privateLimits')] })] }), _jsx(Switch, { id: `${id}-private`, checked: isPrivate, "aria-describedby": `${id}-private-hint`, onCheckedChange: (next) => {
+                                                    setIsPrivate(next);
+                                                    if (error?.kind === 'unavailable')
+                                                        setError(null);
+                                                }, disabled: pending, className: "mt-0.5 shrink-0" })] }))] }) }), _jsxs(ModalFooter, { className: "sm:justify-between", children: [_jsx(Button, { type: "button", variant: "outline-ghost", onClick: close, disabled: pending, children: tI18nComplete.raw('text19766ed6ccb2') }), _jsxs(Button, { type: "submit", disabled: pending, "aria-busy": pending || undefined, children: [pending ? _jsx(Loading, { className: "size-4 shrink-0" }) : null, t(space ? 'save' : 'submit')] })] })] })] }) }));
+}

package/dist/workspace/spaces/private-channels-not-in.d.ts

@@ -0,0 +1,9 @@
+/**
+ * Project managers only: a quiet sidebar row under Channels that opens the
+ * private channels they are not in (owner decision D1). They rename, archive
+ * and add people there, never read the channel. A channel its last member left
+ * is recovered here. Hidden for everyone else and when there is none.
+ */
+export declare function PrivateChannelsNotInRow({ projectId }: {
+    projectId: string;
+}): import("react").JSX.Element | null;

package/dist/workspace/spaces/private-channels-not-in.js

@@ -0,0 +1,69 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { usePrivateChannelsNotIn, useUpdateProjectSpace } from '@kortix/sdk/react';
+import { DotsThreeIcon, LockSimpleIcon } from '@phosphor-icons/react';
+import { useState } from 'react';
+import { useTranslations } from '../../i18n/index.js';
+import { PROJECT_ACTIONS } from '../../internal/lib/project-actions.js';
+import { useProjectCan } from '../../internal/lib/use-project-can.js';
+import { Badge } from '../../primitives/badge.js';
+import { Button } from '../../primitives/button.js';
+import { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuTrigger } from '../../primitives/dropdown-menu.js';
+import { Modal, ModalBody, ModalContent, ModalDescription, ModalHeader, ModalTitle } from '../../primitives/modal.js';
+import { SidebarMenuButton, SidebarMenuItem } from '../../primitives/sidebar.js';
+import { errorToast, successToast } from '../../primitives/toast.js';
+import { CreateChannelDialog } from './create-channel-dialog.js';
+import { AddChannelMembersDialog } from './space-members.js';
+/**
+ * The channel as the rename and add-people dialogs read it. A manager outside
+ * it is not a member and may not edit its agents or description (D1).
+ */
+function asSpace(channel) {
+    return {
+        space_id: channel.space_id,
+        kind: 'channel',
+        slug: channel.slug,
+        name: channel.name,
+        description: null,
+        is_default: false,
+        dm_agent_name: null,
+        archived_at: channel.archived_at,
+        created_at: channel.created_at,
+        updated_at: channel.created_at,
+        can_edit: false,
+        agents: [],
+        is_member: false,
+        visibility: 'private',
+    };
+}
+/**
+ * Project managers only: a quiet sidebar row under Channels that opens the
+ * private channels they are not in (owner decision D1). They rename, archive
+ * and add people there, never read the channel. A channel its last member left
+ * is recovered here. Hidden for everyone else and when there is none.
+ */
+export function PrivateChannelsNotInRow({ projectId }) {
+    const t = useTranslations('spaces.privateNotIn');
+    const manager = useProjectCan(projectId, PROJECT_ACTIONS.PROJECT_MEMBERS_MANAGE).allowed === true;
+    const list = usePrivateChannelsNotIn(projectId, { enabled: manager });
+    const [open, setOpen] = useState(false);
+    const channels = list.data ?? [];
+    if (!manager || channels.length === 0)
+        return null;
+    return (_jsxs(_Fragment, { children: [_jsx(SidebarMenuItem, { children: _jsxs(SidebarMenuButton, { onClick: () => setOpen(true), className: "text-muted-foreground hover:text-sidebar-foreground", children: [_jsx(LockSimpleIcon, {}), _jsx("span", { className: "truncate", children: t('row') }), _jsx("span", { className: "ml-auto text-xs tabular-nums", children: channels.length })] }) }), _jsx(Modal, { open: open, onOpenChange: setOpen, children: _jsxs(ModalContent, { className: "lg:max-w-md", children: [_jsxs(ModalHeader, { children: [_jsx(ModalTitle, { children: t('title') }), _jsx(ModalDescription, { children: t('description') })] }), _jsx(ModalBody, { className: "space-y-px", children: channels.map((channel) => (_jsx(PrivateChannelRow, { projectId: projectId, channel: channel }, channel.space_id))) })] }) })] }));
+}
+function PrivateChannelRow({ projectId, channel }) {
+    const t = useTranslations('spaces.privateNotIn');
+    const update = useUpdateProjectSpace(projectId);
+    const [renaming, setRenaming] = useState(false);
+    const [adding, setAdding] = useState(false);
+    const space = asSpace(channel);
+    const archived = channel.archived_at !== null;
+    const setArchived = (next) => update.mutate({ spaceId: channel.space_id, input: { archived: next } }, {
+        onSuccess: () => successToast(t(next ? 'archivedToast' : 'unarchivedToast', { name: channel.slug })),
+        onError: () => errorToast(t('failed', { name: channel.slug })),
+    });
+    return (_jsxs("div", { className: "flex items-center gap-3 rounded-md px-2 py-2", children: [_jsx(LockSimpleIcon, { className: "text-muted-foreground size-4 shrink-0" }), _jsxs("div", { className: "min-w-0 flex-1", children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx("span", { className: "truncate text-sm font-medium", children: channel.slug }), archived ? _jsx(Badge, { variant: "secondary", children: t('archived') }) : null] }), _jsx("p", { className: "text-muted-foreground truncate text-xs", children: channel.created_by_name
+                            ? t('meta', { count: channel.member_count, name: channel.created_by_name })
+                            : t('metaNoCreator', { count: channel.member_count }) })] }), _jsxs(DropdownMenu, { children: [_jsx(DropdownMenuTrigger, { asChild: true, children: _jsx(Button, { variant: "ghost", size: "icon-sm", className: "text-muted-foreground shrink-0", "aria-label": t('menu', { name: channel.slug }), disabled: update.isPending, children: _jsx(DotsThreeIcon, { className: "size-4" }) }) }), _jsxs(DropdownMenuContent, { align: "end", children: [archived ? null : _jsx(DropdownMenuItem, { onSelect: () => setAdding(true), children: t('addPeople') }), _jsx(DropdownMenuItem, { onSelect: () => setRenaming(true), children: t('rename') }), _jsx(DropdownMenuItem, { onSelect: () => setArchived(!archived), children: t(archived ? 'unarchive' : 'archive') })] })] }), _jsx(CreateChannelDialog, { projectId: projectId, open: renaming, onOpenChange: setRenaming, space: space }), _jsx(AddChannelMembersDialog, { projectId: projectId, space: space, open: adding, onOpenChange: setAdding })] }));
+}

package/dist/workspace/spaces/space-agents.d.ts

@@ -0,0 +1,10 @@
+import type { ProjectSpace } from '@kortix/sdk';
+/**
+ * The channel's agents the project still offers, in the channel's order: the
+ * first is the default a new thread starts on. Empty when the channel has no
+ * agent list (then the project's default applies, as before).
+ */
+export declare function offeredChannelAgents(space: Pick<ProjectSpace, 'agents'> | null | undefined, offered: readonly {
+    name: string;
+}[]): string[];
+export { channelRunnableAgents } from '../../session/composer/composer-agent-access.js';

package/dist/workspace/spaces/space-agents.js

@@ -0,0 +1,10 @@
+/**
+ * The channel's agents the project still offers, in the channel's order: the
+ * first is the default a new thread starts on. Empty when the channel has no
+ * agent list (then the project's default applies, as before).
+ */
+export function offeredChannelAgents(space, offered) {
+    const names = new Set(offered.map((agent) => agent.name));
+    return (space?.agents ?? []).filter((name) => names.has(name));
+}
+export { channelRunnableAgents } from '../../session/composer/composer-agent-access.js';

package/dist/workspace/spaces/space-details-dialog.d.ts

@@ -0,0 +1,20 @@
+import { type ProjectSpace } from '@kortix/sdk';
+export type SpaceDetailsTab = 'about' | 'members';
+/**
+ * A channel's details, opened from `# name` in the header or the roster's
+ * "View all members": About (name, description, default agent, who can see
+ * it, when it was made, Leave, Archive) and Members (one list of its people,
+ * then its agents). The pencils, Archive and the agent row menus show only
+ * to the channel's creator or a project manager (`can_edit`). "Add members"
+ * shows to whoever may add people (`can_add`: a member, the creator, a
+ * manager) or edit the channel; its picker offers each only what they may add.
+ */
+export declare function SpaceDetailsDialog({ space, tab, onTabChange, onOpenChange, onEdit, onArchive, }: {
+    space: ProjectSpace;
+    /** Null: closed. */
+    tab: SpaceDetailsTab | null;
+    onTabChange: (tab: SpaceDetailsTab) => void;
+    onOpenChange: (open: boolean) => void;
+    onEdit: () => void;
+    onArchive: () => void;
+}): import("react").JSX.Element;

package/dist/workspace/spaces/space-details-dialog.js

@@ -0,0 +1,176 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { getProjectDetail } from '@kortix/sdk';
+import { contract, qk, useLeaveProjectSpace, usePrivateChannelsAvailable, useProjectSpaceMembers, useProjectTriggers, useRemoveProjectSpaceMember, useUpdateProjectSpace, } from '@kortix/sdk/react';
+import { DotsThreeIcon, MagnifyingGlassIcon, PencilSimpleIcon, PlusIcon } from '@phosphor-icons/react';
+import { useQuery } from '@tanstack/react-query';
+import { useMemo, useState } from 'react';
+import { useLocale, useTranslations } from '../../i18n/index.js';
+import { AgentMark } from '../../internal/components/agent-mark.js';
+import { Button } from '../../primitives/button.js';
+import { ConfirmDialog } from '../../primitives/confirm-dialog.js';
+import { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuTrigger, } from '../../primitives/dropdown-menu.js';
+import Hint from '../../primitives/hint.js';
+import { InputGroupSearch, InputGroupSearchClear, InputGroupSearchIcon, InputGroupSearchInput, } from '../../primitives/input-group.js';
+import { Modal, ModalBody, ModalContent, ModalHeader, ModalTitle } from '../../primitives/modal.js';
+import Loading from '../../primitives/loading.js';
+import { Skeleton } from '../../primitives/skeleton.js';
+import { Tabs, TabsContent, TabsList, TabsTrigger } from '../../primitives/tabs.js';
+import { errorToast, successToast } from '../../primitives/toast.js';
+import { useSessionIds } from '../../providers/session-ids.js';
+import { ChannelGlyph } from './channel-glyph.js';
+import { AddChannelMembersDialog, MemberAvatar } from './space-members.js';
+import { agentLabel } from './space-timeline.js';
+/**
+ * A channel's details, opened from `# name` in the header or the roster's
+ * "View all members": About (name, description, default agent, who can see
+ * it, when it was made, Leave, Archive) and Members (one list of its people,
+ * then its agents). The pencils, Archive and the agent row menus show only
+ * to the channel's creator or a project manager (`can_edit`). "Add members"
+ * shows to whoever may add people (`can_add`: a member, the creator, a
+ * manager) or edit the channel; its picker offers each only what they may add.
+ */
+export function SpaceDetailsDialog({ space, tab, onTabChange, onOpenChange, onEdit, onArchive, }) {
+    const t = useTranslations('spaces.details');
+    const { projectId } = useSessionIds();
+    const [adding, setAdding] = useState(false);
+    return (_jsxs(_Fragment, { children: [_jsx(Modal, { open: tab !== null, onOpenChange: onOpenChange, children: _jsxs(ModalContent, { className: "lg:max-w-md", children: [_jsx(ModalHeader, { children: _jsxs(ModalTitle, { className: "flex min-w-0 items-center gap-1", children: [_jsx(ChannelGlyph, { visibility: space.visibility, className: "size-4 shrink-0" }), _jsx("span", { className: "truncate", children: space.slug })] }) }), _jsxs(Tabs, { value: tab ?? 'about', onValueChange: (value) => onTabChange(value), className: "gap-0", children: [_jsxs(TabsList, { type: "underline", size: "sm", className: "w-full shrink-0 justify-start gap-4 px-5", children: [_jsx(TabsTrigger, { value: "about", className: "w-fit flex-none", children: t('about') }), _jsx(TabsTrigger, { value: "members", className: "w-fit flex-none", children: t('members') })] }), _jsx(TabsContent, { value: "about", children: _jsx(AboutPane, { space: space, onEdit: onEdit, onArchive: onArchive }) }), _jsx(TabsContent, { value: "members", children: projectId ? (_jsx(MembersPane, { projectId: projectId, space: space, onAdd: () => setAdding(true) })) : null })] })] }) }), projectId ? (_jsx(AddChannelMembersDialog, { projectId: projectId, space: space, open: adding, onOpenChange: setAdding })) : null] }));
+}
+/** Label over value, a pencil at the row's end: the channel's facts, one per row. */
+function AboutPane({ space, onEdit, onArchive }) {
+    const t = useTranslations('spaces.details');
+    const locale = useLocale();
+    const { projectId } = useSessionIds();
+    // A message that names no agent goes to the project's default agent.
+    const detail = useQuery({
+        queryKey: qk.project.detail(projectId ?? ''),
+        queryFn: () => getProjectDetail(projectId),
+        enabled: !!projectId,
+        ...contract('config'),
+    });
+    // A channel with an agent list starts a new thread on its first agent.
+    const channelDefault = space.agents?.[0] ?? null;
+    const defaultAgent = channelDefault ?? detail.data?.config.default_agent ?? detail.data?.config.open_code_default_agent ?? null;
+    const created = new Date(space.created_at).toLocaleDateString(locale, { dateStyle: 'medium' });
+    // Its creator or a project manager; an older API sends no `can_edit`.
+    const editable = space.can_edit !== false;
+    const edit = (field) => (editable ? _jsx(EditButton, { field: field, onClick: onEdit }) : null);
+    // "Make private" shows only where the server allows private channels.
+    const privateAvailable = usePrivateChannelsAvailable(projectId).data === true;
+    return (_jsxs(ModalBody, { className: "pt-1", children: [_jsxs("dl", { className: "divide-border divide-y", children: [_jsxs(DetailRow, { label: t('name'), action: edit(t('name')), children: ["#", space.slug] }), _jsx(DetailRow, { label: t('description'), action: edit(t('description')), children: space.description || _jsx("span", { className: "text-muted-foreground", children: t('noDescription') }) }), defaultAgent ? (_jsx(DetailRow, { label: t('defaultAgent'), hint: channelDefault ? t('channelDefaultHint') : t('defaultAgentHint'), children: _jsxs("span", { className: "flex items-center gap-2", children: [_jsx(AgentMark, { slug: defaultAgent, size: 14 }), agentLabel(defaultAgent)] }) })) : null, _jsx(DetailRow, { label: t('visibility'), action: editable && privateAvailable && !space.is_default && space.visibility !== 'private' && projectId ? (_jsx(MakePrivateButton, { projectId: projectId, space: space })) : null, children: space.visibility === 'private' ? t('visibilityPrivate') : t('visibilityProject') }), _jsx(DetailRow, { label: t('created'), children: created })] }), _jsx(LeaveRow, { projectId: projectId ?? null, space: space }), space.is_default || !editable ? null : (_jsxs("div", { className: "flex items-center justify-between gap-4 border-t pt-4", children: [_jsxs("div", { className: "min-w-0", children: [_jsx("p", { className: "text-sm font-medium", children: t('archiveTitle') }), _jsx("p", { className: "text-muted-foreground text-xs text-pretty", children: t('archiveHint') })] }), _jsx(Button, { variant: "destructive", size: "sm", onClick: onArchive, children: t('archive') })] }))] }));
+}
+/**
+ * Search and "Add members" on one row, then one flat list of everyone in the
+ * channel: you, the other people A–Z by display name (never an email), then
+ * the channel's agents in order, the first tagged Default. A person row's menu
+ * is Leave channel on your own row and Remove on another's when you may; an
+ * agent row's menu (Make default, Remove) shows to whoever may edit the
+ * channel. People and agents not in the channel are only in the "Add members"
+ * picker. A private channel ends the list with one line on who can see it.
+ * `#general` is every project member, with no menus. The search filters the list.
+ */
+function MembersPane({ projectId, space, onAdd }) {
+    const t = useTranslations('spaces.details');
+    const editable = space.can_edit !== false;
+    const name = space.slug ?? space.name;
+    const update = useUpdateProjectSpace(projectId);
+    const members = useProjectSpaceMembers(projectId, space.space_id);
+    const canAdd = members.data?.can_add === true;
+    const [query, setQuery] = useState('');
+    const needle = query.trim().toLowerCase();
+    const agents = useMemo(() => space.agents ?? [], [space.agents]);
+    const people = useMemo(() => [...(members.data?.members ?? [])].sort((a, b) => Number(b.is_viewer) - Number(a.is_viewer) || a.name.localeCompare(b.name)), [members.data]);
+    const shownPeople = people.filter((person) => !needle || person.name.toLowerCase().includes(needle));
+    const shownAgents = agents.filter((agent) => !needle || agentLabel(agent).toLowerCase().includes(needle) || agent.toLowerCase().includes(needle));
+    const save = (next, done) => update.mutate({ spaceId: space.space_id, input: { agents: next } }, { onSuccess: () => successToast(done), onError: () => errorToast(t('agentsFailed')) });
+    return (_jsxs(ModalBody, { className: "space-y-4 pt-4", children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsxs(InputGroupSearch, { className: "flex-1", children: [_jsx(InputGroupSearchIcon, { children: _jsx(MagnifyingGlassIcon, {}) }), _jsx(InputGroupSearchInput, { placeholder: t('search'), "aria-label": t('find'), value: query, onChange: (event) => setQuery(event.target.value), size: "sm" }), _jsx(InputGroupSearchClear, { onClick: () => setQuery('') })] }), canAdd || editable ? (_jsxs(Button, { size: "sm", variant: "secondary", className: "shrink-0 gap-1.5", onClick: onAdd, children: [_jsx(PlusIcon, { className: "size-4 shrink-0" }), t('addMembers')] })) : null] }), members.isLoading ? (_jsx("div", { className: "space-y-1", children: [0, 1, 2].map((index) => (_jsxs("div", { className: "flex min-h-10 items-center gap-2.5", children: [_jsx(Skeleton, { className: "size-7 rounded-full" }), _jsx(Skeleton, { className: "h-3.5 w-32" })] }, index))) })) : needle && shownPeople.length + shownAgents.length === 0 ? (_jsx("p", { className: "text-muted-foreground px-3 py-6 text-center text-xs", children: t('noMatches', { query: query.trim() }) })) : (_jsxs("div", { className: "space-y-2", children: [_jsxs("ul", { className: "-mx-2", children: [shownPeople.map((person) => (_jsx(MemberRow, { avatar: _jsx(MemberAvatar, { member: person }), name: person.name, tag: person.is_viewer ? t('you') : null, trailing: person.can_remove ? _jsx(PersonMenu, { projectId: projectId, space: space, person: person }) : null }, person.user_id))), shownAgents.map((agent) => {
+                                const isDefault = agent === agents[0];
+                                const label = agentLabel(agent);
+                                return (_jsx(MemberRow, { avatar: _jsx(AgentMark, { slug: agent, size: 21 }), name: label, tag: isDefault ? t('defaultTag') : t('agentTag'), trailing: editable ? (_jsxs(DropdownMenu, { children: [_jsx(DropdownMenuTrigger, { asChild: true, children: _jsx(Button, { variant: "ghost", size: "icon-sm", className: "text-muted-foreground shrink-0", "aria-label": t('agentMenu', { agent: label }), disabled: update.isPending, children: _jsx(DotsThreeIcon, { className: "size-4" }) }) }), _jsxs(DropdownMenuContent, { align: "end", children: [isDefault ? null : (_jsx(DropdownMenuItem, { onSelect: () => save([agent, ...agents.filter((item) => item !== agent)], t('defaultSet', { agent: label, name })), children: t('makeDefault') })), _jsx(DropdownMenuItem, { onSelect: () => save(agents.filter((item) => item !== agent), t('agentRemoved', { agent: label, name })), children: t('removeAgent', { name }) })] })] })) : null }, agent));
+                            })] }), space.visibility === 'private' && !needle ? (_jsx("p", { className: "text-muted-foreground text-xs text-pretty", children: t('privateNote', { name }) })) : null] }))] }));
+}
+/**
+ * "Make private", for the channel's creator or a project manager, behind a
+ * confirm that says what changes: only members see
+ * it from then on, the people who started a thread or added a link become
+ * members, everyone else loses it, it cannot be made public again, and the
+ * triggers that post into it stop (the API refuses a trigger run into a
+ * private channel).
+ */
+function MakePrivateButton({ projectId, space }) {
+    const t = useTranslations('spaces.details');
+    const update = useUpdateProjectSpace(projectId);
+    const [open, setOpen] = useState(false);
+    // Read once the confirm opens: the count the warning names.
+    const triggers = useProjectTriggers(open ? projectId : null);
+    const triggerCount = triggers.data?.triggers.filter((trigger) => trigger.space_id === space.space_id).length ?? 0;
+    const name = space.slug ?? space.name;
+    return (_jsxs(_Fragment, { children: [_jsx(Button, { variant: "outline", size: "sm", className: "shrink-0", onClick: () => setOpen(true), children: t('makePrivate') }), _jsx(ConfirmDialog, { open: open, onOpenChange: setOpen, title: t('makePrivateTitle', { name }), description: _jsxs("div", { className: "space-y-2", children: [_jsx("p", { children: t('makePrivateWho', { name }) }), _jsx("p", { children: t('makePrivateLeave') }), _jsx("p", { children: t('makePrivateFinal') }), triggerCount > 0 ? _jsx("p", { children: t('makePrivateTriggers', { count: triggerCount }) }) : null, _jsx("p", { children: t('privateLimits') })] }), confirmLabel: t('makePrivate'), isPending: update.isPending, onConfirm: () => update.mutate({ spaceId: space.space_id, input: { visibility: 'private' } }, {
+                    onSuccess: () => {
+                        setOpen(false);
+                        successToast(t('madePrivate', { name }));
+                    },
+                    // The app's mutation default toasts the server's reason (a 409
+                    // `private_channels_unavailable` included); a second toast here would repeat it.
+                }) })] }));
+}
+/** "Leave this channel" for a member who may leave (not the creator, nobody in `#general`). A private channel asks first. */
+function LeaveRow({ projectId, space }) {
+    const t = useTranslations('spaces.details');
+    const members = useProjectSpaceMembers(projectId, space.is_default ? null : space.space_id);
+    const leave = useLeaveProjectSpace(projectId ?? '', space.space_id);
+    const [confirming, setConfirming] = useState(false);
+    const self = members.data?.members.find((member) => member.is_viewer);
+    if (!projectId || !self?.can_remove)
+        return null;
+    const name = space.slug ?? space.name;
+    const isPrivate = space.visibility === 'private';
+    const run = () => leave.mutate(undefined, {
+        onSuccess: () => successToast(t('left', { name })),
+        onError: () => errorToast(t('peopleFailed')),
+    });
+    return (_jsxs("div", { className: "flex items-center justify-between gap-4 border-t pt-4", children: [_jsxs("div", { className: "min-w-0", children: [_jsx("p", { className: "text-sm font-medium", children: t('leaveTitle') }), _jsx("p", { className: "text-muted-foreground text-xs text-pretty", children: isPrivate ? t('leaveHintPrivate') : t('leaveHint') })] }), _jsxs(Button, { variant: "outline", size: "sm", disabled: leave.isPending, "aria-busy": leave.isPending || undefined, onClick: () => (isPrivate ? setConfirming(true) : run()), children: [leave.isPending ? _jsx(Loading, { className: "size-4 shrink-0" }) : null, t('leave')] }), _jsx(LeavePrivateConfirm, { name: name, open: confirming, onOpenChange: setConfirming, pending: leave.isPending, onConfirm: run })] }));
+}
+/** The confirm before leaving a private channel: leaving takes away every thread of it, the leaver's own too. */
+function LeavePrivateConfirm({ name, open, onOpenChange, pending, onConfirm, }) {
+    const t = useTranslations('spaces.details');
+    return (_jsx(ConfirmDialog, { open: open, onOpenChange: onOpenChange, title: t('leavePrivateTitle', { name }), description: t('leaveHintPrivate'), confirmLabel: t('leave'), confirmVariant: "destructive", isPending: pending, onConfirm: () => {
+            onOpenChange(false);
+            onConfirm();
+        } }));
+}
+/** A person row's menu: Leave channel on your own row, Remove from #name on another's. */
+function PersonMenu({ projectId, space, person }) {
+    const t = useTranslations('spaces.details');
+    const name = space.slug ?? space.name;
+    const remove = useRemoveProjectSpaceMember(projectId, space.space_id);
+    const leave = useLeaveProjectSpace(projectId, space.space_id);
+    const pending = remove.isPending || leave.isPending;
+    const [confirming, setConfirming] = useState(false);
+    const runLeave = () => leave.mutate(undefined, {
+        onSuccess: () => successToast(t('left', { name })),
+        onError: () => errorToast(t('peopleFailed')),
+    });
+    const onSelect = () => person.is_viewer
+        ? space.visibility === 'private'
+            ? setConfirming(true)
+            : runLeave()
+        : remove.mutate(person.user_id, {
+            onSuccess: () => successToast(t('personRemoved', { person: person.name, name })),
+            onError: () => errorToast(t('peopleFailed')),
+        });
+    return (_jsxs(DropdownMenu, { children: [_jsx(DropdownMenuTrigger, { asChild: true, children: _jsx(Button, { variant: "ghost", size: "icon-sm", className: "text-muted-foreground shrink-0", "aria-label": t('personMenu', { person: person.name }), disabled: pending, children: _jsx(DotsThreeIcon, { className: "size-4" }) }) }), _jsx(DropdownMenuContent, { align: "end", children: _jsx(DropdownMenuItem, { onSelect: onSelect, children: person.is_viewer ? t('leave') : t('removePerson', { name }) }) }), _jsx(LeavePrivateConfirm, { name: name, open: confirming, onOpenChange: setConfirming, pending: leave.isPending, onConfirm: runLeave })] }));
+}
+/** Avatar, name, a muted tag ("(you)", "Agent", "Default"), then the row's menu. No hover fill: the row itself is not clickable. */
+function MemberRow({ avatar, name, tag, trailing }) {
+    return (_jsxs("li", { className: "flex min-h-10 items-center gap-2.5 px-2", children: [_jsx("span", { className: "flex size-8 shrink-0 items-center justify-center", children: avatar }), _jsxs("span", { className: "flex min-w-0 flex-1 items-baseline gap-1.5", children: [_jsx("span", { className: "truncate text-sm font-medium", children: name }), tag ? _jsx("span", { className: "text-muted-foreground shrink-0 text-xs", children: tag }) : null] }), trailing] }));
+}
+function DetailRow({ label, hint, action, children, }) {
+    return (_jsxs("div", { className: "flex items-start justify-between gap-4 py-3", children: [_jsxs("div", { className: "min-w-0 space-y-0.5", children: [_jsx("dt", { className: "text-muted-foreground text-xs font-medium", children: label }), _jsx("dd", { className: "text-sm text-pretty wrap-anywhere", children: children }), hint ? _jsx("p", { className: "text-muted-foreground text-xs text-pretty", children: hint }) : null] }), action] }));
+}
+/** A pencil, named for the row it edits: a screen reader has no row. */
+function EditButton({ field, onClick }) {
+    const t = useTranslations('spaces.details');
+    const label = t('editField', { field });
+    return (_jsx(Hint, { label: label, side: "left", children: _jsx(Button, { variant: "ghost", size: "icon-sm", className: "text-muted-foreground shrink-0", "aria-label": label, onClick: onClick, children: _jsx(PencilSimpleIcon, { className: "size-3.5" }) }) }));
+}

package/dist/workspace/spaces/space-link-label.d.ts

@@ -0,0 +1,49 @@
+/**
+ * How the Links tab names a link: the server's title when it has one, else,
+ * without fetching it, the decoded path ("file/Pricing page") under the host
+ * ("paper.design"). A link with no path is named by its host.
+ */
+/** The host without `www.`; the raw text when it does not parse. */
+export declare function linkHost(url: string): string;
+/** The path and query, decoded, without the outer slashes; '' for a bare host. */
+export declare function linkPathTitle(url: string): string;
+/**
+ * The row's title: the server's `display_title` (the title a member gave, else
+ * the page's fetched title), else the title a member gave, else the path, else the host.
+ */
+export declare function linkTitle(link: {
+    url: string;
+    title: string | null;
+    display_title?: string | null;
+}): string;
+/** The Added filter's windows: the Threads tab's Activity values. */
+export declare const LINK_ADDED: readonly ["today", "last7", "last30"];
+export type LinkAdded = (typeof LINK_ADDED)[number];
+/**
+ * The Links tab's search and filters, as the URL holds them
+ * (`?q=&pinned=1&by=&added=`). `by` is `me` or a user id.
+ */
+export interface LinkFilters {
+    q: string;
+    pinned: boolean;
+    by: string | null;
+    added: LinkAdded | null;
+}
+export declare function linkFiltersFromParams(params: {
+    get(name: string): string | null;
+}): LinkFilters;
+type FilterableLink = {
+    url: string;
+    title: string | null;
+    display_title?: string | null;
+    site_name?: string | null;
+    pinned: boolean;
+    created_by: string | null;
+    last_shared_at: string;
+};
+/**
+ * The links that match: the search reads the title, the site name, the host and
+ * the URL (case-insensitive); `by: 'me'` reads `viewerId`; Added reads the last share.
+ */
+export declare function filterLinks<T extends FilterableLink>(links: readonly T[], filters: LinkFilters, viewerId: string | undefined, now: Date): T[];
+export {};

package/dist/workspace/spaces/space-link-label.js

@@ -0,0 +1,73 @@
+/**
+ * How the Links tab names a link: the server's title when it has one, else,
+ * without fetching it, the decoded path ("file/Pricing page") under the host
+ * ("paper.design"). A link with no path is named by its host.
+ */
+/** The host without `www.`; the raw text when it does not parse. */
+export function linkHost(url) {
+    try {
+        return new URL(url).hostname.replace(/^www\./, '');
+    }
+    catch {
+        return url;
+    }
+}
+/** The path and query, decoded, without the outer slashes; '' for a bare host. */
+export function linkPathTitle(url) {
+    let pathname;
+    let search;
+    try {
+        ({ pathname, search } = new URL(url));
+    }
+    catch {
+        return '';
+    }
+    // `+` means a space in a query only; in a path it is a plus (`wiki/C++`).
+    const text = decode(pathname) + decode(search.replace(/\+/g, ' '));
+    return text.replace(/^\/+|\/+$/g, '').replace(/\s+/g, ' ').trim();
+}
+/** A malformed escape stays as written. */
+function decode(raw) {
+    try {
+        return decodeURIComponent(raw);
+    }
+    catch {
+        return raw;
+    }
+}
+/**
+ * The row's title: the server's `display_title` (the title a member gave, else
+ * the page's fetched title), else the title a member gave, else the path, else the host.
+ */
+export function linkTitle(link) {
+    return link.display_title?.trim() || link.title?.trim() || linkPathTitle(link.url) || linkHost(link.url);
+}
+/** The Added filter's windows: the Threads tab's Activity values. */
+export const LINK_ADDED = ['today', 'last7', 'last30'];
+export function linkFiltersFromParams(params) {
+    const added = params.get('added');
+    return {
+        q: params.get('q')?.trim() ?? '',
+        pinned: params.get('pinned') === '1',
+        by: params.get('by') || null,
+        added: LINK_ADDED.find((value) => value === added) ?? null,
+    };
+}
+/** Local midnight today, 6 days earlier (7 days with today) or 29 days earlier. */
+function linkAddedSince(added, now) {
+    const days = added === 'today' ? 0 : added === 'last7' ? 6 : 29;
+    return new Date(now.getFullYear(), now.getMonth(), now.getDate() - days).getTime();
+}
+/**
+ * The links that match: the search reads the title, the site name, the host and
+ * the URL (case-insensitive); `by: 'me'` reads `viewerId`; Added reads the last share.
+ */
+export function filterLinks(links, filters, viewerId, now) {
+    const q = filters.q.toLowerCase();
+    const by = filters.by === 'me' ? viewerId : filters.by;
+    const since = filters.added ? linkAddedSince(filters.added, now) : null;
+    return links.filter((link) => (!filters.pinned || link.pinned) &&
+        (!filters.by || link.created_by === by) &&
+        (since === null || Date.parse(link.last_shared_at) >= since) &&
+        (!q || [linkTitle(link), link.site_name ?? '', linkHost(link.url), link.url].some((text) => text.toLowerCase().includes(q))));
+}

package/dist/workspace/spaces/space-links.d.ts

@@ -0,0 +1,19 @@
+import { type ProjectSpace } from '@kortix/sdk';
+/**
+ * A channel's Links tab, laid out like its Threads tab: one toolbar (search,
+ * the Filter menu, the active filters, "Add link"), then one list on one left
+ * edge. Pinned links come first under "Pinned"; the others follow by the day
+ * they were last shared (Today, Yesterday, Earlier). The channel's links all
+ * load at once, so search and filters read the loaded list. The URL holds
+ * them (`?q=&pinned=1&by=&added=`).
+ */
+export declare function SpaceLinks({ projectId, space, place, onOpenThread, params, setParams, }: {
+    projectId: string;
+    space: ProjectSpace;
+    place: string;
+    onOpenThread?: (sessionId: string) => void;
+    params: {
+        get(name: string): string | null;
+    };
+    setParams: (change: (params: URLSearchParams) => void) => void;
+}): import("react").JSX.Element;