<UserControl xmlns="https://github.com/avaloniaui"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
             xmlns:vm="clr-namespace:AdvancedCalculator.ViewModels"
             xmlns:m="clr-namespace:AdvancedCalculator.Models"
             xmlns:conv="clr-namespace:AdvancedCalculator.Converters"
             mc:Ignorable="d" d:DesignWidth="900" d:DesignHeight="600"
             x:Class="AdvancedCalculator.Views.MainView"
             x:DataType="vm:MainViewModel">
  <UserControl.Resources>
    <conv:BoolToGridLengthConverter x:Key="BoolToGridLengthConverter" />
  </UserControl.Resources>

  <Grid ColumnDefinitions="*,3*">
    <!-- Left column: Variables + Functions -->
    <Grid Grid.Column="0">
      <Grid.RowDefinitions>
        <RowDefinition Height="*" />
        <RowDefinition Height="{Binding IsFunctionsPanelOpen, Converter={StaticResource BoolToGridLengthConverter}}" />
      </Grid.RowDefinitions>

      <!-- Variables list -->
      <ListBox Grid.Row="0" ItemsSource="{Binding Variables}" SelectedIndex="-1">
        <ListBox.ItemTemplate>
          <DataTemplate x:DataType="m:VariableItem">
            <Grid ColumnDefinitions="Auto,*,Auto" Margin="4,2">
              <TextBlock Grid.Column="0" FontFamily="{StaticResource MDI}"
                         FontSize="22" Text="{Binding Icon}" VerticalAlignment="Center" Margin="0,0,8,0" />
              <TextBlock Grid.Column="1" Text="{Binding VariableName}" FontWeight="Bold" VerticalAlignment="Center" />
              <StackPanel Grid.Column="2" Spacing="2">
                <TextBlock Text="{Binding Value}" />
                <TextBlock IsVisible="{Binding IsExpression}" Text="{Binding ExpressionComputation}" FontStyle="Italic" />
              </StackPanel>
            </Grid>
          </DataTemplate>
        </ListBox.ItemTemplate>
      </ListBox>

      <!-- Function definitions -->
      <ListBox Grid.Row="1" BorderThickness="0"
               ItemsSource="{x:Static m:FunctionDefinitionItem.DefinedFunctions}">
        <ListBox.ItemTemplate>
          <DataTemplate x:DataType="m:FunctionDefinitionItem">
            <StackPanel Spacing="2" Margin="4,6">
              <StackPanel Orientation="Horizontal" Spacing="6">
                <TextBlock FontFamily="{StaticResource MDI}" Text="{Binding Icon}" />
                <TextBlock Text="{Binding FunctionName}" FontWeight="Bold" />
              </StackPanel>
              <TextBlock Text="{Binding FunctionDescription}" FontStyle="Italic" TextWrapping="Wrap" />
              <ItemsControl ItemsSource="{Binding FunctionArguments}">
                <ItemsControl.ItemTemplate>
                  <DataTemplate>
                    <StackPanel>
                      <TextBlock Text="{Binding Key}" />
                      <TextBlock Text="{Binding Value}" FontStyle="Italic" Margin="8,0,0,0" />
                    </StackPanel>
                  </DataTemplate>
                </ItemsControl.ItemTemplate>
              </ItemsControl>
            </StackPanel>
          </DataTemplate>
        </ListBox.ItemTemplate>
      </ListBox>
    </Grid>

    <!-- GridSplitter between columns -->
    <GridSplitter Grid.Column="0" HorizontalAlignment="Right" Width="5" Background="Transparent" />

    <!-- Right column: History + Input -->
    <Grid Grid.Column="1" RowDefinitions="*,Auto">
      <!-- History -->
      <ListBox Grid.Row="0" ItemsSource="{Binding History}" SelectedIndex="{Binding SelectedHistoryIndex}">
        <ListBox.ItemTemplate>
          <DataTemplate x:DataType="m:HistoryItem">
            <Grid ColumnDefinitions="Auto,*" Margin="4,2">
              <TextBlock FontFamily="{StaticResource MDI}" Text="{x:Static m:IconFont.ArrowRightDropCircle}"
                         FontSize="22" VerticalAlignment="Center" Margin="0,0,8,0" />
              <StackPanel Grid.Column="1">
                <TextBlock Text="{Binding Input}" />
                <TextBlock Text="{Binding Output}" FontWeight="Bold" />
              </StackPanel>
            </Grid>
          </DataTemplate>
        </ListBox.ItemTemplate>
      </ListBox>

      <!-- Input Row -->
      <Grid Grid.Row="1" ColumnDefinitions="Auto,*" Margin="4">
        <Button Command="{Binding ToggleFunctionsCommand}" Margin="0,0,6,0">
          <TextBlock FontFamily="{StaticResource MDI}" Text="{x:Static m:IconFont.Function}" />
        </Button>
        <TextBox Grid.Column="1" Text="{Binding InputText, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}">
          <InputElement.KeyBindings>
            <KeyBinding Gesture="Enter" Command="{Binding SubmitCommand}" />
          </InputElement.KeyBindings>
        </TextBox>
      </Grid>
    </Grid>
  </Grid>
</UserControl>
