@micha.bigler/ui-core-micha 3.14.3 → 4.0.0

package/src/notifications/api.js

@@ -1,55 +0,0 @@
-import apiClient from '../auth/apiClient';
-
-const PREFERENCES_URL = '/api/notifications/preferences/';
-const PUSH_SUBSCRIPTION_URL = `${PREFERENCES_URL}push-subscription/`;
-const SUBSCRIPTIONS_URL = `${PREFERENCES_URL}subscriptions/`;
-
-export async function getNotificationPreferences() {
-  const response = await apiClient.get(PREFERENCES_URL);
-  return response.data;
-}
-
-export async function patchNotificationPreferences(patch) {
-  const response = await apiClient.patch(PREFERENCES_URL, patch);
-  return response.data;
-}
-
-export async function setNotificationCategorySubscription(category, subscribed) {
-  const response = await apiClient.post(SUBSCRIPTIONS_URL, { category, subscribed });
-  return response.data;
-}
-
-export async function getVapidPublicKey() {
-  const response = await apiClient.get(`${PREFERENCES_URL}vapid-public-key/`);
-  return response.data?.vapidPublicKey;
-}
-
-export async function listPushSubscriptions() {
-  const response = await apiClient.get(PUSH_SUBSCRIPTION_URL);
-  return response.data;
-}
-
-export async function savePushSubscription(subscription, ua) {
-  const response = await apiClient.post(PUSH_SUBSCRIPTION_URL, { subscription, ua });
-  return response.data;
-}
-
-export async function removePushSubscription(subscriptionIdentifier) {
-  const response = await apiClient.delete(PUSH_SUBSCRIPTION_URL, { data: subscriptionIdentifier });
-  return response.data;
-}
-
-export function urlBase64ToUint8Array(base64String) {
-  const padding = '='.repeat((4 - (base64String.length % 4)) % 4);
-  const base64 = (base64String + padding).replace(/-/g, '+').replace(/_/g, '/');
-  const decoder = typeof window !== 'undefined' && typeof window.atob === 'function'
-    ? window.atob
-    : typeof atob === 'function'
-      ? atob
-      : null;
-
-  if (!decoder) throw new Error('Base64 decoding is unavailable in this environment.');
-
-  const raw = decoder(base64);
-  return Uint8Array.from([...raw].map((character) => character.charCodeAt(0)));
-}

package/src/notifications/feedApi.js

@@ -1,18 +0,0 @@
-import apiClient from '../auth/apiClient';
-
-export async function getNotificationFeed({ status } = {}) {
-  const response = await apiClient.get('/api/notifications/feed/', {
-    params: status ? { status } : undefined,
-  });
-  return response.data;
-}
-
-export async function getUnreadCount() {
-  const response = await apiClient.get('/api/notifications/feed/unread-count/');
-  return response.data;
-}
-
-export async function markNotifications({ action, ids }) {
-  const response = await apiClient.post('/api/notifications/feed/mark/', { action, ids });
-  return response.data;
-}

package/src/notifications/realtime.jsx

