---
title: Render view components
summary: Renders the side menu, top menu, and policy header, or the shared error view.
status: draft
owner: SAIF IT Core Services
last_reviewed: 2026-10-12
library: BolMiddleware
reference_type: package
operation_id: OP-14
trigger: Layout rendering
---

# Render view components

The shared layouts invoke three view components for the page chrome. Each returns its own view or the shared error view.

| Field | Value |
| --- | --- |
| **Operation ID** | OP-14 |
| **Trigger** | Layout rendering |
| **Inputs** | `BusinessOnlineMenu`, current page name, `BolPolicyModel`, error message |
| **Outputs** | HTML fragments |
| **Primary components** | `BolSideMenuViewComponent`, `BolTopMenuViewComponent`, `BolPolicyHeaderViewComponent` |
| **Entry point** | `src/BolMiddleware/ViewComponents/BolSideMenuViewComponent.cs` |

## Steps

1. The side and top menu components receive the menu and current page. If the menu is null they return the `Error` view ([BR-BOLMIDDLEWARE-016](../business-rules.md#br-bolmiddleware-016-null-menu-error-view)).
2. Otherwise they build a `BolMenuViewModel` and return the component view, which lists favorites and menu items through `_BolMenuItemPartial`. The top menu filters items by the configured `AppMenuCategory`.
3. The policy header component returns the `Error` view when the error message is not empty ([BR-BOLMIDDLEWARE-017](../business-rules.md#br-bolmiddleware-017-error-message-error-view)); otherwise it renders the policy header view, which uses [Build policy dropdown](build-policy-dropdown.md) when allowed.
4. The page header partial shows profile and logoff links only for external users, using `account.saif.com` for production environments and `account-qa.saif.com` otherwise ([BR-BOLMIDDLEWARE-018](../business-rules.md#br-bolmiddleware-018-external-profile-and-logoff-links)).

## Process flow

The following diagram visualizes this operation's control flow.

```mermaid
flowchart TD
	Start([Layout renders]) --> D1{Menu is null?}
	D1 -->|Yes| E1([Error view])
	D1 -->|No| S1[Render menu view]
	S1 --> D2{Policy error message?}
	D2 -->|Yes| E2([Error view with message])
	D2 -->|No| S2[Render policy header]
	S2 --> D3{External user?}
	D3 -->|Yes| S3[Show profile and logoff links]
	D3 -->|No| EndOk([Done])
	S3 --> EndOk
```

## Failure and edge-case behavior

- `InvokeAsync` methods are declared async but never await, so the compiler warns and the work is synchronous.
- The layouts pass an extra `showPolicyDropdown` argument to `BolPolicyHeader` that the component does not declare.
- `_MenuOnlyLayout` references the static assets under `_content/bolMiddleware` in lowercase, which can fail on case-sensitive hosts.
- The header partial treats any environment name containing `prod`, including `preprod`, as production.

## Related documentation
- [Index](../index.md)
- [Overview](../overview.md)
- [Architecture](../architecture.md)
- [Dependencies](../dependencies.md)
- [Configuration](../configuration.md)
- [Operations and processes](../operations-processes.md)
- [Business rules](../business-rules.md)
- [Security and authorization](../security-authorization.md)
- [Service registration](../service-registration.md)
- [API reference](../api/index.md)

## Sources
- src/BolMiddleware/ViewComponents/BolSideMenuViewComponent.cs
- src/BolMiddleware/ViewComponents/BolTopMenuViewComponent.cs
- src/BolMiddleware/ViewComponents/BolPolicyHeaderViewComponent.cs
- src/BolMiddleware/Pages/Components/BolSideMenu/default.cshtml
- src/BolMiddleware/Pages/Components/BolTopMenu/default.cshtml
- src/BolMiddleware/Pages/Components/BolPolicyHeader/default.cshtml
- src/BolMiddleware/Pages/Shared/_BolPageHeaderPartial.cshtml
- src/BolMiddleware/Pages/Shared/_MenuOnlyLayout.cshtml