feat: make demo use mud

sitkoru · Jan 17, 2022 · ad86258 · ad86258
1 parent f6b5a41
commit ad86258
Show file tree

Hide file tree

Showing 11 changed files with 47 additions and 70 deletions.
diff --git a/apps/Sitko.Blockly.Demo/App.razor b/apps/Sitko.Blockly.Demo/App.razor
@@ -8,4 +8,6 @@
         </LayoutView>
     </NotFound>
 </Router>
-<AntContainer></AntContainer>
+<MudThemeProvider/>
+<MudDialogProvider/>
+<MudSnackbarProvider/>
diff --git a/apps/Sitko.Blockly.Demo/BlocklyApplication.cs b/apps/Sitko.Blockly.Demo/BlocklyApplication.cs
@@ -3,7 +3,8 @@
 using Sitko.Blockly.AntDesignComponents;
 using Sitko.Blockly.Demo.Data;
 using Sitko.Core.App.Localization;
-using Sitko.Core.Blazor.AntDesign.Server;
+using Sitko.Core.Blazor.MudBlazor.Server;
+using Sitko.Core.Blazor.Server;
 using Sitko.Core.Db.Postgres;
 using Sitko.Core.Repository.EntityFrameworkCore;
 using Sitko.Core.Storage;
@@ -12,7 +13,7 @@
 
 namespace Sitko.Blockly.Demo;
 
