@byline/admin 4.15.0 → 4.16.0

package/dist/abilities.js

@@ -2,10 +2,12 @@ import { registerAdminActivityAbilities } from "./modules/admin-activity/abiliti
 import { registerAdminPermissionsAbilities } from "./modules/admin-permissions/abilities.js";
 import { registerAdminRolesAbilities } from "./modules/admin-roles/abilities.js";
 import { registerAdminUsersAbilities } from "./modules/admin-users/abilities.js";
+import { registerAnalyticsAbilities } from "./modules/analytics/abilities.js";
 function registerAdminAbilities(registry) {
     registerAdminUsersAbilities(registry);
     registerAdminRolesAbilities(registry);
     registerAdminPermissionsAbilities(registry);
     registerAdminActivityAbilities(registry);
+    registerAnalyticsAbilities(registry);
 }
 export { registerAdminAbilities };

package/dist/index.d.ts

@@ -28,5 +28,6 @@ export * from './modules/admin-activity/index.js';
 export * from './modules/admin-permissions/index.js';
 export * from './modules/admin-roles/index.js';
 export * from './modules/admin-users/index.js';
+export * from './modules/analytics/index.js';
 export * from './modules/auth/index.js';
 export type { AdminStore } from './store.js';

package/dist/index.js

@@ -3,6 +3,7 @@ export * from "./modules/admin-activity/index.js";
 export * from "./modules/admin-permissions/index.js";
 export * from "./modules/admin-roles/index.js";
 export * from "./modules/admin-users/index.js";
+export * from "./modules/analytics/index.js";
 export * from "./modules/auth/index.js";
 export { registerAdminAbilities } from "./abilities.js";
 export { assertAdminActor, requireAdminActor } from "./lib/assert-admin-actor.js";

package/dist/modules/analytics/abilities.d.ts

@@ -0,0 +1,14 @@
+/**
+ * This Source Code is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/.
+ *
+ * Copyright (c) Infonomic Company Limited
+ */
+import type { AbilityRegistry } from '@byline/auth';
+export declare const ANALYTICS_ABILITIES: {
+    readonly read: 'analytics.read';
+    readonly maintain: 'analytics.maintain';
+};
+export type AnalyticsAbilityKey = (typeof ANALYTICS_ABILITIES)[keyof typeof ANALYTICS_ABILITIES];
+export declare function registerAnalyticsAbilities(registry: AbilityRegistry): void;

package/dist/modules/analytics/abilities.js

@@ -0,0 +1,21 @@
+const ANALYTICS_ABILITIES = {
+    read: 'analytics.read',
+    maintain: 'analytics.maintain'
+};
+function registerAnalyticsAbilities(registry) {
+    registry.register({
+        key: ANALYTICS_ABILITIES.read,
+        label: 'Read analytics',
+        description: 'View installation-level page, visitor, download, referrer, and country totals.',
+        group: 'analytics',
+        source: 'admin'
+    });
+    registry.register({
+        key: ANALYTICS_ABILITIES.maintain,
+        label: 'Maintain analytics',
+        description: 'Delete retained analytics events and rebuild affected daily aggregates.',
+        group: 'analytics',
+        source: 'admin'
+    });
+}
+export { ANALYTICS_ABILITIES, registerAnalyticsAbilities };

package/dist/modules/analytics/components/dashboard.d.ts

@@ -0,0 +1,20 @@
+/**
+ * This Source Code is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/.
+ *
+ * Copyright (c) Infonomic Company Limited
+ */
+import type React from 'react';
+import type { AnalyticsDashboardData, AnalyticsDashboardPeriod } from '../types.js';
+export interface AnalyticsDashboardProps {
+    data: AnalyticsDashboardData;
+    period: AnalyticsDashboardPeriod;
+    onPeriodChange(period: AnalyticsDashboardPeriod): void;
+}
+export declare function AnalyticsDashboard({ data, period, onPeriodChange, }: AnalyticsDashboardProps): React.JSX.Element;
+/** Never collapse the bar entirely: a visible sliver still encodes "smallest". */
+export declare function shareWidth(value: number, ceiling: number): number;
+export declare function formatShare(part: number, whole: number, locale: string): string;
+/** Return the retained boundary only when it truncates the selected range. */
+export declare function partialCoverageFrom(rangeFrom: string, coverageFrom: string | null): string | undefined;

package/dist/modules/analytics/components/dashboard.js

