@datalayer/core 1.0.21 → 1.0.23

package/lib/components/principal/PrincipalSwitcherMenu.js

@@ -0,0 +1,287 @@
+import { jsx as _jsx, jsxs as _jsxs } 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, Text } from '@primer/react';
+import { OrganizationIcon, PeopleIcon, PersonIcon, } from '@primer/octicons-react';
+import { useCache, useAuthorization } from '../../hooks/index.js';
+import { useCoreStore } from '../../state/index.js';
+import { useIAMStore } from '../../state/substates/index.js';
+import { memberships as fetchMemberships } from '../../api/iam/profile.js';
+import { usePrincipalStore } from '../../hooks/usePrincipalStore.js';
+import { useBillableAccountStore } from '../../hooks/useBillableAccountStore.js';
+import { useSelectedPrincipal } from '../../hooks/useSelectedPrincipal.js';
+import { formatFriendlyHandle } from '../../utils/Handles.js';
+function truncatePrincipalLabel(label, maxChars) {
+    const trimmed = (label || '').trim();
+    if (!trimmed) {
+        return '';
+    }
+    if (trimmed.length <= maxChars) {
+        return trimmed;
+    }
+    return `${trimmed.slice(0, Math.max(0, maxChars - 1))}…`;
+}
+/**
+ * PrincipalSwitcherMenu — the *only* component allowed to write to the
+ * principal store and the billable account store. It keeps both stores in
+ * sync per the rule:
+ *   - selecting a user/org principal → billable account = same user/org
+ *   - selecting a team principal     → billable account = the team's parent org
+ */
+export function PrincipalSwitcherMenu({ maxLabelChars = 48, fullWidth = true, showClosedBorder = true, }) {
+    const { user, token, iamRunUrl } = useIAMStore();
+    const { configuration } = useCoreStore();
+    const { checkIsPlatformAdmin } = useAuthorization();
+    const { useUserOrganizations } = useCache();
+    const organizationsQuery = useUserOrganizations();
+    const organizations = organizationsQuery.data || [];
+    const isOrganizationsLoading = organizationsQuery.isLoading;
+    const isPlatformAdmin = user ? checkIsPlatformAdmin(user) : false;
+    const [teams, setTeams] = useState([]);
+    const [teamsLoading, setTeamsLoading] = useState(false);
+    const selectUserPrincipal = usePrincipalStore(state => state.selectUserPrincipal);
+    const selectOrganizationPrincipal = usePrincipalStore(state => state.selectOrganizationPrincipal);
+    const selectTeamPrincipal = usePrincipalStore(state => state.selectTeamPrincipal);
+    const setBillableAccount = useBillableAccountStore(state => state.setBillableAccount);
+    const { selectedPrincipalKind, selectedPrincipalUid, selectedPrincipalHandle, selectedTeamParentOrganizationHandle, } = useSelectedPrincipal();
+    const personalUid = user?.uid || user?.id || '';
+    const personalHandle = user?.handle || '';
+    const selectUser = (uid, handle) => {
+        selectUserPrincipal(uid, handle);
+        setBillableAccount({ kind: 'user', uid, handle });
+    };
+    const selectOrganization = (uid, handle) => {
+        selectOrganizationPrincipal(uid, handle);
+        setBillableAccount({ kind: 'organization', uid, handle });
+    };
+    const selectTeam = (team, orgHandle) => {
+        if (!team.organizationUid) {
+            return;
+        }
+        selectTeamPrincipal({
+            teamUid: team.uid,
+            teamHandle: team.handle,
+            organizationUid: team.organizationUid,
+            organizationHandle: orgHandle,
+        });
+        setBillableAccount({
+            kind: 'organization',
+            uid: team.organizationUid,
+            handle: orgHandle,
+        });
+    };
+    const getOrganizationUid = (organization) => String(organization?.uid || organization?.id || '');
+    const selectedOrganization = useMemo(() => organizations.find((org) => getOrganizationUid(org) === selectedPrincipalUid), [organizations, selectedPrincipalUid]);
+    const selectedTeam = useMemo(() => teams.find(team => team.uid === selectedPrincipalUid), [teams, selectedPrincipalUid]);
+    useEffect(() => {
+        let cancelled = false;
+        const loadTeams = async () => {
+            if (!token) {
+                setTeams([]);
+                return;
+            }
+            setTeamsLoading(true);
+            try {
+                const baseUrl = iamRunUrl || configuration.iamRunUrl;
+                const response = await fetchMemberships(token, baseUrl);
+                const rawMemberships = Array.isArray(response?.memberships)
+                    ? response.memberships
+                    : [];
+                const mappedTeams = rawMemberships
+                    .filter((membership) => membership?.type === 'team')
+                    .map((membership) => ({
+                    uid: String(membership?.uid || membership?.id || '').trim(),
+                    handle: String(membership?.handle || '').trim(),
+                    organizationUid: String(membership?.organization_uid || '').trim() || undefined,
+                    organizationHandle: String(membership?.organization_handle ||
+                        membership?.organization?.handle ||
+                        '').trim() || undefined,
+                }))
+                    .filter((team) => Boolean(team.uid && team.handle));
+                if (!cancelled) {
+                    setTeams(mappedTeams);
+                }
+            }
+            catch {
+                if (!cancelled) {
+                    setTeams([]);
+                }
+            }
+            finally {
+                if (!cancelled) {
+                    setTeamsLoading(false);
+                }
+            }
+        };
+        void loadTeams();
+        return () => {
+            cancelled = true;
+        };
+    }, [token, iamRunUrl, configuration.iamRunUrl]);
+    useEffect(() => {
+        if (!personalUid || !personalHandle) {
+            return;
+        }
+        if (!selectedPrincipalUid) {
+            selectUser(personalUid, personalHandle);
+            return;
+        }
+        if (selectedPrincipalKind === 'organization' && isOrganizationsLoading) {
+            return;
+        }
+        if (selectedPrincipalKind === 'organization' && !selectedOrganization) {
+            selectUser(personalUid, personalHandle);
+            return;
+        }
+        if (selectedPrincipalKind === 'team' && teamsLoading) {
+            return;
+        }
+        if (selectedPrincipalKind === 'team' && !selectedTeam) {
+            selectUser(personalUid, personalHandle);
+            return;
+        }
+        if (selectedPrincipalKind === 'user' &&
+            selectedPrincipalUid !== personalUid) {
+            selectUser(personalUid, personalHandle);
+        }
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [
+        personalUid,
+        personalHandle,
+        selectedPrincipalUid,
+        selectedPrincipalKind,
+        isOrganizationsLoading,
+        teamsLoading,
+        selectedOrganization,
+        selectedTeam,
+    ]);
+    const effectiveHandle = selectedPrincipalKind === 'organization'
+        ? selectedOrganization?.handle ||
+            selectedPrincipalHandle ||
+            personalHandle
+        : selectedPrincipalKind === 'team'
+            ? selectedTeam?.handle || selectedPrincipalHandle || personalHandle
+            : personalHandle;
+    const organizationHandleByUid = useMemo(() => {
+        const byUid = new Map();
+        for (const organization of organizations) {
+            const uid = getOrganizationUid(organization);
+            const handle = String(organization?.handle || '').trim();
+            if (uid && handle) {
+                byUid.set(uid, handle);
+            }
+        }
+        return byUid;
+    }, [organizations]);
+    const resolveTeamOrganizationHandle = (team) => {
+        if (!team) {
+            return '';
+        }
+        const directHandle = String(team.organizationHandle || '').trim();
+        if (directHandle) {
+            return directHandle;
+        }
+        const fromOrganizations = team.organizationUid
+            ? organizationHandleByUid.get(team.organizationUid) || ''
+            : '';
+        return fromOrganizations.trim();
+    };
+    const effectiveOrganizationHandle = selectedPrincipalKind === 'team'
+        ? resolveTeamOrganizationHandle(selectedTeam) ||
+            selectedTeamParentOrganizationHandle ||
+            ''
+        : '';
+    const selectedPrincipalLabel = selectedPrincipalKind === 'team'
+        ? `@${formatFriendlyHandle(effectiveOrganizationHandle || personalHandle || 'organization')}/${formatFriendlyHandle(effectiveHandle)}`
+        : `@${formatFriendlyHandle(effectiveHandle)}`;
+    const selectedPrincipalLabelClosed = truncatePrincipalLabel(selectedPrincipalLabel, maxLabelChars);
+    const isCurrentUserPrincipal = selectedPrincipalKind === 'user';
+    const selectedItemSx = {
+        bg: 'accent.subtle',
+        borderColor: 'accent.muted',
+        color: 'accent.fg',
+        fontWeight: 'semibold',
+    };
+    const adminBadgeSx = {
+        ml: 'auto',
+        px: 1,
+        py: '2px',
+        borderRadius: 999,
+        bg: 'attention.subtle',
+        color: 'attention.fg',
+        fontSize: 0,
+        fontWeight: 'semibold',
+        lineHeight: 1.2,
+        textTransform: 'lowercase',
+    };
+    return (_jsxs(ActionMenu, { children: [_jsx(ActionMenu.Anchor, { children: _jsxs(Box, { as: "button", type: "button", "aria-label": "Switch principal", sx: {
+                        width: fullWidth ? '100%' : 'auto',
+                        p: 2,
+                        display: 'flex',
+                        alignItems: 'center',
+                        justifyContent: 'space-between',
+                        gap: 2,
+                        bg: showClosedBorder ? 'canvas.subtle' : 'transparent',
+                        border: showClosedBorder ? '1px solid' : 'none',
+                        borderColor: showClosedBorder ? 'border.default' : 'transparent',
+                        borderRadius: 2,
+                        cursor: 'pointer',
+                        textAlign: 'left',
+                    }, children: [_jsx(Box, { sx: {
+                                display: 'inline-flex',
+                                alignItems: 'center',
+                                color: 'fg.muted',
+                                flexShrink: 0,
+                            }, children: selectedPrincipalKind === 'organization' ? (_jsx(OrganizationIcon, { size: 16 })) : selectedPrincipalKind === 'team' ? (_jsx(PeopleIcon, { size: 16 })) : (_jsx(PersonIcon, { size: 16 })) }), _jsx(Box, { sx: { minWidth: 0, flex: 1 }, children: _jsx(Text, { sx: {
+                                    display: 'block',
+                                    color: 'accent.fg',
+                                    fontWeight: 'semibold',
+                                    fontSize: 1,
+                                    whiteSpace: 'nowrap',
+                                    overflow: 'hidden',
+                                    textOverflow: 'ellipsis',
+                                    maxWidth: '100%',
+                                }, children: selectedPrincipalLabelClosed }) }), isPlatformAdmin && isCurrentUserPrincipal ? (_jsx(Box, { sx: {
+                                ml: 'auto',
+                                flexShrink: 0,
+                                display: 'inline-flex',
+                                alignItems: 'center',
+                            }, children: _jsx(Box, { as: "span", sx: adminBadgeSx, children: "admin" }) })) : null] }) }), _jsx(ActionMenu.Overlay, { width: "medium", children: _jsxs(ActionList, { children: [_jsxs(ActionList.Group, { children: [_jsx(ActionList.GroupHeading, { children: "User" }), _jsxs(ActionList.Item, { disabled: isCurrentUserPrincipal, selected: isCurrentUserPrincipal, sx: isCurrentUserPrincipal ? selectedItemSx : undefined, onSelect: () => {
+                                        if (isCurrentUserPrincipal) {
+                                            return;
+                                        }
+                                        if (personalUid && personalHandle) {
+                                            selectUser(personalUid, personalHandle);
+                                        }
+                                    }, children: [_jsx(ActionList.LeadingVisual, { children: _jsx(PersonIcon, {}) }), "@", formatFriendlyHandle(personalHandle || 'me'), isPlatformAdmin ? (_jsx(ActionList.TrailingVisual, { children: _jsx(Box, { as: "span", sx: adminBadgeSx, children: "admin" }) })) : null] })] }), _jsxs(ActionList.Group, { children: [_jsx(ActionList.GroupHeading, { children: "Organizations" }), organizations.length === 0 ? (_jsx(ActionList.Item, { disabled: true, children: "No organizations" })) : (organizations.map((organization) => {
+                                    const organizationUid = getOrganizationUid(organization);
+                                    const isCurrentOrganizationPrincipal = selectedPrincipalKind === 'organization' &&
+                                        selectedPrincipalUid === organizationUid;
+                                    return (_jsxs(ActionList.Item, { disabled: isCurrentOrganizationPrincipal, selected: isCurrentOrganizationPrincipal, sx: isCurrentOrganizationPrincipal
+                                            ? selectedItemSx
+                                            : undefined, onSelect: () => {
+                                            if (isCurrentOrganizationPrincipal) {
+                                                return;
+                                            }
+                                            if (organizationUid && organization.handle) {
+                                                selectOrganization(organizationUid, organization.handle);
+                                            }
+                                        }, children: [_jsx(ActionList.LeadingVisual, { children: _jsx(OrganizationIcon, {}) }), "@", organization.handle] }, organizationUid));
+                                }))] }), _jsxs(ActionList.Group, { children: [_jsx(ActionList.GroupHeading, { children: "Teams" }), teams.length === 0 ? (_jsx(ActionList.Item, { disabled: true, children: "No teams" })) : (teams.map(team => {
+                                    const isCurrentTeamPrincipal = selectedPrincipalKind === 'team' &&
+                                        selectedPrincipalUid === team.uid;
+                                    const orgHandle = resolveTeamOrganizationHandle(team) ||
+                                        personalHandle ||
+                                        'organization';
+                                    return (_jsxs(ActionList.Item, { disabled: isCurrentTeamPrincipal, selected: isCurrentTeamPrincipal, sx: isCurrentTeamPrincipal ? selectedItemSx : undefined, onSelect: () => {
+                                            if (isCurrentTeamPrincipal) {
+                                                return;
+                                            }
+                                            selectTeam(team, orgHandle);
+                                        }, children: [_jsx(ActionList.LeadingVisual, { children: _jsx(PeopleIcon, {}) }), "@", formatFriendlyHandle(orgHandle), "/", formatFriendlyHandle(team.handle)] }, team.uid));
+                                }))] })] }) })] }));
+}
+export default PrincipalSwitcherMenu;

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

@@ -0,0 +1,7 @@
+export * from './Principal';
+export * from './PrincipalAvatar';
+export * from './PrincipalBadge';
+export * from './PrincipalBanner';
+export { buildPrincipalProfilePath, PrincipalDetailsOverlay, } from './PrincipalDetailsOverlay';
+export type { PrincipalDetailsOverlayProps } from './PrincipalDetailsOverlay';
+export * from './PrincipalSwitcherMenu';

package/lib/components/principal/index.js

@@ -0,0 +1,10 @@
+/*
+ * Copyright (c) 2023-2025 Datalayer, Inc.
+ * Distributed under the terms of the Modified BSD License.
+ */
+export * from './Principal.js';
+export * from './PrincipalAvatar.js';
+export * from './PrincipalBadge.js';
+export * from './PrincipalBanner.js';
+export { buildPrincipalProfilePath, PrincipalDetailsOverlay, } from './PrincipalDetailsOverlay.js';
+export * from './PrincipalSwitcherMenu.js';

package/lib/components/runtimes/RuntimeLauncherDialog.d.ts

@@ -46,6 +46,10 @@ export interface IRuntimeLauncherDialogProps {
      * Upgrade subscription URL
      */
     upgradeSubscription?: string;
+    /**
+     * Optional submit button label override.
+     */
+    submitLabel?: string;
 }
 /**
  * Start Runtime Launcher Dialog.

package/lib/components/runtimes/RuntimeLauncherDialog.js

@@ -31,8 +31,9 @@ const NOT_AVAILABLE_RETRIES = 5;
  * Start Runtime Launcher Dialog.
  */
 export function RuntimeLauncherDialog(props) {
-    const { dialogTitle, kernelSnapshot, manager, onSubmit, markdownParser, sanitizer, upgradeSubscription, startRuntime = true, } = props;
+    const { dialogTitle, kernelSnapshot, manager, onSubmit, markdownParser, sanitizer, upgradeSubscription, submitLabel, startRuntime = true, } = props;
     const hasExample = startRuntime === 'with-example';
+    const shouldStartRuntime = startRuntime !== 'defer';
     const user = iamStore.getState().user;
     const environments = manager.environments.get();
     const { configuration } = useCoreStore();
@@ -49,7 +50,7 @@ export function RuntimeLauncherDialog(props) {
     const jupyterReactStore = useJupyterReactStore();
     const jupyterLabAdapter = jupyterReactStore.jupyterLabAdapter;
     const [selection, setSelection] = useState((kernelSnapshot?.environment || environments[0]?.name) ?? '');
-    const [timeLimit, setTimeLimit] = useState(Math.min(credits?.available ?? 0, 10));
+    const [timeLimit, setTimeLimit] = useState(10);
     const [runtimeName, setRuntimeName] = useState(environments[0]?.runtime?.givenNameTemplate || environments[0]?.title || '');
     // Whether the runtim name has been changed by the user or not
     const [hasCustomRuntimeName, setHasCustomRuntimeName] = useState(false);
@@ -60,16 +61,36 @@ export function RuntimeLauncherDialog(props) {
     const [flashLevel, setFlashLevel] = useState('danger');
     const isMounted = useIsMounted();
     useEffect(() => {
-        if (startRuntime) {
+        if (shouldStartRuntime) {
             refreshCredits();
         }
-    }, [startRuntime]);
+    }, [shouldStartRuntime]);
     const spec = useMemo(() => environments.find(spec => spec.name === selection), [environments, selection]);
     const description = spec?.description ?? '';
     const burningRate = spec?.burning_rate ?? 1;
     const creditsToMinutes = 1.0 / burningRate / 60.0;
-    const max = Math.floor((credits?.available ?? 0) * creditsToMinutes);
-    const outOfCredits = startRuntime && (!credits?.available || max < Number.EPSILON);
+    const includedRuns = user?.subscription?.usage?.included_runs ??
+        user?.subscription?.included_runs;
+    const currentRuns = user?.subscription?.usage?.current_runs ??
+        user?.subscription?.current_runs ??
+        user?.subscription?.used_runs;
+    const hasKnownRunAllowance = typeof includedRuns === 'number';
+    const hasRemainingRuns = hasKnownRunAllowance &&
+        typeof currentRuns === 'number' &&
+        includedRuns > 0 &&
+        currentRuns < includedRuns;
+    const hasKnownCredits = typeof credits?.available === 'number';
+    const maxFromCredits = hasKnownCredits
+        ? Math.floor((credits.available ?? 0) * creditsToMinutes)
+        : 10;
+    const effectiveMaxMinutes = hasKnownCredits && hasKnownRunAllowance && !hasRemainingRuns
+        ? Math.max(1, maxFromCredits)
+        : Math.max(10, maxFromCredits > 0 ? maxFromCredits : 0);
+    const outOfCredits = shouldStartRuntime &&
+        hasKnownCredits &&
+        hasKnownRunAllowance &&
+        !hasRemainingRuns &&
+        ((credits.available ?? 0) <= 0 || maxFromCredits < Number.EPSILON);
     const handleSelectionChange = useCallback((e) => {
         const selection = e.target.value;
         setSelection(selection);
@@ -81,7 +102,7 @@ export function RuntimeLauncherDialog(props) {
     const handleSubmitRuntime = useCallback(async () => {
         if (selection) {
             setError(undefined);
-            setWaitingForRuntime(true);
+            setWaitingForRuntime(shouldStartRuntime);
             const spec = environments.find(s => s.name === selection);
             const desc = {
                 name: selection,
@@ -99,7 +120,7 @@ export function RuntimeLauncherDialog(props) {
                 desc.params['capabilities'] = ['user_storage'];
             }
             let success = true;
-            if (startRuntime && startRuntime !== 'defer') {
+            if (shouldStartRuntime) {
                 success = false;
                 let availableTrial = 1;
                 let retryDelay = NOT_AVAILABLE_INIT_RETRY;
@@ -178,6 +199,9 @@ export function RuntimeLauncherDialog(props) {
                 success = await startNewKernel();
             }
             if (success && isMounted()) {
+                if (!shouldStartRuntime) {
+                    setWaitingForRuntime(false);
+                }
                 onSubmit(desc);
             }
         }
@@ -191,6 +215,7 @@ export function RuntimeLauncherDialog(props) {
         openExample,
         jupyterLabAdapter,
         timeLimit,
+        shouldStartRuntime,
         isMounted,
     ]);
     const handleUserStorageChange = useCallback((e) => {
@@ -228,8 +253,8 @@ export function RuntimeLauncherDialog(props) {
             {
                 buttonType: 'primary',
                 onClick: handleSubmitRuntime,
-                content: waitingForRuntime ? (_jsx(Spinner, { size: "small" })) : (startRuntime ?? true) ? ('Launch') : ('Assign from the Environment'),
-                disabled: waitingForRuntime || outOfCredits || timeLimit < Number.EPSILON,
+                content: waitingForRuntime ? (_jsx(Spinner, { size: "small" })) : ((submitLabel ?? ((startRuntime ?? true) ? 'Launch' : 'Assign'))),
+                disabled: waitingForRuntime || !selection || outOfCredits,
                 autoFocus: true,
             },
         ], children: _jsxs(Box, { as: "form", onKeyDown: event => {
@@ -244,7 +269,7 @@ export function RuntimeLauncherDialog(props) {
                         ? () => {
                             navigate(USAGE_ROUTE);
                         }
-                        : undefined, disabled: outOfCredits, label: 'Time reservation', max: max, time: timeLimit, burningRate: burningRate, onTimeChange: setTimeLimit, error: outOfCredits ? 'You must add credits to your account.' : undefined })), !configuration.whiteLabel && (_jsxs(FormControl, { layout: "horizontal", children: [_jsxs(FormControl.Label, { id: "user-storage-label", children: ["User storage", _jsx(Tooltip, { text: 'The runtime will be slower to start.', direction: "e", style: { marginLeft: 3 }, children: _jsx(IconButton, { icon: AlertIcon, "aria-label": "", variant: "invisible" }) })] }), _jsx(ToggleSwitch, { checked: userStorage, size: "small", onClick: handleUserStorageChange, "aria-labelledby": "user-storage-label" })] })), _jsxs(FormControl, { sx: { paddingTop: '10px' }, children: [_jsx(FormControl.Label, { children: "Runtime name" }), _jsx(TextInput, { name: "name", value: runtimeName, onChange: handleKernelNameChange, block: true })] }), hasExample &&
+                        : undefined, disabled: outOfCredits, label: 'Time reservation', max: effectiveMaxMinutes, time: timeLimit, burningRate: burningRate, onTimeChange: setTimeLimit, error: outOfCredits ? 'You must add credits to your account.' : undefined })), !configuration.whiteLabel && (_jsxs(FormControl, { layout: "horizontal", children: [_jsxs(FormControl.Label, { id: "user-storage-label", children: ["User storage", _jsx(Tooltip, { text: 'The runtime will be slower to start.', direction: "e", style: { marginLeft: 3 }, children: _jsx(IconButton, { icon: AlertIcon, "aria-label": "", variant: "invisible" }) })] }), _jsx(ToggleSwitch, { checked: userStorage, size: "small", onClick: handleUserStorageChange, "aria-labelledby": "user-storage-label" })] })), _jsxs(FormControl, { sx: { paddingTop: '10px' }, children: [_jsx(FormControl.Label, { children: "Runtime name" }), _jsx(TextInput, { name: "name", value: runtimeName, onChange: handleKernelNameChange, block: true })] }), hasExample &&
                     jupyterLabAdapter?.jupyterLab &&
                     !configuration.whiteLabel && (_jsxs(FormControl, { sx: { paddingTop: '10px' }, children: [_jsx(FormControl.Label, { id: "open-example-label", children: "Open example notebook" }), _jsx(ToggleSwitch, { disabled: !environments.find(spec => spec.name === selection)?.example, checked: openExample, size: "small", onClick: handleSwitchClick, "aria-labelledby": "open-example-label" })] })), error && (_jsx(FlashClosable, { variant: flashLevel, actions: navigate && upgradeSubscription && flashLevel === 'warning' ? (_jsx(Button, { onClick: handleUpgrade, title: 'Upgrade your subscription.', children: "Upgrade" })) : undefined, children: error }))] }) }));
 }

package/lib/components/runtimes/RuntimePickerCell.js

@@ -99,6 +99,6 @@ export function RuntimePickerCell(props) {
     const datalayerMeta = model.getMetadata('datalayer') ?? {};
     return (_jsxs(_Fragment, { children: [_jsx(RuntimePickerBase, { display: "menu", filterRuntime: filterKernel, preference: preference, multiServiceManager: multiServiceManager, runtimeDesc: datalayerMeta.kernel ? datalayerMeta.kernel : undefined, setRuntimeDesc: setSelectedRuntimeDesc, variant: 'cell', preActions: _jsxs(ActionList.Item, { disabled: !multiServiceManager.remote, onSelect: setCell, selected: hasCellRuntime, title: !multiServiceManager.remote
                         ? 'You are not connected with Datalayer.'
-                        : 'Assign a new temporary Runtime on each Cell execution.', children: [_jsx(ActionList.LeadingVisual, { children: _jsx(CloudUploadIcon, {}) }), trans.__('Assign a Cell Runtime')] }), postActions: token || !logIn ? (_jsxs(_Fragment, { children: [RuntimeSnippetsFacade.supports(preference?.language ?? '') && (_jsx(ActionList.Item, { onSelect: openVariableDialog, disabled: !isForeign, title: trans.__('Define variables to transfer between the document kernel and the cell kernel.'), children: trans.__('Define Cell Variables Transfer') })), !configuration.whiteLabel && (_jsx(ActionList.Item, { onSelect: openSnippetDialog, disabled: snippets.length === 0, title: trans.__('Inject a code snippet at the end of the cell.'), children: trans.__('Inject Code Snippet') }))] })) : (_jsx(ActionList.Item, { onSelect: props.logIn, title: 'Connect to the Runtime provider.', children: _jsx(ExternalTokenSilentLogin, { message: "Connect to the Runtime provider" }) })), translator: translator }), isVariableDialogOpen && (_jsx(RuntimeCellVariablesDialog, { model: model, onClose: closeVariableDialog, preference: preference, sessionContext: sessionContext, translator: translator })), isSnippetDialogOpen && (_jsx(SnippetDialog, { language: language, model: model, snippets: snippets, onClose: closeSnippetDialog, markdownParser: markdownParser, sanitizer: sanitizer })), isKernelDialogOpen && (_jsx(RuntimeLauncherDialog, { manager: multiServiceManager.remote, onSubmit: onStartRemote, startRuntime: false, markdownParser: markdownParser, sanitizer: sanitizer }))] }));
+                        : 'Assign a new temporary Runtime on each Cell execution.', children: [_jsx(ActionList.LeadingVisual, { children: _jsx(CloudUploadIcon, {}) }), trans.__('Assign a Cell Runtime')] }), postActions: token || !logIn ? (_jsxs(_Fragment, { children: [RuntimeSnippetsFacade.supports(preference?.language ?? '') && (_jsx(ActionList.Item, { onSelect: openVariableDialog, disabled: !isForeign, title: trans.__('Define variables to transfer between the document kernel and the cell kernel.'), children: trans.__('Define Cell Variables Transfer') })), !configuration.whiteLabel && (_jsx(ActionList.Item, { onSelect: openSnippetDialog, disabled: snippets.length === 0, title: trans.__('Inject a code snippet at the end of the cell.'), children: trans.__('Inject Code Snippet') }))] })) : (_jsx(ActionList.Item, { onSelect: props.logIn, title: 'Connect to the Runtime provider.', children: _jsx(ExternalTokenSilentLogin, { message: "Connect to the Runtime provider" }) })), translator: translator }), isVariableDialogOpen && (_jsx(RuntimeCellVariablesDialog, { model: model, onClose: closeVariableDialog, preference: preference, sessionContext: sessionContext, translator: translator })), isSnippetDialogOpen && (_jsx(SnippetDialog, { language: language, model: model, snippets: snippets, onClose: closeSnippetDialog, markdownParser: markdownParser, sanitizer: sanitizer })), isKernelDialogOpen && (_jsx(RuntimeLauncherDialog, { manager: multiServiceManager.remote, onSubmit: onStartRemote, startRuntime: true, submitLabel: "Assign", markdownParser: markdownParser, sanitizer: sanitizer }))] }));
 }
 export default RuntimePickerCell;

