Data model visualization - Simplified and improved VMs

Layer conditions - Added left side property selection
2026-11-12 11:56:30 +00:00 · 2020-07-05 15:34:16 +02:00
1 parent f9d26a8ba3
commit c0f2cf08de
@@ -1,16 +1,28 @@
-using Stylet;
+using Artemis.Core.Models.Profile.Conditions;
+using Artemis.Core.Models.Profile.Conditions.Abstract;
+using Stylet;

 namespace Artemis.UI.Screens.Module.ProfileEditor.DisplayConditions.Abstract
 {
    public abstract class DisplayConditionViewModel : PropertyChangedBase
    {
-        protected DisplayConditionViewModel()
+        protected DisplayConditionViewModel(DisplayConditionPart model, DisplayConditionViewModel parent)
        {
+            Model = model;
+            Parent = parent;
            Children = new BindableCollection<DisplayConditionViewModel>();
        }

+        public DisplayConditionPart Model { get; }
+        public DisplayConditionViewModel Parent { get; set; }
        public BindableCollection<DisplayConditionViewModel> Children { get; }

        public abstract void Update();
+
+        public void Delete()
+        {
+            Model.Parent.RemoveChild(Model);
+            Parent.Update();
+        }
    }
 }
@@ -29,7 +29,8 @@
                Visibility="{Binding IsRootGroup, Converter={x:Static s:BoolToVisibilityConverter.InverseInstance}, Mode=OneWay}"
                Width="25"
                Height="25"
-                Foreground="#E74C4C">
+                Foreground="#E74C4C"
+                Command="{s:Action Delete}">
            <materialDesign:PackIcon Kind="Close" Width="18" Height="18" />
        </Button>
        <Button Grid.Row="0"
@@ -37,25 +38,47 @@
                Style="{StaticResource DisplayConditionButtonLeftClickMenu}"
                Background="#E74C4C"
                BorderBrush="#E74C4C"
-                Margin="3 1">
+                Margin="3 1"
+                Content="{Binding SelectedBooleanOperator}">
            <Button.ContextMenu>
                <ContextMenu>
-                    <MenuItem Header="And" />
-                    <MenuItem Header="Or" />
-                    <MenuItem Header="And not" />
-                    <MenuItem Header="Or not" />
+                    <MenuItem Header="And" Command="{s:Action SelectBooleanOperator}" CommandParameter="And"/>
+                    <MenuItem Header="Or" Command="{s:Action SelectBooleanOperator}" CommandParameter="Or"/>
+                    <MenuItem Header="And not" Command="{s:Action SelectBooleanOperator}" CommandParameter="AndNot"/>
+                    <MenuItem Header="Or not" Command="{s:Action SelectBooleanOperator}" CommandParameter="OrNot"/>
                </ContextMenu>
            </Button.ContextMenu>
-            Or
        </Button>
        <Button Grid.Row="0"
                Grid.Column="2"
-                Style="{StaticResource MaterialDesignIconForegroundButton}"
                HorizontalAlignment="Left"
                Foreground="#4CE758"
                Width="25"
                Height="25">
+            <Button.Style>
+                <Style TargetType="{x:Type Button}" BasedOn="{StaticResource MaterialDesignIconForegroundButton}">
+                    <Style.Triggers>
+                    <EventTrigger RoutedEvent="Click">
+                        <EventTrigger.Actions>
+                            <BeginStoryboard>
+                                <Storyboard>
+                                    <BooleanAnimationUsingKeyFrames Storyboard.TargetProperty="ContextMenu.IsOpen">
+                                        <DiscreteBooleanKeyFrame KeyTime="0:0:0" Value="True"/>
+                                    </BooleanAnimationUsingKeyFrames>
+                                </Storyboard>
+                            </BeginStoryboard>
+                        </EventTrigger.Actions>
+                    </EventTrigger>
+                    </Style.Triggers>
+                </Style>
+            </Button.Style>
            <materialDesign:PackIcon Kind="Add" Width="18" Height="18" />
+            <Button.ContextMenu>
+                <ContextMenu>
+                    <MenuItem Header="Add condition" Command="{s:Action AddCondition}" />
+                    <MenuItem Header="Add group" Command="{s:Action AddGroup}" />
+                </ContextMenu>
+            </Button.ContextMenu>
        </Button>

        <ItemsControl Grid.Row="1" Grid.Column="1" Grid.ColumnSpan="2" ItemsSource="{Binding Children}">
