@burdenoff/microfe-botmanor 2026.813.1

package/dist/botlit/pages/KnowledgeBasesPage.js

@@ -0,0 +1,150 @@
+import { useBotlit as e } from "../providers/BotlitProvider.js";
+import { useKnowledgeBases as t } from "../hooks/useKnowledgeBases.js";
+import { formatRelativeTime as n } from "../utils/formatters.js";
+import { PageLayout as r } from "../components/PageLayout.js";
+import { Card as i, CardContent as a } from "../components/Card.js";
+import { Button as o } from "../components/Button.js";
+import { StatusBadge as s } from "../components/Badge.js";
+import { EmptyState as c } from "../components/EmptyState.js";
+import { Input as l } from "../components/Input.js";
+import { ErrorState as u } from "../components/ErrorState.js";
+import { GlassCard as d, PagePurpose as f } from "@burdenoff/fe-libs/ui";
+import { jsx as p, jsxs as m } from "react/jsx-runtime";
+import { useParams as h } from "react-router";
+import { BookOpen as g, FileText as _, Plus as v, Search as y } from "lucide-react";
+//#region src/botlit/pages/KnowledgeBasesPage.tsx
+var b = () => {
+	let { botId: b } = h(), { navigateTo: x } = e(), { data: S, loading: C, error: w, refetch: T } = t(b ? { search: b } : void 0);
+	return /* @__PURE__ */ p(r, {
+		title: "Knowledge Bases",
+		description: "Manage knowledge sources for your AI agents",
+		actions: /* @__PURE__ */ p(o, {
+			leftIcon: /* @__PURE__ */ p(v, { size: 16 }),
+			onClick: () => x("knowledge/new"),
+			children: "Create Knowledge Base"
+		}),
+		children: /* @__PURE__ */ m("div", {
+			className: "space-y-6",
+			children: [
+				/* @__PURE__ */ p(f, {
+					icon: /* @__PURE__ */ p(g, { size: 18 }),
+					children: "A knowledge base is the private library your agents read from to answer questions about your business. Upload documents, FAQs, policies or product data here, and they get indexed so agents can retrieve and cite the right passage instead of guessing. Create a knowledge base whenever you want answers grounded in your own content rather than the model’s general training."
+				}),
+				S.length > 0 ? /* @__PURE__ */ m("div", {
+					className: "grid grid-cols-2 gap-4 sm:grid-cols-3",
+					children: [/* @__PURE__ */ m(d, {
+						treatment: "glass",
+						glow: !0,
+						className: "p-4",
+						children: [/* @__PURE__ */ p("p", {
+							className: "text-sm text-text-secondary",
+							children: "Knowledge bases"
+						}), /* @__PURE__ */ p("p", {
+							className: "mt-1 text-2xl font-semibold tabular-nums text-text-primary",
+							children: S.length
+						})]
+					}), /* @__PURE__ */ m(d, {
+						treatment: "metric",
+						className: "col-span-2 p-4 sm:col-span-2",
+						children: [/* @__PURE__ */ p("p", {
+							className: "text-sm text-text-secondary",
+							children: "Total documents"
+						}), /* @__PURE__ */ p("p", {
+							className: "mt-1 text-2xl font-semibold tabular-nums text-text-primary",
+							children: S.reduce((e, t) => e + (t.totalDocuments ?? t.documentCount ?? 0), 0)
+						})]
+					})]
+				}) : null,
+				/* @__PURE__ */ p("div", {
+					className: "flex items-center gap-4",
+					children: /* @__PURE__ */ m("div", {
+						className: "relative flex-1 max-w-md",
+						children: [/* @__PURE__ */ p(y, { className: "absolute left-3 top-1/2 -translate-y-1/2 h-4 w-4 text-text-secondary" }), /* @__PURE__ */ p(l, {
+							placeholder: "Search knowledge bases...",
+							className: "pl-9"
+						})]
+					})
+				}),
+				C ? /* @__PURE__ */ p("div", {
+					className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4",
+					children: [
+						1,
+						2,
+						3
+					].map((e) => /* @__PURE__ */ p("div", { className: "h-48 bg-bg-sunken motion-safe:animate-vc-shimmer rounded-lg" }, e))
+				}) : w ? /* @__PURE__ */ p(u, {
+					resource: "knowledge bases",
+					error: w,
+					onRetry: () => void T()
+				}) : S.length > 0 ? /* @__PURE__ */ m("div", {
+					className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4",
+					children: [S.map((e) => /* @__PURE__ */ p(i, {
+						className: "hover:shadow-md transition-shadow cursor-pointer",
+						onClick: () => x(`knowledge/${e.id}`),
+						children: /* @__PURE__ */ m(a, {
+							className: "pt-6",
+							children: [
+								/* @__PURE__ */ m("div", {
+									className: "flex items-start justify-between mb-4",
+									children: [/* @__PURE__ */ p("div", {
+										className: "p-3 rounded-lg bg-action-primary-bg/10",
+										children: /* @__PURE__ */ p(g, { className: "h-6 w-6 text-primary" })
+									}), /* @__PURE__ */ p(s, { status: e.indexStatus || e.status || "UNKNOWN" })]
+								}),
+								/* @__PURE__ */ p("h3", {
+									className: "font-semibold text-text-primary mb-1",
+									children: e.name
+								}),
+								/* @__PURE__ */ p("p", {
+									className: "text-sm text-text-secondary line-clamp-2 mb-4",
+									children: e.description
+								}),
+								/* @__PURE__ */ p("div", {
+									className: "flex items-center gap-4 text-xs text-text-secondary",
+									children: /* @__PURE__ */ m("span", {
+										className: "flex items-center gap-1",
+										children: [
+											/* @__PURE__ */ p(_, { size: 14 }),
+											e.totalDocuments ?? e.documentCount ?? 0,
+											" documents"
+										]
+									})
+								}),
+								/* @__PURE__ */ m("div", {
+									className: "mt-3 pt-3 border-t border-border-subtle text-xs text-text-secondary",
+									children: ["Created ", n(e.createdAt)]
+								})
+							]
+						})
+					}, e.id)), /* @__PURE__ */ p(i, {
+						className: "border-dashed cursor-pointer hover:border-primary/50 transition-colors",
+						onClick: () => x("knowledge/new"),
+						children: /* @__PURE__ */ m(a, {
+							className: "h-full flex flex-col items-center justify-center py-12",
+							children: [/* @__PURE__ */ p("div", {
+								className: "p-4 rounded-full bg-bg-sunken mb-4",
+								children: /* @__PURE__ */ p(v, { className: "h-8 w-8 text-text-secondary" })
+							}), /* @__PURE__ */ p("p", {
+								className: "font-medium text-text-secondary",
+								children: "Add Knowledge Base"
+							})]
+						})
+					})]
+				}) : /* @__PURE__ */ p(c, {
+					illustration: "empty-files",
+					title: "No knowledge bases yet",
+					description: "Create a knowledge base to give your agents access to your documents and data.",
+					action: /* @__PURE__ */ p(o, {
+						leftIcon: /* @__PURE__ */ p(v, { size: 16 }),
+						onClick: () => x("knowledge/new"),
+						children: "Create Knowledge Base"
+					})
+				})
+			]
+		})
+	});
+};
+//#endregion
+export { b as KnowledgeBasesPage };
+
+//# sourceMappingURL=KnowledgeBasesPage.js.map

