@burdenoff/microfe-crewfoundry 2026.625.1 → 2026.625.2

package/dist/crewfoundry/pages/CommunicationsFilesPagePage.js.map

@@ -1 +1 @@
-{"version":3,"file":"CommunicationsFilesPagePage.js","names":[],"sources":["../../../src/crewfoundry/pages/CommunicationsFilesPagePage.tsx"],"sourcesContent":["import { useMemo, useState } from 'react';\nimport {\n  Badge,\n  Button,\n  Card,\n  CardContent,\n  CardHeader,\n  CardTitle,\n  GradientText,\n  Input,\n} from '@burdenoff/fe-libs/ui';\nimport { Download, File, FileText, Image, Search, Upload } from 'lucide-react';\nimport { useCrewFoundryStore } from '../store/crewfoundryStore';\n\ntype SharedFile = {\n  id: string;\n  name: string;\n  type: 'pdf' | 'spreadsheet' | 'image' | 'doc';\n  size: string;\n  uploadedBy: string;\n  date: string;\n  department: string;\n};\n\nconst fileIcon = (type: SharedFile['type']) => {\n  if (type === 'image') return <Image className=\"h-5 w-5 text-action-primary-bg\" />;\n  if (type === 'pdf') return <FileText className=\"h-5 w-5 text-status-error-text\" />;\n  return <File className=\"h-5 w-5 text-status-info-text\" />;\n};\n\nconst formatDate = (input: string): string => {\n  const parsed = new Date(input);\n  if (Number.isNaN(parsed.getTime())) {\n    return 'Unknown';\n  }\n  return parsed.toISOString().split('T')[0];\n};\n\nexport function CommunicationsFilesPagePage() {\n  const [search, setSearch] = useState('');\n  const { announcements, invoices, projects, employees } = useCrewFoundryStore();\n\n  const sharedFiles = useMemo<SharedFile[]>(() => {\n    const announcementFiles = announcements.slice(0, 8).map((announcement, index) => {\n      const uploader = employees[index % Math.max(employees.length, 1)];\n      return {\n        id: `announcement-${announcement.id}`,\n        name: `${announcement.title}.pdf`,\n        type: 'pdf' as const,\n        size: `${Math.max(1, Math.round(announcement.content.length / 300))}.${index % 9} MB`,\n        uploadedBy: uploader\n          ? `${uploader.firstName} ${uploader.lastName}`.trim()\n          : announcement.author,\n        date: formatDate(announcement.createdAt),\n        department: uploader?.department || 'Operations',\n      };\n    });\n\n    const financeFiles = invoices.slice(0, 6).map((invoice, index) => ({\n      id: `invoice-${invoice.id}`,\n      name: `${invoice.number}-invoice.xlsx`,\n      type: 'spreadsheet' as const,\n      size: `${(invoice.amount / 1000).toFixed(1)} MB`,\n      uploadedBy: invoice.clientName,\n      date: formatDate(invoice.issueDate),\n      department: index % 2 === 0 ? 'Finance' : 'Billing',\n    }));\n\n    const projectFiles = projects.slice(0, 6).map((project, index) => ({\n      id: `project-${project.id}`,\n      name: `${project.name}-brief.docx`,\n      type: index % 2 === 0 ? ('doc' as const) : ('image' as const),\n      size: `${(Math.max(project.tasks, 1) / 10).toFixed(1)} MB`,\n      uploadedBy: project.managerName,\n      date: formatDate(project.startDate),\n      department: 'Projects',\n    }));\n\n    return [...announcementFiles, ...financeFiles, ...projectFiles];\n  }, [announcements, employees, invoices, projects]);\n\n  const filteredFiles = sharedFiles.filter((file) =>\n    file.name.toLowerCase().includes(search.toLowerCase())\n  );\n\n  return (\n    <div className=\"space-y-6 p-6\">\n      <div className=\"flex items-center justify-between\">\n        <div>\n          <h1 className=\"text-2xl font-semibold\">\n            <GradientText>Shared Files</GradientText>\n          </h1>\n          <p className=\"text-sm text-text-secondary\">\n            {sharedFiles.length} files shared across teams\n          </p>\n        </div>\n        <Button size=\"sm\">\n          <Upload className=\"mr-1 h-4 w-4\" />\n          Upload File\n        </Button>\n      </div>\n\n      <div className=\"relative max-w-sm\">\n        <Search className=\"absolute top-1/2 left-3 h-4 w-4 -translate-y-1/2 text-text-secondary\" />\n        <Input\n          placeholder=\"Search files...\"\n          className=\"pl-9\"\n          value={search}\n          onChange={(event) => setSearch(event.target.value)}\n        />\n      </div>\n\n      <Card>\n        <CardHeader>\n          <CardTitle>Workspace Files</CardTitle>\n        </CardHeader>\n        <CardContent className=\"p-0\">\n          <div className=\"grid grid-cols-6 gap-2 border-b p-4 text-xs font-medium text-text-secondary\">\n            <span className=\"col-span-2\">Name</span>\n            <span>Uploaded By</span>\n            <span>Department</span>\n            <span>Date</span>\n            <span className=\"text-right\">Size</span>\n          </div>\n          {filteredFiles.map((file) => (\n            <div\n              key={file.id}\n              className=\"grid grid-cols-6 items-center gap-2 border-b px-4 py-3 text-sm last:border-0 hover:bg-bg-sunken/50\"\n            >\n              <div className=\"col-span-2 flex items-center gap-2\">\n                {fileIcon(file.type)}\n                <span className=\"truncate font-medium\">{file.name}</span>\n              </div>\n              <span className=\"text-text-secondary\">{file.uploadedBy}</span>\n              <Badge variant=\"outline\" className=\"w-fit text-[10px]\">\n                {file.department}\n              </Badge>\n              <span className=\"text-text-secondary\">{file.date}</span>\n              <div className=\"flex items-center justify-end gap-2\">\n                <span className=\"text-text-secondary\">{file.size}</span>\n                <Button variant=\"outline\" size=\"sm\" className=\"h-7\">\n                  <Download className=\"h-3 w-3\" />\n                </Button>\n              </div>\n            </div>\n          ))}\n        </CardContent>\n      </Card>\n    </div>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"CommunicationsFilesPagePage.js","names":[],"sources":["../../../src/crewfoundry/pages/CommunicationsFilesPagePage.tsx"],"sourcesContent":["import { useMemo, useState } from 'react';\nimport {\n  Badge,\n  Button,\n  CardContent,\n  CardHeader,\n  CardTitle,\n  GlassCard,\n  GradientText,\n  IllustratedEmptyState,\n  Input,\n  PagePurpose,\n} from '@burdenoff/fe-libs/ui';\nimport { Download, File, FileText, Image, Search, Upload } from 'lucide-react';\nimport { useCrewFoundryStore } from '../store/crewfoundryStore';\n\ntype SharedFile = {\n  id: string;\n  name: string;\n  type: 'pdf' | 'spreadsheet' | 'image' | 'doc';\n  size: string;\n  uploadedBy: string;\n  date: string;\n  department: string;\n};\n\nconst fileIcon = (type: SharedFile['type']) => {\n  if (type === 'image') return <Image className=\"h-5 w-5 text-action-primary-bg\" />;\n  if (type === 'pdf') return <FileText className=\"h-5 w-5 text-status-error-text\" />;\n  return <File className=\"h-5 w-5 text-status-info-text\" />;\n};\n\nconst formatDate = (input: string): string => {\n  const parsed = new Date(input);\n  if (Number.isNaN(parsed.getTime())) {\n    return 'Unknown';\n  }\n  return parsed.toISOString().split('T')[0];\n};\n\nexport function CommunicationsFilesPagePage() {\n  const [search, setSearch] = useState('');\n  const { announcements, invoices, projects, employees } = useCrewFoundryStore();\n\n  const sharedFiles = useMemo<SharedFile[]>(() => {\n    const announcementFiles = announcements.slice(0, 8).map((announcement, index) => {\n      const uploader = employees[index % Math.max(employees.length, 1)];\n      return {\n        id: `announcement-${announcement.id}`,\n        name: `${announcement.title}.pdf`,\n        type: 'pdf' as const,\n        size: `${Math.max(1, Math.round(announcement.content.length / 300))}.${index % 9} MB`,\n        uploadedBy: uploader\n          ? `${uploader.firstName} ${uploader.lastName}`.trim()\n          : announcement.author,\n        date: formatDate(announcement.createdAt),\n        department: uploader?.department || 'Operations',\n      };\n    });\n\n    const financeFiles = invoices.slice(0, 6).map((invoice, index) => ({\n      id: `invoice-${invoice.id}`,\n      name: `${invoice.number}-invoice.xlsx`,\n      type: 'spreadsheet' as const,\n      size: `${(invoice.amount / 1000).toFixed(1)} MB`,\n      uploadedBy: invoice.clientName,\n      date: formatDate(invoice.issueDate),\n      department: index % 2 === 0 ? 'Finance' : 'Billing',\n    }));\n\n    const projectFiles = projects.slice(0, 6).map((project, index) => ({\n      id: `project-${project.id}`,\n      name: `${project.name}-brief.docx`,\n      type: index % 2 === 0 ? ('doc' as const) : ('image' as const),\n      size: `${(Math.max(project.tasks, 1) / 10).toFixed(1)} MB`,\n      uploadedBy: project.managerName,\n      date: formatDate(project.startDate),\n      department: 'Projects',\n    }));\n\n    return [...announcementFiles, ...financeFiles, ...projectFiles];\n  }, [announcements, employees, invoices, projects]);\n\n  const filteredFiles = sharedFiles.filter((file) =>\n    file.name.toLowerCase().includes(search.toLowerCase())\n  );\n\n  return (\n    <div className=\"space-y-6 p-6\">\n      <div className=\"flex items-center justify-between\">\n        <div>\n          <h1 className=\"text-2xl font-semibold\">\n            <GradientText>Shared Files</GradientText>\n          </h1>\n          <p className=\"text-sm text-text-secondary\">\n            {sharedFiles.length} files shared across teams\n          </p>\n          <PagePurpose className=\"mt-1\">A shared space for company documents and files — store, search, and share the resources your teams need to get work done.</PagePurpose>\n        </div>\n        <Button size=\"sm\">\n          <Upload className=\"mr-1 h-4 w-4\" />\n          Upload File\n        </Button>\n      </div>\n\n      <div className=\"relative max-w-sm\">\n        <Search className=\"absolute top-1/2 left-3 h-4 w-4 -translate-y-1/2 text-text-secondary\" />\n        <Input\n          placeholder=\"Search files...\"\n          className=\"pl-9\"\n          value={search}\n          onChange={(event) => setSearch(event.target.value)}\n        />\n      </div>\n\n      <GlassCard treatment=\"glass\" glow className=\"border-border-seam\">\n        <CardHeader>\n          <CardTitle>Workspace Files</CardTitle>\n        </CardHeader>\n        <CardContent className=\"p-0\">\n          {filteredFiles.length === 0 ? (\n            <div className=\"p-6\">\n              <IllustratedEmptyState\n                illustration=\"empty-files\"\n                title=\"No files found\"\n                description=\"Upload a file or adjust your search to see results here.\"\n              />\n            </div>\n          ) : (\n            <>\n              <div className=\"grid grid-cols-6 gap-2 border-b p-4 text-xs font-medium text-text-secondary\">\n                <span className=\"col-span-2\">Name</span>\n                <span>Uploaded By</span>\n                <span>Department</span>\n                <span>Date</span>\n                <span className=\"text-right\">Size</span>\n              </div>\n              {filteredFiles.map((file) => (\n            <div\n              key={file.id}\n              className=\"grid grid-cols-6 items-center gap-2 border-b px-4 py-3 text-sm last:border-0 hover:bg-bg-sunken/50\"\n            >\n              <div className=\"col-span-2 flex items-center gap-2\">\n                {fileIcon(file.type)}\n                <span className=\"truncate font-medium\">{file.name}</span>\n              </div>\n              <span className=\"text-text-secondary\">{file.uploadedBy}</span>\n              <Badge variant=\"outline\" className=\"w-fit text-[10px]\">\n                {file.department}\n              </Badge>\n              <span className=\"text-text-secondary\">{file.date}</span>\n              <div className=\"flex items-center justify-end gap-2\">\n                <span className=\"text-text-secondary\">{file.size}</span>\n                <Button variant=\"outline\" size=\"sm\" className=\"h-7\">\n                  <Download className=\"h-3 w-3\" />\n                </Button>\n              </div>\n            </div>\n              ))}\n            </>\n          )}\n        </CardContent>\n      </GlassCard>\n    </div>\n  );\n}\n"],"mappings":"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"}

package/dist/crewfoundry/pages/CommunicationsMessagesPagePage.js

@@ -2,117 +2,136 @@ import { useCrewFoundryStore as e } from "../store/crewfoundryStore.js";
 import { useMemo as t, useState as n } from "react";
 import { MessageSquare as r, Search as i } from "lucide-react";
 import { jsx as a, jsxs as o } from "react/jsx-runtime";
-import { Badge as s, Button as c, Card as l, CardContent as u, CardHeader as d, CardTitle as f, GradientText as p, Input as m } from "@burdenoff/fe-libs/ui";
+import { Badge as s, Button as c, CardContent as l, CardHeader as u, CardTitle as d, GlassCard as f, GradientText as p, IllustratedEmptyState as m, Input as h, PagePurpose as g } from "@burdenoff/fe-libs/ui";
 //#region src/crewfoundry/pages/CommunicationsMessagesPagePage.tsx
-var h = (e) => {
+var _ = (e) => {
 	let t = new Date(e);
 	if (Number.isNaN(t.getTime())) return "Recently";
 	let n = Date.now() - t.getTime(), r = Math.max(0, Math.floor(n / (1e3 * 60 * 60)));
 	return r < 1 ? "Just now" : r < 24 ? `${r}h ago` : `${Math.floor(r / 24)}d ago`;
 };
-function g() {
-	let [g, _] = n(""), { teams: v, employees: y, announcements: b, notifications: x } = e(), S = t(() => {
-		let e = y.slice(0, 8).map((e, t) => {
-			let n = b[t % Math.max(b.length, 1)], r = n?.content || `Status update for ${e.department} initiatives.`;
+function v() {
+	let [v, y] = n(""), { teams: b, employees: x, announcements: S, notifications: C } = e(), w = t(() => {
+		let e = x.slice(0, 8).map((e, t) => {
+			let n = S[t % Math.max(S.length, 1)], r = n?.content || `Status update for ${e.department} initiatives.`;
 			return {
 				id: `person-${e.id}`,
 				name: `${e.firstName} ${e.lastName}`.trim(),
 				role: e.position,
 				lastMessage: r,
-				time: h(n?.createdAt || e.startDate),
+				time: _(n?.createdAt || e.startDate),
 				unread: Math.min(3, Math.round(e.performanceScore) % 4),
 				online: e.status === "active" && t % 2 == 0
 			};
-		}), t = v.slice(0, 5).map((e, t) => {
-			let n = x.slice(t, t + 3).filter((e) => !e.read).length;
+		}), t = b.slice(0, 5).map((e, t) => {
+			let n = C.slice(t, t + 3).filter((e) => !e.read).length;
 			return {
 				id: `team-${e.id}`,
 				name: `#${e.name.toLowerCase().replaceAll(" ", "-")}`,
 				role: `Channel · ${e.memberCount} members`,
-				lastMessage: b[t % Math.max(b.length, 1)]?.title || `${e.leadName} posted an update in ${e.name}.`,
-				time: h(e.createdAt),
+				lastMessage: S[t % Math.max(S.length, 1)]?.title || `${e.leadName} posted an update in ${e.name}.`,
+				time: _(e.createdAt),
 				unread: n,
 				online: !1
 			};
 		});
 		return [...e, ...t];
 	}, [
-		b,
-		y,
+		S,
 		x,
-		v
-	]).filter((e) => e.name.toLowerCase().includes(g.toLowerCase()));
+		C,
+		b
+	]).filter((e) => e.name.toLowerCase().includes(v.toLowerCase()));
 	return /* @__PURE__ */ o("div", {
 		className: "space-y-6 p-6",
 		children: [
 			/* @__PURE__ */ o("div", {
 				className: "flex items-center justify-between",
-				children: [/* @__PURE__ */ o("div", { children: [/* @__PURE__ */ a("h1", {
-					className: "text-2xl font-semibold",
-					children: /* @__PURE__ */ a(p, { children: "Messages" })
-				}), /* @__PURE__ */ a("p", {
-					className: "text-sm text-text-secondary",
-					children: "Team conversations and channels"
-				})] }), /* @__PURE__ */ o(c, {
+				children: [/* @__PURE__ */ o("div", { children: [
+					/* @__PURE__ */ a("h1", {
+						className: "text-2xl font-semibold",
+						children: /* @__PURE__ */ a(p, { children: "Messages" })
+					}),
+					/* @__PURE__ */ a("p", {
+						className: "text-sm text-text-secondary",
+						children: "Team conversations and channels"
+					}),
+					/* @__PURE__ */ a(g, {
+						className: "mt-1",
+						children: "Chat directly with colleagues and keep conversations in one thread — use it for quick questions, follow-ups, and day-to-day coordination."
+					})
+				] }), /* @__PURE__ */ o(c, {
 					size: "sm",
 					children: [/* @__PURE__ */ a(r, { className: "mr-1 h-4 w-4" }), "New Message"]
 				})]
 			}),
 			/* @__PURE__ */ o("div", {
 				className: "relative max-w-sm",
-				children: [/* @__PURE__ */ a(i, { className: "absolute top-1/2 left-3 h-4 w-4 -translate-y-1/2 text-text-secondary" }), /* @__PURE__ */ a(m, {
+				children: [/* @__PURE__ */ a(i, { className: "absolute top-1/2 left-3 h-4 w-4 -translate-y-1/2 text-text-secondary" }), /* @__PURE__ */ a(h, {
 					placeholder: "Search conversations...",
 					className: "pl-9",
-					value: g,
-					onChange: (e) => _(e.target.value)
+					value: v,
+					onChange: (e) => y(e.target.value)
 				})]
 			}),
-			/* @__PURE__ */ o(l, { children: [/* @__PURE__ */ a(d, { children: /* @__PURE__ */ a(f, { children: "Conversation Inbox" }) }), /* @__PURE__ */ a(u, {
-				className: "p-0",
-				children: S.map((e) => /* @__PURE__ */ o("div", {
-					className: "flex cursor-pointer items-center gap-3 border-b p-4 last:border-0 hover:bg-bg-sunken/50",
-					children: [
-						/* @__PURE__ */ o("div", {
-							className: "relative",
-							children: [/* @__PURE__ */ a("div", {
-								className: "flex h-10 w-10 items-center justify-center rounded-full bg-action-primary-bg/10 text-sm font-medium",
-								children: e.name.startsWith("#") ? "#" : e.name.split(" ").map((e) => e[0]).join("")
-							}), e.online && /* @__PURE__ */ a("div", { className: "absolute right-0 bottom-0 h-3 w-3 rounded-full border-2 border-background bg-status-success-text" })]
-						}),
-						/* @__PURE__ */ o("div", {
-							className: "min-w-0 flex-1",
-							children: [
-								/* @__PURE__ */ o("div", {
-									className: "flex items-center justify-between",
-									children: [/* @__PURE__ */ a("p", {
-										className: "text-sm font-medium",
-										children: e.name
-									}), /* @__PURE__ */ a("span", {
-										className: "text-xs text-text-secondary",
-										children: e.time
-									})]
-								}),
-								/* @__PURE__ */ a("p", {
-									className: "text-xs text-text-secondary",
-									children: e.role
-								}),
-								/* @__PURE__ */ a("p", {
-									className: "mt-0.5 truncate text-xs text-text-secondary",
-									children: e.lastMessage
-								})
-							]
-						}),
-						e.unread > 0 && /* @__PURE__ */ a(s, {
-							className: "flex h-5 w-5 items-center justify-center rounded-full p-0 text-[10px]",
-							children: e.unread
+			/* @__PURE__ */ o(f, {
+				treatment: "glass",
+				glow: !0,
+				className: "border-border-seam",
+				children: [/* @__PURE__ */ a(u, { children: /* @__PURE__ */ a(d, { children: "Conversation Inbox" }) }), /* @__PURE__ */ a(l, {
+					className: "p-0",
+					children: w.length === 0 ? /* @__PURE__ */ a("div", {
+						className: "p-6",
+						children: /* @__PURE__ */ a(m, {
+							illustration: "empty-notifications",
+							title: "No conversations",
+							description: "Messages with your colleagues will show up here."
 						})
-					]
-				}, e.id))
-			})] })
+					}) : w.map((e) => /* @__PURE__ */ o("div", {
+						className: "flex cursor-pointer items-center gap-3 border-b p-4 last:border-0 hover:bg-bg-sunken/50",
+						children: [
+							/* @__PURE__ */ o("div", {
+								className: "relative",
+								children: [/* @__PURE__ */ a("div", {
+									className: "flex h-10 w-10 items-center justify-center rounded-full bg-action-primary-bg/10 text-sm font-medium",
+									children: e.name.startsWith("#") ? "#" : e.name.split(" ").map((e) => e[0]).join("")
+								}), e.online && /* @__PURE__ */ a("div", { className: "absolute right-0 bottom-0 h-3 w-3 rounded-full border-2 border-background bg-status-success-text" })]
+							}),
+							/* @__PURE__ */ o("div", {
+								className: "min-w-0 flex-1",
+								children: [
+									/* @__PURE__ */ o("div", {
+										className: "flex items-center justify-between",
+										children: [/* @__PURE__ */ a("p", {
+											className: "text-sm font-medium",
+											children: e.name
+										}), /* @__PURE__ */ a("span", {
+											className: "text-xs text-text-secondary",
+											children: e.time
+										})]
+									}),
+									/* @__PURE__ */ a("p", {
+										className: "text-xs text-text-secondary",
+										children: e.role
+									}),
+									/* @__PURE__ */ a("p", {
+										className: "mt-0.5 truncate text-xs text-text-secondary",
+										children: e.lastMessage
+									})
+								]
+							}),
+							e.unread > 0 && /* @__PURE__ */ a(s, {
+								className: "flex h-5 w-5 items-center justify-center rounded-full p-0 text-[10px]",
+								children: e.unread
+							})
+						]
+					}, e.id))
+				})]
+			})
 		]
 	});
 }
 //#endregion
-export { g as CommunicationsMessagesPagePage };
+export { v as CommunicationsMessagesPagePage };
 
 //# sourceMappingURL=CommunicationsMessagesPagePage.js.map

package/dist/crewfoundry/pages/CommunicationsMessagesPagePage.js.map

@@ -1 +1 @@
-{"version":3,"file":"CommunicationsMessagesPagePage.js","names":[],"sources":["../../../src/crewfoundry/pages/CommunicationsMessagesPagePage.tsx"],"sourcesContent":["import { useMemo, useState } from 'react';\nimport {\n  Badge,\n  Button,\n  Card,\n  CardContent,\n  CardHeader,\n  CardTitle,\n  GradientText,\n  Input,\n} from '@burdenoff/fe-libs/ui';\nimport { MessageSquare, Search } from 'lucide-react';\nimport { useCrewFoundryStore } from '../store/crewfoundryStore';\n\ntype Conversation = {\n  id: string;\n  name: string;\n  role: string;\n  lastMessage: string;\n  time: string;\n  unread: number;\n  online: boolean;\n};\n\nconst formatRelativeDate = (value: string): string => {\n  const parsed = new Date(value);\n  if (Number.isNaN(parsed.getTime())) {\n    return 'Recently';\n  }\n  const diffMs = Date.now() - parsed.getTime();\n  const diffHours = Math.max(0, Math.floor(diffMs / (1000 * 60 * 60)));\n  if (diffHours < 1) return 'Just now';\n  if (diffHours < 24) return `${diffHours}h ago`;\n  const diffDays = Math.floor(diffHours / 24);\n  return `${diffDays}d ago`;\n};\n\nexport function CommunicationsMessagesPagePage() {\n  const [search, setSearch] = useState('');\n  const { teams, employees, announcements, notifications } = useCrewFoundryStore();\n\n  const conversations = useMemo<Conversation[]>(() => {\n    const peopleConversations = employees.slice(0, 8).map((employee, index) => {\n      const announcement = announcements[index % Math.max(announcements.length, 1)];\n      const message =\n        announcement?.content || `Status update for ${employee.department} initiatives.`;\n      return {\n        id: `person-${employee.id}`,\n        name: `${employee.firstName} ${employee.lastName}`.trim(),\n        role: employee.position,\n        lastMessage: message,\n        time: formatRelativeDate(announcement?.createdAt || employee.startDate),\n        unread: Math.min(3, Math.round(employee.performanceScore) % 4),\n        online: employee.status === 'active' && index % 2 === 0,\n      };\n    });\n\n    const teamConversations = teams.slice(0, 5).map((team, index) => {\n      const unread = notifications\n        .slice(index, index + 3)\n        .filter((notification) => !notification.read).length;\n      return {\n        id: `team-${team.id}`,\n        name: `#${team.name.toLowerCase().replaceAll(' ', '-')}`,\n        role: `Channel · ${team.memberCount} members`,\n        lastMessage:\n          announcements[index % Math.max(announcements.length, 1)]?.title ||\n          `${team.leadName} posted an update in ${team.name}.`,\n        time: formatRelativeDate(team.createdAt),\n        unread,\n        online: false,\n      };\n    });\n\n    return [...peopleConversations, ...teamConversations];\n  }, [announcements, employees, notifications, teams]);\n\n  const filteredConversations = conversations.filter((conversation) =>\n    conversation.name.toLowerCase().includes(search.toLowerCase())\n  );\n\n  return (\n    <div className=\"space-y-6 p-6\">\n      <div className=\"flex items-center justify-between\">\n        <div>\n          <h1 className=\"text-2xl font-semibold\">\n            <GradientText>Messages</GradientText>\n          </h1>\n          <p className=\"text-sm text-text-secondary\">Team conversations and channels</p>\n        </div>\n        <Button size=\"sm\">\n          <MessageSquare className=\"mr-1 h-4 w-4\" />\n          New Message\n        </Button>\n      </div>\n\n      <div className=\"relative max-w-sm\">\n        <Search className=\"absolute top-1/2 left-3 h-4 w-4 -translate-y-1/2 text-text-secondary\" />\n        <Input\n          placeholder=\"Search conversations...\"\n          className=\"pl-9\"\n          value={search}\n          onChange={(event) => setSearch(event.target.value)}\n        />\n      </div>\n\n      <Card>\n        <CardHeader>\n          <CardTitle>Conversation Inbox</CardTitle>\n        </CardHeader>\n        <CardContent className=\"p-0\">\n          {filteredConversations.map((conversation) => (\n            <div\n              key={conversation.id}\n              className=\"flex cursor-pointer items-center gap-3 border-b p-4 last:border-0 hover:bg-bg-sunken/50\"\n            >\n              <div className=\"relative\">\n                <div className=\"flex h-10 w-10 items-center justify-center rounded-full bg-action-primary-bg/10 text-sm font-medium\">\n                  {conversation.name.startsWith('#')\n                    ? '#'\n                    : conversation.name\n                        .split(' ')\n                        .map((part) => part[0])\n                        .join('')}\n                </div>\n                {conversation.online && (\n                  <div className=\"absolute right-0 bottom-0 h-3 w-3 rounded-full border-2 border-background bg-status-success-text\" />\n                )}\n              </div>\n\n              <div className=\"min-w-0 flex-1\">\n                <div className=\"flex items-center justify-between\">\n                  <p className=\"text-sm font-medium\">{conversation.name}</p>\n                  <span className=\"text-xs text-text-secondary\">{conversation.time}</span>\n                </div>\n                <p className=\"text-xs text-text-secondary\">{conversation.role}</p>\n                <p className=\"mt-0.5 truncate text-xs text-text-secondary\">\n                  {conversation.lastMessage}\n                </p>\n              </div>\n\n              {conversation.unread > 0 && (\n                <Badge className=\"flex h-5 w-5 items-center justify-center rounded-full p-0 text-[10px]\">\n                  {conversation.unread}\n                </Badge>\n              )}\n            </div>\n          ))}\n        </CardContent>\n      </Card>\n    </div>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"CommunicationsMessagesPagePage.js","names":[],"sources":["../../../src/crewfoundry/pages/CommunicationsMessagesPagePage.tsx"],"sourcesContent":["import { useMemo, useState } from 'react';\nimport {\n  Badge,\n  Button,\n  CardContent,\n  CardHeader,\n  CardTitle,\n  GlassCard,\n  GradientText,\n  IllustratedEmptyState,\n  Input,\n  PagePurpose,\n} from '@burdenoff/fe-libs/ui';\nimport { MessageSquare, Search } from 'lucide-react';\nimport { useCrewFoundryStore } from '../store/crewfoundryStore';\n\ntype Conversation = {\n  id: string;\n  name: string;\n  role: string;\n  lastMessage: string;\n  time: string;\n  unread: number;\n  online: boolean;\n};\n\nconst formatRelativeDate = (value: string): string => {\n  const parsed = new Date(value);\n  if (Number.isNaN(parsed.getTime())) {\n    return 'Recently';\n  }\n  const diffMs = Date.now() - parsed.getTime();\n  const diffHours = Math.max(0, Math.floor(diffMs / (1000 * 60 * 60)));\n  if (diffHours < 1) return 'Just now';\n  if (diffHours < 24) return `${diffHours}h ago`;\n  const diffDays = Math.floor(diffHours / 24);\n  return `${diffDays}d ago`;\n};\n\nexport function CommunicationsMessagesPagePage() {\n  const [search, setSearch] = useState('');\n  const { teams, employees, announcements, notifications } = useCrewFoundryStore();\n\n  const conversations = useMemo<Conversation[]>(() => {\n    const peopleConversations = employees.slice(0, 8).map((employee, index) => {\n      const announcement = announcements[index % Math.max(announcements.length, 1)];\n      const message =\n        announcement?.content || `Status update for ${employee.department} initiatives.`;\n      return {\n        id: `person-${employee.id}`,\n        name: `${employee.firstName} ${employee.lastName}`.trim(),\n        role: employee.position,\n        lastMessage: message,\n        time: formatRelativeDate(announcement?.createdAt || employee.startDate),\n        unread: Math.min(3, Math.round(employee.performanceScore) % 4),\n        online: employee.status === 'active' && index % 2 === 0,\n      };\n    });\n\n    const teamConversations = teams.slice(0, 5).map((team, index) => {\n      const unread = notifications\n        .slice(index, index + 3)\n        .filter((notification) => !notification.read).length;\n      return {\n        id: `team-${team.id}`,\n        name: `#${team.name.toLowerCase().replaceAll(' ', '-')}`,\n        role: `Channel · ${team.memberCount} members`,\n        lastMessage:\n          announcements[index % Math.max(announcements.length, 1)]?.title ||\n          `${team.leadName} posted an update in ${team.name}.`,\n        time: formatRelativeDate(team.createdAt),\n        unread,\n        online: false,\n      };\n    });\n\n    return [...peopleConversations, ...teamConversations];\n  }, [announcements, employees, notifications, teams]);\n\n  const filteredConversations = conversations.filter((conversation) =>\n    conversation.name.toLowerCase().includes(search.toLowerCase())\n  );\n\n  return (\n    <div className=\"space-y-6 p-6\">\n      <div className=\"flex items-center justify-between\">\n        <div>\n          <h1 className=\"text-2xl font-semibold\">\n            <GradientText>Messages</GradientText>\n          </h1>\n          <p className=\"text-sm text-text-secondary\">Team conversations and channels</p>\n          <PagePurpose className=\"mt-1\">Chat directly with colleagues and keep conversations in one thread — use it for quick questions, follow-ups, and day-to-day coordination.</PagePurpose>\n        </div>\n        <Button size=\"sm\">\n          <MessageSquare className=\"mr-1 h-4 w-4\" />\n          New Message\n        </Button>\n      </div>\n\n      <div className=\"relative max-w-sm\">\n        <Search className=\"absolute top-1/2 left-3 h-4 w-4 -translate-y-1/2 text-text-secondary\" />\n        <Input\n          placeholder=\"Search conversations...\"\n          className=\"pl-9\"\n          value={search}\n          onChange={(event) => setSearch(event.target.value)}\n        />\n      </div>\n\n      <GlassCard treatment=\"glass\" glow className=\"border-border-seam\">\n        <CardHeader>\n          <CardTitle>Conversation Inbox</CardTitle>\n        </CardHeader>\n        <CardContent className=\"p-0\">\n          {filteredConversations.length === 0 ? (\n            <div className=\"p-6\">\n              <IllustratedEmptyState\n                illustration=\"empty-notifications\"\n                title=\"No conversations\"\n                description=\"Messages with your colleagues will show up here.\"\n              />\n            </div>\n          ) : (\n            filteredConversations.map((conversation) => (\n            <div\n              key={conversation.id}\n              className=\"flex cursor-pointer items-center gap-3 border-b p-4 last:border-0 hover:bg-bg-sunken/50\"\n            >\n              <div className=\"relative\">\n                <div className=\"flex h-10 w-10 items-center justify-center rounded-full bg-action-primary-bg/10 text-sm font-medium\">\n                  {conversation.name.startsWith('#')\n                    ? '#'\n                    : conversation.name\n                        .split(' ')\n                        .map((part) => part[0])\n                        .join('')}\n                </div>\n                {conversation.online && (\n                  <div className=\"absolute right-0 bottom-0 h-3 w-3 rounded-full border-2 border-background bg-status-success-text\" />\n                )}\n              </div>\n\n              <div className=\"min-w-0 flex-1\">\n                <div className=\"flex items-center justify-between\">\n                  <p className=\"text-sm font-medium\">{conversation.name}</p>\n                  <span className=\"text-xs text-text-secondary\">{conversation.time}</span>\n                </div>\n                <p className=\"text-xs text-text-secondary\">{conversation.role}</p>\n                <p className=\"mt-0.5 truncate text-xs text-text-secondary\">\n                  {conversation.lastMessage}\n                </p>\n              </div>\n\n              {conversation.unread > 0 && (\n                <Badge className=\"flex h-5 w-5 items-center justify-center rounded-full p-0 text-[10px]\">\n                  {conversation.unread}\n                </Badge>\n              )}\n            </div>\n            ))\n          )}\n        </CardContent>\n      </GlassCard>\n    </div>\n  );\n}\n"],"mappings":"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"}

package/dist/crewfoundry/pages/CommunicationsTeamsPagePage.js

@@ -1,25 +1,41 @@
 import { useCrewFoundryStore as e } from "../store/crewfoundryStore.js";
 import { FolderKanban as t, Users as n } from "lucide-react";
 import { jsx as r, jsxs as i } from "react/jsx-runtime";
-import { Badge as a, Card as o, CardContent as s, CardDescription as c, CardHeader as l, CardTitle as u, GradientText as d } from "@burdenoff/fe-libs/ui";
+import { Badge as a, CardContent as o, CardDescription as s, CardHeader as c, CardTitle as l, GlassCard as u, GradientText as d, IllustratedEmptyState as f, PagePurpose as p } from "@burdenoff/fe-libs/ui";
 //#region src/crewfoundry/pages/CommunicationsTeamsPagePage.tsx
-function f() {
-	let { teams: f } = e();
+function m() {
+	let { teams: m } = e();
 	return /* @__PURE__ */ i("div", {
 		className: "space-y-6 p-6",
-		children: [/* @__PURE__ */ i("div", { children: [/* @__PURE__ */ r("h1", {
-			className: "text-2xl font-semibold",
-			children: /* @__PURE__ */ r(d, { children: "Team Channels" })
-		}), /* @__PURE__ */ i("p", {
-			className: "text-sm text-text-secondary",
-			children: [f.length, " active team channels"]
-		})] }), /* @__PURE__ */ r("div", {
+		children: [/* @__PURE__ */ i("div", { children: [
+			/* @__PURE__ */ r("h1", {
+				className: "text-2xl font-semibold",
+				children: /* @__PURE__ */ r(d, { children: "Team Channels" })
+			}),
+			/* @__PURE__ */ i("p", {
+				className: "text-sm text-text-secondary",
+				children: [m.length, " active team channels"]
+			}),
+			/* @__PURE__ */ r(p, {
+				className: "mt-1",
+				children: "Jump into team channels to collaborate with your groups — a focused place for each team's ongoing discussion."
+			})
+		] }), /* @__PURE__ */ r("div", {
 			className: "grid gap-4 md:grid-cols-2 lg:grid-cols-3",
-			children: f.map((e) => /* @__PURE__ */ i(o, {
+			children: m.length === 0 ? /* @__PURE__ */ r("div", {
+				className: "col-span-full",
+				children: /* @__PURE__ */ r(f, {
+					illustration: "empty-people",
+					title: "No team channels",
+					description: "Team channels will appear here once teams are created."
+				})
+			}) : m.map((e, d) => /* @__PURE__ */ i(u, {
+				treatment: d === 0 ? "glass" : "plain",
+				glow: d === 0,
 				className: "cursor-pointer hover:shadow-md transition-shadow",
-				children: [/* @__PURE__ */ i(l, { children: [/* @__PURE__ */ i("div", {
+				children: [/* @__PURE__ */ i(c, { children: [/* @__PURE__ */ i("div", {
 					className: "flex items-center justify-between",
-					children: [/* @__PURE__ */ r(u, {
+					children: [/* @__PURE__ */ r(l, {
 						className: "text-base",
 						children: e.name
 					}), /* @__PURE__ */ r(a, {
@@ -27,7 +43,7 @@ function f() {
 						className: "text-[10px]",
 						children: e.status
 					})]
-				}), /* @__PURE__ */ r(c, { children: e.description })] }), /* @__PURE__ */ i(s, { children: [/* @__PURE__ */ i("div", {
+				}), /* @__PURE__ */ r(s, { children: e.description })] }), /* @__PURE__ */ i(o, { children: [/* @__PURE__ */ i("div", {
 					className: "flex items-center justify-between text-sm text-text-secondary",
 					children: [/* @__PURE__ */ i("span", {
 						className: "flex items-center gap-1",
@@ -57,6 +73,6 @@ function f() {
 	});
 }
 //#endregion
-export { f as CommunicationsTeamsPagePage };
+export { m as CommunicationsTeamsPagePage };
 
 //# sourceMappingURL=CommunicationsTeamsPagePage.js.map

package/dist/crewfoundry/pages/CommunicationsTeamsPagePage.js.map

@@ -1 +1 @@
-{"version":3,"file":"CommunicationsTeamsPagePage.js","names":[],"sources":["../../../src/crewfoundry/pages/CommunicationsTeamsPagePage.tsx"],"sourcesContent":["import {\n  Badge,\n  Card,\n  CardContent,\n  CardDescription,\n  CardHeader,\n  CardTitle,\n  GradientText,\n} from '@burdenoff/fe-libs/ui';\nimport { FolderKanban, Users } from 'lucide-react';\nimport { useCrewFoundryStore } from '../store/crewfoundryStore';\n\nexport function CommunicationsTeamsPagePage() {\n  const { teams } = useCrewFoundryStore();\n\n  return (\n    <div className=\"space-y-6 p-6\">\n      <div>\n        <h1 className=\"text-2xl font-semibold\">\n          <GradientText>Team Channels</GradientText>\n        </h1>\n        <p className=\"text-sm text-text-secondary\">{teams.length} active team channels</p>\n      </div>\n      <div className=\"grid gap-4 md:grid-cols-2 lg:grid-cols-3\">\n        {teams.map((team) => (\n          <Card key={team.id} className=\"cursor-pointer hover:shadow-md transition-shadow\">\n            <CardHeader>\n              <div className=\"flex items-center justify-between\">\n                <CardTitle className=\"text-base\">{team.name}</CardTitle>\n                <Badge\n                  variant={team.status === 'active' ? 'default' : 'secondary'}\n                  className=\"text-[10px]\"\n                >\n                  {team.status}\n                </Badge>\n              </div>\n              <CardDescription>{team.description}</CardDescription>\n            </CardHeader>\n            <CardContent>\n              <div className=\"flex items-center justify-between text-sm text-text-secondary\">\n                <span className=\"flex items-center gap-1\">\n                  <Users className=\"h-3 w-3\" />\n                  {team.memberCount} members\n                </span>\n                <span className=\"flex items-center gap-1\">\n                  <FolderKanban className=\"h-3 w-3\" />\n                  {team.projectCount} projects\n                </span>\n              </div>\n              <div className=\"mt-2 text-xs text-text-secondary\">\n                <span>Lead: {team.leadName}</span> · <span>{team.department}</span>\n              </div>\n            </CardContent>\n          </Card>\n        ))}\n      </div>\n    </div>\n  );\n}\n"],"mappings":";;;;;AAYA,SAAgB,IAA8B;CAC5C,IAAM,EAAE,aAAU,GAAqB;AAEvC,QACE,kBAAC,OAAD;EAAK,WAAU;YAAf,CACE,kBAAC,OAAD,EAAA,UAAA,CACE,kBAAC,MAAD;GAAI,WAAU;aACZ,kBAAC,GAAD,EAAA,UAAc,iBAA4B,CAAA;GACvC,CAAA,EACL,kBAAC,KAAD;GAAG,WAAU;aAAb,CAA4C,EAAM,QAAO,wBAAyB;KAC9E,EAAA,CAAA,EACN,kBAAC,OAAD;GAAK,WAAU;aACZ,EAAM,KAAK,MACV,kBAAC,GAAD;IAAoB,WAAU;cAA9B,CACE,kBAAC,GAAD,EAAA,UAAA,CACE,kBAAC,OAAD;KAAK,WAAU;eAAf,CACE,kBAAC,GAAD;MAAW,WAAU;gBAAa,EAAK;MAAiB,CAAA,EACxD,kBAAC,GAAD;MACE,SAAS,EAAK,WAAW,WAAW,YAAY;MAChD,WAAU;gBAET,EAAK;MACA,CAAA,CACJ;QACN,kBAAC,GAAD,EAAA,UAAkB,EAAK,aAA8B,CAAA,CAC1C,EAAA,CAAA,EACb,kBAAC,GAAD,EAAA,UAAA,CACE,kBAAC,OAAD;KAAK,WAAU;eAAf,CACE,kBAAC,QAAD;MAAM,WAAU;gBAAhB;OACE,kBAAC,GAAD,EAAO,WAAU,WAAY,CAAA;OAC5B,EAAK;OAAY;OACb;SACP,kBAAC,QAAD;MAAM,WAAU;gBAAhB;OACE,kBAAC,GAAD,EAAc,WAAU,WAAY,CAAA;OACnC,EAAK;OAAa;OACd;QACH;QACN,kBAAC,OAAD;KAAK,WAAU;eAAf;MACE,kBAAC,QAAD,EAAA,UAAA,CAAM,UAAO,EAAK,SAAgB,EAAA,CAAA;;MAAG,kBAAC,QAAD,EAAA,UAAO,EAAK,YAAkB,CAAA;MAC/D;OACM,EAAA,CAAA,CACT;MA5BI,EAAK,GA4BT,CACP;GACE,CAAA,CACF"}
+{"version":3,"file":"CommunicationsTeamsPagePage.js","names":[],"sources":["../../../src/crewfoundry/pages/CommunicationsTeamsPagePage.tsx"],"sourcesContent":["import {\n  Badge,\n  CardContent,\n  CardDescription,\n  CardHeader,\n  CardTitle,\n  GlassCard,\n  GradientText,\n  IllustratedEmptyState,\n  PagePurpose,\n} from '@burdenoff/fe-libs/ui';\nimport { FolderKanban, Users } from 'lucide-react';\nimport { useCrewFoundryStore } from '../store/crewfoundryStore';\n\nexport function CommunicationsTeamsPagePage() {\n  const { teams } = useCrewFoundryStore();\n\n  return (\n    <div className=\"space-y-6 p-6\">\n      <div>\n        <h1 className=\"text-2xl font-semibold\">\n          <GradientText>Team Channels</GradientText>\n        </h1>\n        <p className=\"text-sm text-text-secondary\">{teams.length} active team channels</p>\n        <PagePurpose className=\"mt-1\">Jump into team channels to collaborate with your groups — a focused place for each team&apos;s ongoing discussion.</PagePurpose>\n      </div>\n      <div className=\"grid gap-4 md:grid-cols-2 lg:grid-cols-3\">\n        {teams.length === 0 ? (\n          <div className=\"col-span-full\">\n            <IllustratedEmptyState illustration=\"empty-people\" title=\"No team channels\" description=\"Team channels will appear here once teams are created.\" />\n          </div>\n        ) : (\n          teams.map((team, _idx) => (\n          <GlassCard key={team.id} treatment={_idx === 0 ? 'glass' : 'plain'} glow={_idx === 0} className=\"cursor-pointer hover:shadow-md transition-shadow\">\n            <CardHeader>\n              <div className=\"flex items-center justify-between\">\n                <CardTitle className=\"text-base\">{team.name}</CardTitle>\n                <Badge\n                  variant={team.status === 'active' ? 'default' : 'secondary'}\n                  className=\"text-[10px]\"\n                >\n                  {team.status}\n                </Badge>\n              </div>\n              <CardDescription>{team.description}</CardDescription>\n            </CardHeader>\n            <CardContent>\n              <div className=\"flex items-center justify-between text-sm text-text-secondary\">\n                <span className=\"flex items-center gap-1\">\n                  <Users className=\"h-3 w-3\" />\n                  {team.memberCount} members\n                </span>\n                <span className=\"flex items-center gap-1\">\n                  <FolderKanban className=\"h-3 w-3\" />\n                  {team.projectCount} projects\n                </span>\n              </div>\n              <div className=\"mt-2 text-xs text-text-secondary\">\n                <span>Lead: {team.leadName}</span> · <span>{team.department}</span>\n              </div>\n            </CardContent>\n          </GlassCard>\n        )))}\n      </div>\n    </div>\n  );\n}\n"],"mappings":";;;;;AAcA,SAAgB,IAA8B;CAC5C,IAAM,EAAE,aAAU,GAAqB;AAEvC,QACE,kBAAC,OAAD;EAAK,WAAU;YAAf,CACE,kBAAC,OAAD,EAAA,UAAA;GACE,kBAAC,MAAD;IAAI,WAAU;cACZ,kBAAC,GAAD,EAAA,UAAc,iBAA4B,CAAA;IACvC,CAAA;GACL,kBAAC,KAAD;IAAG,WAAU;cAAb,CAA4C,EAAM,QAAO,wBAAyB;;GAClF,kBAAC,GAAD;IAAa,WAAU;cAAO;IAAgI,CAAA;GAC1J,EAAA,CAAA,EACN,kBAAC,OAAD;GAAK,WAAU;aACZ,EAAM,WAAW,IAChB,kBAAC,OAAD;IAAK,WAAU;cACb,kBAAC,GAAD;KAAuB,cAAa;KAAe,OAAM;KAAmB,aAAY;KAA2D,CAAA;IAC/I,CAAA,GAEN,EAAM,KAAK,GAAM,MACjB,kBAAC,GAAD;IAAyB,WAAW,MAAS,IAAI,UAAU;IAAS,MAAM,MAAS;IAAG,WAAU;cAAhG,CACE,kBAAC,GAAD,EAAA,UAAA,CACE,kBAAC,OAAD;KAAK,WAAU;eAAf,CACE,kBAAC,GAAD;MAAW,WAAU;gBAAa,EAAK;MAAiB,CAAA,EACxD,kBAAC,GAAD;MACE,SAAS,EAAK,WAAW,WAAW,YAAY;MAChD,WAAU;gBAET,EAAK;MACA,CAAA,CACJ;QACN,kBAAC,GAAD,EAAA,UAAkB,EAAK,aAA8B,CAAA,CAC1C,EAAA,CAAA,EACb,kBAAC,GAAD,EAAA,UAAA,CACE,kBAAC,OAAD;KAAK,WAAU;eAAf,CACE,kBAAC,QAAD;MAAM,WAAU;gBAAhB;OACE,kBAAC,GAAD,EAAO,WAAU,WAAY,CAAA;OAC5B,EAAK;OAAY;OACb;SACP,kBAAC,QAAD;MAAM,WAAU;gBAAhB;OACE,kBAAC,GAAD,EAAc,WAAU,WAAY,CAAA;OACnC,EAAK;OAAa;OACd;QACH;QACN,kBAAC,OAAD;KAAK,WAAU;eAAf;MACE,kBAAC,QAAD,EAAA,UAAA,CAAM,UAAO,EAAK,SAAgB,EAAA,CAAA;;MAAG,kBAAC,QAAD,EAAA,UAAO,EAAK,YAAkB,CAAA;MAC/D;OACM,EAAA,CAAA,CACJ;MA5BI,EAAK,GA4BT,CACZ;GACE,CAAA,CACF"}

package/dist/crewfoundry/pages/CommunicationsVideoCallsPagePage.js

@@ -2,57 +2,64 @@ import { useCrewFoundryStore as e } from "../store/crewfoundryStore.js";
 import { useMemo as t } from "react";
 import { Calendar as n, Clock as r, Monitor as i, Users as a, Video as o } from "lucide-react";
 import { jsx as s, jsxs as c } from "react/jsx-runtime";
-import { Badge as l, Button as u, Card as d, CardContent as f, CardHeader as p, CardTitle as m, GlassCard as h, GradientText as g } from "@burdenoff/fe-libs/ui";
+import { Badge as l, Button as u, Card as d, CardContent as f, CardHeader as p, CardTitle as m, GlassCard as h, GradientText as g, PagePurpose as _ } from "@burdenoff/fe-libs/ui";
 //#region src/crewfoundry/pages/CommunicationsVideoCallsPagePage.tsx
-var _ = (e) => `${Math.max(e, 15)} min`, v = (e) => {
+var v = (e) => `${Math.max(e, 15)} min`, y = (e) => {
 	let t = Math.max(e, 1);
 	return `${String(t).padStart(2, "0")}:${String(t * 7 % 60).padStart(2, "0")}`;
-}, y = (e) => {
+}, b = (e) => {
 	let t = new Date(e);
 	return Number.isNaN(t.getTime()) ? "Upcoming" : t.toLocaleDateString();
 };
-function b() {
-	let { teams: b, interviews: x, announcements: S } = e(), C = t(() => {
-		let e = b.slice(0, 6).map((e, t) => ({
+function x() {
+	let { teams: x, interviews: S, announcements: C } = e(), w = t(() => {
+		let e = x.slice(0, 6).map((e, t) => ({
 			id: `team-${e.id}`,
 			title: `${e.name} Sync`,
 			host: e.leadName,
-			time: y(e.createdAt),
-			duration: _(15 + t * 10),
+			time: b(e.createdAt),
+			duration: v(15 + t * 10),
 			participants: Math.max(e.memberCount, 2),
 			recurring: t % 2 == 0
-		})), t = x.slice(0, 4).map((e) => ({
+		})), t = S.slice(0, 4).map((e) => ({
 			id: `interview-${e.id}`,
 			title: `Interview · ${e.candidateName}`,
 			host: e.interviewerName,
-			time: y(e.date),
-			duration: _(Number.parseInt(e.time.split(":")[0] || "30", 10)),
+			time: b(e.date),
+			duration: v(Number.parseInt(e.time.split(":")[0] || "30", 10)),
 			participants: 3,
 			recurring: !1
 		}));
 		return [...e, ...t];
-	}, [x, b]), w = t(() => S.slice(0, 6).map((e) => {
+	}, [S, x]), T = t(() => C.slice(0, 6).map((e) => {
 		let t = Math.max(12, Math.round(e.content.length / 40));
 		return {
 			id: `recording-${e.id}`,
 			title: `${e.title} recording`,
-			date: y(e.createdAt),
-			duration: v(t),
+			date: b(e.createdAt),
+			duration: y(t),
 			size: `${(t / 10).toFixed(1)} GB`
 		};
-	}), [S]), T = C.length ? Math.round(C.map((e) => Number.parseInt(e.duration.split(" ")[0], 10)).reduce((e, t) => e + t, 0) / C.length) : 0;
+	}), [C]), E = w.length ? Math.round(w.map((e) => Number.parseInt(e.duration.split(" ")[0], 10)).reduce((e, t) => e + t, 0) / w.length) : 0;
 	return /* @__PURE__ */ c("div", {
 		className: "space-y-6 p-6",
 		children: [
 			/* @__PURE__ */ c("div", {
 				className: "flex items-center justify-between",
-				children: [/* @__PURE__ */ c("div", { children: [/* @__PURE__ */ s("h1", {
-					className: "text-2xl font-semibold",
-					children: /* @__PURE__ */ s(g, { children: "Video Calls" })
-				}), /* @__PURE__ */ s("p", {
-					className: "text-sm text-text-secondary",
-					children: "Video meetings and recordings"
-				})] }), /* @__PURE__ */ c("div", {
+				children: [/* @__PURE__ */ c("div", { children: [
+					/* @__PURE__ */ s("h1", {
+						className: "text-2xl font-semibold",
+						children: /* @__PURE__ */ s(g, { children: "Video Calls" })
+					}),
+					/* @__PURE__ */ s("p", {
+						className: "text-sm text-text-secondary",
+						children: "Video meetings and recordings"
+					}),
+					/* @__PURE__ */ s(_, {
+						className: "mt-1",
+						children: "Host and join video meetings with your teams — schedule a call or start one instantly for face-to-face collaboration."
+					})
+				] }), /* @__PURE__ */ c("div", {
 					className: "flex gap-2",
 					children: [/* @__PURE__ */ c(u, {
 						variant: "outline",
@@ -68,7 +75,8 @@ function b() {
 				className: "grid gap-4 md:grid-cols-3",
 				children: [
 					/* @__PURE__ */ c(h, {
-						treatment: "metric",
+						treatment: "glass",
+						glow: !0,
 						className: "border-border-seam",
 						children: [/* @__PURE__ */ c(p, {
 							className: "flex flex-row items-center justify-between space-y-0 pb-2",
@@ -78,7 +86,7 @@ function b() {
 							}), /* @__PURE__ */ s(n, { className: "h-4 w-4 text-status-info-text" })]
 						}), /* @__PURE__ */ c(f, { children: [/* @__PURE__ */ s("div", {
 							className: "text-2xl font-bold tabular-nums",
-							children: C.length
+							children: w.length
 						}), /* @__PURE__ */ s("p", {
 							className: "text-xs text-text-secondary",
 							children: "meetings scheduled"
@@ -95,7 +103,7 @@ function b() {
 							}), /* @__PURE__ */ s(i, { className: "h-4 w-4 text-text-secondary" })]
 						}), /* @__PURE__ */ c(f, { children: [/* @__PURE__ */ s("div", {
 							className: "text-2xl font-bold tabular-nums",
-							children: w.length
+							children: T.length
 						}), /* @__PURE__ */ s("p", {
 							className: "text-xs text-text-secondary",
 							children: "available"
@@ -112,14 +120,14 @@ function b() {
 							}), /* @__PURE__ */ s(r, { className: "h-4 w-4 text-text-secondary" })]
 						}), /* @__PURE__ */ s(f, { children: /* @__PURE__ */ c("div", {
 							className: "text-2xl font-bold tabular-nums",
-							children: [T, " min"]
+							children: [E, " min"]
 						}) })]
 					})
 				]
 			}),
 			/* @__PURE__ */ c(d, { children: [/* @__PURE__ */ s(p, { children: /* @__PURE__ */ s(m, { children: "Upcoming Meetings" }) }), /* @__PURE__ */ s(f, {
 				className: "space-y-3",
-				children: C.map((e) => /* @__PURE__ */ c("div", {
+				children: w.map((e) => /* @__PURE__ */ c("div", {
 					className: "flex items-center justify-between rounded border p-3",
 					children: [/* @__PURE__ */ c("div", { children: [/* @__PURE__ */ s("p", {
 						className: "text-sm font-medium",
@@ -159,7 +167,7 @@ function b() {
 			})] }),
 			/* @__PURE__ */ c(d, { children: [/* @__PURE__ */ s(p, { children: /* @__PURE__ */ s(m, { children: "Recent Recordings" }) }), /* @__PURE__ */ s(f, {
 				className: "space-y-3",
-				children: w.map((e) => /* @__PURE__ */ c("div", {
+				children: T.map((e) => /* @__PURE__ */ c("div", {
 					className: "flex items-center justify-between rounded border p-3",
 					children: [/* @__PURE__ */ c("div", { children: [/* @__PURE__ */ s("p", {
 						className: "text-sm font-medium",
@@ -185,6 +193,6 @@ function b() {
 	});
 }
 //#endregion
-export { b as CommunicationsVideoCallsPagePage };
+export { x as CommunicationsVideoCallsPagePage };
 
 //# sourceMappingURL=CommunicationsVideoCallsPagePage.js.map

package/dist/crewfoundry/pages/CommunicationsVideoCallsPagePage.js.map

@@ -1 +1 @@
-{"version":3,"file":"CommunicationsVideoCallsPagePage.js","names":[],"sources":["../../../src/crewfoundry/pages/CommunicationsVideoCallsPagePage.tsx"],"sourcesContent":["import { useMemo } from 'react';\nimport {\n  Badge,\n  Button,\n  Card,\n  CardContent,\n  CardHeader,\n  CardTitle,\n  GlassCard,\n  GradientText,\n} from '@burdenoff/fe-libs/ui';\nimport { Calendar, Clock, Monitor, Users, Video } from 'lucide-react';\nimport { useCrewFoundryStore } from '../store/crewfoundryStore';\n\ntype Meeting = {\n  id: string;\n  title: string;\n  host: string;\n  time: string;\n  duration: string;\n  participants: number;\n  recurring: boolean;\n};\n\ntype Recording = {\n  id: string;\n  title: string;\n  date: string;\n  duration: string;\n  size: string;\n};\n\nconst formatMeetingDuration = (minutes: number): string => `${Math.max(minutes, 15)} min`;\n\nconst formatRecordingDuration = (minutes: number): string => {\n  const safeMinutes = Math.max(minutes, 1);\n  const mm = String(safeMinutes).padStart(2, '0');\n  const ss = String((safeMinutes * 7) % 60).padStart(2, '0');\n  return `${mm}:${ss}`;\n};\n\nconst formatDate = (value: string): string => {\n  const parsed = new Date(value);\n  if (Number.isNaN(parsed.getTime())) {\n    return 'Upcoming';\n  }\n  return parsed.toLocaleDateString();\n};\n\nexport function CommunicationsVideoCallsPagePage() {\n  const { teams, interviews, announcements } = useCrewFoundryStore();\n\n  const upcomingMeetings = useMemo<Meeting[]>(() => {\n    const teamMeetings = teams.slice(0, 6).map((team, index) => ({\n      id: `team-${team.id}`,\n      title: `${team.name} Sync`,\n      host: team.leadName,\n      time: formatDate(team.createdAt),\n      duration: formatMeetingDuration(15 + index * 10),\n      participants: Math.max(team.memberCount, 2),\n      recurring: index % 2 === 0,\n    }));\n\n    const interviewMeetings = interviews.slice(0, 4).map((interview) => ({\n      id: `interview-${interview.id}`,\n      title: `Interview · ${interview.candidateName}`,\n      host: interview.interviewerName,\n      time: formatDate(interview.date),\n      duration: formatMeetingDuration(Number.parseInt(interview.time.split(':')[0] || '30', 10)),\n      participants: 3,\n      recurring: false,\n    }));\n\n    return [...teamMeetings, ...interviewMeetings];\n  }, [interviews, teams]);\n\n  const recentRecordings = useMemo<Recording[]>(() => {\n    const source = announcements.slice(0, 6);\n    return source.map((announcement) => {\n      const durationMinutes = Math.max(12, Math.round(announcement.content.length / 40));\n      return {\n        id: `recording-${announcement.id}`,\n        title: `${announcement.title} recording`,\n        date: formatDate(announcement.createdAt),\n        duration: formatRecordingDuration(durationMinutes),\n        size: `${(durationMinutes / 10).toFixed(1)} GB`,\n      };\n    });\n  }, [announcements]);\n\n  const averageDurationMinutes = upcomingMeetings.length\n    ? Math.round(\n        upcomingMeetings\n          .map((meeting) => Number.parseInt(meeting.duration.split(' ')[0], 10))\n          .reduce((total, value) => total + value, 0) / upcomingMeetings.length\n      )\n    : 0;\n\n  return (\n    <div className=\"space-y-6 p-6\">\n      <div className=\"flex items-center justify-between\">\n        <div>\n          <h1 className=\"text-2xl font-semibold\">\n            <GradientText>Video Calls</GradientText>\n          </h1>\n          <p className=\"text-sm text-text-secondary\">Video meetings and recordings</p>\n        </div>\n        <div className=\"flex gap-2\">\n          <Button variant=\"outline\" size=\"sm\">\n            <Calendar className=\"mr-1 h-4 w-4\" />\n            Schedule\n          </Button>\n          <Button size=\"sm\">\n            <Video className=\"mr-1 h-4 w-4\" />\n            Start Meeting\n          </Button>\n        </div>\n      </div>\n\n      <div className=\"grid gap-4 md:grid-cols-3\">\n        <GlassCard treatment=\"metric\" className=\"border-border-seam\">\n          <CardHeader className=\"flex flex-row items-center justify-between space-y-0 pb-2\">\n            <CardTitle className=\"text-sm font-medium\">Upcoming</CardTitle>\n            <Calendar className=\"h-4 w-4 text-status-info-text\" />\n          </CardHeader>\n          <CardContent>\n            <div className=\"text-2xl font-bold tabular-nums\">{upcomingMeetings.length}</div>\n            <p className=\"text-xs text-text-secondary\">meetings scheduled</p>\n          </CardContent>\n        </GlassCard>\n        <GlassCard treatment=\"metric\" className=\"border-border-seam\">\n          <CardHeader className=\"flex flex-row items-center justify-between space-y-0 pb-2\">\n            <CardTitle className=\"text-sm font-medium\">Recordings</CardTitle>\n            <Monitor className=\"h-4 w-4 text-text-secondary\" />\n          </CardHeader>\n          <CardContent>\n            <div className=\"text-2xl font-bold tabular-nums\">{recentRecordings.length}</div>\n            <p className=\"text-xs text-text-secondary\">available</p>\n          </CardContent>\n        </GlassCard>\n        <GlassCard treatment=\"metric\" className=\"border-border-seam\">\n          <CardHeader className=\"flex flex-row items-center justify-between space-y-0 pb-2\">\n            <CardTitle className=\"text-sm font-medium\">Avg Duration</CardTitle>\n            <Clock className=\"h-4 w-4 text-text-secondary\" />\n          </CardHeader>\n          <CardContent>\n            <div className=\"text-2xl font-bold tabular-nums\">{averageDurationMinutes} min</div>\n          </CardContent>\n        </GlassCard>\n      </div>\n\n      <Card>\n        <CardHeader>\n          <CardTitle>Upcoming Meetings</CardTitle>\n        </CardHeader>\n        <CardContent className=\"space-y-3\">\n          {upcomingMeetings.map((meeting) => (\n            <div key={meeting.id} className=\"flex items-center justify-between rounded border p-3\">\n              <div>\n                <p className=\"text-sm font-medium\">{meeting.title}</p>\n                <p className=\"text-xs text-text-secondary\">Hosted by {meeting.host}</p>\n              </div>\n              <div className=\"flex items-center gap-3\">\n                <span className=\"text-xs text-text-secondary\">{meeting.time}</span>\n                <Badge variant=\"outline\" className=\"text-[10px]\">\n                  {meeting.duration}\n                </Badge>\n                <span className=\"flex items-center gap-1 text-xs\">\n                  <Users className=\"h-3 w-3\" />\n                  {meeting.participants}\n                </span>\n                {meeting.recurring && (\n                  <Badge variant=\"secondary\" className=\"text-[10px]\">\n                    recurring\n                  </Badge>\n                )}\n                <Button size=\"sm\" className=\"h-7 text-xs\">\n                  <Video className=\"mr-1 h-3 w-3\" />\n                  Join\n                </Button>\n              </div>\n            </div>\n          ))}\n        </CardContent>\n      </Card>\n\n      <Card>\n        <CardHeader>\n          <CardTitle>Recent Recordings</CardTitle>\n        </CardHeader>\n        <CardContent className=\"space-y-3\">\n          {recentRecordings.map((recording) => (\n            <div\n              key={recording.id}\n              className=\"flex items-center justify-between rounded border p-3\"\n            >\n              <div>\n                <p className=\"text-sm font-medium\">{recording.title}</p>\n                <p className=\"text-xs text-text-secondary\">\n                  {recording.date} · {recording.duration} · {recording.size}\n                </p>\n              </div>\n              <Button variant=\"outline\" size=\"sm\" className=\"h-7 text-xs\">\n                Watch\n              </Button>\n            </div>\n          ))}\n        </CardContent>\n      </Card>\n    </div>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"CommunicationsVideoCallsPagePage.js","names":[],"sources":["../../../src/crewfoundry/pages/CommunicationsVideoCallsPagePage.tsx"],"sourcesContent":["import { useMemo } from 'react';\nimport {\n  Badge,\n  Button,\n  Card,\n  CardContent,\n  CardHeader,\n  CardTitle,\n  GlassCard,\n  GradientText,\n  PagePurpose,\n} from '@burdenoff/fe-libs/ui';\nimport { Calendar, Clock, Monitor, Users, Video } from 'lucide-react';\nimport { useCrewFoundryStore } from '../store/crewfoundryStore';\n\ntype Meeting = {\n  id: string;\n  title: string;\n  host: string;\n  time: string;\n  duration: string;\n  participants: number;\n  recurring: boolean;\n};\n\ntype Recording = {\n  id: string;\n  title: string;\n  date: string;\n  duration: string;\n  size: string;\n};\n\nconst formatMeetingDuration = (minutes: number): string => `${Math.max(minutes, 15)} min`;\n\nconst formatRecordingDuration = (minutes: number): string => {\n  const safeMinutes = Math.max(minutes, 1);\n  const mm = String(safeMinutes).padStart(2, '0');\n  const ss = String((safeMinutes * 7) % 60).padStart(2, '0');\n  return `${mm}:${ss}`;\n};\n\nconst formatDate = (value: string): string => {\n  const parsed = new Date(value);\n  if (Number.isNaN(parsed.getTime())) {\n    return 'Upcoming';\n  }\n  return parsed.toLocaleDateString();\n};\n\nexport function CommunicationsVideoCallsPagePage() {\n  const { teams, interviews, announcements } = useCrewFoundryStore();\n\n  const upcomingMeetings = useMemo<Meeting[]>(() => {\n    const teamMeetings = teams.slice(0, 6).map((team, index) => ({\n      id: `team-${team.id}`,\n      title: `${team.name} Sync`,\n      host: team.leadName,\n      time: formatDate(team.createdAt),\n      duration: formatMeetingDuration(15 + index * 10),\n      participants: Math.max(team.memberCount, 2),\n      recurring: index % 2 === 0,\n    }));\n\n    const interviewMeetings = interviews.slice(0, 4).map((interview) => ({\n      id: `interview-${interview.id}`,\n      title: `Interview · ${interview.candidateName}`,\n      host: interview.interviewerName,\n      time: formatDate(interview.date),\n      duration: formatMeetingDuration(Number.parseInt(interview.time.split(':')[0] || '30', 10)),\n      participants: 3,\n      recurring: false,\n    }));\n\n    return [...teamMeetings, ...interviewMeetings];\n  }, [interviews, teams]);\n\n  const recentRecordings = useMemo<Recording[]>(() => {\n    const source = announcements.slice(0, 6);\n    return source.map((announcement) => {\n      const durationMinutes = Math.max(12, Math.round(announcement.content.length / 40));\n      return {\n        id: `recording-${announcement.id}`,\n        title: `${announcement.title} recording`,\n        date: formatDate(announcement.createdAt),\n        duration: formatRecordingDuration(durationMinutes),\n        size: `${(durationMinutes / 10).toFixed(1)} GB`,\n      };\n    });\n  }, [announcements]);\n\n  const averageDurationMinutes = upcomingMeetings.length\n    ? Math.round(\n        upcomingMeetings\n          .map((meeting) => Number.parseInt(meeting.duration.split(' ')[0], 10))\n          .reduce((total, value) => total + value, 0) / upcomingMeetings.length\n      )\n    : 0;\n\n  return (\n    <div className=\"space-y-6 p-6\">\n      <div className=\"flex items-center justify-between\">\n        <div>\n          <h1 className=\"text-2xl font-semibold\">\n            <GradientText>Video Calls</GradientText>\n          </h1>\n          <p className=\"text-sm text-text-secondary\">Video meetings and recordings</p>\n          <PagePurpose className=\"mt-1\">Host and join video meetings with your teams — schedule a call or start one instantly for face-to-face collaboration.</PagePurpose>\n        </div>\n        <div className=\"flex gap-2\">\n          <Button variant=\"outline\" size=\"sm\">\n            <Calendar className=\"mr-1 h-4 w-4\" />\n            Schedule\n          </Button>\n          <Button size=\"sm\">\n            <Video className=\"mr-1 h-4 w-4\" />\n            Start Meeting\n          </Button>\n        </div>\n      </div>\n\n      <div className=\"grid gap-4 md:grid-cols-3\">\n        <GlassCard treatment=\"glass\" glow className=\"border-border-seam\">\n          <CardHeader className=\"flex flex-row items-center justify-between space-y-0 pb-2\">\n            <CardTitle className=\"text-sm font-medium\">Upcoming</CardTitle>\n            <Calendar className=\"h-4 w-4 text-status-info-text\" />\n          </CardHeader>\n          <CardContent>\n            <div className=\"text-2xl font-bold tabular-nums\">{upcomingMeetings.length}</div>\n            <p className=\"text-xs text-text-secondary\">meetings scheduled</p>\n          </CardContent>\n        </GlassCard>\n        <GlassCard treatment=\"metric\" className=\"border-border-seam\">\n          <CardHeader className=\"flex flex-row items-center justify-between space-y-0 pb-2\">\n            <CardTitle className=\"text-sm font-medium\">Recordings</CardTitle>\n            <Monitor className=\"h-4 w-4 text-text-secondary\" />\n          </CardHeader>\n          <CardContent>\n            <div className=\"text-2xl font-bold tabular-nums\">{recentRecordings.length}</div>\n            <p className=\"text-xs text-text-secondary\">available</p>\n          </CardContent>\n        </GlassCard>\n        <GlassCard treatment=\"metric\" className=\"border-border-seam\">\n          <CardHeader className=\"flex flex-row items-center justify-between space-y-0 pb-2\">\n            <CardTitle className=\"text-sm font-medium\">Avg Duration</CardTitle>\n            <Clock className=\"h-4 w-4 text-text-secondary\" />\n          </CardHeader>\n          <CardContent>\n            <div className=\"text-2xl font-bold tabular-nums\">{averageDurationMinutes} min</div>\n          </CardContent>\n        </GlassCard>\n      </div>\n\n      <Card>\n        <CardHeader>\n          <CardTitle>Upcoming Meetings</CardTitle>\n        </CardHeader>\n        <CardContent className=\"space-y-3\">\n          {upcomingMeetings.map((meeting) => (\n            <div key={meeting.id} className=\"flex items-center justify-between rounded border p-3\">\n              <div>\n                <p className=\"text-sm font-medium\">{meeting.title}</p>\n                <p className=\"text-xs text-text-secondary\">Hosted by {meeting.host}</p>\n              </div>\n              <div className=\"flex items-center gap-3\">\n                <span className=\"text-xs text-text-secondary\">{meeting.time}</span>\n                <Badge variant=\"outline\" className=\"text-[10px]\">\n                  {meeting.duration}\n                </Badge>\n                <span className=\"flex items-center gap-1 text-xs\">\n                  <Users className=\"h-3 w-3\" />\n                  {meeting.participants}\n                </span>\n                {meeting.recurring && (\n                  <Badge variant=\"secondary\" className=\"text-[10px]\">\n                    recurring\n                  </Badge>\n                )}\n                <Button size=\"sm\" className=\"h-7 text-xs\">\n                  <Video className=\"mr-1 h-3 w-3\" />\n                  Join\n                </Button>\n              </div>\n            </div>\n          ))}\n        </CardContent>\n      </Card>\n\n      <Card>\n        <CardHeader>\n          <CardTitle>Recent Recordings</CardTitle>\n        </CardHeader>\n        <CardContent className=\"space-y-3\">\n          {recentRecordings.map((recording) => (\n            <div\n              key={recording.id}\n              className=\"flex items-center justify-between rounded border p-3\"\n            >\n              <div>\n                <p className=\"text-sm font-medium\">{recording.title}</p>\n                <p className=\"text-xs text-text-secondary\">\n                  {recording.date} · {recording.duration} · {recording.size}\n                </p>\n              </div>\n              <Button variant=\"outline\" size=\"sm\" className=\"h-7 text-xs\">\n                Watch\n              </Button>\n            </div>\n          ))}\n        </CardContent>\n      </Card>\n    </div>\n  );\n}\n"],"mappings":"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"}