@@ -1,24 +1,80 @@
-using Artemis.UI.Screens.Module.ProfileEditor.DisplayConditions.Abstract;
+using System;
+using System.Linq;
+using Artemis.Core.Models.Profile.Conditions;
+using Artemis.UI.Ninject.Factories;
+using Artemis.UI.Screens.Module.ProfileEditor.DisplayConditions.Abstract;
+using Humanizer;

 namespace Artemis.UI.Screens.Module.ProfileEditor.DisplayConditions
 {
    public class DisplayConditionGroupViewModel : DisplayConditionViewModel
    {
+        private readonly IDisplayConditionsVmFactory _displayConditionsVmFactory;
        private bool _isRootGroup;

+        public DisplayConditionGroupViewModel(DisplayConditionGroup displayConditionGroup, DisplayConditionViewModel parent, IDisplayConditionsVmFactory displayConditionsVmFactory) : base(displayConditionGroup, parent)
+        {
+            _displayConditionsVmFactory = displayConditionsVmFactory;
+        }
+
+        public DisplayConditionGroup DisplayConditionGroup => (DisplayConditionGroup) Model;
+
        public bool IsRootGroup
        {
            get => _isRootGroup;
            set => SetAndNotify(ref _isRootGroup, value);
        }

-        public DisplayConditionGroupViewModel()
+        public string SelectedBooleanOperator => DisplayConditionGroup.BooleanOperator.Humanize();
+
+        public void SelectBooleanOperator(string type)
        {
+            var enumValue = Enum.Parse<BooleanOperator>(type);
+            DisplayConditionGroup.BooleanOperator = enumValue;
+            NotifyOfPropertyChange(nameof(SelectedBooleanOperator));
+        }
+
+        public void AddCondition()
+        {
+            DisplayConditionGroup.AddChild(new DisplayConditionPredicate());
+            Update();
+        }
+
+        public void AddGroup()
+        {
+            DisplayConditionGroup.AddChild(new DisplayConditionGroup());
+            Update();
        }

        public override void Update()
        {
-            
+            NotifyOfPropertyChange(nameof(SelectedBooleanOperator));
+
+            // Remove VMs of effects no longer applied on the layer
+            var toRemove = Children.Where(c => !DisplayConditionGroup.Children.Contains(c.Model)).ToList();
+            Children.RemoveRange(toRemove);
+
+            foreach (var childModel in Model.Children)
+            {
+                if (Children.Any(c => c.Model == childModel))
+                    continue;
+
+                switch (childModel)
+                {
+                    case DisplayConditionGroup displayConditionGroup:
+                        Children.Add(_displayConditionsVmFactory.DisplayConditionGroupViewModel(displayConditionGroup, this));
+                        break;
+                    case DisplayConditionListPredicate displayConditionListPredicate:
+                        Children.Add(_displayConditionsVmFactory.DisplayConditionListPredicateViewModel(displayConditionListPredicate, this));
+                        break;
+                    case DisplayConditionPredicate displayConditionPredicate:
+                        Children.Add(_displayConditionsVmFactory.DisplayConditionPredicateViewModel(displayConditionPredicate, this));
+                        break;
+                }
+            }
+
+            foreach (var childViewModel in Children)
+                childViewModel.Update();
        }
    }
 }
