npm - @burdenoff/microfe-timecampus - Versions diffs - 2026.703.4 → 2026.703.6 - Mend

@burdenoff/microfe-timecampus 2026.703.4 → 2026.703.6

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.

Files changed (955) hide show

package/dist/timecampus/pages/application-usage/ApplicationUsagePage.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ApplicationUsagePage.js","names":[],"sources":["../../../../src/timecampus/pages/application-usage/ApplicationUsagePage.tsx"],"sourcesContent":["import { useState } from \"react\";\nimport { Monitor, Clock, Plus, Tag, Trash2 } from \"lucide-react\";\nimport { PageLayout } from \"../../components/PageLayout\";\nimport { StatCard } from \"../../components/StatCard\";\nimport { EmptyState } from \"../../components/EmptyState\";\nimport { LoadingSkeleton } from \"../../components/LoadingSkeleton\";\nimport { Modal } from \"../../components/Modal\";\nimport { formatHours } from \"../../utils/helpers\";\nimport { useTimeCampus } from \"../../providers/TimeCampusProvider\";\nimport {\n useListApplicationUsagesQuery,\n useGetAppUsageSummaryQuery,\n useRecordApplicationUsageMutation,\n useCategorizeApplicationMutation,\n useDeleteApplicationUsageMutation,\n type ApplicationUsageFieldsFragment,\n} from \"@/generated/wspace-operations\";\n\nconst PAGE_SIZE = 50;\n\nconst CATEGORY_OPTIONS = [\n \"productive\",\n \"neutral\",\n \"communication\",\n \"distracting\",\n] as const;\n\nconst categoryColors: Record<string, string> = {\n productive: \"bg-status-success-bg text-status-success-text\",\n neutral: \"bg-bg-sunken text-text-secondary\",\n communication: \"bg-status-info-bg text-status-info-text\",\n distracting: \"bg-status-error-bg text-status-error-text\",\n};\n\nconst inputClasses =\n \"mt-1 w-full rounded-md border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary placeholder:text-text-secondary\";\nconst labelClasses = \"block text-sm font-medium text-text-primary\";\n\nfunction todayIso(): string {\n return new Date().toISOString();\n}\n\nexport function ApplicationUsagePage() {\n const { workspaceId = \"\" } = useTimeCampus();\n\n const {\n data: usagesData,\n loading: usagesLoading,\n error: usagesError,\n fetchMore,\n refetch: refetchUsages,\n } = useListApplicationUsagesQuery({\n variables: { limit: PAGE_SIZE, offset: 0 },\n skip: !workspaceId,\n notifyOnNetworkStatusChange: true,\n });\n\n const {\n data: summaryData,\n loading: summaryLoading,\n error: summaryError,\n refetch: refetchSummary,\n } = useGetAppUsageSummaryQuery({\n skip: !workspaceId,\n });\n\n const loading = usagesLoading \|\| summaryLoading;\n const error = usagesError \|\| summaryError;\n const apps = usagesData?.applicationUsages ?? [];\n const summary = summaryData?.appUsageSummary;\n const hasMore = apps.length > 0 && apps.length % PAGE_SIZE === 0;\n\n const [loadingMore, setLoadingMore] = useState(false);\n\n // Add-usage modal\n const [addOpen, setAddOpen] = useState(false);\n const [appName, setAppName] = useState(\"\");\n const [appCategory, setAppCategory] = useState<string>(\"productive\");\n const [appMinutes, setAppMinutes] = useState(\"\");\n const [appSessions, setAppSessions] = useState(\"\");\n\n // Recategorize + delete\n const [recatApp, setRecatApp] =\n useState<ApplicationUsageFieldsFragment \| null>(null);\n const [recatCategory, setRecatCategory] = useState<string>(\"productive\");\n const [deleteApp, setDeleteApp] =\n useState<ApplicationUsageFieldsFragment \| null>(null);\n\n const [recordUsage, { loading: recording, error: recordError }] =\n useRecordApplicationUsageMutation();\n const [categorize, { loading: categorizing, error: categorizeError }] =\n useCategorizeApplicationMutation();\n const [removeUsage, { loading: deleting, error: deleteError }] =\n useDeleteApplicationUsageMutation();\n\n const refreshAll = async () => {\n await Promise.all([refetchUsages(), refetchSummary()]);\n };\n\n const openAdd = () => {\n setAppName(\"\");\n setAppCategory(\"productive\");\n setAppMinutes(\"\");\n setAppSessions(\"\");\n setAddOpen(true);\n };\n\n const handleRecord = async () => {\n if (!appName.trim() \|\| !appMinutes) return;\n await recordUsage({\n variables: {\n input: {\n applicationName: appName.trim(),\n category: appCategory,\n timeSpent: Math.round(Number(appMinutes) * 60),\n sessions: appSessions ? Number(appSessions) : undefined,\n date: todayIso(),\n },\n },\n });\n setAddOpen(false);\n await refreshAll();\n };\n\n const openRecat = (app: ApplicationUsageFieldsFragment) => {\n setRecatApp(app);\n setRecatCategory(app.category);\n };\n\n const handleRecategorize = async () => {\n if (!recatApp) return;\n await categorize({\n variables: {\n applicationName: recatApp.applicationName,\n category: recatCategory,\n },\n });\n setRecatApp(null);\n await refreshAll();\n };\n\n const handleDelete = async () => {\n if (!deleteApp) return;\n await removeUsage({ variables: { id: deleteApp.id } });\n setDeleteApp(null);\n await refreshAll();\n };\n\n const handleLoadMore = async () => {\n setLoadingMore(true);\n try {\n await fetchMore({\n variables: { offset: apps.length },\n updateQuery: (prev, { fetchMoreResult }) => {\n if (!fetchMoreResult) return prev;\n return {\n ...prev,\n applicationUsages: [\n ...prev.applicationUsages,\n ...fetchMoreResult.applicationUsages,\n ],\n };\n },\n });\n } finally {\n setLoadingMore(false);\n }\n };\n\n const totalScreenTimeSeconds = apps.reduce(\n (sum: number, app: ApplicationUsageFieldsFragment) => sum + app.timeSpent,\n 0,\n );\n const totalSwitches = apps.reduce(\n (sum: number, app: ApplicationUsageFieldsFragment) => sum + app.switches,\n 0,\n );\n const productiveRatio =\n summary?.productivityRatio != null\n ? `${Math.round(summary.productivityRatio * 100)}%`\n : \"--\";\n\n // Count focus sessions (apps with > 90 min continuous usage)\n const focusSessions = apps.filter(\n (app: ApplicationUsageFieldsFragment) => app.timeSpent >= 5400,\n ).length;\n\n if (loading) {\n return (\n <PageLayout\n title=\"App Usage\"\n description=\"Track application usage and productivity\"\n >\n <LoadingSkeleton variant=\"card\" count={4} />\n </PageLayout>\n );\n }\n\n if (error) {\n return (\n <PageLayout\n title=\"App Usage\"\n description=\"Track application usage and productivity\"\n >\n <div className=\"rounded-xl border border-status-error-border/50 bg-status-error-bg/10 p-4 text-sm text-status-error-text\">\n Failed to load application usage. Please try again later.\n </div>\n </PageLayout>\n );\n }\n\n return (\n <PageLayout\n title=\"App Usage\"\n description=\"Track application usage and productivity\"\n purpose=\"See where your screen time actually goes — which apps are productive, how often you context-switch, and how many real focus sessions you get — so you can cut the digital distractions eating your day.\"\n actions={\n <button\n onClick={openAdd}\n className=\"inline-flex items-center gap-1.5 rounded-md bg-action-primary-bg px-3 py-2 text-sm font-medium text-action-primary-text hover:bg-action-primary-bg/90\"\n >\n <Plus className=\"h-4 w-4\" />\n Add Usage\n </button>\n }\n >\n <div className=\"grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-4\">\n <StatCard\n featured\n title=\"Total Screen Time\"\n value={formatHours(totalScreenTimeSeconds / 3600)}\n icon={<Monitor className=\"h-5 w-5\" />}\n />\n <StatCard\n title=\"Productive Time\"\n value={productiveRatio}\n trend={\n summary?.productivityRatio != null\n ? { value: 5, label: \"vs last week\" }\n : undefined\n }\n />\n <StatCard\n title=\"App Switches\"\n value={String(totalSwitches)}\n description={`Avg. ${apps.length > 0 ? Math.round(totalSwitches / apps.length) : 0}/app`}\n />\n <StatCard\n title=\"Focus Sessions\"\n value={String(focusSessions)}\n icon={<Clock className=\"h-5 w-5\" />}\n description=\"90+ min each\"\n />\n </div>\n\n {apps.length === 0 ? (\n <EmptyState\n illustration=\"empty-data\"\n title=\"No application usage data found\"\n description=\"Record app usage manually or connect the desktop tracker, and your apps will appear here ranked by time spent.\"\n action={\n <button\n onClick={openAdd}\n className=\"inline-flex items-center gap-1.5 rounded-md bg-action-primary-bg px-3 py-2 text-sm font-medium text-action-primary-text hover:bg-action-primary-bg/90\"\n >\n <Plus className=\"h-4 w-4\" />\n Add Usage\n </button>\n }\n />\n ) : (\n <>\n <div className=\"rounded-xl border border-border-seam bg-gloss-card shadow-pop\">\n <div className=\"divide-y divide-border\">\n {apps.map((app: ApplicationUsageFieldsFragment) => (\n <div\n key={app.id}\n className=\"flex items-center justify-between gap-3 p-4 transition-colors hover:bg-bg-sunken/50\"\n >\n <div className=\"flex min-w-0 items-center gap-3\">\n <Monitor className=\"h-5 w-5 shrink-0 text-text-secondary\" />\n <div className=\"min-w-0\">\n <p className=\"truncate text-sm font-medium text-text-primary\">\n {app.applicationName}\n </p>\n <p className=\"text-xs text-text-secondary\">\n {app.sessions} sessions\n </p>\n </div>\n </div>\n <div className=\"flex shrink-0 items-center gap-3 sm:gap-4\">\n <p className=\"text-sm font-mono font-medium text-text-primary\">\n {formatHours(app.timeSpent / 3600)}\n </p>\n <span\n className={`hidden rounded-full px-2 py-0.5 text-xs font-medium sm:inline-flex ${categoryColors[app.category] \|\| \"bg-bg-sunken text-text-secondary\"}`}\n >\n {app.category}\n </span>\n <div className=\"hidden w-16 lg:block\">\n <div className=\"h-2 rounded-full bg-bg-sunken\">\n <div\n className=\"h-2 rounded-full bg-action-primary-bg\"\n style={{\n width: `${Math.min(100, Math.round((app.timeSpent / (totalScreenTimeSeconds \|\| 1)) * 100))}%`,\n }}\n />\n </div>\n </div>\n <button\n onClick={() => openRecat(app)}\n className=\"rounded-md p-1.5 text-text-secondary hover:bg-bg-sunken hover:text-text-primary\"\n aria-label=\"Recategorize application\"\n >\n <Tag className=\"h-4 w-4\" />\n </button>\n <button\n onClick={() => setDeleteApp(app)}\n className=\"rounded-md p-1.5 text-text-secondary hover:bg-status-error-bg hover:text-status-error-text\"\n aria-label=\"Delete usage entry\"\n >\n <Trash2 className=\"h-4 w-4\" />\n </button>\n </div>\n </div>\n ))}\n </div>\n </div>\n {hasMore && (\n <div className=\"mt-4 flex justify-center\">\n <button\n onClick={handleLoadMore}\n disabled={loadingMore}\n className=\"rounded-md border border-border-subtle px-4 py-2 text-sm font-medium text-text-primary hover:bg-bg-sunken/50 disabled:opacity-50\"\n >\n {loadingMore ? \"Loading...\" : \"Load more\"}\n </button>\n </div>\n )}\n </>\n )}\n\n {/* Add usage modal /}\n <Modal\n open={addOpen}\n onClose={() => setAddOpen(false)}\n title=\"Record App Usage\"\n description=\"Manually log time spent in an application\"\n footer={\n <>\n <button\n onClick={() => setAddOpen(false)}\n className=\"rounded-md border border-border-subtle px-4 py-2 text-sm font-medium text-text-primary hover:bg-bg-sunken/50\"\n >\n Cancel\n </button>\n <button\n onClick={handleRecord}\n disabled={recording \|\| !appName.trim() \|\| !appMinutes}\n className=\"rounded-md bg-action-primary-bg px-4 py-2 text-sm font-medium text-action-primary-text hover:bg-action-primary-bg/90 disabled:opacity-50\"\n >\n {recording ? \"Saving...\" : \"Record\"}\n </button>\n </>\n }\n >\n {recordError && (\n <div className=\"mb-4 rounded-lg border border-status-error-bg/40 bg-status-error-bg p-3 text-sm text-status-error-text\">\n Failed to record usage. Please try again.\n </div>\n )}\n <div className=\"space-y-4\">\n <div>\n <label className={labelClasses}>Application Name</label>\n <input\n type=\"text\"\n placeholder=\"e.g. Visual Studio Code\"\n value={appName}\n onChange={(e) => setAppName(e.target.value)}\n className={inputClasses}\n />\n </div>\n <div className=\"grid grid-cols-1 gap-4 sm:grid-cols-2\">\n <div>\n <label className={labelClasses}>Category</label>\n <select\n value={appCategory}\n onChange={(e) => setAppCategory(e.target.value)}\n className={inputClasses}\n >\n {CATEGORY_OPTIONS.map((c) => (\n <option key={c} value={c} className=\"capitalize\">\n {c}\n </option>\n ))}\n </select>\n </div>\n <div>\n <label className={labelClasses}>Time Spent (minutes)</label>\n <input\n type=\"number\"\n min=\"0\"\n placeholder=\"0\"\n value={appMinutes}\n onChange={(e) => setAppMinutes(e.target.value)}\n className={inputClasses}\n />\n </div>\n </div>\n <div>\n <label className={labelClasses}>Sessions</label>\n <input\n type=\"number\"\n min=\"0\"\n placeholder=\"0\"\n value={appSessions}\n onChange={(e) => setAppSessions(e.target.value)}\n className={inputClasses}\n />\n </div>\n </div>\n </Modal>\n\n {/ Recategorize modal /}\n <Modal\n open={recatApp !== null}\n onClose={() => setRecatApp(null)}\n title=\"Recategorize Application\"\n description={recatApp?.applicationName}\n size=\"sm\"\n footer={\n <>\n <button\n onClick={() => setRecatApp(null)}\n className=\"rounded-md border border-border-subtle px-4 py-2 text-sm font-medium text-text-primary hover:bg-bg-sunken/50\"\n >\n Cancel\n </button>\n <button\n onClick={handleRecategorize}\n disabled={categorizing}\n className=\"rounded-md bg-action-primary-bg px-4 py-2 text-sm font-medium text-action-primary-text hover:bg-action-primary-bg/90 disabled:opacity-50\"\n >\n {categorizing ? \"Saving...\" : \"Save\"}\n </button>\n </>\n }\n >\n {categorizeError && (\n <div className=\"mb-4 rounded-lg border border-status-error-bg/40 bg-status-error-bg p-3 text-sm text-status-error-text\">\n Failed to recategorize. Please try again.\n </div>\n )}\n <label className={labelClasses}>Category</label>\n <select\n value={recatCategory}\n onChange={(e) => setRecatCategory(e.target.value)}\n className={inputClasses}\n >\n {CATEGORY_OPTIONS.map((c) => (\n <option key={c} value={c} className=\"capitalize\">\n {c}\n </option>\n ))}\n </select>\n <p className=\"mt-3 text-xs text-text-secondary\">\n This updates the category for all usage of “\n {recatApp?.applicationName}”.\n </p>\n </Modal>\n\n {/ Delete confirm modal */}\n <Modal\n open={deleteApp !== null}\n onClose={() => setDeleteApp(null)}\n title=\"Delete Usage Entry\"\n size=\"sm\"\n footer={\n <>\n <button\n onClick={() => setDeleteApp(null)}\n className=\"rounded-md border border-border-subtle px-4 py-2 text-sm font-medium text-text-primary hover:bg-bg-sunken/50\"\n >\n Cancel\n </button>\n <button\n onClick={handleDelete}\n disabled={deleting}\n className=\"rounded-md bg-status-error-bg px-4 py-2 text-sm font-medium text-status-error-text hover:bg-status-error-bg/90 disabled:opacity-50\"\n >\n {deleting ? \"Deleting...\" : \"Delete\"}\n </button>\n </>\n }\n >\n {deleteError && (\n <div className=\"mb-4 rounded-lg border border-status-error-bg/40 bg-status-error-bg p-3 text-sm text-status-error-text\">\n Failed to delete entry. Please try again.\n </div>\n )}\n <p className=\"text-sm text-text-secondary\">\n Are you sure you want to delete the usage entry for{\" \"}\n <span className=\"font-medium text-text-primary\">\n {deleteApp?.applicationName}\n </span>\n ? This action cannot be undone.\n </p>\n </Modal>\n </PageLayout>\n );\n}\n"],"mappings":"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"}
1	+ {"version":3,"file":"ApplicationUsagePage.js","names":[],"sources":["../../../../src/timecampus/pages/application-usage/ApplicationUsagePage.tsx"],"sourcesContent":["import { useState } from \"react\";\nimport { Monitor, Clock, Plus, Tag, Trash2 } from \"lucide-react\";\nimport { GlassCard } from \"@burdenoff/fe-libs/ui\";\nimport { PageLayout } from \"../../components/PageLayout\";\nimport { StatCard } from \"../../components/StatCard\";\nimport { StatusBadge } from \"../../components/StatusBadge\";\nimport { EmptyState } from \"../../components/EmptyState\";\nimport { LoadingSkeleton } from \"../../components/LoadingSkeleton\";\nimport { Modal } from \"../../components/Modal\";\nimport {\n ChartCard,\n DonutChart,\n TrendChart,\n chartTokens,\n type ChartDatum,\n type DonutSlice,\n type ValueFormatter,\n} from \"../../components\";\nimport { formatHours } from \"../../utils/helpers\";\nimport { useTimeCampus } from \"../../providers/TimeCampusProvider\";\nimport {\n useListApplicationUsagesQuery,\n useGetAppUsageSummaryQuery,\n useRecordApplicationUsageMutation,\n useCategorizeApplicationMutation,\n useDeleteApplicationUsageMutation,\n type ApplicationUsageFieldsFragment,\n} from \"@/generated/wspace-operations\";\n\nconst PAGE_SIZE = 50;\n\nconst CATEGORY_OPTIONS = [\n \"productive\",\n \"neutral\",\n \"communication\",\n \"distracting\",\n] as const;\n\nconst CATEGORY_VARIANT: Record<string, \"success\" \| \"muted\" \| \"info\" \| \"error\"> =\n {\n productive: \"success\",\n neutral: \"muted\",\n communication: \"info\",\n distracting: \"error\",\n };\n\n/** Category ring hues — token-only, echoing productive→positive / distracting→negative. /\nconst CATEGORY_SLICE_COLOR: Record<string, string> = {\n productive: chartTokens.positive,\n neutral: chartTokens.series[3],\n distracting: chartTokens.negative,\n};\n\nconst formatChartHours: ValueFormatter = (value) =>\n `${value.toFixed(value >= 10 ? 0 : 1)}h`;\n\nconst formatSecondsAsHours: ValueFormatter = (value) =>\n formatHours(value / 3600);\n\nconst formatDayTick = (value: string \| number): string => {\n const parsed = new Date(String(value));\n return Number.isNaN(parsed.getTime())\n ? String(value)\n : parsed.toLocaleDateString(\"en-US\", { month: \"short\", day: \"numeric\" });\n};\n\nconst inputClasses =\n \"mt-1 w-full rounded-md border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary placeholder:text-text-secondary\";\nconst labelClasses = \"block text-sm font-medium text-text-primary\";\n\nfunction todayIso(): string {\n return new Date().toISOString();\n}\n\nexport function ApplicationUsagePage() {\n const { workspaceId = \"\" } = useTimeCampus();\n\n const {\n data: usagesData,\n loading: usagesLoading,\n error: usagesError,\n fetchMore,\n refetch: refetchUsages,\n } = useListApplicationUsagesQuery({\n variables: { limit: PAGE_SIZE, offset: 0 },\n skip: !workspaceId,\n notifyOnNetworkStatusChange: true,\n });\n\n const {\n data: summaryData,\n loading: summaryLoading,\n error: summaryError,\n refetch: refetchSummary,\n } = useGetAppUsageSummaryQuery({\n skip: !workspaceId,\n });\n\n const loading = usagesLoading \|\| summaryLoading;\n const error = usagesError \|\| summaryError;\n const apps = usagesData?.applicationUsages ?? [];\n const summary = summaryData?.appUsageSummary;\n const hasMore = apps.length > 0 && apps.length % PAGE_SIZE === 0;\n\n const [loadingMore, setLoadingMore] = useState(false);\n\n // Add-usage modal\n const [addOpen, setAddOpen] = useState(false);\n const [appName, setAppName] = useState(\"\");\n const [appCategory, setAppCategory] = useState<string>(\"productive\");\n const [appMinutes, setAppMinutes] = useState(\"\");\n const [appSessions, setAppSessions] = useState(\"\");\n\n // Recategorize + delete\n const [recatApp, setRecatApp] =\n useState<ApplicationUsageFieldsFragment \| null>(null);\n const [recatCategory, setRecatCategory] = useState<string>(\"productive\");\n const [deleteApp, setDeleteApp] =\n useState<ApplicationUsageFieldsFragment \| null>(null);\n\n const [recordUsage, { loading: recording, error: recordError }] =\n useRecordApplicationUsageMutation();\n const [categorize, { loading: categorizing, error: categorizeError }] =\n useCategorizeApplicationMutation();\n const [removeUsage, { loading: deleting, error: deleteError }] =\n useDeleteApplicationUsageMutation();\n\n const refreshAll = async () => {\n await Promise.all([refetchUsages(), refetchSummary()]);\n };\n\n const openAdd = () => {\n setAppName(\"\");\n setAppCategory(\"productive\");\n setAppMinutes(\"\");\n setAppSessions(\"\");\n setAddOpen(true);\n };\n\n const handleRecord = async () => {\n if (!appName.trim() \|\| !appMinutes) return;\n await recordUsage({\n variables: {\n input: {\n applicationName: appName.trim(),\n category: appCategory,\n timeSpent: Math.round(Number(appMinutes) 60),\n sessions: appSessions ? Number(appSessions) : undefined,\n date: todayIso(),\n },\n },\n });\n setAddOpen(false);\n await refreshAll();\n };\n\n const openRecat = (app: ApplicationUsageFieldsFragment) => {\n setRecatApp(app);\n setRecatCategory(app.category);\n };\n\n const handleRecategorize = async () => {\n if (!recatApp) return;\n await categorize({\n variables: {\n applicationName: recatApp.applicationName,\n category: recatCategory,\n },\n });\n setRecatApp(null);\n await refreshAll();\n };\n\n const handleDelete = async () => {\n if (!deleteApp) return;\n await removeUsage({ variables: { id: deleteApp.id } });\n setDeleteApp(null);\n await refreshAll();\n };\n\n const handleLoadMore = async () => {\n setLoadingMore(true);\n try {\n await fetchMore({\n variables: { offset: apps.length },\n updateQuery: (prev, { fetchMoreResult }) => {\n if (!fetchMoreResult) return prev;\n return {\n ...prev,\n applicationUsages: [\n ...prev.applicationUsages,\n ...fetchMoreResult.applicationUsages,\n ],\n };\n },\n });\n } finally {\n setLoadingMore(false);\n }\n };\n\n const totalScreenTimeSeconds = apps.reduce(\n (sum: number, app: ApplicationUsageFieldsFragment) => sum + app.timeSpent,\n 0,\n );\n const totalSwitches = apps.reduce(\n (sum: number, app: ApplicationUsageFieldsFragment) => sum + app.switches,\n 0,\n );\n const productiveRatio =\n summary?.productivityRatio != null\n ? `${Math.round(summary.productivityRatio * 100)}%`\n : \"--\";\n\n // Count focus sessions (apps with > 90 min continuous usage)\n const focusSessions = apps.filter(\n (app: ApplicationUsageFieldsFragment) => app.timeSpent >= 5400,\n ).length;\n\n // Rank the loaded apps by time spent (drives the numbered list).\n const rankedApps = [...apps].sort(\n (a: ApplicationUsageFieldsFragment, b: ApplicationUsageFieldsFragment) =>\n b.timeSpent - a.timeSpent,\n );\n\n // Productive / neutral / distracting split from the real usage summary.\n const categorySlices: DonutSlice[] = summary\n ? [\n {\n name: \"Productive\",\n value: summary.productiveTime,\n color: CATEGORY_SLICE_COLOR.productive,\n },\n {\n name: \"Neutral\",\n value: summary.neutralTime,\n color: CATEGORY_SLICE_COLOR.neutral,\n },\n {\n name: \"Distracting\",\n value: summary.distractingTime,\n color: CATEGORY_SLICE_COLOR.distracting,\n },\n ]\n : [];\n const categoryTotalSeconds =\n (summary?.productiveTime ?? 0) +\n (summary?.neutralTime ?? 0) +\n (summary?.distractingTime ?? 0);\n\n // Daily usage trend — sum the loaded apps' tracked time per calendar day.\n const usageByDay = new Map<string, number>();\n for (const app of apps as ApplicationUsageFieldsFragment[]) {\n const day = (app.date ?? \"\").slice(0, 10);\n if (!day) continue;\n usageByDay.set(day, (usageByDay.get(day) ?? 0) + app.timeSpent);\n }\n const usageTrend: ChartDatum[] = Array.from(usageByDay.entries())\n .sort(([a], [b]) => a.localeCompare(b))\n .map(([day, seconds]) => ({\n day,\n hours: Math.round((seconds / 3600) * 100) / 100,\n }));\n\n if (loading) {\n return (\n <PageLayout\n title=\"App Usage\"\n description=\"Track application usage and productivity\"\n >\n <LoadingSkeleton variant=\"card\" count={4} />\n </PageLayout>\n );\n }\n\n if (error) {\n return (\n <PageLayout\n title=\"App Usage\"\n description=\"Track application usage and productivity\"\n >\n <div className=\"rounded-xl border border-status-error-border/50 bg-status-error-bg/10 p-4 text-sm text-status-error-text\">\n Failed to load application usage. Please try again later.\n </div>\n </PageLayout>\n );\n }\n\n return (\n <PageLayout\n title=\"App Usage\"\n description=\"Track application usage and productivity\"\n purpose=\"See where your screen time actually goes — which apps are productive, how often you context-switch, and how many real focus sessions you get — so you can cut the digital distractions eating your day.\"\n actions={\n <button\n onClick={openAdd}\n className=\"inline-flex items-center gap-1.5 rounded-md bg-action-primary-bg px-3 py-2 text-sm font-medium text-action-primary-text hover:bg-action-primary-bg/90\"\n >\n <Plus className=\"h-4 w-4\" />\n Add Usage\n </button>\n }\n >\n <div className=\"space-y-6\">\n <div className=\"grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-4\">\n <StatCard\n featured\n title=\"Total Screen Time\"\n value={formatHours(totalScreenTimeSeconds / 3600)}\n icon={<Monitor className=\"h-5 w-5\" />}\n />\n <StatCard\n title=\"Productive Time\"\n value={productiveRatio}\n description=\"Share of tracked time\"\n />\n <StatCard\n title=\"App Switches\"\n value={String(totalSwitches)}\n description={`Avg. ${apps.length > 0 ? Math.round(totalSwitches / apps.length) : 0}/app`}\n />\n <StatCard\n title=\"Focus Sessions\"\n value={String(focusSessions)}\n icon={<Clock className=\"h-5 w-5\" />}\n description=\"90+ min each\"\n />\n </div>\n\n {apps.length === 0 ? (\n <EmptyState\n illustration=\"empty-data\"\n title=\"No application usage data found\"\n description=\"Record app usage manually or connect the desktop tracker, and your apps will appear here ranked by time spent.\"\n action={\n <button\n onClick={openAdd}\n className=\"inline-flex items-center gap-1.5 rounded-md bg-action-primary-bg px-3 py-2 text-sm font-medium text-action-primary-text hover:bg-action-primary-bg/90\"\n >\n <Plus className=\"h-4 w-4\" />\n Add Usage\n </button>\n }\n />\n ) : (\n <>\n <GlassCard treatment=\"glass\" className=\"overflow-hidden\">\n <div className=\"flex items-center justify-between gap-3 border-b border-border-seam px-4 py-3 sm:px-6\">\n <h3 className=\"text-sm font-semibold text-text-primary\">\n Ranked Applications\n </h3>\n <span className=\"text-xs text-text-secondary\">\n {apps.length} tracked\n </span>\n </div>\n <div className=\"divide-y divide-border\">\n {rankedApps.map(\n (app: ApplicationUsageFieldsFragment, index: number) => {\n const share = Math.min(\n 100,\n Math.round(\n (app.timeSpent / (totalScreenTimeSeconds \|\| 1)) * 100,\n ),\n );\n return (\n <div\n key={app.id}\n className=\"flex items-center gap-3 p-4 transition-colors hover:bg-bg-sunken/50 sm:gap-4\"\n >\n <span className=\"flex h-7 w-7 shrink-0 items-center justify-center rounded-full bg-bg-sunken text-xs font-semibold tabular-nums text-text-secondary\">\n {index + 1}\n </span>\n <div className=\"flex h-9 w-9 shrink-0 items-center justify-center rounded-lg bg-action-primary-bg/10 text-primary\">\n <Monitor className=\"h-4 w-4\" />\n </div>\n <div className=\"min-w-0 flex-1\">\n <p className=\"truncate text-sm font-medium text-text-primary\">\n {app.applicationName}\n </p>\n <p className=\"text-xs text-text-secondary\">\n {app.sessions} sessions · {app.switches}{\" \"}\n switches\n </p>\n </div>\n <div className=\"hidden w-28 shrink-0 lg:block\">\n <div className=\"h-2 rounded-full bg-bg-sunken\">\n <div\n className=\"h-2 rounded-full bg-action-primary-bg\"\n style={{ width: `${share}%` }}\n />\n </div>\n <p className=\"mt-1 text-right text-xs tabular-nums text-text-secondary\">\n {share}%\n </p>\n </div>\n <StatusBadge\n label={app.category}\n variant={CATEGORY_VARIANT[app.category] ?? \"muted\"}\n className=\"hidden capitalize sm:inline-flex\"\n />\n <p className=\"shrink-0 font-mono text-sm font-medium tabular-nums text-text-primary\">\n {formatHours(app.timeSpent / 3600)}\n </p>\n <div className=\"flex shrink-0 items-center gap-1\">\n <button\n onClick={() => openRecat(app)}\n className=\"rounded-md p-1.5 text-text-secondary hover:bg-bg-sunken hover:text-text-primary\"\n aria-label=\"Recategorize application\"\n >\n <Tag className=\"h-4 w-4\" />\n </button>\n <button\n onClick={() => setDeleteApp(app)}\n className=\"rounded-md p-1.5 text-text-secondary hover:bg-status-error-bg hover:text-status-error-text\"\n aria-label=\"Delete usage entry\"\n >\n <Trash2 className=\"h-4 w-4\" />\n </button>\n </div>\n </div>\n );\n },\n )}\n </div>\n </GlassCard>\n\n <div className=\"grid grid-cols-1 gap-4 lg:grid-cols-2\">\n <ChartCard\n title=\"Productivity Split\"\n description=\"Where your tracked screen time goes\"\n >\n <DonutChart\n data={categorySlices}\n centerLabel=\"Total tracked\"\n centerValue={categoryTotalSeconds}\n valueFormat={formatSecondsAsHours}\n height={260}\n emptyLabel=\"No categorized usage yet\"\n />\n </ChartCard>\n\n <ChartCard\n title=\"Daily Usage Trend\"\n description=\"Tracked time per day\"\n >\n <TrendChart\n data={usageTrend}\n xKey=\"day\"\n series={[{ key: \"hours\", label: \"Screen time\" }]}\n type=\"area\"\n valueFormat={formatChartHours}\n xTickFormat={formatDayTick}\n height={260}\n emptyLabel=\"No usage recorded yet\"\n />\n </ChartCard>\n </div>\n {hasMore && (\n <div className=\"mt-4 flex justify-center\">\n <button\n onClick={handleLoadMore}\n disabled={loadingMore}\n className=\"rounded-md border border-border-subtle px-4 py-2 text-sm font-medium text-text-primary hover:bg-bg-sunken/50 disabled:opacity-50\"\n >\n {loadingMore ? \"Loading...\" : \"Load more\"}\n </button>\n </div>\n )}\n </>\n )}\n </div>\n\n {/* Add usage modal /}\n <Modal\n open={addOpen}\n onClose={() => setAddOpen(false)}\n title=\"Record App Usage\"\n description=\"Manually log time spent in an application\"\n footer={\n <>\n <button\n onClick={() => setAddOpen(false)}\n className=\"rounded-md border border-border-subtle px-4 py-2 text-sm font-medium text-text-primary hover:bg-bg-sunken/50\"\n >\n Cancel\n </button>\n <button\n onClick={handleRecord}\n disabled={recording \|\| !appName.trim() \|\| !appMinutes}\n className=\"rounded-md bg-action-primary-bg px-4 py-2 text-sm font-medium text-action-primary-text hover:bg-action-primary-bg/90 disabled:opacity-50\"\n >\n {recording ? \"Saving...\" : \"Record\"}\n </button>\n </>\n }\n >\n {recordError && (\n <div className=\"mb-4 rounded-lg border border-status-error-bg/40 bg-status-error-bg p-3 text-sm text-status-error-text\">\n Failed to record usage. Please try again.\n </div>\n )}\n <div className=\"space-y-4\">\n <div>\n <label className={labelClasses}>Application Name</label>\n <input\n type=\"text\"\n placeholder=\"e.g. Visual Studio Code\"\n value={appName}\n onChange={(e) => setAppName(e.target.value)}\n className={inputClasses}\n />\n </div>\n <div className=\"grid grid-cols-1 gap-4 sm:grid-cols-2\">\n <div>\n <label className={labelClasses}>Category</label>\n <select\n value={appCategory}\n onChange={(e) => setAppCategory(e.target.value)}\n className={inputClasses}\n >\n {CATEGORY_OPTIONS.map((c) => (\n <option key={c} value={c} className=\"capitalize\">\n {c}\n </option>\n ))}\n </select>\n </div>\n <div>\n <label className={labelClasses}>Time Spent (minutes)</label>\n <input\n type=\"number\"\n min=\"0\"\n placeholder=\"0\"\n value={appMinutes}\n onChange={(e) => setAppMinutes(e.target.value)}\n className={inputClasses}\n />\n </div>\n </div>\n <div>\n <label className={labelClasses}>Sessions</label>\n <input\n type=\"number\"\n min=\"0\"\n placeholder=\"0\"\n value={appSessions}\n onChange={(e) => setAppSessions(e.target.value)}\n className={inputClasses}\n />\n </div>\n </div>\n </Modal>\n\n {/ Recategorize modal /}\n <Modal\n open={recatApp !== null}\n onClose={() => setRecatApp(null)}\n title=\"Recategorize Application\"\n description={recatApp?.applicationName}\n size=\"sm\"\n footer={\n <>\n <button\n onClick={() => setRecatApp(null)}\n className=\"rounded-md border border-border-subtle px-4 py-2 text-sm font-medium text-text-primary hover:bg-bg-sunken/50\"\n >\n Cancel\n </button>\n <button\n onClick={handleRecategorize}\n disabled={categorizing}\n className=\"rounded-md bg-action-primary-bg px-4 py-2 text-sm font-medium text-action-primary-text hover:bg-action-primary-bg/90 disabled:opacity-50\"\n >\n {categorizing ? \"Saving...\" : \"Save\"}\n </button>\n </>\n }\n >\n {categorizeError && (\n <div className=\"mb-4 rounded-lg border border-status-error-bg/40 bg-status-error-bg p-3 text-sm text-status-error-text\">\n Failed to recategorize. Please try again.\n </div>\n )}\n <label className={labelClasses}>Category</label>\n <select\n value={recatCategory}\n onChange={(e) => setRecatCategory(e.target.value)}\n className={inputClasses}\n >\n {CATEGORY_OPTIONS.map((c) => (\n <option key={c} value={c} className=\"capitalize\">\n {c}\n </option>\n ))}\n </select>\n <p className=\"mt-3 text-xs text-text-secondary\">\n This updates the category for all usage of “\n {recatApp?.applicationName}”.\n </p>\n </Modal>\n\n {/ Delete confirm modal */}\n <Modal\n open={deleteApp !== null}\n onClose={() => setDeleteApp(null)}\n title=\"Delete Usage Entry\"\n size=\"sm\"\n footer={\n <>\n <button\n onClick={() => setDeleteApp(null)}\n className=\"rounded-md border border-border-subtle px-4 py-2 text-sm font-medium text-text-primary hover:bg-bg-sunken/50\"\n >\n Cancel\n </button>\n <button\n onClick={handleDelete}\n disabled={deleting}\n className=\"rounded-md bg-status-error-bg px-4 py-2 text-sm font-medium text-status-error-text hover:bg-status-error-bg/90 disabled:opacity-50\"\n >\n {deleting ? \"Deleting...\" : \"Delete\"}\n </button>\n </>\n }\n >\n {deleteError && (\n <div className=\"mb-4 rounded-lg border border-status-error-bg/40 bg-status-error-bg p-3 text-sm text-status-error-text\">\n Failed to delete entry. Please try again.\n </div>\n )}\n <p className=\"text-sm text-text-secondary\">\n Are you sure you want to delete the usage entry for{\" \"}\n <span className=\"font-medium text-text-primary\">\n {deleteApp?.applicationName}\n </span>\n ? This action cannot be undone.\n </p>\n </Modal>\n </PageLayout>\n );\n}\n"],"mappings":"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"}