package/lib/components/runtimes/RuntimePickerNotebook.js

@@ -21,9 +21,9 @@ import { RuntimePickerBase } from './RuntimePickerBase.js';
 export function RuntimePickerNotebook(props) {
     const { multiServiceManager, sessionContext, setValue, translator } = props;
     const { configuration } = useCoreStore();
-    const { credits, refreshCredits, token } = useIAMStore();
+    const { credits, refreshCredits, token, user } = useIAMStore();
     const [selectedRuntimeDesc, setSelectedRuntimeDesc] = useState();
-    const [timeLimit, setTimeLimit] = useState(Math.min(credits?.available ?? 0, 10));
+    const [timeLimit, setTimeLimit] = useState(10);
     const [userStorage, setUserStorage] = useState(false);
     const [canTransferFrom, setTransferFrom] = useState(false);
     const [canTransferTo, setTransferTo] = useState(false);
@@ -112,31 +112,96 @@ export function RuntimePickerNotebook(props) {
         setUserStorage(!userStorage);
     }, [userStorage]);
     useEffect(() => {
-        const creditsLimit = selectedRuntimeDesc?.location === 'remote' &&
-            selectedRuntimeDesc.burningRate
-            ? Math.min(timeLimit, MAXIMAL_RUNTIME_TIME_RESERVATION_MINUTES) *
-                selectedRuntimeDesc.burningRate *
+        const resolvedBurningRate = selectedRuntimeDesc?.burningRate ??
+            multiServiceManager.remote?.environments
+                .get()
+                .find(env => env.name === selectedRuntimeDesc?.name)?.burning_rate;
+        const includedRuns = user?.subscription?.usage?.included_runs ??
+            user?.subscription?.included_runs;
+        const currentRuns = user?.subscription?.usage?.current_runs ??
+            user?.subscription?.current_runs ??
+            user?.subscription?.used_runs;
+        const hasKnownRunAllowance = typeof includedRuns === 'number';
+        const hasRemainingRuns = hasKnownRunAllowance &&
+            typeof currentRuns === 'number' &&
+            includedRuns > 0 &&
+            currentRuns < includedRuns;
+        const hasKnownCredits = typeof credits?.available === 'number';
+        const maxMinutes = selectedRuntimeDesc?.location === 'remote' && resolvedBurningRate
+            ? Math.floor((credits?.available ?? 0) / resolvedBurningRate / 60.0)
+            : undefined;
+        const effectiveTimeLimit = selectedRuntimeDesc?.location === 'remote'
+            ? Math.max(1, Math.min(timeLimit, maxMinutes && maxMinutes > 0 ? maxMinutes : 10))
+            : timeLimit;
+        const creditsLimit = selectedRuntimeDesc?.location === 'remote' && resolvedBurningRate
+            ? Math.min(effectiveTimeLimit, MAXIMAL_RUNTIME_TIME_RESERVATION_MINUTES) *
+                resolvedBurningRate *
                 60
             : undefined;
-        setValue(creditsLimit !== 0
-            ? {
-                runtime: selectedRuntimeDesc
-                    ? {
-                        environmentName: ['browser', 'remote'].includes(selectedRuntimeDesc.location)
-                            ? `${selectedRuntimeDesc.location}-${selectedRuntimeDesc.name}`
-                            : selectedRuntimeDesc.name,
-                        id: selectedRuntimeDesc.kernelId,
-                        creditsLimit,
-                        capabilities: userStorage ? ['user_storage'] : undefined,
-                    }
-                    : null,
-                selectedVariables: toTransfer,
+        const requiresRuntimeStart = !!selectedRuntimeDesc && !selectedRuntimeDesc.kernelId;
+        if (requiresRuntimeStart && selectedRuntimeDesc.location === 'remote') {
+            if (!resolvedBurningRate || !Number.isFinite(resolvedBurningRate)) {
+                setValue({ runtime: null, selectedVariables: toTransfer });
+                return;
+            }
+            if (hasKnownCredits &&
+                hasKnownRunAllowance &&
+                !hasRemainingRuns &&
+                (!creditsLimit || creditsLimit <= 0)) {
+                setValue({ runtime: null, selectedVariables: toTransfer });
+                return;
             }
-            : new Error('Credits limit must be strictly positive.'));
-    }, [selectedRuntimeDesc, userStorage, toTransfer, timeLimit]);
+        }
+        setValue({
+            runtime: selectedRuntimeDesc
+                ? {
+                    environmentName: ['browser', 'remote'].includes(selectedRuntimeDesc.location)
+                        ? `${selectedRuntimeDesc.location}-${selectedRuntimeDesc.name}`
+                        : selectedRuntimeDesc.name,
+                    id: selectedRuntimeDesc.kernelId,
+                    creditsLimit,
+                    capabilities: userStorage ? ['user_storage'] : undefined,
+                }
+                : null,
+            selectedVariables: toTransfer,
+        });
+    }, [
+        selectedRuntimeDesc,
+        userStorage,
+        toTransfer,
+        timeLimit,
+        multiServiceManager.remote,
+        credits?.available,
+        user,
+    ]);
     const { kernelPreference: { canStart }, } = sessionContext;
