Business Affiliate Design -- Suppliers Feature

Design context for the Suppliers (BusinessAffiliate / Vendor) entity as it was being introduced to the Arda product. The implementation work is captured in Business Affiliate Workflows.

Feature Context

Suppliers are a kind of BusinessAffiliate entity with a Vendor role. Adding this entity involved:

• A new “Business Affiliates” page in the main navigation.
• Replacing the free-form supplier text fields in the Item form with a typeahead backed by the BusinessAffiliate entity.
• Linking ItemSupply child entities to BusinessAffiliate records by eId instead of by string name.

Design Session Context

The design session for the suppliers feature established the following tooling and development environment:

Development Environment

Tool	Notes
Storybook (ux-prototype)	Port 6006, basic auth (arda / ArdaSecretPrototypes)
Arda App mock mode	Port 3000, mock sign-in admin@arda.cards / Password1!, MSW 44 handlers
Playwright MCP	Can interact with both Storybook and the Arda app

Storybook Access via Playwright

Embedding credentials in the URL breaks the Fetch API. Use context.setHTTPCredentials() instead:

async (page) => {
  const context = page.context();
  await context.setHTTPCredentials({ username: 'arda', password: 'ArdaSecretPrototypes' });
  await page.goto('http://localhost:6006', { waitUntil: 'domcontentloaded' });
}

Figma Access

Figma MCP access was blocked (403) during the design session. The hi-fi mockups are available at Figma MVP2.0 Hi-Fi Mockups but require token access to the file JJJ5Yb7t8hMe2LfCX0W5gQ.

Open Item

Figma MCP access for the design files needs to be resolved for future design sessions that reference the hi-fi mockups.