@hot-updater/console 1.0.0-rc.0 → 1.0.0-rc.2

package/src/components/features/bundles/BundleActivityChart.tsx

@@ -1,193 +0,0 @@
-import type { ActiveInstallationWindow } from "@hot-updater/server";
-import { useId } from "react";
-import { Area, AreaChart, CartesianGrid, XAxis, YAxis } from "recharts";
-
-import {
-  type ChartConfig,
-  ChartContainer,
-  ChartTooltip,
-  ChartTooltipContent,
-} from "@/components/ui/chart";
-
-interface SeriesPoint {
-  readonly bucketStartMs: number;
-  readonly value: number;
-}
-
-interface BundleActivityChartProps {
-  readonly installed: readonly SeriesPoint[];
-  readonly recovered: readonly SeriesPoint[];
-  readonly window: ActiveInstallationWindow;
-}
-
-interface ActivityChartPoint {
-  readonly bucketStartMs: number;
-  readonly installed: number;
-  readonly recovered: number;
-}
-
-const chartConfig = {
-  installed: {
-    label: "Applied",
-    color: "var(--chart-2)",
-  },
-  recovered: {
-    label: "Recovered",
-    color: "var(--muted-foreground)",
-  },
-} satisfies ChartConfig;
-
-const dateFormatter = new Intl.DateTimeFormat("en", {
-  day: "numeric",
-  month: "short",
-  timeZone: "UTC",
-});
-const hourFormatter = new Intl.DateTimeFormat("en", {
-  day: "numeric",
-  hour: "numeric",
-  month: "short",
-  timeZone: "UTC",
-});
-
-const windowLabels = {
-  "24h": "24 hours",
-  "7d": "7 days",
-  "30d": "30 days",
-} as const;
-
-const mergeActivitySeries = (
-  installed: readonly SeriesPoint[],
-  recovered: readonly SeriesPoint[],
-): readonly ActivityChartPoint[] => {
-  const installedByBucket = new Map(
-    installed.map((point) => [point.bucketStartMs, point.value] as const),
-  );
-  const recoveredByBucket = new Map(
-    recovered.map((point) => [point.bucketStartMs, point.value] as const),
-  );
-  const buckets = new Set([
-    ...installedByBucket.keys(),
-    ...recoveredByBucket.keys(),
-  ]);
-
-  return [...buckets]
-    .sort((left, right) => left - right)
-    .map((bucketStartMs) => ({
-      bucketStartMs,
-      installed: installedByBucket.get(bucketStartMs) ?? 0,
-      recovered: recoveredByBucket.get(bucketStartMs) ?? 0,
-    }));
-};
-
-const formatBucket = (
-  value: number,
-  window: ActiveInstallationWindow,
-): string =>
-  (window === "24h" ? hourFormatter : dateFormatter).format(new Date(value));
-
-export function BundleActivityChart({
-  installed,
-  recovered,
-  window,
-}: BundleActivityChartProps) {
-  const captionId = useId();
-  const chartData = mergeActivitySeries(installed, recovered);
-  const hasWindowActivity = chartData.some(
-    (point) => point.installed > 0 || point.recovered > 0,
-  );
-
-  if (!hasWindowActivity) {
-    return (
-      <div className="flex h-16 items-center justify-center border-t px-4 pt-3 text-center text-xs text-muted-foreground sm:h-20 sm:pt-4">
-        No device activity in the last 30 days.
-      </div>
-    );
-  }
-
-  return (
-    <div className="border-t pt-3 sm:pt-4">
-      <ChartContainer
-        aria-describedby={captionId}
-        aria-label={`Bundle movement over ${windowLabels[window]}`}
-        className="h-24 w-full aspect-auto sm:h-32"
-        config={chartConfig}
-        role="img"
-      >
-        <AreaChart
-          accessibilityLayer
-          data={chartData}
-          margin={{ left: -16, right: 4, top: 4 }}
-        >
-          <CartesianGrid vertical={false} />
-          <XAxis
-            axisLine={false}
-            dataKey="bucketStartMs"
-            minTickGap={28}
-            tickFormatter={(value: number) => formatBucket(value, window)}
-            tickLine={false}
-          />
-          <YAxis
-            allowDecimals={false}
-            axisLine={false}
-            tickLine={false}
-            width={32}
-          />
-          <ChartTooltip
-            content={
-              <ChartTooltipContent
-                labelFormatter={(_, payload) => {
-                  const bucket = payload[0]?.payload.bucketStartMs;
-                  return typeof bucket === "number"
-                    ? formatBucket(bucket, window)
-                    : "";
-                }}
-              />
-            }
-          />
-          <Area
-            dataKey="installed"
-            fill="var(--color-installed)"
-            fillOpacity={0.12}
-            isAnimationActive={false}
-            stroke="var(--color-installed)"
-            strokeWidth={2}
-            type="monotone"
-          />
-          <Area
-            dataKey="recovered"
-            fill="var(--color-recovered)"
-            fillOpacity={0.04}
-            isAnimationActive={false}
-            stroke="var(--color-recovered)"
-            strokeWidth={1.5}
-            type="monotone"
-          />
-        </AreaChart>
-      </ChartContainer>
-      <div className="sr-only">
-        <table>
-          <caption id={captionId}>
-            Distinct bundle movement in each bucket over {windowLabels[window]}.
-            Times are shown in UTC.
-          </caption>
-          <thead>
-            <tr>
-              <th scope="col">Date</th>
-              <th scope="col">Applied</th>
-              <th scope="col">Recovered</th>
-            </tr>
-          </thead>
-          <tbody>
-            {chartData.map((point) => (
-              <tr key={point.bucketStartMs}>
-                <th scope="row">{formatBucket(point.bucketStartMs, window)}</th>
-                <td>{point.installed}</td>
-                <td>{point.recovered}</td>
-              </tr>
-            ))}
-          </tbody>
-        </table>
-      </div>
-    </div>
-  );
-}

