@micha.bigler/ui-core-micha 2.8.1 → 2.8.2

package/dist/onboarding/OnboardingProvider.js

@@ -61,7 +61,11 @@ function getInitialPushState() {
         && 'PushManager' in window;
     return supported ? null : { supported: false, subscribed: false };
 }
-export function OnboardingProvider({ children, extraSteps = [] }) {
+// 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 = {};
+export function OnboardingProvider({ children, extraSteps = [], extraContext = EMPTY_EXTRA_CONTEXT }) {
     const { user } = useContext(AuthContext);
     const [configMap, setConfigMap] = useState({});
     const [configLoaded, setConfigLoaded] = useState(false);
@@ -146,7 +150,8 @@ export function OnboardingProvider({ children, extraSteps = [] }) {
             return next;
         });
     }, []);
-    const ctx = useMemo(() => ({ user, pushState, emailOptedIn }), [user, pushState, emailOptedIn]);
+    // extraContext is spread last: duplicate core keys intentionally override core values, so apps should use distinct names.
+    const ctx = useMemo(() => (Object.assign({ user, pushState, emailOptedIn }, extraContext)), [user, pushState, emailOptedIn, extraContext]);
     const activeSteps = useMemo(() => {
         if (!configLoaded || !user)
             return [];

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@micha.bigler/ui-core-micha",
-  "version": "2.8.1",
+  "version": "2.8.2",
   "main": "dist/index.js",
   "module": "dist/index.js",
   "repository": {

package/src/onboarding/OnboardingProvider.jsx

@@ -70,7 +70,12 @@ function getInitialPushState() {
   return supported ? null : { supported: false, subscribed: false };
 }
 
-export function OnboardingProvider({ children, extraSteps = [] }) {
+// 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 = {};
+
+export function OnboardingProvider({ children, extraSteps = [], extraContext = EMPTY_EXTRA_CONTEXT }) {
   const { user } = useContext(AuthContext);
   const [configMap, setConfigMap] = useState({});
   const [configLoaded, setConfigLoaded] = useState(false);
@@ -162,7 +167,11 @@ export function OnboardingProvider({ children, extraSteps = [] }) {
     });
   }, []);
 
-  const ctx = useMemo(() => ({ user, pushState, emailOptedIn }), [user, pushState, emailOptedIn]);
+  // extraContext is spread last: duplicate core keys intentionally override core values, so apps should use distinct names.
+  const ctx = useMemo(
+    () => ({ user, pushState, emailOptedIn, ...extraContext }),
+    [user, pushState, emailOptedIn, extraContext],
+  );
   const activeSteps = useMemo(() => {
     if (!configLoaded || !user) return [];
     return selectActiveSteps(descriptors, configMap, ctx, dismissedSet);

package/tests/OnboardingProvider.test.jsx

@@ -21,10 +21,22 @@ function Probe() {
   return <span data-testid="email-opted-in">{String(onboarding?.ctx.emailOptedIn)}</span>;
 }
 
-function renderProvider() {
+function ActiveStepsProbe() {
+  const onboarding = useOnboarding();
+  return <span data-testid="active-steps">{onboarding?.activeSteps.map((step) => step.id).join(',')}</span>;
+}
+
+function renderProvider({ extraContext, extraSteps, children = <Probe /> } = {}) {
   return render(
-    <AuthContext.Provider value={{ user: { id: 1 } }}>
-      <OnboardingProvider><Probe /></OnboardingProvider>
+    <AuthContext.Provider value={{
+      user: {
+        id: 1,
+        accepted_privacy_statement: true,
+        first_name: 'Ada',
+        last_name: 'Lovelace',
+      },
+    }}>
+      <OnboardingProvider extraContext={extraContext} extraSteps={extraSteps}>{children}</OnboardingProvider>
     </AuthContext.Provider>,
   );
 }
@@ -54,3 +66,43 @@ describe('OnboardingProvider notification preferences', () => {
     expect(screen.getByTestId('email-opted-in').textContent).toBe('false');
   });
 });
+
+describe('OnboardingProvider extra context', () => {
+  const unreadMessagesCondition = vi.fn((ctx) => (ctx.unreadCount || 0) > 0);
+  const unreadMessagesStep = {
+    id: 'unread_messages',
+    condition: unreadMessagesCondition,
+    persistDismissed: false,
+  };
+
+  beforeEach(() => {
+    cleanup();
+    vi.clearAllMocks();
+    onboardingApi.getOnboardingStepConfig.mockResolvedValue([]);
+    notificationsApi.getNotificationPreferences.mockResolvedValue({ email_opt_in: true });
+  });
+
+  it('shows an app step when its extra context condition is met', async () => {
+    renderProvider({
+      extraContext: { unreadCount: 2 },
+      extraSteps: [unreadMessagesStep],
+      children: <ActiveStepsProbe />,
+    });
+
+    await waitFor(() => expect(screen.getByTestId('active-steps').textContent).toContain('unread_messages'));
+  });
+
+  it.each([
+    ['zero', { unreadCount: 0 }],
+    ['omitted', undefined],
+  ])('does not show an app step when unreadCount is %s', async (_label, extraContext) => {
+    renderProvider({
+      extraContext,
+      extraSteps: [unreadMessagesStep],
+      children: <ActiveStepsProbe />,
+    });
+
+    await waitFor(() => expect(unreadMessagesCondition).toHaveBeenCalled());
+    expect(screen.getByTestId('active-steps').textContent).not.toContain('unread_messages');
+  });
+});