@@ -0,0 +1,13 @@
+<UserControl x:Class="Artemis.UI.Screens.Module.ProfileEditor.DisplayConditions.DisplayConditionListPredicateView"
+             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
+             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
+             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
+             xmlns:local="clr-namespace:Artemis.UI.Screens.Module.ProfileEditor.DisplayConditions"
+             mc:Ignorable="d" 
+             d:DesignHeight="450" d:DesignWidth="800"
+             d:DataContext="{d:DesignInstance Type=local:DisplayConditionListPredicateViewModel, IsDesignTimeCreatable=False}">
+    <Grid>
+            
+    </Grid>
+</UserControl>
@@ -0,0 +1,18 @@
+using Artemis.Core.Models.Profile.Conditions;
+using Artemis.UI.Screens.Module.ProfileEditor.DisplayConditions.Abstract;
+
+namespace Artemis.UI.Screens.Module.ProfileEditor.DisplayConditions
+{
+    public class DisplayConditionListPredicateViewModel : DisplayConditionViewModel
+    {
+        public DisplayConditionListPredicateViewModel(DisplayConditionListPredicate displayConditionListPredicate, DisplayConditionViewModel parent) : base(displayConditionListPredicate, parent)
+        {
+        }
+
+        public DisplayConditionListPredicate DisplayConditionListPredicate => (DisplayConditionListPredicate) Model;
+
+        public override void Update()
+        {
+        }
+    }
+}
@@ -1,16 +1,28 @@
-<UserControl x:Class="Artemis.UI.Screens.Module.ProfileEditor.DisplayConditions.DisplayConditionPredicateView"
-             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
-             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
-             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
-             xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
-             xmlns:local="clr-namespace:Artemis.UI.Screens.Module.ProfileEditor.DisplayConditions"
-             xmlns:s="https://github.com/canton7/Stylet"
-             xmlns:materialDesign="http://materialdesigninxaml.net/winfx/xaml/themes"
-             mc:Ignorable="d"
-             d:DesignHeight="450" d:DesignWidth="800"
-             d:DataContext="{d:DesignInstance Type=local:DisplayConditionPredicateViewModel, IsDesignTimeCreatable=False}">
+<UserControl
+    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
+    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
+    xmlns:local="clr-namespace:Artemis.UI.Screens.Module.ProfileEditor.DisplayConditions"
+    xmlns:s="https://github.com/canton7/Stylet"
+    xmlns:materialDesign="http://materialdesigninxaml.net/winfx/xaml/themes"
+    xmlns:converters="clr-namespace:Artemis.UI.Converters"
+    xmlns:utilities="clr-namespace:Artemis.UI.Utilities"
+    x:Class="Artemis.UI.Screens.Module.ProfileEditor.DisplayConditions.DisplayConditionPredicateView"
+    mc:Ignorable="d"
+    d:DesignHeight="450" d:DesignWidth="800"
+    d:DataContext="{d:DesignInstance IsDesignTimeCreatable=False, Type={x:Type local:DisplayConditionPredicateViewModel}}"
+    x:Name="DisplayConditionPredicateRoot">
    <UserControl.Resources>
-        <ResourceDictionary Source="pack://application:,,,/Artemis.UI;component/ResourceDictionaries/DisplayConditions.xaml" />
+        <ResourceDictionary>
+            <ResourceDictionary.MergedDictionaries>
+                <ResourceDictionary Source="pack://application:,,,/Artemis.UI;component/ResourceDictionaries/DisplayConditions.xaml" />
+                <ResourceDictionary>
+                    <converters:NullToVisibilityConverter x:Key="NullToVisibilityConverter" />
+                    <utilities:BindingProxy x:Key="DataContextProxy" Data="{Binding}" />
+                </ResourceDictionary>
+            </ResourceDictionary.MergedDictionaries>
+        </ResourceDictionary>
    </UserControl.Resources>
    <Grid Margin="0 2">
        <Grid.ColumnDefinitions>
@@ -25,60 +37,45 @@
                HorizontalAlignment="Left"
                Foreground="#E74C4C"
                Width="25"
-                Height="25">
+                Height="25"
+                Command="{s:Action Delete}">
            <materialDesign:PackIcon Kind="Close" Width="18" Height="18" />
        </Button>
        <Button Grid.Row="0"
                Grid.Column="1"
-                Style="{StaticResource DisplayConditionButtonLeftClickMenu}"
                Background="{DynamicResource SecondaryAccentBrush}"
-                BorderBrush="{DynamicResource SecondaryAccentBrush}">
+                BorderBrush="{DynamicResource SecondaryAccentBrush}"
+                Style="{StaticResource DisplayConditionButtonLeftClickMenu}">
            <Button.ContextMenu>
