Added acrylic blur test

src/Artemis.UI/Controls/AcrylicBlur/AcrylicBlur.axaml

@@ -0,0 +1,22 @@
+<ResourceDictionary xmlns="https://github.com/avaloniaui"
+                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+                    xmlns:controls="clr-namespace:Artemis.UI.Controls"
+                    xmlns:acrylicBlur="clr-namespace:Artemis.UI.Controls.AcrylicBlur"
+                    x:ClassModifier="internal">
+    <ControlTheme x:Key="{x:Type acrylicBlur:AcrylicBlur}" TargetType="acrylicBlur:AcrylicBlur">
+        <Setter Property="Template">
+            <ControlTemplate>
+                <ContentPresenter Name="PART_ContentPresenter"
+                                  Background="{TemplateBinding Background}"
+                                  BorderBrush="{TemplateBinding BorderBrush}"
+                                  BorderThickness="{TemplateBinding BorderThickness}"
+                                  CornerRadius="{TemplateBinding CornerRadius}"
+                                  ContentTemplate="{TemplateBinding ContentTemplate}"
+                                  Content="{TemplateBinding Content}"
+                                  Padding="{TemplateBinding Padding}"
+                                  VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
+                                  HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"/>
+            </ControlTemplate>
+        </Setter>
+    </ControlTheme>
+</ResourceDictionary>

src/Artemis.UI/Controls/AcrylicBlur/AcrylicBlur.cs

@@ -0,0 +1,45 @@
+using Avalonia;
+using Avalonia.Controls;
+using Avalonia.Media;
+
+namespace Artemis.UI.Controls.AcrylicBlur;
+
+public class AcrylicBlur : ContentControl
+{
+    private static readonly ImmutableExperimentalAcrylicMaterial DefaultAcrylicMaterial = (ImmutableExperimentalAcrylicMaterial) new ExperimentalAcrylicMaterial()
+    {
+        MaterialOpacity = 0.1,
+        TintColor = new Color(255, 7, 7, 7),
+        TintOpacity = 1,
+        PlatformTransparencyCompensationLevel = 0
+    }.ToImmutable();
+
+    public static readonly StyledProperty<ExperimentalAcrylicMaterial?> MaterialProperty =
+        AvaloniaProperty.Register<AcrylicBlur, ExperimentalAcrylicMaterial?>(nameof(Material));
+
+    public ExperimentalAcrylicMaterial? Material
+    {
+        get => GetValue(MaterialProperty);
+        set => SetValue(MaterialProperty, value);
+    }
+
+    public static readonly StyledProperty<int> BlurProperty = AvaloniaProperty.Register<AcrylicBlur, int>(nameof(Blur));
+
+    public int Blur
+    {
+        get => GetValue(BlurProperty);
+        set => SetValue(BlurProperty, value);
+    }
+
+    static AcrylicBlur()
+    {
+        AffectsRender<AcrylicBlur>(MaterialProperty);
+        AffectsRender<AcrylicBlur>(BlurProperty);
+    }
+
+    public override void Render(DrawingContext context)
+    {
+        ImmutableExperimentalAcrylicMaterial mat = Material != null ? (ImmutableExperimentalAcrylicMaterial) Material.ToImmutable() : DefaultAcrylicMaterial;
+        context.Custom(new AcrylicBlurRenderOperation(this, mat, Blur, new Rect(default, Bounds.Size)));
+    }
+}

src/Artemis.UI/Controls/AcrylicBlur/AcrylicBlurRenderOperation.cs