-public class BlocklyApplication : AntBlazorApplication<Startup>
+public class BlocklyApplication : MudBlazorApplication<Startup>
 {
     public BlocklyApplication(string[] args) : base(args)
     {

diff --git a/apps/Sitko.Blockly.Demo/Pages/Index.razor b/apps/Sitko.Blockly.Demo/Pages/Index.razor
@@ -29,7 +29,7 @@
                 </Extra>
                 <ChildContent>
                     <MudBlocksList
-                        EntityBlocks="post.Blocks" Options="@(new AntDesignBlocklyListOptions(BlocksListMode.Preview, GetService<IStorage<BlocklyStorageOptions>>(), $"Posts/{post.Id}"))">
+                        EntityBlocks="post.Blocks" Options="@(new MudBlazorBlocklyListOptions(BlocksListMode.Preview, GetService<IStorage<BlocklyStorageOptions>>(), $"Posts/{post.Id}"))">
                     </MudBlocksList>
                 </ChildContent>
             </Card>

diff --git a/apps/Sitko.Blockly.Demo/Pages/PostForm.cs b/apps/Sitko.Blockly.Demo/Pages/PostForm.cs
@@ -4,16 +4,16 @@
 using Sitko.Blockly.Demo.Data.Entities;
 using Sitko.Blockly.Validation;
 using Sitko.Core.Blazor.Forms;
+using Sitko.Core.Blazor.MudBlazorComponents;
 
 namespace Sitko.Blockly.Demo.Pages;
 
 using Blazor.Extensions;
-using Core.Blazor.AntDesignComponents.Components;
 using Data.Repositories;
 using KellermanSoftware.CompareNetObjects;
 using Microsoft.AspNetCore.Components;
 
-public class PostForm : BaseAntRepositoryForm<Post, Guid, PostsRepository>
+public class PostForm : BaseMudRepositoryForm<Post, Guid, PostsRepository>
 {
     [Parameter] public RenderFragment<PostForm> ChildContent { get; set; } = null!;
 

diff --git a/apps/Sitko.Blockly.Demo/Pages/PostFormComponent.razor b/apps/Sitko.Blockly.Demo/Pages/PostFormComponent.razor
@@ -4,14 +4,15 @@
 @using Sitko.Blockly.Blazor.Forms
 @using Sitko.Core.Storage
 @using Sitko.Blazor.CKEditor.Bundle
+
 @inherits BaseComponent
-<PostForm Layout="@FormLayout.Vertical" EntityId="PostId" OnAfterCreate="post => GoToPost(post)">
-    <FormItem Label="Title">
-        <Input @bind-Value="context.Entity.Title"/>
-    </FormItem>
-    <AntBlocklyForm Label="Blocks" @bind-Value="context.Entity.Blocks" Options="blocksOptions"></AntBlocklyForm>
-    <AntBlocklyForm Label="Secondary blocks" @bind-Value="context.Entity.SecondaryBlocks" Options="secondaryBlocksOptions"></AntBlocklyForm>
-    <Button Disabled="@(!context.CanSave())" OnClick="context.Save">Save</Button>
+<PostForm EntityId="PostId" OnAfterCreate="post => GoToPost(post)">
+    <MudItem Label="Title">
+        <MudTextField @bind-Value="context.Entity.Title"/>
+    </MudItem>
+    <MudBlocklyForm Label="Blocks" @bind-Value="context.Entity.Blocks" Options="blocksOptions"></MudBlocklyForm>
+    <MudBlocklyForm Label="Secondary blocks" @bind-Value="context.Entity.SecondaryBlocks" Options="secondaryBlocksOptions"></MudBlocklyForm>
+    <MudButton Disabled="@(!context.CanSave())" >Save</MudButton>
 </PostForm>
 
 @code {
@@ -25,8 +26,8 @@
         return Task.CompletedTask;
     }
 
-    private AntDesignBlocklyFormOptions? blocksOptions;
-    private AntDesignBlocklyFormOptions? secondaryBlocksOptions;
+    private MudBlazorBlocklyFormOptions? blocksOptions;
+    private MudBlazorBlocklyFormOptions? secondaryBlocksOptions;
 
     protected override void Initialize()
     {
@@ -55,7 +56,7 @@
         };
         var ckEditorConfig = CKEditorBundleOptions.DefaultConfig.WithHtmlEditing();
         ckEditorConfig.Language = "ru";
-        blocksOptions = new AntDesignBlocklyFormOptions
+        blocksOptions = new MudBlazorBlocklyFormOptions
         {
             Storage = GetService<IStorage<BlocklyStorageOptions>>(),
             ImagesOptions = imagesStorageOptions,
@@ -64,7 +65,7 @@
         blocksOptions.DisableBlocksDelete(new[] { typeof(TextBlock), typeof(CutBlock), typeof(GalleryBlock), typeof(YoutubeBlock) });
         blocksOptions.DisableBlocksMove(new[] { typeof(CutBlock), typeof(GalleryBlock) });
 
-        secondaryBlocksOptions = new AntDesignBlocklyFormOptions
+        secondaryBlocksOptions = new MudBlazorBlocklyFormOptions
         {
             MaxBlocks = 5, Storage = GetService<IStorage<BlocklyStorageOptions>>(),
             ImagesOptions = imagesStorageOptions,

diff --git a/apps/Sitko.Blockly.Demo/Pages/Show.razor b/apps/Sitko.Blockly.Demo/Pages/Show.razor
@@ -20,7 +20,7 @@
         <Content>
         </Content>
         <ChildContent>
-            <AntBlocksList EntityBlocks="Post.Blocks" Options="@(new AntDesignBlocklyListOptions(BlocksListMode.Full, GetService<IStorage<BlocklyStorageOptions>>()))"></AntBlocksList>
+            <MudBlocksList EntityBlocks="Post.Blocks" Options="@(new MudBlazorBlocklyListOptions(BlocksListMode.Full, GetService<IStorage<BlocklyStorageOptions>>()))"></MudBlocksList>
         </ChildContent>
     </PageContainer>
 }
diff --git a/apps/Sitko.Blockly.Demo/Pages/_Host.cshtml b/apps/Sitko.Blockly.Demo/Pages/_Host.cshtml
@@ -15,15 +15,9 @@
     <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
     <title>Sitko.Blockly.Demo</title>
     <base href="~/"/>
-    <link href="_content/AntDesign.ProLayout/css/ant-design-pro-layout-blazor.css" rel="stylesheet"/>
-    @if (options.CurrentValue.Theme == AntDesignBlocklyTheme.Dark)
-    {
-        <link href="_content/AntDesign/css/ant-design-blazor.dark.css" rel="stylesheet"/>
-    }
-    else
-    {
-        <link href="_content/AntDesign/css/ant-design-blazor.css" rel="stylesheet"/>
-    }
+    <link href="~/Sitko.Core.Apps.MudBlazor.styles.css" rel="stylesheet"/>
+    <link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700&display=swap" rel="stylesheet"/>
+    <link href="_content/MudBlazor/MudBlazor.min.css?v=5.0.14" rel="stylesheet"/>
     <link href="css/site.css" rel="stylesheet"/>
 </head>
 <body>
@@ -39,7 +33,7 @@
     <a href="" class="reload">Reload</a>
     <a class="dismiss">🗙</a>
 </div>
-<script src="_content/AntDesign/js/ant-design-blazor.js"></script>
 <script src="_framework/blazor.server.js"></script>
+<script src="_content/MudBlazor/MudBlazor.min.js?v=5.0.14"></script>
 </body>
 </html>
diff --git a/apps/Sitko.Blockly.Demo/Shared/MainLayout.razor b/apps/Sitko.Blockly.Demo/Shared/MainLayout.razor
@@ -1,30 +1,14 @@
-@using Layout = AntDesign.ProLayout.Layout
 @inherits LayoutComponentBase
 
-<BasicLayout MenuData="menuData" Theme="MenuTheme.Dark" Layout="Layout.Top" Logo="@("/logo.png")">
+<BasicMudLayout>
+    <Menu>
+        <MudNavMenu>
+            <MudNavLink Href="/" Match="NavLinkMatch.All" Icon="@Icons.Material.Outlined.Dashboard">Posts</MudNavLink>
+        </MudNavMenu>
+    </Menu>
     <ChildContent>
         @Body
     </ChildContent>
-    <FooterRender>
-        <GlobalFooter>
-            <Copyright>
-                <div>
-                    Sitko.ru <Icon Type="copyright"/> @DateTimeOffset.UtcNow.Year
-                </div>
-            </Copyright>
-        </GlobalFooter>
-    </FooterRender>
-</BasicLayout>
+      Sitko.ru <MudIcon Icon="@Icons.Filled.Copyright"/> @DateTimeOffset.UtcNow.Year
+</BasicMudLayout>
 
-@code
-{
-    private readonly MenuDataItem[] menuData =
-    {
-        new()
-        {
-            Path = "/",
-            Name = "Posts",
-            Key = "posts"
-        }
-    };
-}
diff --git a/apps/Sitko.Blockly.Demo/Sitko.Blockly.Demo.csproj b/apps/Sitko.Blockly.Demo/Sitko.Blockly.Demo.csproj
@@ -13,7 +13,7 @@
   </ItemGroup>
 
   <ItemGroup>
-    <PackageReference Include="AntDesign.ProLayout" Version="0.1.10" />
+    <PackageReference Include="Sitko.Core.Blazor.MudBlazor.Server" Version="9.0.0-beta.3" />
     <PackageReference Include="Sitko.Core.Repository.EntityFrameworkCore" Version="9.0.0-beta.1" />
     <PackageReference Include="Microsoft.EntityFrameworkCore.Design" Version="6.0.1">
       <PrivateAssets>all</PrivateAssets>
@@ -22,7 +22,6 @@
     <PackageReference Include="Sitko.Core.Storage.Metadata.Postgres" Version="9.0.0-beta.1" />
     <PackageReference Include="Sitko.Core.Configuration.Vault" Version="9.0.0-beta.1" />
     <PackageReference Include="Sitko.Core.Storage.FileSystem" Version="9.0.0-beta.1" />
-    <PackageReference Include="Sitko.Core.Blazor.AntDesign.Server" Version="9.0.0-beta.1" />
   </ItemGroup>
 
 </Project>
diff --git a/apps/Sitko.Blockly.Demo/Startup.cs b/apps/Sitko.Blockly.Demo/Startup.cs
@@ -1,14 +1,15 @@
-using AntDesign.ProLayout;
-using FluentValidation;
+using FluentValidation;
 using Microsoft.AspNetCore.Builder;
 using Microsoft.Extensions.Configuration;
 using Microsoft.Extensions.DependencyInjection;
 using Microsoft.Extensions.Hosting;
-using Sitko.Core.Blazor.AntDesign.Server;
+using MudBlazor.Services;
+using Sitko.Core.Blazor.MudBlazor.Server;
+using Sitko.Core.Blazor.Server;
 
 namespace Sitko.Blockly.Demo;
 
-public class Startup : AntBlazorStartup
+public class Startup : MudBlazorStartup
 {
     public Startup(IConfiguration configuration, IHostEnvironment environment) : base(configuration, environment)
     {
@@ -18,11 +19,9 @@ protected override void ConfigureAppServices(IServiceCollection services)
     {
         base.ConfigureAppServices(services);
         services.AddValidatorsFromAssemblyContaining<Startup>();
-        services.Configure<ProSettings>(settings =>
-        {
-            settings.Title = "Blockly";
-            settings.NavTheme = "dark";
-        });
+        services.AddMudServices();
+        services.AddServerSideBlazor().AddCircuitOptions(options => {  options.DetailedErrors = true; });
+
     }
 
     protected override void ConfigureAfterRoutingMiddleware(IApplicationBuilder app)

diff --git a/apps/Sitko.Blockly.Demo/_Imports.razor b/apps/Sitko.Blockly.Demo/_Imports.razor
@@ -8,11 +8,8 @@
 @using Microsoft.JSInterop
 @using Sitko.Blockly.Demo.Shared
 @using Sitko.Blockly.Demo
-@using Sitko.Blockly.AntDesignComponents.Forms
-@using Sitko.Blockly.AntDesignComponents.Display
-@using Sitko.Blockly.MudBlazor.Forms
-@using Sitko.Blockly.MudBlazor.Display
+@using Sitko.Blockly.MudBlazorComponents.Forms
+@using Sitko.Blockly.MudBlazorComponents.Display
 @using Sitko.Core.Blazor.Components
-@using Sitko.Core.Blazor.AntDesignComponents.Components
-@using AntDesign
-@using AntDesign.ProLayout
+@using MudBlazor
+