@datalayer/core 1.0.23 → 1.0.25

package/lib/components/scheduler/ScheduleMenu.js

@@ -0,0 +1,154 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+/*
+ * Copyright (c) 2023-2025 Datalayer, Inc.
+ * Distributed under the terms of the Modified BSD License.
+ */
+import { useEffect, useMemo, useState } from 'react';
+import { ActionList, ActionMenu, Box, Button, Dialog, FormControl, IconButton, Spinner, Text, TextInput, } from '@primer/react';
+import { ClockIcon, TrashIcon } from '@primer/octicons-react';
+import { disableSchedule, updateSchedule, upsertSchedule, } from '../../api/scheduler/schedules.js';
+import { DEFAULT_SERVICE_URLS } from '../../api/constants.js';
+const SCHEDULE_PRESETS = [
+    { id: 'every-minute', label: 'Every minute', cron: '* * * * *' },
+    { id: 'hourly', label: 'Every hour', cron: '0 * * * *' },
+    { id: 'daily', label: 'Every day', cron: '0 0 * * *' },
+];
+const DEFAULT_CRON_EXPRESSION = '* * * * *';
+const presetFromCron = (cronExpression) => {
+    const normalized = cronExpression.trim();
+    const preset = SCHEDULE_PRESETS.find(item => item.cron === normalized);
+    return preset ? preset.id : 'custom';
+};
+/**
+ * Self-contained schedule menu that lets a user pick a cron schedule for a
+ * notebook and persists it to the scheduler service.
+ *
+ * The component owns its loading state and renders a spinner in place of the
+ * anchor icon while a save request is in flight. The scheduler service URL is
+ * configurable through the `baseUrl` prop.
+ */
+export const ScheduleMenu = ({ notebookUid, scheduleUid, token, baseUrl = DEFAULT_SERVICE_URLS.SCHEDULER, enabled, icon = ClockIcon, iconColor, ariaLabel = 'Schedule execution', initialPreset = 'every-minute', initialCronExpression, onSaved, onDeleted, onError, }) => {
+    const providedInitialCron = (initialCronExpression || '').trim();
+    const hasProvidedInitialCron = providedInitialCron.length > 0;
+    const initialCron = hasProvidedInitialCron
+        ? providedInitialCron
+        : DEFAULT_CRON_EXPRESSION;
+    const [cronExpression, setCronExpression] = useState(initialCron);
+    const [hasExplicitCron, setHasExplicitCron] = useState(hasProvidedInitialCron);
+    const [isSaving, setIsSaving] = useState(false);
+    const [isDeleting, setIsDeleting] = useState(false);
+    const [isDeleteDialogOpen, setIsDeleteDialogOpen] = useState(false);
+    const [deleteConfirmUid, setDeleteConfirmUid] = useState('');
+    useEffect(() => {
+        const nextProvidedCron = (initialCronExpression || '').trim();
+        const nextHasExplicitCron = nextProvidedCron.length > 0;
+        setHasExplicitCron(nextHasExplicitCron);
+        setCronExpression(nextHasExplicitCron ? nextProvidedCron : DEFAULT_CRON_EXPRESSION);
+    }, [initialCronExpression, scheduleUid, notebookUid]);
+    const preset = useMemo(() => (hasExplicitCron ? presetFromCron(cronExpression) : 'custom'), [cronExpression, hasExplicitCron]);
+    const isEnabled = (enabled ?? true) &&
+        Boolean(token) &&
+        Boolean(notebookUid || scheduleUid) &&
+        !isSaving &&
+        !isDeleting;
+    const selectedPresetDescription = useMemo(() => {
+        if (!hasExplicitCron) {
+            return 'Not scheduled';
+        }
+        const selected = SCHEDULE_PRESETS.find(item => item.cron === cronExpression.trim());
+        if (selected) {
+            return `${selected.label} (${selected.cron})`;
+        }
+        return `Custom (${cronExpression || 'Cron expression not set'})`;
+    }, [cronExpression, hasExplicitCron]);
+    const saveSchedule = async (nextPreset, nextCron) => {
+        const cron = nextCron.trim();
+        if (!token || (!notebookUid && !scheduleUid) || !cron) {
+            return;
+        }
+        setIsSaving(true);
+        try {
+            let schedule;
+            if (scheduleUid) {
+                const response = await updateSchedule(token, scheduleUid, {
+                    cronExpression: cron,
+                    preset: nextPreset,
+                }, baseUrl);
+                schedule = response.schedule;
+            }
+            else {
+                const response = await upsertSchedule(token, {
+                    notebookUid: notebookUid,
+                    cronExpression: cron,
+                    preset: nextPreset,
+                    enabled: true,
+                }, baseUrl);
+                schedule = response.schedule;
+            }
+            onSaved?.(schedule);
+        }
+        catch (error) {
+            onError?.(error);
+        }
+        finally {
+            setIsSaving(false);
+        }
+    };
+    const selectPreset = (nextPreset) => {
+        const next = SCHEDULE_PRESETS.find(item => item.id === nextPreset);
+        if (!next) {
+            return;
+        }
+        setHasExplicitCron(true);
+        setCronExpression(next.cron);
+        void saveSchedule(nextPreset, next.cron);
+    };
+    const applyCustomCron = () => {
+        const value = cronExpression.trim();
+        const inferredPreset = presetFromCron(value);
+        void saveSchedule(inferredPreset, value);
+    };
+    const performDeleteSchedule = async () => {
+        if (!token || !scheduleUid) {
+            return;
+        }
+        setIsDeleting(true);
+        try {
+            const response = await disableSchedule(token, scheduleUid, baseUrl);
+            setIsDeleteDialogOpen(false);
+            setDeleteConfirmUid('');
+            onDeleted?.(response.schedule);
+        }
+        catch (error) {
+            onError?.(error);
+        }
+        finally {
+            setIsDeleting(false);
+        }
+    };
+    return (_jsxs(_Fragment, { children: [_jsxs(ActionMenu, { children: [_jsx(ActionMenu.Anchor, { children: _jsx(IconButton, { icon: isSaving ? () => _jsx(Spinner, { size: "small" }) : icon, variant: "invisible", sx: iconColor ? { color: iconColor } : undefined, "aria-label": ariaLabel, title: isSaving
+                                ? `${ariaLabel} (saving…)`
+                                : isEnabled
+                                    ? ariaLabel
+                                    : `${ariaLabel} (disabled)` }) }), _jsxs(ActionMenu.Overlay, { width: "medium", sx: { minWidth: 300 }, children: [_jsx(Box, { sx: {
+                                    px: 3,
+                                    pt: 3,
+                                    pb: 2,
+                                    borderBottom: '1px solid',
+                                    borderColor: 'border.default',
+                                }, children: _jsx(Text, { as: "p", sx: { fontWeight: 600 }, children: "Schedule" }) }), _jsx(ActionList, { selectionVariant: "single", showDividers: true, children: SCHEDULE_PRESETS.map(option => (_jsxs(ActionList.Item, { selected: preset === option.id, disabled: !isEnabled, onSelect: () => selectPreset(option.id), children: [option.label, _jsx(ActionList.Description, { variant: "block", children: option.cron })] }, option.id))) }), _jsxs(Box, { sx: { p: 3, borderTop: '1px solid', borderColor: 'border.default' }, children: [_jsx(Text, { as: "p", sx: { fontSize: 0, color: 'fg.muted', mb: 2 }, children: "Cron Expression" }), _jsx(TextInput, { value: cronExpression, onChange: event => {
+                                            const value = event.currentTarget.value;
+                                            setHasExplicitCron(value.trim().length > 0);
+                                            setCronExpression(value);
+                                        }, placeholder: "* * * * *", "aria-label": "Cron expression", block: true, disabled: !isEnabled }), _jsxs(Box, { sx: { mt: 2, display: 'flex', gap: 2, flexWrap: 'wrap' }, children: [_jsx(Button, { size: "small", onClick: applyCustomCron, disabled: !isEnabled, children: "Apply Cron" }), scheduleUid ? (_jsx(Button, { size: "small", variant: "danger", leadingVisual: TrashIcon, onClick: () => setIsDeleteDialogOpen(true), disabled: !isEnabled, children: "Delete Schedule" })) : null] }), _jsxs(Text, { as: "p", sx: { mt: 2, fontSize: 0, color: 'fg.muted' }, children: ["Current: ", selectedPresetDescription] })] })] })] }), isDeleteDialogOpen && scheduleUid ? (_jsx(Dialog, { title: "Delete schedule", onClose: () => {
+                    if (isDeleting) {
+                        return;
+                    }
+                    setIsDeleteDialogOpen(false);
+                    setDeleteConfirmUid('');
+                }, width: "medium", children: _jsxs(Box, { sx: { display: 'grid', gap: 3 }, children: [_jsxs(Text, { children: ["This action will disable the schedule and remove planned runs. Type", ' ', _jsx(Text, { as: "span", sx: { fontWeight: 700 }, children: scheduleUid }), ' ', "to confirm."] }), _jsxs(FormControl, { children: [_jsx(FormControl.Label, { children: "Schedule UID" }), _jsx(TextInput, { value: deleteConfirmUid, onChange: event => setDeleteConfirmUid(event.currentTarget.value), placeholder: scheduleUid, autoFocus: true })] }), _jsxs(Box, { sx: { display: 'flex', justifyContent: 'flex-end', gap: 2 }, children: [_jsx(Button, { variant: "default", onClick: () => {
+                                        setIsDeleteDialogOpen(false);
+                                        setDeleteConfirmUid('');
+                                    }, disabled: isDeleting, children: "Cancel" }), _jsx(Button, { variant: "danger", onClick: () => void performDeleteSchedule(), disabled: isDeleting || deleteConfirmUid !== scheduleUid, children: "Delete schedule" })] })] }) })) : null] }));
+};
+export default ScheduleMenu;