@@ -0,0 +1,138 @@
+using System;
+using System.IO;
+using Avalonia;
+using Avalonia.Media;
+using Avalonia.Platform;
+using Avalonia.Rendering.SceneGraph;
+using Avalonia.Skia;
+using Avalonia.Threading;
+using SkiaSharp;
+
+namespace Artemis.UI.Controls.AcrylicBlur;
+
+public class AcrylicBlurRenderOperation : ICustomDrawOperation
+{
+    private static SKShader? _acrylicNoiseShader;
+
+    private readonly AcrylicBlur _acrylicBlur;
+    private readonly ImmutableExperimentalAcrylicMaterial _material;
+    private readonly int _blur;
+    private readonly Rect _bounds;
+    private SKImage? _backgroundSnapshot;
+    private bool _disposed;
+
+    public AcrylicBlurRenderOperation(AcrylicBlur acrylicBlur, ImmutableExperimentalAcrylicMaterial material, int blur, Rect bounds)
+    {
+        _acrylicBlur = acrylicBlur;
+        _material = material;
+        _blur = blur;
+        _bounds = bounds;
+    }
+
+    public void Dispose()
+    {
+        if (_disposed)
+            return;
+
+        _backgroundSnapshot?.Dispose();
+        _disposed = true;
+    }
+
+    public bool HitTest(Point p) => _bounds.Contains(p);
+
+    static SKColorFilter CreateAlphaColorFilter(double opacity)
+    {
+        if (opacity > 1)
+            opacity = 1;
+        byte[] c = new byte[256];
+        byte[] a = new byte[256];
+        for (int i = 0; i < 256; i++)
+        {
+            c[i] = (byte) i;
+            a[i] = (byte) (i * opacity);
+        }
+
+        return SKColorFilter.CreateTable(a, c, c, c);
+    }
+
+    public void Render(ImmediateDrawingContext context)
+    {
+        if (_disposed)
+            throw new ObjectDisposedException(nameof(AcrylicBlurRenderOperation));
+
+        ISkiaSharpApiLeaseFeature? leaseFeature = context.PlatformImpl.GetFeature<ISkiaSharpApiLeaseFeature>();
+        if (leaseFeature == null)
+            return;
+        using ISkiaSharpApiLease lease = leaseFeature.Lease();
+
+        if (!lease.SkCanvas.TotalMatrix.TryInvert(out SKMatrix currentInvertedTransform) || lease.SkSurface == null)
+            return;
+
+        if (lease.SkCanvas.GetLocalClipBounds(out SKRect bounds) && !bounds.Contains(SKRect.Create(bounds.Left, bounds.Top, (float) _acrylicBlur.Bounds.Width, (float) _acrylicBlur.Bounds.Height)))
+        {
+            Dispatcher.UIThread.Invoke(() => _acrylicBlur.InvalidateVisual());
+        }
+        else
+        {
+            _backgroundSnapshot?.Dispose();
+            _backgroundSnapshot = lease.SkSurface.Snapshot();
+        }
+        
+        _backgroundSnapshot ??= lease.SkSurface.Snapshot();
+        using SKShader? backdropShader = SKShader.CreateImage(_backgroundSnapshot, SKShaderTileMode.Clamp, SKShaderTileMode.Clamp, currentInvertedTransform);
+        using SKSurface? blurred = SKSurface.Create(
+            lease.GrContext,
+            false,
+            new SKImageInfo((int) Math.Ceiling(_bounds.Width), (int) Math.Ceiling(_bounds.Height), SKImageInfo.PlatformColorType, SKAlphaType.Premul)
+        );
+        using (SKImageFilter? filter = SKImageFilter.CreateBlur(_blur, _blur, SKShaderTileMode.Clamp))
+        using (SKPaint blurPaint = new SKPaint {Shader = backdropShader, ImageFilter = filter})
+        {
+            blurred.Canvas.DrawRect(0, 0, (float) _bounds.Width, (float) _bounds.Height, blurPaint);
+
+            using (SKImage? blurSnap = blurred.Snapshot())
+            using (SKShader? blurSnapShader = SKShader.CreateImage(blurSnap))
+            using (SKPaint blurSnapPaint = new SKPaint {Shader = blurSnapShader, IsAntialias = true})
+            {
+                // Rendering twice to reduce opacity
+                lease.SkCanvas.DrawRect(0, 0, (float) _bounds.Width, (float) _bounds.Height, blurSnapPaint);
+                lease.SkCanvas.DrawRect(0, 0, (float) _bounds.Width, (float) _bounds.Height, blurSnapPaint);
+            }
+
+            //return;
+            using SKPaint acrylliPaint = new SKPaint();
+            acrylliPaint.IsAntialias = true;
+
+            double opacity = 1;
+
+            const double noiseOpacity = 0.0225;
+
+            Color tintColor = _material.TintColor;
+            SKColor tint = new SKColor(tintColor.R, tintColor.G, tintColor.B, tintColor.A);
+
+            if (_acrylicNoiseShader == null)
+            {
+                using Stream? stream = typeof(SkiaPlatform).Assembly.GetManifestResourceStream("Avalonia.Skia.Assets.NoiseAsset_256X256_PNG.png");
+                using SKBitmap? bitmap = SKBitmap.Decode(stream);
+                _acrylicNoiseShader = SKShader.CreateBitmap(bitmap, SKShaderTileMode.Repeat, SKShaderTileMode.Repeat).WithColorFilter(CreateAlphaColorFilter(noiseOpacity));
+            }
+
+            using (SKShader? backdrop = SKShader.CreateColor(new SKColor(_material.MaterialColor.R, _material.MaterialColor.G, _material.MaterialColor.B, _material.MaterialColor.A)))
+            using (SKShader? tintShader = SKShader.CreateColor(tint))
+            using (SKShader? effectiveTint = SKShader.CreateCompose(backdrop, tintShader))
+            using (SKShader? compose = SKShader.CreateCompose(effectiveTint, _acrylicNoiseShader))
+            {
+                acrylliPaint.Shader = compose;
+                acrylliPaint.IsAntialias = true;
+                lease.SkCanvas.DrawRect(0, 0, (float) _bounds.Width, (float) _bounds.Height, acrylliPaint);
+            }
+        }
+    }
+
+    public Rect Bounds => _bounds.Inflate(4);
+
+    public bool Equals(ICustomDrawOperation? other)
+    {
+        return other is AcrylicBlurRenderOperation op && op._bounds == _bounds && op._material.Equals(_material);
+    }
+}