@@ -0,0 +1,308 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useEffect, useMemo, useState } from "react";
+import { ANALYTICS_DASHBOARD_PERIODS, ANALYTICS_OVERFLOW_KEY, isAnalyticsDashboardPeriod } from "@byline/analytics/config";
+import { ANALYTICS_IGNORE_STORAGE_KEY } from "@byline/analytics-agent";
+import { useTranslation } from "@byline/i18n/react";
+import { Button, Card, Container, Section, Select } from "@byline/ui/react";
+import clsx from "clsx";
+import dashboard_module from "./dashboard.module.js";
+import { AnalyticsTimeseries, resolveAnalyticsChartGranularity } from "./timeseries.js";
+function AnalyticsDashboard({ data, period, onPeriodChange }) {
+    const { locale, t } = useTranslation('byline-admin');
+    const [excluded, setExcluded] = useState(false);
+    const numbers = useMemo(()=>new Intl.NumberFormat(locale), [
+        locale
+    ]);
+    useEffect(()=>{
+        try {
+            setExcluded(null != localStorage.getItem(ANALYTICS_IGNORE_STORAGE_KEY));
+        } catch  {
+            setExcluded(false);
+        }
+    }, []);
+    const toggleExclusion = ()=>{
+        try {
+            if (excluded) localStorage.removeItem(ANALYTICS_IGNORE_STORAGE_KEY);
+            else localStorage.setItem(ANALYTICS_IGNORE_STORAGE_KEY, '1');
+            setExcluded(!excluded);
+        } catch  {}
+    };
+    const periodItems = ANALYTICS_DASHBOARD_PERIODS.map((value)=>({
+            value: String(value),
+            label: 'number' == typeof value ? t('analytics.period.days', {
+                count: value
+            }) : t(`analytics.period.${value}`)
+        }));
+    const { views, visitors, downloads } = data.summary;
+    const days = data.summary.timeseries.length;
+    const chartGranularity = resolveAnalyticsChartGranularity(period, days);
+    return /*#__PURE__*/ jsx(Section, {
+        children: /*#__PURE__*/ jsxs(Container, {
+            children: [
+                /*#__PURE__*/ jsxs("header", {
+                    className: clsx('byline-analytics-header', dashboard_module.header),
+                    children: [
+                        /*#__PURE__*/ jsxs("div", {
+                            children: [
+                                /*#__PURE__*/ jsx("h1", {
+                                    className: clsx('byline-analytics-title', dashboard_module.title),
+                                    children: t('analytics.title')
+                                }),
+                                /*#__PURE__*/ jsx("p", {
+                                    className: clsx('muted', 'byline-analytics-help', dashboard_module.help),
+                                    children: t('analytics.dailyUniquesHelp')
+                                })
+                            ]
+                        }),
+                        /*#__PURE__*/ jsxs("div", {
+                            className: clsx('byline-analytics-controls', dashboard_module.controls),
+                            children: [
+                                /*#__PURE__*/ jsx(Select, {
+                                    id: "analytics-period",
+                                    name: "analytics-period",
+                                    "aria-label": t('analytics.period.label'),
+                                    size: "sm",
+                                    value: String(period),
+                                    items: periodItems,
+                                    onValueChange: (value)=>{
+                                        const next = 'ytd' === value || 'all' === value ? value : Number(value);
+                                        if (isAnalyticsDashboardPeriod(next)) onPeriodChange(next);
+                                    }
+                                }),
+                                /*#__PURE__*/ jsx(Button, {
+                                    type: "button",
+                                    size: "sm",
+                                    "aria-pressed": excluded,
+                                    title: t('analytics.exclusion.help'),
+                                    onClick: toggleExclusion,
+                                    children: excluded ? t('analytics.exclusion.include') : t('analytics.exclusion.exclude')
+                                })
+                            ]
+                        })
+                    ]
+                }),
+                /*#__PURE__*/ jsxs("div", {
+                    className: clsx('byline-analytics-stats', dashboard_module.stats),
+                    children: [
+                        /*#__PURE__*/ jsx(StatTile, {
+                            tone: "views",
+                            label: t('analytics.stats.views'),
+                            value: numbers.format(views),
+                            foot: t('analytics.stats.perDay', {
+                                count: 0 === days ? 0 : Math.round(views / days)
+                            })
+                        }),
+                        /*#__PURE__*/ jsx(StatTile, {
+                            tone: "visitors",
+                            label: t('analytics.stats.dailyUniques'),
+                            value: numbers.format(visitors),
+                            foot: t('analytics.stats.sumOfDays', {
+                                count: days
+                            })
+                        }),
+                        /*#__PURE__*/ jsx(StatTile, {
+                            tone: "downloads",
+                            label: t('analytics.stats.downloads'),
+                            value: numbers.format(downloads),
+                            foot: t('analytics.stats.shareOfViews', {
+                                share: formatShare(downloads, views, locale)
+                            })
+                        })
+                    ]
+                }),
+                /*#__PURE__*/ jsxs(Card, {
+                    className: clsx('byline-analytics-chart-card', dashboard_module.chartCard),
+                    children: [
+                        /*#__PURE__*/ jsx(Card.Header, {
+                            children: /*#__PURE__*/ jsx(Card.Title, {
+                                children: 'day' === chartGranularity ? t('analytics.chart.perDay') : 'seven-day' === chartGranularity ? t('analytics.chart.perSevenDays') : t('analytics.chart.perMonth')
+                            })
+                        }),
+                        /*#__PURE__*/ jsx(Card.Content, {
+                            children: /*#__PURE__*/ jsx(AnalyticsTimeseries, {
+                                days: data.summary.timeseries,
+                                granularity: chartGranularity,
+                                locale: locale
+                            })
+                        })
+                    ]
+                }),
+                /*#__PURE__*/ jsxs("div", {
+                    className: clsx('byline-analytics-lists', dashboard_module.lists),
+                    children: [
+                        /*#__PURE__*/ jsx(RankedList, {
+                            title: t('analytics.sections.pages'),
+                            caption: t('analytics.columns.viewsAndUniques'),
+                            tone: "views",
+                            locale: locale,
+                            rows: data.pages.rows.map(toPathRow),
+                            total: data.pages.total,
+                            coverageFrom: partialCoverageFrom(data.range.from, data.coverage.pathsFrom)
+                        }),
+                        /*#__PURE__*/ jsxs("div", {
+                            className: dashboard_module.stack,
+                            children: [
+                                /*#__PURE__*/ jsx(RankedList, {
+                                    title: t('analytics.sections.referrers'),
+                                    tone: "visitors",
+                                    locale: locale,
+                                    total: data.referrers.total,
+                                    coverageFrom: partialCoverageFrom(data.range.from, data.coverage.referrersFrom),
+                                    rows: data.referrers.rows.map((row)=>({
+                                            key: row.referrerHost,
+                                            label: row.referrerHost,
+                                            value: row.views,
+                                            visitors: row.visitors,
+                                            overflow: row.referrerHost === ANALYTICS_OVERFLOW_KEY
+                                        }))
+                                }),
+                                /*#__PURE__*/ jsx(RankedList, {
+                                    title: t('analytics.sections.countries'),
+                                    tone: "visitors",
+                                    locale: locale,
+                                    rows: data.countries.map((row)=>({
+                                            key: row.country,
+                                            label: row.country,
+                                            value: row.views,
+                                            visitors: row.visitors,
+                                            overflow: false
+                                        }))
+                                })
+                            ]
+                        })
+                    ]
+                }),
+                /*#__PURE__*/ jsx(RankedList, {
+                    title: t('analytics.sections.downloads'),
+                    caption: t('analytics.columns.clicksAndUniques'),
+                    tone: "downloads",
+                    locale: locale,
+                    rows: data.downloads.rows.map(toPathRow),
+                    total: data.downloads.total,
+                    coverageFrom: partialCoverageFrom(data.range.from, data.coverage.pathsFrom)
+                })
+            ]
+        })
+    });
+}
+const TONE_TILE = {
+    views: dashboard_module.toneViews,
+    visitors: dashboard_module.toneVisitors,
+    downloads: dashboard_module.toneDownloads
+};
+const TONE_BAR = {
+    views: dashboard_module.barViews,
+    visitors: dashboard_module.barVisitors,
+    downloads: dashboard_module.barDownloads
+};
+function StatTile({ tone, label, value, foot }) {
+    return /*#__PURE__*/ jsxs("div", {
+        className: clsx('byline-analytics-stat', dashboard_module.stat, TONE_TILE[tone]),
+        children: [
+            /*#__PURE__*/ jsx("span", {
+                className: clsx('byline-analytics-stat-label', dashboard_module.statLabel),
+                children: label
+            }),
+            /*#__PURE__*/ jsx("span", {
+                className: clsx('byline-analytics-stat-value', dashboard_module.statValue),
+                children: value
+            }),
+            /*#__PURE__*/ jsx("span", {
+                className: clsx('byline-analytics-stat-foot', dashboard_module.statFoot),
+                children: foot
+            })
+        ]
+    });
+}
+function toPathRow(row) {
+    return {
+        key: row.path,
+        label: row.path,
+        value: row.views,
+        visitors: row.visitors,
+        overflow: row.path === ANALYTICS_OVERFLOW_KEY
+    };
+}
+function RankedList({ title, caption, rows, tone, locale, total, coverageFrom }) {
+    const { t } = useTranslation('byline-admin');
+    const numbers = useMemo(()=>new Intl.NumberFormat(locale), [
+        locale
+    ]);
+    const ceiling = Math.max(1, ...rows.map((row)=>row.value));
+    const truncated = null != total && total > rows.length;
+    const coverageDate = useMemo(()=>new Intl.DateTimeFormat(locale, {
+            dateStyle: 'medium',
+            timeZone: 'UTC'
+        }), [
+        locale
+    ]);
+    const description = [
+        truncated ? t('analytics.topOf', {
+            shown: rows.length,
+            total
+        }) : caption,
+        null == coverageFrom ? void 0 : t('analytics.coverage.since', {
+            date: coverageDate.format(new Date(`${coverageFrom}T00:00:00.000Z`))
+        })
+    ].filter((value)=>null != value).join(' · ');
+    return /*#__PURE__*/ jsxs(Card, {
+        className: clsx('byline-analytics-list', dashboard_module.list),
+        children: [
+            /*#__PURE__*/ jsxs(Card.Header, {
+                children: [
+                    /*#__PURE__*/ jsx(Card.Title, {
+                        children: title
+                    }),
+                    description.length > 0 && /*#__PURE__*/ jsx(Card.Description, {
+                        children: description
+                    })
+                ]
+            }),
+            /*#__PURE__*/ jsx(Card.Content, {
+                children: 0 === rows.length ? /*#__PURE__*/ jsx("p", {
+                    className: "muted",
+                    children: t('analytics.empty')
+                }) : /*#__PURE__*/ jsx("ol", {
+                    className: clsx('byline-analytics-ranking', dashboard_module.ranking),
+                    children: rows.map((row)=>/*#__PURE__*/ jsxs("li", {
+                            className: clsx('byline-analytics-ranking-row', dashboard_module.rankingRow, TONE_BAR[tone], row.overflow && dashboard_module.rankingOverflow),
+                            style: {
+                                '--byline-analytics-share': `${shareWidth(row.value, ceiling)}%`
+                            },
+                            children: [
+                                /*#__PURE__*/ jsx("span", {
+                                    className: dashboard_module.rankingLabel,
+                                    title: row.key,
+                                    children: row.overflow ? t('analytics.overflow') : row.label
+                                }),
+                                /*#__PURE__*/ jsx("span", {
+                                    className: dashboard_module.rankingValue,
+                                    children: numbers.format(row.value)
+                                }),
+                                /*#__PURE__*/ jsx("span", {
+                                    className: dashboard_module.rankingVisitors,
+                                    children: numbers.format(row.visitors)
+                                })
+                            ]
+                        }, row.key))
+                })
+            })
+        ]
+    });
+}
+function shareWidth(value, ceiling) {
+    if (!Number.isFinite(value) || value <= 0 || ceiling <= 0) return 0;
+    return Math.max(3, Math.min(100, value / ceiling * 100));
+}
+function formatShare(part, whole, locale) {
+    const percent = new Intl.NumberFormat(locale, {
+        style: 'percent',
+        maximumFractionDigits: 1
+    });
+    return percent.format(whole <= 0 ? 0 : part / whole);
+}
+function partialCoverageFrom(rangeFrom, coverageFrom) {
+    return null != coverageFrom && coverageFrom > rangeFrom ? coverageFrom : void 0;
+}
+export { AnalyticsDashboard, formatShare, partialCoverageFrom, shareWidth };