package/lib/components/scheduler/index.d.ts

@@ -0,0 +1 @@
+export * from './ScheduleMenu';

package/lib/{views/iam-tokens → components/scheduler}/index.js

@@ -2,6 +2,4 @@
  * Copyright (c) 2023-2025 Datalayer, Inc.
  * Distributed under the terms of the Modified BSD License.
  */
-export * from './IAMTokenEdit.js';
-export * from './IAMTokenNew.js';
-export * from './IAMTokens.js';
+export * from './ScheduleMenu.js';

package/lib/components/time/LiveRelativeTime.d.ts

@@ -0,0 +1,14 @@
+type ILiveRelativeTimeProps = {
+    value?: Date | string | number;
+    refreshIntervalMs?: number;
+    fallback?: string;
+    showTooltip?: boolean;
+};
+/**
+ * Display a live-updating relative time label (e.g. "5m ago", "in 2m").
+ *
+ * When `showTooltip` is true, a Primer tooltip shows ISO + localized datetime
+ * details with timezone information.
+ */
+export declare function LiveRelativeTime({ value, refreshIntervalMs, fallback, showTooltip, }: ILiveRelativeTimeProps): JSX.Element;
+export {};

package/lib/components/time/LiveRelativeTime.js

@@ -0,0 +1,39 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+/*
+ * Copyright (c) 2023-2026 Datalayer, Inc.
+ * Distributed under the terms of the Modified BSD License.
+ */
+import { useEffect, useMemo, useState } from 'react';
+import { Tooltip } from '@primer/react';
+import { formatDateTimeDetails, formatRelativeTime } from '../../utils/index.js';
+/**
+ * Display a live-updating relative time label (e.g. "5m ago", "in 2m").
+ *
+ * When `showTooltip` is true, a Primer tooltip shows ISO + localized datetime
+ * details with timezone information.
+ */
+export function LiveRelativeTime({ value, refreshIntervalMs = 30_000, fallback = '—', showTooltip = true, }) {
+    const [now, setNow] = useState(() => new Date());
+    useEffect(() => {
+        const timer = window.setInterval(() => {
+            setNow(new Date());
+        }, refreshIntervalMs);
+        return () => window.clearInterval(timer);
+    }, [refreshIntervalMs]);
+    const label = useMemo(() => formatRelativeTime(value, now), [value, now]);
+    const tooltip = useMemo(() => formatDateTimeDetails(value), [value]);
+    const content = (_jsx("button", { type: "button", "aria-label": tooltip || 'Date and time details', style: {
+            border: 'none',
+            background: 'transparent',
+            padding: 0,
+            margin: 0,
+            font: 'inherit',
+            color: 'inherit',
+            cursor: 'inherit',
+            lineHeight: 'inherit',
+        }, children: label ?? fallback }));
+    if (!showTooltip || !tooltip) {
+        return content;
+    }
+    return _jsx(Tooltip, { text: tooltip, children: content });
+}