package/src/components/features/bundles/BundleAnalyticsSummary.tsx

@@ -1,123 +0,0 @@
-import { useAnalyticsCapability } from "@/components/features/analytics/AnalyticsCapabilityContext";
-import { AnalyticsErrorAlert } from "@/components/features/analytics/AnalyticsErrorAlert";
-import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
-import { Skeleton } from "@/components/ui/skeleton";
-import { useBundleEventAnalyticsQuery } from "@/lib/api";
-
-import { BundleActivityChart } from "./BundleActivityChart";
-
-interface BundleAnalyticsSummaryProps {
-  readonly bundleId: string;
-}
-
-function Metric({
-  label,
-  tone,
-  value,
-}: {
-  readonly label: string;
-  readonly tone: "applied" | "recovered";
-  readonly value: number;
-}) {
-  return (
-    <div className="flex flex-col gap-1">
-      <dt className="flex items-center gap-2 text-xs text-muted-foreground">
-        <span
-          aria-hidden="true"
-          className={
-            tone === "applied"
-              ? "size-2 rounded-full bg-chart-2"
-              : "size-2 rounded-full bg-muted-foreground"
-          }
-        />
-        {label}
-      </dt>
-      <dd className="text-xl font-semibold tracking-tight tabular-nums">
-        {value}
-      </dd>
-    </div>
-  );
-}
-
-function SupportedBundleAnalyticsSummary({
-  bundleId,
-}: BundleAnalyticsSummaryProps) {
-  const { data, error, isLoading } = useBundleEventAnalyticsQuery(
-    {
-      bundleId,
-      window: "30d",
-      limit: 1,
-      offset: 0,
-    },
-    true,
-  );
-
-  return (
-    <Card>
-      <CardHeader className="p-4 pb-3">
-        <CardTitle className="text-sm font-medium">
-          Activity · 30 days
-        </CardTitle>
-      </CardHeader>
-      <CardContent className="flex flex-col gap-3 px-4 pb-4">
-        {isLoading ? (
-          <div
-            aria-label="Loading reported bundle outcomes"
-            className="flex flex-col gap-3"
-          >
-            <div className="grid grid-cols-2 gap-4">
-              <Skeleton className="h-10 w-full" />
-              <Skeleton className="h-10 w-full" />
-            </div>
-            <Skeleton className="h-24 w-full sm:h-32" />
-          </div>
-        ) : error ? (
-          <AnalyticsErrorAlert
-            error={
-              error instanceof Error
-                ? error
-                : new Error("Failed to load bundle analytics.")
-            }
-            fallbackTitle="Analytics unavailable"
-          />
-        ) : (
-          <>
-            <dl className="grid grid-cols-2 divide-x divide-border/70">
-              <div className="pr-4">
-                <Metric
-                  label="Applied"
-                  tone="applied"
-                  value={data?.summary.installed ?? 0}
-                />
-              </div>
-              <div className="pl-4">
-                <Metric
-                  label="Recovered"
-                  tone="recovered"
-                  value={data?.summary.recovered ?? 0}
-                />
-              </div>
-            </dl>
-            <BundleActivityChart
-              installed={data?.series.installed ?? []}
-              recovered={data?.series.recovered ?? []}
-              window="30d"
-            />
-          </>
-        )}
-      </CardContent>
-    </Card>
-  );
-}
-
-export function BundleAnalyticsSummary({
-  bundleId,
-}: BundleAnalyticsSummaryProps) {
-  const capability = useAnalyticsCapability();
-
-  if (capability.status !== "supported") {
-    return null;
-  }
-
-  return <SupportedBundleAnalyticsSummary bundleId={bundleId} />;
-}