@@ -1,138 +0,0 @@
-import { createContext, useCallback, useContext, useEffect, useRef } from 'react';
-
-const INITIAL_BACKOFF_MS = 1_000;
-const MAX_BACKOFF_MS = 30_000;
-
-// Envelope discriminator for the notifications domain. A message with no
-// `envelope` field (pre-NOTIF-13 dcm) is treated as this default so an
-// un-bumped backend keeps working unchanged (backward-compat).
-export const DEFAULT_ENVELOPE = 'notification';
-
-const RealtimeContext = createContext(null);
-
-export function useRealtime() {
-  const context = useContext(RealtimeContext);
-  if (!context) {
-    throw new Error('useRealtime must be used within a NotificationsProvider');
-  }
-  return context;
-}
-
-export { RealtimeContext };
-
-/**
- * Owns the single WebSocket connection and an envelope-keyed subscriber
- * registry. Internal — consumed only by NotificationsProvider, which
- * re-exposes `subscribe` via RealtimeContext so useRealtime() works without
- * a separate provider apps have to mount.
- *
- * Backoff, reconnect, and cleanup semantics are unchanged from the prior
- * single-purpose socket owner. `active`/`wsUrl` are primitives, so the
- * effect does not re-run (and does not reconnect) on unrelated re-renders.
- */
-export function useRealtimeCore({ active, wsUrl }) {
-  const socketRef = useRef(null);
-  const subscribersRef = useRef(new Map());
-  const reconnectSubscribersRef = useRef(new Set());
-
-  const subscribe = useCallback((envelope, handler) => {
-    const subscribers = subscribersRef.current;
-    if (!subscribers.has(envelope)) {
-      subscribers.set(envelope, new Set());
-    }
-    subscribers.get(envelope).add(handler);
-    return () => {
-      const handlers = subscribers.get(envelope);
-      if (!handlers) return;
-      handlers.delete(handler);
-      if (handlers.size === 0) {
-        subscribers.delete(envelope);
-      }
-    };
-  }, []);
-
-  // Additive lifecycle signal for domains whose REST projections must be
-  // refreshed after the one shared transport reconnects. It deliberately does
-  // not alter the socket/backoff ownership or the envelope subscriber API.
-  const onReconnect = useCallback((handler) => {
-    reconnectSubscribersRef.current.add(handler);
-    return () => reconnectSubscribersRef.current.delete(handler);
-  }, []);
-
-  useEffect(() => {
-    if (!active) return undefined;
-
-    let isActive = true;
-    let reconnectTimer = null;
-    let backoffMs = INITIAL_BACKOFF_MS;
-    let hasConnected = false;
-
-    const handleMessage = (event) => {
-      let data;
-      try {
-        data = JSON.parse(event.data);
-      } catch {
-        return;
-      }
-
-      const envelope = data.envelope ?? DEFAULT_ENVELOPE;
-      const handlers = subscribersRef.current.get(envelope);
-      if (!handlers || handlers.size === 0) return;
-      handlers.forEach((handler) => {
-        try {
-          handler(data);
-        } catch (error) {
-          console.error('Realtime subscriber error', error);
-        }
-      });
-    };
-
-    const connect = () => {
-      if (!isActive || socketRef.current) return;
-
-      const socket = new WebSocket(wsUrl);
-      socketRef.current = socket;
-
-      socket.onopen = () => {
-        backoffMs = INITIAL_BACKOFF_MS;
-        if (hasConnected) {
-          reconnectSubscribersRef.current.forEach((handler) => {
-            try {
-              handler();
-            } catch (error) {
-              console.error('Realtime reconnect subscriber error', error);
-            }
-          });
-        }
-        hasConnected = true;
-      };
-      socket.onmessage = handleMessage;
-      socket.onerror = () => {
-        socket.close();
-      };
-      socket.onclose = () => {
-        if (socketRef.current === socket) {
-          socketRef.current = null;
-        }
-        if (!isActive || reconnectTimer) return;
-        reconnectTimer = setTimeout(() => {
-          reconnectTimer = null;
-          connect();
-        }, backoffMs);
-        backoffMs = Math.min(backoffMs * 2, MAX_BACKOFF_MS);
-      };
-    };
-
-    connect();
-
-    return () => {
-      isActive = false;
-      clearTimeout(reconnectTimer);
-      const socket = socketRef.current;
-      socketRef.current = null;
-      if (socket) socket.close();
-    };
-  }, [active, wsUrl]);
-
-  return { subscribe, onReconnect };
-}

package/src/notifications/serviceWorker/sw.js

@@ -1,50 +0,0 @@
-/*
- * Canonical service-worker source. Copy this file verbatim to each consuming
- * application's public/sw.js so it is served from that application's origin root.
- */
-const resolveSameOriginUrl = (url) => {
-  try {
-    const resolvedUrl = new URL(url || '/', self.location.origin);
-    if (resolvedUrl.origin !== self.location.origin) return '/';
-
-    return `${resolvedUrl.pathname}${resolvedUrl.search}${resolvedUrl.hash}`;
-  } catch {
-    return '/';
-  }
-};
-
-self.addEventListener('push', (event) => {
-  if (!event.data) return;
-
-  let payload;
-  try {
-    payload = event.data.json();
-  } catch {
-    payload = { body: event.data.text() };
-  }
-
-  const options = {
-    body: payload.body || '',
-    data: { url: resolveSameOriginUrl(payload.url) },
-  };
-  if (payload.icon) options.icon = payload.icon;
-  if (payload.badge) options.badge = payload.badge;
-
-  event.waitUntil(self.registration.showNotification(payload.title || 'Notification', options));
-});
-
-self.addEventListener('notificationclick', (event) => {
-  event.notification.close();
-  const url = resolveSameOriginUrl(event.notification.data?.url);
-
-  event.waitUntil(
-    clients.matchAll({ type: 'window', includeUncontrolled: true }).then((clientList) => {
-      for (const client of clientList) {
-        if (client.url.includes(self.location.origin) && 'focus' in client) {
-          return Promise.resolve(client.navigate(url)).then(() => client.focus());
-        }
-      }
-      return clients.openWindow ? clients.openWindow(url) : undefined;
-    }),
-  );
-});

