@agent-native/core 0.12.35 → 0.12.36
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -92,7 +92,7 @@ export function ExtensionsListPage() {
|
|
|
92
92
|
queryClient.invalidateQueries({ queryKey: ["extensions"] });
|
|
93
93
|
}
|
|
94
94
|
};
|
|
95
|
-
return (_jsxs("div", { className: "flex h-full w-full flex-col", children: [_jsxs("header", { className: "flex h-12 items-center justify-between border-b px-4 shrink-0", children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx(Link, { to: "/", className: "inline-flex h-8 w-8 items-center justify-center rounded-md text-muted-foreground hover:bg-accent hover:text-foreground", "aria-label": "Back to app", children: _jsx(IconArrowLeft, { className: "h-4 w-4" }) }), _jsx("h1", { className: "text-sm font-semibold", children: "Extensions" })] }), _jsxs("div", { className: "flex items-center gap-2", children: [_jsxs(Popover, { open: showCreate, onOpenChange: setShowCreate, children: [_jsx(PopoverTrigger, { asChild: true, children: _jsxs("button", { type: "button", className: "inline-flex cursor-pointer items-center justify-center gap-1.5 rounded-md bg-primary px-3 py-1.5 text-sm font-medium text-primary-foreground hover:bg-primary/90", children: [_jsx(IconPlus, { className: "h-4 w-4" }), "New Extension"] }) }), _jsxs(PopoverContent, { align: "end", sideOffset: 6, className: "w-[420px] p-3", children: [_jsx("p", { className: "px-1 pb-2 text-sm font-semibold text-foreground", children: "New extension" }), _jsx(PromptComposer, { autoFocus: true, placeholder: "Describe what you'd like to build...", draftScope: "extensions:create-popover", onSubmit: handleCreate })] })] }), _jsx(NotificationsBell, {}), _jsx(AgentToggleButton, {})] })] }), _jsx("div", { className: "flex-1 overflow-auto px-5 py-8 sm:px-8 sm:py-10", children: isLoading ? (_jsx("div", { className: "grid grid-cols-1 gap-5 sm:grid-cols-2 lg:grid-cols-3", children: Array.from({ length: 6 }).map((_, i) => (_jsxs("div", { className: "rounded-lg border border-border bg-card p-5", children: [_jsx("div", { className: "mb-3 h-10 w-10 rounded-lg bg-muted animate-pulse" }), _jsx("div", { className: "mb-2 h-4 w-2/3 rounded bg-muted animate-pulse" }), _jsx("div", { className: "h-3 w-4/5 rounded bg-muted animate-pulse" })] }, i))) })) : toolList.length === 0 ? (_jsx("div", { className: "flex min-h-[calc(100vh-9rem)] flex-col items-center justify-start px-2 pb-12 pt-[clamp(5rem,18vh,11rem)] sm:pb-16", children: _jsxs("div", { className: "mx-auto flex w-full max-w-[34rem] flex-col gap-7", children: [_jsxs("div", { className: "flex flex-col items-center gap-3 text-center", children: [_jsx(IconTool, { className: "h-10 w-10 text-muted-foreground/40" }), _jsxs("div", { className: "space-y-1.5", children: [_jsx("p", { className: "text-base font-semibold text-foreground", children: "Create your first extension" }), _jsx("p", { className: "mx-auto max-w-sm text-sm text-muted-foreground", children: "Describe
|
|
95
|
+
return (_jsxs("div", { className: "flex h-full w-full flex-col", children: [_jsxs("header", { className: "flex h-12 items-center justify-between border-b px-4 shrink-0", children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx(Link, { to: "/", className: "inline-flex h-8 w-8 items-center justify-center rounded-md text-muted-foreground hover:bg-accent hover:text-foreground", "aria-label": "Back to app", children: _jsx(IconArrowLeft, { className: "h-4 w-4" }) }), _jsx("h1", { className: "text-sm font-semibold", children: "Extensions" })] }), _jsxs("div", { className: "flex items-center gap-2", children: [_jsxs(Popover, { open: showCreate, onOpenChange: setShowCreate, children: [_jsx(PopoverTrigger, { asChild: true, children: _jsxs("button", { type: "button", className: "inline-flex cursor-pointer items-center justify-center gap-1.5 rounded-md bg-primary px-3 py-1.5 text-sm font-medium text-primary-foreground hover:bg-primary/90", children: [_jsx(IconPlus, { className: "h-4 w-4" }), "New Extension"] }) }), _jsxs(PopoverContent, { align: "end", sideOffset: 6, className: "w-[420px] p-3", children: [_jsx("p", { className: "px-1 pb-2 text-sm font-semibold text-foreground", children: "New extension" }), _jsx(PromptComposer, { autoFocus: true, placeholder: "Describe what you'd like to build...", draftScope: "extensions:create-popover", onSubmit: handleCreate })] })] }), _jsx(NotificationsBell, {}), _jsx(AgentToggleButton, {})] })] }), _jsx("div", { className: "flex-1 overflow-auto px-5 py-8 sm:px-8 sm:py-10", children: isLoading ? (_jsx("div", { className: "grid grid-cols-1 gap-5 sm:grid-cols-2 lg:grid-cols-3", children: Array.from({ length: 6 }).map((_, i) => (_jsxs("div", { className: "rounded-lg border border-border bg-card p-5", children: [_jsx("div", { className: "mb-3 h-10 w-10 rounded-lg bg-muted animate-pulse" }), _jsx("div", { className: "mb-2 h-4 w-2/3 rounded bg-muted animate-pulse" }), _jsx("div", { className: "h-3 w-4/5 rounded bg-muted animate-pulse" })] }, i))) })) : toolList.length === 0 ? (_jsx("div", { className: "flex min-h-[calc(100vh-9rem)] flex-col items-center justify-start px-2 pb-12 pt-[clamp(5rem,18vh,11rem)] sm:pb-16", children: _jsxs("div", { className: "mx-auto flex w-full max-w-[34rem] flex-col gap-7", children: [_jsxs("div", { className: "flex flex-col items-center gap-3 text-center", children: [_jsx(IconTool, { className: "h-10 w-10 text-muted-foreground/40" }), _jsxs("div", { className: "space-y-1.5", children: [_jsx("p", { className: "text-base font-semibold text-foreground", children: "Create your first extension" }), _jsx("p", { className: "mx-auto max-w-sm text-sm text-muted-foreground", children: "Describe a small app and the agent will build it." })] })] }), _jsx(CreateToolInput, { className: "w-full" })] }) })) : (_jsx("div", { className: "grid grid-cols-1 gap-5 sm:grid-cols-2 lg:grid-cols-3", children: toolList.map((extension) => (_jsxs("div", { className: cn("group relative rounded-lg border border-border bg-card", "hover:border-primary/30 hover:shadow-sm"), children: [_jsxs(Link, { to: `/extensions/${extension.id}`, className: "block p-5 pr-12", children: [_jsx("div", { className: "mb-3 flex h-10 w-10 items-center justify-center rounded-lg bg-muted text-muted-foreground group-hover:bg-primary/10 group-hover:text-primary", children: _jsx(IconTool, { className: "h-5 w-5" }) }), _jsx("h3", { className: "mb-1 text-sm font-semibold text-foreground", children: extension.name }), extension.description && (_jsx("p", { className: "line-clamp-2 text-xs text-muted-foreground", children: extension.description }))] }), _jsxs(Popover, { open: confirmDeleteId === extension.id, onOpenChange: (open) => setConfirmDeleteId(open ? extension.id : null), children: [_jsx(PopoverTrigger, { asChild: true, children: _jsx("button", { type: "button", className: "absolute right-3 top-3 inline-flex h-8 w-8 items-center justify-center rounded-md text-muted-foreground opacity-0 hover:bg-accent hover:text-foreground focus:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring group-hover:opacity-100", "aria-label": `Options for ${extension.name}`, children: _jsx(IconDotsVertical, { className: "h-4 w-4" }) }) }), _jsx(PopoverContent, { align: "end", sideOffset: 4, className: "w-64 p-0", children: _jsxs("div", { className: "p-3", children: [_jsxs("p", { className: "text-[12px]", children: [extension.canDelete === false ? "Remove " : "Delete ", _jsx("span", { className: "font-medium", children: extension.name }), "?", extension.canDelete === false
|
|
96
96
|
? " This hides it from your Extensions list without deleting it for anyone else."
|
|
97
97
|
: " This removes it everywhere it is shared."] }), _jsxs("div", { className: "mt-3 flex justify-end gap-1", children: [_jsx("button", { type: "button", onClick: () => setConfirmDeleteId(null), className: "rounded-md px-2 py-1 text-[12px] hover:bg-accent", children: "Cancel" }), _jsxs("button", { type: "button", onClick: () => handleDelete(extension), disabled: deletingId === extension.id, className: cn("inline-flex items-center gap-1.5 rounded-md bg-destructive px-2 py-1 text-[12px] text-destructive-foreground hover:bg-destructive/90", deletingId === extension.id && "opacity-60"), children: [_jsx(IconTrash, { className: "h-3.5 w-3.5" }), deletingId === extension.id
|
|
98
98
|
? extension.canDelete === false
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ExtensionsListPage.js","sourceRoot":"","sources":["../../../src/client/extensions/ExtensionsListPage.tsx"],"names":[],"mappings":"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","sourcesContent":["import { agentNativePath } from \"../api-path.js\";\nimport { useState, useEffect } from \"react\";\nimport { useQuery, useQueryClient } from \"@tanstack/react-query\";\nimport { Link } from \"react-router\";\nimport {\n IconArrowLeft,\n IconDotsVertical,\n IconPlus,\n IconTool,\n IconTrash,\n} from \"@tabler/icons-react\";\nimport { cn } from \"../utils.js\";\nimport { AgentToggleButton } from \"../AgentPanel.js\";\nimport { NotificationsBell } from \"../notifications/NotificationsBell.js\";\nimport { sendToAgentChat } from \"../agent-chat.js\";\nimport { PromptComposer } from \"../composer/PromptComposer.js\";\nimport {\n Popover,\n PopoverContent,\n PopoverTrigger,\n} from \"../components/ui/popover.js\";\nimport {\n TOOLS_ORDER_CHANGE_EVENT,\n applyToolsOrder,\n getToolsOrder,\n} from \"./extension-order.js\";\nimport {\n deleteOrHideExtension,\n invalidateExtensionRemoval,\n} from \"./delete-extension.js\";\n\ninterface Extension {\n id: string;\n name: string;\n description?: string;\n icon?: string;\n canDelete?: boolean;\n}\n\nlet lastCreateSubmission: { prompt: string; at: number } | null = null;\n\nfunction submitCreateTool(prompt: string) {\n const trimmed = prompt.trim();\n if (!trimmed) return;\n const now = Date.now();\n if (\n lastCreateSubmission &&\n lastCreateSubmission.prompt === trimmed &&\n now - lastCreateSubmission.at < 2_000\n ) {\n return;\n }\n lastCreateSubmission = { prompt: trimmed, at: now };\n sendToAgentChat({\n message: `Create an extension: ${trimmed}`,\n submit: true,\n openSidebar: true,\n newTab: true,\n });\n}\n\nfunction CreateToolInput({ className }: { className?: string }) {\n return (\n <div className={cn(\"flex flex-col gap-2 text-left\", className)}>\n <p className=\"px-1 text-sm font-medium text-foreground\">\n What should it do?\n </p>\n <PromptComposer\n autoFocus\n className=\"text-left\"\n placeholder=\"A todo list, API dashboard, calculator...\"\n draftScope=\"extensions:create\"\n onSubmit={(text) => submitCreateTool(text)}\n />\n </div>\n );\n}\n\nexport function ExtensionsListPage() {\n const [showCreate, setShowCreate] = useState(false);\n const [confirmDeleteId, setConfirmDeleteId] = useState<string | null>(null);\n const [deletingId, setDeletingId] = useState<string | null>(null);\n const queryClient = useQueryClient();\n const [toolOrderState, setToolOrderState] = useState<string[]>(() =>\n typeof window !== \"undefined\" ? getToolsOrder() : [],\n );\n\n useEffect(() => {\n fetch(agentNativePath(\"/_agent-native/application-state/navigation\"), {\n method: \"PUT\",\n headers: { \"Content-Type\": \"application/json\" },\n body: JSON.stringify({ view: \"extensions\" }),\n }).catch(() => {});\n }, []);\n\n useEffect(() => {\n if (typeof window === \"undefined\") return;\n const syncOrder = () => setToolOrderState(getToolsOrder());\n window.addEventListener(TOOLS_ORDER_CHANGE_EVENT, syncOrder);\n window.addEventListener(\"storage\", syncOrder);\n return () => {\n window.removeEventListener(TOOLS_ORDER_CHANGE_EVENT, syncOrder);\n window.removeEventListener(\"storage\", syncOrder);\n };\n }, []);\n\n const { data: extensions, isLoading } = useQuery<Extension[]>({\n queryKey: [\"extensions\"],\n queryFn: async () => {\n const res = await fetch(agentNativePath(\"/_agent-native/extensions\"));\n if (!res.ok) return [];\n return res.json();\n },\n });\n\n const toolList =\n toolOrderState.length > 0\n ? applyToolsOrder(extensions ?? [], toolOrderState)\n : (extensions ?? []);\n\n const handleCreate = (text: string) => {\n submitCreateTool(text);\n setShowCreate(false);\n };\n\n const handleDelete = async (extension: Extension) => {\n setDeletingId(extension.id);\n const previous = queryClient.getQueryData<Extension[]>([\"extensions\"]);\n queryClient.setQueryData<Extension[]>([\"extensions\"], (old) =>\n (old ?? []).filter((item) => item.id !== extension.id),\n );\n try {\n await deleteOrHideExtension(extension);\n invalidateExtensionRemoval(queryClient, extension.id);\n } catch {\n if (previous) queryClient.setQueryData([\"extensions\"], previous);\n } finally {\n setDeletingId(null);\n setConfirmDeleteId(null);\n queryClient.invalidateQueries({ queryKey: [\"extensions\"] });\n }\n };\n\n return (\n <div className=\"flex h-full w-full flex-col\">\n <header className=\"flex h-12 items-center justify-between border-b px-4 shrink-0\">\n <div className=\"flex items-center gap-2\">\n <Link\n to=\"/\"\n className=\"inline-flex h-8 w-8 items-center justify-center rounded-md text-muted-foreground hover:bg-accent hover:text-foreground\"\n aria-label=\"Back to app\"\n >\n <IconArrowLeft className=\"h-4 w-4\" />\n </Link>\n <h1 className=\"text-sm font-semibold\">Extensions</h1>\n </div>\n <div className=\"flex items-center gap-2\">\n <Popover open={showCreate} onOpenChange={setShowCreate}>\n <PopoverTrigger asChild>\n <button\n type=\"button\"\n className=\"inline-flex cursor-pointer items-center justify-center gap-1.5 rounded-md bg-primary px-3 py-1.5 text-sm font-medium text-primary-foreground hover:bg-primary/90\"\n >\n <IconPlus className=\"h-4 w-4\" />\n New Extension\n </button>\n </PopoverTrigger>\n <PopoverContent\n align=\"end\"\n sideOffset={6}\n className=\"w-[420px] p-3\"\n >\n <p className=\"px-1 pb-2 text-sm font-semibold text-foreground\">\n New extension\n </p>\n <PromptComposer\n autoFocus\n placeholder=\"Describe what you'd like to build...\"\n draftScope=\"extensions:create-popover\"\n onSubmit={handleCreate}\n />\n </PopoverContent>\n </Popover>\n <NotificationsBell />\n <AgentToggleButton />\n </div>\n </header>\n\n <div className=\"flex-1 overflow-auto px-5 py-8 sm:px-8 sm:py-10\">\n {isLoading ? (\n <div className=\"grid grid-cols-1 gap-5 sm:grid-cols-2 lg:grid-cols-3\">\n {Array.from({ length: 6 }).map((_, i) => (\n <div\n key={i}\n className=\"rounded-lg border border-border bg-card p-5\"\n >\n <div className=\"mb-3 h-10 w-10 rounded-lg bg-muted animate-pulse\" />\n <div className=\"mb-2 h-4 w-2/3 rounded bg-muted animate-pulse\" />\n <div className=\"h-3 w-4/5 rounded bg-muted animate-pulse\" />\n </div>\n ))}\n </div>\n ) : toolList.length === 0 ? (\n <div className=\"flex min-h-[calc(100vh-9rem)] flex-col items-center justify-start px-2 pb-12 pt-[clamp(5rem,18vh,11rem)] sm:pb-16\">\n <div className=\"mx-auto flex w-full max-w-[34rem] flex-col gap-7\">\n <div className=\"flex flex-col items-center gap-3 text-center\">\n <IconTool className=\"h-10 w-10 text-muted-foreground/40\" />\n <div className=\"space-y-1.5\">\n <p className=\"text-base font-semibold text-foreground\">\n Create your first extension\n </p>\n <p className=\"mx-auto max-w-sm text-sm text-muted-foreground\">\n Describe the small app you want and the agent will build it.\n </p>\n </div>\n </div>\n <CreateToolInput className=\"w-full\" />\n </div>\n </div>\n ) : (\n <div className=\"grid grid-cols-1 gap-5 sm:grid-cols-2 lg:grid-cols-3\">\n {toolList.map((extension) => (\n <div\n key={extension.id}\n className={cn(\n \"group relative rounded-lg border border-border bg-card\",\n \"hover:border-primary/30 hover:shadow-sm\",\n )}\n >\n <Link\n to={`/extensions/${extension.id}`}\n className=\"block p-5 pr-12\"\n >\n <div className=\"mb-3 flex h-10 w-10 items-center justify-center rounded-lg bg-muted text-muted-foreground group-hover:bg-primary/10 group-hover:text-primary\">\n <IconTool className=\"h-5 w-5\" />\n </div>\n <h3 className=\"mb-1 text-sm font-semibold text-foreground\">\n {extension.name}\n </h3>\n {extension.description && (\n <p className=\"line-clamp-2 text-xs text-muted-foreground\">\n {extension.description}\n </p>\n )}\n </Link>\n <Popover\n open={confirmDeleteId === extension.id}\n onOpenChange={(open) =>\n setConfirmDeleteId(open ? extension.id : null)\n }\n >\n <PopoverTrigger asChild>\n <button\n type=\"button\"\n className=\"absolute right-3 top-3 inline-flex h-8 w-8 items-center justify-center rounded-md text-muted-foreground opacity-0 hover:bg-accent hover:text-foreground focus:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring group-hover:opacity-100\"\n aria-label={`Options for ${extension.name}`}\n >\n <IconDotsVertical className=\"h-4 w-4\" />\n </button>\n </PopoverTrigger>\n <PopoverContent\n align=\"end\"\n sideOffset={4}\n className=\"w-64 p-0\"\n >\n <div className=\"p-3\">\n <p className=\"text-[12px]\">\n {extension.canDelete === false ? \"Remove \" : \"Delete \"}\n <span className=\"font-medium\">{extension.name}</span>?\n {extension.canDelete === false\n ? \" This hides it from your Extensions list without deleting it for anyone else.\"\n : \" This removes it everywhere it is shared.\"}\n </p>\n <div className=\"mt-3 flex justify-end gap-1\">\n <button\n type=\"button\"\n onClick={() => setConfirmDeleteId(null)}\n className=\"rounded-md px-2 py-1 text-[12px] hover:bg-accent\"\n >\n Cancel\n </button>\n <button\n type=\"button\"\n onClick={() => handleDelete(extension)}\n disabled={deletingId === extension.id}\n className={cn(\n \"inline-flex items-center gap-1.5 rounded-md bg-destructive px-2 py-1 text-[12px] text-destructive-foreground hover:bg-destructive/90\",\n deletingId === extension.id && \"opacity-60\",\n )}\n >\n <IconTrash className=\"h-3.5 w-3.5\" />\n {deletingId === extension.id\n ? extension.canDelete === false\n ? \"Removing...\"\n : \"Deleting...\"\n : extension.canDelete === false\n ? \"Remove\"\n : \"Delete\"}\n </button>\n </div>\n </div>\n </PopoverContent>\n </Popover>\n </div>\n ))}\n </div>\n )}\n </div>\n </div>\n );\n}\n"]}
|
|
1
|
+
{"version":3,"file":"ExtensionsListPage.js","sourceRoot":"","sources":["../../../src/client/extensions/ExtensionsListPage.tsx"],"names":[],"mappings":"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","sourcesContent":["import { agentNativePath } from \"../api-path.js\";\nimport { useState, useEffect } from \"react\";\nimport { useQuery, useQueryClient } from \"@tanstack/react-query\";\nimport { Link } from \"react-router\";\nimport {\n IconArrowLeft,\n IconDotsVertical,\n IconPlus,\n IconTool,\n IconTrash,\n} from \"@tabler/icons-react\";\nimport { cn } from \"../utils.js\";\nimport { AgentToggleButton } from \"../AgentPanel.js\";\nimport { NotificationsBell } from \"../notifications/NotificationsBell.js\";\nimport { sendToAgentChat } from \"../agent-chat.js\";\nimport { PromptComposer } from \"../composer/PromptComposer.js\";\nimport {\n Popover,\n PopoverContent,\n PopoverTrigger,\n} from \"../components/ui/popover.js\";\nimport {\n TOOLS_ORDER_CHANGE_EVENT,\n applyToolsOrder,\n getToolsOrder,\n} from \"./extension-order.js\";\nimport {\n deleteOrHideExtension,\n invalidateExtensionRemoval,\n} from \"./delete-extension.js\";\n\ninterface Extension {\n id: string;\n name: string;\n description?: string;\n icon?: string;\n canDelete?: boolean;\n}\n\nlet lastCreateSubmission: { prompt: string; at: number } | null = null;\n\nfunction submitCreateTool(prompt: string) {\n const trimmed = prompt.trim();\n if (!trimmed) return;\n const now = Date.now();\n if (\n lastCreateSubmission &&\n lastCreateSubmission.prompt === trimmed &&\n now - lastCreateSubmission.at < 2_000\n ) {\n return;\n }\n lastCreateSubmission = { prompt: trimmed, at: now };\n sendToAgentChat({\n message: `Create an extension: ${trimmed}`,\n submit: true,\n openSidebar: true,\n newTab: true,\n });\n}\n\nfunction CreateToolInput({ className }: { className?: string }) {\n return (\n <div className={cn(\"flex flex-col gap-2 text-left\", className)}>\n <p className=\"px-1 text-sm font-medium text-foreground\">\n What should it do?\n </p>\n <PromptComposer\n autoFocus\n className=\"text-left\"\n placeholder=\"A todo list, API dashboard, calculator...\"\n draftScope=\"extensions:create\"\n onSubmit={(text) => submitCreateTool(text)}\n />\n </div>\n );\n}\n\nexport function ExtensionsListPage() {\n const [showCreate, setShowCreate] = useState(false);\n const [confirmDeleteId, setConfirmDeleteId] = useState<string | null>(null);\n const [deletingId, setDeletingId] = useState<string | null>(null);\n const queryClient = useQueryClient();\n const [toolOrderState, setToolOrderState] = useState<string[]>(() =>\n typeof window !== \"undefined\" ? getToolsOrder() : [],\n );\n\n useEffect(() => {\n fetch(agentNativePath(\"/_agent-native/application-state/navigation\"), {\n method: \"PUT\",\n headers: { \"Content-Type\": \"application/json\" },\n body: JSON.stringify({ view: \"extensions\" }),\n }).catch(() => {});\n }, []);\n\n useEffect(() => {\n if (typeof window === \"undefined\") return;\n const syncOrder = () => setToolOrderState(getToolsOrder());\n window.addEventListener(TOOLS_ORDER_CHANGE_EVENT, syncOrder);\n window.addEventListener(\"storage\", syncOrder);\n return () => {\n window.removeEventListener(TOOLS_ORDER_CHANGE_EVENT, syncOrder);\n window.removeEventListener(\"storage\", syncOrder);\n };\n }, []);\n\n const { data: extensions, isLoading } = useQuery<Extension[]>({\n queryKey: [\"extensions\"],\n queryFn: async () => {\n const res = await fetch(agentNativePath(\"/_agent-native/extensions\"));\n if (!res.ok) return [];\n return res.json();\n },\n });\n\n const toolList =\n toolOrderState.length > 0\n ? applyToolsOrder(extensions ?? [], toolOrderState)\n : (extensions ?? []);\n\n const handleCreate = (text: string) => {\n submitCreateTool(text);\n setShowCreate(false);\n };\n\n const handleDelete = async (extension: Extension) => {\n setDeletingId(extension.id);\n const previous = queryClient.getQueryData<Extension[]>([\"extensions\"]);\n queryClient.setQueryData<Extension[]>([\"extensions\"], (old) =>\n (old ?? []).filter((item) => item.id !== extension.id),\n );\n try {\n await deleteOrHideExtension(extension);\n invalidateExtensionRemoval(queryClient, extension.id);\n } catch {\n if (previous) queryClient.setQueryData([\"extensions\"], previous);\n } finally {\n setDeletingId(null);\n setConfirmDeleteId(null);\n queryClient.invalidateQueries({ queryKey: [\"extensions\"] });\n }\n };\n\n return (\n <div className=\"flex h-full w-full flex-col\">\n <header className=\"flex h-12 items-center justify-between border-b px-4 shrink-0\">\n <div className=\"flex items-center gap-2\">\n <Link\n to=\"/\"\n className=\"inline-flex h-8 w-8 items-center justify-center rounded-md text-muted-foreground hover:bg-accent hover:text-foreground\"\n aria-label=\"Back to app\"\n >\n <IconArrowLeft className=\"h-4 w-4\" />\n </Link>\n <h1 className=\"text-sm font-semibold\">Extensions</h1>\n </div>\n <div className=\"flex items-center gap-2\">\n <Popover open={showCreate} onOpenChange={setShowCreate}>\n <PopoverTrigger asChild>\n <button\n type=\"button\"\n className=\"inline-flex cursor-pointer items-center justify-center gap-1.5 rounded-md bg-primary px-3 py-1.5 text-sm font-medium text-primary-foreground hover:bg-primary/90\"\n >\n <IconPlus className=\"h-4 w-4\" />\n New Extension\n </button>\n </PopoverTrigger>\n <PopoverContent\n align=\"end\"\n sideOffset={6}\n className=\"w-[420px] p-3\"\n >\n <p className=\"px-1 pb-2 text-sm font-semibold text-foreground\">\n New extension\n </p>\n <PromptComposer\n autoFocus\n placeholder=\"Describe what you'd like to build...\"\n draftScope=\"extensions:create-popover\"\n onSubmit={handleCreate}\n />\n </PopoverContent>\n </Popover>\n <NotificationsBell />\n <AgentToggleButton />\n </div>\n </header>\n\n <div className=\"flex-1 overflow-auto px-5 py-8 sm:px-8 sm:py-10\">\n {isLoading ? (\n <div className=\"grid grid-cols-1 gap-5 sm:grid-cols-2 lg:grid-cols-3\">\n {Array.from({ length: 6 }).map((_, i) => (\n <div\n key={i}\n className=\"rounded-lg border border-border bg-card p-5\"\n >\n <div className=\"mb-3 h-10 w-10 rounded-lg bg-muted animate-pulse\" />\n <div className=\"mb-2 h-4 w-2/3 rounded bg-muted animate-pulse\" />\n <div className=\"h-3 w-4/5 rounded bg-muted animate-pulse\" />\n </div>\n ))}\n </div>\n ) : toolList.length === 0 ? (\n <div className=\"flex min-h-[calc(100vh-9rem)] flex-col items-center justify-start px-2 pb-12 pt-[clamp(5rem,18vh,11rem)] sm:pb-16\">\n <div className=\"mx-auto flex w-full max-w-[34rem] flex-col gap-7\">\n <div className=\"flex flex-col items-center gap-3 text-center\">\n <IconTool className=\"h-10 w-10 text-muted-foreground/40\" />\n <div className=\"space-y-1.5\">\n <p className=\"text-base font-semibold text-foreground\">\n Create your first extension\n </p>\n <p className=\"mx-auto max-w-sm text-sm text-muted-foreground\">\n Describe a small app and the agent will build it.\n </p>\n </div>\n </div>\n <CreateToolInput className=\"w-full\" />\n </div>\n </div>\n ) : (\n <div className=\"grid grid-cols-1 gap-5 sm:grid-cols-2 lg:grid-cols-3\">\n {toolList.map((extension) => (\n <div\n key={extension.id}\n className={cn(\n \"group relative rounded-lg border border-border bg-card\",\n \"hover:border-primary/30 hover:shadow-sm\",\n )}\n >\n <Link\n to={`/extensions/${extension.id}`}\n className=\"block p-5 pr-12\"\n >\n <div className=\"mb-3 flex h-10 w-10 items-center justify-center rounded-lg bg-muted text-muted-foreground group-hover:bg-primary/10 group-hover:text-primary\">\n <IconTool className=\"h-5 w-5\" />\n </div>\n <h3 className=\"mb-1 text-sm font-semibold text-foreground\">\n {extension.name}\n </h3>\n {extension.description && (\n <p className=\"line-clamp-2 text-xs text-muted-foreground\">\n {extension.description}\n </p>\n )}\n </Link>\n <Popover\n open={confirmDeleteId === extension.id}\n onOpenChange={(open) =>\n setConfirmDeleteId(open ? extension.id : null)\n }\n >\n <PopoverTrigger asChild>\n <button\n type=\"button\"\n className=\"absolute right-3 top-3 inline-flex h-8 w-8 items-center justify-center rounded-md text-muted-foreground opacity-0 hover:bg-accent hover:text-foreground focus:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring group-hover:opacity-100\"\n aria-label={`Options for ${extension.name}`}\n >\n <IconDotsVertical className=\"h-4 w-4\" />\n </button>\n </PopoverTrigger>\n <PopoverContent\n align=\"end\"\n sideOffset={4}\n className=\"w-64 p-0\"\n >\n <div className=\"p-3\">\n <p className=\"text-[12px]\">\n {extension.canDelete === false ? \"Remove \" : \"Delete \"}\n <span className=\"font-medium\">{extension.name}</span>?\n {extension.canDelete === false\n ? \" This hides it from your Extensions list without deleting it for anyone else.\"\n : \" This removes it everywhere it is shared.\"}\n </p>\n <div className=\"mt-3 flex justify-end gap-1\">\n <button\n type=\"button\"\n onClick={() => setConfirmDeleteId(null)}\n className=\"rounded-md px-2 py-1 text-[12px] hover:bg-accent\"\n >\n Cancel\n </button>\n <button\n type=\"button\"\n onClick={() => handleDelete(extension)}\n disabled={deletingId === extension.id}\n className={cn(\n \"inline-flex items-center gap-1.5 rounded-md bg-destructive px-2 py-1 text-[12px] text-destructive-foreground hover:bg-destructive/90\",\n deletingId === extension.id && \"opacity-60\",\n )}\n >\n <IconTrash className=\"h-3.5 w-3.5\" />\n {deletingId === extension.id\n ? extension.canDelete === false\n ? \"Removing...\"\n : \"Deleting...\"\n : extension.canDelete === false\n ? \"Remove\"\n : \"Delete\"}\n </button>\n </div>\n </div>\n </PopoverContent>\n </Popover>\n </div>\n ))}\n </div>\n )}\n </div>\n </div>\n );\n}\n"]}
|
package/package.json
CHANGED