[MOO-1942]: IntroScreen with conditional visibility not rendering (Mx 11)

packages/pluggableWidgets/intro-screen-native/CHANGELOG.md

@@ -6,6 +6,10 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 
 ## [Unreleased]
 
+### Fixed
+
+-   We fixed an issue where using the conditional visibility on the IntroScreen would cause the widget not to render.
+
 ## [4.1.0] - 2025-7-7
 
 -   Initial slide now correctly positioned on mount.

packages/pluggableWidgets/intro-screen-native/package.json

@@ -1,7 +1,7 @@
 {
   "name": "intro-screen-native",
   "widgetName": "IntroScreen",
-  "version": "4.2.0",
+  "version": "4.2.1",
   "license": "Apache-2.0",
   "repository": {
     "type": "git",

packages/pluggableWidgets/intro-screen-native/src/IntroScreen.tsx

@@ -1,7 +1,7 @@
 import { useCallback, useEffect, useState, JSX } from "react";
 import { defaultWelcomeScreenStyle, IntroScreenStyle } from "./ui/Styles";
 import { IntroScreenProps } from "../typings/IntroScreenProps";
-import { Modal, View } from "react-native";
+import { InteractionManager, Modal, View } from "react-native";
 import { DynamicValue, ValueStatus } from "mendix";
 import { SwipeableContainer } from "./SwipeableContainer";
 import AsyncStorage from "@react-native-async-storage/async-storage";
@@ -22,15 +22,15 @@ export function IntroScreen(props: IntroScreenProps<IntroScreenStyle>): JSX.Elem
                 setVisible(value === "" || value === null);
             });
         } else {
-            setVisible(true);
+            InteractionManager.runAfterInteractions(() => setVisible(true));
         }
     }, [props.identifier]);
 
     const hideModal = useCallback((): void => {
         if (props.identifier) {
             AsyncStorage.setItem(props.identifier, "gone").then(() => setVisible(false));
         } else {
-            setVisible(false);
+            InteractionManager.runAfterInteractions(() => setVisible(false));
         }
     }, [props.identifier]);