-                <ContextMenu>
-                    <MenuItem Header="Equals">
-                        <MenuItem.Icon>
-                            <materialDesign:PackIcon Kind="Equal" />
-                        </MenuItem.Icon>
-                    </MenuItem>
-                    <MenuItem Header="Does not equal">
-                        <MenuItem.Icon>
-                            <materialDesign:PackIcon Kind="NotEqualVariant" />
-                        </MenuItem.Icon>
-                    </MenuItem>
-                    <MenuItem Header="Contains">
-                        <MenuItem.Icon>
-                            <materialDesign:PackIcon Kind="Contain" />
-                        </MenuItem.Icon>
-                    </MenuItem>
-                    <MenuItem Header="Starts with">
-                        <MenuItem.Icon>
-                            <materialDesign:PackIcon Kind="ContainStart" />
-                        </MenuItem.Icon>
-                    </MenuItem>
-                    <MenuItem Header="Ends with">
-                        <MenuItem.Icon>
-                            <materialDesign:PackIcon Kind="ContainEnd" />
-                        </MenuItem.Icon>
-                    </MenuItem>
-                    <MenuItem Header="Does not contain">
-                        <MenuItem.Icon>
-                            <materialDesign:PackIcon Kind="FormatStrikethrough" />
-                        </MenuItem.Icon>
-                    </MenuItem>
-                    <MenuItem Header="Is null">
-                        <MenuItem.Icon>
-                            <materialDesign:PackIcon Kind="Null" />
-                        </MenuItem.Icon>
-                    </MenuItem>
+                <ContextMenu ItemsSource="{Binding DataModel.Children}">
+                    <ContextMenu.ItemContainerStyle>
+                        <Style TargetType="{x:Type MenuItem}" BasedOn="{StaticResource MaterialDesignMenuItem}">
+                            <Setter Property="ItemsSource" Value="{Binding Children}" />
+                            <Setter Property="Header" Value="{Binding PropertyDescription.Name}" />
+                            <Setter Property="ToolTip" Value="{Binding PropertyDescription.Description}" />
+                            <Setter Property="Command" Value="{Binding Data.SelectPropertyCommand, Source={StaticResource DataContextProxy}}" />
+                            <Setter Property="CommandParameter" Value="{Binding}" />
+                            <Setter Property="CommandTarget" Value="{Binding}" />
+                           
+                        </Style>
+                    </ContextMenu.ItemContainerStyle>
                </ContextMenu>
            </Button.ContextMenu>
-            Category
+            <Grid>
+                <TextBlock Text="{Binding SelectedLeftSideProperty.PropertyDescription.Name}"
+                           ToolTip="{Binding SelectedLeftSideProperty.PropertyDescription.Description}"
+                           Visibility="{Binding SelectedLeftSideProperty, Converter={StaticResource NullToVisibilityConverter}}" />
+                <TextBlock Text="« Select a property »"
+                           FontStyle="Italic"
+                           Visibility="{Binding SelectedLeftSideProperty, Converter={StaticResource NullToVisibilityConverter}, ConverterParameter=Inverted}" />
+            </Grid>
        </Button>
+
        <Button Grid.Row="0"
                Grid.Column="2"
                Style="{StaticResource DisplayConditionButtonLeftClickMenu}"
                Background="#7B7B7B"
-                BorderBrush="#7B7B7B">
+                BorderBrush="#7B7B7B" Content="Equals">
            <Button.ContextMenu>
                <ContextMenu>
                    <MenuItem Header="Equals">
@@ -118,14 +115,11 @@
                    </MenuItem>
                </ContextMenu>
            </Button.ContextMenu>
-            Equals
        </Button>
        <Button Grid.Row="0"
                Grid.Column="3"
                Style="{StaticResource DisplayConditionButton}"
                Background="{DynamicResource PrimaryHueMidBrush}"
-                BorderBrush="{DynamicResource PrimaryHueMidBrush}">
-            Video Players
-        </Button>
+                BorderBrush="{DynamicResource PrimaryHueMidBrush}" Content="PredicateRightSide" />
    </Grid>
 </UserControl>
