Settings UI - Seperated tabs into different VMs

src/Artemis.UI/Screens/Settings/Tabs/Devices/DeviceSettingsTabView.xaml

@@ -0,0 +1,28 @@
+<UserControl x:Class="Artemis.UI.Screens.Settings.Tabs.Devices.DeviceSettingsTabView"
+             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.Settings.Tabs.Devices"
+             xmlns:s="https://github.com/canton7/Stylet"
+             mc:Ignorable="d" 
+             d:DesignHeight="450" d:DesignWidth="800"
+             d:DataContext="{d:DesignInstance local:DeviceSettingsTabViewModel}">
+    <ScrollViewer VerticalScrollBarVisibility="Auto" HorizontalScrollBarVisibility="Disabled" Margin="0 12 0 0">
+        <DockPanel Margin="15" MaxWidth="1230" HorizontalAlignment="Center">
+            <TextBlock DockPanel.Dock="Top">Below you view and manage the devices that were detected by Artemis</TextBlock>
+            <ItemsControl ItemsSource="{Binding DeviceSettingsViewModels}">
+                <ItemsControl.ItemsPanel>
+                    <ItemsPanelTemplate>
+                        <WrapPanel />
+                    </ItemsPanelTemplate>
+                </ItemsControl.ItemsPanel>
+                <ItemsControl.ItemTemplate>
+                    <DataTemplate>
+                        <ContentControl s:View.Model="{Binding}" Margin="5" HorizontalAlignment="Left" VerticalAlignment="Top" />
+                    </DataTemplate>
+                </ItemsControl.ItemTemplate>
+            </ItemsControl>
+        </DockPanel>
+    </ScrollViewer>
+</UserControl>

src/Artemis.UI/Screens/Settings/Tabs/Devices/DeviceSettingsTabViewModel.cs

@@ -0,0 +1,43 @@
+using System.Linq;
+using System.Threading.Tasks;
+using Artemis.Core.Services.Storage.Interfaces;
+using Artemis.UI.Ninject.Factories;
+using Stylet;
+
+namespace Artemis.UI.Screens.Settings.Tabs.Devices
+{
+    public class DeviceSettingsTabViewModel : Screen
+    {
+        private readonly ISettingsVmFactory _settingsVmFactory;
+        private readonly ISurfaceService _surfaceService;
+        private BindableCollection<DeviceSettingsViewModel> _deviceSettingsViewModels;
+
+        public DeviceSettingsTabViewModel(ISurfaceService surfaceService, ISettingsVmFactory settingsVmFactory)
+        {
+            DisplayName = "DEVICES";
+
+            _surfaceService = surfaceService;
+            _settingsVmFactory = settingsVmFactory;
+
+            DeviceSettingsViewModels = new BindableCollection<DeviceSettingsViewModel>();
+        }
+
+        public BindableCollection<DeviceSettingsViewModel> DeviceSettingsViewModels
+        {
+            get => _deviceSettingsViewModels;
+            set => SetAndNotify(ref _deviceSettingsViewModels, value);
+        }
+
+        protected override void OnActivate()
+        {
+            // Take it off the UI thread to avoid freezing on tab change
+            Task.Run(() =>
+            {
+                DeviceSettingsViewModels.Clear();
+                var instances = _surfaceService.ActiveSurface.Devices.Select(d => _settingsVmFactory.CreateDeviceSettingsViewModel(d)).ToList();
+                foreach (var deviceSettingsViewModel in instances)
+                    DeviceSettingsViewModels.Add(deviceSettingsViewModel);
+            });
+        }
+    }
+}