BCSH1-TournamentApp/TournamentOrganizer/Views/TeamsView.axaml

<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="using:TournamentOrganizer.ViewModels"
             mc:Ignorable="d" d:DesignWidth="1000" d:DesignHeight="600"
             x:Class="TournamentOrganizer.Views.TeamsView"
             x:DataType="vm:TeamsViewModel">
  <Design.DataContext>
    <vm:TeamsViewModel />
  </Design.DataContext>

  <UserControl.Styles>
    <Style Selector="Button.dropdown-item">
      <Setter Property="Padding" Value="8,4"/>
      <Setter Property="BorderThickness" Value="0"/>
      <Setter Property="Background" Value="Transparent"/>
      <Setter Property="HorizontalContentAlignment" Value="Left"/>
    </Style>
    <Style Selector="Button.dropdown-item:pointerover">
      <Setter Property="Background" Value="{DynamicResource SystemControlBackgroundListLowBrush}"/>
    </Style>
  </UserControl.Styles>

  <Grid RowDefinitions="Auto,*,Auto" ColumnDefinitions="*,*">
    <TextBlock Grid.ColumnSpan="2" Grid.Row="0" Text="Teams Management" FontSize="20" FontWeight="Bold" Margin="16,16,16,8"/>

    <!-- Left Panel: Team List and Filters -->
    <Border Grid.Column="0" Grid.Row="1" BorderBrush="Gray" BorderThickness="1" Margin="8" CornerRadius="4" Padding="8">
      <DockPanel>
        <!-- Header with New Team button -->
        <DockPanel DockPanel.Dock="Top" Margin="0,0,0,8">
          <Button Command="{Binding CreateNewTeamCommand}" DockPanel.Dock="Right" Padding="8,4">
            <StackPanel Orientation="Horizontal" Spacing="4">
              <TextBlock Text="+" FontSize="16" FontWeight="Bold" VerticalAlignment="Center"/>
              <TextBlock Text="New Team" VerticalAlignment="Center"/>
            </StackPanel>
          </Button>
          <TextBlock Text="Teams" FontSize="16" FontWeight="SemiBold" VerticalAlignment="Center"/>
        </DockPanel>

        <!-- Filters -->
        <StackPanel DockPanel.Dock="Top" Spacing="6" Margin="0,0,0,8">
          <TextBlock Text="Filters" FontWeight="SemiBold" FontSize="12"/>
          <TextBox Watermark="Filter by member name..." Text="{Binding FilterMemberName}"/>

          <!-- Event Filter Dropdown -->
          <Panel Name="EventFilterPanel">
            <ToggleButton Name="EventFilterToggle" HorizontalContentAlignment="Left" HorizontalAlignment="Stretch" Padding="8,6"
                          IsChecked="{Binding IsEventDropdownOpen}">
              <ToggleButton.Template>
                <ControlTemplate TargetType="ToggleButton">
                  <Border Background="{TemplateBinding Background}" BorderBrush="Gray" BorderThickness="1" CornerRadius="4">
                    <ContentPresenter Content="{TemplateBinding Content}" Margin="{TemplateBinding Padding}" HorizontalAlignment="Left"/>
                  </Border>
                </ControlTemplate>
              </ToggleButton.Template>
              <ToggleButton.Content>
                <Panel>
                  <TextBlock Text="{Binding SelectedEventFilter, Mode=OneWay}"/>
                  <TextBlock Text="Filter by event..." Foreground="Gray" IsVisible="{Binding SelectedEventFilter, Converter={x:Static ObjectConverters.IsNull}}"/>
                </Panel>
              </ToggleButton.Content>
            </ToggleButton>
            <Popup IsOpen="{Binding IsEventDropdownOpen}" PlacementTarget="{Binding #EventFilterToggle}" Width="{Binding Bounds.Width, ElementName=EventFilterToggle}">
              <Border Background="{DynamicResource SystemControlBackgroundChromeMediumBrush}" BorderBrush="Gray" BorderThickness="1" CornerRadius="4">
                <DockPanel MaxHeight="200">
                  <TextBox DockPanel.Dock="Top" Text="{Binding EventFilterSearch}" Watermark="Search events..." Margin="4" Padding="6,4"/>
                  <Button DockPanel.Dock="Bottom" Content="All" Classes="dropdown-item" Foreground="Gray" Margin="4,0,4,4"
                          Click="OnClearEventFilter"/>
                  <ListBox ItemsSource="{Binding FilteredEvents}" MaxHeight="160">
                    <ListBox.ItemTemplate>
                      <DataTemplate x:DataType="x:String">
                        <Button Content="{Binding}" Classes="dropdown-item" Click="OnEventSelected"/>
                      </DataTemplate>
                    </ListBox.ItemTemplate>
                  </ListBox>
                </DockPanel>
              </Border>
            </Popup>
          </Panel>

          <!-- Tournament Filter Dropdown -->
          <Panel Name="TournamentFilterPanel">
            <ToggleButton Name="TournamentFilterToggle" HorizontalContentAlignment="Left" HorizontalAlignment="Stretch" Padding="8,6"
                          IsChecked="{Binding IsTournamentDropdownOpen}">
              <ToggleButton.Template>
                <ControlTemplate TargetType="ToggleButton">
                  <Border Background="{TemplateBinding Background}" BorderBrush="Gray" BorderThickness="1" CornerRadius="4">
                    <ContentPresenter Content="{TemplateBinding Content}" Margin="{TemplateBinding Padding}" HorizontalAlignment="Left"/>
                  </Border>
                </ControlTemplate>
              </ToggleButton.Template>
              <ToggleButton.Content>
                <Panel>
                  <TextBlock Text="{Binding SelectedTournamentFilter, Mode=OneWay}"/>
                  <TextBlock Text="Filter by tournament..." Foreground="Gray" IsVisible="{Binding SelectedTournamentFilter, Converter={x:Static ObjectConverters.IsNull}}"/>
                </Panel>
              </ToggleButton.Content>
            </ToggleButton>
            <Popup IsOpen="{Binding IsTournamentDropdownOpen}" PlacementTarget="{Binding #TournamentFilterToggle}" Width="{Binding Bounds.Width, ElementName=TournamentFilterToggle}">
              <Border Background="{DynamicResource SystemControlBackgroundChromeMediumBrush}" BorderBrush="Gray" BorderThickness="1" CornerRadius="4">
                <DockPanel MaxHeight="200">
                  <TextBox DockPanel.Dock="Top" Text="{Binding TournamentFilterSearch}" Watermark="Search tournaments..." Margin="4" Padding="6,4"/>
                  <Button DockPanel.Dock="Bottom" Content="All" Classes="dropdown-item" Foreground="Gray" Margin="4,0,4,4"
                          Click="OnClearTournamentFilter"/>
                  <ListBox ItemsSource="{Binding FilteredTournaments}" MaxHeight="160">
                    <ListBox.ItemTemplate>
                      <DataTemplate x:DataType="x:String">
                        <Button Content="{Binding}" Classes="dropdown-item" Click="OnTournamentSelected"/>
                      </DataTemplate>
                    </ListBox.ItemTemplate>
                  </ListBox>
                </DockPanel>
              </Border>
            </Popup>
          </Panel>
        </StackPanel>

        <!-- Team List -->
        <ListBox ItemsSource="{Binding Teams}"
                 SelectedItem="{Binding SelectedTeam}">
          <ListBox.ItemTemplate>
            <DataTemplate x:DataType="vm:TeamDisplay">
              <StackPanel Spacing="2">
                <TextBlock Text="{Binding Name}" FontWeight="SemiBold"/>
                <TextBlock Text="{Binding LeaderName, StringFormat='Leader: {0}'}" FontSize="11" Foreground="Gray"/>
                <TextBlock Text="{Binding Players.Count, StringFormat='{}{0} members'}" FontSize="11" Foreground="Gray"/>
                <ItemsControl ItemsSource="{Binding AssociatedEvents}">
                  <ItemsControl.ItemTemplate>
                    <DataTemplate x:DataType="x:String">
                      <TextBlock Text="{Binding, StringFormat='Event: {0}'}" FontSize="10" Foreground="#1976D2"/>
                    </DataTemplate>
                  </ItemsControl.ItemTemplate>
                </ItemsControl>
                <ItemsControl ItemsSource="{Binding AssociatedTournaments}">
                  <ItemsControl.ItemTemplate>
                    <DataTemplate x:DataType="x:String">
                      <TextBlock Text="{Binding, StringFormat='Tournament: {0}'}" FontSize="10" Foreground="#F57C00"/>
                    </DataTemplate>
                  </ItemsControl.ItemTemplate>
                </ItemsControl>
              </StackPanel>
            </DataTemplate>
          </ListBox.ItemTemplate>
        </ListBox>
      </DockPanel>
    </Border>

    <!-- Right Panel: Team Editor -->
    <Border Grid.Column="1" Grid.Row="1" BorderBrush="Gray" BorderThickness="1" Margin="8" CornerRadius="4" Padding="8">
      <DockPanel>
        <TextBlock DockPanel.Dock="Top" Text="Team Details" FontSize="16" FontWeight="SemiBold" Margin="0,0,0,8"/>

        <StackPanel DockPanel.Dock="Bottom" Spacing="6" Margin="0,8,0,0">
          <Button Content="Save Team" Command="{Binding SaveTeamCommand}" HorizontalAlignment="Stretch" IsEnabled="{Binding IsEditing}"/>
          <Button Content="Delete Team" Command="{Binding DeleteTeamCommand}" HorizontalAlignment="Stretch" IsEnabled="{Binding IsEditing}"/>
        </StackPanel>

        <ScrollViewer>
          <StackPanel Spacing="8" IsEnabled="{Binding IsEditing}">
            <!-- Team Name -->
            <StackPanel Spacing="4">
              <TextBlock Text="Team Name" FontWeight="SemiBold"/>
              <TextBox Text="{Binding TeamName}"/>
            </StackPanel>

            <!-- Members Section -->
            <StackPanel Spacing="4">
              <TextBlock Text="Members" FontWeight="SemiBold"/>

              <!-- Add Player Form -->
              <Grid ColumnDefinitions="*,*,Auto" RowDefinitions="Auto,Auto" RowSpacing="4" ColumnSpacing="4">
                <TextBox Grid.Row="0" Grid.Column="0" Watermark="Player name" Text="{Binding NewPlayerName}"/>
                <TextBox Grid.Row="0" Grid.Column="1" Watermark="Contact (optional)" Text="{Binding NewPlayerContact}"/>
                <Button Grid.Row="0" Grid.Column="2" Content="Add" Command="{Binding AddPlayerCommand}" VerticalAlignment="Center"/>

                <Button Grid.Row="1" Grid.Column="0" Content="Remove" Command="{Binding RemovePlayerCommand}"/>
                <Button Grid.Row="1" Grid.Column="1" Content="Set as Leader" Command="{Binding SetLeaderCommand}"/>
              </Grid>

              <!-- Players List -->
              <ListBox ItemsSource="{Binding Players}"
                       SelectedItem="{Binding SelectedPlayer}"
                       MinHeight="150"
                       MaxHeight="250">
                <ListBox.ItemTemplate>
                  <DataTemplate x:DataType="vm:PlayerEntry">
                    <StackPanel Orientation="Horizontal" Spacing="8">
                      <TextBlock Text="{Binding Name}" FontWeight="SemiBold"/>
                      <TextBlock Text="{Binding Contact}" Foreground="Gray" FontSize="11"/>
                    </StackPanel>
                  </DataTemplate>
                </ListBox.ItemTemplate>
              </ListBox>
            </StackPanel>

            <!-- Current Leader Display -->
            <StackPanel Spacing="4">
              <TextBlock Text="Current Leader" FontWeight="SemiBold"/>
              <TextBlock Text="{Binding SelectedLeader.Name}" IsVisible="{Binding SelectedLeader, Converter={x:Static ObjectConverters.IsNotNull}}"/>
              <TextBlock Text="No leader set" IsVisible="{Binding SelectedLeader, Converter={x:Static ObjectConverters.IsNull}}" Foreground="Gray"/>
            </StackPanel>
          </StackPanel>
        </ScrollViewer>
      </DockPanel>
    </Border>

    <!-- Status Bar -->
    <TextBlock Grid.ColumnSpan="2" Grid.Row="2" Text="{Binding StatusMessage}" Margin="8" Foreground="Gray" FontSize="12"/>
  </Grid>
</UserControl>