@@ -1,16 +1,86 @@
-using Artemis.UI.Screens.Module.ProfileEditor.DisplayConditions.Abstract;
+using Artemis.Core.Models.Profile.Conditions;
+using Artemis.UI.Screens.Module.ProfileEditor.DisplayConditions.Abstract;
+using Artemis.UI.Shared.DataModelVisualization.Shared;
+using Artemis.UI.Shared.Services;
+using Artemis.UI.Shared.Services.Interfaces;
+using Artemis.UI.Utilities;

 namespace Artemis.UI.Screens.Module.ProfileEditor.DisplayConditions
 {
    public class DisplayConditionPredicateViewModel : DisplayConditionViewModel
    {
-        public DisplayConditionPredicateViewModel()
+        private readonly IDataModelVisualizationService _dataModelVisualizationService;
+        private readonly IProfileEditorService _profileEditorService;
+        private DataModelPropertiesViewModel _dataModel;
+        private DataModelVisualizationViewModel _selectedLeftSideProperty;
+        private bool _leftSidePropertySelectionOpen;
+
+        public DisplayConditionPredicateViewModel(DisplayConditionPredicate displayConditionPredicate, DisplayConditionViewModel parent,
+            IProfileEditorService profileEditorService, IDataModelVisualizationService dataModelVisualizationService) : base(displayConditionPredicate, parent)
        {
-            
+            _profileEditorService = profileEditorService;
+            _dataModelVisualizationService = dataModelVisualizationService;
+
+            SelectPropertyCommand = new DelegateCommand(ExecuteSelectProperty);
+
+            GetDataModel();
+        }
+
+        public DelegateCommand SelectPropertyCommand { get; }
+
+        public DataModelPropertiesViewModel DataModel
+        {
+            get => _dataModel;
+            set => SetAndNotify(ref _dataModel, value);
+        }
+
+        public DataModelVisualizationViewModel SelectedLeftSideProperty
+        {
+            get => _selectedLeftSideProperty;
+            set => SetAndNotify(ref _selectedLeftSideProperty, value);
+        }
+
+        public bool LeftSidePropertySelectionOpen
+        {
+            get => _leftSidePropertySelectionOpen;
+            set => SetAndNotify(ref _leftSidePropertySelectionOpen, value);
+        }
+
+
+        public DisplayConditionPredicate DisplayConditionPredicate => (DisplayConditionPredicate) Model;
+
+        public void ToggleLeftSidePropertySelectionOpen()
+        {
+            LeftSidePropertySelectionOpen = !LeftSidePropertySelectionOpen;
+        }
+
+        public void GetDataModel()
+        {
+            var mainDataModel = _dataModelVisualizationService.GetMainDataModelVisualization(true);
+            if (!_dataModelVisualizationService.GetPluginExtendsDataModel(_profileEditorService.GetCurrentModule()))
+                mainDataModel.Children.Add(_dataModelVisualizationService.GetPluginDataModelVisualization(_profileEditorService.GetCurrentModule(), true));
+
+            DataModel = mainDataModel;
+
+            Update();
        }

        public override void Update()
        {
+            if (DisplayConditionPredicate.PropertyPath != null)
+                SelectedLeftSideProperty = DataModel.GetChildByPath(DisplayConditionPredicate.DataModelGuid, DisplayConditionPredicate.PropertyPath);
+            else
+                SelectedLeftSideProperty = null;
+        }
+
+        private void ExecuteSelectProperty(object context)
+        {
+            if (!(context is DataModelVisualizationViewModel vm))
+                return;
+
+            DisplayConditionPredicate.PropertyPath = vm.GetCurrentPath();
+            DisplayConditionPredicate.DataModelGuid = vm.DataModel.PluginInfo.Guid;
+            Update();
        }
    }
 }
@@ -1,27 +1,49 @@
-using Stylet;
+using System.Linq;
+using Artemis.Core.Models.Profile;
+using Artemis.Core.Models.Profile.Conditions;
+using Artemis.UI.Ninject.Factories;
+using Artemis.UI.Shared.DataModelVisualization.Shared;
+using Artemis.UI.Shared.Events;
+using Artemis.UI.Shared.Services;
+using Artemis.UI.Shared.Services.Interfaces;

 namespace Artemis.UI.Screens.Module.ProfileEditor.DisplayConditions
 {
    public class DisplayConditionsViewModel : ProfileEditorPanelViewModel
    {
+        private readonly IDisplayConditionsVmFactory _displayConditionsVmFactory;
+        private readonly IDataModelVisualizationService _dataModelVisualizationService;
        private DisplayConditionGroupViewModel _rootGroup;

+        public DisplayConditionsViewModel(IProfileEditorService profileEditorService, IDataModelVisualizationService dataModelVisualizationService,
+            IDisplayConditionsVmFactory displayConditionsVmFactory)
+        {
+            _dataModelVisualizationService = dataModelVisualizationService;
+            _displayConditionsVmFactory = displayConditionsVmFactory;
+            profileEditorService.ProfileElementSelected += ProfileEditorServiceOnProfileElementSelected;
+        }
+
        public DisplayConditionGroupViewModel RootGroup
        {
            get => _rootGroup;
            set => SetAndNotify(ref _rootGroup, value);
        }

-        public DisplayConditionsViewModel()
+        private void ProfileEditorServiceOnProfileElementSelected(object sender, ProfileElementEventArgs e)
        {
-            RootGroup = new DisplayConditionGroupViewModel {IsRootGroup = true};
-            var subGroup = new DisplayConditionGroupViewModel();
+            _dataModelVisualizationService.BustCache();

-            RootGroup.Children.Add(new DisplayConditionPredicateViewModel());
-            RootGroup.Children.Add(new DisplayConditionPredicateViewModel());
-            RootGroup.Children.Add(subGroup);
-            subGroup.Children.Add(new DisplayConditionPredicateViewModel());
-            subGroup.Children.Add(new DisplayConditionPredicateViewModel());
+            if (e.ProfileElement is Layer layer)
+            {
+                // Ensure the layer has a root display condition group
+                if (layer.DisplayConditionGroup == null)
+                    layer.DisplayConditionGroup = new DisplayConditionGroup();
+
+                RootGroup = _displayConditionsVmFactory.DisplayConditionGroupViewModel(layer.DisplayConditionGroup, null);
+                RootGroup.IsRootGroup = true;
+            }
+            else
+                RootGroup = null;
        }
    }
 }