package/src/onboarding/OnboardingProvider.jsx

@@ -1,326 +0,0 @@
-import React, {
-  createContext,
-  useCallback,
-  useContext,
-  useEffect,
-  useMemo,
-  useRef,
-  useState,
-} from 'react';
-import { AuthContext } from '../auth/AuthContext';
-import { getNotificationPreferences } from '../notifications/api';
-import { getOnboardingStepConfig } from './api';
-import { selectActiveSteps } from './stepSelection';
-import CookieConsentStep from './steps/CookieConsentStep';
-import CompleteNameStep from './steps/CompleteNameStep';
-import BrowserPushStep from './steps/BrowserPushStep';
-import PwaInstallStep from './steps/PwaInstallStep';
-
-export const UNIVERSAL_STEP_DESCRIPTORS = [
-  {
-    id: 'cookie_consent',
-    condition: (ctx) => Boolean(ctx.user && !ctx.user.accepted_privacy_statement),
-    blocking: true,
-    skipable: false,
-    persistDismissed: false,
-    titleKey: 'Onboarding.PRIVACY_COOKIES_TITLE',
-    Component: CookieConsentStep,
-  },
-  {
-    id: 'complete_name',
-    condition: (ctx) => Boolean(ctx.user && (!ctx.user.first_name?.trim() || !ctx.user.last_name?.trim())),
-    blocking: true,
-    skipable: false,
-    persistDismissed: false,
-    titleKey: 'Onboarding.COMPLETE_NAME_TITLE',
-    Component: CompleteNameStep,
-  },
-  {
-    id: 'browser_push',
-    condition: (ctx) => {
-      const { nagUntil = 'any-channel', showOnce = false } = ctx.browserPush || {};
-      if (showOnce && ctx.seenSteps?.has('browser_push')) return false;
-      if (nagUntil === 'off') return false;
-      const supported = ctx.pushState?.supported;
-      if (!supported) return !ctx.emailOptedIn;
-      if (nagUntil === 'all-channels') return !ctx.pushState.subscribed || !ctx.emailOptedIn;
-      return !ctx.pushState.subscribed && !ctx.emailOptedIn; // 'any-channel' (default)
-    },
-    blocking: false,
-    skipable: true,
-    persistDismissed: true,
-    titleKey: 'Onboarding.NOTIFICATIONS_TITLE',
-    Component: BrowserPushStep,
-  },
-  {
-    id: 'pwa_install',
-    // App-level opt-in (ctx.pwaInstallEnabled) gates this on top of device
-    // capability — a step being "universal" in the library means available
-    // to every app, not automatically shown by every app. Apps that haven't
-    // verified their PWA manifest/icons are actually installable must not
-    // pass pwaInstallEnabled, or this would show an iOS "Add to Home Screen"
-    // hint for an app that isn't really installable.
-    condition: (ctx) => Boolean(
-      ctx.pwaInstallEnabled
-      && !ctx.pwaInstall?.isStandalone
-      && (Boolean(ctx.pwaInstall?.deferredPrompt) || Boolean(ctx.pwaInstall?.isIos)),
-    ),
-    blocking: false,
-    skipable: true,
-    persistDismissed: true,
-    titleKey: 'Onboarding.PWA_INSTALL_TITLE',
-    Component: PwaInstallStep,
-  },
-];
-
-export const OnboardingContext = createContext(null);
-
-export function useOnboarding() {
-  return useContext(OnboardingContext);
-}
-
-function loadDismissedSteps() {
-  if (typeof window === 'undefined') return new Set();
-  try {
-    return new Set(JSON.parse(window.localStorage.getItem('onboarding_dismissed')) || []);
-  } catch {
-    return new Set();
-  }
-}
-
-function loadSeenSteps() {
-  if (typeof window === 'undefined') return new Set();
-  try {
-    return new Set(JSON.parse(window.localStorage.getItem('onboarding_seen')) || []);
-  } catch {
-    return new Set();
-  }
-}
-
-function persistSeenStep(id) {
-  if (typeof window === 'undefined') return;
-  try {
-    const seenSteps = loadSeenSteps();
-    seenSteps.add(id);
-    window.localStorage.setItem('onboarding_seen', JSON.stringify([...seenSteps]));
-  } catch {
-    // Persistence is optional; the current session remains unaffected.
-  }
-}
-
-function getInitialPushState() {
-  const supported = typeof navigator !== 'undefined'
-    && typeof window !== 'undefined'
-    && 'serviceWorker' in navigator
-    && 'PushManager' in window;
-  return supported ? null : { supported: false, subscribed: false };
-}
-
-function getInitialPwaInstallState() {
-  if (typeof window === 'undefined' || typeof navigator === 'undefined') {
-    return { isStandalone: false, isIos: false, deferredPrompt: null };
-  }
-  const isStandalone = Boolean(
-    window.matchMedia?.('(display-mode: standalone)').matches || navigator.standalone,
-  );
-  // iPadOS 13+ reports a desktop Safari/Mac user agent by default, so the
-  // classic /ipad/i UA sniff misses it — the standard workaround is
-  // detecting touch support on a reported Mac platform (real Macs report
-  // maxTouchPoints 0).
-  const isIos = /iphone|ipad|ipod/i.test(navigator.userAgent || '')
-    || (navigator.platform === 'MacIntel' && navigator.maxTouchPoints > 1);
-  return { isStandalone, isIos, deferredPrompt: null };
-}
-
-// Stable empty-object default — an inline `{}` default would create a new
-// reference every render, invalidating the `ctx` memo below for every
-// consumer even when no extraContext is passed.
-const EMPTY_EXTRA_CONTEXT = {};
-const EMPTY_BROWSER_PUSH = {};
-
-export function OnboardingProvider({
-  children,
-  extraSteps = [],
-  extraContext = EMPTY_EXTRA_CONTEXT,
-  pwaInstallEnabled = false,
-  browserPush = EMPTY_BROWSER_PUSH,
-}) {
-  const { user } = useContext(AuthContext);
-  const [configMap, setConfigMap] = useState({});
-  const [configLoaded, setConfigLoaded] = useState(false);
-  const [pushState, setPushState] = useState(getInitialPushState);
-  const [emailOptedIn, setEmailOptedIn] = useState(false);
-  const [pwaInstall, setPwaInstall] = useState(getInitialPwaInstallState);
-  const [dismissedSet, setDismissedSet] = useState(loadDismissedSteps);
-  const seenAtMountRef = useRef(loadSeenSteps());
-
-  const resolvedBrowserPush = useMemo(
-    () => ({ nagUntil: 'any-channel', showOnce: false, ...browserPush }),
-    [browserPush],
-  );
-
-  const descriptors = useMemo(
-    () => [...UNIVERSAL_STEP_DESCRIPTORS, ...extraSteps],
-    [extraSteps],
-  );
-
-  useEffect(() => {
-    let cancelled = false;
-    if (!user) {
-      setConfigMap({});
-      setConfigLoaded(false);
-      return undefined;
-    }
-
-    getOnboardingStepConfig()
-      .then((data) => {
-        if (cancelled) return;
-        const nextConfigMap = {};
-        (data || []).forEach((item) => { nextConfigMap[item.key] = item.enabled; });
-        setConfigMap(nextConfigMap);
-      })
-      .catch(() => {
-        if (!cancelled) setConfigMap({});
-      })
-      .finally(() => {
-        if (!cancelled) setConfigLoaded(true);
-      });
-
-    return () => { cancelled = true; };
-  }, [user]);
-
-  useEffect(() => {
-    let cancelled = false;
-    if (typeof navigator === 'undefined' || typeof window === 'undefined'
-      || !('serviceWorker' in navigator) || !('PushManager' in window)) {
-      setPushState({ supported: false, subscribed: false });
-      return undefined;
-    }
-
-    navigator.serviceWorker.ready
-      .then((registration) => registration.pushManager.getSubscription())
-      .then((subscription) => {
-        if (!cancelled) setPushState({ supported: true, subscribed: Boolean(subscription) });
-      })
-      .catch(() => {
-        if (!cancelled) setPushState({ supported: true, subscribed: false });
-      });
-
-    return () => { cancelled = true; };
-  }, []);
-
-  // Capture beforeinstallprompt as early as possible (at provider mount, not
-  // when the wizard step happens to render) — Chrome fires it once, early,
-  // and calling preventDefault() late means losing the deferred prompt
-  // reference for good. Gated behind pwaInstallEnabled: calling
-  // preventDefault() unconditionally would suppress the browser's own native
-  // install UI for every app using this library, even ones that never opted
-  // in and have no replacement UI to show instead.
-  useEffect(() => {
-    if (typeof window === 'undefined' || !pwaInstallEnabled) return undefined;
-
-    const mediaQuery = window.matchMedia?.('(display-mode: standalone)');
-
-    const handleDisplayModeChange = (event) => {
-      if (event.matches) setPwaInstall((prev) => ({ ...prev, isStandalone: true }));
-    };
-    const handleBeforeInstallPrompt = (event) => {
-      event.preventDefault();
-      setPwaInstall((prev) => ({ ...prev, deferredPrompt: event }));
-    };
-    const handleAppInstalled = () => {
-      setPwaInstall((prev) => ({ ...prev, isStandalone: true, deferredPrompt: null }));
-    };
-
-    if (mediaQuery?.addEventListener) {
-      mediaQuery.addEventListener('change', handleDisplayModeChange);
-    } else if (mediaQuery?.addListener) {
-      mediaQuery.addListener(handleDisplayModeChange);
-    }
-    window.addEventListener('beforeinstallprompt', handleBeforeInstallPrompt);
-    window.addEventListener('appinstalled', handleAppInstalled);
-
-    return () => {
-      if (mediaQuery?.removeEventListener) {
-        mediaQuery.removeEventListener('change', handleDisplayModeChange);
-      } else if (mediaQuery?.removeListener) {
-        mediaQuery.removeListener(handleDisplayModeChange);
-      }
-      window.removeEventListener('beforeinstallprompt', handleBeforeInstallPrompt);
-      window.removeEventListener('appinstalled', handleAppInstalled);
-    };
-  }, [pwaInstallEnabled]);
-
-  useEffect(() => {
-    let cancelled = false;
-    if (!user) {
-      setEmailOptedIn(false);
-      return undefined;
-    }
-
-    setEmailOptedIn(false);
-    getNotificationPreferences()
-      .then((data) => {
-        if (!cancelled) setEmailOptedIn(Boolean(data?.email_opt_in));
-      })
-      .catch(() => {
-        if (!cancelled) setEmailOptedIn(false);
-      });
-
-    return () => { cancelled = true; };
-  }, [user]);
-
-  const dismissStep = useCallback((id) => {
-    setDismissedSet((previous) => {
-      const next = new Set(previous);
-      next.add(id);
-      if (typeof window !== 'undefined') {
-        try {
-          window.localStorage.setItem('onboarding_dismissed', JSON.stringify([...next]));
-        } catch {
-          // Persistence is optional; the in-memory dismissal still applies.
-        }
-      }
-      return next;
-    });
-  }, []);
-
-  const markStepSeen = useCallback((id) => {
-    persistSeenStep(id);
-  }, []);
-
-  // extraContext is spread last: duplicate core keys intentionally override core values, so apps should use distinct names.
-  const ctx = useMemo(
-    () => ({
-      user,
-      pushState,
-      emailOptedIn,
-      pwaInstall,
-      pwaInstallEnabled,
-      browserPush: resolvedBrowserPush,
-      seenSteps: seenAtMountRef.current,
-      ...extraContext,
-    }),
-    [
-      user,
-      pushState,
-      emailOptedIn,
-      pwaInstall,
-      pwaInstallEnabled,
-      resolvedBrowserPush,
-      seenAtMountRef.current,
-      extraContext,
-    ],
-  );
-  const activeSteps = useMemo(() => {
-    if (!configLoaded || !user) return [];
-    return selectActiveSteps(descriptors, configMap, ctx, dismissedSet);
-  }, [configLoaded, user, descriptors, configMap, ctx, dismissedSet]);
-
-  const value = useMemo(
-    () => ({ activeSteps, dismissStep, markStepSeen, ctx, configMap, setConfigMap }),
-    [activeSteps, dismissStep, markStepSeen, ctx, configMap],
-  );
-
-  return <OnboardingContext.Provider value={value}>{children}</OnboardingContext.Provider>;
-}

