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

<?xml version="1.0" encoding="utf-8"?>
<Page x:Class="Marechai.App.Presentation.Views.ProcessorDetailPage"
      x:Name="PageRoot"
      xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
      xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
      xmlns:utu="using:Uno.Toolkit.UI"
      NavigationCacheMode="Required"
      Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">

    <Grid utu:SafeArea.Insets="VisibleBounds">
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto" />
            <RowDefinition Height="*" />
        </Grid.RowDefinitions>

        <!-- Header -->
        <utu:NavigationBar Grid.Row="0"
                           Content="{Binding Path=Title}"
                           MainCommandMode="Action">
            <utu:NavigationBar.MainCommand>
                <AppBarButton Icon="Back"
                              Label="Back"
                              Command="{Binding GoBackCommand}"
                              AutomationProperties.Name="Go back" />
            </utu:NavigationBar.MainCommand>
        </utu:NavigationBar>

        <!-- Content -->
        <ScrollViewer Grid.Row="1">
            <StackPanel Padding="16"
                        Spacing="16">

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

                <!-- Error State -->
                <StackPanel Visibility="{Binding HasError}"
                            Padding="16"
                            Background="{ThemeResource SystemErrorBackgroundColor}"
                            CornerRadius="8"
                            Spacing="8">
                    <TextBlock Text="Error"
                               FontWeight="Bold"
                               Foreground="{ThemeResource SystemErrorTextForegroundColor}" />
                    <TextBlock Text="{Binding ErrorMessage}"
                               Foreground="{ThemeResource SystemErrorTextForegroundColor}"
                               TextWrapping="Wrap" />
                </StackPanel>

                <!-- Processor Details -->
                <StackPanel Visibility="{Binding IsDataLoaded}"
                            Spacing="16">

                    <!-- Processor Name -->
                    <TextBlock Text="{Binding Processor.Name}"
                               FontSize="28"
                               FontWeight="Bold"
                               TextWrapping="Wrap" />

                    <!-- Company/Manufacturer -->
                    <StackPanel Background="{ThemeResource CardBackgroundFillColorDefaultBrush}"
                                CornerRadius="8"
                                Padding="12"
                                Spacing="8">
                        <TextBlock Text="Manufacturer"
                                   FontSize="14"
                                   FontWeight="SemiBold"
                                   Foreground="{ThemeResource SystemBaseMediumColor}" />
                        <TextBlock Text="{Binding ManufacturerName}"
                                   FontSize="14"
                                   TextWrapping="Wrap" />
                    </StackPanel>

                    <!-- Model Code -->
                    <StackPanel Visibility="{Binding Processor.ModelCode, Converter={StaticResource StringToVisibilityConverter}}"
                                Background="{ThemeResource CardBackgroundFillColorDefaultBrush}"
                                CornerRadius="8"
                                Padding="12"
                                Spacing="8">
                        <TextBlock Text="Model Code"
                                   FontSize="14"
                                   FontWeight="SemiBold"
                                   Foreground="{ThemeResource SystemBaseMediumColor}" />
                        <TextBlock Text="{Binding Processor.ModelCode}"
                                   FontSize="14"
                                   TextWrapping="Wrap" />
                    </StackPanel>

                    <!-- Introduced Date -->
                    <StackPanel Visibility="{Binding Processor.Introduced, Converter={StaticResource ObjectToVisibilityConverter}}"
                                Background="{ThemeResource CardBackgroundFillColorDefaultBrush}"
                                CornerRadius="8"
                                Padding="12"
                                Spacing="8">
                        <TextBlock Text="Introduced"
                                   FontSize="14"
                                   FontWeight="SemiBold"
                                   Foreground="{ThemeResource SystemBaseMediumColor}" />
                        <TextBlock Text="{Binding Processor.Introduced}"
                                   FontSize="14" />
                    </StackPanel>

                    <!-- Speed -->
                    <StackPanel Visibility="{Binding Processor.Speed, Converter={StaticResource ObjectToVisibilityConverter}}"
                                Background="{ThemeResource CardBackgroundFillColorDefaultBrush}"
                                CornerRadius="8"
                                Padding="12"
                                Spacing="8">
                        <TextBlock Text="Speed (MHz)"
                                   FontSize="14"
                                   FontWeight="SemiBold"
                                   Foreground="{ThemeResource SystemBaseMediumColor}" />
                        <TextBlock Text="{Binding Processor.Speed}"
                                   FontSize="14"
                                   TextWrapping="Wrap" />
                    </StackPanel>

                    <!-- Package -->
                    <StackPanel Visibility="{Binding Processor.Package, Converter={StaticResource StringToVisibilityConverter}}"
                                Background="{ThemeResource CardBackgroundFillColorDefaultBrush}"
                                CornerRadius="8"
                                Padding="12"
                                Spacing="8">
                        <TextBlock Text="Package"
                                   FontSize="14"
                                   FontWeight="SemiBold"
                                   Foreground="{ThemeResource SystemBaseMediumColor}" />
                        <TextBlock Text="{Binding Processor.Package}"
                                   FontSize="14"
                                   TextWrapping="Wrap" />
                    </StackPanel>

                    <!-- Cores -->
                    <StackPanel Visibility="{Binding Processor.Cores, Converter={StaticResource ObjectToVisibilityConverter}}"
                                Background="{ThemeResource CardBackgroundFillColorDefaultBrush}"
                                CornerRadius="8"
                                Padding="12"
                                Spacing="8">
                        <TextBlock Text="Cores"
                                   FontSize="14"
                                   FontWeight="SemiBold"
                                   Foreground="{ThemeResource SystemBaseMediumColor}" />
                        <TextBlock Text="{Binding Processor.Cores}"
                                   FontSize="14"
                                   TextWrapping="Wrap" />
                    </StackPanel>

                    <!-- Threads Per Core -->
                    <StackPanel Visibility="{Binding Processor.ThreadsPerCore, Converter={StaticResource ObjectToVisibilityConverter}}"
                                Background="{ThemeResource CardBackgroundFillColorDefaultBrush}"
                                CornerRadius="8"
                                Padding="12"
                                Spacing="8">
                        <TextBlock Text="Threads Per Core"
                                   FontSize="14"
                                   FontWeight="SemiBold"
                                   Foreground="{ThemeResource SystemBaseMediumColor}" />
                        <TextBlock Text="{Binding Processor.ThreadsPerCore}"
                                   FontSize="14"
                                   TextWrapping="Wrap" />
                    </StackPanel>

                    <!-- Process -->
                    <StackPanel Visibility="{Binding Processor.Process, Converter={StaticResource StringToVisibilityConverter}}"
                                Background="{ThemeResource CardBackgroundFillColorDefaultBrush}"
                                CornerRadius="8"
                                Padding="12"
                                Spacing="8">
                        <TextBlock Text="Process"
                                   FontSize="14"
                                   FontWeight="SemiBold"
                                   Foreground="{ThemeResource SystemBaseMediumColor}" />
                        <TextBlock Text="{Binding Processor.Process}"
                                   FontSize="14"
                                   TextWrapping="Wrap" />
                    </StackPanel>

                    <!-- Process (nm) -->
                    <StackPanel Visibility="{Binding Processor.ProcessNm, Converter={StaticResource StringToVisibilityConverter}}"
                                Background="{ThemeResource CardBackgroundFillColorDefaultBrush}"
                                CornerRadius="8"
                                Padding="12"
                                Spacing="8">
                        <TextBlock Text="Process (nm)"
                                   FontSize="14"
                                   FontWeight="SemiBold"
                                   Foreground="{ThemeResource SystemBaseMediumColor}" />
                        <TextBlock Text="{Binding Processor.ProcessNm}"
                                   FontSize="14"
                                   TextWrapping="Wrap" />
                    </StackPanel>

                    <!-- Die Size -->
                    <StackPanel Visibility="{Binding Processor.DieSize, Converter={StaticResource ObjectToVisibilityConverter}}"
                                Background="{ThemeResource CardBackgroundFillColorDefaultBrush}"
                                CornerRadius="8"
                                Padding="12"
                                Spacing="8">
                        <TextBlock Text="Die Size (mm²)"
                                   FontSize="14"
                                   FontWeight="SemiBold"
                                   Foreground="{ThemeResource SystemBaseMediumColor}" />
                        <TextBlock Text="{Binding Processor.DieSize}"
                                   FontSize="14"
                                   TextWrapping="Wrap" />
                    </StackPanel>

                    <!-- Transistors -->
                    <StackPanel Visibility="{Binding Processor.Transistors, Converter={StaticResource ObjectToVisibilityConverter}}"
                                Background="{ThemeResource CardBackgroundFillColorDefaultBrush}"
                                CornerRadius="8"
                                Padding="12"
                                Spacing="8">
                        <TextBlock Text="Transistors"
                                   FontSize="14"
                                   FontWeight="SemiBold"
                                   Foreground="{ThemeResource SystemBaseMediumColor}" />
                        <TextBlock Text="{Binding Processor.Transistors}"
                                   FontSize="14"
                                   TextWrapping="Wrap" />
                    </StackPanel>

                    <!-- Computers Section -->
                    <StackPanel Visibility="{Binding HasComputers}"
                                Spacing="8">
                        <StackPanel Orientation="Horizontal"
                                    Spacing="8">
                            <TextBlock Text="Computers"
                                       FontSize="14"
                                       FontWeight="SemiBold"
                                       Foreground="{ThemeResource SystemBaseMediumColor}" />
                            <TextBlock Text="{Binding Computers.Count}"
                                       FontSize="14"
                                       FontWeight="Bold"
                                       Foreground="{ThemeResource SystemAccentColor}" />
                        </StackPanel>

                        <!-- Filter Box -->
                        <AutoSuggestBox PlaceholderText="Filter computers..."
                                        Text="{Binding ComputersFilterText, Mode=TwoWay}"
                                        TextChanged="ComputersSearchBox_TextChanged"
                                        BorderThickness="1"
                                        BorderBrush="{ThemeResource ControlElevationBorderBrush}" />

                        <!-- Scrollable Computers List -->
                        <ScrollViewer Height="200"
                                      BorderThickness="1"
                                      BorderBrush="{ThemeResource ControlElevationBorderBrush}"
                                      CornerRadius="8">
                            <ItemsRepeater ItemsSource="{Binding FilteredComputers}"
                                           Margin="0">
                                <ItemsRepeater.Layout>
                                    <StackLayout Spacing="4" />
                                </ItemsRepeater.Layout>
                                <ItemsRepeater.ItemTemplate>
                                    <DataTemplate>
                                        <Button Click="Computer_Click"
                                                Tag="{Binding Id}"
                                                HorizontalAlignment="Stretch"
                                                HorizontalContentAlignment="Left"
                                                Padding="12"
                                                Margin="0,4">
                                            <StackPanel Spacing="4"
                                                        HorizontalAlignment="Left">
                                                <TextBlock Text="{Binding Name}"
                                                           FontSize="14"
                                                           FontWeight="SemiBold" />
                                                <StackPanel Orientation="Horizontal"
                                                            Spacing="8">
                                                    <TextBlock Text="{Binding Manufacturer}"
                                                               FontSize="12"
                                                               Foreground="{ThemeResource SystemBaseMediumColor}" />
                                                    <TextBlock Text="{Binding YearDisplay}"
                                                               FontSize="12"
                                                               Foreground="{ThemeResource SystemBaseMediumColor}" />
                                                </StackPanel>
                                            </StackPanel>
                                        </Button>
                                    </DataTemplate>
                                </ItemsRepeater.ItemTemplate>
                            </ItemsRepeater>
                        </ScrollViewer>
                    </StackPanel>

                    <!-- Consoles Section -->
                    <StackPanel Visibility="{Binding HasConsoles}"
                                Spacing="8">
                        <StackPanel Orientation="Horizontal"
                                    Spacing="8">
                            <TextBlock Text="Consoles"
                                       FontSize="14"
                                       FontWeight="SemiBold"
                                       Foreground="{ThemeResource SystemBaseMediumColor}" />
                            <TextBlock Text="{Binding Consoles.Count}"
                                       FontSize="14"
                                       FontWeight="Bold"
                                       Foreground="{ThemeResource SystemAccentColor}" />
                        </StackPanel>

                        <!-- Filter Box -->
                        <AutoSuggestBox PlaceholderText="Filter consoles..."
                                        Text="{Binding ConsoelsFilterText, Mode=TwoWay}"
                                        TextChanged="ConsolesSearchBox_TextChanged"
                                        BorderThickness="1"
                                        BorderBrush="{ThemeResource ControlElevationBorderBrush}" />

                        <!-- Scrollable Consoles List -->
                        <ScrollViewer Height="200"
                                      BorderThickness="1"
                                      BorderBrush="{ThemeResource ControlElevationBorderBrush}"
                                      CornerRadius="8">
                            <ItemsRepeater ItemsSource="{Binding FilteredConsoles}"
                                           Margin="0">
                                <ItemsRepeater.Layout>
                                    <StackLayout Spacing="4" />
                                </ItemsRepeater.Layout>
                                <ItemsRepeater.ItemTemplate>
                                    <DataTemplate>
                                        <Button Click="Console_Click"
                                                Tag="{Binding Id}"
                                                HorizontalAlignment="Stretch"
                                                HorizontalContentAlignment="Left"
                                                Padding="12"
                                                Margin="0,4">
                                            <StackPanel Spacing="4"
                                                        HorizontalAlignment="Left">
                                                <TextBlock Text="{Binding Name}"
                                                           FontSize="14"
                                                           FontWeight="SemiBold" />
                                                <StackPanel Orientation="Horizontal"
                                                            Spacing="8">
                                                    <TextBlock Text="{Binding Manufacturer}"
                                                               FontSize="12"
                                                               Foreground="{ThemeResource SystemBaseMediumColor}" />
                                                    <TextBlock Text="{Binding YearDisplay}"
                                                               FontSize="12"
                                                               Foreground="{ThemeResource SystemBaseMediumColor}" />
                                                </StackPanel>
                                            </StackPanel>
                                        </Button>
                                    </DataTemplate>
                                </ItemsRepeater.ItemTemplate>
                            </ItemsRepeater>
                        </ScrollViewer>
                    </StackPanel>

                </StackPanel>

            </StackPanel>
        </ScrollViewer>

    </Grid>

</Page>