Bitdeer container components
Bitdeer-specific UI for the operations centre containers view
UI for Bitdeer containers. These components consume Bitdeer-shaped device records and render pump state, exhaust fan status, tank charts, and settings.
For primitives shared across all container vendors (EnabledDisableToggle, DryCooler, etc.), see the Containers overview. The PDU socket tile has its own Socket page.
Prerequisites
- Complete the @mdk/foundation installation and add the dependency
- A Bitdeer container device record. The charts and pumps components read from
container_specific_stats.cooling_system.
Components
| Component | Description |
|---|---|
BitdeerPumps | Bitdeer exhaust fan status indicator |
BitdeerSettings | Bitdeer container settings and thresholds |
BitdeerTankPressureCharts | Bitdeer tank pressure time-series chart |
BitdeerTankTempCharts | Bitdeer tank oil and water temperature chart |
BitdeerPumps
Shows the Bitdeer container exhaust fan as an on/off indicator, driven by data from the cooling system.
Import
import { BitdeerPumps } from '@mdk/foundation'Props
| Prop | Type | Default | Description |
|---|---|---|---|
data | UnknownRecord | none | Bitdeer container record; must contain exhaust fan status |
Basic usage
<BitdeerPumps data={bitdeerContainer} />Styling
.mdk-bitdeer-pumps: Root element.mdk-bitdeer-pumps__status: Title and indicator row.mdk-bitdeer-pumps__title: Label text ("Exhaust Fan")
BitdeerSettings
Top-level Bitdeer container settings view combining container parameter info with editable oil temperature and tank pressure threshold forms and alert coloring.
Import
import { BitdeerSettings } from '@mdk/foundation'Props
| Prop | Type | Default | Description |
|---|---|---|---|
data | UnknownRecord | {} | Bitdeer container device record |
Basic usage
<BitdeerSettings data={bitdeerContainer} />Composition
- Renders
ContainerParamsSettingswith container identity data - Renders
EditableThresholdFormwired with Bitdeer-specific color, flash, and superflash helpers for oil temperature and tank pressure
Styling
.mdk-bitdeer-settings: Root element.mdk-bitdeer-settings__params: Container params section.mdk-bitdeer-settings__thresholds: Editable threshold section
BitdeerTankPressureCharts
Time-series chart of Tank1 and Tank2 pressure in bar for Bitdeer containers, rendered through ContainerChartsBuilder.
Import
import { BitdeerTankPressureCharts } from '@mdk/foundation'Props
| Prop | Type | Default | Description |
|---|---|---|---|
tag | string | none | Container tag used to scope chart data |
chartTitle | string | 'Tank Pressure' | Chart header title |
data | UnknownRecord[] | none | Time-series entries to plot |
timeline | string | '24h' | Initial time range (e.g. '5m', '3h', '1D') |
dateRange | { start?: number; end?: number } | none | Explicit start/end window in ms |
fixedTimezone | string | none | Forces a timezone for axis labels |
height | number | none | Chart height in pixels |
Basic usage
<BitdeerTankPressureCharts
tag="container1"
data={pressureData}
timeline="24h"
/>Lines rendered
- Tank1 Pressure: yellow, backend attribute
tank1_bar_group - Tank2 Pressure: violet, backend attribute
tank2_bar_group - Values are shown in
barwith 1 decimal place
BitdeerTankTempCharts
Time-series chart of hot and cold oil and water temperatures for a specific Bitdeer tank, with lines dynamically built from the tank number.
Import
import { BitdeerTankTempCharts } from '@mdk/foundation'Props
| Prop | Type | Default | Description |
|---|---|---|---|
tag | string | none | Container tag used to scope chart data |
tankNumber | number | string | 1 | Tank index used to build backend attributes |
data | UnknownRecord[] | none | Time-series entries to plot |
timeline | string | '24h' | Initial time range |
dateRange | { start?: number; end?: number } | none | Explicit start/end window in ms |
fixedTimezone | string | none | Forces a timezone for axis labels |
height | number | none | Chart height in pixels |
Basic usage
<BitdeerTankTempCharts
tag="container1"
tankNumber={1}
data={tempData}
timeline="24h"
/>Lines rendered
Tank{n} Oil TempL: yellow (4px), backend attributecold_temp_c_{n}_groupTank{n} Oil TempH: violet,hot_temp_c_{n}_groupTank{n} Water TempL: blue,cold_temp_c_w_{n}_groupTank{n} Water TempH: sky blue,hot_temp_c_w_{n}_group- Values are shown in
°C