@@ -5,15 +5,11 @@
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
             xmlns:local="clr-namespace:Artemis.UI.Screens.Settings.Debug.Tabs"
             xmlns:s="https://github.com/canton7/Stylet"
-             xmlns:converters="clr-namespace:Artemis.UI.Converters"
             xmlns:wpf="http://materialdesigninxaml.net/winfx/xaml/themes"
             xmlns:plugins="clr-namespace:Artemis.Core.Plugins.Abstract;assembly=Artemis.Core"
             xmlns:dataModel="clr-namespace:Artemis.UI.Shared.DataModelVisualization.Shared;assembly=Artemis.UI.Shared"
             mc:Ignorable="d"
             d:DesignHeight="450" d:DesignWidth="800" d:DataContext="{d:DesignInstance local:DataModelDebugViewModel}">
-    <UserControl.Resources>
-        <converters:NullToVisibilityConverter x:Key="NullToVisibilityConverter" />
-    </UserControl.Resources>
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto" />
@@ -29,18 +25,18 @@
                <ColumnDefinition Width="0.5*" />
            </Grid.ColumnDefinitions>
            <!-- Property searching (nyi) -->
-            <wpf:PackIcon Grid.Column="0" Kind="Search" VerticalAlignment="Center"/>
-            <TextBox Grid.Column="1" wpf:HintAssist.Hint="Search property" VerticalAlignment="Center" Margin="5 0" IsEnabled="False"/>
+            <wpf:PackIcon Grid.Column="0" Kind="Search" VerticalAlignment="Center" />
+            <TextBox Grid.Column="1" wpf:HintAssist.Hint="Search property" VerticalAlignment="Center" Margin="5 0" IsEnabled="False" />

            <!-- Module filtering -->
            <TextBlock Grid.Column="3" VerticalAlignment="Center">Filter module</TextBlock>
-            <ToggleButton Grid.Column="4" 
+            <ToggleButton Grid.Column="4"
                          VerticalAlignment="Center"
-                          Margin="5 0" 
-                          Style="{StaticResource MaterialDesignSwitchToggleButton}" 
+                          Margin="5 0"
+                          Style="{StaticResource MaterialDesignSwitchToggleButton}"
                          IsChecked="{Binding IsModuleFilterEnabled}" />
-            <ComboBox Grid.Column="5" 
-                      VerticalAlignment="Center" 
+            <ComboBox Grid.Column="5"
+                      VerticalAlignment="Center"
                      wpf:HintAssist.Hint="Select a module"
                      IsEditable="True"
                      TextSearch.TextPath="DisplayName"
@@ -51,8 +47,8 @@
                <ComboBox.ItemTemplate>
                    <DataTemplate>
                        <StackPanel d:DataContext="{d:DesignInstance Type=plugins:Module}" Orientation="Horizontal">
-                            <wpf:PackIcon Kind="{Binding DisplayIcon}" VerticalAlignment="Center" Margin="0 0 5 0"/>
-                            <TextBlock Text="{Binding DisplayName}" VerticalAlignment="Center"></TextBlock>
+                            <wpf:PackIcon Kind="{Binding DisplayIcon}" VerticalAlignment="Center" Margin="0 0 5 0" />
+                            <TextBlock Text="{Binding DisplayName}" VerticalAlignment="Center" />
                        </StackPanel>
                    </DataTemplate>
                </ComboBox.ItemTemplate>
@@ -60,24 +56,10 @@
        </Grid>
        <TreeView Grid.Row="1" ItemsSource="{Binding MainDataModel.Children}" HorizontalContentAlignment="Stretch">
            <TreeView.Resources>