src/Artemis.UI/Screens/Workshop/Entries/EntryListView.axaml

@@ -5,31 +5,40 @@
              xmlns:avalonia="clr-namespace:Material.Icons.Avalonia;assembly=Material.Icons.Avalonia"
              xmlns:entries="clr-namespace:Artemis.UI.Screens.Workshop.Profile"
              xmlns:entries1="clr-namespace:Artemis.UI.Screens.Workshop.Entries"
-             mc:Ignorable="d" d:DesignWidth="800" d:DesignHeight="120"
+             mc:Ignorable="d" d:DesignWidth="800" d:DesignHeight="110"
              x:Class="Artemis.UI.Screens.Workshop.Entries.EntryListView"
              x:DataType="entries1:EntryListViewModel">
-    <Border Classes="card" MinHeight="120">
+    <Button MinHeight="110" 
+            MaxHeight="140" 
+            Padding="16"
+            CornerRadius="8"
+            HorizontalAlignment="Stretch"
+            HorizontalContentAlignment="Stretch" 
+            Command="{CompiledBinding NavigateToEntry}">
         <Grid ColumnDefinitions="Auto,*,Auto">
+            <!-- Icon -->
             <Border Grid.Column="0"
-                    Cursor="Hand"
                     CornerRadius="12"
                     Background="{StaticResource ControlStrokeColorOnAccentDefault}"
                     VerticalAlignment="Center"
                     Margin="0 0 10 0"
