diff --git a/vnext/Microsoft.ReactNative/Fabric/Composition/Modal/WindowsModalHostViewComponentView.cpp b/vnext/Microsoft.ReactNative/Fabric/Composition/Modal/WindowsModalHostViewComponentView.cpp index f17f5b198a3..cd207905531 100644 --- a/vnext/Microsoft.ReactNative/Fabric/Composition/Modal/WindowsModalHostViewComponentView.cpp +++ b/vnext/Microsoft.ReactNative/Fabric/Composition/Modal/WindowsModalHostViewComponentView.cpp @@ -68,6 +68,23 @@ struct ModalHostView : public winrt::implements &newProps, const winrt::com_ptr<::Microsoft::ReactNativeSpecs::ModalHostViewProps> &oldProps) noexcept override { + // Set title from props if available, otherwise use default + if (newProps && newProps->title.has_value()) { + m_pendingTitle = newProps->title.value(); + OutputDebugString( + (L"UpdateProps: Setting title from props: '" + winrt::to_hstring(m_pendingTitle) + L"'.\n").c_str()); + } else { + m_pendingTitle = "Modal Title Default"; // Fallback title + OutputDebugString(L"UpdateProps: Using default title 'Modal Title'.\n"); + } + + m_showTitleBar = true; + + // Debug log for m_window + if (!oldProps || newProps->visible != oldProps->visible) { + OutputDebugString(L"UpdateProps: visible prop has changed.\n"); + } + if (!oldProps || newProps->visible != oldProps->visible) { if (newProps->visible.value_or(true)) { m_visible = true; @@ -79,6 +96,21 @@ struct ModalHostView : public winrt::implements::UpdateProps(view, newProps, oldProps); } @@ -184,6 +216,21 @@ struct ModalHostView : public winrt::implements(); + presenter.SetBorderAndTitleBar(true, true); + OutputDebugString(L"EnsureModalCreated: Set border and title bar explicitly.\n"); + } catch (...) { + OutputDebugString(L"EnsureModalCreated: Failed to apply title to window.\n"); + } + } + // dispatch onShow event if (auto eventEmitter = EventEmitter()) { ::Microsoft::ReactNativeSpecs::ModalHostViewEventEmitter::OnShow eventArgs; @@ -215,6 +262,13 @@ struct ModalHostView : public winrt::implements(winrt::Microsoft::UI::GetWindowFromWindowId(m_window.Id()))); + + // create a react native island - code taken from CompositionHwndHost + m_bridge = winrt::Microsoft::UI::Content::DesktopChildSiteBridge::Create( + view.Parent().as().Compositor(), m_window.Id()); + m_reactNativeIsland = winrt::Microsoft::ReactNative::ReactNativeIsland::CreatePortal(portal); + auto contentIsland = m_reactNativeIsland.Island(); + + auto navHost = winrt::Microsoft::UI::Input::InputFocusNavigationHost::GetForSiteBridge(m_bridge); + m_departFocusToken = navHost.DepartFocusRequested( + [wkView = winrt::make_weak(view)]( + const auto &sender, const winrt::Microsoft::UI::Input::FocusNavigationRequestEventArgs &args) { + if (auto strongView = wkView.get()) { + TrySetFocus(strongView.Parent()); + } + }); + m_bridge.Connect(contentIsland); + + if (m_window) { + try { + // Force a title even if m_pendingTitle is empty + std::string titleToApply = m_pendingTitle.empty() ? "Modal Title" : m_pendingTitle; + m_window.Title(winrt::to_hstring(titleToApply)); + OutputDebugString(L"EnsureModalCreated: Applied pending title to window.\n"); + + // Also set border and title bar explicitly + auto presenter = m_window.Presenter().as(); + presenter.SetBorderAndTitleBar(true, true); + OutputDebugString(L"EnsureModalCreated: Set border and title bar explicitly.\n"); + } catch (...) { + OutputDebugString(L"EnsureModalCreated: Failed to apply title to window.\n"); + } + } + +#endif + + m_bridge.ResizePolicy(winrt::Microsoft::UI::Content::ContentSizePolicy::ResizeContentToParentWindow); +======= */ + m_islandStateChangedToken = contentIsland.StateChanged([weakThis = get_weak()]( winrt::Microsoft::UI::Content::ContentIsland const &island, @@ -273,6 +380,15 @@ struct ModalHostView : public winrt::implements; function confirmProps(props: Props) { @@ -269,6 +274,11 @@ class Modal extends React.Component { } render(): React.Node { + // Add this near the beginning of the render method + if (__DEV__ && this.props.title) { + console.log('Modal: title prop is being passed:', this.props.title); + } + if (!this._shouldShowModal()) { return null; } @@ -325,6 +335,7 @@ class Modal extends React.Component { navigationBarTranslucent={this.props.navigationBarTranslucent} identifier={this._identifier} style={styles.modal} + title={this.props.title} // $FlowFixMe[method-unbinding] added when improving typing for this parameters onStartShouldSetResponder={this._shouldSetResponder} supportedOrientations={this.props.supportedOrientations}