package/dist/botlit/pages/KnowledgeBasesPage.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"KnowledgeBasesPage.js","names":[],"sources":["../../../src/botlit/pages/KnowledgeBasesPage.tsx"],"sourcesContent":["/**\n * Knowledge Bases Page\n * @module botlit/pages\n */\n\nimport type { FC } from 'react';\nimport { useParams } from 'react-router';\nimport { useBotlit } from '../providers/BotlitProvider';\nimport { Plus, Search, BookOpen, FileText } from 'lucide-react';\nimport { PagePurpose, GlassCard } from '@burdenoff/fe-libs/ui';\nimport { PageLayout } from '../components/PageLayout';\nimport { Card, CardContent } from '../components/Card';\nimport { Button } from '../components/Button';\nimport { Input } from '../components/Input';\nimport { StatusBadge } from '../components/Badge';\nimport { EmptyState } from '../components/EmptyState';\nimport { ErrorState } from '../components/ErrorState';\nimport { useKnowledgeBases } from '../hooks/useKnowledgeBases';\nimport { formatRelativeTime } from '../utils/formatters';\n\nexport const KnowledgeBasesPage: FC = () => {\n  const { botId } = useParams();\n  const { navigateTo } = useBotlit();\n  const {\n    data: knowledgeBases,\n    loading,\n    error,\n    refetch,\n  } = useKnowledgeBases(botId ? { search: botId } : undefined);\n\n  return (\n    <PageLayout\n      title=\"Knowledge Bases\"\n      description=\"Manage knowledge sources for your AI agents\"\n      actions={\n        <Button leftIcon={<Plus size={16} />} onClick={() => navigateTo('knowledge/new')}>\n          Create Knowledge Base\n        </Button>\n      }\n    >\n      <div className=\"space-y-6\">\n        <PagePurpose icon={<BookOpen size={18} />}>\n          A knowledge base is the private library your agents read from to answer questions about\n          your business. Upload documents, FAQs, policies or product data here, and they get indexed\n          so agents can retrieve and cite the right passage instead of guessing. Create a knowledge\n          base whenever you want answers grounded in your own content rather than the model&rsquo;s\n          general training.\n        </PagePurpose>\n\n        {/* Summary */}\n        {knowledgeBases.length > 0 ? (\n          <div className=\"grid grid-cols-2 gap-4 sm:grid-cols-3\">\n            <GlassCard treatment=\"glass\" glow className=\"p-4\">\n              <p className=\"text-sm text-text-secondary\">Knowledge bases</p>\n              <p className=\"mt-1 text-2xl font-semibold tabular-nums text-text-primary\">\n                {knowledgeBases.length}\n              </p>\n            </GlassCard>\n            <GlassCard treatment=\"metric\" className=\"col-span-2 p-4 sm:col-span-2\">\n              <p className=\"text-sm text-text-secondary\">Total documents</p>\n              <p className=\"mt-1 text-2xl font-semibold tabular-nums text-text-primary\">\n                {knowledgeBases.reduce(\n                  (\n                    sum: number,\n                    kb: { totalDocuments?: number | null; documentCount?: number | null }\n                  ) => sum + (kb.totalDocuments ?? kb.documentCount ?? 0),\n                  0\n                )}\n              </p>\n            </GlassCard>\n          </div>\n        ) : null}\n\n        {/* Toolbar */}\n        <div className=\"flex items-center gap-4\">\n          <div className=\"relative flex-1 max-w-md\">\n            <Search className=\"absolute left-3 top-1/2 -translate-y-1/2 h-4 w-4 text-text-secondary\" />\n            <Input placeholder=\"Search knowledge bases...\" className=\"pl-9\" />\n          </div>\n        </div>\n\n        {/* Content */}\n        {loading ? (\n          <div className=\"grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4\">\n            {[1, 2, 3].map((i) => (\n              <div\n                key={i}\n                className=\"h-48 bg-bg-sunken motion-safe:animate-vc-shimmer rounded-lg\"\n              />\n            ))}\n          </div>\n        ) : error ? (\n          <ErrorState resource=\"knowledge bases\" error={error} onRetry={() => void refetch()} />\n        ) : knowledgeBases.length > 0 ? (\n          <div className=\"grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4\">\n            {knowledgeBases.map(\n              (kb: {\n                id: string;\n                name: string;\n                description?: string | null;\n                status?: string;\n                indexStatus?: string;\n                totalDocuments?: number | null;\n                documentCount?: number | null;\n                createdAt: string;\n              }) => (\n                <Card\n                  key={kb.id}\n                  className=\"hover:shadow-md transition-shadow cursor-pointer\"\n                  onClick={() => navigateTo(`knowledge/${kb.id}`)}\n                >\n                  <CardContent className=\"pt-6\">\n                    <div className=\"flex items-start justify-between mb-4\">\n                      <div className=\"p-3 rounded-lg bg-action-primary-bg/10\">\n                        <BookOpen className=\"h-6 w-6 text-primary\" />\n                      </div>\n                      <StatusBadge status={kb.indexStatus || kb.status || 'UNKNOWN'} />\n                    </div>\n                    <h3 className=\"font-semibold text-text-primary mb-1\">{kb.name}</h3>\n                    <p className=\"text-sm text-text-secondary line-clamp-2 mb-4\">\n                      {kb.description}\n                    </p>\n                    <div className=\"flex items-center gap-4 text-xs text-text-secondary\">\n                      <span className=\"flex items-center gap-1\">\n                        <FileText size={14} />\n                        {kb.totalDocuments ?? kb.documentCount ?? 0} documents\n                      </span>\n                    </div>\n                    <div className=\"mt-3 pt-3 border-t border-border-subtle text-xs text-text-secondary\">\n                      Created {formatRelativeTime(kb.createdAt)}\n                    </div>\n                  </CardContent>\n                </Card>\n              )\n            )}\n\n            {/* Add New Card */}\n            <Card\n              className=\"border-dashed cursor-pointer hover:border-primary/50 transition-colors\"\n              onClick={() => navigateTo('knowledge/new')}\n            >\n              <CardContent className=\"h-full flex flex-col items-center justify-center py-12\">\n                <div className=\"p-4 rounded-full bg-bg-sunken mb-4\">\n                  <Plus className=\"h-8 w-8 text-text-secondary\" />\n                </div>\n                <p className=\"font-medium text-text-secondary\">Add Knowledge Base</p>\n              </CardContent>\n            </Card>\n          </div>\n        ) : (\n          <EmptyState\n            illustration=\"empty-files\"\n            title=\"No knowledge bases yet\"\n            description=\"Create a knowledge base to give your agents access to your documents and data.\"\n            action={\n              <Button leftIcon={<Plus size={16} />} onClick={() => navigateTo('knowledge/new')}>\n                Create Knowledge Base\n              </Button>\n            }\n          />\n        )}\n      </div>\n    </PageLayout>\n  );\n};\n"],"mappings":"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"}