package/dist/modules/analytics/components/dashboard.module.js

@@ -0,0 +1,29 @@
+import "./dashboard_module.css";
+const dashboard_module = {
+    header: "header-zAoAGd",
+    title: "title-ZhxB2D",
+    help: "help-HT9JOI",
+    chartCard: "chartCard-NaXVMm",
+    list: "list-sR__nc",
+    controls: "controls-_Alpbi",
+    stats: "stats-u3kcTH",
+    stat: "stat-KhSBeS",
+    statLabel: "statLabel-X0_tdu",
+    statValue: "statValue-D32ine",
+    statFoot: "statFoot-yvtZiS",
+    toneViews: "toneViews-QGWabX",
+    toneVisitors: "toneVisitors-GTLZDo",
+    toneDownloads: "toneDownloads-WuDN7n",
+    lists: "lists-BLqFfy",
+    stack: "stack-Yzch8f",
+    ranking: "ranking-yfNSnw",
+    rankingRow: "rankingRow-CH1cHn",
+    barViews: "barViews-E6VuaR",
+    barVisitors: "barVisitors-eIANXw",
+    barDownloads: "barDownloads-Z50NxT",
+    rankingOverflow: "rankingOverflow-hUQMKU",
+    rankingLabel: "rankingLabel-wsuniC",
+    rankingValue: "rankingValue-i_vmgf",
+    rankingVisitors: "rankingVisitors-NZl_jj"
+};
+export default dashboard_module;

package/dist/modules/analytics/components/dashboard.test.node.d.ts

@@ -0,0 +1,8 @@
+/**
+ * This Source Code is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/.
+ *
+ * Copyright (c) Infonomic Company Limited
+ */
+export {};