package/src/onboarding/OnboardingWizard.jsx

@@ -1,61 +0,0 @@
-import React, { useContext, useEffect, useRef, useState } from 'react';
-import { AuthContext } from '../auth/AuthContext';
-import { useOnboarding } from './OnboardingProvider';
-import { WizardDialogShell } from './WizardDialogShell';
-
-export function OnboardingWizard() {
-  const onboarding = useOnboarding();
-  const authContext = useContext(AuthContext);
-  const [sessionDismissed, setSessionDismissed] = useState(() => new Set());
-  const totalRef = useRef(null);
-  const [completed, setCompleted] = useState(0);
-  const activeSteps = onboarding?.activeSteps || [];
-  const visibleSteps = activeSteps.filter((step) => !sessionDismissed.has(step.id));
-  const currentStep = visibleSteps[0];
-
-  useEffect(() => {
-    if (visibleSteps.length > 0 && totalRef.current === null) {
-      totalRef.current = visibleSteps.length;
-      setCompleted(0);
-    }
-    if (visibleSteps.length === 0) {
-      totalRef.current = null;
-      setCompleted(0);
-    }
-  }, [visibleSteps.length]);
-
-  useEffect(() => {
-    if (onboarding && currentStep) onboarding.markStepSeen(currentStep.id);
-  }, [onboarding, currentStep?.id]);
-
-  if (!onboarding || visibleSteps.length === 0) return null;
-
-  const { dismissStep, ctx } = onboarding;
-  const total = totalRef.current || visibleSteps.length;
-
-  const completeCurrentStep = () => {
-    setSessionDismissed((previous) => new Set([...previous, currentStep.id]));
-    setCompleted((count) => count + 1);
-    authContext?.refreshUser?.()?.catch(() => {
-      // Best-effort refresh; the step itself already persisted successfully.
-    });
-  };
-
-  const dismissCurrentStep = () => {
-    if (currentStep.persistDismissed) dismissStep(currentStep.id);
-    completeCurrentStep();
-  };
-
-  return (
-    <WizardDialogShell
-      step={currentStep}
-      stepIndex={completed}
-      total={total}
-      onComplete={completeCurrentStep}
-      onDismiss={dismissCurrentStep}
-      ctx={ctx}
-    />
-  );
-}
-
-export default OnboardingWizard;