-                <HierarchicalDataTemplate DataType="{x:Type dataModel:DataModelViewModel}" ItemsSource="{Binding Children}">
-                    <Grid>
-                        <TextBlock Text="{Binding PropertyDescription.Name}"
-                                   ToolTip="{Binding PropertyDescription.Description}"
-                                   Visibility="{Binding IsListProperty, Converter={x:Static s:BoolToVisibilityConverter.InverseInstance}, Mode=OneWay}" />
-                        <Grid Visibility="{Binding IsListProperty, Converter={x:Static s:BoolToVisibilityConverter.Instance}, Mode=OneWay}">
-                            <Grid.ColumnDefinitions>
-                                <ColumnDefinition Width="Auto" />
-                                <ColumnDefinition Width="*" />
-                            </Grid.ColumnDefinitions>
-                            <TextBlock Grid.Column="0" Margin="0 0 5 0" FontWeight="Bold">
-                                <Run>[</Run><Run Text="{Binding PropertyType.Name, Mode=OneWay}" /><Run>]</Run>
-                            </TextBlock>
-                            <TextBlock Grid.Column="1" Text="{Binding ListDescription}" ToolTip="{Binding PropertyDescription.Description}" />
-                        </Grid>
-                    </Grid>
+                <HierarchicalDataTemplate DataType="{x:Type dataModel:DataModelPropertiesViewModel}" ItemsSource="{Binding Children}">
+                    <TextBlock Text="{Binding PropertyDescription.Name}" ToolTip="{Binding PropertyDescription.Description}" />
                </HierarchicalDataTemplate>
-                <HierarchicalDataTemplate DataType="{x:Type dataModel:DataModelListViewModel}" ItemsSource="{Binding Children}">
+                <HierarchicalDataTemplate DataType="{x:Type dataModel:DataModelListViewModel}" ItemsSource="{Binding ListChildren}">
                    <Grid>
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="Auto" />
@@ -104,20 +86,13 @@

                        <!-- Value description -->
                        <TextBlock Grid.Column="0" Margin="0 0 5 0" FontWeight="Bold">
-                            <Run>[</Run><Run Text="{Binding PropertyType.Name, Mode=OneWay}" /><Run>]</Run>
+                            <Run>[</Run><Run Text="{Binding PropertyInfo.PropertyType.Name, Mode=OneWay}" /><Run>]</Run>
                        </TextBlock>
-                        <TextBlock Grid.Column="1"
-                                   Text="{Binding PropertyDescription.Name}"
-                                   ToolTip="{Binding PropertyDescription.Description}"
-                                   Visibility="{Binding IsListProperty, Converter={x:Static s:BoolToVisibilityConverter.InverseInstance}, Mode=OneWay}" />
-                        <TextBlock Grid.Column="1"
-                                   Text="{Binding ListDescription}"
-                                   ToolTip="{Binding PropertyDescription.Description}"
-                                   Visibility="{Binding IsListProperty, Converter={x:Static s:BoolToVisibilityConverter.Instance}, Mode=OneWay}" />
-                       
+                        <TextBlock Grid.Column="1" Text="{Binding PropertyDescription.Name}" ToolTip="{Binding PropertyDescription.Description}" />
+
                        <!-- Value display -->
                        <TextBlock Grid.Column="2"
-                                   Text="{Binding Model, Mode=OneWay}"
+                                   Text="{Binding DisplayValue, Mode=OneWay}"
                                   FontFamily="Consolas"
                                   HorizontalAlignment="Right"
                                   Visibility="{Binding ShowToString, Converter={x:Static s:BoolToVisibilityConverter.Instance}, Mode=OneWay}" />
@@ -127,13 +102,51 @@
                                   HorizontalAlignment="Right"
                                   Foreground="{DynamicResource MaterialDesignCheckBoxDisabled}"
                                   Visibility="{Binding ShowNull, Converter={x:Static s:BoolToVisibilityConverter.Instance}, Mode=OneWay}" />
-                        <ContentControl Grid.Column="2" 
-                                        s:View.Model="{Binding DisplayViewModel}" 
+                        <ContentControl Grid.Column="2"
+                                        s:View.Model="{Binding DisplayViewModel}"
                                        FontFamily="Consolas"
-                                        Visibility="{Binding ShowViewModel, Converter={x:Static s:BoolToVisibilityConverter.Instance}, Mode=OneWay}"/>
-                        
+                                        Visibility="{Binding ShowViewModel, Converter={x:Static s:BoolToVisibilityConverter.Instance}, Mode=OneWay}" />
                    </Grid>
                </HierarchicalDataTemplate>