package/src/lib/analytics-api.ts

@@ -1,145 +0,0 @@
-import { type QueryClient, useQuery } from "@tanstack/react-query";
-import { redirect } from "@tanstack/react-router";
-
-import {
-  type ActiveInstallationInput,
-  parseActiveInstallationInput,
-} from "./analytics-input";
-import {
-  getActiveInstallationOverviewRpc,
-  getAnalyticsCapabilitiesRpc,
-  getAnalyticsOverviewRpc,
-  type AnalyticsCapabilities,
-} from "./analytics-rpc";
-
-export type AnalyticsCapabilityState =
-  | { readonly status: "unresolved" }
-  | { readonly status: "unsupported" }
-  | {
-      readonly status: "supported";
-      readonly mode: "bounded";
-      readonly maxMatchingRows: number;
-    }
-  | { readonly status: "error"; readonly error: Error };
-
-type AnalyticsCapabilityQueryResult =
-  | { readonly status: "pending" }
-  | { readonly status: "success"; readonly data: AnalyticsCapabilities }
-  | { readonly status: "error"; readonly error: Error };
-
-export type ProtectedAnalyticsRouteDecision =
-  | "loading"
-  | "redirect"
-  | "allow"
-  | "error";
-
-export const analyticsQueryKeys = {
-  capabilities: ["analytics", "capabilities"] as const,
-  overview: ["analytics", "overview"] as const,
-  activeInstallations: (input: ActiveInstallationInput) =>
-    [
-      "analytics",
-      "active-installations",
-      input.window,
-      input.userId ?? null,
-    ] as const,
-};
-
-const ANALYTICS_STALE_TIME_MS = 30_000;
-
-export const getAnalyticsCapabilityState = (
-  query: AnalyticsCapabilityQueryResult,
-): AnalyticsCapabilityState => {
-  switch (query.status) {
-    case "pending":
-      return { status: "unresolved" };
-    case "error":
-      return { status: "error", error: query.error };
-    case "success":
-      if (!query.data.capabilities.analytics) {
-        return { status: "unsupported" };
-      }
-      return {
-        status: "supported",
-        mode: "bounded",
-        maxMatchingRows: query.data.capabilities.maxMatchingRows,
-      };
-  }
-};
-
-export const getProtectedAnalyticsRouteDecision = (
-  capability: AnalyticsCapabilityState,
-): ProtectedAnalyticsRouteDecision => {
-  switch (capability.status) {
-    case "unresolved":
-      return "loading";
-    case "unsupported":
-      return "redirect";
-    case "supported":
-      return "allow";
-    case "error":
-      return "error";
-  }
-};
-
-export const isAnalyticsQueryEnabled = (
-  capability: AnalyticsCapabilityState,
-): boolean => capability.status === "supported";
-
-export const getAnalyticsCapabilitiesQueryOptions = () => ({
-  queryKey: analyticsQueryKeys.capabilities,
-  queryFn: () => getAnalyticsCapabilitiesRpc(),
-  staleTime: Infinity,
-});
-
-export const useAnalyticsCapabilitiesQuery = () =>
-  useQuery(getAnalyticsCapabilitiesQueryOptions());
-
-export const ensureAnalyticsRouteAccess = async (
-  queryClient: QueryClient,
-): Promise<void> => {
-  const result = await queryClient.ensureQueryData(
-    getAnalyticsCapabilitiesQueryOptions(),
-  );
-
-  if (!result.capabilities.analytics) {
-    throw redirect({
-      to: "/",
-      search: {},
-      replace: true,
-    });
-  }
-};
-
-export const getAnalyticsOverviewQueryOptions = (
-  capability: AnalyticsCapabilityState,
-) => ({
-  queryKey: analyticsQueryKeys.overview,
-  queryFn: () => getAnalyticsOverviewRpc(),
-  staleTime: ANALYTICS_STALE_TIME_MS,
-  refetchOnWindowFocus: true,
-  enabled: isAnalyticsQueryEnabled(capability),
-});
-
-export const useAnalyticsOverviewQuery = (
-  capability: AnalyticsCapabilityState,
-) => useQuery(getAnalyticsOverviewQueryOptions(capability));
-
-export const getActiveInstallationQueryOptions = (
-  capability: AnalyticsCapabilityState,
-  input: ActiveInstallationInput,
-) => {
-  const normalized = parseActiveInstallationInput(input);
-  return {
-    queryKey: analyticsQueryKeys.activeInstallations(normalized),
-    queryFn: () => getActiveInstallationOverviewRpc({ data: normalized }),
-    staleTime: ANALYTICS_STALE_TIME_MS,
-    refetchOnWindowFocus: true,
-    enabled: isAnalyticsQueryEnabled(capability),
-  };
-};
-
-export const useActiveInstallationQuery = (
-  capability: AnalyticsCapabilityState,
-  input: ActiveInstallationInput,
-) => useQuery(getActiveInstallationQueryOptions(capability, input));