package/dist/timecampus/pages/channels/ChannelsPage.js CHANGED Viewed

@@ -1,66 +1,84 @@
 import { LoadingSkeleton as e } from "../../components/LoadingSkeleton.js";
-import { useCreateChannelConfigMutation as t, useDeleteChannelConfigMutation as n, useListChannelConfigsQuery as r, useListChannelStatusesQuery as i, useSyncChannelMutation as ee, useToggleChannelMutation as a, useUpdateChannelConfigMutation as te } from "../../../generated/wspace-operations.js";
+import { useCreateChannelConfigMutation as t, useDeleteChannelConfigMutation as n, useListChannelConfigsQuery as r, useListChannelStatusesQuery as i, useSyncChannelMutation as a, useToggleChannelMutation as ee, useUpdateChannelConfigMutation as te } from "../../../generated/wspace-operations.js";
 import { PageLayout as o } from "../../components/PageLayout.js";
-import { EmptyState as ne } from "../../components/EmptyState.js";
-import { ChannelStatus as s, TimeCampusChannelType as c } from "../../../generated/wspace-types.js";
-import { Modal as l } from "../../components/Modal.js";
-import { StatusBadge as re } from "../../components/StatusBadge.js";
-import { ToastContainer as ie, useToast as ae } from "../../components/Toast.js";
-import { useState as u } from "react";
-import { Pencil as oe, Plus as d, Power as f, RefreshCw as p, Trash2 as m, Wifi as h, WifiOff as g } from "lucide-react";
+import { StatusBadge as ne } from "../../components/StatusBadge.js";
+import { EmptyState as re } from "../../components/EmptyState.js";
+import { ToastContainer as s, useToast as ie } from "../../components/Toast.js";
+import { Modal as c } from "../../components/Modal.js";
+import { ChannelStatus as l, TimeCampusChannelType as u } from "../../../generated/wspace-types.js";
+import { useState as d } from "react";
+import { Pencil as ae, Plus as oe, Power as f, RefreshCw as p, Trash2 as m, Wifi as h, WifiOff as g } from "lucide-react";
 import { Fragment as _, jsx as v, jsxs as y } from "react/jsx-runtime";