+                <HierarchicalDataTemplate DataType="{x:Type dataModel:DataModelListPropertyViewModel}">
+                    <Grid>
+                        <Grid.ColumnDefinitions>
+                            <ColumnDefinition Width="Auto" />
+                            <ColumnDefinition Width="Auto" />
+                            <ColumnDefinition Width="*" />
+                        </Grid.ColumnDefinitions>
+
+                        <!-- Value description -->
+                        <TextBlock Grid.Column="0" Margin="0 0 5 0" FontWeight="Bold">
+                            <Run>[</Run><Run Text="{Binding ListType.Name, Mode=OneWay}" /><Run>]</Run>
+                        </TextBlock>
+                        <TextBlock Grid.Column="1" ToolTip="{Binding PropertyDescription.Description}">
+                            <Run>List item [</Run><Run Text="{Binding Index, Mode=OneWay}" /><Run>]</Run>
+                        </TextBlock>
+
+                        <!-- Value display -->
+                        <TextBlock Grid.Column="2"
+                                   Text="{Binding DisplayValue, Mode=OneWay}"
+                                   FontFamily="Consolas"
+                                   HorizontalAlignment="Right"
+                                   Visibility="{Binding ShowToString, Converter={x:Static s:BoolToVisibilityConverter.Instance}, Mode=OneWay}" />
+                        <TextBlock Grid.Column="2"
+                                   Text="null"
+                                   FontFamily="Consolas"
+                                   HorizontalAlignment="Right"
+                                   Foreground="{DynamicResource MaterialDesignCheckBoxDisabled}"
+                                   Visibility="{Binding ShowNull, Converter={x:Static s:BoolToVisibilityConverter.Instance}, Mode=OneWay}" />
+                        <ContentControl Grid.Column="2"
+                                        s:View.Model="{Binding DisplayViewModel}"
+                                        FontFamily="Consolas"
+                                        Visibility="{Binding ShowViewModel, Converter={x:Static s:BoolToVisibilityConverter.Instance}, Mode=OneWay}" />
+                    </Grid>
+                </HierarchicalDataTemplate>
+                <HierarchicalDataTemplate DataType="{x:Type dataModel:DataModelListPropertiesViewModel}" ItemsSource="{Binding Children}">
+                    <TextBlock>
+                        <Run>List item [</Run><Run Text="{Binding Index, Mode=OneWay}" /><Run>]</Run>
+                    </TextBlock>
+                </HierarchicalDataTemplate>
            </TreeView.Resources>
        </TreeView>
    </Grid>
@@ -17,7 +17,7 @@ namespace Artemis.UI.Screens.Settings.Debug.Tabs
        private readonly Timer _updateTimer;
        private bool _isModuleFilterEnabled;
        private Core.Plugins.Abstract.Module _selectedModule;
-        private DataModelViewModel _mainDataModel;
+        private DataModelPropertiesViewModel _mainDataModel;
        private string _propertySearch;
        private List<Core.Plugins.Abstract.Module> _modules;

@@ -26,12 +26,12 @@ namespace Artemis.UI.Screens.Settings.Debug.Tabs
            _dataModelVisualizationService = dataModelVisualizationService;
            _pluginService = pluginService;
            _updateTimer = new Timer(500);
-            _updateTimer.Elapsed += (sender, args) => MainDataModel.Update();
+            _updateTimer.Elapsed += (sender, args) => MainDataModel.Update(_dataModelVisualizationService);

            DisplayName = "Data model";
        }

-        public DataModelViewModel MainDataModel
+        public DataModelPropertiesViewModel MainDataModel
        {
            get => _mainDataModel;
            set => SetAndNotify(ref _mainDataModel, value);
@@ -93,8 +93,8 @@ namespace Artemis.UI.Screens.Settings.Debug.Tabs
        private void GetDataModel()
        {
            MainDataModel = SelectedModule != null
-                ? _dataModelVisualizationService.GetPluginDataModelVisualization(SelectedModule)
-                : _dataModelVisualizationService.GetMainDataModelVisualization();
+                ? _dataModelVisualizationService.GetPluginDataModelVisualization(SelectedModule, false)
+                : _dataModelVisualizationService.GetMainDataModelVisualization(false);
        }

        private void PluginServiceOnPluginToggled(object? sender, PluginEventArgs e)