package/src/onboarding/WizardDialogShell.jsx

@@ -1,51 +0,0 @@
-import React from 'react';
-import { useTranslation } from 'react-i18next';
-import Box from '@mui/material/Box';
-import Dialog from '@mui/material/Dialog';
-import DialogContent from '@mui/material/DialogContent';
-import DialogTitle from '@mui/material/DialogTitle';
-import LinearProgress from '@mui/material/LinearProgress';
-import Typography from '@mui/material/Typography';
-
-/**
- * Presentational dialog shell shared by OnboardingWizard and the popup
- * notification surface (NOTIF-12). Owns only the dialog frame, the
- * counter/progress header, and the onComplete/onDismiss/ctx child contract —
- * step selection, dismissal persistence, and any progress store stay with
- * the caller.
- */
-export function WizardDialogShell({ step, stepIndex, total, onComplete, onDismiss, ctx, title }) {
-  const { t } = useTranslation();
-  const progress = total > 1 ? Math.round((stepIndex / total) * 100) : 0;
-  const StepComponent = step.Component;
-  // `title` lets a non-onboarding caller (e.g. the popup surface) supply its
-  // own header instead of the onboarding-specific step counter/"Setup" copy.
-  // Omitted by OnboardingWizard, so its header text is unchanged.
-  const headerLabel = title ?? (total > 1
-    ? t('Onboarding.STEP_COUNTER', { current: stepIndex + 1, total })
-    : t('Onboarding.SETUP'));
-
-  return (
-    <Dialog
-      open
-      fullWidth
-      maxWidth="sm"
-      disableEscapeKeyDown={step.blocking}
-      onClose={step.blocking ? undefined : onDismiss}
-    >
-      <DialogTitle sx={{ pb: 0 }}>
-        <Box sx={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between' }}>
-          <Typography variant="subtitle2" color="text.secondary">
-            {headerLabel}
-          </Typography>
-        </Box>
-        {total > 1 && <LinearProgress variant="determinate" value={progress} sx={{ mt: 1, borderRadius: 1 }} />}
-      </DialogTitle>
-      <DialogContent sx={{ pt: 2 }}>
-        <StepComponent onComplete={onComplete} onDismiss={onDismiss} ctx={ctx} />
-      </DialogContent>
-    </Dialog>
-  );
-}
-
-export default WizardDialogShell;