-                    Width="90"
-                    Height="90" 
-                    PointerReleased="InputElement_OnPointerReleased">
-                <avalonia:MaterialIcon Kind="HandOkay" VerticalAlignment="Stretch" HorizontalAlignment="Stretch" Width="80" Height="80"/>
+                    Width="80"
+                    Height="80">
+                <avalonia:MaterialIcon Kind="HandOkay" VerticalAlignment="Stretch" HorizontalAlignment="Stretch" Width="70" Height="70" />
             </Border>
-
-
+            
+            <!-- Body -->
             <Grid Grid.Column="1" VerticalAlignment="Stretch" RowDefinitions="Auto,*,Auto">
-                <TextBlock Grid.Row="0" Margin="0 0 0 5" Cursor="Hand" PointerReleased="InputElement_OnPointerReleased">
-                    <Run Classes="h4" Text="{CompiledBinding Entry.Name, FallbackValue=Title}" />
+                <TextBlock Grid.Row="0" Margin="0 0 0 5" TextTrimming="CharacterEllipsis" >
+                    <Run Classes="h5" Text="{CompiledBinding Entry.Name, FallbackValue=Title}" />
                     <Run Classes="subtitle">by</Run>
                     <Run Classes="subtitle" Text="{CompiledBinding Entry.Author, FallbackValue=Author}" />
                 </TextBlock>
-                <TextBlock Grid.Row="1" FontSize="15" Classes="subtitle" Text="{CompiledBinding Entry.Summary, FallbackValue=Summary}"></TextBlock>
+                <TextBlock Grid.Row="1" 
+                           Classes="subtitle" 
+                           TextWrapping="Wrap"
+                           TextTrimming="CharacterEllipsis" 
+                           Text="{CompiledBinding Entry.Summary, FallbackValue=Summary}"></TextBlock>
 
                 <ItemsControl Grid.Row="2" ItemsSource="{CompiledBinding Entry.Categories}">
                     <ItemsControl.ItemsPanel>
@@ -41,12 +50,14 @@
                         <DataTemplate>
                             <StackPanel Orientation="Horizontal">
                                 <avalonia:MaterialIcon Kind="{CompiledBinding Icon}" Margin="0 0 3 0"></avalonia:MaterialIcon>
-                                <TextBlock Text="{CompiledBinding Name}" />
+                                <TextBlock Text="{CompiledBinding Name}" TextTrimming="CharacterEllipsis" />
                             </StackPanel>
                         </DataTemplate>
                     </ItemsControl.ItemTemplate>
                 </ItemsControl>
             </Grid>
+            
+            <!-- Info -->
             <StackPanel Grid.Column="2">
                 <TextBlock TextAlignment="Right" Text="{CompiledBinding Entry.CreatedAt, StringFormat={}{0:g}, FallbackValue=01-01-1337}" />
                 <TextBlock TextAlignment="Right">
@@ -54,8 +65,7 @@
                     <Run Classes="h5" Text="{CompiledBinding Entry.Downloads, FallbackValue=0}" />
                     <Run>downloads</Run>
                 </TextBlock>
-
             </StackPanel>
         </Grid>
-    </Border>
+    </Button>
 </UserControl>

src/Artemis.UI/Screens/Workshop/Entries/EntryListView.axaml.cs

@@ -16,9 +16,4 @@ public partial class EntryListView : ReactiveUserControl<EntryListViewModel>
     {
         AvaloniaXamlLoader.Load(this);
     }
-
-    private async void InputElement_OnPointerReleased(object? sender, PointerReleasedEventArgs e)
-    {
-        await ViewModel.NavigateToEntry();
-    }
 }

src/Artemis.UI/Screens/Workshop/Entries/EntryListViewModel.cs

@@ -1,8 +1,10 @@
 using System;
+using System.Reactive;
 using System.Threading.Tasks;
 using Artemis.UI.Shared;
 using Artemis.UI.Shared.Routing;
 using Artemis.WebClient.Workshop;
+using ReactiveUI;
 
 namespace Artemis.UI.Screens.Workshop.Entries;
 