+import { GlassCard as se } from "@burdenoff/fe-libs/ui";
 //#region src/timecampus/pages/channels/ChannelsPage.tsx
-var b = 25, se = [
+var b = 25, ce = [
 	{
-		value: c.Calendar,
+		value: u.Calendar,
 		label: "Calendar"
 	},
 	{
-		value: c.Desktop,
+		value: u.Desktop,
 		label: "Desktop"
 	},
 	{
-		value: c.Browser,
+		value: u.Browser,
 		label: "Browser"
 	},
 	{
-		value: c.Mobile,
+		value: u.Mobile,
 		label: "Mobile"
 	},
 	{
-		value: c.Ide,
+		value: u.Ide,
 		label: "IDE"
 	},
 	{
-		value: c.Cli,
+		value: u.Cli,
 		label: "CLI"
 	},
 	{
-		value: c.Api,
+		value: u.Api,
 		label: "API"
 	},
 	{
-		value: c.Custom,
+		value: u.Custom,
 		label: "Custom"
 	}
-], x = "mt-1 w-full rounded-md border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary placeholder:text-text-secondary", S = {
+], x = "mt-1 w-full rounded-md border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary placeholder:text-text-secondary";
+function le(e) {
+	if (e == null || e <= 0) return "Manual";
+	if (e % 3600 == 0) {
+		let t = e / 3600;
+		return `Every ${t} hour${t > 1 ? "s" : ""}`;
+	}
+	return e % 60 == 0 ? `Every ${e / 60} min` : `Every ${e}s`;
+}
+var ue = {
+	healthy: "bg-status-success-text",
+	degraded: "bg-status-warning-text",
+	unknown: "bg-text-muted"
+}, de = {
+	healthy: "Healthy connection",
+	degraded: "Sync needs attention",
+	unknown: "Not synced yet"
+}, S = {
 	name: "",
-	type: c.Calendar,
+	type: u.Calendar,
 	syncInterval: ""
 };
 function C() {
-	let { toasts: C, addToast: w, dismissToast: ce } = ae(), { data: le, loading: ue, error: de, refetch: T, fetchMore: E } = r({
+	let { toasts: C, addToast: w, dismissToast: fe } = ie(), { data: pe, loading: T, error: E, refetch: D, fetchMore: O } = r({
 		variables: {
 			limit: b,
 			offset: 0
 		},
 		notifyOnNetworkStatusChange: !0
-	}), { data: D } = i(), [O, { loading: k }] = t(), [A, { loading: j }] = te(), [M, { loading: N }] = n(), [P, { loading: F }] = a(), [I, { loading: L }] = ee(), R = le?.channelConfigs ?? [], z = D?.channelStatuses ?? [], [B, V] = u(!1), [H, fe] = u(!0), [pe, U] = u(!1), [W, G] = u(null), [K, q] = u(S), [J, Y] = u(null), [me, X] = u(null), he = new Map(z.map((e) => [e.channelId, e])), ge = () => {
+	}), { data: k } = i(), [A, { loading: j }] = t(), [M, { loading: N }] = te(), [P, { loading: F }] = n(), [I, { loading: L }] = ee(), [R, { loading: z }] = a(), B = pe?.channelConfigs ?? [], me = k?.channelStatuses ?? [], [V, H] = d(!1), [he, ge] = d(!0), [_e, U] = d(!1), [W, G] = d(null), [K, q] = d(S), [J, Y] = d(null), [ve, X] = d(null), ye = new Map(me.map((e) => [e.channelId, e])), be = () => {
 		G(null), q(S), U(!0);
-	}, _e = (e) => {
+	}, xe = (e) => {
 		G(e), q({
 			name: e.name,
-			type: Object.values(c).find((t) => t === e.type) ?? c.Custom,
+			type: Object.values(u).find((t) => t === e.type) ?? u.Custom,
 			syncInterval: e.syncInterval == null ? "" : String(e.syncInterval)
 		}), U(!0);
 	}, Z = () => {
@@ -69,7 +87,7 @@ function C() {
 		if (!K.name.trim()) return;
 		let e = K.syncInterval ? Number(K.syncInterval) : void 0;
 		try {
-			W ? (await A({ variables: {
+			W ? (await M({ variables: {
 				id: W.id,
 				input: {
 					name: K.name.trim(),
@@ -79,44 +97,44 @@ function C() {
 			} }), w({
 				title: "Channel updated",
 				variant: "success"
-			})) : (await O({ variables: { input: {
+			})) : (await A({ variables: { input: {
 				name: K.name.trim(),
 				type: K.type,
 				syncInterval: e,
-				status: s.Active
+				status: l.Active
 			} } }), w({
 				title: "Channel added",
 				variant: "success"
-			})), Z(), await T();
+			})), Z(), await D();
 		} catch {
 			w({
 				title: W ? "Failed to update channel" : "Failed to add channel",
 				variant: "error"
 			});
 		}
-	}, ve = async () => {
+	}, Se = async () => {
 		if (J) try {
-			await M({ variables: { id: J.id } }), w({
+			await P({ variables: { id: J.id } }), w({
 				title: "Channel deleted",
 				variant: "success"
-			}), Y(null), await T();
+			}), Y(null), await D();
 		} catch {
 			w({
 				title: "Failed to delete channel",
 				variant: "error"
 			});
 		}
-	}, ye = async (e) => {
+	}, Ce = async (e) => {
 		let t = e.status.toLowerCase() === "active";
 		X(e.id);
 		try {
-			await P({ variables: {
+			await I({ variables: {
 				id: e.id,
-				status: t ? s.Inactive : s.Active
+				status: t ? l.Inactive : l.Active
 			} }), w({
 				title: t ? "Channel disabled" : "Channel enabled",
 				variant: "success"
-			}), await T();
+			}), await D();
 		} catch {
 			w({
 				title: "Failed to toggle channel",
@@ -125,13 +143,13 @@ function C() {
 		} finally {
 			X(null);
 		}
-	}, be = async (e) => {
+	}, we = async (e) => {
 		X(e.id);
 		try {
-			await I({ variables: { id: e.id } }), w({
+			await R({ variables: { id: e.id } }), w({
 				title: "Sync started",
 				variant: "success"
-			}), await T();
+			}), await D();
 		} catch {
 			w({
 				title: "Failed to sync channel",
@@ -140,24 +158,24 @@ function C() {
 		} finally {
 			X(null);
 		}
-	}, xe = async () => {
-		V(!0);
+	}, Te = async () => {
+		H(!0);
 		try {
-			((await E({
+			((await O({
 				variables: {
 					limit: b,
-					offset: R.length
+					offset: B.length
 				},
 				updateQuery: (e, { fetchMoreResult: t }) => t ? {
 					...e,
 					channelConfigs: [...e.channelConfigs, ...t.channelConfigs]
 				} : e
-			})).data?.channelConfigs?.length ?? 0) < b && fe(!1);
+			})).data?.channelConfigs?.length ?? 0) < b && ge(!1);
 		} finally {
-			V(!1);
+			H(!1);
 		}
 	};
-	if (ue && R.length === 0) return /* @__PURE__ */ v(o, {
+	if (T && B.length === 0) return /* @__PURE__ */ v(o, {
 		title: "Channels",
 		description: "Manage time tracking channels and integrations",
 		children: /* @__PURE__ */ v(e, {
@@ -165,7 +183,7 @@ function C() {
 			count: 6
 		})
 	});
-	if (de) return /* @__PURE__ */ v(o, {
+	if (E) return /* @__PURE__ */ v(o, {
 		title: "Channels",
 		description: "Manage time tracking channels and integrations",
 		children: /* @__PURE__ */ v("div", {
@@ -174,9 +192,9 @@ function C() {
 		})
 	});
 	let $ = /* @__PURE__ */ y("button", {
-		onClick: ge,
+		onClick: be,
 		className: "inline-flex items-center gap-1.5 rounded-md bg-action-primary-bg px-3 py-2 text-sm font-medium text-action-primary-text hover:bg-action-primary-bg/90",
-		children: [/* @__PURE__ */ v(d, { className: "h-4 w-4" }), "Add Channel"]
+		children: [/* @__PURE__ */ v(oe, { className: "h-4 w-4" }), "Add Channel"]
 	});
 	return /* @__PURE__ */ y(o, {
 		title: "Channels",
@@ -184,53 +202,92 @@ function C() {
 		purpose: "Connect the tools and devices that feed time into TimeCampus — calendars, desktop trackers, integrations — and keep an eye on each connection's health so no work hours slip through the cracks.",
 		actions: $,
 		children: [
-			R.length === 0 ? /* @__PURE__ */ v(ne, {
+			B.length === 0 ? /* @__PURE__ */ v(re, {
 				illustration: "empty-generic",
 				title: "No channels configured yet",
 				description: "Set up your first tracking channel to start pulling time and activity from your tools and devices.",
 				action: $
 			}) : /* @__PURE__ */ y(_, { children: [/* @__PURE__ */ v("div", {
 				className: "grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-3",
-				children: R.map((e) => {
-					let t = he.get(e.id), n = e.status.toLowerCase() === "active", r = e.lastSync ? new Date(e.lastSync).toLocaleString() : "Never", i = me === e.id;
-					return /* @__PURE__ */ y("div", {
-						className: "flex flex-col rounded-xl border border-border-seam bg-gloss-card shadow-pop p-5 transition-colors",
+				children: B.map((e) => {
+					let t = ye.get(e.id), n = e.status.toLowerCase() === "active", r = e.lastSync ? new Date(e.lastSync).toLocaleString() : "Never", i = t ? t.isHealthy ? "healthy" : "degraded" : "unknown", a = ve === e.id;
+					return /* @__PURE__ */ y(se, {
+						treatment: "glass",
+						className: "flex flex-col p-5",
 						children: [
 							/* @__PURE__ */ y("div", {
-								className: "flex items-start justify-between",
+								className: "flex items-start justify-between gap-3",
 								children: [/* @__PURE__ */ y("div", {
-									className: "flex items-center gap-3",
-									children: [n ? /* @__PURE__ */ v(h, { className: "h-5 w-5 text-status-success-text" }) : /* @__PURE__ */ v(g, { className: "h-5 w-5 text-text-secondary" }), /* @__PURE__ */ y("div", { children: [/* @__PURE__ */ v("p", {
-										className: "text-sm font-semibold text-text-primary",
-										children: e.name
-									}), /* @__PURE__ */ v("p", {
-										className: "text-xs text-text-secondary",
-										children: e.type
-									})] })]
-								}), /* @__PURE__ */ v(re, {
+									className: "flex min-w-0 items-center gap-3",
+									children: [/* @__PURE__ */ v("div", {
+										className: "flex h-10 w-10 shrink-0 items-center justify-center rounded-lg bg-action-primary-bg/10 text-primary",
+										children: n ? /* @__PURE__ */ v(h, { className: "h-5 w-5" }) : /* @__PURE__ */ v(g, { className: "h-5 w-5 text-text-secondary" })
+									}), /* @__PURE__ */ y("div", {
+										className: "min-w-0",
+										children: [/* @__PURE__ */ v("p", {
+											className: "truncate text-sm font-semibold text-text-primary",
+											children: e.name
+										}), /* @__PURE__ */ v("p", {
+											className: "text-xs capitalize text-text-secondary",
+											children: e.type
+										})]
+									})]
+								}), /* @__PURE__ */ v(ne, {
 									label: e.status,
-									status: e.status.toLowerCase()
+									status: e.status.toLowerCase(),
+									dot: !0
 								})]
 							}),
 							/* @__PURE__ */ y("div", {
-								className: "mt-3 flex items-center justify-between text-xs text-text-secondary",
-								children: [/* @__PURE__ */ v("span", { children: t?.isHealthy ? "Healthy" : "Unhealthy" }), /* @__PURE__ */ y("span", { children: ["Sync: ", r] })]
+								className: "mt-4 space-y-2 text-xs",
+								children: [
+									/* @__PURE__ */ y("div", {
+										className: "flex items-center gap-2",
+										children: [/* @__PURE__ */ v("span", {
+											className: `h-2 w-2 shrink-0 rounded-full ${ue[i]}`,
+											"aria-hidden": "true"
+										}), /* @__PURE__ */ v("span", {
+											className: "text-text-secondary",
+											children: de[i]
+										})]
+									}),
+									/* @__PURE__ */ y("div", {
+										className: "flex items-center justify-between gap-2",
+										children: [/* @__PURE__ */ v("span", {
+											className: "text-text-secondary",
+											children: "Last sync"
+										}), /* @__PURE__ */ v("span", {
+											className: "truncate font-medium text-text-primary",
+											children: r
+										})]
+									}),
+									/* @__PURE__ */ y("div", {
+										className: "flex items-center justify-between gap-2",
+										children: [/* @__PURE__ */ v("span", {
+											className: "text-text-secondary",
+											children: "Interval"
+										}), /* @__PURE__ */ v("span", {
+											className: "font-medium text-text-primary",
+											children: le(e.syncInterval)
+										})]
+									})
+								]
 							}),
 							/* @__PURE__ */ y("div", {
 								className: "mt-4 flex items-center gap-1.5 border-t border-border-seam pt-3",
 								children: [
 									/* @__PURE__ */ y("button", {
 										type: "button",
-										disabled: i && L,
-										onClick: () => be(e),
+										disabled: a && z,
+										onClick: () => we(e),
 										title: "Sync now",
 										className: "inline-flex items-center gap-1 rounded-md border border-border-seam bg-bg-surface px-2 py-1 text-xs text-text-secondary hover:bg-bg-sunken/50 disabled:opacity-50",
-										children: [/* @__PURE__ */ v(p, { className: `h-3.5 w-3.5 ${i && L ? "animate-spin" : ""}` }), "Sync"]
+										children: [/* @__PURE__ */ v(p, { className: `h-3.5 w-3.5 ${a && z ? "animate-spin" : ""}` }), "Sync"]
 									}),
 									/* @__PURE__ */ y("button", {
 										type: "button",
-										disabled: i && F,
-										onClick: () => ye(e),
+										disabled: a && L,
+										onClick: () => Ce(e),
 										title: n ? "Disable channel" : "Enable channel",
 										className: "inline-flex items-center gap-1 rounded-md border border-border-seam bg-bg-surface px-2 py-1 text-xs text-text-secondary hover:bg-bg-sunken/50 disabled:opacity-50",
 										children: [/* @__PURE__ */ v(f, { className: "h-3.5 w-3.5" }), n ? "Disable" : "Enable"]
@@ -239,10 +296,10 @@ function C() {
 										className: "ml-auto flex items-center gap-1",
 										children: [/* @__PURE__ */ v("button", {
 											type: "button",
-											onClick: () => _e(e),
+											onClick: () => xe(e),
 											title: "Edit channel",
 											className: "inline-flex items-center rounded-md border border-border-seam bg-bg-surface p-1.5 text-text-secondary hover:bg-bg-sunken/50",
-											children: /* @__PURE__ */ v(oe, { className: "h-3.5 w-3.5" })
+											children: /* @__PURE__ */ v(ae, { className: "h-3.5 w-3.5" })
 										}), /* @__PURE__ */ v("button", {
 											type: "button",
 											onClick: () => Y(e),
@@ -256,17 +313,17 @@ function C() {
 						]
 					}, e.id);
 				})
-			}), H && R.length >= b && /* @__PURE__ */ v("div", {
+			}), he && B.length >= b && /* @__PURE__ */ v("div", {
 				className: "mt-4 flex justify-center",
 				children: /* @__PURE__ */ v("button", {
-					onClick: xe,
-					disabled: B,
+					onClick: Te,
+					disabled: V,
 					className: "rounded-md border border-border-subtle px-4 py-2 text-sm font-medium text-text-primary hover:bg-bg-sunken/50 disabled:opacity-50",
-					children: B ? "Loading..." : "Load more"
+					children: V ? "Loading..." : "Load more"
 				})
 			})] }),
-			/* @__PURE__ */ v(l, {
-				open: pe,
+			/* @__PURE__ */ v(c, {
+				open: _e,
 				onClose: Z,
 				title: W ? "Edit Channel" : "Add Channel",
 				description: W ? "Update this channel's configuration." : "Connect a new tracking channel to feed time into TimeCampus.",
@@ -276,9 +333,9 @@ function C() {
 					children: "Cancel"
 				}), /* @__PURE__ */ v("button", {
 					onClick: Q,
-					disabled: k || j || !K.name.trim(),
+					disabled: j || N || !K.name.trim(),
 					className: "rounded-md bg-action-primary-bg px-4 py-2 text-sm font-medium text-action-primary-text hover:bg-action-primary-bg/90 disabled:opacity-50",
-					children: k || j ? "Saving..." : W ? "Save Changes" : "Add Channel"
+					children: j || N ? "Saving..." : W ? "Save Changes" : "Add Channel"
 				})] }),
 				children: /* @__PURE__ */ y("div", {
 					className: "space-y-4",
@@ -306,7 +363,7 @@ function C() {
 								type: e.target.value
 							}),
 							className: x,
-							children: se.map((e) => /* @__PURE__ */ v("option", {
+							children: ce.map((e) => /* @__PURE__ */ v("option", {
 								value: e.value,
 								children: e.label
 							}, e.value))
@@ -327,7 +384,7 @@ function C() {
 					})]
 				})
 			}),
-			/* @__PURE__ */ v(l, {
+			/* @__PURE__ */ v(c, {
 				open: J !== null,
 				onClose: () => Y(null),
 				title: "Delete channel?",
@@ -338,19 +395,19 @@ function C() {
 					className: "rounded-md border border-border-subtle px-4 py-2 text-sm font-medium text-text-primary hover:bg-bg-sunken/50",
 					children: "Cancel"
 				}), /* @__PURE__ */ v("button", {
-					onClick: ve,
-					disabled: N,
+					onClick: Se,
+					disabled: F,
 					className: "rounded-md bg-status-error-bg px-4 py-2 text-sm font-medium text-status-error-text hover:bg-status-error-bg/80 disabled:opacity-50",
-					children: N ? "Deleting..." : "Delete"
+					children: F ? "Deleting..." : "Delete"
 				})] }),
 				children: /* @__PURE__ */ v("p", {
 					className: "text-sm text-text-secondary",
 					children: "Deleting a channel stops it from feeding new time into TimeCampus. Previously captured entries are kept."
 				})
 			}),
-			/* @__PURE__ */ v(ie, {
+			/* @__PURE__ */ v(s, {
 				toasts: C,
-				onDismiss: ce
+				onDismiss: fe
 			})
 		]
 	});