# View Product Detail

<!-- User story defining a specific requirement within a business flow.
The name of the story should start with the actor followed by `--` and the story name.
 -->

<!-- This section should contain the following subsections in order: -->
<!-- 1. ## User Story (required) -->
<!-- 2. ## Story Diagram (required) -->
<!-- 3. ## Scenario Patterns (required) -->
<!-- 4. ## Test Cases (required) -->
<!-- 5. ## Screens (required) -->
<!-- 6. ## Resolvers (required) -->

## User Story

<!-- Define the user story in the format:
As a [role], I want [goal], so that [benefit].
 -->

As a viewer, I want to view a product's full details in read-only mode, so that I can review product information without the ability to make changes.

## Story Diagram

<!-- Mermaid flowchart showing user interactions with screens.
Focus on actors, UI screens, and business outcomes.
Avoid technical details (APIs, databases, endpoints).
 -->

<!-- Code block requirements: -->
<!-- Minimum 1 mermaid code blocks required -->

```mermaid
flowchart TD
    A([Viewer]) --> B[Product List Screen]
    B --> C[Select Product]
    C --> D[Product Detail Screen - Read Only]
    D --> E{Review Section}
    E -- Attributes --> F[View Attributes Panel]
    E -- Categories --> G[View Categories Panel]
    E -- Variants --> H[View Variants Panel]
    F --> D
    G --> D
    H --> D
```

## Scenario Patterns

<!-- List requirements: -->
<!-- Minimum 1 unordered lists required -->
<!-- Minimum 1 items per list -->

- Viewer opens a product detail screen and sees the product's code, name, description, uomId, and status with no edit controls visible.
- Viewer views the attributes, categories, and variants panels in read-only mode.
- Viewer cannot trigger any status transitions or edit actions from the detail screen.

## Test Cases

<!-- List requirements: -->
<!-- Minimum 1 items per list -->

- Given an existing product, when the detail screen is opened by a viewer, then all fields are displayed without edit or action controls.

## Screens

<!-- Link to screen docs that implement this story's UI.
 -->

<!-- List requirements: -->
<!-- Minimum 1 unordered lists required -->
<!-- Minimum 1 items per list -->

- [product-detail](../../../screen/product-detail.md)

## Resolvers

<!-- Link to resolver docs that implement this story's backend operations.
Write "None" if this story does not require any resolvers.
 -->

<!-- List requirements: -->
<!-- Minimum 1 items per list -->

- None
