[TASK][Frontend] Build the USO brand and branch workspace around slot-based creation

[vugarsafarzada]

Source of Truth

• PRD: https://www.notion.so/3435ef9e213280eaa56ad864787cda02
• Repo: Reziphay/nextjs-app
• Task type: execution-ready frontend task for AI/code agents
• Backend dependencies: nodejs-app#7, and moderation state support from nodejs-app#11

Current Codebase Snapshot

• src/app/(protected)/brands/page.tsx already branches into BrandsUsoPage, BrandsUcrPage, BrandDetail, BrandForm, and BrandTeamWorkspace.
• Existing brand form/workspace code already lives under src/components/organisms/brand-form/* and related brand components.
• The page already supports create/edit/team/detail route modes through search params, so this task should extend the current structure instead of replacing it.

Goal

Turn the existing brand workspace into the full USO operating surface described in the PRD: slot-aware brand creation, mandatory branch setup, richer brand metadata, and moderation-aware edit/resubmit UX.

In Scope

• Slot-aware brand workspace showing free/default slot vs additional-slot state.
• Brand create/edit UX for logo, description, gallery, categories, website, and social links.
• Mandatory first-branch setup during brand creation.
• Branch editing UX for cover/interior images, address, phone, email, is_24_7, opening/closing, and breaks.
• Clear moderation state presentation for PENDING, REJECTED, and ACTIVE brands.
• Resubmit path after rejection.
• Transfer and delete confirmation UX.
• Responsive desktop/mobile behavior.

Suggested Implementation Order

1. Map the current route modes in brands/page.tsx and keep them intact.
2. Update data models/API helpers for the richer brand/branch payloads.
3. Expand BrandForm first because create/edit is the primary input surface.
4. Add slot-state UI and moderation state UX.
5. Tighten detail/workspace rendering so create, edit, and resubmit all share the same backend contract.
6. Finish empty/loading/error states and localization.

Important Constraints For Agents

• Do not move business rules like slot enforcement or moderation eligibility into the frontend; surface backend state clearly instead.
• Preserve the existing page-mode approach unless there is a strong reason to refactor it.
• Keep file/media UX aligned with the current upload patterns already used by the app.

Deliverables

• Expanded brand/branch workspace UI.
• Updated API client/data mapping for brand and branch payloads.
• Moderation-aware status and resubmit flows.
• Responsive and localized forms/details.

Acceptance Criteria

• A USO can create a brand only through a flow that includes at least one branch.
• Brand and branch forms support the PRD-required fields.
• Slot state is visible in the workspace and affects the create experience.
• Rejected brands show reason/state clearly and offer a resubmit path.
• Transfer/delete actions are explicit and confirmed.
• The workspace works cleanly on desktop and mobile.

Out of Scope

• A full payment checkout flow for extra slots unless a dedicated payment task exists.
• Public brand-discovery work that belongs to #10.