-    const max = Math.floor((credits?.available ?? 0) / (selectedRuntimeDesc?.burningRate ?? -1) / 60.0);
-    const outOfCredits = !credits?.available || max < Number.EPSILON;
+    const resolvedBurningRate = selectedRuntimeDesc?.burningRate ??
+        multiServiceManager.remote?.environments
+            .get()
+            .find(env => env.name === selectedRuntimeDesc?.name)?.burning_rate;
+    const maxFromCredits = resolvedBurningRate
+        ? Math.floor((credits?.available ?? 0) / resolvedBurningRate / 60.0)
+        : -1;
+    const includedRuns = user?.subscription?.usage?.included_runs ??
+        user?.subscription?.included_runs;
+    const currentRuns = user?.subscription?.usage?.current_runs ??
+        user?.subscription?.current_runs ??
+        user?.subscription?.used_runs;
+    const hasKnownRunAllowance = typeof includedRuns === 'number';
+    const hasRemainingRuns = hasKnownRunAllowance &&
+        typeof currentRuns === 'number' &&
+        includedRuns > 0 &&
+        currentRuns < includedRuns;
+    const hasKnownCredits = typeof credits?.available === 'number';
+    const effectiveMaxMinutes = selectedRuntimeDesc?.location === 'remote'
+        ? hasKnownCredits && hasKnownRunAllowance && !hasRemainingRuns
+            ? Math.max(1, maxFromCredits)
+            : Math.max(10, maxFromCredits > 0 ? maxFromCredits : 0)
+        : Math.max(1, maxFromCredits);
+    const outOfCredits = hasKnownCredits &&
+        hasKnownRunAllowance &&
+        !hasRemainingRuns &&
+        maxFromCredits < Number.EPSILON;
     return (_jsxs(Box, { as: "form", className: "dla-Runtimes-picker", children: [_jsx(Box, { sx: { padding: 'var(--stack-padding-condensed) 0' }, children: _jsx(RuntimePickerBase, { display: "radio", disabled: canStart === false, preference: {
                         id: sessionContext.session?.id,
                         kernelDisplayName: sessionContext.kernelPreference.shouldStart
@@ -156,7 +221,7 @@ export function RuntimePickerNotebook(props) {
                   </Button>
                   */
                     _jsx(_Fragment, {})) : (_jsx(ActionList.Item, { onSelect: props.logIn, title: 'Connect to Runtime provider.', children: _jsx(ExternalTokenSilentLogin, { message: "Connect to the Runtime provider" }) })) }) }), !selectedRuntimeDesc?.kernelId &&
-                selectedRuntimeDesc?.location === 'remote' && (_jsxs(_Fragment, { children: [_jsx(RuntimeReservationControl, { disabled: outOfCredits || selectedRuntimeDesc?.location !== 'remote', label: 'Time reservation', max: max < 0 ? 1 : max, time: timeLimit, onTimeChange: setTimeLimit, error: outOfCredits && max >= 0
+                selectedRuntimeDesc?.location === 'remote' && (_jsxs(_Fragment, { children: [_jsx(RuntimeReservationControl, { disabled: outOfCredits || selectedRuntimeDesc?.location !== 'remote', label: 'Time reservation', max: effectiveMaxMinutes, time: timeLimit, onTimeChange: setTimeLimit, error: outOfCredits && maxFromCredits >= 0
                             ? 'You must add credits to your account.'
                             : timeLimit === 0
                                 ? 'You must set a time limit.'

package/lib/components/runtimes/RuntimeReservationControl.js

@@ -18,7 +18,18 @@ export const MAXIMAL_RUNTIME_TIME_RESERVATION_MINUTES = 24 * 60;
  */
 export function RuntimeReservationControl(props) {
     const { addCredits, burningRate, disabled, error, label, max: maxProps, onTimeChange, time, } = props;
-    const max = Math.min(maxProps, MAXIMAL_RUNTIME_TIME_RESERVATION_MINUTES);
+    const max = Math.max(1, Math.min(maxProps, MAXIMAL_RUNTIME_TIME_RESERVATION_MINUTES));
+    const displayedTime = Number.isFinite(time)
+        ? Math.min(max, Math.max(1, time))
+        : 1;
+    const handleTimeChange = (valueOrEvent) => {
+        const rawValue = typeof valueOrEvent === 'number'
+            ? valueOrEvent
+            : parseFloat(valueOrEvent?.target?.value);
+        if (Number.isFinite(rawValue)) {
+            onTimeChange(Math.min(max, Math.max(1, rawValue)));
+        }
+    };
     // Temporary workaround to not show disabled components.
     const hidden = disabled;
     return !hidden ? (_jsxs(FormControl, { disabled: disabled, sx: { paddingBottom: 'var(--stack-padding-condensed)' }, children: [_jsx(FormControl.Label, { children: label }), _jsxs(Box, { style: {
@@ -27,7 +38,5 @@ export function RuntimeReservationControl(props) {
                     gridTemplateColumns: 'max-content 1fr max-content max-content',
                     gridGap: 'var(--stack-gap-condensed)',
                     width: '100%',
-                }, children: [_jsx(Slider, { step: 1, min: 1, max: max, value: time, onChange: onTimeChange, disabled: disabled, label: "", displayValue: false }), _jsx(TextInput, { type: "number", step: "1", min: "1", max: max, disabled: disabled, value: Math.min(max, time).toFixed(2), onChange: event => {
-                            onTimeChange(parseFloat(event.target.value));
-                        } }), (max === 0 || max > Number.EPSILON) && (_jsxs(_Fragment, { children: [_jsxs(Text, { children: ["out of ", maxProps, " available minutes"] }), addCredits && (_jsx(IconButton, { icon: PlusIcon, "aria-label": "Add credits", onClick: () => addCredits() }))] }))] }), _jsxs(FormControl.Caption, { children: ["Maximum execution time that can be consumed by the runtime. It must be less than ", (MAXIMAL_RUNTIME_TIME_RESERVATION_MINUTES / 60).toFixed(0), ' ', "hours.", burningRate && (_jsxs(_Fragment, { children: [_jsx("br", {}), `With the current value, the runtime execution will consume at most ${(time * burningRate * 60).toFixed(2)} credits.`] }))] }), error && (_jsx(FormControl.Validation, { variant: "error", children: error }))] })) : (_jsx(_Fragment, {}));
+                }, children: [_jsx(Slider, { step: 1, min: 1, max: max, value: displayedTime, onChange: handleTimeChange, disabled: disabled, label: "", displayValue: false }), _jsx(TextInput, { type: "number", step: "1", min: "1", max: max, disabled: disabled, value: displayedTime.toFixed(2), onChange: handleTimeChange }), (max === 0 || max > Number.EPSILON) && (_jsxs(_Fragment, { children: [_jsxs(Text, { children: ["out of ", maxProps, " available minutes"] }), addCredits && (_jsx(IconButton, { icon: PlusIcon, "aria-label": "Add credits", onClick: () => addCredits() }))] }))] }), _jsxs(FormControl.Caption, { children: ["Maximum execution time that can be consumed by the runtime. It must be less than ", (MAXIMAL_RUNTIME_TIME_RESERVATION_MINUTES / 60).toFixed(0), ' ', "hours.", burningRate && (_jsxs(_Fragment, { children: [_jsx("br", {}), `With the current value, the runtime execution will consume at most ${(time * burningRate * 60).toFixed(2)} credits.`] }))] }), error && (_jsx(FormControl.Validation, { variant: "error", children: error }))] })) : (_jsx(_Fragment, {}));
 }

package/lib/components/sharing/ShareAccessComponent.d.ts

@@ -0,0 +1,18 @@
+export type ItemAccessLevel = 'view' | 'update' | 'execute';
+type PrincipalKind = 'user' | 'team' | 'organization';
+export type ShareAccessComponentProps = {
+    isOpen: boolean;
+    requestUrl?: string;
+    resourceLabel: string;
+    resourceName?: string;
+    resourceDescription?: string;
+    onSharingAccessRestrictedChange?: (restricted: boolean, message?: string) => void;
+    defaultAccessLevel?: ItemAccessLevel;
+    principalKinds?: readonly PrincipalKind[];
+    displayMode?: 'dialog' | 'inline';
+    onClose: () => void;
+};
+export declare function ShareAccessComponent({ isOpen, requestUrl, resourceLabel, resourceName, resourceDescription: _resourceDescription, onSharingAccessRestrictedChange, defaultAccessLevel, principalKinds, displayMode, onClose, }: ShareAccessComponentProps): JSX.Element | null;
+export default ShareAccessComponent;
+export declare const ShareAccessDialog: typeof ShareAccessComponent;
+export type ShareAccessDialogProps = ShareAccessComponentProps;