fix(macos): convert `Main.storyboard` using programmatic AppKit APIs by tido64 · Pull Request #2836 · microsoft/react-native-test-app

tido64 · 2026-07-03T11:51:12Z

Description

Resolves #111.

Platforms affected

Test plan

cd packages/example-macos/
pod install --project-directory=macos
yarn macos

# In a separate terminal
yarn start

Screenshots

More below…

tido64

Main menu screenshots 👇

tido64 · 2026-07-03T11:51:47Z

+        return NSMenuItem(submenu: title, items: [
+            NSMenuItem(title: "About \(title)", action: #selector(NSApplication.orderFrontStandardAboutPanel(_:))),
+            .separator(),
+            NSMenuItem(title: "Preferences…", keyEquivalent: ","),
+            .separator(),
+            NSMenuItem(submenu: servicesMenu),
+            .separator(),
+            NSMenuItem(title: "Hide \(title)", action: #selector(NSApplication.hide(_:)), keyEquivalent: "h"),
+            NSMenuItem(
+                title: "Hide Others",
+                action: #selector(NSApplication.hideOtherApplications(_:)),
+                keyEquivalent: "h",
+                keyEquivalentModifierMask: [.option, .command]
+            ),
+            NSMenuItem(title: "Show All", action: #selector(NSApplication.unhideAllApplications(_:))),
+            .separator(),
+            NSMenuItem(title: "Quit \(title)", action: #selector(NSApplication.terminate(_:)), keyEquivalent: "q"),
+        ])


tido64 · 2026-07-03T11:52:05Z

+        NSMenuItem(submenu: "File", items: [
+            NSMenuItem(title: "New", action: #selector(NSDocumentController.newDocument(_:)), keyEquivalent: "n"),
+            NSMenuItem(title: "Open…", action: #selector(NSDocumentController.openDocument(_:)), keyEquivalent: "o"),
+            NSMenuItem(submenu: "Open Recent", items: [
+                NSMenuItem(title: "Clear Menu", action: #selector(NSDocumentController.clearRecentDocuments(_:))),
+            ]),
+            .separator(),
+            NSMenuItem(title: "Close", action: #selector(NSWindow.performClose(_:)), keyEquivalent: "w"),
+            NSMenuItem(title: "Save…", action: #selector(NSDocument.save(_:)), keyEquivalent: "s"),
+            NSMenuItem(title: "Save As…", action: #selector(NSDocument.saveAs(_:)), keyEquivalent: "S"),
+            NSMenuItem(title: "Revert to Saved", action: #selector(NSDocument.revertToSaved(_:)), keyEquivalent: "r"),
+            .separator(),
+            NSMenuItem(
+                title: "Page Setup…",
+                action: #selector(NSDocument.runPageLayout(_:)),
+                keyEquivalent: "P",
+                keyEquivalentModifierMask: [.shift, .command]
+            ),
+            NSMenuItem(title: "Print…", action: #selector(NSView.printView(_:)), keyEquivalent: "p"),
+        ])


tido64 · 2026-07-03T11:52:29Z

+        NSMenuItem(submenu: "Edit", items: [
+            NSMenuItem(title: "Undo", action: Selector(("undo:")), keyEquivalent: "z"),
+            NSMenuItem(title: "Redo", action: Selector(("redo:")), keyEquivalent: "Z"),
+            .separator(),
+            NSMenuItem(title: "Cut", action: #selector(NSText.cut(_:)), keyEquivalent: "x"),
+            NSMenuItem(title: "Copy", action: #selector(NSText.copy(_:)), keyEquivalent: "c"),
+            NSMenuItem(title: "Paste", action: #selector(NSText.paste(_:)), keyEquivalent: "v"),
+            NSMenuItem(
+                title: "Paste and Match Style",
+                action: #selector(NSTextView.pasteAsPlainText(_:)),
+                keyEquivalent: "V",
+                keyEquivalentModifierMask: [.option, .command]
+            ),
+            NSMenuItem(title: "Delete", action: #selector(NSText.delete(_:))),
+            NSMenuItem(title: "Select All", action: #selector(NSText.selectAll(_:)), keyEquivalent: "a"),
+            .separator(),
+            NSMenuItem(submenu: "Find", items: [
+                NSMenuItem(
+                    title: "Find…",
+                    action: #selector(NSTextView.performFindPanelAction(_:)),
+                    keyEquivalent: "f",
+                    tag: 1
+                ),
+                NSMenuItem(
+                    title: "Find and Replace…",
+                    action: #selector(NSTextView.performFindPanelAction(_:)),
+                    keyEquivalent: "f",
+                    keyEquivalentModifierMask: [.option, .command],
+                    tag: 12
+                ),
+                NSMenuItem(
+                    title: "Find Next",
+                    action: #selector(NSTextView.performFindPanelAction(_:)),
+                    keyEquivalent: "g",
+                    tag: 2
+                ),
+                NSMenuItem(
+                    title: "Find Previous",
+                    action: #selector(NSTextView.performFindPanelAction(_:)),
+                    keyEquivalent: "G",
+                    tag: 3
+                ),
+                NSMenuItem(
+                    title: "Use Selection for Find",
+                    action: #selector(NSTextView.performFindPanelAction(_:)),
+                    keyEquivalent: "e",
+                    tag: 7
+                ),
+                NSMenuItem(
+                    title: "Jump to Selection",
+                    action: #selector(NSTextView.centerSelectionInVisibleArea(_:)),
+                    keyEquivalent: "j"
+                ),
+            ]),
+            NSMenuItem(submenu: "Spelling and Grammar", items: [
+                NSMenuItem(
+                    title: "Show Spelling and Grammar",
+                    action: #selector(NSText.showGuessPanel(_:)),
+                    keyEquivalent: ":"
+                ),
+                NSMenuItem(
+                    title: "Check Document Now",
+                    action: #selector(NSText.checkSpelling(_:)),
+                    keyEquivalent: ";"
+                ),
+                .separator(),
+                NSMenuItem(
+                    title: "Check Spelling While Typing",
+                    action: #selector(NSTextView.toggleContinuousSpellChecking(_:))
+                ),
+                NSMenuItem(
+                    title: "Check Grammar With Spelling",
+                    action: #selector(NSTextView.toggleGrammarChecking(_:))
+                ),
+                NSMenuItem(
+                    title: "Correct Spelling Automatically",
+                    action: #selector(NSTextView.toggleAutomaticSpellingCorrection(_:))
+                ),
+            ]),
+            NSMenuItem(submenu: "Substitutions", items: [
+                NSMenuItem(
+                    title: "Show Substitutions",
+                    action: #selector(NSTextView.orderFrontSubstitutionsPanel(_:))
+                ),
+                .separator(),
+                NSMenuItem(
+                    title: "Smart Copy/Paste",
+                    action: #selector(NSTextView.toggleSmartInsertDelete(_:))
+                ),
+                NSMenuItem(
+                    title: "Smart Quotes",
+                    action: #selector(NSTextView.toggleAutomaticQuoteSubstitution(_:))
+                ),
+                NSMenuItem(
+                    title: "Smart Dashes",
+                    action: #selector(NSTextView.toggleAutomaticDashSubstitution(_:))
+                ),
+                NSMenuItem(
+                    title: "Smart Links",
+                    action: #selector(NSTextView.toggleAutomaticLinkDetection(_:))
+                ),
+                NSMenuItem(
+                    title: "Data Detectors",
+                    action: #selector(NSTextView.toggleAutomaticDataDetection(_:))
+                ),
+                NSMenuItem(
+                    title: "Text Replacement",
+                    action: #selector(NSTextView.toggleAutomaticTextReplacement(_:))
+                ),
+            ]),
+            NSMenuItem(submenu: "Transformations", items: [
+                NSMenuItem(title: "Make Upper Case", action: #selector(NSTextView.uppercaseWord(_:))),
+                NSMenuItem(title: "Make Lower Case", action: #selector(NSTextView.lowercaseWord(_:))),
+                NSMenuItem(title: "Capitalize", action: #selector(NSTextView.capitalizeWord(_:))),
+            ]),
+            NSMenuItem(submenu: "Speech", items: [
+                NSMenuItem(title: "Start Speaking", action: #selector(NSTextView.startSpeaking(_:))),
+                NSMenuItem(title: "Stop Speaking", action: #selector(NSTextView.stopSpeaking(_:))),
+            ]),
+        ])


tido64 · 2026-07-03T11:52:45Z

+        NSMenuItem(submenu: "View", items: [
+            NSMenuItem(
+                title: "Show Toolbar",
+                action: #selector(NSWindow.toggleToolbarShown(_:)),
+                keyEquivalent: "t",
+                keyEquivalentModifierMask: [.option, .command]
+            ),
+            NSMenuItem(
+                title: "Customize Toolbar…",
+                action: #selector(NSWindow.runToolbarCustomizationPalette(_:))
+            ),
+            .separator(),
+            NSMenuItem(
+                title: "Show Sidebar",
+                action: #selector(NSSplitViewController.toggleSidebar(_:)),
+                keyEquivalent: "s",
+                keyEquivalentModifierMask: [.control, .command]
+            ),
+            NSMenuItem(
+                title: "Enter Full Screen",
+                action: #selector(NSWindow.toggleFullScreen(_:)),
+                keyEquivalent: "f",
+                keyEquivalentModifierMask: [.control, .command]
+            ),
+        ])


tido64 · 2026-07-03T11:53:13Z

+        let rememberLastComponentMenuItem = NSMenuItem(
+            title: "Remember Last Opened Component",
+            action: #selector(onRememberLastComponentSelected(_:)),
+            target: self
+        )
+        rememberLastComponentMenuItem.isEnabled = false
+        self.rememberLastComponentMenuItem = rememberLastComponentMenuItem
+
+        let reactMenu = NSMenu(title: "React", items: [
+            NSMenuItem(
+                title: "Load Embedded JS Bundle",
+                action: #selector(onLoadEmbeddedBundleSelected(_:)),
+                target: self
+            ),
+            NSMenuItem(
+                title: "Load From Dev Server",
+                action: #selector(onLoadFromDevServerSelected(_:)),
+                target: self
+            ),
+            rememberLastComponentMenuItem,
+            .separator(),
+        ])
+        reactMenu.autoenablesItems = false
+        self.reactMenu = reactMenu
+
+        let reactMenuItem = NSMenuItem(submenu: reactMenu)
+        reactMenuItem.isHidden = true
+        return reactMenuItem


tido64 · 2026-07-03T11:55:16Z

+        let windowMenu = NSMenu(title: "Window", items: [
+            NSMenuItem(title: "Minimize", action: #selector(NSWindow.performMiniaturize(_:)), keyEquivalent: "m"),
+            NSMenuItem(title: "Zoom", action: #selector(NSWindow.performZoom(_:))),
+            .separator(),
+            NSMenuItem(title: "Bring All to Front", action: #selector(NSApplication.arrangeInFront(_:))),
+        ])
+
+        NSApp.windowsMenu = windowMenu
+
+        return NSMenuItem(submenu: windowMenu)


tido64 · 2026-07-03T11:55:29Z

+        let helpMenu = NSMenu(title: "Help", items: [
+            NSMenuItem(title: "\(title) Help", action: #selector(NSApplication.showHelp(_:)), keyEquivalent: "?"),
+        ])
+
+        NSApp.helpMenu = helpMenu
+
+        return NSMenuItem(submenu: helpMenu)


Saadnajmi · 2026-07-03T15:10:47Z

I think I have a WIP in RNM where I changed the remote to SwiftUI with much of the same fratutes. I can dig it up?

tido64 · 2026-07-06T07:28:03Z

I think I have a WIP in RNM where I changed the remote to SwiftUI with much of the same fratutes. I can dig it up?

What are "much of the same features"? And how much code is there? We have hooks in the AppDelegate that we need to keep for config-plugins but besides that, most of the code is just 1:1 converting the menu bar from the storyboard (that we probably should trim down). There aren't much to maintain so to speak.

@main

Replace the programmatic AppKit menu bar (added in microsoft#2836) with the SwiftUI App lifecycle. SwiftUI provides the standard App/File/Edit/View/Window/Help menus for free, so the ~320 lines of makeMainMenu/make*MenuItem in WindowController.swift are deleted. The dynamic "React" menu is now declarative: ReactCommands renders a CommandMenu("React") driven by an observable AppModel. Publishing components/componentsEnabled/rememberLastComponent rebuilds the menu, so the manual NSMenuItem add/remove bookkeeping is gone. An AppDelegate is kept via @NSApplicationDelegateAdaptor for RN setup and lifecycle notifications. - AppDelegate.swift: @main App struct + adaptor + AppModel - ReactCommands.swift: dynamic React menu (Cmd-Shift-1..9 component shortcuts) - ViewController.swift: SwiftUI content hosting + placeholder - WindowController.swift: deleted - project.pbxproj / pack.test.mts: swap WindowController.swift for ReactCommands.swift Both ENABLE_SINGLE_APP_MODE and multi-app behavior are preserved. Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>

@main

Replace the programmatic AppKit menu bar (added in microsoft#2836) with the SwiftUI App lifecycle. SwiftUI provides the standard App/File/Edit/View/Window/Help menus for free, so the ~320 lines of makeMainMenu/make*MenuItem in WindowController.swift are deleted. The dynamic "React" menu is now declarative: ReactCommands renders a CommandMenu("React") driven by an observable AppModel. Publishing components/componentsEnabled/rememberLastComponent rebuilds the menu, so the manual NSMenuItem add/remove bookkeeping is gone. An AppDelegate is kept via @NSApplicationDelegateAdaptor for RN setup and lifecycle notifications. - AppDelegate.swift: @main App struct + adaptor + AppModel - ReactCommands.swift: dynamic React menu (Cmd-Shift-1..9 component shortcuts) - ViewController.swift: SwiftUI content hosting + placeholder - WindowController.swift: deleted - project.pbxproj / pack.test.mts: swap WindowController.swift for ReactCommands.swift Both ENABLE_SINGLE_APP_MODE and multi-app behavior are preserved. Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>

github-actions Bot added platform: iOS This affects iOS platform: macOS This affects macOS platform: visionOS labels Jul 3, 2026

tido64 commented Jul 3, 2026

View reviewed changes

tido64 force-pushed the tido/replace-storyboard branch 2 times, most recently from 2298886 to c761fd2 Compare July 3, 2026 13:03

fix(macos): convert Main.storyboard using programmatic AppKit APIs

ff0b9a8

tido64 force-pushed the tido/replace-storyboard branch from c761fd2 to ff0b9a8 Compare July 6, 2026 10:05

tido64 marked this pull request as ready for review July 6, 2026 10:13

tido64 requested review from JasonVMo and Saadnajmi as code owners July 6, 2026 10:13

Saadnajmi approved these changes Jul 7, 2026

View reviewed changes

tido64 merged commit 9057a4f into trunk Jul 7, 2026
23 checks passed

tido64 deleted the tido/replace-storyboard branch July 7, 2026 10:17

Saadnajmi mentioned this pull request Jul 7, 2026

feat(macos): migrate menu to SwiftUI App + .commands #2842

Draft

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

fix(macos): convert `Main.storyboard` using programmatic AppKit APIs#2836

fix(macos): convert `Main.storyboard` using programmatic AppKit APIs#2836
tido64 merged 1 commit into
trunkfrom
tido/replace-storyboard

tido64 commented Jul 3, 2026 •

edited

Loading

Uh oh!

tido64 left a comment •

edited

Loading

Uh oh!

tido64 Jul 3, 2026

Uh oh!

tido64 Jul 3, 2026

Uh oh!

tido64 Jul 3, 2026

Uh oh!

tido64 Jul 3, 2026

Uh oh!

tido64 Jul 3, 2026

Uh oh!

tido64 Jul 3, 2026

Uh oh!

tido64 Jul 3, 2026

Uh oh!

Saadnajmi commented Jul 3, 2026

Uh oh!

tido64 commented Jul 6, 2026 •

edited

Loading

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

Uh oh!

Conversation

tido64 commented Jul 3, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Description

Platforms affected

Test plan

Screenshots

Uh oh!

tido64 left a comment • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

tido64 Jul 3, 2026

Choose a reason for hiding this comment

Uh oh!

tido64 Jul 3, 2026

Choose a reason for hiding this comment

Uh oh!

tido64 Jul 3, 2026

Choose a reason for hiding this comment

Uh oh!

tido64 Jul 3, 2026

Choose a reason for hiding this comment

Uh oh!

tido64 Jul 3, 2026

Choose a reason for hiding this comment

Uh oh!

tido64 Jul 3, 2026

Choose a reason for hiding this comment

Uh oh!

tido64 Jul 3, 2026

Choose a reason for hiding this comment

Uh oh!

Saadnajmi commented Jul 3, 2026

Uh oh!

tido64 commented Jul 6, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

tido64 commented Jul 3, 2026 •

edited

Loading

tido64 left a comment •

edited

Loading

tido64 commented Jul 6, 2026 •

edited

Loading