feat(FN-1322): add missions tab to mobile nav bar

- Add dedicated Missions tab button to MobileNavBar between Agents and More
- Remove Missions entry from the More sheet (no longer needed as overflow)
- Remove unused onOpenMissions prop from MobileNavBarProps and App.tsx
- Update MobileNavBar tests for five-tab layout and missions tab behavior
- Update mobile feature access regression test to reflect missions in tab bar
This commit is contained in:
gsxdsm
2026-04-08 21:57:00 -07:00
parent 93bfd8a9c0
commit bbc3d6236f
4 changed files with 32 additions and 18 deletions

View File

@@ -445,7 +445,6 @@ function AppInner() {
mailboxUnreadCount={modalManager.mailboxUnreadCount}
onOpenGitManager={modalManager.openGitManager}
onOpenWorkflowSteps={modalManager.openWorkflowSteps}
onOpenMissions={viewMode === "project" && currentProject ? handleOpenMissionsView : undefined}
onOpenSchedules={modalManager.openSchedules}
onOpenScripts={modalManager.openScripts}
onToggleTerminal={modalManager.toggleTerminal}

View File

@@ -49,7 +49,6 @@ const createDefaultMobileNavProps = () => ({
mailboxUnreadCount: 0,
onOpenGitManager: vi.fn(),
onOpenWorkflowSteps: vi.fn(),
onOpenMissions: vi.fn(),
onOpenSchedules: vi.fn(),
onOpenScripts: vi.fn(),
onToggleTerminal: vi.fn(),
@@ -154,7 +153,6 @@ describe("Mobile Feature Access Regression Guard", () => {
fireEvent.click(screen.getByTestId("mobile-nav-tab-more"));
expect(screen.getByTestId("mobile-more-item-mailbox")).toBeDefined();
expect(screen.getByTestId("mobile-more-item-missions")).toBeDefined();
expect(screen.getByTestId("mobile-more-item-git")).toBeDefined();
expect(screen.getByTestId("mobile-more-item-terminal")).toBeDefined();
expect(screen.getByTestId("mobile-more-item-files")).toBeDefined();

View File

@@ -34,7 +34,6 @@ export interface MobileNavBarProps {
mailboxUnreadCount?: number;
onOpenGitManager?: () => void;
onOpenWorkflowSteps?: () => void;
onOpenMissions?: () => void;
onOpenSchedules?: () => void;
onOpenScripts?: () => void;
onToggleTerminal?: () => void;
@@ -78,7 +77,6 @@ export function MobileNavBar({
mailboxUnreadCount = 0,
onOpenGitManager,
onOpenWorkflowSteps,
onOpenMissions,
onOpenSchedules,
onToggleTerminal,
onOpenFiles,
@@ -163,6 +161,18 @@ export function MobileNavBar({
<span className="mobile-nav-tab-label">Agents</span>
</button>
<button
type="button"
className={`mobile-nav-tab${view === "missions" ? " mobile-nav-tab--active" : ""}`}
data-testid="mobile-nav-tab-missions"
role="tab"
aria-selected={view === "missions"}
onClick={() => onChangeView("missions")}
>
<Target />
<span className="mobile-nav-tab-label">Missions</span>
</button>
<button
type="button"
className="mobile-nav-tab"
@@ -209,16 +219,6 @@ export function MobileNavBar({
<span>Activity Log</span>
</button>
<button
type="button"
className="mobile-more-item"
data-testid="mobile-more-item-missions"
onClick={() => handleMoreAction(onOpenMissions)}
>
<Target />
<span>Missions</span>
</button>
<button
type="button"
className="mobile-more-item"

View File

@@ -30,7 +30,6 @@ const createDefaultProps = () => ({
mailboxUnreadCount: 0,
onOpenGitManager: vi.fn(),
onOpenWorkflowSteps: vi.fn(),
onOpenMissions: vi.fn(),
onOpenSchedules: vi.fn(),
onOpenScripts: vi.fn(),
onToggleTerminal: vi.fn(),
@@ -50,12 +49,13 @@ describe("MobileNavBar", () => {
mockViewport("mobile");
});
it("renders four tab buttons (board + list + agents + more)", () => {
it("renders five tab buttons (board + list + agents + missions + more)", () => {
render(<MobileNavBar {...createDefaultProps()} />);
expect(screen.getByTestId("mobile-nav-tab-board")).toBeDefined();
expect(screen.getByTestId("mobile-nav-tab-list")).toBeDefined();
expect(screen.getByTestId("mobile-nav-tab-agents")).toBeDefined();
expect(screen.getByTestId("mobile-nav-tab-missions")).toBeDefined();
expect(screen.getByTestId("mobile-nav-tab-more")).toBeDefined();
});
@@ -99,6 +99,24 @@ describe("MobileNavBar", () => {
expect(screen.getByTestId("mobile-nav-tab-list").className).not.toContain("mobile-nav-tab--active");
});
it("missions tab calls onChangeView with 'missions'", () => {
const props = createDefaultProps();
render(<MobileNavBar {...props} view="board" />);
fireEvent.click(screen.getByTestId("mobile-nav-tab-missions"));
expect(props.onChangeView).toHaveBeenCalledWith("missions");
});
it("missions tab is active when view is 'missions'", () => {
render(<MobileNavBar {...createDefaultProps()} view="missions" />);
expect(screen.getByTestId("mobile-nav-tab-missions").className).toContain("mobile-nav-tab--active");
});
it("missions tab is not active when view is 'board'", () => {
render(<MobileNavBar {...createDefaultProps()} view="board" />);
expect(screen.getByTestId("mobile-nav-tab-missions").className).not.toContain("mobile-nav-tab--active");
});
it("opens and toggles the more sheet", () => {
const props = createDefaultProps();
const { container } = render(<MobileNavBar {...props} />);
@@ -116,7 +134,6 @@ describe("MobileNavBar", () => {
expect(screen.getByTestId("mobile-more-item-mailbox")).toBeDefined();
expect(screen.getByTestId("mobile-more-item-activity")).toBeDefined();
expect(screen.getByTestId("mobile-more-item-missions")).toBeDefined();
expect(screen.getByTestId("mobile-more-item-git")).toBeDefined();
expect(screen.getByTestId("mobile-more-item-terminal")).toBeDefined();
expect(screen.getByTestId("mobile-more-item-files")).toBeDefined();