package/lib/components/time/index.d.ts

@@ -0,0 +1 @@
+export * from './LiveRelativeTime';

package/lib/components/time/index.js

@@ -0,0 +1,5 @@
+/*
+ * Copyright (c) 2023-2026 Datalayer, Inc.
+ * Distributed under the terms of the Modified BSD License.
+ */
+export * from './LiveRelativeTime.js';

package/lib/components/timeline/Timeline.d.ts

@@ -0,0 +1,20 @@
+import { type ReactNode } from 'react';
+export type TimelineStatus = 'done' | 'current' | 'pending' | 'failed' | 'neutral';
+export type TimelineItem = {
+    id: string;
+    title: string;
+    timestamp?: string;
+    status?: TimelineStatus;
+    subtitle?: ReactNode;
+};
+export type TimelineProps = {
+    items: TimelineItem[];
+    renderTimestamp?: (value?: string) => ReactNode;
+};
+/**
+ * Horizontal metro-style timeline with connected markers and labels.
+ *
+ * The first item is rendered on the left. Pass items in the desired order
+ * (for example: newest to oldest).
+ */
+export declare const Timeline: ({ items, renderTimestamp }: TimelineProps) => import("react/jsx-runtime").JSX.Element | null;

package/lib/components/timeline/Timeline.js

