<script lang="ts">
	import type { AMSStatus } from '$lib/messages';

	export let status: AMSStatus | undefined;
</script>

<div class="master-content">
	{#if status}
		<h2><b>Master Status</b></h2>
		<div class="log-collumn">
			<div>State: {status.state}</div>
			<div>SDC Closed: {status.sdcClosed}</div>
			<div>SoC: {status.soc}</div>
			<div>Min. cell voltage: {Math.round(status.minCellVolt * 100) / 100}</div>
			<div>Max. cell temperature: {Math.round(status.maxCellTemp * 100) / 100}</div>
		</div>
	{/if}
</div>

<style>
	.master-content {
		display: flex;
		flex-direction: column;
		width: 12vw;
		border: 2px solid black;
		padding: 2px;
		margin: 2px;
	}

	.log-collumn {
		display: flex;
		flex-direction: column;
	}

	h2 {
		text-align: center;
	}
</style>
