marechai/Marechai.App/Presentation/Views/MachineViewPage.xaml

<?xml version="1.0"
      encoding="utf-8"?>

<Page x:Class="Marechai.App.Presentation.Views.MachineViewPage"
      x:Name="PageRoot"
      xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
      xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
      NavigationCacheMode="Disabled"
      Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">

    <Grid RowSpacing="0">
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto" /> <RowDefinition Height="*" />
        </Grid.RowDefinitions>

        <!-- Header with Back Button -->
        <Grid Grid.Row="0"
              Background="{ThemeResource CardBackgroundFillColorDefaultBrush}"
              BorderBrush="{ThemeResource DividerStrokeColorDefaultBrush}"
              BorderThickness="0,0,0,1"
              Padding="12,12,16,12">
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="Auto" /> <ColumnDefinition Width="*" />
            </Grid.ColumnDefinitions>

            <!-- Back Button -->
            <Button Grid.Column="0"
                    Command="{Binding GoBackCommand}"
                    Style="{ThemeResource AlternateButtonStyle}"
                    ToolTipService.ToolTip="Go back"
                    Padding="8"
                    MinWidth="44"
                    MinHeight="44"
                    VerticalAlignment="Center">
                <FontIcon Glyph="&#xE72B;"
                          FontSize="16" />
            </Button>

            <!-- Title Section -->
            <StackPanel Grid.Column="1"
                        Margin="12,0,0,0"
                        VerticalAlignment="Center">
                <TextBlock Text="{Binding MachineName}"
                           FontSize="20"
                           FontWeight="SemiBold"
                           Foreground="{ThemeResource TextControlForeground}"
                           TextTrimming="CharacterEllipsis" />
                <TextBlock Text="{Binding CompanyName}"
                           FontSize="12"
                           Foreground="{ThemeResource SystemBaseMediumColor}"
                           Margin="0,4,0,0" />
            </StackPanel>
        </Grid>

        <!-- Main Content -->
        <Grid Grid.Row="1">

            <!-- Loading State -->
            <StackPanel Visibility="{Binding IsLoading}"
                        VerticalAlignment="Center"
                        HorizontalAlignment="Center"
                        Padding="32"
                        Spacing="16">
                <ProgressRing IsActive="True"
                              IsIndeterminate="True"
                              Height="64"
                              Width="64"
                              Foreground="{ThemeResource SystemAccentColor}" />
                <TextBlock Text="Loading machine details..."
                           FontSize="14"
                           TextAlignment="Center"
                           Foreground="{ThemeResource SystemBaseMediumColor}" />
            </StackPanel>

            <!-- Error State -->
            <StackPanel Visibility="{Binding HasError}"
                        VerticalAlignment="Center"
                        HorizontalAlignment="Center"
                        Padding="24"
                        Spacing="16"
                        MaxWidth="400">
                <InfoBar IsOpen="True"
                         Severity="Error"
                         Title="Unable to Load Machine"
                         Message="{Binding ErrorMessage}"
                         IsClosable="False" />
                <Button Content="Retry"
                        Command="{Binding LoadData}"
                        HorizontalAlignment="Center"
                        Style="{ThemeResource AccentButtonStyle}" />
            </StackPanel>

            <!-- Machine Details -->
            <ScrollViewer Visibility="{Binding IsDataLoaded}"
                          VerticalScrollBarVisibility="Auto"
                          HorizontalScrollBarVisibility="Disabled">
                <StackPanel Padding="16"
                            Spacing="24">

                    <!-- Prototype Badge -->
                    <StackPanel Visibility="{Binding IsPrototype}">
                        <Border Background="{ThemeResource WarningFillColorTertiaryBrush}"
                                BorderBrush="{ThemeResource WarningBorderColorDefaultBrush}"
                                BorderThickness="1"
                                CornerRadius="8"
                                Padding="16,12">
                            <TextBlock Text="PROTOTYPE"
                                       FontSize="14"
                                       FontWeight="Bold"
                                       Foreground="{ThemeResource WarningForegroundColorDefaultBrush}"
                                       TextAlignment="Center" />
                        </Border>
                    </StackPanel>

                    <!-- Introduction Date -->
                    <StackPanel Visibility="{Binding ShowIntroductionDate}"
                                Spacing="8">
                        <TextBlock Text="Introduction Date"
                                   FontSize="12"
                                   FontWeight="SemiBold"
                                   Foreground="{ThemeResource SystemBaseMediumColor}" />
                        <Border Background="{ThemeResource CardBackgroundFillColorDefaultBrush}"
                                BorderBrush="{ThemeResource CardStrokeColorDefaultBrush}"
                                BorderThickness="1"
                                CornerRadius="8"
                                Padding="16,12">
                            <TextBlock Text="{Binding IntroductionDateDisplay}"
                                       FontSize="16"
                                       Foreground="{ThemeResource TextControlForeground}" />
                        </Border>
                    </StackPanel>

                    <!-- Family and Model -->
                    <Grid Visibility="{Binding ShowFamilyOrModel}"
                          ColumnSpacing="16">
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="*" /> <ColumnDefinition Width="*" />
                        </Grid.ColumnDefinitions>

                        <!-- Family -->
                        <StackPanel Grid.Column="0"
                                    Visibility="{Binding ShowFamily}"
                                    Spacing="8">
                            <TextBlock Text="Family"
                                       FontSize="12"
                                       FontWeight="SemiBold"
                                       Foreground="{ThemeResource SystemBaseMediumColor}" />
                            <Border Background="{ThemeResource CardBackgroundFillColorDefaultBrush}"
                                    BorderBrush="{ThemeResource CardStrokeColorDefaultBrush}"
                                    BorderThickness="1"
                                    CornerRadius="8"
                                    Padding="16,12">
                                <TextBlock Text="{Binding FamilyName}"
                                           FontSize="14"
                                           Foreground="{ThemeResource TextControlForeground}"
                                           TextTrimming="CharacterEllipsis" />
                            </Border>
                        </StackPanel>

                        <!-- Model -->
                        <StackPanel Grid.Column="1"
                                    Visibility="{Binding ShowModel}"
                                    Spacing="8">
                            <TextBlock Text="Model"
                                       FontSize="12"
                                       FontWeight="SemiBold"
                                       Foreground="{ThemeResource SystemBaseMediumColor}" />
                            <Border Background="{ThemeResource CardBackgroundFillColorDefaultBrush}"
                                    BorderBrush="{ThemeResource CardStrokeColorDefaultBrush}"
                                    BorderThickness="1"
                                    CornerRadius="8"
                                    Padding="16,12">
                                <TextBlock Text="{Binding ModelName}"
                                           FontSize="14"
                                           Foreground="{ThemeResource TextControlForeground}"
                                           TextTrimming="CharacterEllipsis" />
                            </Border>
                        </StackPanel>
                    </Grid>

                    <!-- Processors Section -->
                    <StackPanel Visibility="{Binding ShowProcessors}"
                                Spacing="12">
                        <TextBlock Text="Processors"
                                   FontSize="14"
                                   FontWeight="SemiBold"
                                   Foreground="{ThemeResource TextControlForeground}" />
                        <ItemsControl ItemsSource="{Binding Processors}"
                                      HorizontalAlignment="Stretch">
                            <ItemsControl.ItemsPanel>
                                <ItemsPanelTemplate>
                                    <StackPanel Orientation="Vertical"
                                                Spacing="8" />
                                </ItemsPanelTemplate>
                            </ItemsControl.ItemsPanel>
                            <ItemsControl.ItemTemplate>
                                <DataTemplate>
                                    <Border Background="{ThemeResource CardBackgroundFillColorDefaultBrush}"
                                            BorderBrush="{ThemeResource CardStrokeColorDefaultBrush}"
                                            BorderThickness="1"
                                            CornerRadius="8"
                                            Padding="16,12">
                                        <StackPanel Spacing="8">
                                            <TextBlock Text="{Binding DisplayName}"
                                                       FontSize="14"
                                                       FontWeight="SemiBold"
                                                       Foreground="{ThemeResource TextControlForeground}" />
                                            <TextBlock Text="{Binding Manufacturer}"
                                                       FontSize="12"
                                                       Foreground="{ThemeResource SystemBaseMediumColor}" />
                                            <TextBlock Text="{Binding DetailsText}"
                                                       FontSize="12"
                                                       Foreground="{ThemeResource SystemBaseMediumColor}"
                                                       TextWrapping="Wrap"
                                                       Visibility="{Binding HasDetails}" />
                                        </StackPanel>
                                    </Border>
                                </DataTemplate>
                            </ItemsControl.ItemTemplate>
                        </ItemsControl>
                    </StackPanel>

                    <!-- Memory Section -->
                    <StackPanel Visibility="{Binding ShowMemory}"
                                Spacing="12">
                        <TextBlock Text="Memory"
                                   FontSize="14"
                                   FontWeight="SemiBold"
                                   Foreground="{ThemeResource TextControlForeground}" />
                        <ItemsControl ItemsSource="{Binding Memory}"
                                      HorizontalAlignment="Stretch">
                            <ItemsControl.ItemsPanel>
                                <ItemsPanelTemplate>
                                    <StackPanel Orientation="Vertical"
                                                Spacing="8" />
                                </ItemsPanelTemplate>
                            </ItemsControl.ItemsPanel>
                            <ItemsControl.ItemTemplate>
                                <DataTemplate>
                                    <Border Background="{ThemeResource CardBackgroundFillColorDefaultBrush}"
                                            BorderBrush="{ThemeResource CardStrokeColorDefaultBrush}"
                                            BorderThickness="1"
                                            CornerRadius="8"
                                            Padding="16,12">
                                        <StackPanel Spacing="6">
                                            <TextBlock Text="{Binding SizeDisplay}"
                                                       FontSize="14"
                                                       FontWeight="SemiBold"
                                                       Foreground="{ThemeResource TextControlForeground}" />
                                            <TextBlock Text="{Binding TypeDisplay}"
                                                       FontSize="12"
                                                       Foreground="{ThemeResource SystemBaseMediumColor}" />
                                        </StackPanel>
                                    </Border>
                                </DataTemplate>
                            </ItemsControl.ItemTemplate>
                        </ItemsControl>
                    </StackPanel>

                    <!-- GPUs Section -->
                    <StackPanel Visibility="{Binding ShowGpus}"
                                Spacing="12">
                        <TextBlock Text="Graphics Processing Units"
                                   FontSize="14"
                                   FontWeight="SemiBold"
                                   Foreground="{ThemeResource TextControlForeground}" />
                        <ItemsControl ItemsSource="{Binding Gpus}"
                                      HorizontalAlignment="Stretch">
                            <ItemsControl.ItemsPanel>
                                <ItemsPanelTemplate>
                                    <StackPanel Orientation="Vertical"
                                                Spacing="8" />
                                </ItemsPanelTemplate>
                            </ItemsControl.ItemsPanel>
                            <ItemsControl.ItemTemplate>
                                <DataTemplate>
                                    <Border Background="{ThemeResource CardBackgroundFillColorDefaultBrush}"
                                            BorderBrush="{ThemeResource CardStrokeColorDefaultBrush}"
                                            BorderThickness="1"
                                            CornerRadius="8"
                                            Padding="16,12">
                                        <StackPanel Spacing="8">
                                            <TextBlock Text="{Binding DisplayName}"
                                                       FontSize="14"
                                                       FontWeight="SemiBold"
                                                       Foreground="{ThemeResource TextControlForeground}" />
                                            <TextBlock Text="{Binding Manufacturer}"
                                                       FontSize="12"
                                                       Foreground="{ThemeResource SystemBaseMediumColor}"
                                                       Visibility="{Binding HasManufacturer}" />
                                        </StackPanel>
                                    </Border>
                                </DataTemplate>
                            </ItemsControl.ItemTemplate>
                        </ItemsControl>
                    </StackPanel>

                    <!-- Sound Synthesizers Section -->
                    <StackPanel Visibility="{Binding ShowSoundSynthesizers}"
                                Spacing="12">
                        <TextBlock Text="Sound Synthesizers"
                                   FontSize="14"
                                   FontWeight="SemiBold"
                                   Foreground="{ThemeResource TextControlForeground}" />
                        <ItemsControl ItemsSource="{Binding SoundSynthesizers}"
                                      HorizontalAlignment="Stretch">
                            <ItemsControl.ItemsPanel>
                                <ItemsPanelTemplate>
                                    <StackPanel Orientation="Vertical"
                                                Spacing="8" />
                                </ItemsPanelTemplate>
                            </ItemsControl.ItemsPanel>
                            <ItemsControl.ItemTemplate>
                                <DataTemplate>
                                    <Border Background="{ThemeResource CardBackgroundFillColorDefaultBrush}"
                                            BorderBrush="{ThemeResource CardStrokeColorDefaultBrush}"
                                            BorderThickness="1"
                                            CornerRadius="8"
                                            Padding="16,12">
                                        <StackPanel Spacing="8">
                                            <TextBlock Text="{Binding DisplayName}"
                                                       FontSize="14"
                                                       FontWeight="SemiBold"
                                                       Foreground="{ThemeResource TextControlForeground}" />
                                            <TextBlock Text="{Binding DetailsText}"
                                                       FontSize="12"
                                                       Foreground="{ThemeResource SystemBaseMediumColor}"
                                                       TextWrapping="Wrap"
                                                       Visibility="{Binding HasDetails}" />
                                        </StackPanel>
                                    </Border>
                                </DataTemplate>
                            </ItemsControl.ItemTemplate>
                        </ItemsControl>
                    </StackPanel>

                    <!-- Storage Section -->
                    <StackPanel Visibility="{Binding ShowStorage}"
                                Spacing="12">
                        <TextBlock Text="Storage"
                                   FontSize="14"
                                   FontWeight="SemiBold"
                                   Foreground="{ThemeResource TextControlForeground}" />
                        <ItemsControl ItemsSource="{Binding Storage}"
                                      HorizontalAlignment="Stretch">
                            <ItemsControl.ItemsPanel>
                                <ItemsPanelTemplate>
                                    <StackPanel Orientation="Vertical"
                                                Spacing="8" />
                                </ItemsPanelTemplate>
                            </ItemsControl.ItemsPanel>
                            <ItemsControl.ItemTemplate>
                                <DataTemplate>
                                    <Border Background="{ThemeResource CardBackgroundFillColorDefaultBrush}"
                                            BorderBrush="{ThemeResource CardStrokeColorDefaultBrush}"
                                            BorderThickness="1"
                                            CornerRadius="8"
                                            Padding="16,12">
                                        <StackPanel Spacing="6">
                                            <TextBlock Text="{Binding DisplayText}"
                                                       FontSize="13"
                                                       Foreground="{ThemeResource TextControlForeground}"
                                                       TextWrapping="Wrap" />
                                            <TextBlock Text="{Binding TypeNote}"
                                                       FontSize="11"
                                                       Foreground="{ThemeResource SystemBaseMediumColor}"
                                                       TextWrapping="Wrap" />
                                        </StackPanel>
                                    </Border>
                                </DataTemplate>
                            </ItemsControl.ItemTemplate>
                        </ItemsControl>
                    </StackPanel>

                    <!-- Bottom Spacing -->
                    <Border Height="24" />

                </StackPanel>
            </ScrollViewer>

        </Grid>

    </Grid>

</Page>