@faststore/core 4.8.1-dev.0 → 4.8.1-dev.2

package/test/components/account/ContractSwitcher.browser.test.tsx

@@ -2,6 +2,7 @@
  * @vitest-environment jsdom
  */
 
+import '@testing-library/jest-dom/vitest'
 import { fireEvent, render, screen, waitFor } from '@testing-library/react'
 import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest'
 
@@ -117,6 +118,47 @@ describe('ContractSwitcher', () => {
     expect(options.length).toBe(2)
   })
 
+  it('marks the default contract with a star and lists it first (Design QA 00:02:00)', async () => {
+    // Note: id 'a' is pinned to the current session (this file mocks
+    // useSession with b2b.customerId: 'a'), so it must stay on the active
+    // contract for it to resolve as the current one; Alpha (the default)
+    // and Aardvark get other ids and land in the alternatives list, which
+    // is what this test exercises.
+    mockUseAvailableContracts.mockReturnValue({
+      contracts: [
+        { id: 'a', corporateName: 'Beta', isActive: true, isDefault: false },
+        { id: 'b', corporateName: 'Alpha', isActive: false, isDefault: true },
+        {
+          id: 'c',
+          corporateName: 'Aardvark',
+          isActive: false,
+          isDefault: false,
+        },
+      ],
+      loading: false,
+      error: null,
+    })
+
+    const { container } = render(
+      <ContractSwitcher onBack={vi.fn()} onClose={vi.fn()} />
+    )
+
+    await screen.findByText('Alpha')
+    expect(
+      container.querySelectorAll('[data-fs-contract-switcher-default]')
+    ).toHaveLength(1)
+    expect(
+      container.querySelector('[data-fs-contract-switcher-default]')
+    ).toHaveAttribute('aria-label', 'Default contract')
+
+    const names = Array.from(
+      container.querySelectorAll(
+        '[data-fs-contract-switcher-option] [data-fs-contract-switcher-option-name]'
+      )
+    ).map((el) => el.textContent)
+    expect(names[0]).toBe('Alpha') // default first, then alphabetical ('Aardvark')
+  })
+
   it('requires selecting a contract before Confirm is enabled, then switches (REQ-03)', async () => {
     render(<ContractSwitcher onBack={vi.fn()} onClose={vi.fn()} />)
 

package/test/components/account/Menu.browser.test.tsx

@@ -0,0 +1,123 @@
+/**
+ * @vitest-environment jsdom
+ */
+
+import '@testing-library/jest-dom/vitest'
+import { act, fireEvent, render, screen } from '@testing-library/react'
+import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest'
+
+const mockUseSession = vi.hoisted(() => vi.fn())
+const mockUseScreenResize = vi.hoisted(() => vi.fn())
+const mockOrganizationDrawer = vi.hoisted(() => vi.fn())
+
+vi.mock('src/sdk/session', () => ({ useSession: mockUseSession }))
+
+vi.mock('src/sdk/account/accountPageContext', () => ({
+  useAccountNavigationLabels: () => ({ switchLabel: 'Switch' }),
+}))
+
+vi.mock('src/sdk/ui/useScreenResize', () => ({
+  default: mockUseScreenResize,
+}))
+
+vi.mock('next/router', () => ({
+  useRouter: () => ({ pathname: '/pvt/account' }),
+}))
+
+vi.mock(
+  '../../../src/components/account/Drawer/OrganizationDrawer/OrganizationDrawer',
+  () => ({
+    OrganizationDrawer: (props: Record<string, unknown>) => {
+      mockOrganizationDrawer(props)
+      return <div data-testid="organization-drawer" />
+    },
+  })
+)
+
+import Menu from '../../../src/components/account/Menu/Menu'
+
+const items = [{ title: 'Orders', route: '/pvt/account/orders' }]
+
+describe('Menu', () => {
+  beforeEach(() => {
+    mockUseScreenResize.mockReturnValue({ isDesktop: true })
+  })
+
+  afterEach(() => {
+    vi.clearAllMocks()
+  })
+
+  it('does not render the Switch button without an organization unit', () => {
+    mockUseSession.mockReturnValue({ b2b: {} })
+
+    render(<Menu accountName="Jane" items={items} />)
+
+    expect(screen.queryByRole('button', { name: 'Switch' })).toBeNull()
+  })
+
+  it('renders the Switch button when the buyer has an organization unit', () => {
+    mockUseSession.mockReturnValue({ b2b: { unitId: 'unit-1' } })
+
+    render(<Menu accountName="Jane" items={items} />)
+
+    expect(screen.getByRole('button', { name: 'Switch' })).toBeTruthy()
+  })
+
+  it('mounts the OrganizationDrawer with initialView "switch" when Switch is clicked', () => {
+    mockUseSession.mockReturnValue({
+      b2b: { unitId: 'unit-1', isRepresentative: true },
+    })
+
+    render(<Menu accountName="Jane" items={items} />)
+
+    expect(screen.queryByTestId('organization-drawer')).toBeNull()
+
+    fireEvent.click(screen.getByRole('button', { name: 'Switch' }))
+
+    expect(screen.getByTestId('organization-drawer')).toBeTruthy()
+    expect(mockOrganizationDrawer).toHaveBeenCalledWith(
+      expect.objectContaining({
+        isOpen: true,
+        initialView: 'switch',
+        isRepresentative: true,
+      })
+    )
+  })
+
+  it('passes isRepresentative as a boolean even when b2b.isRepresentative is undefined', () => {
+    mockUseSession.mockReturnValue({ b2b: { unitId: 'unit-1' } })
+
+    render(<Menu accountName="Jane" items={items} />)
+    fireEvent.click(screen.getByRole('button', { name: 'Switch' }))
+
+    expect(mockOrganizationDrawer).toHaveBeenCalledWith(
+      expect.objectContaining({ isRepresentative: false })
+    )
+  })
+
+  it('unmounts the OrganizationDrawer when closeDrawer is invoked', () => {
+    mockUseSession.mockReturnValue({ b2b: { unitId: 'unit-1' } })
+
+    render(<Menu accountName="Jane" items={items} />)
+    fireEvent.click(screen.getByRole('button', { name: 'Switch' }))
+    expect(screen.getByTestId('organization-drawer')).toBeTruthy()
+
+    const closeDrawer = mockOrganizationDrawer.mock.calls[0][0]
+      .closeDrawer as () => void
+    act(() => {
+      closeDrawer()
+    })
+
+    expect(screen.queryByTestId('organization-drawer')).toBeNull()
+  })
+
+  it('renders only the nav list on mobile (no account/switch area)', () => {
+    mockUseScreenResize.mockReturnValue({ isDesktop: false })
+    mockUseSession.mockReturnValue({ b2b: { unitId: 'unit-1' } })
+
+    render(<Menu accountName="Jane" items={items} />)
+
+    expect(screen.queryByRole('button', { name: 'Switch' })).toBeNull()
+    expect(screen.getByText('Orders')).toBeTruthy()
+  })
+})

package/test/components/account/OrganizationDrawer.browser.test.tsx

@@ -2,6 +2,7 @@
  * @vitest-environment jsdom
  */
 
+import '@testing-library/jest-dom/vitest'
 import { fireEvent, render, screen } from '@testing-library/react'
 import type { ReactNode } from 'react'
 import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest'
@@ -9,6 +10,7 @@ import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest'
 const mockFadeOut = vi.hoisted(() => vi.fn())
 const mockUseSession = vi.hoisted(() => vi.fn())
 const mockCloseDrawer = vi.hoisted(() => vi.fn())
+const mockUseAvailableContracts = vi.hoisted(() => vi.fn())
 
 vi.mock('@faststore/ui', async (importOriginal) => {
   const actual = await importOriginal<typeof import('@faststore/ui')>()
@@ -38,6 +40,10 @@ vi.mock('@faststore/ui', async (importOriginal) => {
 
 vi.mock('src/sdk/session', () => ({ useSession: mockUseSession }))
 
+vi.mock('src/sdk/account/useAvailableContracts', () => ({
+  useAvailableContracts: mockUseAvailableContracts,
+}))
+
 vi.mock(
   '../../../src/components/account/Drawer/OrganizationDrawer/ContractSwitcher',
   () => ({
@@ -82,6 +88,11 @@ describe('OrganizationDrawer', () => {
       },
       person: { givenName: 'Jane' },
     })
+    mockUseAvailableContracts.mockReturnValue({
+      contracts: [],
+      loading: false,
+      error: null,
+    })
   })
 
   afterEach(() => {
@@ -194,4 +205,141 @@ describe('OrganizationDrawer', () => {
       screen.getByRole('heading', { name: 'Organization', level: 1 })
     ).toBeTruthy()
   })
+
+  it('opens directly in the switcher when initialView is "switch"', () => {
+    render(
+      <OrganizationDrawer
+        isOpen
+        closeDrawer={vi.fn()}
+        isRepresentative
+        initialView="switch"
+      />
+    )
+    expect(screen.getByTestId('contract-switcher')).toBeInTheDocument()
+  })
+
+  it('shows the default-contract star in the header when the active contract is the unit default', () => {
+    mockUseAvailableContracts.mockReturnValue({
+      contracts: [
+        {
+          id: 'unit-1',
+          corporateName: 'Acme Contract',
+          isActive: true,
+          isDefault: true,
+        },
+        {
+          id: 'other',
+          corporateName: 'Other Contract',
+          isActive: false,
+          isDefault: false,
+        },
+      ],
+      loading: false,
+      error: null,
+    })
+    mockUseSession.mockReturnValue({
+      b2b: {
+        unitId: 'unit-1',
+        unitName: 'Stellar Global',
+        contractName: 'Acme Contract',
+        customerId: 'unit-1',
+        userName: 'Jane Buyer',
+        userEmail: 'jane@example.com',
+        organizationManager: true,
+      },
+      person: { givenName: 'Jane' },
+    })
+
+    render(
+      <OrganizationDrawer
+        isOpen
+        closeDrawer={mockCloseDrawer}
+        isRepresentative={false}
+      />
+    )
+
+    expect(screen.getByLabelText('Default contract')).toBeTruthy()
+  })
+
+  it('does not show the default-contract star when the active contract is not the unit default', () => {
+    mockUseAvailableContracts.mockReturnValue({
+      contracts: [
+        {
+          id: 'unit-1',
+          corporateName: 'Acme Contract',
+          isActive: true,
+          isDefault: false,
+        },
+        {
+          id: 'other',
+          corporateName: 'Other Contract',
+          isActive: false,
+          isDefault: true,
+        },
+      ],
+      loading: false,
+      error: null,
+    })
+    mockUseSession.mockReturnValue({
+      b2b: {
+        unitId: 'unit-1',
+        unitName: 'Stellar Global',
+        contractName: 'Acme Contract',
+        customerId: 'unit-1',
+        userName: 'Jane Buyer',
+        userEmail: 'jane@example.com',
+        organizationManager: true,
+      },
+      person: { givenName: 'Jane' },
+    })
+
+    render(
+      <OrganizationDrawer
+        isOpen
+        closeDrawer={mockCloseDrawer}
+        isRepresentative={false}
+      />
+    )
+
+    expect(screen.queryByLabelText('Default contract')).toBeNull()
+  })
+
+  it('fetches the contract list only while open for an org member', () => {
+    const { rerender } = render(
+      <OrganizationDrawer
+        isOpen={false}
+        closeDrawer={mockCloseDrawer}
+        isRepresentative={false}
+      />
+    )
+
+    expect(mockUseAvailableContracts).toHaveBeenLastCalledWith(false)
+
+    rerender(
+      <OrganizationDrawer
+        isOpen
+        closeDrawer={mockCloseDrawer}
+        isRepresentative={false}
+      />
+    )
+
+    expect(mockUseAvailableContracts).toHaveBeenLastCalledWith(true)
+  })
+
+  it('never fetches the contract list when the buyer has no organization unit', () => {
+    mockUseSession.mockReturnValue({
+      b2b: { userName: 'Jane Buyer' },
+      person: null,
+    })
+
+    render(
+      <OrganizationDrawer
+        isOpen
+        closeDrawer={mockCloseDrawer}
+        isRepresentative={false}
+      />
+    )
+
+    expect(mockUseAvailableContracts).toHaveBeenLastCalledWith(false)
+  })
 })

package/test/components/account/OrganizationDrawerFooter.browser.test.tsx

@@ -6,6 +6,7 @@ import { fireEvent, render, screen } from '@testing-library/react'
 import { describe, expect, it, vi } from 'vitest'
 
 import { OrganizationDrawerFooter } from '../../../src/components/account/Drawer/OrganizationDrawer/OrganizationDrawerFooter'
+import PageProvider from '../../../src/sdk/overrides/PageProvider'
 
 describe('OrganizationDrawerFooter', () => {
   it('renders org and user details with optional email', () => {
@@ -48,7 +49,100 @@ describe('OrganizationDrawerFooter', () => {
       />
     )
 
-    fireEvent.click(screen.getByRole('button', { name: /log out/i }))
+    fireEvent.click(screen.getByRole('button', { name: /logout/i }))
     expect(onLogoutClick).toHaveBeenCalledTimes(1)
   })
+
+  it('uses the default English manage/logout labels when rendered outside a My Account page context', () => {
+    render(
+      <OrganizationDrawerFooter
+        orgName="Stellar Global"
+        userName="Jane Buyer"
+        showManageLink
+        manageUrl="/pvt/organization-account/org-unit/unit-1"
+      />
+    )
+
+    expect(screen.getByText('Manage')).toBeTruthy()
+    expect(screen.getByRole('button', { name: 'Logout' })).toBeTruthy()
+  })
+
+  it('uses the default labels inside a non-account page context', () => {
+    render(
+      <PageProvider context={{ globalSettings: {} }}>
+        <OrganizationDrawerFooter
+          orgName="Stellar Global"
+          userName="Jane Buyer"
+          showManageLink
+          manageUrl="/pvt/organization-account/org-unit/unit-1"
+        />
+      </PageProvider>
+    )
+
+    expect(screen.getByText('Manage')).toBeTruthy()
+    expect(screen.getByRole('button', { name: 'Logout' })).toBeTruthy()
+  })
+
+  it('uses the CMS-provided navigation labels when rendered inside a My Account page', () => {
+    render(
+      <PageProvider
+        context={{
+          accountPageData: {},
+          navigationLabels: {
+            manageLabel: 'Gerenciar',
+            logoutLabel: 'Sair',
+          },
+        }}
+      >
+        <OrganizationDrawerFooter
+          orgName="Stellar Global"
+          userName="Jane Buyer"
+          showManageLink
+          manageUrl="/pvt/organization-account/org-unit/unit-1"
+        />
+      </PageProvider>
+    )
+
+    expect(screen.getByText('Gerenciar')).toBeTruthy()
+    expect(screen.getByRole('button', { name: 'Sair' })).toBeTruthy()
+  })
+
+  it('lets an explicit label prop win over the CMS-provided navigation labels', () => {
+    render(
+      <PageProvider
+        context={{
+          accountPageData: {},
+          navigationLabels: {
+            manageLabel: 'Gerenciar',
+            logoutLabel: 'Sair',
+          },
+        }}
+      >
+        <OrganizationDrawerFooter
+          orgName="Stellar Global"
+          userName="Jane Buyer"
+          showManageLink
+          manageUrl="/pvt/organization-account/org-unit/unit-1"
+          manageLabel="Manage account"
+          logoutLabel="Sign out"
+        />
+      </PageProvider>
+    )
+
+    expect(screen.getByText('Manage account')).toBeTruthy()
+    expect(screen.getByRole('button', { name: 'Sign out' })).toBeTruthy()
+  })
+
+  it('does not render the manage link when showManageLink is false', () => {
+    render(
+      <OrganizationDrawerFooter
+        orgName="Stellar Global"
+        userName="Jane Buyer"
+        showManageLink={false}
+        manageUrl="/pvt/organization-account/org-unit/unit-1"
+      />
+    )
+
+    expect(screen.queryByText('Manage')).toBeNull()
+  })
 })

package/test/components/account/OrganizationDrawerHeader.browser.test.tsx

@@ -36,6 +36,8 @@ describe('OrganizationDrawerHeader', () => {
       />
     )
 
+    expect(screen.getByLabelText('Default contract')).toBeTruthy()
+
     fireEvent.click(screen.getByRole('button', { name: /change/i }))
     expect(onChangeContract).toHaveBeenCalledTimes(1)
   })

package/test/components/account/OrganizationSignInButton.browser.test.tsx

@@ -0,0 +1,49 @@
+/**
+ * @vitest-environment jsdom
+ */
+import '@testing-library/jest-dom/vitest'
+import { render, screen } from '@testing-library/react'
+import { describe, expect, it, vi } from 'vitest'
+
+const mockUseSession = vi.hoisted(() => vi.fn())
+vi.mock('src/sdk/session', () => ({ useSession: mockUseSession }))
+vi.mock('src/sdk/account/accountPageContext', () => ({
+  useAccountNavigationLabels: () => ({
+    companyLabel: 'Company',
+    contractLabel: 'Contract',
+  }),
+}))
+vi.mock(
+  'src/components/account/Drawer/OrganizationDrawer/OrganizationDrawer',
+  () => ({
+    OrganizationDrawer: () => null,
+  })
+)
+
+import { OrganizationSignInButton } from '../../../src/components/account/Drawer/OrganizationSignInButton/OrganizationSignInButton'
+
+const icon = { alt: 'account', icon: 'User' }
+
+describe('OrganizationSignInButton', () => {
+  it('shows the active contract name when the session has one (Design QA 00:02:55)', () => {
+    mockUseSession.mockReturnValue({
+      person: { id: 'p1' },
+      b2b: { contractName: ' Caetano Corp ' },
+    })
+    render(<OrganizationSignInButton icon={icon} isRepresentative />)
+    expect(screen.getByRole('button', { name: 'account' })).toHaveTextContent(
+      'Caetano Corp'
+    )
+  })
+
+  it('falls back to the company label without a contract name', () => {
+    mockUseSession.mockReturnValue({
+      person: { id: 'p1' },
+      b2b: { contractName: '' },
+    })
+    render(<OrganizationSignInButton icon={icon} isRepresentative />)
+    expect(screen.getByRole('button', { name: 'account' })).toHaveTextContent(
+      'Company'
+    )
+  })
+})