@@ -0,0 +1,90 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Box, Text } from '@primer/react';
+const statusStyles = {
+    done: {
+        dotBackground: 'success.emphasis',
+        dotBorder: 'success.emphasis',
+        lineColor: 'success.muted',
+        titleColor: 'fg.default',
+    },
+    current: {
+        dotBackground: 'attention.emphasis',
+        dotBorder: 'attention.emphasis',
+        lineColor: 'attention.muted',
+        titleColor: 'fg.default',
+    },
+    pending: {
+        dotBackground: 'canvas.default',
+        dotBorder: 'border.default',
+        lineColor: 'border.default',
+        titleColor: 'fg.muted',
+    },
+    failed: {
+        dotBackground: 'danger.emphasis',
+        dotBorder: 'danger.emphasis',
+        lineColor: 'danger.muted',
+        titleColor: 'danger.fg',
+    },
+    neutral: {
+        dotBackground: 'accent.emphasis',
+        dotBorder: 'accent.emphasis',
+        lineColor: 'accent.muted',
+        titleColor: 'fg.default',
+    },
+};
+/**
+ * Horizontal metro-style timeline with connected markers and labels.
+ *
+ * The first item is rendered on the left. Pass items in the desired order
+ * (for example: newest to oldest).
+ */
+export const Timeline = ({ items, renderTimestamp }) => {
+    if (!items.length) {
+        return null;
+    }
+    return (_jsx(Box, { sx: {
+            overflowX: 'auto',
+            pb: 1,
+        }, children: _jsx(Box, { sx: {
+                display: 'flex',
+                alignItems: 'stretch',
+                minWidth: 'max-content',
+            }, children: items.map((item, index) => {
+                const status = item.status || 'neutral';
+                const style = statusStyles[status];
+                const hasNext = index < items.length - 1;
+                return (_jsxs(Box, { sx: {
+                        display: 'flex',
+                        flexDirection: 'column',
+                        minWidth: 220,
+                        flex: hasNext ? '0 0 220px' : '0 0 auto',
+                        pr: hasNext ? 0 : 1,
+                    }, children: [_jsxs(Box, { sx: {
+                                display: 'flex',
+                                alignItems: 'center',
+                                minHeight: 28,
+                                mb: 2,
+                            }, children: [_jsx(Box, { sx: {
+                                        width: 16,
+                                        height: 16,
+                                        borderRadius: '50%',
+                                        border: '2px solid',
+                                        borderColor: style.dotBorder,
+                                        bg: style.dotBackground,
+                                        boxShadow: 'inset 0 0 0 1px rgba(255,255,255,0.2)',
+                                    } }), hasNext ? (_jsx(Box, { sx: {
+                                        flex: 1,
+                                        height: 4,
+                                        ml: 2,
+                                        mr: 2,
+                                        borderRadius: 999,
+                                        bg: style.lineColor,
+                                    } })) : null] }), _jsx(Text, { as: "p", sx: { fontWeight: 600, color: style.titleColor, mb: 1 }, children: item.title }), _jsx(Text, { as: "p", sx: {
+                                fontSize: 0,
+                                color: 'fg.muted',
+                                mb: item.subtitle ? 1 : 0,
+                            }, children: renderTimestamp
+                                ? renderTimestamp(item.timestamp)
+                                : item.timestamp || 'n/a' }), item.subtitle ? (_jsx(Text, { as: "p", sx: { fontSize: 0, color: 'fg.subtle' }, children: item.subtitle })) : null] }, item.id));
+            }) }) }));
+};