package/src/lib/analytics-error.ts

@@ -1,19 +0,0 @@
-export type AnalyticsErrorCopy = {
-  readonly title: string;
-  readonly description: string;
-};
-
-export const getAnalyticsErrorCopy = (
-  error: Error,
-  fallbackTitle: string,
-): AnalyticsErrorCopy => {
-  const match = /^Bundle event scan exceeded (\d+) rows\.$/.exec(error.message);
-  if (!match) {
-    return { title: fallbackTitle, description: error.message };
-  }
-  const limit = Number(match[1]);
-  return {
-    title: "Analytics report limit reached",
-    description: `This query matched more than ${limit.toLocaleString()} reports. Narrow the query and try again.`,
-  };
-};

package/src/lib/analytics-input.ts

@@ -1,187 +0,0 @@
-import type { ActiveInstallationWindow } from "@hot-updater/server";
-import type { BundleEventAnalyticsWindow } from "@hot-updater/server";
-
-const MAX_ANALYTICS_STRING_LENGTH = 1024;
-const MAX_ANALYTICS_LIMIT = 100;
-
-export type BundleEventSummaryInput = {
-  readonly bundleId: string;
-};
-
-export type BundleEventAnalyticsInput = BundleEventSummaryInput & {
-  readonly window: BundleEventAnalyticsWindow;
-  readonly limit?: number;
-  readonly offset?: number;
-};
-
-export type SearchInstallationsInput = {
-  readonly query: string;
-  readonly limit?: number;
-  readonly offset?: number;
-};
-
-export type InstallationHistoryInput = {
-  readonly installId: string;
-  readonly limit?: number;
-  readonly offset?: number;
-};
-
-export type ActiveInstallationInput = {
-  readonly window: ActiveInstallationWindow;
-  readonly userId?: string;
-};
-
-type AnalyticsPagination = {
-  readonly limit?: number;
-  readonly offset?: number;
-};
-
-export class AnalyticsInputValidationError extends Error {
-  readonly name = "AnalyticsInputValidationError";
-
-  constructor(readonly field: string) {
-    super(`Invalid analytics input: ${field}`);
-  }
-}
-
-const isRecord = (input: unknown): input is Record<string, unknown> =>
-  typeof input === "object" && input !== null && !Array.isArray(input);
-
-const parseRecord = (input: unknown): Record<string, unknown> => {
-  if (!isRecord(input)) {
-    throw new AnalyticsInputValidationError("input");
-  }
-  return input;
-};
-
-const parseString = (input: Record<string, unknown>, field: string): string => {
-  const value = input[field];
-  if (typeof value !== "string") {
-    throw new AnalyticsInputValidationError(field);
-  }
-  const trimmed = value.trim();
-  if (trimmed.length === 0 || trimmed.length > MAX_ANALYTICS_STRING_LENGTH) {
-    throw new AnalyticsInputValidationError(field);
-  }
-  return trimmed;
-};
-
-const parseLimit = (input: Record<string, unknown>): number | undefined => {
-  const value = input.limit;
-  if (value === undefined) {
-    return undefined;
-  }
-  if (
-    typeof value !== "number" ||
-    !Number.isInteger(value) ||
-    value < 1 ||
-    value > MAX_ANALYTICS_LIMIT
-  ) {
-    throw new AnalyticsInputValidationError("limit");
-  }
-  return value;
-};
-
-const parseOffset = (input: Record<string, unknown>): number | undefined => {
-  const value = input.offset;
-  if (value === undefined) {
-    return undefined;
-  }
-  if (typeof value !== "number" || !Number.isSafeInteger(value) || value < 0) {
-    throw new AnalyticsInputValidationError("offset");
-  }
-  return value;
-};
-
-const parsePagination = (
-  input: Record<string, unknown>,
-): AnalyticsPagination => {
-  const limit = parseLimit(input);
-  const offset = parseOffset(input);
-  return {
-    ...(limit === undefined ? {} : { limit }),
-    ...(offset === undefined ? {} : { offset }),
-  };
-};
-
-const parseWindow = (
-  input: Record<string, unknown>,
-): BundleEventAnalyticsWindow => {
-  const value = input.window;
-  if (value === "24h" || value === "7d" || value === "30d" || value === "all") {
-    return value;
-  }
-  throw new AnalyticsInputValidationError("window");
-};
-
-const parseActiveWindow = (
-  input: Record<string, unknown>,
-): ActiveInstallationWindow => {
-  const value = input.window;
-  if (value === "24h" || value === "7d" || value === "30d") {
-    return value;
-  }
-  throw new AnalyticsInputValidationError("window");
-};
-
-const parseOptionalUserId = (
-  input: Record<string, unknown>,
-): string | undefined => {
-  if (input.userId === undefined) return undefined;
-  if (typeof input.userId !== "string") {
-    throw new AnalyticsInputValidationError("userId");
-  }
-  const userId = input.userId.trim();
-  if (userId.length === 0) return undefined;
-  if (userId.length > MAX_ANALYTICS_STRING_LENGTH) {
-    throw new AnalyticsInputValidationError("userId");
-  }
-  return userId;
-};
-
-export const parseActiveInstallationInput = (
-  input: unknown,
-): ActiveInstallationInput => {
-  const record = parseRecord(input);
-  const window = parseActiveWindow(record);
-  const userId = parseOptionalUserId(record);
-  return userId === undefined ? { window } : { window, userId };
-};
-
-export const parseBundleEventSummaryInput = (
-  input: unknown,
-): BundleEventSummaryInput => {
-  const record = parseRecord(input);
-  return { bundleId: parseString(record, "bundleId") };
-};
-
-export const parseBundleEventAnalyticsInput = (
-  input: unknown,
-): BundleEventAnalyticsInput => {
-  const record = parseRecord(input);
-  return {
-    bundleId: parseString(record, "bundleId"),
-    window: parseWindow(record),
-    ...parsePagination(record),
-  };
-};
-
-export const parseSearchInstallationsInput = (
-  input: unknown,
-): SearchInstallationsInput => {
-  const record = parseRecord(input);
-  return {
-    query: parseString(record, "query"),
-    ...parsePagination(record),
-  };
-};
-
-export const parseInstallationHistoryInput = (
-  input: unknown,
-): InstallationHistoryInput => {
-  const record = parseRecord(input);
-  return {
-    installId: parseString(record, "installId"),
-    ...parsePagination(record),
-  };
-};