@@ -14,11 +16,13 @@ public class EntryListViewModel : ViewModelBase
     {
         _router = router;
         Entry = entry;
+        NavigateToEntry = ReactiveCommand.CreateFromTask(ExecuteNavigateToEntry);
     }
 
     public IGetEntries_Entries_Items Entry { get; }
+    public ReactiveCommand<Unit,Unit> NavigateToEntry { get; }
 
-    public async Task NavigateToEntry()
+    private async Task ExecuteNavigateToEntry()
     {
         switch (Entry.EntryType)
         {

src/Artemis.UI/Screens/Workshop/Home/WorkshopHomeView.axaml

@@ -4,55 +4,78 @@
              xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
              xmlns:avalonia="clr-namespace:Material.Icons.Avalonia;assembly=Material.Icons.Avalonia"
              xmlns:home="clr-namespace:Artemis.UI.Screens.Workshop.Home"
-             mc:Ignorable="d" d:DesignWidth="800" d:DesignHeight="450"
+             xmlns:controls="clr-namespace:Artemis.UI.Controls"
+             xmlns:acrylicBlur="clr-namespace:Artemis.UI.Controls.AcrylicBlur"
+             mc:Ignorable="d" d:DesignWidth="1200" d:DesignHeight="800"
              x:Class="Artemis.UI.Screens.Workshop.Home.WorkshopHomeView"
              x:DataType="home:WorkshopHomeViewModel">
     <Border Classes="router-container">
-		<Grid RowDefinitions="200,*">
-			<Image Grid.Row="0"
-				   Grid.RowSpan="2"
+        <Grid RowDefinitions="200,*,*">
+            <Image Grid.Row="0"
+                   Grid.RowSpan="2"
                    VerticalAlignment="Top"
-				   Source="/Assets/Images/workshop-banner.jpg"
-				   Height="200"
-				   Stretch="UniformToFill"
-				   RenderOptions.BitmapInterpolationMode="HighQuality">
-				<Image.OpacityMask>
-					<LinearGradientBrush StartPoint="0%,70%" EndPoint="0%,100%">
-						<GradientStops>
-							<GradientStop Color="Black" Offset="0"></GradientStop>
-							<GradientStop Color="Transparent" Offset="100"></GradientStop>
-						</GradientStops>
-					</LinearGradientBrush>
-				</Image.OpacityMask>
-			</Image>
+                   Source="/Assets/Images/workshop-banner.jpg"
+                   Height="200"
+                   Stretch="UniformToFill"
+                   RenderOptions.BitmapInterpolationMode="HighQuality">
+                <Image.OpacityMask>
+                    <LinearGradientBrush StartPoint="0%,70%" EndPoint="0%,100%">
+                        <GradientStops>
+                            <GradientStop Color="Black" Offset="0"></GradientStop>
+                            <GradientStop Color="Transparent" Offset="100"></GradientStop>
+                        </GradientStops>
+                    </LinearGradientBrush>
+                </Image.OpacityMask>
+            </Image>
 
-			<TextBlock Grid.Row="0"
-			           TextWrapping="Wrap"
-			           Foreground="White"
-			           FontSize="32"
-			           Margin="30"
-			           Text="Welcome to the Artemis Workshop!">
-				<TextBlock.Effect>
-					<DropShadowEffect Color="Black" OffsetX="2" OffsetY="2" BlurRadius="5"></DropShadowEffect>
-				</TextBlock.Effect>
-			</TextBlock>
-			
-			<StackPanel Grid.Row="1" Margin="30 -75 30 0" Spacing="10" Orientation="Horizontal" VerticalAlignment="Top">
-				<Button Width="150" Height="180" Command="{CompiledBinding Navigate}" CommandParameter="workshop/profiles/1" VerticalContentAlignment="Top">
-					<StackPanel>
-						<avalonia:MaterialIcon Kind="FolderVideo" HorizontalAlignment="Left" Width="60" Height="60" Margin="0 5"/>
-						<TextBlock TextWrapping="Wrap" FontSize="16" Margin="0 5">Profiles</TextBlock>
-						<TextBlock TextWrapping="Wrap" FontSize="12" Opacity="0.8">Browse new profiles created by other users.</TextBlock>
-					</StackPanel>
-				</Button>
-				<Button Width="150" Height="180" Command="{CompiledBinding Navigate}" CommandParameter="workshop/layouts/1" VerticalContentAlignment="Top">
-					<StackPanel>
-						<avalonia:MaterialIcon Kind="KeyboardVariant" HorizontalAlignment="Left" Width="60" Height="60" Margin="0 5"/>
-						<TextBlock TextWrapping="Wrap" FontSize="16" Margin="0 5">Layouts</TextBlock>
-						<TextBlock TextWrapping="Wrap" FontSize="12" Opacity="0.8">Layouts make your devices look great in the editor.</TextBlock>
-					</StackPanel>
-				</Button>
-			</StackPanel>
-		</Grid>
+            <TextBlock Grid.Row="0"
+                       TextWrapping="Wrap"
+                       Foreground="White"
+                       FontSize="32"
+                       Margin="30"
+                       Text="Welcome to the Artemis Workshop!">
+                <TextBlock.Effect>
+                    <DropShadowEffect Color="Black" OffsetX="2" OffsetY="2" BlurRadius="5"></DropShadowEffect>
+                </TextBlock.Effect>
+            </TextBlock>
+
+            <StackPanel Grid.Row="1" Margin="30 -75 30 0" Spacing="10" Orientation="Horizontal" VerticalAlignment="Top">
+                <Border CornerRadius="{DynamicResource ControlCornerRadius}" ClipToBounds="True">
+                    <acrylicBlur:AcrylicBlur Blur="17">
+                        <Button Width="150" Height="180" Command="{CompiledBinding Navigate}" CommandParameter="workshop/profiles/1" VerticalContentAlignment="Top">
+                            <StackPanel>
+                                <avalonia:MaterialIcon Kind="FolderVideo" HorizontalAlignment="Left" Width="60" Height="60" Margin="0 5" />
+                                <TextBlock TextWrapping="Wrap" FontSize="16" Margin="0 5">Profiles</TextBlock>
+                                <TextBlock TextWrapping="Wrap" FontSize="12" Opacity="0.8">Browse new profiles created by other users.</TextBlock>
+                            </StackPanel>
+                        </Button>
+                    </acrylicBlur:AcrylicBlur>
+                </Border>
+
+                <Border CornerRadius="{DynamicResource ControlCornerRadius}" ClipToBounds="True">
+                    <acrylicBlur:AcrylicBlur Blur="17">
+                        <Button Width="150" Height="180" Command="{CompiledBinding Navigate}" CommandParameter="workshop/layouts/1" VerticalContentAlignment="Top">
+                            <StackPanel>
+                                <avalonia:MaterialIcon Kind="KeyboardVariant" HorizontalAlignment="Left" Width="60" Height="60" Margin="0 5" />
+                                <TextBlock TextWrapping="Wrap" FontSize="16" Margin="0 5">Layouts</TextBlock>
+                                <TextBlock TextWrapping="Wrap" FontSize="12" Opacity="0.8">Layouts make your devices look great in the editor.</TextBlock>
+                            </StackPanel>
+                        </Button>
+                    </acrylicBlur:AcrylicBlur>
+                </Border>
+            </StackPanel>
+
+
+            <Grid Grid.Row="1" Width="320" Height="200">
+                <Grid>
+                    <Rectangle Fill="Aqua" Height="200" Width="100" HorizontalAlignment="Left" VerticalAlignment="Top" />
+                    <Ellipse Fill="Magenta" Height="152" Width="152" HorizontalAlignment="Center" VerticalAlignment="Center" />
+                    <Rectangle Fill="Yellow" Height="100" Width="80" HorizontalAlignment="Right" VerticalAlignment="Bottom" />
+                </Grid>
+                <acrylicBlur:AcrylicBlur Margin="12" Blur="17">
+                    <TextBlock>Test</TextBlock>
+                </acrylicBlur:AcrylicBlur>
+            </Grid>
+        </Grid>
     </Border>
-</UserControl>
+</UserControl>

src/Artemis.UI/Screens/Workshop/Profile/ProfileListView.axaml

@@ -16,20 +16,10 @@
                 <Border Classes="card" VerticalAlignment="Stretch" Margin="0,0,5,0">
                     <ContentControl Content="{CompiledBinding CategoriesViewModel}"></ContentControl>
                 </Border>
-
-                <TextBlock Classes="card-title">
-                    Filters
-                </TextBlock>
-                <Border Classes="card" VerticalAlignment="Stretch" Margin="0,0,5,0">
-                    <StackPanel>
-                        <Label>Author</Label>
-                        <AutoCompleteBox Watermark="Search authors.." />
-                    </StackPanel>
-                </Border>
-
             </StackPanel>
-
-            <ScrollViewer Grid.Column="1" Grid.Row="0">
+            
+            <ProgressBar Grid.Column="1" Grid.Row="0" VerticalAlignment="Top" Margin="0 26 20 0" IsVisible="{CompiledBinding IsLoading}" IsIndeterminate="True"/>
+            <ScrollViewer Grid.Column="1" Grid.Row="0" Margin="0 26 0 0">
                 <ItemsRepeater ItemsSource="{CompiledBinding Entries}" Margin="0 0 20 0">
                     <ItemsRepeater.ItemTemplate>
                         <DataTemplate>
@@ -41,6 +31,7 @@
 
             <pagination:Pagination Grid.Column="1"
                                    Grid.Row="1" 
+                                   Margin="0 20 0 10"
                                    IsVisible="{CompiledBinding ShowPagination}"
                                    Value="{CompiledBinding Page}" 
                                    Maximum="{CompiledBinding TotalPages}"

src/Artemis.UI/Screens/Workshop/Profile/ProfileListViewModel.cs

@@ -10,6 +10,8 @@ using Artemis.UI.Screens.Workshop.Entries;
 using Artemis.UI.Screens.Workshop.Parameters;
 using Artemis.UI.Shared;
 using Artemis.UI.Shared.Routing;
+using Artemis.UI.Shared.Services;
+using Artemis.UI.Shared.Services.Builders;
 using Artemis.WebClient.Workshop;
 using ReactiveUI;
 using StrawberryShake;
@@ -19,19 +21,24 @@ namespace Artemis.UI.Screens.Workshop.Profile;
 public class ProfileListViewModel : RoutableScreen<ActivatableViewModelBase, WorkshopListParameters>, IWorkshopViewModel
 {
     private readonly IRouter _router;
+    private readonly INotificationService _notificationService;
     private readonly IWorkshopClient _workshopClient;
     private readonly ObservableAsPropertyHelper<bool> _showPagination;
+    private readonly ObservableAsPropertyHelper<bool> _isLoading;
     private List<EntryListViewModel>? _entries;
     private int _page;
+    private int _loadedPage = -1;
     private int _totalPages = 1;
-    private int _entriesPerPage = 5;
+    private int _entriesPerPage = 10;
 
-    public ProfileListViewModel(IWorkshopClient workshopClient, IRouter router, CategoriesViewModel categoriesViewModel)
+    public ProfileListViewModel(IWorkshopClient workshopClient, IRouter router, CategoriesViewModel categoriesViewModel, INotificationService notificationService)
     {
         _workshopClient = workshopClient;
         _router = router;
+        _notificationService = notificationService;
         _showPagination = this.WhenAnyValue(vm => vm.TotalPages).Select(t => t > 1).ToProperty(this, vm => vm.ShowPagination);
-        
+        _isLoading = this.WhenAnyValue(vm => vm.Page, vm => vm.LoadedPage, (p, c) => p != c).ToProperty(this, vm => vm.IsLoading);
+
         CategoriesViewModel = categoriesViewModel;
 
         // Respond to page changes
@@ -49,6 +56,8 @@ public class ProfileListViewModel : RoutableScreen<ActivatableViewModelBase, Wor
     }
 
     public bool ShowPagination => _showPagination.Value;
+    public bool IsLoading => _isLoading.Value;
+    
     public CategoriesViewModel CategoriesViewModel { get; }
 
     public List<EntryListViewModel>? Entries
@@ -63,6 +72,12 @@ public class ProfileListViewModel : RoutableScreen<ActivatableViewModelBase, Wor
         set => RaiseAndSetIfChanged(ref _page, value);
     }
 
+    public int LoadedPage
+    {
+        get => _loadedPage;
+        set => RaiseAndSetIfChanged(ref _loadedPage, value);
+    }
+
     public int TotalPages
     {
         get => _totalPages;
@@ -78,25 +93,42 @@ public class ProfileListViewModel : RoutableScreen<ActivatableViewModelBase, Wor
     public override async Task OnNavigating(WorkshopListParameters parameters, NavigationArguments args, CancellationToken cancellationToken)
     {
         Page = Math.Max(1, parameters.Page);
-        
+
         // Throttle page changes
         await Task.Delay(200, cancellationToken);
-        
+
         if (!cancellationToken.IsCancellationRequested)
             await Query(cancellationToken);
     }
 
     private async Task Query(CancellationToken cancellationToken)
     {
-        EntryFilterInput filter = GetFilter();
-        IOperationResult<IGetEntriesResult> entries = await _workshopClient.GetEntries.ExecuteAsync(filter, EntriesPerPage * (Page - 1), EntriesPerPage, cancellationToken);
-        if (!entries.IsErrorResult() && entries.Data?.Entries?.Items != null)
+        try
         {
-            Entries = entries.Data.Entries.Items.Select(n => new EntryListViewModel(n, _router)).ToList();
-            TotalPages = (int) Math.Ceiling(entries.Data.Entries.TotalCount / (double) EntriesPerPage);
+            EntryFilterInput filter = GetFilter();
+            IOperationResult<IGetEntriesResult> entries = await _workshopClient.GetEntries.ExecuteAsync(filter, EntriesPerPage * (Page - 1), EntriesPerPage, cancellationToken);
+            entries.EnsureNoErrors();
+            
+            if (entries.Data?.Entries?.Items != null)
+            {
+                Entries = entries.Data.Entries.Items.Select(n => new EntryListViewModel(n, _router)).ToList();
+                TotalPages = (int) Math.Ceiling(entries.Data.Entries.TotalCount / (double) EntriesPerPage);
+            }
+            else
+                TotalPages = 1;
+        }
+        catch (Exception e)
+        {
+            _notificationService.CreateNotification()
+                .WithTitle("Failed to load entries")
+                .WithMessage(e.Message)
+                .WithSeverity(NotificationSeverity.Error)
+                .Show();
+        }
+        finally
+        {
+            LoadedPage = Page;
         }
-        else
-            TotalPages = 1;
     }
 
     private EntryFilterInput GetFilter()

src/Artemis.UI/Styles/Artemis.axaml

@@ -13,6 +13,7 @@
         <ResourceDictionary>
             <ResourceDictionary.MergedDictionaries>
                 <MergeResourceInclude Source="TreeView.axaml"></MergeResourceInclude>
+                <MergeResourceInclude Source="/Controls/AcrylicBlur/AcrylicBlur.axaml"></MergeResourceInclude>
             </ResourceDictionary.MergedDictionaries>
         </ResourceDictionary>
     </Styles.Resources>