package/lib/components/timeline/index.d.ts

@@ -0,0 +1 @@
+export * from './Timeline';

package/lib/components/timeline/index.js

@@ -0,0 +1,5 @@
+/*
+ * Copyright (c) 2023-2026 Datalayer, Inc.
+ * Distributed under the terms of the Modified BSD License.
+ */
+export * from './Timeline.js';

package/lib/hooks/useCache.d.ts

@@ -233,6 +233,14 @@ export declare const queryKeys: {
     readonly growth: {
         readonly kpi: () => readonly ["growth", "kpi"];
     };
+    readonly ray: {
+        readonly all: () => readonly ["ray"];
+        readonly clusters: () => readonly ["ray", "clusters"];
+        readonly cluster: (namespace: string, clusterName: string) => readonly ["ray", "cluster", string, string];
+        readonly jobs: (namespace: string, clusterName?: string) => readonly ["ray", "jobs", string, string];
+        readonly job: (namespace: string, jobName: string) => readonly ["ray", "job", string, string];
+        readonly logs: (namespace: string, jobName: string) => readonly ["ray", "job", string, string, "logs"];
+    };
     readonly oauth2: {
         readonly authorizationUrl: (queryArgs: Record<string, string>) => readonly ["oauth2", "authz", "url", Record<string, string>];
         readonly authorizationLinkUrl: (queryArgs: Record<string, string>) => readonly ["oauth2", "authz", "url", "link", Record<string, string>];
@@ -750,7 +758,7 @@ export declare const useCache: ({ loginRoute }?: CacheProps) => {
         principalKind?: "user" | "organization" | "team";
     }) => import("@tanstack/react-query").UseMutationResult<any, Error, string, unknown>;
     useToken: (tokenId: string) => import("@tanstack/react-query").UseQueryResult<IIAMToken | null | undefined, Error>;
-    useTokens: () => import("@tanstack/react-query").UseQueryResult<any, Error>;
+    useTokens: () => import("@tanstack/react-query").UseQueryResult<(IIAMToken | undefined)[], Error>;
     useCreateToken: () => import("@tanstack/react-query").UseMutationResult<any, Error, Omit<IIAMToken, "id" | "value">, unknown>;
     useUpdateToken: () => import("@tanstack/react-query").UseMutationResult<any, Error, IIAMToken, unknown>;
     useDeleteToken: () => import("@tanstack/react-query").UseMutationResult<any, Error, string, unknown>;
@@ -899,6 +907,20 @@ export declare const useCache: ({ loginRoute }?: CacheProps) => {
     useUserSurveys: (userId: string, options?: Omit<UseQueryOptions<unknown>, "queryKey" | "queryFn">) => import("@tanstack/react-query").UseQueryResult<unknown, Error>;
     useGrowthKPI: (options?: Omit<UseQueryOptions<unknown>, "queryKey" | "queryFn">) => import("@tanstack/react-query").UseQueryResult<unknown, Error>;
     useGrowthContactsKPI: (options?: Omit<UseQueryOptions<unknown>, "queryKey" | "queryFn">) => import("@tanstack/react-query").UseQueryResult<unknown, Error>;
+    useRayClusters: () => import("@tanstack/react-query").UseQueryResult<{
+        clusters: any[];
+        namespaces: string[];
+    }, Error>;
+    useRayCluster: (namespace?: string, clusterName?: string) => import("@tanstack/react-query").UseQueryResult<any, Error>;
+    useCreateRayCluster: () => import("@tanstack/react-query").UseMutationResult<any, Error, Record<string, unknown>, unknown>;
+    useDeleteRayCluster: (namespace?: string) => import("@tanstack/react-query").UseMutationResult<any, Error, string, unknown>;
+    useRayJobs: (namespace?: string, clusterName?: string) => import("@tanstack/react-query").UseQueryResult<any[], Error>;
+    useSubmitRayJob: (clusterName: string) => import("@tanstack/react-query").UseMutationResult<any, Error, Record<string, unknown>, unknown>;
+    useDeleteRayJob: (namespace?: string) => import("@tanstack/react-query").UseMutationResult<any, Error, string, unknown>;
+    useRayJobLogs: (jobName: string, namespace?: string, tailLines?: number, enabled?: boolean) => import("@tanstack/react-query").UseQueryResult<{
+        logs: string;
+        status: string;
+    }, Error>;
     queryKeys: {
         readonly auth: {
             readonly me: () => readonly ["auth", "me"];
@@ -1084,6 +1106,14 @@ export declare const useCache: ({ loginRoute }?: CacheProps) => {
         readonly growth: {
             readonly kpi: () => readonly ["growth", "kpi"];
         };
+        readonly ray: {
+            readonly all: () => readonly ["ray"];
+            readonly clusters: () => readonly ["ray", "clusters"];
+            readonly cluster: (namespace: string, clusterName: string) => readonly ["ray", "cluster", string, string];
+            readonly jobs: (namespace: string, clusterName?: string) => readonly ["ray", "jobs", string, string];
+            readonly job: (namespace: string, jobName: string) => readonly ["ray", "job", string, string];
+            readonly logs: (namespace: string, jobName: string) => readonly ["ray", "job", string, string, "logs"];
+        };
         readonly oauth2: {
             readonly authorizationUrl: (queryArgs: Record<string, string>) => readonly ["oauth2", "authz", "url", Record<string, string>];
             readonly authorizationLinkUrl: (queryArgs: Record<string, string>) => readonly ["oauth2", "authz", "url", "link", Record<string, string>];