@using FruitBank.Common.Models
@using FruitBankHybrid.Shared.Pages
@inherits LayoutComponentBase

<div class="page">
	<div class="sidebar">
		<NavMenu @ref="_navMenu" />
	</div>
	<main>
		<div class="top-row px-4">
			@if (LoggedInModel.IsLoggedIn)
			{
				<div style="float: left; text-align: left;" class="col-md-8">
					<b>@($"{LoggedInModel.CustomerDto!.FullName} [{string.Join(", ", LoggedInModel.CustomerRoles.Where(x => x.SystemName.Contains("Measuring")).Select(x => x.Name))}]")</b>
				</div>
				<div style="float: right; text-align: right;" class="col-md-4">
					<DxButton Text="Kijelentkezés" Click="OnLogoutClick" />
				</div>
			}
		</div>
		<article class="content px-4">
			<DxToastProvider Name="Positioning"
							 MaxToastCount="199"
							 DisplayTime="@TimeSpan.Zero"
							 FreezeOnClick="true"
							 AnimationType="ToastAnimationType.Slide"
							 HorizontalAlignment="HorizontalAlignment.Right"
							 VerticalAlignment="VerticalEdge.Top"
							 RenderStyle="ToastRenderStyle.Info"
							 ShowCloseButton="true">
			</DxToastProvider>
			<CascadingValue Value="RefreshMainLayoutEventCallback">
				@* @Body *@
				@if (LoggedInModel.IsLoggedIn || IsOnLoginPage)
				{
					@Body
				}

			</CascadingValue>
		</article>
	</main>
</div>

<!-- Custom Toast for Order Notifications -->
<DxToast @ref="orderNotificationToast"
		 Title="@toastTitle"
		 ProviderName="Positioning">
	<div class="order-notification-toast">
		<div class="message">@toastMessage</div>
		@if (!string.IsNullOrEmpty(toastOrderNumber))
		{
			<div class="order-info">
				<span class="label">Rendelés:</span>
				<span class="order-number">#@toastOrderNumber</span>
			</div>
		}
		@if (toastDateOfReceipt.HasValue)
		{
			<div class="order-info">
				<span class="label">Átvétel:</span>
				<span class="date">@toastDateOfReceipt.Value.ToString("yyyy-MM-dd HH:mm")</span>
			</div>
		}
	</div>
</DxToast>

<div id="blazor-error-ui" data-nosnippet>
	An unhandled error has occurred.
	<a href="." class="reload">Reload</a>
	<span class="dismiss">🗙</span>
</div>