Update grid column captions to German

Changed "Added" to "Angelegt am" and "Changed" to "Geändert am" in the data grid column headers for improved localization. No other column settings were modified.

DbFirst.API/Controllers/DefaultDashboardController.cs

@@ -0,0 +1,14 @@
+using DevExpress.DashboardAspNetCore;
+using DevExpress.DashboardWeb;
+using Microsoft.AspNetCore.DataProtection;
+
+namespace BlazorDashboardApp.Server
+{
+    public class DefaultDashboardController : DashboardController
+    {
+        public DefaultDashboardController(DashboardConfigurator configurator, IDataProtectionProvider? dataProtectionProvider = null)
+            : base(configurator, dataProtectionProvider)
+        {
+        }
+    }
+}

DbFirst.API/Controllers/MassDataController.cs

@@ -0,0 +1,53 @@
+using DbFirst.Application.MassData;
+using DbFirst.Application.MassData.Commands;
+using DbFirst.Application.MassData.Queries;
+using MediatR;
+using Microsoft.AspNetCore.Mvc;
+
+namespace DbFirst.API.Controllers;
+
+[ApiController]
+[Route("api/[controller]")]
+public class MassDataController : ControllerBase
+{
+    private readonly IMediator _mediator;
+
+    public MassDataController(IMediator mediator)
+    {
+        _mediator = mediator;
+    }
+
+    [HttpGet("count")]
+    public async Task<ActionResult<int>> GetCount(CancellationToken cancellationToken)
+    {
+        var count = await _mediator.Send(new GetMassDataCountQuery(), cancellationToken);
+        return Ok(count);
+    }
+
+    [HttpGet]
+    public async Task<ActionResult<IEnumerable<MassDataReadDto>>> GetAll([FromQuery] int? skip, [FromQuery] int? take, CancellationToken cancellationToken)
+    {
+        var resolvedTake = take is null or <= 0 ? 200 : take;
+        var result = await _mediator.Send(new GetAllMassDataQuery(skip, resolvedTake), cancellationToken);
+        return Ok(result);
+    }
+
+    [HttpGet("{customerName}")]
+    public async Task<ActionResult<MassDataReadDto>> GetByCustomerName(string customerName, CancellationToken cancellationToken)
+    {
+        var result = await _mediator.Send(new GetMassDataByCustomerNameQuery(customerName), cancellationToken);
+        if (result == null)
+        {
+            return NotFound();
+        }
+
+        return Ok(result);
+    }
+
+    [HttpPost("upsert")]
+    public async Task<ActionResult<MassDataReadDto>> Upsert(MassDataWriteDto dto, CancellationToken cancellationToken)
+    {
+        var result = await _mediator.Send(new UpsertMassDataByCustomerNameCommand(dto), cancellationToken);
+        return Ok(result);
+    }
+}

DbFirst.API/Dashboards/DashboardChangeNotifier.cs

@@ -0,0 +1,19 @@
+using DbFirst.API.Hubs;
+using Microsoft.AspNetCore.SignalR;
+
+namespace DbFirst.API.Dashboards;
+
+public class DashboardChangeNotifier : IDashboardChangeNotifier
+{
+    private readonly IHubContext<DashboardsHub> _hubContext;
+
+    public DashboardChangeNotifier(IHubContext<DashboardsHub> hubContext)
+    {
+        _hubContext = hubContext;
+    }
+
+    public void NotifyChanged()
+    {
+        _ = _hubContext.Clients.All.SendAsync("DashboardsChanged");
+    }
+}

DbFirst.API/Dashboards/IDashboardChangeNotifier.cs

@@ -0,0 +1,6 @@
+namespace DbFirst.API.Dashboards;
+
+public interface IDashboardChangeNotifier
+{
+    void NotifyChanged();
+}

DbFirst.API/Dashboards/SqlDashboardStorage.cs

@@ -0,0 +1,138 @@
+using System.Data;
+using System.Text;
+using System.Xml.Linq;
+using DevExpress.DashboardWeb;
+using Microsoft.Data.SqlClient;
+
+namespace DbFirst.API.Dashboards;
+
+public sealed class SqlDashboardStorage : IEditableDashboardStorage
+{
+    private readonly string _connectionString;
+    private readonly string _tableName;
+    private readonly Func<string?>? _userProvider;
+    private readonly IDashboardChangeNotifier? _notifier;
+
+    public SqlDashboardStorage(string connectionString, string tableName = "TBDD_SMF_CONFIG", Func<string?>? userProvider = null, IDashboardChangeNotifier? notifier = null)
+    {
+        _connectionString = connectionString;
+        _tableName = tableName;
+        _userProvider = userProvider;
+        _notifier = notifier;
+    }
+
+    public IEnumerable<DashboardInfo> GetAvailableDashboardsInfo()
+    {
+        var dashboards = new List<DashboardInfo>();
+
+        using var connection = new SqlConnection(_connectionString);
+        using var command = new SqlCommand($"SELECT DashboardId, DashboardName FROM dbo.[{_tableName}] WHERE ACTIVE = 1 ORDER BY DashboardName", connection);
+
+        connection.Open();
+        using var reader = command.ExecuteReader();
+        while (reader.Read())
+        {
+            var id = reader.GetString(0);
+            var name = reader.GetString(1);
+            dashboards.Add(new DashboardInfo { ID = id, Name = name });
+        }
+
+        return dashboards;
+    }
+
+    public XDocument LoadDashboard(string dashboardId)
+    {
+        using var connection = new SqlConnection(_connectionString);
+        using var command = new SqlCommand($"SELECT DashboardData FROM dbo.[{_tableName}] WHERE DashboardId = @Id AND ACTIVE = 1", connection);
+        command.Parameters.Add(new SqlParameter("@Id", SqlDbType.NVarChar, 128) { Value = dashboardId });
+
+        connection.Open();
+        var data = command.ExecuteScalar() as byte[];
+        if (data == null)
+        {
+            throw new ArgumentException($"Dashboard '{dashboardId}' not found.");
+        }
+
+        var xml = Encoding.UTF8.GetString(data);
+        var doc = XDocument.Parse(xml);
+        NormalizeCatalogDateDimensions(doc);
+        return doc;
+    }
+
+    private static void NormalizeCatalogDateDimensions(XDocument doc)
+    {
+        var dateMembers = new HashSet<string>(StringComparer.OrdinalIgnoreCase)
+        {
+            "AddedWhen",
+            "ChangedWhen"
+        };
+
+        foreach (var dimension in doc.Descendants("Dimension"))
+        {
+            var member = dimension.Attribute("DataMember")?.Value;
+            if (member == null || !dateMembers.Contains(member))
+            {
+                continue;
+            }
+
+            var interval = dimension.Attribute("DateTimeGroupInterval")?.Value;
+            if (string.IsNullOrWhiteSpace(interval) || string.Equals(interval, "Year", StringComparison.OrdinalIgnoreCase))
+            {
+                dimension.SetAttributeValue("DateTimeGroupInterval", "DayMonthYear");
+            }
+        }
+    }
+
+    public string AddDashboard(XDocument dashboard, string dashboardName)
+    {
+        var id = string.IsNullOrWhiteSpace(dashboardName)
+            ? Guid.NewGuid().ToString("N")
+            : dashboardName;
+        var payload = Encoding.UTF8.GetBytes(dashboard.ToString(SaveOptions.DisableFormatting));
+        var userName = _userProvider?.Invoke();
+
+        using var connection = new SqlConnection(_connectionString);
+        using var command = new SqlCommand($"INSERT INTO dbo.[{_tableName}] (ACTIVE, DashboardId, DashboardName, DashboardData, ADDED_WHO, ADDED_WHEN) VALUES (1, @Id, @Name, @Data, COALESCE(@User, SUSER_SNAME()), SYSUTCDATETIME())", connection);
+        command.Parameters.Add(new SqlParameter("@Id", SqlDbType.NVarChar, 128) { Value = id });
+        command.Parameters.Add(new SqlParameter("@Name", SqlDbType.NVarChar, 256) { Value = string.IsNullOrWhiteSpace(dashboardName) ? id : dashboardName });
+        command.Parameters.Add(new SqlParameter("@Data", SqlDbType.VarBinary, -1) { Value = payload });
+        command.Parameters.Add(new SqlParameter("@User", SqlDbType.NVarChar, 50) { Value = (object?)userName ?? DBNull.Value });
+
+        connection.Open();
+        command.ExecuteNonQuery();
+        _notifier?.NotifyChanged();
+        return id;
+    }
+
+    public void SaveDashboard(string dashboardId, XDocument dashboard)
+    {
+        var payload = Encoding.UTF8.GetBytes(dashboard.ToString(SaveOptions.DisableFormatting));
+        var userName = _userProvider?.Invoke();
+
+        using var connection = new SqlConnection(_connectionString);
+        using var command = new SqlCommand($"UPDATE dbo.[{_tableName}] SET DashboardData = @Data, CHANGED_WHO = COALESCE(@User, SUSER_SNAME()), CHANGED_WHEN = SYSUTCDATETIME() WHERE DashboardId = @Id", connection);
+        command.Parameters.Add(new SqlParameter("@Id", SqlDbType.NVarChar, 128) { Value = dashboardId });
+        command.Parameters.Add(new SqlParameter("@Data", SqlDbType.VarBinary, -1) { Value = payload });
+        command.Parameters.Add(new SqlParameter("@User", SqlDbType.NVarChar, 50) { Value = (object?)userName ?? DBNull.Value });
+
+        connection.Open();
+        var rows = command.ExecuteNonQuery();
+        if (rows == 0)
+        {
+            throw new ArgumentException($"Dashboard '{dashboardId}' not found.");
+        }
+
+        _notifier?.NotifyChanged();
+    }
+
+    public void DeleteDashboard(string dashboardId)
+    {
+        using var connection = new SqlConnection(_connectionString);
+        using var command = new SqlCommand($"DELETE FROM dbo.[{_tableName}] WHERE DashboardId = @Id", connection);
+        command.Parameters.Add(new SqlParameter("@Id", SqlDbType.NVarChar, 128) { Value = dashboardId });
+
+        connection.Open();
+        command.ExecuteNonQuery();
+        _notifier?.NotifyChanged();
+    }
+}

DbFirst.API/Data/Dashboards/CatalogsGrid.xml

@@ -0,0 +1,52 @@
+<?xml version="1.0" encoding="utf-8"?>
+<Dashboard CurrencyCulture="de-DE" RequestParameters="false">
+  <Title Text="Catalogs (Dashboard Grid)" />
+  <DataSources>
+    <JsonDataSource Name="Catalogs (API)" ComponentName="catalogsDataSource">
+      <Source SourceType="DevExpress.DataAccess.Json.UriJsonSource" Uri="https://localhost:7204/api/catalogs" />
+    </JsonDataSource>
+  </DataSources>
+  <Items>
+    <Grid ComponentName="gridDashboardItem1" Name="Catalogs" DataSource="catalogsDataSource">
+      <DataItems>
+        <Dimension DataMember="Guid" DefaultId="DataItem0" />
+        <Dimension DataMember="CatTitle" DefaultId="DataItem1" />
+        <Dimension DataMember="CatString" DefaultId="DataItem2" />
+        <Dimension DataMember="AddedWho" DefaultId="DataItem3" />
+        <Dimension DataMember="AddedWhen" DefaultId="DataItem4" />
+        <Dimension DataMember="ChangedWho" DefaultId="DataItem5" />
+        <Dimension DataMember="ChangedWhen" DefaultId="DataItem6" />
+      </DataItems>
+      <GridColumns>
+        <GridDimensionColumn Name="Id">
+          <Dimension DefaultId="DataItem0" />
+        </GridDimensionColumn>
+        <GridDimensionColumn Name="Titel">
+          <Dimension DefaultId="DataItem1" />
+        </GridDimensionColumn>
+        <GridDimensionColumn Name="String">
+          <Dimension DefaultId="DataItem2" />
+        </GridDimensionColumn>
+        <GridDimensionColumn Name="Angelegt von">
+          <Dimension DefaultId="DataItem3" />
+        </GridDimensionColumn>
+        <GridDimensionColumn Name="Angelegt am">
+          <Dimension DefaultId="DataItem4" />
+        </GridDimensionColumn>
+        <GridDimensionColumn Name="Geändert von">
+          <Dimension DefaultId="DataItem5" />
+        </GridDimensionColumn>
+        <GridDimensionColumn Name="Geändert am">
+          <Dimension DefaultId="DataItem6" />
+        </GridDimensionColumn>
+      </GridColumns>
+      <GridOptions />
+      <ColumnFilterOptions />
+    </Grid>
+  </Items>
+  <LayoutTree>
+    <LayoutGroup Orientation="Vertical">
+      <LayoutItem DashboardItem="gridDashboardItem1" />
+    </LayoutGroup>
+  </LayoutTree>
+</Dashboard>

DbFirst.API/Data/Dashboards/DashboardStorage.sql

@@ -0,0 +1,17 @@
+CREATE TABLE dbo.TBDD_SMF_CONFIG (
+    [GUID] [bigint] IDENTITY(1,1) NOT NULL,
+    [ACTIVE] [bit] NOT NULL,
+    DashboardId NVARCHAR(128) NOT NULL,
+    DashboardName NVARCHAR(256) NOT NULL,
+    DashboardData VARBINARY(MAX) NOT NULL,
+    --- INSERT YOUR COLUMNS HERE ---
+    [ADDED_WHO] [nvarchar](50) NOT NULL,
+    [ADDED_WHEN] [datetime] NOT NULL,
+    [CHANGED_WHO] [nvarchar](50) NULL,
+    [CHANGED_WHEN] [datetime] NULL,
+ CONSTRAINT [PK_TBDD_SMF_CONFIG_DashboardStorage] PRIMARY KEY CLUSTERED 
+(
+    [GUID] ASC
+)WITH (PAD_INDEX = OFF, STATISTICS_NORECOMPUTE = ON, IGNORE_DUP_KEY = OFF, ALLOW_ROW_LOCKS = ON, ALLOW_PAGE_LOCKS = ON, FILLFACTOR = 80) ON [PRIMARY]
+) ON [PRIMARY]
+GO

DbFirst.API/Data/Dashboards/DefaultDashboard.xml

@@ -0,0 +1,55 @@
+<?xml version="1.0" encoding="utf-8"?>
+<Dashboard CurrencyCulture="de-DE" RequestParameters="false">
+  <Title Text="Default Dashboard" />
+  <DataSources>
+    <JsonDataSource Name="JSON Data Source (URL)" RootElement="Customers" ComponentName="jsonDataSource1">
+      <Source SourceType="DevExpress.DataAccess.Json.UriJsonSource" Uri="https://raw.githubusercontent.com/DevExpress-Examples/DataSources/master/JSON/customers.json" />
+    </JsonDataSource>
+    <JsonDataSource Name="Catalogs (API)" ComponentName="catalogsDataSource">
+      <Source SourceType="DevExpress.DataAccess.Json.UriJsonSource" Uri="https://localhost:7204/api/catalogs" />
+    </JsonDataSource>
+  </DataSources>
+  <Items>
+    <Grid ComponentName="gridDashboardItem2" Name="Grid 2" DataSource="catalogsDataSource">
+      <DataItems>
+        <Measure DataMember="guid" DefaultId="DataItem0" />
+        <Dimension DataMember="catTitle" DefaultId="DataItem1" />
+        <Dimension DataMember="catString" DefaultId="DataItem2" />
+        <Dimension DataMember="addedWhen" DefaultId="DataItem3" />
+        <Dimension DataMember="addedWho" DefaultId="DataItem4" />
+        <Dimension DataMember="changedWhen" DefaultId="DataItem5" />
+        <Dimension DataMember="changedWho" DefaultId="DataItem6" />
+      </DataItems>
+      <GridColumns>
+        <GridMeasureColumn>
+          <Measure DefaultId="DataItem0" />
+        </GridMeasureColumn>
+        <GridDimensionColumn>
+          <Dimension DefaultId="DataItem1" />
+        </GridDimensionColumn>
+        <GridDimensionColumn>
+          <Dimension DefaultId="DataItem2" />
+        </GridDimensionColumn>
+        <GridDimensionColumn>
+          <Dimension DefaultId="DataItem3" />
+        </GridDimensionColumn>
+        <GridDimensionColumn>
+          <Dimension DefaultId="DataItem4" />
+        </GridDimensionColumn>
+        <GridDimensionColumn>
+          <Dimension DefaultId="DataItem5" />
+        </GridDimensionColumn>
+        <GridDimensionColumn>
+          <Dimension DefaultId="DataItem6" />
+        </GridDimensionColumn>
+      </GridColumns>
+      <GridOptions />
+      <ColumnFilterOptions />
+    </Grid>
+  </Items>
+  <LayoutTree>
+    <LayoutGroup>
+      <LayoutItem DashboardItem="gridDashboardItem2" />
+    </LayoutGroup>
+  </LayoutTree>
+</Dashboard>

DbFirst.API/DbFirst.API.csproj

@@ -9,6 +9,7 @@
   <ItemGroup>
     <PackageReference Include="AutoMapper" Version="12.0.1" />
     <PackageReference Include="AutoMapper.Extensions.Microsoft.DependencyInjection" Version="12.0.1" />
+    <PackageReference Include="DevExpress.AspNetCore.Dashboard" Version="25.2.3" />
     <PackageReference Include="Microsoft.EntityFrameworkCore" Version="8.0.22" />
     <PackageReference Include="Microsoft.EntityFrameworkCore.SqlServer" Version="8.0.22" />
     <PackageReference Include="Microsoft.EntityFrameworkCore.Tools" Version="8.0.22">

DbFirst.API/Hubs/DashboardsHub.cs

@@ -0,0 +1,7 @@
+using Microsoft.AspNetCore.SignalR;
+
+namespace DbFirst.API.Hubs;
+
+public class DashboardsHub : Hub
+{
+}

DbFirst.API/Program.cs

@@ -1,9 +1,18 @@
 using DbFirst.API.Middleware;
+using DbFirst.API.Dashboards;
+using DbFirst.API.Hubs;
 using DbFirst.Application;
 using DbFirst.Application.Repositories;
 using DbFirst.Domain;
+using DbFirst.Domain.Entities;
 using DbFirst.Infrastructure;
 using DbFirst.Infrastructure.Repositories;
+using DevExpress.AspNetCore;
+using DevExpress.DashboardAspNetCore;
+using DevExpress.DashboardCommon;
+using DevExpress.DashboardWeb;
+using DevExpress.DataAccess.Json;
+using System.Xml.Linq;
 
 var builder = WebApplication.CreateBuilder(args);
 
@@ -43,6 +52,96 @@ builder.Services.AddInfrastructure(builder.Configuration);
 builder.Services.AddApplication();
 
 builder.Services.AddScoped<ICatalogRepository, CatalogRepository>();
+builder.Services.AddScoped<IMassDataRepository, MassDataRepository>();
+
+builder.Services.AddDevExpressControls();
+builder.Services.AddSignalR();
+builder.Services.AddSingleton<IDashboardChangeNotifier, DashboardChangeNotifier>();
+builder.Services.AddScoped<DashboardConfigurator>((IServiceProvider serviceProvider) => {
+    var dashboardsPath = Path.Combine(builder.Environment.ContentRootPath, "Data", "Dashboards");
+    Directory.CreateDirectory(dashboardsPath);
+
+    var defaultDashboardPath = Path.Combine(dashboardsPath, "DefaultDashboard.xml");
+    if (!File.Exists(defaultDashboardPath))
+    {
+        var defaultDashboard = new Dashboard();
+        defaultDashboard.Title.Text = "Default Dashboard";
+        defaultDashboard.SaveToXml(defaultDashboardPath);
+    }
+
+    var dashboardBaseUrl = builder.Configuration["Dashboard:BaseUrl"]
+        ?? builder.Configuration["ApiBaseUrl"]
+        ?? builder.Configuration["ASPNETCORE_URLS"]?.Split(';', StringSplitOptions.RemoveEmptyEntries).FirstOrDefault()
+        ?? "https://localhost:7204";
+
+    dashboardBaseUrl = dashboardBaseUrl.TrimEnd('/');
+
+    var catalogsGridDashboardPath = Path.Combine(dashboardsPath, "CatalogsGrid.xml");
+    if (!File.Exists(catalogsGridDashboardPath))
+    {
+        var dashboard = new Dashboard();
+        dashboard.Title.Text = "Catalogs (Dashboard Grid)";
+
+        var catalogDataSource = new DashboardJsonDataSource("Catalogs (API)")
+        {
+            ComponentName = "catalogsDataSource",
+            JsonSource = new UriJsonSource(new Uri($"{dashboardBaseUrl}/api/catalogs"))
+        };
+
+        dashboard.DataSources.Add(catalogDataSource);
+
+        var grid = new GridDashboardItem
+        {
+            DataSource = catalogDataSource,
+            Name = "Catalogs"
+        };
+
+        grid.Columns.Add(new GridDimensionColumn(new Dimension(nameof(VwmyCatalog.Guid))) { Name = "Id" });
+        grid.Columns.Add(new GridDimensionColumn(new Dimension(nameof(VwmyCatalog.CatTitle))) { Name = "Titel" });
+        grid.Columns.Add(new GridDimensionColumn(new Dimension(nameof(VwmyCatalog.CatString))) { Name = "String" });
+        grid.Columns.Add(new GridDimensionColumn(new Dimension(nameof(VwmyCatalog.AddedWho))) { Name = "Angelegt von" });
+        grid.Columns.Add(new GridDimensionColumn(new Dimension(nameof(VwmyCatalog.AddedWhen))) { Name = "Angelegt am" });
+        grid.Columns.Add(new GridDimensionColumn(new Dimension(nameof(VwmyCatalog.ChangedWho))) { Name = "Geändert von" });
+        grid.Columns.Add(new GridDimensionColumn(new Dimension(nameof(VwmyCatalog.ChangedWhen))) { Name = "Geändert am" });
+
+        dashboard.Items.Add(grid);
+
+        var layoutGroup = new DashboardLayoutGroup { Orientation = DashboardLayoutGroupOrientation.Vertical };
+        layoutGroup.ChildNodes.Add(new DashboardLayoutItem(grid));
+        dashboard.LayoutRoot = layoutGroup;
+
+        dashboard.SaveToXml(catalogsGridDashboardPath);
+    }
+
+    DashboardConfigurator configurator = new DashboardConfigurator();
+
+    var connectionString = builder.Configuration.GetConnectionString("DefaultConnection") ?? string.Empty;
+    var notifier = serviceProvider.GetRequiredService<IDashboardChangeNotifier>();
+    var dashboardStorage = new SqlDashboardStorage(connectionString, "TBDD_SMF_CONFIG", notifier: notifier);
+    configurator.SetDashboardStorage(dashboardStorage);
+
+    DataSourceInMemoryStorage dataSourceStorage = new DataSourceInMemoryStorage();
+    DashboardJsonDataSource jsonDataSourceUrl = new DashboardJsonDataSource("JSON Data Source (URL)");
+    jsonDataSourceUrl.JsonSource = new UriJsonSource(
+            new Uri("https://raw.githubusercontent.com/DevExpress-Examples/DataSources/master/JSON/customers.json"));
+    jsonDataSourceUrl.RootElement = "Customers";
+    dataSourceStorage.RegisterDataSource("jsonDataSourceUrl", jsonDataSourceUrl.SaveToXml());
+
+    var catalogsJsonDataSource = new DashboardJsonDataSource("Catalogs (API)")
+    {
+        ComponentName = "catalogsDataSource",
+        JsonSource = new UriJsonSource(new Uri($"{dashboardBaseUrl}/api/catalogs"))
+    };
+    dataSourceStorage.RegisterDataSource(catalogsJsonDataSource.ComponentName, catalogsJsonDataSource.SaveToXml());
+    dataSourceStorage.RegisterDataSource(catalogsJsonDataSource.Name, catalogsJsonDataSource.SaveToXml());
+
+    configurator.SetDataSourceStorage(dataSourceStorage);
+
+    EnsureDashboardInStorage(dashboardStorage, "DefaultDashboard", defaultDashboardPath);
+    EnsureDashboardInStorage(dashboardStorage, "CatalogsGrid", catalogsGridDashboardPath);
+
+    return configurator;
+});
 
 var app = builder.Build();
 
@@ -55,10 +154,25 @@ if (app.Environment.IsDevelopment())
 
 app.UseMiddleware<ExceptionHandlingMiddleware>();
 
+app.UseDevExpressControls();
 app.UseHttpsRedirection();
 app.UseCors();
 app.UseAuthorization();
 
+app.MapDashboardRoute("api/dashboard", "DefaultDashboard");
+app.MapHub<DashboardsHub>("/hubs/dashboards");
 app.MapControllers();
 
 app.Run();
+
+static void EnsureDashboardInStorage(IEditableDashboardStorage storage, string id, string filePath)
+{
+    var exists = storage.GetAvailableDashboardsInfo().Any(info => string.Equals(info.ID, id, StringComparison.OrdinalIgnoreCase));
+    if (exists || !File.Exists(filePath))
+    {
+        return;
+    }
+
+    var doc = XDocument.Load(filePath);
+    storage.AddDashboard(doc, id);
+}

DbFirst.API/appsettings.json

@@ -1,6 +1,10 @@
 {
   "ConnectionStrings": {
-    "DefaultConnection": "Server=SDD-VMP04-SQL17\\DD_DEVELOP01;Database=DD_ECM;User Id=sa;Password=dd;TrustServerCertificate=True;"
+    "DefaultConnection": "Server=SDD-VMP04-SQL17\\DD_DEVELOP01;Database=DD_ECM;User Id=sa;Password=dd;TrustServerCertificate=True;",
+    "MassDataConnection": "Server=SDD-VMP04-SQL19\\DD_DEVELOP01;Database=DD_ECM;User Id=sa;Password=dd;TrustServerCertificate=True;"
+  },
+  "Dashboard": {
+    "BaseUrl": "https://localhost:7204"
   },
   "Cors": {
     "AllowedOrigins": [

DbFirst.Application/MassData/Commands/UpsertMassDataByCustomerNameCommand.cs

@@ -0,0 +1,5 @@
+using MediatR;
+
+namespace DbFirst.Application.MassData.Commands;
+
+public record UpsertMassDataByCustomerNameCommand(MassDataWriteDto Dto) : IRequest<MassDataReadDto>;

DbFirst.Application/MassData/Commands/UpsertMassDataByCustomerNameHandler.cs

@@ -0,0 +1,24 @@
+using AutoMapper;
+using DbFirst.Application.Repositories;
+using MediatR;
+
+namespace DbFirst.Application.MassData.Commands;
+
+public class UpsertMassDataByCustomerNameHandler : IRequestHandler<UpsertMassDataByCustomerNameCommand, MassDataReadDto>
+{
+    private readonly IMassDataRepository _repository;
+    private readonly IMapper _mapper;
+
+    public UpsertMassDataByCustomerNameHandler(IMassDataRepository repository, IMapper mapper)
+    {
+        _repository = repository;
+        _mapper = mapper;
+    }
+
+    public async Task<MassDataReadDto> Handle(UpsertMassDataByCustomerNameCommand request, CancellationToken cancellationToken)
+    {
+        var dto = request.Dto;
+        var updated = await _repository.UpsertByCustomerNameAsync(dto.CustomerName, dto.Amount, dto.StatusFlag, dto.Category, cancellationToken);
+        return _mapper.Map<MassDataReadDto>(updated);
+    }
+}

DbFirst.Application/MassData/MassDataProfile.cs

@@ -0,0 +1,12 @@
+using AutoMapper;
+using DbFirst.Domain.Entities;
+
+namespace DbFirst.Application.MassData;
+
+public class MassDataProfile : Profile
+{
+    public MassDataProfile()
+    {
+        CreateMap<Massdata, MassDataReadDto>();
+    }
+}

DbFirst.Application/MassData/MassDataReadDto.cs

@@ -0,0 +1,12 @@
+namespace DbFirst.Application.MassData;
+
+public class MassDataReadDto
+{
+    public int Id { get; set; }
+    public string CustomerName { get; set; } = string.Empty;
+    public decimal Amount { get; set; }
+    public string Category { get; set; } = string.Empty;
+    public bool StatusFlag { get; set; }
+    public DateTime AddedWhen { get; set; }
+    public DateTime? ChangedWhen { get; set; }
+}

DbFirst.Application/MassData/MassDataWriteDto.cs

@@ -0,0 +1,9 @@
+namespace DbFirst.Application.MassData;
+
+public class MassDataWriteDto
+{
+    public string CustomerName { get; set; } = string.Empty;
+    public decimal Amount { get; set; }
+    public string Category { get; set; } = string.Empty;
+    public bool StatusFlag { get; set; }
+}

DbFirst.Application/MassData/Queries/GetAllMassDataHandler.cs

@@ -0,0 +1,23 @@
+using AutoMapper;
+using DbFirst.Application.Repositories;
+using MediatR;
+
+namespace DbFirst.Application.MassData.Queries;
+
+public class GetAllMassDataHandler : IRequestHandler<GetAllMassDataQuery, List<MassDataReadDto>>
+{
+    private readonly IMassDataRepository _repository;
+    private readonly IMapper _mapper;
+
+    public GetAllMassDataHandler(IMassDataRepository repository, IMapper mapper)
+    {
+        _repository = repository;
+        _mapper = mapper;
+    }
+
+    public async Task<List<MassDataReadDto>> Handle(GetAllMassDataQuery request, CancellationToken cancellationToken)
+    {
+        var items = await _repository.GetAllAsync(request.Skip, request.Take, cancellationToken);
+        return _mapper.Map<List<MassDataReadDto>>(items);
+    }
+}

DbFirst.Application/MassData/Queries/GetAllMassDataQuery.cs

@@ -0,0 +1,5 @@
+using MediatR;
+
+namespace DbFirst.Application.MassData.Queries;
+
+public record GetAllMassDataQuery(int? Skip, int? Take) : IRequest<List<MassDataReadDto>>;

DbFirst.Application/MassData/Queries/GetMassDataByCustomerNameHandler.cs

@@ -0,0 +1,23 @@
+using AutoMapper;
+using DbFirst.Application.Repositories;
+using MediatR;
+
+namespace DbFirst.Application.MassData.Queries;
+
+public class GetMassDataByCustomerNameHandler : IRequestHandler<GetMassDataByCustomerNameQuery, MassDataReadDto?>
+{
+    private readonly IMassDataRepository _repository;
+    private readonly IMapper _mapper;
+
+    public GetMassDataByCustomerNameHandler(IMassDataRepository repository, IMapper mapper)
+    {
+        _repository = repository;
+        _mapper = mapper;
+    }
+
+    public async Task<MassDataReadDto?> Handle(GetMassDataByCustomerNameQuery request, CancellationToken cancellationToken)
+    {
+        var item = await _repository.GetByCustomerNameAsync(request.CustomerName, cancellationToken);
+        return item == null ? null : _mapper.Map<MassDataReadDto>(item);
+    }
+}

DbFirst.Application/MassData/Queries/GetMassDataByCustomerNameQuery.cs

@@ -0,0 +1,5 @@
+using MediatR;
+
+namespace DbFirst.Application.MassData.Queries;
+
+public record GetMassDataByCustomerNameQuery(string CustomerName) : IRequest<MassDataReadDto?>;

DbFirst.Application/MassData/Queries/GetMassDataCountHandler.cs

@@ -0,0 +1,19 @@
+using DbFirst.Application.Repositories;
+using MediatR;
+
+namespace DbFirst.Application.MassData.Queries;
+
+public class GetMassDataCountHandler : IRequestHandler<GetMassDataCountQuery, int>
+{
+    private readonly IMassDataRepository _repository;
+
+    public GetMassDataCountHandler(IMassDataRepository repository)
+    {
+        _repository = repository;
+    }
+
+    public async Task<int> Handle(GetMassDataCountQuery request, CancellationToken cancellationToken)
+    {
+        return await _repository.GetCountAsync(cancellationToken);
+    }
+}

DbFirst.Application/MassData/Queries/GetMassDataCountQuery.cs

@@ -0,0 +1,5 @@
+using MediatR;
+
+namespace DbFirst.Application.MassData.Queries;
+
+public record GetMassDataCountQuery : IRequest<int>;

DbFirst.Application/Repositories/IMassDataRepository.cs

@@ -0,0 +1,11 @@
+using DbFirst.Domain.Entities;
+
+namespace DbFirst.Application.Repositories;
+
+public interface IMassDataRepository
+{
+    Task<int> GetCountAsync(CancellationToken cancellationToken = default);
+    Task<List<Massdata>> GetAllAsync(int? skip = null, int? take = null, CancellationToken cancellationToken = default);
+    Task<Massdata?> GetByCustomerNameAsync(string customerName, CancellationToken cancellationToken = default);
+    Task<Massdata> UpsertByCustomerNameAsync(string customerName, decimal amount, bool statusFlag, string category, CancellationToken cancellationToken = default);
+}

DbFirst.BlazorWasm/Ablauf.cs

@@ -0,0 +1,60 @@
+/*
+Ablauf und die Rolle jeder Datei in der Blazor WebAssembly-Anwendung:
+
+1.index.html
+•	Reihenfolge: Wird als erstes geladen, wenn die Anwendung im Browser geöffnet wird.
+•	Purpose:
+•	Lädt die Blazor WebAssembly-Umgebung (blazor.webassembly.js).
+•	Definiert den Platzhalter <div id="app">, in dem die Blazor-Komponenten gerendert werden.
+•	Bindet Stylesheets und Skripte ein, die für das Styling und die Funktionalität der Anwendung benötigt werden.
+
+2. Program.cs
+•	Reihenfolge: Wird nach index.html ausgeführt, sobald die Blazor-Umgebung initialisiert ist.
+•	Purpose:
+•	Initialisiert die Blazor WebAssembly-Anwendung.
+•	Registriert Root-Komponenten (App) und Abhängigkeiten (z. B. HttpClient, CatalogApiClient).
+•	Konfiguriert die Basis-URL für API-Aufrufe.
+
+3. App.razor
+•	Reihenfolge: Wird als nächstes geladen, nachdem die Anwendung initialisiert wurde.
+•	Purpose:
+•	Definiert die Routing-Logik der Anwendung.
+•	Entscheidet, welche Komponente basierend auf der URL gerendert wird.
+•	Stellt sicher, dass ein Standardlayout (MainLayout) verwendet wird.
+
+4.MainLayout.razor
+•	Reihenfolge: Wird geladen, wenn eine Seite gerendert wird, da es das Standardlayout ist.
+•	Purpose:
+•	Definiert das Hauptlayout der Anwendung.
+•	Enthält die Navigationsleiste (NavMenu) und den Platzhalter für den Seiteninhalt (@Body).
+
+5. NavMenu.razor
+•	Reihenfolge: Wird als Teil des Layouts (MainLayout) geladen.
+•	Purpose:
+•	Stellt die Navigationsleiste bereit.
+•	Enthält Links zu verschiedenen Seiten der Anwendung (z. B. Home, Catalogs).
+•	Ermöglicht das Ein- und Ausklappen des Menüs.
+
+6. Catalogs.razor
+•	Reihenfolge: Wird geladen, wenn der Benutzer die URL /catalogs aufruft.
+•	Purpose:
+•	Stellt die Benutzeroberfläche für die Verwaltung von Katalogen bereit.
+•	Nutzt CatalogApiClient, um Daten von der API zu laden, zu erstellen, zu aktualisieren oder zu löschen.
+•	Verwendet DevExpress-Komponenten für ein modernes UI.
+
+7. CatalogApiClient.cs
+•	Reihenfolge: Wird verwendet, wenn Catalogs.razor API-Aufrufe ausführt.
+•	Purpose:
+•	Kapselt die Kommunikation mit der API.
+•	Bietet Methoden für CRUD-Operationen (Create, Read, Update, Delete) auf Katalog-Daten.
+•	Behandelt Fehler und gibt benutzerfreundliche Fehlermeldungen zurück.
+
+Zusammenfassung des Ablaufs:
+1.index.html: Lädt die Blazor-Umgebung und startet die Anwendung.
+2.	Program.cs: Initialisiert die Anwendung und registriert Abhängigkeiten.
+3.	App.razor: Definiert die Routing-Logik und lädt das Standardlayout.
+4.	MainLayout.razor: Stellt das Hauptlayout bereit.
+5.	NavMenu.razor: Lädt die Navigationsleiste.
+6.	Seiten wie Catalogs.razor: Werden basierend auf der URL gerendert.
+7.	CatalogApiClient.cs: Führt API-Aufrufe aus, wenn die Seite Daten benötigt.
+*/

DbFirst.BlazorWasm/App.razor

@@ -1,4 +1,12 @@
-<Router AppAssembly="@typeof(App).Assembly">
+@* 
+•	Ist der logische Einstiegspunkt der Blazor-Anwendung.
+•	Sie definiert die Routing-Logik und das Standardlayout der Anwendung.
+•	Der Router-Komponent in App.razor entscheidet, welche Blazor-Komponente basierend auf der URL geladen wird.
+    kurz: Steuert die Navigation und das Rendering der Blazor-Komponenten.
+    *@
+@DxResourceManager.RegisterTheme(Themes.Fluent)
+@DxResourceManager.RegisterScripts()
+<Router AppAssembly="@typeof(App).Assembly">
     <Found Context="routeData">
         <RouteView RouteData="@routeData" DefaultLayout="@typeof(MainLayout)" />
         <FocusOnNavigate RouteData="@routeData" Selector="h1" />

DbFirst.BlazorWasm/Components/CatalogsGrid.razor

@@ -0,0 +1,408 @@
+@using Microsoft.AspNetCore.Components.Forms
+@inject CatalogApiClient Api
+
+<style>
+    .action-panel { margin-bottom: 16px; }
+    .grid-section { margin-top: 12px; }
+    .catalog-grid .dxbl-grid-sort-asc,
+    .catalog-grid .dxbl-grid-sort-desc {
+        display: none;
+    }
+    .catalog-grid th.dxbl-grid-header-sortable {
+        position: relative;
+        padding-right: 1.5rem;
+    }
+    .catalog-grid th.dxbl-grid-header-sortable::before,
+    .catalog-grid th.dxbl-grid-header-sortable::after {
+        content: "";
+        position: absolute;
+        right: 0.45rem;
+        width: 0.7rem;
+        height: 0.7rem;
+        background-repeat: no-repeat;
+        background-size: 0.7rem 0.7rem;
+        opacity: 0.35;
+        pointer-events: none;
+    }
+    .catalog-grid th.dxbl-grid-header-sortable::before {
+        top: 38%;
+        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4.957 10.999a1 1 0 0 1-.821-1.571l2.633-3.785a1.5 1.5 0 0 1 2.462 0l2.633 3.785a1 1 0 0 1-.821 1.57H4.957Z' fill='%23888888'/%3E%3C/svg%3E");
+    }
+    .catalog-grid th.dxbl-grid-header-sortable::after {
+        top: 58%;
+        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4.957 5a1 1 0 0 0-.821 1.571l2.633 3.784a1.5 1.5 0 0 0 2.462 0l2.633-3.784A1 1 0 0 0 11.043 5H4.957Z' fill='%23888888'/%3E%3C/svg%3E");
+    }
+    .catalog-grid th.dxbl-grid-header-sortable[aria-sort="ascending"]::after {
+        opacity: 0;
+    }
+    .catalog-grid th.dxbl-grid-header-sortable[aria-sort="descending"]::before {
+        opacity: 0;
+    }
+    .catalog-grid .filter-search-input input {
+        padding-right: 1.75rem;
+        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M9.309 10.016a4.5 4.5 0 1 1 .707-.707l3.838 3.837a.5.5 0 0 1-.708.708L9.31 10.016ZM10 6.5a3.5 3.5 0 1 0-7 0 3.5 3.5 0 0 0 7 0Z' fill='%23666666'/%3E%3C/svg%3E");
+        background-repeat: no-repeat;
+        background-position: right 0.5rem center;
+        background-size: 0.9rem;
+    }
+    .catalog-edit-popup {
+        min-width: 720px;
+    }
+</style>
+
+@if (!string.IsNullOrWhiteSpace(errorMessage))
+{
+    <div class="alert alert-danger" role="alert">@errorMessage</div>
+}
+else if (!string.IsNullOrWhiteSpace(infoMessage))
+{
+    <div class="alert alert-success" role="alert">@infoMessage</div>
+}
+
+@if (isLoading)
+{
+    <p><em>Lade Daten...</em></p>
+}
+else if (items.Count == 0)
+{
+    <p>Keine Einträge vorhanden.</p>
+}
+else
+{
+    <div class="grid-section">
+        <DxGrid Data="@items"
+                TItem="CatalogReadDto"
+                KeyFieldName="@nameof(CatalogReadDto.Guid)"
+                ShowFilterRow="true"
+                PageSize="10"
+                CssClass="mb-4 catalog-grid"
+                EditMode="GridEditMode.PopupEditForm"
+                PopupEditFormCssClass="catalog-edit-popup"
+                PopupEditFormHeaderText="@popupHeaderText"
+                CustomizeEditModel="OnCustomizeEditModel"
+                EditModelSaving="OnEditModelSaving"
+                DataItemDeleting="OnDataItemDeleting">
+            <Columns>
+                <DxGridCommandColumn Width="120px" />
+                <DxGridDataColumn FieldName="@nameof(CatalogReadDto.Guid)" Caption="Id" Width="140px" SortIndex="0" SortOrder="GridColumnSortOrder.Ascending">
+                    <FilterRowCellTemplate Context="filter">
+                        <DxTextBox Text="@(filter.FilterRowValue?.ToString())"
+                                   TextChanged="@(value => filter.FilterRowValue = value)"
+                                   CssClass="filter-search-input" />
+                    </FilterRowCellTemplate>
+                </DxGridDataColumn>
+                <DxGridDataColumn FieldName="@nameof(CatalogReadDto.CatTitle)" Caption="Titel">
+                    <FilterRowCellTemplate Context="filter">
+                        <DxTextBox Text="@(filter.FilterRowValue as string)"
+                                   TextChanged="@(value => filter.FilterRowValue = value)"
+                                   CssClass="filter-search-input" />
+                    </FilterRowCellTemplate>
+                </DxGridDataColumn>
+                <DxGridDataColumn FieldName="@nameof(CatalogReadDto.CatString)" Caption="String">
+                    <FilterRowCellTemplate Context="filter">
+                        <DxTextBox Text="@(filter.FilterRowValue as string)"
+                                   TextChanged="@(value => filter.FilterRowValue = value)"
+                                   CssClass="filter-search-input" />
+                    </FilterRowCellTemplate>
+                </DxGridDataColumn>
+                <DxGridDataColumn FieldName="@nameof(CatalogReadDto.AddedWho)" Caption="Angelegt von" ReadOnly="true">
+                    <FilterRowCellTemplate Context="filter">
+                        <DxTextBox Text="@(filter.FilterRowValue as string)"
+                                   TextChanged="@(value => filter.FilterRowValue = value)"
+                                   CssClass="filter-search-input" />
+                    </FilterRowCellTemplate>
+                </DxGridDataColumn>
+                <DxGridDataColumn FieldName="@nameof(CatalogReadDto.AddedWhen)" Caption="Angelegt am" ReadOnly="true">
+                    <FilterRowCellTemplate Context="filter">
+                        <DxDateEdit Date="@((DateTime?)filter.FilterRowValue)"
+                                    DateChanged="@((DateTime? value) => { filter.FilterRowValue = value; })"
+                                    Width="100%" />
+                    </FilterRowCellTemplate>
+                </DxGridDataColumn>
+                <DxGridDataColumn FieldName="@nameof(CatalogReadDto.ChangedWho)" Caption="Geändert von" ReadOnly="true">
+                    <FilterRowCellTemplate Context="filter">
+                        <DxTextBox Text="@(filter.FilterRowValue as string)"
+                                   TextChanged="@(value => filter.FilterRowValue = value)"
+                                   CssClass="filter-search-input" />
+                    </FilterRowCellTemplate>
+                </DxGridDataColumn>
+                <DxGridDataColumn FieldName="@nameof(CatalogReadDto.ChangedWhen)" Caption="Geändert am" ReadOnly="true">
+                    <FilterRowCellTemplate Context="filter">
+                        <DxDateEdit Date="@((DateTime?)filter.FilterRowValue)"
+                                    DateChanged="@((DateTime? value) => { filter.FilterRowValue = value; })"
+                                    Width="100%" />
+                    </FilterRowCellTemplate>
+                </DxGridDataColumn>
+            </Columns>
+            <EditFormTemplate Context="editFormContext">
+                @{ SetEditContext(editFormContext.EditContext); var editModel = (CatalogEditModel)editFormContext.EditModel; SetPopupHeaderText(editModel.IsNew); }
+                <DxFormLayout ColCount="2">
+                    <DxFormLayoutItem Caption="Titel">
+                        <DxTextBox @bind-Text="editModel.CatTitle" Width="100%" />
+                    </DxFormLayoutItem>
+                    <DxFormLayoutItem Caption="Kennung">
+                        <DxTextBox @bind-Text="editModel.CatString" Width="100%" />
+                    </DxFormLayoutItem>
+                    @if (!editModel.IsNew)
+                    {
+                        <DxFormLayoutItem Caption="Update-Prozedur">
+                            <DxComboBox Data="@procedureOptions"
+                                        TData="ProcedureOption"
+                                        TValue="int"
+                                        TextFieldName="Text"
+                                        ValueFieldName="Value"
+                                        @bind-Value="editModel.UpdateProcedure"
+                                        Width="100%" />
+                        </DxFormLayoutItem>
+                    }
+                    <DxFormLayoutItem ColSpanMd="12">
+                        <ValidationSummary />
+                    </DxFormLayoutItem>
+                </DxFormLayout>
+            </EditFormTemplate>
+        </DxGrid>
+    </div>
+}
+
+@code {
+    private List<CatalogReadDto> items = new();
+    private bool isLoading;
+    private string? errorMessage;
+    private string? infoMessage;
+    private EditContext? editContext;
+    private ValidationMessageStore? validationMessageStore;
+    private string popupHeaderText = "Edit";
+
+    private readonly List<ProcedureOption> procedureOptions = new()
+    {
+        new() { Value = 0, Text = "PRTBMY_CATALOG_UPDATE" },
+        new() { Value = 1, Text = "PRTBMY_CATALOG_SAVE" }
+    };
+
+    protected override async Task OnInitializedAsync()
+    {
+        await LoadCatalogs();
+    }
+
+    private void SetEditContext(EditContext context)
+    {
+        if (editContext == context)
+        {
+            return;
+        }
+
+        if (editContext != null)
+        {
+            editContext.OnFieldChanged -= OnEditFieldChanged;
+        }
+
+        editContext = context;
+        validationMessageStore = new ValidationMessageStore(editContext);
+        editContext.OnFieldChanged += OnEditFieldChanged;
+    }
+
+    private void OnEditFieldChanged(object? sender, FieldChangedEventArgs e)
+    {
+        if (validationMessageStore == null || editContext == null)
+        {
+            return;
+        }
+
+        if (e.FieldIdentifier.FieldName == nameof(CatalogEditModel.UpdateProcedure))
+        {
+            validationMessageStore.Clear();
+            editContext.NotifyValidationStateChanged();
+            return;
+        }
+
+        if (e.FieldIdentifier.FieldName == nameof(CatalogEditModel.CatTitle))
+        {
+            var field = new FieldIdentifier(editContext.Model, nameof(CatalogEditModel.CatTitle));
+            validationMessageStore.Clear(field);
+            editContext.NotifyValidationStateChanged();
+        }
+    }
+
+    private void OnCustomizeEditModel(GridCustomizeEditModelEventArgs e)
+    {
+        popupHeaderText = e.IsNew ? "Neu" : "Edit";
+        if (e.IsNew)
+        {
+            e.EditModel = new CatalogEditModel { IsNew = true };
+            return;
+        }
+
+        var item = (CatalogReadDto)e.DataItem;
+        e.EditModel = new CatalogEditModel
+        {
+            Guid = item.Guid,
+            CatTitle = item.CatTitle,
+            CatString = item.CatString,
+            UpdateProcedure = 0,
+            OriginalCatTitle = item.CatTitle,
+            IsNew = false
+        };
+    }
+
+    private async Task LoadCatalogs()
+    {
+        isLoading = true;
+        errorMessage = null;
+        try
+        {
+            items = await Api.GetAllAsync();
+        }
+        catch (Exception ex)
+        {
+            errorMessage = $"Kataloge konnten nicht geladen werden: {ex.Message}";
+        }
+        finally
+        {
+            isLoading = false;
+            StateHasChanged();
+        }
+    }
+
+    private async Task OnEditModelSaving(GridEditModelSavingEventArgs e)
+    {
+        errorMessage = null;
+        infoMessage = null;
+
+        validationMessageStore?.Clear();
+        editContext?.NotifyValidationStateChanged();
+
+        var editModel = (CatalogEditModel)e.EditModel;
+        if (!ValidateEditModel(editModel, e.IsNew))
+        {
+            e.Cancel = true;
+            return;
+        }
+
+        var dto = new CatalogWriteDto
+        {
+            CatTitle = editModel.CatTitle,
+            CatString = editModel.CatString,
+            UpdateProcedure = editModel.UpdateProcedure
+        };
+
+        try
+        {
+            if (e.IsNew)
+            {
+                var created = await Api.CreateAsync(dto);
+                if (!created.Success || created.Value == null)
+                {
+                    if (!string.IsNullOrWhiteSpace(created.Error))
+                    {
+                        AddValidationError(editModel, nameof(CatalogEditModel.CatTitle), created.Error);
+                    }
+                    else
+                    {
+                        errorMessage = "Anlegen fehlgeschlagen.";
+                    }
+
+                    e.Cancel = true;
+                    return;
+                }
+
+                infoMessage = "Katalog angelegt.";
+            }
+            else
+            {
+                var updated = await Api.UpdateAsync(editModel.Guid, dto);
+                if (!updated.Success)
+                {
+                    errorMessage = updated.Error ?? "Aktualisierung fehlgeschlagen.";
+                    e.Cancel = true;
+                    return;
+                }
+
+                infoMessage = "Katalog aktualisiert.";
+            }
+
+            await LoadCatalogs();
+        }
+        catch (Exception ex)
+        {
+            errorMessage = $"Fehler beim Speichern: {ex.Message}";
+            e.Cancel = true;
+        }
+    }
+
+    private void AddValidationError(CatalogEditModel editModel, string fieldName, string message)
+    {
+        if (editContext == null || validationMessageStore == null)
+        {
+            return;
+        }
+
+        var field = new FieldIdentifier(editModel, fieldName);
+        validationMessageStore.Add(field, message);
+        editContext.NotifyValidationStateChanged();
+    }
+
+    private bool ValidateEditModel(CatalogEditModel editModel, bool isNew)
+    {
+        if (isNew)
+        {
+            return true;
+        }
+
+        if (editModel.UpdateProcedure == 0 &&
+            !string.Equals(editModel.CatTitle, editModel.OriginalCatTitle, StringComparison.OrdinalIgnoreCase))
+        {
+            AddValidationError(editModel, nameof(CatalogEditModel.CatTitle), "Titel kann nicht geändert werden.");
+            return false;
+        }
+
+        return true;
+    }
+
+    private async Task OnDataItemDeleting(GridDataItemDeletingEventArgs e)
+    {
+        errorMessage = null;
+        infoMessage = null;
+
+        var item = (CatalogReadDto)e.DataItem;
+
+        try
+        {
+            var deleted = await Api.DeleteAsync(item.Guid);
+            if (!deleted.Success)
+            {
+                errorMessage = deleted.Error ?? "Löschen fehlgeschlagen.";
+                e.Cancel = true;
+                return;
+            }
+
+            infoMessage = "Katalog gelöscht.";
+            await LoadCatalogs();
+        }
+        catch (Exception ex)
+        {
+            errorMessage = $"Fehler beim Löschen: {ex.Message}";
+            e.Cancel = true;
+        }
+    }
+
+    private void SetPopupHeaderText(bool isNew)
+    {
+        popupHeaderText = isNew ? "Neu" : "Edit";
+    }
+
+    private sealed class CatalogEditModel
+    {
+        public int Guid { get; set; }
+        public string CatTitle { get; set; } = string.Empty;
+        public string CatString { get; set; } = string.Empty;
+        public int UpdateProcedure { get; set; }
+        public string OriginalCatTitle { get; set; } = string.Empty;
+        public bool IsNew { get; set; }
+    }
+
+    private sealed class ProcedureOption
+    {
+        public int Value { get; set; }
+        public string Text { get; set; } = string.Empty;
+    }
+}

DbFirst.BlazorWasm/Components/MassDataGrid.razor

@@ -0,0 +1,408 @@
+@using Microsoft.AspNetCore.Components.Forms
+@inject MassDataApiClient Api
+
+<style>
+    .action-panel { margin-bottom: 16px; }
+    .grid-section { margin-top: 12px; }
+    .pager-container {
+        display: flex;
+        justify-content: center;
+        margin-top: 12px;
+        margin-bottom: 16px;
+    }
+    .massdata-grid .dxbl-grid-sort-asc,
+    .massdata-grid .dxbl-grid-sort-desc {
+        display: none;
+    }
+    .massdata-grid th.dxbl-grid-header-sortable {
+        position: relative;
+        padding-right: 1.5rem;
+    }
+    .massdata-grid th.dxbl-grid-header-sortable::before,
+    .massdata-grid th.dxbl-grid-header-sortable::after {
+        content: "";
+        position: absolute;
+        right: 0.45rem;
+        width: 0.7rem;
+        height: 0.7rem;
+        background-repeat: no-repeat;
+        background-size: 0.7rem 0.7rem;
+        opacity: 0.35;
+        pointer-events: none;
+    }
+    .massdata-grid th.dxbl-grid-header-sortable::before {
+        top: 38%;
+        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4.957 10.999a1 1 0 0 1-.821-1.571l2.633-3.785a1.5 1.5 0 0 1 2.462 0l2.633 3.785a1 1 0 0 1-.821 1.57H4.957Z' fill='%23888888'/%3E%3C/svg%3E");
+    }
+    .massdata-grid th.dxbl-grid-header-sortable::after {
+        top: 58%;
+        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4.957 5a1 1 0 0 0-.821 1.571l2.633 3.784a1.5 1.5 0 0 0 2.462 0l2.633-3.784A1 1 0 0 0 11.043 5H4.957Z' fill='%23888888'/%3E%3C/svg%3E");
+    }
+    .massdata-grid th.dxbl-grid-header-sortable[aria-sort="ascending"]::after {
+        opacity: 0;
+    }
+    .massdata-grid th.dxbl-grid-header-sortable[aria-sort="descending"]::before {
+        opacity: 0;
+    }
+    .massdata-grid .filter-search-input input {
+        padding-right: 1.75rem;
+        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M9.309 10.016a4.5 4.5 0 1 1 .707-.707l3.838 3.837a.5.5 0 0 1-.708.708L9.31 10.016ZM10 6.5a3.5 3.5 0 1 0-7 0 3.5 3.5 0 0 0 7 0Z' fill='%23666666'/%3E%3C/svg%3E");
+        background-repeat: no-repeat;
+        background-position: right 0.5rem center;
+        background-size: 0.9rem;
+    }
+    .massdata-edit-popup {
+        min-width: 720px;
+    }
+</style>
+
+@if (!string.IsNullOrWhiteSpace(errorMessage))
+{
+    <div class="alert alert-danger" role="alert">@errorMessage</div>
+}
+else if (!string.IsNullOrWhiteSpace(infoMessage))
+{
+    <div class="alert alert-success" role="alert">@infoMessage</div>
+}
+
+@if (isLoading)
+{
+    <p><em>Lade Daten...</em></p>
+}
+else if (items.Count == 0)
+{
+    <p>Keine Einträge vorhanden.</p>
+}
+else
+{
+    <div class="grid-section">
+        <DxGrid Data="@items"
+                TItem="MassDataReadDto"
+                KeyFieldName="@nameof(MassDataReadDto.Id)"
+                ShowFilterRow="true"
+                ShowGroupPanel="true"
+                AllowColumnResize="true"
+                PagerVisible="false"
+                PageSize="100"
+                CssClass="mb-3 massdata-grid"
+                EditMode="GridEditMode.PopupEditForm"
+                PopupEditFormCssClass="massdata-edit-popup"
+                PopupEditFormHeaderText="@popupHeaderText"
+                CustomizeEditModel="OnCustomizeEditModel"
+                EditModelSaving="OnEditModelSaving"
+                DataItemDeleting="OnDataItemDeleting">
+            <Columns>
+                <DxGridCommandColumn Width="120px" />
+                <DxGridDataColumn FieldName="@nameof(MassDataReadDto.Id)" Caption="Id" Width="90px" ReadOnly="true">
+                    <FilterRowCellTemplate Context="filter">
+                        <DxTextBox Text="@(filter.FilterRowValue?.ToString())"
+                                   TextChanged="@(value => filter.FilterRowValue = value)"
+                                   CssClass="filter-search-input" />
+                    </FilterRowCellTemplate>
+                </DxGridDataColumn>
+                <DxGridDataColumn FieldName="@nameof(MassDataReadDto.CustomerName)" Caption="CustomerName">
+                    <FilterRowCellTemplate Context="filter">
+                        <DxTextBox Text="@(filter.FilterRowValue as string)"
+                                   TextChanged="@(value => filter.FilterRowValue = value)"
+                                   CssClass="filter-search-input" />
+                    </FilterRowCellTemplate>
+                </DxGridDataColumn>
+                <DxGridDataColumn FieldName="@nameof(MassDataReadDto.Amount)" Caption="Amount" DisplayFormat="c2">
+                    <FilterRowCellTemplate Context="filter">
+                        <DxTextBox Text="@(filter.FilterRowValue?.ToString())"
+                                   TextChanged="@(value => filter.FilterRowValue = value)"
+                                   CssClass="filter-search-input" />
+                    </FilterRowCellTemplate>
+                </DxGridDataColumn>
+                <DxGridDataColumn FieldName="@nameof(MassDataReadDto.Category)" Caption="Category" ReadOnly="true">
+                    <FilterRowCellTemplate Context="filter">
+                        <DxTextBox Text="@(filter.FilterRowValue as string)"
+                                   TextChanged="@(value => filter.FilterRowValue = value)"
+                                   CssClass="filter-search-input" />
+                    </FilterRowCellTemplate>
+                </DxGridDataColumn>
+                <DxGridDataColumn FieldName="@nameof(MassDataReadDto.StatusFlag)" Caption="Status" ReadOnly="true">
+                    <FilterRowCellTemplate Context="filter">
+                        <DxComboBox Data="@statusFilterOptions"
+                                    TData="BoolFilterOption"
+                                    TValue="bool?"
+                                    TextFieldName="Text"
+                                    ValueFieldName="Value"
+                                    Value="@(filter.FilterRowValue as bool?)"
+                                    ValueChanged="@(value => filter.FilterRowValue = value)"
+                                    Width="100%" />
+                    </FilterRowCellTemplate>
+                </DxGridDataColumn>
+                <DxGridDataColumn FieldName="@nameof(MassDataReadDto.AddedWhen)" Caption="Angelegt am" ReadOnly="true">
+                    <FilterRowCellTemplate Context="filter">
+                        <DxDateEdit Date="@((DateTime?)filter.FilterRowValue)"
+                                    DateChanged="@((DateTime? value) => { filter.FilterRowValue = value; })"
+                                    Width="100%" />
+                    </FilterRowCellTemplate>
+                </DxGridDataColumn>
+                <DxGridDataColumn FieldName="@nameof(MassDataReadDto.ChangedWhen)" Caption="Geändert am" ReadOnly="true">
+                    <FilterRowCellTemplate Context="filter">
+                        <DxDateEdit Date="@((DateTime?)filter.FilterRowValue)"
+                                    DateChanged="@((DateTime? value) => { filter.FilterRowValue = value; })"
+                                    Width="100%" />
+                    </FilterRowCellTemplate>
+                </DxGridDataColumn>
+            </Columns>
+            <EditFormTemplate Context="editFormContext">
+                @{ SetEditContext(editFormContext.EditContext); var editModel = (MassDataEditModel)editFormContext.EditModel; SetPopupHeaderText(editModel.IsNew); }
+                <DxFormLayout ColCount="2">
+                    <DxFormLayoutItem Caption="CustomerName">
+                        <DxTextBox @bind-Text="editModel.CustomerName" Width="100%" />
+                    </DxFormLayoutItem>
+                    <DxFormLayoutItem Caption="Amount">
+                        <DxTextBox @bind-Text="editModel.AmountText" Width="100%" />
+                    </DxFormLayoutItem>
+                    <DxFormLayoutItem Caption="Category">
+                        <DxTextBox @bind-Text="editModel.Category" Width="100%" ReadOnly="@(!editModel.IsNew)" />
+                    </DxFormLayoutItem>
+                    <DxFormLayoutItem Caption="Status">
+                        <DxCheckBox @bind-Checked="editModel.StatusFlag" ReadOnly="@(!editModel.IsNew)" />
+                    </DxFormLayoutItem>
+                    @if (!editModel.IsNew)
+                    {
+                        <DxFormLayoutItem Caption="Prozedur">
+                            <DxComboBox Data="@procedureOptions"
+                                        TData="ProcedureOption"
+                                        TValue="int"
+                                        TextFieldName="Text"
+                                        ValueFieldName="Value"
+                                        @bind-Value="editModel.UpdateProcedure"
+                                        Width="100%" />
+                        </DxFormLayoutItem>
+                    }
+                    <DxFormLayoutItem ColSpanMd="12">
+                        <ValidationSummary />
+                    </DxFormLayoutItem>
+                </DxFormLayout>
+            </EditFormTemplate>
+        </DxGrid>
+
+        <div class="pager-container">
+            <DxPager PageCount="@pageCount" ActivePageIndex="@pageIndex" ActivePageIndexChanged="OnPageChanged" />
+        </div>
+    </div>
+}
+
+@code {
+    private const int PageSize = 100;
+    private List<MassDataReadDto> items = new();
+    private bool isLoading;
+    private string? errorMessage;
+    private string? infoMessage;
+    private int pageIndex;
+    private int pageCount = 1;
+    private string popupHeaderText = "Edit";
+    private EditContext? editContext;
+    private ValidationMessageStore? validationMessageStore;
+
+    private readonly List<BoolFilterOption> statusFilterOptions = new()
+    {
+        new() { Value = null, Text = "Alle" },
+        new() { Value = true, Text = "True" },
+        new() { Value = false, Text = "False" }
+    };
+
+    private readonly List<ProcedureOption> procedureOptions = new()
+    {
+        new() { Value = 0, Text = "PRMassdata_UpsertByCustomerName" }
+    };
+
+    protected override async Task OnInitializedAsync()
+    {
+        await LoadPage(0);
+    }
+
+    private async Task LoadPage(int page)
+    {
+        isLoading = true;
+        errorMessage = null;
+        try
+        {
+            var total = await Api.GetCountAsync();
+            pageCount = Math.Max(1, (int)Math.Ceiling(total / (double)PageSize));
+            pageIndex = Math.Clamp(page, 0, pageCount - 1);
+
+            var skip = pageIndex * PageSize;
+            items = await Api.GetAllAsync(skip, PageSize);
+        }
+        catch (Exception ex)
+        {
+            errorMessage = $"MassData konnten nicht geladen werden: {ex.Message}";
+        }
+        finally
+        {
+            isLoading = false;
+            StateHasChanged();
+        }
+    }
+
+    private async Task OnPageChanged(int index)
+    {
+        await LoadPage(index);
+    }
+
+    private void SetEditContext(EditContext context)
+    {
+        if (editContext == context)
+        {
+            return;
+        }
+
+        if (editContext != null)
+        {
+            editContext.OnFieldChanged -= OnEditFieldChanged;
+        }
+
+        editContext = context;
+        validationMessageStore = new ValidationMessageStore(editContext);
+        editContext.OnFieldChanged += OnEditFieldChanged;
+    }
+
+    private void OnEditFieldChanged(object? sender, FieldChangedEventArgs e)
+    {
+        if (validationMessageStore == null || editContext == null)
+        {
+            return;
+        }
+
+        if (e.FieldIdentifier.FieldName == nameof(MassDataEditModel.UpdateProcedure))
+        {
+            validationMessageStore.Clear();
+            editContext.NotifyValidationStateChanged();
+            return;
+        }
+
+        if (e.FieldIdentifier.FieldName == nameof(MassDataEditModel.CustomerName))
+        {
+            var field = new FieldIdentifier(editContext.Model, nameof(MassDataEditModel.CustomerName));
+            validationMessageStore.Clear(field);
+            editContext.NotifyValidationStateChanged();
+        }
+    }
+
+    private void SetPopupHeaderText(bool isNew)
+    {
+        popupHeaderText = isNew ? "Neu" : "Edit";
+    }
+
+    private void OnCustomizeEditModel(GridCustomizeEditModelEventArgs e)
+    {
+        if (e.IsNew)
+        {
+            e.EditModel = new MassDataEditModel { IsNew = true, UpdateProcedure = procedureOptions[0].Value };
+            SetPopupHeaderText(true);
+            return;
+        }
+
+        var item = (MassDataReadDto)e.DataItem;
+        e.EditModel = new MassDataEditModel
+        {
+            Id = item.Id,
+            CustomerName = item.CustomerName,
+            AmountText = item.Amount.ToString("0.00"),
+            Category = item.Category,
+            StatusFlag = item.StatusFlag,
+            UpdateProcedure = procedureOptions[0].Value,
+            IsNew = false,
+            OriginalCustomerName = item.CustomerName
+        };
+        SetPopupHeaderText(false);
+    }
+
+    private async Task OnEditModelSaving(GridEditModelSavingEventArgs e)
+    {
+        errorMessage = null;
+        infoMessage = null;
+
+        validationMessageStore?.Clear();
+        editContext?.NotifyValidationStateChanged();
+
+        var editModel = (MassDataEditModel)e.EditModel;
+        if (!decimal.TryParse(editModel.AmountText, out var amount))
+        {
+            AddValidationError(editModel, nameof(MassDataEditModel.AmountText), "Amount ist ungültig.");
+            e.Cancel = true;
+            return;
+        }
+
+        if (editModel.IsNew)
+        {
+            var existing = await Api.GetByCustomerNameAsync(editModel.CustomerName);
+            if (existing != null)
+            {
+                AddValidationError(editModel, nameof(MassDataEditModel.CustomerName), "Kunde existiert bereits.");
+                e.Cancel = true;
+                return;
+            }
+        }
+
+        var dto = new MassDataWriteDto
+        {
+            CustomerName = editModel.CustomerName,
+            Amount = amount,
+            Category = editModel.Category,
+            StatusFlag = editModel.StatusFlag
+        };
+
+        try
+        {
+            await Api.UpsertAsync(dto);
+            infoMessage = editModel.IsNew ? "MassData angelegt." : "MassData aktualisiert.";
+            await LoadPage(pageIndex);
+        }
+        catch (Exception ex)
+        {
+            errorMessage = $"Fehler beim Speichern: {ex.Message}";
+            e.Cancel = true;
+        }
+    }
+
+    private void AddValidationError(MassDataEditModel editModel, string fieldName, string message)
+    {
+        if (editContext == null || validationMessageStore == null)
+        {
+            return;
+        }
+
+        var field = new FieldIdentifier(editModel, fieldName);
+        validationMessageStore.Add(field, message);
+        editContext.NotifyValidationStateChanged();
+    }
+
+    private Task OnDataItemDeleting(GridDataItemDeletingEventArgs e)
+    {
+        errorMessage = null;
+        infoMessage = "Löschen ist aktuell noch nicht verfügbar.";
+        e.Cancel = true;
+        return Task.CompletedTask;
+    }
+
+    private sealed class MassDataEditModel
+    {
+        public int Id { get; set; }
+        public string CustomerName { get; set; } = string.Empty;
+        public string AmountText { get; set; } = string.Empty;
+        public string Category { get; set; } = string.Empty;
+        public bool StatusFlag { get; set; }
+        public int UpdateProcedure { get; set; }
+        public bool IsNew { get; set; }
+        public string OriginalCustomerName { get; set; } = string.Empty;
+    }
+
+    private sealed class ProcedureOption
+    {
+        public int Value { get; set; }
+        public string Text { get; set; } = string.Empty;
+    }
+
+    private sealed class BoolFilterOption
+    {
+        public bool? Value { get; set; }
+        public string Text { get; set; } = string.Empty;
+    }
+}

DbFirst.BlazorWasm/DbFirst.BlazorWasm.csproj

@@ -7,8 +7,13 @@
   </PropertyGroup>
 
   <ItemGroup>
+    <PackageReference Include="DevExpress.Blazor" Version="25.2.3" />
+    <PackageReference Include="DevExpress.Blazor.Dashboard" Version="25.2.3" />
+    <PackageReference Include="DevExpress.Blazor.Themes" Version="25.2.3" />
+    <PackageReference Include="DevExpress.Blazor.Themes.Fluent" Version="25.2.3" />
     <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="8.0.22" />
     <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.DevServer" Version="8.0.22" PrivateAssets="all" />
+    <PackageReference Include="Microsoft.AspNetCore.SignalR.Client" Version="8.0.22" />
   </ItemGroup>
 
   <ItemGroup>

DbFirst.BlazorWasm/Layout/MainLayout.razor

@@ -1,7 +1,10 @@
-@inherits LayoutComponentBase
+@* Definiert das Hauptlayout der Anwendung.
+   Enthält die Navigationsleiste und den Hauptinhalt. *@
+
+@inherits LayoutComponentBase
 <div class="page">
     <div class="sidebar">
-        <NavMenu />
+        <NavMenu /> <!-- Einbindung der Navigationsleiste -->
     </div>
 
     <main>
@@ -10,7 +13,7 @@
         </div>
 
         <article class="content px-4">
-            @Body
+            @Body <!-- Platzhalter für den Seiteninhalt -->
         </article>
     </main>
 </div>

DbFirst.BlazorWasm/Layout/NavMenu.razor

@@ -1,4 +1,6 @@
-<div class="top-row ps-3 navbar navbar-dark">
+@* Definiert die Navigationsleiste, die Links zu verschiedenen Seiten der Anwendung enthält. *@
+
+<div class="top-row ps-3 navbar navbar-dark">
     <div class="container-fluid">
         <a class="navbar-brand" href="">DbFirst.BlazorWasm</a>
         <button title="Navigation menu" class="navbar-toggler" @onclick="ToggleNavMenu">
@@ -19,14 +21,26 @@
                 <span class="bi bi-collection-nav-menu" aria-hidden="true"></span> Catalogs
             </NavLink>
         </div>
+        <div class="nav-item px-3">
+            <NavLink class="nav-link" href="dashboards">
+                <span class="oi oi-list-rich" aria-hidden="true"></span> Dashboards
+            </NavLink>
+        </div>
+        <div class="nav-item px-3">
+            <NavLink class="nav-link" href="massdata">
+                <span class="bi bi-table" aria-hidden="true"></span> MassData
+            </NavLink>
+        </div>
     </nav>
 </div>
 
 @code {
     private bool collapseNavMenu = true;
 
+    // CSS-Klasse für die Navigation, die den Zustand (eingeklappt/ausgeklappt) steuert.
     private string? NavMenuCssClass => collapseNavMenu ? "collapse" : null;
 
+    // Methode zum Umschalten des Navigationsmenüs.
     private void ToggleNavMenu()
     {
         collapseNavMenu = !collapseNavMenu;

DbFirst.BlazorWasm/Models/DashboardInfoDto.cs

@@ -0,0 +1,7 @@
+namespace DbFirst.BlazorWasm.Models;
+
+public class DashboardInfoDto
+{
+    public string Id { get; set; } = string.Empty;
+    public string Name { get; set; } = string.Empty;
+}

DbFirst.BlazorWasm/Models/MassDataReadDto.cs

@@ -0,0 +1,12 @@
+namespace DbFirst.BlazorWasm.Models;
+
+public class MassDataReadDto
+{
+    public int Id { get; set; }
+    public string CustomerName { get; set; } = string.Empty;
+    public decimal Amount { get; set; }
+    public string Category { get; set; } = string.Empty;
+    public bool StatusFlag { get; set; }
+    public DateTime AddedWhen { get; set; }
+    public DateTime? ChangedWhen { get; set; }
+}

DbFirst.BlazorWasm/Models/MassDataWriteDto.cs

@@ -0,0 +1,9 @@
+namespace DbFirst.BlazorWasm.Models;
+
+public class MassDataWriteDto
+{
+    public string CustomerName { get; set; } = string.Empty;
+    public decimal Amount { get; set; }
+    public string Category { get; set; } = string.Empty;
+    public bool StatusFlag { get; set; }
+}

DbFirst.BlazorWasm/Pages/Catalogs.razor

@@ -1,226 +1,7 @@
 @page "/catalogs"
-@inject CatalogApiClient Api
 
 <PageTitle>Catalogs</PageTitle>
 
 <h1>Catalogs</h1>
 
-@if (!string.IsNullOrWhiteSpace(errorMessage))
-{
-    <div class="alert alert-danger" role="alert">@errorMessage</div>
-}
-else if (!string.IsNullOrWhiteSpace(infoMessage))
-{
-    <div class="alert alert-success" role="alert">@infoMessage</div>
-}
-
-<div class="mb-3">
-    <button class="btn btn-primary" @onclick="StartCreate">Neuen Eintrag anlegen</button>
-</div>
-
-@if (showForm)
-{
-    <EditForm Model="formModel" OnValidSubmit="HandleSubmit">
-        <div class="row g-3">
-            <div class="col-md-6">
-                <label class="form-label">Titel</label>
-                <InputText class="form-control" @bind-Value="formModel.CatTitle" disabled="@(isEditing && formModel.UpdateProcedure == 0)" />
-            </div>
-            <div class="col-md-6">
-                <label class="form-label">Kennung</label>
-                <InputText class="form-control" @bind-Value="formModel.CatString" />
-            </div>
-        </div>
-
-        @if (isEditing)
-        {
-            <div class="row g-3 mt-2">
-                <div class="col-md-6">
-                    <label class="form-label">Update-Prozedur</label>
-                    <InputSelect class="form-control" @bind-Value="formModel.UpdateProcedure">
-                        <option value="0">PRTBMY_CATALOG_UPDATE</option>
-                        <option value="1">PRTBMY_CATALOG_SAVE</option>
-                    </InputSelect>
-                </div>
-            </div>
-        }
-
-        <div class="mt-3 d-flex gap-2">
-            <button type="submit" class="btn btn-success">@((isEditing ? "Speichern" : "Anlegen"))</button>
-            <button type="button" class="btn btn-secondary" @onclick="CancelEdit">Abbrechen</button>
-        </div>
-    </EditForm>
-}
-
-@if (isLoading)
-{
-    <p><em>Lade Daten...</em></p>
-}
-else if (items.Count == 0)
-{
-    <p>Keine Einträge vorhanden.</p>
-}
-else
-{
-    <table class="table table-striped">
-        <thead>
-            <tr>
-                <th>Id</th>
-                <th>Titel</th>
-                <th>String</th>
-                <th>Angelegt von</th>
-                <th>Angelegt am</th>
-                <th>Geändert von</th>
-                <th>Geändert am</th>
-                <th></th>
-            </tr>
-        </thead>
-        <tbody>
-            @foreach (var item in items)
-            {
-                <tr>
-                    <td>@item.Guid</td>
-                    <td>@item.CatTitle</td>
-                    <td>@item.CatString</td>
-                    <td>@item.AddedWho</td>
-                    <td>@item.AddedWhen.ToString("g")</td>
-                    <td>@item.ChangedWho</td>
-                    <td>@(item.ChangedWhen.HasValue ? item.ChangedWhen.Value.ToString("g") : string.Empty)</td>
-                    <td class="text-end">
-                        <button class="btn btn-sm btn-outline-primary me-2" @onclick="(() => StartEdit(item))">Bearbeiten</button>
-                        <button class="btn btn-sm btn-outline-danger" @onclick="(() => DeleteCatalog(item.Guid))">Löschen</button>
-                    </td>
-                </tr>
-            }
-        </tbody>
-    </table>
-}
-
-@code {
-    private List<CatalogReadDto> items = new();
-    private CatalogWriteDto formModel = new();
-    private int editingId;
-    private bool isLoading;
-    private bool isEditing;
-    private bool showForm;
-    private string? errorMessage;
-    private string? infoMessage;
-
-    protected override async Task OnInitializedAsync()
-    {
-        await LoadCatalogs();
-    }
-
-    private async Task LoadCatalogs()
-    {
-        isLoading = true;
-        errorMessage = null;
-        try
-        {
-            items = await Api.GetAllAsync();
-        }
-        catch (Exception ex)
-        {
-            errorMessage = $"Kataloge konnten nicht geladen werden: {ex.Message}";
-        }
-        finally
-        {
-            isLoading = false;
-            StateHasChanged();
-        }
-    }
-
-    private void StartCreate()
-    {
-        formModel = new CatalogWriteDto();
-        editingId = 0;
-        isEditing = false;
-        showForm = true;
-        infoMessage = null;
-        errorMessage = null;
-    }
-
-    private void StartEdit(CatalogReadDto item)
-    {
-        formModel = new CatalogWriteDto
-        {
-            CatTitle = item.CatTitle,
-            CatString = item.CatString,
-            UpdateProcedure = 0
-        };
-        editingId = item.Guid;
-        isEditing = true;
-        showForm = true;
-        infoMessage = null;
-        errorMessage = null;
-    }
-
-    private async Task HandleSubmit()
-    {
-        errorMessage = null;
-        infoMessage = null;
-
-        try
-        {
-            if (isEditing)
-            {
-                var updated = await Api.UpdateAsync(editingId, formModel);
-                if (!updated.Success)
-                {
-                    errorMessage = updated.Error ?? "Aktualisierung fehlgeschlagen.";
-                    return;
-                }
-
-                infoMessage = "Katalog aktualisiert.";
-            }
-            else
-            {
-                var created = await Api.CreateAsync(formModel);
-                if (!created.Success || created.Value == null)
-                {
-                    errorMessage = created.Error ?? "Anlegen fehlgeschlagen.";
-                    return;
-                }
-
-                infoMessage = "Katalog angelegt.";
-            }
-
-            showForm = false;
-            await LoadCatalogs();
-        }
-        catch (Exception ex)
-        {
-            errorMessage = $"Fehler beim Speichern: {ex.Message}";
-        }
-    }
-
-    private void CancelEdit()
-    {
-        showForm = false;
-        infoMessage = null;
-        errorMessage = null;
-    }
-
-    private async Task DeleteCatalog(int id)
-    {
-        errorMessage = null;
-        infoMessage = null;
-
-        try
-        {
-            var deleted = await Api.DeleteAsync(id);
-            if (!deleted.Success)
-            {
-                errorMessage = deleted.Error ?? "Löschen fehlgeschlagen.";
-                return;
-            }
-
-            infoMessage = "Katalog gelöscht.";
-            await LoadCatalogs();
-        }
-        catch (Exception ex)
-        {
-            errorMessage = $"Fehler beim Löschen: {ex.Message}";
-        }
-    }
-}
+<CatalogsGrid />

DbFirst.BlazorWasm/Pages/Dashboard.razor

@@ -0,0 +1,163 @@
+@page "/dashboard"
+@page "/dashboards/{DashboardId?}"
+@implements IAsyncDisposable
+@inject Microsoft.Extensions.Configuration.IConfiguration Configuration
+@inject NavigationManager Navigation
+@inject DashboardApiClient DashboardApi
+
+<style>
+    .dashboard-shell {
+        display: flex;
+        gap: 0;
+        min-height: 800px;
+        border: 1px solid #e6e6e6;
+        border-radius: 6px;
+        overflow: hidden;
+        background: #fff;
+    }
+    .dashboard-nav {
+        width: 220px;
+        border-right: 1px solid #e6e6e6;
+        background: #fafafa;
+    }
+    .dashboard-nav-title {
+        padding: 0.75rem 1rem 0.5rem;
+        font-size: 0.7rem;
+        text-transform: uppercase;
+        letter-spacing: 0.08em;
+        color: #6c757d;
+        font-weight: 600;
+    }
+    .dashboard-nav-link {
+        display: block;
+        padding: 0.55rem 1rem;
+        color: inherit;
+        text-decoration: none;
+    }
+    .dashboard-nav-link.active {
+        background: #e9ecef;
+        font-weight: 600;
+    }
+    .dashboard-content {
+        flex: 1;
+        min-width: 0;
+        padding: 1rem;
+    }
+</style>
+
+<PageTitle>Dashboards</PageTitle>
+
+<div class="dashboard-shell">
+    <aside class="dashboard-nav">
+        <div class="dashboard-nav-title">Dashboards</div>
+        @if (dashboards.Count == 0)
+        {
+            <div class="px-3 py-2 text-muted">Keine Dashboards vorhanden.</div>
+        }
+        else
+        {
+            @foreach (var dashboard in dashboards)
+            {
+                <NavLink class="dashboard-nav-link" href="@($"dashboards/{dashboard.Id}?mode={(IsDesigner ? "designer" : "viewer")}")">@dashboard.Name</NavLink>
+            }
+        }
+    </aside>
+    <section class="dashboard-content">
+        <div class="mb-3">
+            <DxButton RenderStyle="ButtonRenderStyle.Primary" Click="@ToggleMode">
+                @(IsDesigner ? "Zum Viewer wechseln" : "Zum Designer wechseln")
+            </DxButton>
+        </div>
+        <DxDashboard @key="DashboardKey" Endpoint="@DashboardEndpoint" InitialDashboardId="@SelectedDashboardId" WorkingMode="@CurrentMode" style="width: 100%; height: 800px;">
+        </DxDashboard>
+    </section>
+</div>
+
+@code {
+    [Parameter] public string? DashboardId { get; set; }
+    [SupplyParameterFromQuery] public string? Mode { get; set; }
+
+    private readonly List<DashboardInfoDto> dashboards = new();
+    private HubConnection? _hubConnection;
+
+    private bool IsDesigner => !string.Equals(Mode, "viewer", StringComparison.OrdinalIgnoreCase);
+    private WorkingMode CurrentMode => IsDesigner ? WorkingMode.Designer : WorkingMode.ViewerOnly;
+    private string SelectedDashboardId { get; set; } = string.Empty;
+    private string DashboardKey => $"{SelectedDashboardId}-{(IsDesigner ? "designer" : "viewer")}";
+
+    private string DashboardEndpoint => $"{Configuration["ApiBaseUrl"]?.TrimEnd('/')}/api/dashboard";
+    private string HubEndpoint => $"{Configuration["ApiBaseUrl"]?.TrimEnd('/')}/hubs/dashboards";
+
+    protected override async Task OnInitializedAsync()
+    {
+        await RefreshDashboards();
+
+        _hubConnection = new HubConnectionBuilder()
+            .WithUrl(HubEndpoint)
+            .WithAutomaticReconnect()
+            .Build();
+
+        _hubConnection.On("DashboardsChanged", async () =>
+        {
+            await RefreshDashboards();
+        });
+
+        await _hubConnection.StartAsync();
+    }
+
+    protected override async Task OnParametersSetAsync()
+    {
+        if (dashboards.Count == 0)
+        {
+            await RefreshDashboards();
+        }
+
+        var requestedId = string.IsNullOrWhiteSpace(DashboardId) || string.Equals(DashboardId, "default", StringComparison.OrdinalIgnoreCase)
+            ? null
+            : DashboardId;
+
+        var resolved = !string.IsNullOrWhiteSpace(requestedId)
+            ? dashboards.FirstOrDefault(d => string.Equals(d.Id, requestedId, StringComparison.OrdinalIgnoreCase))
+            : dashboards.FirstOrDefault(d => string.Equals(d.Id, "DefaultDashboard", StringComparison.OrdinalIgnoreCase))
+              ?? dashboards.FirstOrDefault();
+
+        if (resolved == null)
+        {
+            return;
+        }
+
+        SelectedDashboardId = resolved.Id;
+
+        if (!string.Equals(DashboardId, resolved.Id, StringComparison.OrdinalIgnoreCase))
+        {
+            Navigation.NavigateTo($"dashboards/{resolved.Id}?mode={(IsDesigner ? "designer" : "viewer")}", replace: true);
+        }
+    }
+
+    private void ToggleMode()
+    {
+        var targetMode = IsDesigner ? "viewer" : "designer";
+        Navigation.NavigateTo($"dashboards/{SelectedDashboardId}?mode={targetMode}", replace: true);
+    }
+
+    private async Task RefreshDashboards()
+    {
+        var latest = await DashboardApi.GetAllAsync();
+        if (latest.Count == dashboards.Count && latest.All(d => dashboards.Any(x => x.Id == d.Id && x.Name == d.Name)))
+        {
+            return;
+        }
+
+        dashboards.Clear();
+        dashboards.AddRange(latest);
+        await InvokeAsync(StateHasChanged);
+    }
+
+    public async ValueTask DisposeAsync()
+    {
+        if (_hubConnection != null)
+        {
+            await _hubConnection.DisposeAsync();
+        }
+    }
+}

DbFirst.BlazorWasm/Pages/Home.razor

@@ -2,6 +2,6 @@
 
 <PageTitle>Home</PageTitle>
 
-<h1>Hello, world!</h1>
+<h1>Db First approach</h1>
 
-Welcome to your new app.
+This is a Blazor WebAssembly application demonstrating the Database First approach using DevExpress components.

DbFirst.BlazorWasm/Pages/Massdata.razor

@@ -0,0 +1,7 @@
+@page "/massdata"
+
+<PageTitle>MassData</PageTitle>
+
+<h1>MassData</h1>
+
+<MassDataGrid />

DbFirst.BlazorWasm/Program.cs

@@ -1,14 +1,23 @@
+/* Initialisiert die Blazor WebAssembly-Anwendung.
+   Registriert Root-Komponenten 
+   Konfiguriert Abhängigkeiten */
+
 using Microsoft.AspNetCore.Components.Web;
 using Microsoft.AspNetCore.Components.WebAssembly.Hosting;
 using DbFirst.BlazorWasm;
 using DbFirst.BlazorWasm.Services;
+using DevExpress.Blazor;
 
 var builder = WebAssemblyHostBuilder.CreateDefault(args);
 builder.RootComponents.Add<App>("#app");
 builder.RootComponents.Add<HeadOutlet>("head::after");
 
+builder.Services.AddDevExpressBlazor();
+
 var apiBaseUrl = builder.Configuration["ApiBaseUrl"] ?? builder.HostEnvironment.BaseAddress;
 builder.Services.AddScoped(sp => new HttpClient { BaseAddress = new Uri(apiBaseUrl) });
 builder.Services.AddScoped<CatalogApiClient>();
+builder.Services.AddScoped<DashboardApiClient>();
+builder.Services.AddScoped<MassDataApiClient>();
 
 await builder.Build().RunAsync();

DbFirst.BlazorWasm/Services/CatalogApiClient.cs

@@ -1,3 +1,6 @@
+/* Kapselt die Kommunikation mit der API für den Catalog-Endpunkt.
+   Bietet Methoden für CRUD-Operationen auf Catalog-Daten */
+
 using System.Net;
 using System.Net.Http.Json;
 using System.Text.Json;
@@ -65,6 +68,9 @@ public class CatalogApiClient
 
     private static async Task<string> ReadErrorAsync(HttpResponseMessage response)
     {
+        // Liest und analysiert Fehlerdetails aus der API-Antwort.
+        // Gibt eine benutzerfreundliche Fehlermeldung zurück.
+
         string? problemTitle = null;
         string? problemDetail = null;
 
@@ -116,6 +122,9 @@ public class CatalogApiClient
 
     private static string FormatSuffix(string? title, string? detail, string? reason)
     {
+        // Formatiert zusätzliche Informationen für Fehlermeldungen.
+        // Kombiniert Titel, Details und Grund in einer lesbaren Form.
+
         var parts = new List<string>();
         if (!string.IsNullOrWhiteSpace(title)) parts.Add(title);
         if (!string.IsNullOrWhiteSpace(detail)) parts.Add(detail);

DbFirst.BlazorWasm/Services/DashboardApiClient.cs

@@ -0,0 +1,21 @@
+using System.Net.Http.Json;
+using DbFirst.BlazorWasm.Models;
+
+namespace DbFirst.BlazorWasm.Services;
+
+public class DashboardApiClient
+{
+    private readonly HttpClient _httpClient;
+    private const string Endpoint = "api/dashboard/dashboards";
+
+    public DashboardApiClient(HttpClient httpClient)
+    {
+        _httpClient = httpClient;
+    }
+
+    public async Task<List<DashboardInfoDto>> GetAllAsync()
+    {
+        var result = await _httpClient.GetFromJsonAsync<List<DashboardInfoDto>>(Endpoint);
+        return result ?? new List<DashboardInfoDto>();
+    }
+}

DbFirst.BlazorWasm/Services/MassDataApiClient.cs

@@ -0,0 +1,52 @@
+using System.Net.Http.Json;
+using DbFirst.BlazorWasm.Models;
+
+namespace DbFirst.BlazorWasm.Services;
+
+public class MassDataApiClient
+{
+    private readonly HttpClient _httpClient;
+    private const string Endpoint = "api/massdata";
+
+    public MassDataApiClient(HttpClient httpClient)
+    {
+        _httpClient = httpClient;
+    }
+
+    public async Task<int> GetCountAsync()
+    {
+        var result = await _httpClient.GetFromJsonAsync<int?>("api/massdata/count");
+        return result ?? 0;
+    }
+
+    public async Task<List<MassDataReadDto>> GetAllAsync(int skip, int take)
+    {
+        var result = await _httpClient.GetFromJsonAsync<List<MassDataReadDto>>($"{Endpoint}?skip={skip}&take={take}");
+        return result ?? new List<MassDataReadDto>();
+    }
+
+    public async Task<MassDataReadDto> UpsertAsync(MassDataWriteDto dto)
+    {
+        var response = await _httpClient.PostAsJsonAsync($"{Endpoint}/upsert", dto);
+        response.EnsureSuccessStatusCode();
+        var payload = await response.Content.ReadFromJsonAsync<MassDataReadDto>();
+        return payload ?? new MassDataReadDto();
+    }
+
+    public async Task<MassDataReadDto?> GetByCustomerNameAsync(string customerName)
+    {
+        if (string.IsNullOrWhiteSpace(customerName))
+        {
+            return null;
+        }
+
+        var response = await _httpClient.GetAsync($"{Endpoint}/{Uri.EscapeDataString(customerName)}");
+        if (response.StatusCode == System.Net.HttpStatusCode.NotFound)
+        {
+            return null;
+        }
+
+        response.EnsureSuccessStatusCode();
+        return await response.Content.ReadFromJsonAsync<MassDataReadDto>();
+    }
+}

DbFirst.BlazorWasm/_Imports.razor

@@ -6,7 +6,12 @@
 @using Microsoft.AspNetCore.Components.Web.Virtualization
 @using Microsoft.AspNetCore.Components.WebAssembly.Http
 @using Microsoft.JSInterop
+@using Microsoft.AspNetCore.SignalR.Client
 @using DbFirst.BlazorWasm
 @using DbFirst.BlazorWasm.Layout
 @using DbFirst.BlazorWasm.Models
 @using DbFirst.BlazorWasm.Services
+@using DbFirst.BlazorWasm.Components
+@using DevExpress.Blazor
+@using DevExpress.DashboardBlazor
+@using DevExpress.DashboardWeb

DbFirst.BlazorWasm/wwwroot/index.html

@@ -1,32 +1,58 @@
-<!DOCTYPE html>
-<html lang="en">
+<!--
+•	Ist der technische Einstiegspunkt der Blazor WebAssembly-Anwendung.
+•	Sie lädt die notwendigen Ressourcen (z. B. das Blazor-Skript blazor.webassembly.js)
+    und definiert den Platzhalter <div id="app">, in dem die Blazor-Komponenten gerendert werden.
+•	Ohne diese Datei könnte die Blazor-Anwendung nicht starten, da sie die Verbindung
+    zwischen der statischen HTML-Welt und der Blazor-Welt herstellt.
+    kurz: Startet die Anwendung und lädt die Blazor-Umgebung.
+    -->
 
-<head>
-    <meta charset="utf-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <title>DbFirst.BlazorWasm</title>
-    <base href="/" />
-    <link rel="stylesheet" href="css/bootstrap/bootstrap.min.css" />
-    <link rel="stylesheet" href="css/app.css" />
-    <link rel="icon" type="image/png" href="favicon.png" />
-    <link href="DbFirst.BlazorWasm.styles.css" rel="stylesheet" />
-</head>
+    <!DOCTYPE html>
+    <html lang="en">
 
-<body>
-    <div id="app">
-        <svg class="loading-progress">
-            <circle r="40%" cx="50%" cy="50%" />
-            <circle r="40%" cx="50%" cy="50%" />
-        </svg>
-        <div class="loading-progress-text"></div>
-    </div>
+    <head>
+        <meta charset="utf-8" />
+        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+        <title>DbFirst.BlazorWasm</title>
+        <base href="/" />
 
-    <div id="blazor-error-ui">
-        An unhandled error has occurred.
-        <a href="" class="reload">Reload</a>
-        <a class="dismiss">🗙</a>
-    </div>
-    <script src="_framework/blazor.webassembly.js"></script>
-</body>
+        <!-- Stylesheets für DevExpress und Bootstrap -->
+
+        <link href="_content/DevExpress.Blazor.Dashboard/ace.css" rel="stylesheet" />
+        <link href="_content/DevExpress.Blazor.Dashboard/ace-theme-dreamweaver.css" rel="stylesheet" />
+        <link href="_content/DevExpress.Blazor.Dashboard/ace-theme-ambiance.css" rel="stylesheet" />
+        <link href="_content/DevExpress.Blazor.Dashboard/dx.light.css" rel="stylesheet" />
+        <link href="_content/DevExpress.Blazor.Dashboard/dx-analytics.common.css" rel="stylesheet" />
+        <link href="_content/DevExpress.Blazor.Dashboard/dx-analytics.light.css" rel="stylesheet" />
+        <link href="_content/DevExpress.Blazor.Dashboard/dx-querybuilder.css" rel="stylesheet" />
+        <link href="_content/DevExpress.Blazor.Dashboard/dx-dashboard.light.min.css" rel="stylesheet" />
+
+        <link rel="stylesheet" href="css/bootstrap/bootstrap.min.css" />
+        <link rel="stylesheet" href="css/app.css" />
+
+        <link rel="icon" type="image/png" href="favicon.png" />
+        <link href="DbFirst.BlazorWasm.styles.css" rel="stylesheet" />
+    </head>
+
+    <body>
+        <!-- Einstiegspunkt der Blazor-Anwendung -->
+        <div id="app">
+            <svg class="loading-progress">
+                <circle r="40%" cx="50%" cy="50%" />
+                <circle r="40%" cx="50%" cy="50%" />
+            </svg>
+            <div class="loading-progress-text"></div>
+        </div>
+
+        <!-- Fehler-UI für unvorhergesehene Fehler -->
+        <div id="blazor-error-ui">
+            An unhandled error has occurred.
+            <a href="" class="reload">Reload</a>
+            <a class="dismiss">🗙</a>
+        </div>
+
+        <!-- Blazor WebAssembly-Skript -->
+        <script src="_framework/blazor.webassembly.js"></script>
+    </body>
 
 </html>

DbFirst.BlazorWebApp/Components/App.razor

@@ -0,0 +1,39 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="utf-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <base href="/" />
+    @DxResourceManager.RegisterTheme(Themes.Fluent)
+    @DxResourceManager.RegisterScripts()
+
+    <link href="_content/DevExpress.Blazor.Dashboard/ace.css" rel="stylesheet" />
+    <link href="_content/DevExpress.Blazor.Dashboard/ace-theme-dreamweaver.css" rel="stylesheet" />
+    <link href="_content/DevExpress.Blazor.Dashboard/ace-theme-ambiance.css" rel="stylesheet" />
+    <link href="_content/DevExpress.Blazor.Dashboard/dx.light.css" rel="stylesheet" />
+    <link href="_content/DevExpress.Blazor.Dashboard/dx-analytics.common.css" rel="stylesheet" />
+    <link href="_content/DevExpress.Blazor.Dashboard/dx-analytics.light.css" rel="stylesheet" />
+    <link href="_content/DevExpress.Blazor.Dashboard/dx-querybuilder.css" rel="stylesheet" />
+    <link href="_content/DevExpress.Blazor.Dashboard/dx-dashboard.light.min.css" rel="stylesheet" />
+
+    <link rel="stylesheet" href="_content/DevExpress.Blazor.Themes/bootstrap-external.bs5.min.css" />
+    <link rel="stylesheet" href="_content/DevExpress.Blazor.Themes.Fluent/core.min.css" />
+    <link rel="stylesheet" href="_content/DevExpress.Blazor.Themes.Fluent/global.min.css" />
+    <link rel="stylesheet" href="_content/DevExpress.Blazor.Themes.Fluent/modes/light.min.css" />
+    <link rel="stylesheet" href="_content/DevExpress.Blazor.Themes.Fluent/accents/blue.min.css" />
+    <link rel="stylesheet" href="_content/DevExpress.Blazor.Themes.Fluent/bootstrap/fluent-light.bs5.min.css" />
+
+    <link rel="stylesheet" href="bootstrap/bootstrap.min.css" />
+    <link rel="stylesheet" href="app.css" />
+    <link rel="stylesheet" href="DbFirst.BlazorWebApp.styles.css" />
+    <link rel="icon" type="image/png" href="favicon.png" />
+    <HeadOutlet />
+</head>
+
+<body>
+    <Routes />
+    <script src="_framework/blazor.web.js"></script>
+</body>
+
+</html>

DbFirst.BlazorWebApp/Components/CatalogsGrid.razor

@@ -0,0 +1,367 @@
+@using Microsoft.AspNetCore.Components.Forms
+@inject CatalogApiClient Api
+
+<style>
+    .action-panel { margin-bottom: 16px; }
+    .grid-section { margin-top: 12px; }
+    .catalog-edit-popup {
+        min-width: 720px;
+    }
+</style>
+
+@if (!string.IsNullOrWhiteSpace(errorMessage))
+{
+    <div class="alert alert-danger" role="alert">@errorMessage</div>
+}
+else if (!string.IsNullOrWhiteSpace(infoMessage))
+{
+    <div class="alert alert-success" role="alert">@infoMessage</div>
+}
+
+@if (isLoading)
+{
+    <p><em>Lade Daten...</em></p>
+}
+else if (items.Count == 0)
+{
+    <p>Keine Einträge vorhanden.</p>
+}
+else
+{
+    <div class="grid-section">
+        <DxGrid Data="@items"
+                TItem="CatalogReadDto"
+                KeyFieldName="@nameof(CatalogReadDto.Guid)"
+                ShowFilterRow="true"
+                PageSize="10"
+                CssClass="mb-4 catalog-grid"
+                EditMode="GridEditMode.PopupEditForm"
+                PopupEditFormCssClass="catalog-edit-popup"
+                PopupEditFormHeaderText="@popupHeaderText"
+                CustomizeEditModel="OnCustomizeEditModel"
+                EditModelSaving="OnEditModelSaving"
+                DataItemDeleting="OnDataItemDeleting">
+            <Columns>
+                <DxGridCommandColumn Width="120px" />
+                <DxGridDataColumn FieldName="@nameof(CatalogReadDto.Guid)" Caption="Id" Width="140px" SortIndex="0" SortOrder="GridColumnSortOrder.Ascending">
+                    <FilterRowCellTemplate Context="filter">
+                        <DxTextBox Text="@(filter.FilterRowValue?.ToString())"
+                                   TextChanged="@(value => filter.FilterRowValue = value)"
+                                   CssClass="filter-search-input" />
+                    </FilterRowCellTemplate>
+                </DxGridDataColumn>
+                <DxGridDataColumn FieldName="@nameof(CatalogReadDto.CatTitle)" Caption="Titel">
+                    <FilterRowCellTemplate Context="filter">
+                        <DxTextBox Text="@(filter.FilterRowValue as string)"
+                                   TextChanged="@(value => filter.FilterRowValue = value)"
+                                   CssClass="filter-search-input" />
+                    </FilterRowCellTemplate>
+                </DxGridDataColumn>
+                <DxGridDataColumn FieldName="@nameof(CatalogReadDto.CatString)" Caption="String">
+                    <FilterRowCellTemplate Context="filter">
+                        <DxTextBox Text="@(filter.FilterRowValue as string)"
+                                   TextChanged="@(value => filter.FilterRowValue = value)"
+                                   CssClass="filter-search-input" />
+                    </FilterRowCellTemplate>
+                </DxGridDataColumn>
+                <DxGridDataColumn FieldName="@nameof(CatalogReadDto.AddedWho)" Caption="Angelegt von" ReadOnly="true">
+                    <FilterRowCellTemplate Context="filter">
+                        <DxTextBox Text="@(filter.FilterRowValue as string)"
+                                   TextChanged="@(value => filter.FilterRowValue = value)"
+                                   CssClass="filter-search-input" />
+                    </FilterRowCellTemplate>
+                </DxGridDataColumn>
+                <DxGridDataColumn FieldName="@nameof(CatalogReadDto.AddedWhen)" Caption="Angelegt am" ReadOnly="true">
+                    <FilterRowCellTemplate Context="filter">
+                        <DxDateEdit Date="@((DateTime?)filter.FilterRowValue)"
+                                    DateChanged="@((DateTime? value) => { filter.FilterRowValue = value; })"
+                                    Width="100%" />
+                    </FilterRowCellTemplate>
+                </DxGridDataColumn>
+                <DxGridDataColumn FieldName="@nameof(CatalogReadDto.ChangedWho)" Caption="Geändert von" ReadOnly="true">
+                    <FilterRowCellTemplate Context="filter">
+                        <DxTextBox Text="@(filter.FilterRowValue as string)"
+                                   TextChanged="@(value => filter.FilterRowValue = value)"
+                                   CssClass="filter-search-input" />
+                    </FilterRowCellTemplate>
+                </DxGridDataColumn>
+                <DxGridDataColumn FieldName="@nameof(CatalogReadDto.ChangedWhen)" Caption="Geändert am" ReadOnly="true">
+                    <FilterRowCellTemplate Context="filter">
+                        <DxDateEdit Date="@((DateTime?)filter.FilterRowValue)"
+                                    DateChanged="@((DateTime? value) => { filter.FilterRowValue = value; })"
+                                    Width="100%" />
+                    </FilterRowCellTemplate>
+                </DxGridDataColumn>
+            </Columns>
+            <EditFormTemplate Context="editFormContext">
+                @{ SetEditContext(editFormContext.EditContext); var editModel = (CatalogEditModel)editFormContext.EditModel; SetPopupHeaderText(editModel.IsNew); }
+                <DxFormLayout ColCount="2">
+                    <DxFormLayoutItem Caption="Titel">
+                        <DxTextBox @bind-Text="editModel.CatTitle" Width="100%" />
+                    </DxFormLayoutItem>
+                    <DxFormLayoutItem Caption="Kennung">
+                        <DxTextBox @bind-Text="editModel.CatString" Width="100%" />
+                    </DxFormLayoutItem>
+                    @if (!editModel.IsNew)
+                    {
+                        <DxFormLayoutItem Caption="Update-Prozedur">
+                            <DxComboBox Data="@procedureOptions"
+                                        TData="ProcedureOption"
+                                        TValue="int"
+                                        TextFieldName="Text"
+                                        ValueFieldName="Value"
+                                        @bind-Value="editModel.UpdateProcedure"
+                                        Width="100%" />
+                        </DxFormLayoutItem>
+                    }
+                    <DxFormLayoutItem ColSpanMd="12">
+                        <ValidationSummary />
+                    </DxFormLayoutItem>
+                </DxFormLayout>
+            </EditFormTemplate>
+        </DxGrid>
+    </div>
+}
+
+@code {
+    private List<CatalogReadDto> items = new();
+    private bool isLoading;
+    private string? errorMessage;
+    private string? infoMessage;
+    private EditContext? editContext;
+    private ValidationMessageStore? validationMessageStore;
+    private string popupHeaderText = "Edit";
+
+    private readonly List<ProcedureOption> procedureOptions = new()
+    {
+        new() { Value = 0, Text = "PRTBMY_CATALOG_UPDATE" },
+        new() { Value = 1, Text = "PRTBMY_CATALOG_SAVE" }
+    };
+
+    protected override async Task OnInitializedAsync()
+    {
+        await LoadCatalogs();
+    }
+
+    private void SetEditContext(EditContext context)
+    {
+        if (editContext == context)
+        {
+            return;
+        }
+
+        if (editContext != null)
+        {
+            editContext.OnFieldChanged -= OnEditFieldChanged;
+        }
+
+        editContext = context;
+        validationMessageStore = new ValidationMessageStore(editContext);
+        editContext.OnFieldChanged += OnEditFieldChanged;
+    }
+
+    private void OnEditFieldChanged(object? sender, FieldChangedEventArgs e)
+    {
+        if (validationMessageStore == null || editContext == null)
+        {
+            return;
+        }
+
+        if (e.FieldIdentifier.FieldName == nameof(CatalogEditModel.UpdateProcedure))
+        {
+            validationMessageStore.Clear();
+            editContext.NotifyValidationStateChanged();
+            return;
+        }
+
+        if (e.FieldIdentifier.FieldName == nameof(CatalogEditModel.CatTitle))
+        {
+            var field = new FieldIdentifier(editContext.Model, nameof(CatalogEditModel.CatTitle));
+            validationMessageStore.Clear(field);
+            editContext.NotifyValidationStateChanged();
+        }
+    }
+
+    private void SetPopupHeaderText(bool isNew)
+    {
+        popupHeaderText = isNew ? "Neu" : "Edit";
+    }
+
+    private void OnCustomizeEditModel(GridCustomizeEditModelEventArgs e)
+    {
+        popupHeaderText = e.IsNew ? "Neu" : "Edit";
+        if (e.IsNew)
+        {
+            e.EditModel = new CatalogEditModel { IsNew = true };
+            return;
+        }
+
+        var item = (CatalogReadDto)e.DataItem;
+        e.EditModel = new CatalogEditModel
+        {
+            Guid = item.Guid,
+            CatTitle = item.CatTitle,
+            CatString = item.CatString,
+            UpdateProcedure = 0,
+            OriginalCatTitle = item.CatTitle,
+            IsNew = false
+        };
+    }
+
+    private async Task LoadCatalogs()
+    {
+        isLoading = true;
+        errorMessage = null;
+        try
+        {
+            items = await Api.GetAllAsync();
+        }
+        catch (Exception ex)
+        {
+            errorMessage = $"Kataloge konnten nicht geladen werden: {ex.Message}";
+        }
+        finally
+        {
+            isLoading = false;
+            StateHasChanged();
+        }
+    }
+
+    private async Task OnEditModelSaving(GridEditModelSavingEventArgs e)
+    {
+        errorMessage = null;
+        infoMessage = null;
+
+        validationMessageStore?.Clear();
+        editContext?.NotifyValidationStateChanged();
+
+        var editModel = (CatalogEditModel)e.EditModel;
+        if (!ValidateEditModel(editModel, e.IsNew))
+        {
+            e.Cancel = true;
+            return;
+        }
+
+        var dto = new CatalogWriteDto
+        {
+            CatTitle = editModel.CatTitle,
+            CatString = editModel.CatString,
+            UpdateProcedure = editModel.UpdateProcedure
+        };
+
+        try
+        {
+            if (e.IsNew)
+            {
+                var created = await Api.CreateAsync(dto);
+                if (!created.Success || created.Value == null)
+                {
+                    if (!string.IsNullOrWhiteSpace(created.Error))
+                    {
+                        AddValidationError(editModel, nameof(CatalogEditModel.CatTitle), created.Error);
+                    }
+                    else
+                    {
+                        errorMessage = "Anlegen fehlgeschlagen.";
+                    }
+
+                    e.Cancel = true;
+                    return;
+                }
+
+                infoMessage = "Katalog angelegt.";
+            }
+            else
+            {
+                var updated = await Api.UpdateAsync(editModel.Guid, dto);
+                if (!updated.Success)
+                {
+                    errorMessage = updated.Error ?? "Aktualisierung fehlgeschlagen.";
+                    e.Cancel = true;
+                    return;
+                }
+
+                infoMessage = "Katalog aktualisiert.";
+            }
+
+            await LoadCatalogs();
+        }
+        catch (Exception ex)
+        {
+            errorMessage = $"Fehler beim Speichern: {ex.Message}";
+            e.Cancel = true;
+        }
+    }
+
+    private void AddValidationError(CatalogEditModel editModel, string fieldName, string message)
+    {
+        if (editContext == null || validationMessageStore == null)
+        {
+            return;
+        }
+
+        var field = new FieldIdentifier(editModel, fieldName);
+        validationMessageStore.Add(field, message);
+        editContext.NotifyValidationStateChanged();
+    }
+
+    private bool ValidateEditModel(CatalogEditModel editModel, bool isNew)
+    {
+        if (isNew)
+        {
+            return true;
+        }
+
+        if (editModel.UpdateProcedure == 0 &&
+            !string.Equals(editModel.CatTitle, editModel.OriginalCatTitle, StringComparison.OrdinalIgnoreCase))
+        {
+            AddValidationError(editModel, nameof(CatalogEditModel.CatTitle), "Titel kann nicht geändert werden.");
+            return false;
+        }
+
+        return true;
+    }
+
+    private async Task OnDataItemDeleting(GridDataItemDeletingEventArgs e)
+    {
+        errorMessage = null;
+        infoMessage = null;
+
+        var item = (CatalogReadDto)e.DataItem;
+
+        try
+        {
+            var deleted = await Api.DeleteAsync(item.Guid);
+            if (!deleted.Success)
+            {
+                errorMessage = deleted.Error ?? "Löschen fehlgeschlagen.";
+                e.Cancel = true;
+                return;
+            }
+
+            infoMessage = "Katalog gelöscht.";
+            await LoadCatalogs();
+        }
+        catch (Exception ex)
+        {
+            errorMessage = $"Fehler beim Löschen: {ex.Message}";
+            e.Cancel = true;
+        }
+    }
+
+    private sealed class CatalogEditModel
+    {
+        public int Guid { get; set; }
+        public string CatTitle { get; set; } = string.Empty;
+        public string CatString { get; set; } = string.Empty;
+        public int UpdateProcedure { get; set; }
+        public string OriginalCatTitle { get; set; } = string.Empty;
+        public bool IsNew { get; set; }
+    }
+
+    private sealed class ProcedureOption
+    {
+        public int Value { get; set; }
+        public string Text { get; set; } = string.Empty;
+    }
+}

DbFirst.BlazorWebApp/Components/Layout/MainLayout.razor

@@ -0,0 +1,23 @@
+@inherits LayoutComponentBase
+
+<div class="page">
+    <div class="sidebar">
+        <NavMenu />
+    </div>
+
+    <main>
+        <div class="top-row px-4">
+            <a href="https://learn.microsoft.com/aspnet/core/" target="_blank">About</a>
+        </div>
+
+        <article class="content px-4">
+            @Body
+        </article>
+    </main>
+</div>
+
+<div id="blazor-error-ui">
+    An unhandled error has occurred.
+    <a href="" class="reload">Reload</a>
+    <a class="dismiss">🗙</a>
+</div>

DbFirst.BlazorWebApp/Components/Layout/MainLayout.razor.css

@@ -0,0 +1,96 @@
+.page {
+    position: relative;
+    display: flex;
+    flex-direction: column;
+}
+
+main {
+    flex: 1;
+}
+
+.sidebar {
+    background-image: linear-gradient(180deg, rgb(5, 39, 103) 0%, #3a0647 70%);
+}
+
+.top-row {
+    background-color: #f7f7f7;
+    border-bottom: 1px solid #d6d5d5;
+    justify-content: flex-end;
+    height: 3.5rem;
+    display: flex;
+    align-items: center;
+}
+
+    .top-row ::deep a, .top-row ::deep .btn-link {
+        white-space: nowrap;
+        margin-left: 1.5rem;
+        text-decoration: none;
+    }
+
+    .top-row ::deep a:hover, .top-row ::deep .btn-link:hover {
+        text-decoration: underline;
+    }
+
+    .top-row ::deep a:first-child {
+        overflow: hidden;
+        text-overflow: ellipsis;
+    }
+
+@media (max-width: 640.98px) {
+    .top-row {
+        justify-content: space-between;
+    }
+
+    .top-row ::deep a, .top-row ::deep .btn-link {
+        margin-left: 0;
+    }
+}
+
+@media (min-width: 641px) {
+    .page {
+        flex-direction: row;
+    }
+
+    .sidebar {
+        width: 250px;
+        height: 100vh;
+        position: sticky;
+        top: 0;
+    }
+
+    .top-row {
+        position: sticky;
+        top: 0;
+        z-index: 1;
+    }
+
+    .top-row.auth ::deep a:first-child {
+        flex: 1;
+        text-align: right;
+        width: 0;
+    }
+
+    .top-row, article {
+        padding-left: 2rem !important;
+        padding-right: 1.5rem !important;
+    }
+}
+
+#blazor-error-ui {
+    background: lightyellow;
+    bottom: 0;
+    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
+    display: none;
+    left: 0;
+    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
+    position: fixed;
+    width: 100%;
+    z-index: 1000;
+}
+
+    #blazor-error-ui .dismiss {
+        cursor: pointer;
+        position: absolute;
+        right: 0.75rem;
+        top: 0.5rem;
+    }

DbFirst.BlazorWebApp/Components/Layout/NavMenu.razor

@@ -0,0 +1,47 @@
+<div class="top-row ps-3 navbar navbar-dark">
+    <div class="container-fluid">
+        <a class="navbar-brand" href="">DbFirst.BlazorWebApp</a>
+    </div>
+</div>
+
+<input type="checkbox" title="Navigation menu" class="navbar-toggler" />
+
+<div class="nav-scrollable" onclick="document.querySelector('.navbar-toggler').click()">
+    <nav class="flex-column">
+        <div class="nav-item px-3">
+            <NavLink class="nav-link" href="" Match="NavLinkMatch.All">
+                <span class="bi bi-house-door-fill-nav-menu" aria-hidden="true"></span> Home
+            </NavLink>
+        </div>
+
+        <div class="nav-item px-3">
+            <NavLink class="nav-link" href="counter">
+                <span class="bi bi-plus-square-fill-nav-menu" aria-hidden="true"></span> Counter
+            </NavLink>
+        </div>
+
+        <div class="nav-item px-3">
+            <NavLink class="nav-link" href="weather">
+                <span class="bi bi-list-nested-nav-menu" aria-hidden="true"></span> Weather
+            </NavLink>
+        </div>
+        <div class="nav-item px-3">
+            <NavLink class="nav-link" href="catalogs">
+                <span class="bi bi-collection-nav-menu" aria-hidden="true"></span> Catalogs
+            </NavLink>
+        </div>
+
+        <div class="nav-item px-3">
+            <NavLink class="nav-link" href="dashboards">
+                <span class="oi oi-list-rich" aria-hidden="true"></span> Dashboards
+            </NavLink>
+        </div>
+
+        <div class="nav-item px-3">
+            <NavLink class="nav-link" href="massdata">
+                <span class="bi bi-table" aria-hidden="true"></span> MassData
+            </NavLink>
+        </div>
+    </nav>
+</div>
+

DbFirst.BlazorWebApp/Components/Layout/NavMenu.razor.css

@@ -0,0 +1,105 @@
+.navbar-toggler {
+    appearance: none;
+    cursor: pointer;
+    width: 3.5rem;
+    height: 2.5rem;
+    color: white;
+    position: absolute;
+    top: 0.5rem;
+    right: 1rem;
+    border: 1px solid rgba(255, 255, 255, 0.1);
+    background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 0.55%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") no-repeat center/1.75rem rgba(255, 255, 255, 0.1);
+}
+
+.navbar-toggler:checked {
+    background-color: rgba(255, 255, 255, 0.5);
+}
+
+.top-row {
+    height: 3.5rem;
+    background-color: rgba(0,0,0,0.4);
+}
+
+.navbar-brand {
+    font-size: 1.1rem;
+}
+
+.bi {
+    display: inline-block;
+    position: relative;
+    width: 1.25rem;
+    height: 1.25rem;
+    margin-right: 0.75rem;
+    top: -1px;
+    background-size: cover;
+}
+
+.bi-house-door-fill-nav-menu {
+    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-house-door-fill' viewBox='0 0 16 16'%3E%3Cpath d='M6.5 14.5v-3.505c0-.245.25-.495.5-.495h2c.25 0 .5.25.5.5v3.5a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5v-7a.5.5 0 0 0-.146-.354L13 5.793V2.5a.5.5 0 0 0-.5-.5h-1a.5.5 0 0 0-.5.5v1.293L8.354 1.146a.5.5 0 0 0-.708 0l-6 6A.5.5 0 0 0 1.5 7.5v7a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5Z'/%3E%3C/svg%3E");
+}
+
+.bi-plus-square-fill-nav-menu {
+    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-plus-square-fill' viewBox='0 0 16 16'%3E%3Cpath d='M2 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2H2zm6.5 4.5v3h3a.5.5 0 0 1 0 1h-3v3a.5.5 0 0 1-1 0v-3h-3a.5.5 0 0 1 0-1h3v-3a.5.5 0 0 1 1 0z'/%3E%3C/svg%3E");
+}
+
+.bi-list-nested-nav-menu {
+    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-list-nested' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M4.5 11.5A.5.5 0 0 1 5 11h10a.5.5 0 0 1 0 1H5a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 3 7h10a.5.5 0 0 1 0 1H3a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 1 3h10a.5.5 0 0 1 0 1H1a.5.5 0 0 1-.5-.5z'/%3E%3C/svg%3E");
+}
+
+.nav-item {
+    font-size: 0.9rem;
+    padding-bottom: 0.5rem;
+}
+
+    .nav-item:first-of-type {
+        padding-top: 1rem;
+    }
+
+    .nav-item:last-of-type {
+        padding-bottom: 1rem;
+    }
+
+    .nav-item ::deep .nav-link {
+        color: #d7d7d7;
+        background: none;
+        border: none;
+        border-radius: 4px;
+        height: 3rem;
+        display: flex;
+        align-items: center;
+        line-height: 3rem;
+        width: 100%;
+    }
+
+.nav-item ::deep a.active {
+    background-color: rgba(255,255,255,0.37);
+    color: white;
+}
+
+.nav-item ::deep .nav-link:hover {
+    background-color: rgba(255,255,255,0.1);
+    color: white;
+}
+
+.nav-scrollable {
+    display: none;
+}
+
+.navbar-toggler:checked ~ .nav-scrollable {
+    display: block;
+}
+
+@media (min-width: 641px) {
+    .navbar-toggler {
+        display: none;
+    }
+
+    .nav-scrollable {
+        /* Never collapse the sidebar for wide screens */
+        display: block;
+
+        /* Allow sidebar to scroll for tall menus */
+        height: calc(100vh - 3.5rem);
+        overflow-y: auto;
+    }
+}

DbFirst.BlazorWebApp/Components/MassDataGrid.razor

@@ -0,0 +1,408 @@
+@using Microsoft.AspNetCore.Components.Forms
+@inject MassDataApiClient Api
+
+<style>
+    .action-panel { margin-bottom: 16px; }
+    .grid-section { margin-top: 12px; }
+    .pager-container {
+        display: flex;
+        justify-content: center;
+        margin-top: 12px;
+        margin-bottom: 16px;
+    }
+    .massdata-grid .dxbl-grid-sort-asc,
+    .massdata-grid .dxbl-grid-sort-desc {
+        display: none;
+    }
+    .massdata-grid th.dxbl-grid-header-sortable {
+        position: relative;
+        padding-right: 1.5rem;
+    }
+    .massdata-grid th.dxbl-grid-header-sortable::before,
+    .massdata-grid th.dxbl-grid-header-sortable::after {
+        content: "";
+        position: absolute;
+        right: 0.45rem;
+        width: 0.7rem;
+        height: 0.7rem;
+        background-repeat: no-repeat;
+        background-size: 0.7rem 0.7rem;
+        opacity: 0.35;
+        pointer-events: none;
+    }
+    .massdata-grid th.dxbl-grid-header-sortable::before {
+        top: 38%;
+        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4.957 10.999a1 1 0 0 1-.821-1.571l2.633-3.785a1.5 1.5 0 0 1 2.462 0l2.633 3.785a1 1 0 0 1-.821 1.57H4.957Z' fill='%23888888'/%3E%3C/svg%3E");
+    }
+    .massdata-grid th.dxbl-grid-header-sortable::after {
+        top: 58%;
+        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4.957 5a1 1 0 0 0-.821 1.571l2.633 3.784a1.5 1.5 0 0 0 2.462 0l2.633-3.784A1 1 0 0 0 11.043 5H4.957Z' fill='%23888888'/%3E%3C/svg%3E");
+    }
+    .massdata-grid th.dxbl-grid-header-sortable[aria-sort="ascending"]::after {
+        opacity: 0;
+    }
+    .massdata-grid th.dxbl-grid-header-sortable[aria-sort="descending"]::before {
+        opacity: 0;
+    }
+    .massdata-grid .filter-search-input input {
+        padding-right: 1.75rem;
+        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M9.309 10.016a4.5 4.5 0 1 1 .707-.707l3.838 3.837a.5.5 0 0 1-.708.708L9.31 10.016ZM10 6.5a3.5 3.5 0 1 0-7 0 3.5 3.5 0 0 0 7 0Z' fill='%23666666'/%3E%3C/svg%3E");
+        background-repeat: no-repeat;
+        background-position: right 0.5rem center;
+        background-size: 0.9rem;
+    }
+    .massdata-edit-popup {
+        min-width: 720px;
+    }
+</style>
+
+@if (!string.IsNullOrWhiteSpace(errorMessage))
+{
+    <div class="alert alert-danger" role="alert">@errorMessage</div>
+}
+else if (!string.IsNullOrWhiteSpace(infoMessage))
+{
+    <div class="alert alert-success" role="alert">@infoMessage</div>
+}
+
+@if (isLoading)
+{
+    <p><em>Lade Daten...</em></p>
+}
+else if (items.Count == 0)
+{
+    <p>Keine Einträge vorhanden.</p>
+}
+else
+{
+    <div class="grid-section">
+        <DxGrid Data="@items"
+                TItem="MassDataReadDto"
+                KeyFieldName="@nameof(MassDataReadDto.Id)"
+                ShowFilterRow="true"
+                ShowGroupPanel="true"
+                AllowColumnResize="true"
+                PagerVisible="false"
+                PageSize="100"
+                CssClass="mb-3 massdata-grid"
+                EditMode="GridEditMode.PopupEditForm"
+                PopupEditFormCssClass="massdata-edit-popup"
+                PopupEditFormHeaderText="@popupHeaderText"
+                CustomizeEditModel="OnCustomizeEditModel"
+                EditModelSaving="OnEditModelSaving"
+                DataItemDeleting="OnDataItemDeleting">
+            <Columns>
+                <DxGridCommandColumn Width="120px" />
+                <DxGridDataColumn FieldName="@nameof(MassDataReadDto.Id)" Caption="Id" Width="90px" ReadOnly="true">
+                    <FilterRowCellTemplate Context="filter">
+                        <DxTextBox Text="@(filter.FilterRowValue?.ToString())"
+                                   TextChanged="@(value => filter.FilterRowValue = value)"
+                                   CssClass="filter-search-input" />
+                    </FilterRowCellTemplate>
+                </DxGridDataColumn>
+                <DxGridDataColumn FieldName="@nameof(MassDataReadDto.CustomerName)" Caption="CustomerName">
+                    <FilterRowCellTemplate Context="filter">
+                        <DxTextBox Text="@(filter.FilterRowValue as string)"
+                                   TextChanged="@(value => filter.FilterRowValue = value)"
+                                   CssClass="filter-search-input" />
+                    </FilterRowCellTemplate>
+                </DxGridDataColumn>
+                <DxGridDataColumn FieldName="@nameof(MassDataReadDto.Amount)" Caption="Amount" DisplayFormat="c2">
+                    <FilterRowCellTemplate Context="filter">
+                        <DxTextBox Text="@(filter.FilterRowValue?.ToString())"
+                                   TextChanged="@(value => filter.FilterRowValue = value)"
+                                   CssClass="filter-search-input" />
+                    </FilterRowCellTemplate>
+                </DxGridDataColumn>
+                <DxGridDataColumn FieldName="@nameof(MassDataReadDto.Category)" Caption="Category" ReadOnly="true">
+                    <FilterRowCellTemplate Context="filter">
+                        <DxTextBox Text="@(filter.FilterRowValue as string)"
+                                   TextChanged="@(value => filter.FilterRowValue = value)"
+                                   CssClass="filter-search-input" />
+                    </FilterRowCellTemplate>
+                </DxGridDataColumn>
+                <DxGridDataColumn FieldName="@nameof(MassDataReadDto.StatusFlag)" Caption="Status" ReadOnly="true">
+                    <FilterRowCellTemplate Context="filter">
+                        <DxComboBox Data="@statusFilterOptions"
+                                    TData="BoolFilterOption"
+                                    TValue="bool?"
+                                    TextFieldName="Text"
+                                    ValueFieldName="Value"
+                                    Value="@(filter.FilterRowValue as bool?)"
+                                    ValueChanged="@(value => filter.FilterRowValue = value)"
+                                    Width="100%" />
+                    </FilterRowCellTemplate>
+                </DxGridDataColumn>
+                <DxGridDataColumn FieldName="@nameof(MassDataReadDto.AddedWhen)" Caption="Added" ReadOnly="true">
+                    <FilterRowCellTemplate Context="filter">
+                        <DxDateEdit Date="@((DateTime?)filter.FilterRowValue)"
+                                    DateChanged="@((DateTime? value) => { filter.FilterRowValue = value; })"
+                                    Width="100%" />
+                    </FilterRowCellTemplate>
+                </DxGridDataColumn>
+                <DxGridDataColumn FieldName="@nameof(MassDataReadDto.ChangedWhen)" Caption="Changed" ReadOnly="true">
+                    <FilterRowCellTemplate Context="filter">
+                        <DxDateEdit Date="@((DateTime?)filter.FilterRowValue)"
+                                    DateChanged="@((DateTime? value) => { filter.FilterRowValue = value; })"
+                                    Width="100%" />
+                    </FilterRowCellTemplate>
+                </DxGridDataColumn>
+            </Columns>
+            <EditFormTemplate Context="editFormContext">
+                @{ SetEditContext(editFormContext.EditContext); var editModel = (MassDataEditModel)editFormContext.EditModel; SetPopupHeaderText(editModel.IsNew); }
+                <DxFormLayout ColCount="2">
+                    <DxFormLayoutItem Caption="CustomerName">
+                        <DxTextBox @bind-Text="editModel.CustomerName" Width="100%" />
+                    </DxFormLayoutItem>
+                    <DxFormLayoutItem Caption="Amount">
+                        <DxTextBox @bind-Text="editModel.AmountText" Width="100%" />
+                    </DxFormLayoutItem>
+                    <DxFormLayoutItem Caption="Category">
+                        <DxTextBox @bind-Text="editModel.Category" Width="100%" ReadOnly="@(!editModel.IsNew)" />
+                    </DxFormLayoutItem>
+                    <DxFormLayoutItem Caption="Status">
+                        <DxCheckBox @bind-Checked="editModel.StatusFlag" ReadOnly="@(!editModel.IsNew)" />
+                    </DxFormLayoutItem>
+                    @if (!editModel.IsNew)
+                    {
+                        <DxFormLayoutItem Caption="Prozedur">
+                            <DxComboBox Data="@procedureOptions"
+                                        TData="ProcedureOption"
+                                        TValue="int"
+                                        TextFieldName="Text"
+                                        ValueFieldName="Value"
+                                        @bind-Value="editModel.UpdateProcedure"
+                                        Width="100%" />
+                        </DxFormLayoutItem>
+                    }
+                    <DxFormLayoutItem ColSpanMd="12">
+                        <ValidationSummary />
+                    </DxFormLayoutItem>
+                </DxFormLayout>
+            </EditFormTemplate>
+        </DxGrid>
+
+        <div class="pager-container">
+            <DxPager PageCount="@pageCount" ActivePageIndex="@pageIndex" ActivePageIndexChanged="OnPageChanged" />
+        </div>
+    </div>
+}
+
+@code {
+    private const int PageSize = 100;
+    private List<MassDataReadDto> items = new();
+    private bool isLoading;
+    private string? errorMessage;
+    private string? infoMessage;
+    private int pageIndex;
+    private int pageCount = 1;
+    private string popupHeaderText = "Edit";
+    private EditContext? editContext;
+    private ValidationMessageStore? validationMessageStore;
+
+    private readonly List<BoolFilterOption> statusFilterOptions = new()
+    {
+        new() { Value = null, Text = "Alle" },
+        new() { Value = true, Text = "True" },
+        new() { Value = false, Text = "False" }
+    };
+
+    private readonly List<ProcedureOption> procedureOptions = new()
+    {
+        new() { Value = 0, Text = "PRMassdata_UpsertByCustomerName" }
+    };
+
+    protected override async Task OnInitializedAsync()
+    {
+        await LoadPage(0);
+    }
+
+    private async Task LoadPage(int page)
+    {
+        isLoading = true;
+        errorMessage = null;
+        try
+        {
+            var total = await Api.GetCountAsync();
+            pageCount = Math.Max(1, (int)Math.Ceiling(total / (double)PageSize));
+            pageIndex = Math.Clamp(page, 0, pageCount - 1);
+
+            var skip = pageIndex * PageSize;
+            items = await Api.GetAllAsync(skip, PageSize);
+        }
+        catch (Exception ex)
+        {
+            errorMessage = $"MassData konnten nicht geladen werden: {ex.Message}";
+        }
+        finally
+        {
+            isLoading = false;
+            StateHasChanged();
+        }
+    }
+
+    private async Task OnPageChanged(int index)
+    {
+        await LoadPage(index);
+    }
+
+    private void SetEditContext(EditContext context)
+    {
+        if (editContext == context)
+        {
+            return;
+        }
+
+        if (editContext != null)
+        {
+            editContext.OnFieldChanged -= OnEditFieldChanged;
+        }
+
+        editContext = context;
+        validationMessageStore = new ValidationMessageStore(editContext);
+        editContext.OnFieldChanged += OnEditFieldChanged;
+    }
+
+    private void OnEditFieldChanged(object? sender, FieldChangedEventArgs e)
+    {
+        if (validationMessageStore == null || editContext == null)
+        {
+            return;
+        }
+
+        if (e.FieldIdentifier.FieldName == nameof(MassDataEditModel.UpdateProcedure))
+        {
+            validationMessageStore.Clear();
+            editContext.NotifyValidationStateChanged();
+            return;
+        }
+
+        if (e.FieldIdentifier.FieldName == nameof(MassDataEditModel.CustomerName))
+        {
+            var field = new FieldIdentifier(editContext.Model, nameof(MassDataEditModel.CustomerName));
+            validationMessageStore.Clear(field);
+            editContext.NotifyValidationStateChanged();
+        }
+    }
+
+    private void SetPopupHeaderText(bool isNew)
+    {
+        popupHeaderText = isNew ? "Neu" : "Edit";
+    }
+
+    private void OnCustomizeEditModel(GridCustomizeEditModelEventArgs e)
+    {
+        if (e.IsNew)
+        {
+            e.EditModel = new MassDataEditModel { IsNew = true, UpdateProcedure = procedureOptions[0].Value };
+            SetPopupHeaderText(true);
+            return;
+        }
+
+        var item = (MassDataReadDto)e.DataItem;
+        e.EditModel = new MassDataEditModel
+        {
+            Id = item.Id,
+            CustomerName = item.CustomerName,
+            AmountText = item.Amount.ToString("0.00"),
+            Category = item.Category,
+            StatusFlag = item.StatusFlag,
+            UpdateProcedure = procedureOptions[0].Value,
+            IsNew = false,
+            OriginalCustomerName = item.CustomerName
+        };
+        SetPopupHeaderText(false);
+    }
+
+    private async Task OnEditModelSaving(GridEditModelSavingEventArgs e)
+    {
+        errorMessage = null;
+        infoMessage = null;
+
+        validationMessageStore?.Clear();
+        editContext?.NotifyValidationStateChanged();
+
+        var editModel = (MassDataEditModel)e.EditModel;
+        if (!decimal.TryParse(editModel.AmountText, out var amount))
+        {
+            AddValidationError(editModel, nameof(MassDataEditModel.AmountText), "Amount ist ungültig.");
+            e.Cancel = true;
+            return;
+        }
+
+        if (editModel.IsNew)
+        {
+            var existing = await Api.GetByCustomerNameAsync(editModel.CustomerName);
+            if (existing != null)
+            {
+                AddValidationError(editModel, nameof(MassDataEditModel.CustomerName), "Kunde existiert bereits.");
+                e.Cancel = true;
+                return;
+            }
+        }
+
+        var dto = new MassDataWriteDto
+        {
+            CustomerName = editModel.CustomerName,
+            Amount = amount,
+            Category = editModel.Category,
+            StatusFlag = editModel.StatusFlag
+        };
+
+        try
+        {
+            await Api.UpsertAsync(dto);
+            infoMessage = editModel.IsNew ? "MassData angelegt." : "MassData aktualisiert.";
+            await LoadPage(pageIndex);
+        }
+        catch (Exception ex)
+        {
+            errorMessage = $"Fehler beim Speichern: {ex.Message}";
+            e.Cancel = true;
+        }
+    }
+
+    private void AddValidationError(MassDataEditModel editModel, string fieldName, string message)
+    {
+        if (editContext == null || validationMessageStore == null)
+        {
+            return;
+        }
+
+        var field = new FieldIdentifier(editModel, fieldName);
+        validationMessageStore.Add(field, message);
+        editContext.NotifyValidationStateChanged();
+    }
+
+    private Task OnDataItemDeleting(GridDataItemDeletingEventArgs e)
+    {
+        errorMessage = null;
+        infoMessage = "Löschen ist aktuell noch nicht verfügbar.";
+        e.Cancel = true;
+        return Task.CompletedTask;
+    }
+
+    private sealed class MassDataEditModel
+    {
+        public int Id { get; set; }
+        public string CustomerName { get; set; } = string.Empty;
+        public string AmountText { get; set; } = string.Empty;
+        public string Category { get; set; } = string.Empty;
+        public bool StatusFlag { get; set; }
+        public int UpdateProcedure { get; set; }
+        public bool IsNew { get; set; }
+        public string OriginalCustomerName { get; set; } = string.Empty;
+    }
+
+    private sealed class ProcedureOption
+    {
+        public int Value { get; set; }
+        public string Text { get; set; } = string.Empty;
+    }
+
+    private sealed class BoolFilterOption
+    {
+        public bool? Value { get; set; }
+        public string Text { get; set; } = string.Empty;
+    }
+}

DbFirst.BlazorWebApp/Components/Pages/Catalogs.razor

@@ -0,0 +1,7 @@
+@page "/catalogs"
+
+<PageTitle>Catalogs</PageTitle>
+
+<h1>Catalogs</h1>
+
+<CatalogsGrid />

DbFirst.BlazorWebApp/Components/Pages/Counter.razor

@@ -0,0 +1,19 @@
+@page "/counter"
+@rendermode InteractiveServer
+
+<PageTitle>Counter</PageTitle>
+
+<h1>Counter</h1>
+
+<p role="status">Current count: @currentCount</p>
+
+<button class="btn btn-primary" @onclick="IncrementCount">Click me</button>
+
+@code {
+    private int currentCount = 0;
+
+    private void IncrementCount()
+    {
+        currentCount++;
+    }
+}

DbFirst.BlazorWebApp/Components/Pages/Dashboard.razor

@@ -0,0 +1,163 @@
+@page "/dashboard"
+@page "/dashboards/{DashboardId?}"
+@implements IAsyncDisposable
+@inject Microsoft.Extensions.Configuration.IConfiguration Configuration
+@inject NavigationManager Navigation
+@inject DashboardApiClient DashboardApi
+
+<style>
+    .dashboard-shell {
+        display: flex;
+        gap: 0;
+        min-height: 800px;
+        border: 1px solid #e6e6e6;
+        border-radius: 6px;
+        overflow: hidden;
+        background: #fff;
+    }
+    .dashboard-nav {
+        width: 220px;
+        border-right: 1px solid #e6e6e6;
+        background: #fafafa;
+    }
+    .dashboard-nav-title {
+        padding: 0.75rem 1rem 0.5rem;
+        font-size: 0.7rem;
+        text-transform: uppercase;
+        letter-spacing: 0.08em;
+        color: #6c757d;
+        font-weight: 600;
+    }
+    .dashboard-nav-link {
+        display: block;
+        padding: 0.55rem 1rem;
+        color: inherit;
+        text-decoration: none;
+    }
+    .dashboard-nav-link.active {
+        background: #e9ecef;
+        font-weight: 600;
+    }
+    .dashboard-content {
+        flex: 1;
+        min-width: 0;
+        padding: 1rem;
+    }
+</style>
+
+<PageTitle>Dashboards</PageTitle>
+
+<div class="dashboard-shell">
+    <aside class="dashboard-nav">
+        <div class="dashboard-nav-title">Dashboards</div>
+        @if (dashboards.Count == 0)
+        {
+            <div class="px-3 py-2 text-muted">Keine Dashboards vorhanden.</div>
+        }
+        else
+        {
+            @foreach (var dashboard in dashboards)
+            {
+                <NavLink class="dashboard-nav-link" href="@($"dashboards/{dashboard.Id}?mode={(IsDesigner ? "designer" : "viewer")}")">@dashboard.Name</NavLink>
+            }
+        }
+    </aside>
+    <section class="dashboard-content">
+        <div class="mb-3">
+            <DxButton RenderStyle="ButtonRenderStyle.Primary" Click="@ToggleMode">
+                @(IsDesigner ? "Zum Viewer wechseln" : "Zum Designer wechseln")
+            </DxButton>
+        </div>
+        <DxDashboard @key="DashboardKey" Endpoint="@DashboardEndpoint" InitialDashboardId="@SelectedDashboardId" WorkingMode="@CurrentMode" style="width: 100%; height: 800px;">
+        </DxDashboard>
+    </section>
+</div>
+
+@code {
+    [Parameter] public string? DashboardId { get; set; }
+    [SupplyParameterFromQuery] public string? Mode { get; set; }
+
+    private readonly List<DashboardInfoDto> dashboards = new();
+    private HubConnection? _hubConnection;
+
+    private bool IsDesigner => !string.Equals(Mode, "viewer", StringComparison.OrdinalIgnoreCase);
+    private WorkingMode CurrentMode => IsDesigner ? WorkingMode.Designer : WorkingMode.ViewerOnly;
+    private string SelectedDashboardId { get; set; } = string.Empty;
+    private string DashboardKey => $"{SelectedDashboardId}-{(IsDesigner ? "designer" : "viewer")}";
+
+    private string DashboardEndpoint => $"{Configuration["ApiBaseUrl"]?.TrimEnd('/')}/api/dashboard";
+    private string HubEndpoint => $"{Configuration["ApiBaseUrl"]?.TrimEnd('/')}/hubs/dashboards";
+
+    protected override async Task OnInitializedAsync()
+    {
+        await RefreshDashboards();
+
+        _hubConnection = new HubConnectionBuilder()
+            .WithUrl(HubEndpoint)
+            .WithAutomaticReconnect()
+            .Build();
+
+        _hubConnection.On("DashboardsChanged", async () =>
+        {
+            await RefreshDashboards();
+        });
+
+        await _hubConnection.StartAsync();
+    }
+
+    protected override async Task OnParametersSetAsync()
+    {
+        if (dashboards.Count == 0)
+        {
+            await RefreshDashboards();
+        }
+
+        var requestedId = string.IsNullOrWhiteSpace(DashboardId) || string.Equals(DashboardId, "default", StringComparison.OrdinalIgnoreCase)
+            ? null
+            : DashboardId;
+
+        var resolved = !string.IsNullOrWhiteSpace(requestedId)
+            ? dashboards.FirstOrDefault(d => string.Equals(d.Id, requestedId, StringComparison.OrdinalIgnoreCase))
+            : dashboards.FirstOrDefault(d => string.Equals(d.Id, "DefaultDashboard", StringComparison.OrdinalIgnoreCase))
+              ?? dashboards.FirstOrDefault();
+
+        if (resolved == null)
+        {
+            return;
+        }
+
+        SelectedDashboardId = resolved.Id;
+
+        if (!string.Equals(DashboardId, resolved.Id, StringComparison.OrdinalIgnoreCase))
+        {
+            Navigation.NavigateTo($"dashboards/{resolved.Id}?mode={(IsDesigner ? "designer" : "viewer")}", replace: true);
+        }
+    }
+
+    private void ToggleMode()
+    {
+        var targetMode = IsDesigner ? "viewer" : "designer";
+        Navigation.NavigateTo($"dashboards/{SelectedDashboardId}?mode={targetMode}", replace: true);
+    }
+
+    private async Task RefreshDashboards()
+    {
+        var latest = await DashboardApi.GetAllAsync();
+        if (latest.Count == dashboards.Count && latest.All(d => dashboards.Any(x => x.Id == d.Id && x.Name == d.Name)))
+        {
+            return;
+        }
+
+        dashboards.Clear();
+        dashboards.AddRange(latest);
+        await InvokeAsync(StateHasChanged);
+    }
+
+    public async ValueTask DisposeAsync()
+    {
+        if (_hubConnection != null)
+        {
+            await _hubConnection.DisposeAsync();
+        }
+    }
+}

DbFirst.BlazorWebApp/Components/Pages/Error.razor

@@ -0,0 +1,36 @@
+@page "/Error"
+@using System.Diagnostics
+
+<PageTitle>Error</PageTitle>
+
+<h1 class="text-danger">Error.</h1>
+<h2 class="text-danger">An error occurred while processing your request.</h2>
+
+@if (ShowRequestId)
+{
+    <p>
+        <strong>Request ID:</strong> <code>@RequestId</code>
+    </p>
+}
+
+<h3>Development Mode</h3>
+<p>
+    Swapping to <strong>Development</strong> environment will display more detailed information about the error that occurred.
+</p>
+<p>
+    <strong>The Development environment shouldn't be enabled for deployed applications.</strong>
+    It can result in displaying sensitive information from exceptions to end users.
+    For local debugging, enable the <strong>Development</strong> environment by setting the <strong>ASPNETCORE_ENVIRONMENT</strong> environment variable to <strong>Development</strong>
+    and restarting the app.
+</p>
+
+@code{
+    [CascadingParameter]
+    private HttpContext? HttpContext { get; set; }
+
+    private string? RequestId { get; set; }
+    private bool ShowRequestId => !string.IsNullOrEmpty(RequestId);
+
+    protected override void OnInitialized() =>
+        RequestId = Activity.Current?.Id ?? HttpContext?.TraceIdentifier;
+}

DbFirst.BlazorWebApp/Components/Pages/Home.razor

@@ -0,0 +1,7 @@
+@page "/"
+
+<PageTitle>Home</PageTitle>
+
+<h1>Hello, world!</h1>
+
+Welcome to your new app.

DbFirst.BlazorWebApp/Components/Pages/Massdata.razor

@@ -0,0 +1,7 @@
+@page "/massdata"
+
+<PageTitle>MassData</PageTitle>
+
+<h1>MassData</h1>
+
+<MassDataGrid />

DbFirst.BlazorWebApp/Components/Pages/Weather.razor

@@ -0,0 +1,64 @@
+@page "/weather"
+@attribute [StreamRendering]
+
+<PageTitle>Weather</PageTitle>
+
+<h1>Weather</h1>
+
+<p>This component demonstrates showing data.</p>
+
+@if (forecasts == null)
+{
+    <p><em>Loading...</em></p>
+}
+else
+{
+    <table class="table">
+        <thead>
+            <tr>
+                <th>Date</th>
+                <th>Temp. (C)</th>
+                <th>Temp. (F)</th>
+                <th>Summary</th>
+            </tr>
+        </thead>
+        <tbody>
+            @foreach (var forecast in forecasts)
+            {
+                <tr>
+                    <td>@forecast.Date.ToShortDateString()</td>
+                    <td>@forecast.TemperatureC</td>
+                    <td>@forecast.TemperatureF</td>
+                    <td>@forecast.Summary</td>
+                </tr>
+            }
+        </tbody>
+    </table>
+}
+
+@code {
+    private WeatherForecast[]? forecasts;
+
+    protected override async Task OnInitializedAsync()
+    {
+        // Simulate asynchronous loading to demonstrate streaming rendering
+        await Task.Delay(500);
+
+        var startDate = DateOnly.FromDateTime(DateTime.Now);
+        var summaries = new[] { "Freezing", "Bracing", "Chilly", "Cool", "Mild", "Warm", "Balmy", "Hot", "Sweltering", "Scorching" };
+        forecasts = Enumerable.Range(1, 5).Select(index => new WeatherForecast
+        {
+            Date = startDate.AddDays(index),
+            TemperatureC = Random.Shared.Next(-20, 55),
+            Summary = summaries[Random.Shared.Next(summaries.Length)]
+        }).ToArray();
+    }
+
+    private class WeatherForecast
+    {
+        public DateOnly Date { get; set; }
+        public int TemperatureC { get; set; }
+        public string? Summary { get; set; }
+        public int TemperatureF => 32 + (int)(TemperatureC / 0.5556);
+    }
+}

DbFirst.BlazorWebApp/Components/Routes.razor

@@ -0,0 +1,8 @@
+@rendermode InteractiveServer
+
+<Router AppAssembly="typeof(Program).Assembly">
+    <Found Context="routeData">
+        <RouteView RouteData="routeData" DefaultLayout="typeof(Layout.MainLayout)" />
+        <FocusOnNavigate RouteData="routeData" Selector="h1" />
+    </Found>
+</Router>

DbFirst.BlazorWebApp/Components/_Imports.razor

@@ -0,0 +1,17 @@
+@using System.Net.Http
+@using System.Net.Http.Json
+@using Microsoft.AspNetCore.Components.Forms
+@using Microsoft.AspNetCore.Components.Routing
+@using Microsoft.AspNetCore.Components.Web
+@using static Microsoft.AspNetCore.Components.Web.RenderMode
+@using Microsoft.AspNetCore.Components.Web.Virtualization
+@using Microsoft.JSInterop
+@using Microsoft.AspNetCore.SignalR.Client
+@using DbFirst.BlazorWebApp
+@using DbFirst.BlazorWebApp.Components
+@using DbFirst.BlazorWebApp.Models
+@using DbFirst.BlazorWebApp.Services
+@using DevExpress.Blazor
+@using DevExpress.DashboardBlazor
+@using DevExpress.DashboardWeb
+@using DbFirst.BlazorWebApp

DbFirst.BlazorWebApp/DbFirst.BlazorWebApp.csproj

@@ -0,0 +1,20 @@
+<Project Sdk="Microsoft.NET.Sdk.Web">
+
+  <PropertyGroup>
+    <TargetFramework>net8.0</TargetFramework>
+    <Nullable>enable</Nullable>
+    <ImplicitUsings>enable</ImplicitUsings>
+  </PropertyGroup>
+
+  <ItemGroup>
+    <PackageReference Include="DevExpress.Blazor" Version="25.2.3" />
+    <PackageReference Include="DevExpress.Blazor.Dashboard" Version="25.2.3" />
+    <PackageReference Include="DevExpress.Blazor.Themes" Version="25.2.3" />
+    <PackageReference Include="DevExpress.Blazor.Themes.Fluent" Version="25.2.3" />
+  </ItemGroup>
+  <ItemGroup>
+    <PackageReference Include="DevExpress.Blazor" Version="25.2.3" />
+    <PackageReference Include="Microsoft.AspNetCore.SignalR.Client" Version="8.0.22" />
+  </ItemGroup>
+
+</Project>

DbFirst.BlazorWebApp/Models/CatalogReadDto.cs

@@ -0,0 +1,12 @@
+namespace DbFirst.BlazorWebApp.Models;
+
+public class CatalogReadDto
+{
+    public int Guid { get; set; }
+    public string CatTitle { get; set; } = null!;
+    public string CatString { get; set; } = null!;
+    public string AddedWho { get; set; } = null!;
+    public DateTime AddedWhen { get; set; }
+    public string? ChangedWho { get; set; }
+    public DateTime? ChangedWhen { get; set; }
+}

DbFirst.BlazorWebApp/Models/CatalogWriteDto.cs

@@ -0,0 +1,8 @@
+namespace DbFirst.BlazorWebApp.Models;
+
+public class CatalogWriteDto
+{
+    public string CatTitle { get; set; } = string.Empty;
+    public string CatString { get; set; } = string.Empty;
+    public int UpdateProcedure { get; set; }
+}

DbFirst.BlazorWebApp/Models/DashboardInfoDto.cs

@@ -0,0 +1,7 @@
+namespace DbFirst.BlazorWebApp.Models;
+
+public class DashboardInfoDto
+{
+    public string Id { get; set; } = string.Empty;
+    public string Name { get; set; } = string.Empty;
+}

DbFirst.BlazorWebApp/Models/MassDataReadDto.cs

@@ -0,0 +1,12 @@
+namespace DbFirst.BlazorWebApp.Models;
+
+public class MassDataReadDto
+{
+    public int Id { get; set; }
+    public string CustomerName { get; set; } = string.Empty;
+    public decimal Amount { get; set; }
+    public string Category { get; set; } = string.Empty;
+    public bool StatusFlag { get; set; }
+    public DateTime AddedWhen { get; set; }
+    public DateTime? ChangedWhen { get; set; }
+}

DbFirst.BlazorWebApp/Models/MassDataWriteDto.cs

@@ -0,0 +1,9 @@
+namespace DbFirst.BlazorWebApp.Models;
+
+public class MassDataWriteDto
+{
+    public string CustomerName { get; set; } = string.Empty;
+    public decimal Amount { get; set; }
+    public string Category { get; set; } = string.Empty;
+    public bool StatusFlag { get; set; }
+}

DbFirst.BlazorWebApp/Program.cs

@@ -0,0 +1,54 @@
+using DbFirst.BlazorWebApp.Components;
+using DbFirst.BlazorWebApp.Services;
+using DevExpress.Blazor;
+
+var builder = WebApplication.CreateBuilder(args);
+
+// Add services to the container.
+builder.Services.AddRazorComponents()
+    .AddInteractiveServerComponents();
+
+builder.Services.AddDevExpressBlazor();
+
+var apiBaseUrl = builder.Configuration["ApiBaseUrl"];
+if (!string.IsNullOrWhiteSpace(apiBaseUrl))
+{
+    builder.Services.AddHttpClient<CatalogApiClient>(client =>
+    {
+        client.BaseAddress = new Uri(apiBaseUrl);
+    });
+    builder.Services.AddHttpClient<DashboardApiClient>(client =>
+    {
+        client.BaseAddress = new Uri(apiBaseUrl);
+    });
+    builder.Services.AddHttpClient<MassDataApiClient>(client =>
+    {
+        client.BaseAddress = new Uri(apiBaseUrl);
+    });
+}
+else
+{
+    builder.Services.AddHttpClient<CatalogApiClient>();
+    builder.Services.AddHttpClient<DashboardApiClient>();
+    builder.Services.AddHttpClient<MassDataApiClient>();
+}
+
+var app = builder.Build();
+
+// Configure the HTTP request pipeline.
+if (!app.Environment.IsDevelopment())
+{
+    app.UseExceptionHandler("/Error", createScopeForErrors: true);
+    // The default HSTS value is 30 days. You may want to change this for production scenarios, see https://aka.ms/aspnetcore-hsts.
+    app.UseHsts();
+}
+
+app.UseHttpsRedirection();
+
+app.UseStaticFiles();
+app.UseAntiforgery();
+
+app.MapRazorComponents<App>()
+    .AddInteractiveServerRenderMode();
+
+app.Run();

DbFirst.BlazorWebApp/Properties/launchSettings.json

@@ -0,0 +1,38 @@
+{
+  "$schema": "http://json.schemastore.org/launchsettings.json",
+    "iisSettings": {
+      "windowsAuthentication": false,
+      "anonymousAuthentication": true,
+      "iisExpress": {
+        "applicationUrl": "http://localhost:7440",
+        "sslPort": 44343
+      }
+    },
+    "profiles": {
+      "http": {
+        "commandName": "Project",
+        "dotnetRunMessages": true,
+        "launchBrowser": true,
+        "applicationUrl": "http://localhost:5096",
+        "environmentVariables": {
+          "ASPNETCORE_ENVIRONMENT": "Development"
+        }
+      },
+      "https": {
+        "commandName": "Project",
+        "dotnetRunMessages": true,
+        "launchBrowser": true,
+        "applicationUrl": "https://localhost:7191;http://localhost:5096",
+        "environmentVariables": {
+          "ASPNETCORE_ENVIRONMENT": "Development"
+        }
+      },
+      "IIS Express": {
+        "commandName": "IISExpress",
+        "launchBrowser": true,
+        "environmentVariables": {
+          "ASPNETCORE_ENVIRONMENT": "Development"
+        }
+      }
+    }
+  }

DbFirst.BlazorWebApp/Services/CatalogApiClient.cs

@@ -0,0 +1,136 @@
+using System.Net;
+using System.Net.Http.Json;
+using DbFirst.BlazorWebApp.Models;
+
+namespace DbFirst.BlazorWebApp.Services;
+
+public class CatalogApiClient
+{
+    private readonly HttpClient _httpClient;
+    private const string Endpoint = "api/catalogs";
+
+    public CatalogApiClient(HttpClient httpClient)
+    {
+        _httpClient = httpClient;
+    }
+
+    public async Task<List<CatalogReadDto>> GetAllAsync()
+    {
+        var result = await _httpClient.GetFromJsonAsync<List<CatalogReadDto>>(Endpoint);
+        return result ?? new List<CatalogReadDto>();
+    }
+
+    public async Task<CatalogReadDto?> GetByIdAsync(int id)
+    {
+        return await _httpClient.GetFromJsonAsync<CatalogReadDto>($"{Endpoint}/{id}");
+    }
+
+    public async Task<ApiResult<CatalogReadDto?>> CreateAsync(CatalogWriteDto dto)
+    {
+        var response = await _httpClient.PostAsJsonAsync(Endpoint, dto);
+        if (response.IsSuccessStatusCode)
+        {
+            var payload = await response.Content.ReadFromJsonAsync<CatalogReadDto>();
+            return ApiResult<CatalogReadDto?>.Ok(payload);
+        }
+
+        var error = await ReadErrorAsync(response);
+        return ApiResult<CatalogReadDto?>.Fail(error);
+    }
+
+    public async Task<ApiResult<bool>> UpdateAsync(int id, CatalogWriteDto dto)
+    {
+        var response = await _httpClient.PutAsJsonAsync($"{Endpoint}/{id}", dto);
+        if (response.IsSuccessStatusCode)
+        {
+            return ApiResult<bool>.Ok(true);
+        }
+
+        var error = await ReadErrorAsync(response);
+        return ApiResult<bool>.Fail(error);
+    }
+
+    public async Task<ApiResult<bool>> DeleteAsync(int id)
+    {
+        var response = await _httpClient.DeleteAsync($"{Endpoint}/{id}");
+        if (response.IsSuccessStatusCode)
+        {
+            return ApiResult<bool>.Ok(true);
+        }
+
+        var error = await ReadErrorAsync(response);
+        return ApiResult<bool>.Fail(error);
+    }
+
+    private static async Task<string> ReadErrorAsync(HttpResponseMessage response)
+    {
+        string? problemTitle = null;
+        string? problemDetail = null;
+
+        try
+        {
+            var problem = await response.Content.ReadFromJsonAsync<ProblemDetailsDto>();
+            if (problem != null)
+            {
+                problemTitle = problem.Title;
+                problemDetail = problem.Detail ?? problem.Type;
+            }
+        }
+        catch
+        {
+        }
+
+        var status = response.StatusCode;
+        var reason = response.ReasonPhrase;
+        var body = await response.Content.ReadAsStringAsync();
+
+        string? detail = problemDetail;
+        if (string.IsNullOrWhiteSpace(detail) && !string.IsNullOrWhiteSpace(body))
+        {
+            detail = body;
+        }
+
+        if (status == HttpStatusCode.Conflict)
+        {
+            return "Datensatz existiert bereits. Bitte wählen Sie einen anderen Titel.";
+        }
+        if (status == HttpStatusCode.BadRequest && (detail?.Contains("CatTitle cannot be changed", StringComparison.OrdinalIgnoreCase) ?? false))
+        {
+            return "Titel kann nicht geändert werden.";
+        }
+
+        return status switch
+        {
+            HttpStatusCode.BadRequest => $"Eingabe ungültig{FormatSuffix(problemTitle, detail, reason)}",
+            HttpStatusCode.NotFound => $"Nicht gefunden{FormatSuffix(problemTitle, detail, reason)}",
+            HttpStatusCode.Conflict => $"Konflikt{FormatSuffix(problemTitle, detail, reason)}",
+            HttpStatusCode.Unauthorized => $"Nicht autorisiert{FormatSuffix(problemTitle, detail, reason)}",
+            HttpStatusCode.Forbidden => $"Nicht erlaubt{FormatSuffix(problemTitle, detail, reason)}",
+            HttpStatusCode.InternalServerError => $"Serverfehler{FormatSuffix(problemTitle, detail, reason)}",
+            _ => $"Fehler {(int)status} {reason ?? string.Empty}{FormatSuffix(problemTitle, detail, reason)}"
+        };
+    }
+
+    private static string FormatSuffix(string? title, string? detail, string? reason)
+    {
+        var parts = new List<string>();
+        if (!string.IsNullOrWhiteSpace(title)) parts.Add(title);
+        if (!string.IsNullOrWhiteSpace(detail)) parts.Add(detail);
+        if (parts.Count == 0 && !string.IsNullOrWhiteSpace(reason)) parts.Add(reason);
+        if (parts.Count == 0) return string.Empty;
+        return ": " + string.Join(" | ", parts);
+    }
+}
+
+public record ApiResult<T>(bool Success, T? Value, string? Error)
+{
+    public static ApiResult<T> Ok(T? value) => new(true, value, null);
+    public static ApiResult<T> Fail(string? error) => new(false, default, error);
+}
+
+internal sealed class ProblemDetailsDto
+{
+    public string? Type { get; set; }
+    public string? Title { get; set; }
+    public string? Detail { get; set; }
+}

DbFirst.BlazorWebApp/Services/DashboardApiClient.cs

@@ -0,0 +1,21 @@
+using System.Net.Http.Json;
+using DbFirst.BlazorWebApp.Models;
+
+namespace DbFirst.BlazorWebApp.Services;
+
+public class DashboardApiClient
+{
+    private readonly HttpClient _httpClient;
+    private const string Endpoint = "api/dashboard/dashboards";
+
+    public DashboardApiClient(HttpClient httpClient)
+    {
+        _httpClient = httpClient;
+    }
+
+    public async Task<List<DashboardInfoDto>> GetAllAsync()
+    {
+        var result = await _httpClient.GetFromJsonAsync<List<DashboardInfoDto>>(Endpoint);
+        return result ?? new List<DashboardInfoDto>();
+    }
+}

DbFirst.BlazorWebApp/Services/MassDataApiClient.cs

@@ -0,0 +1,52 @@
+using System.Net.Http.Json;
+using DbFirst.BlazorWebApp.Models;
+
+namespace DbFirst.BlazorWebApp.Services;
+
+public class MassDataApiClient
+{
+    private readonly HttpClient _httpClient;
+    private const string Endpoint = "api/massdata";
+
+    public MassDataApiClient(HttpClient httpClient)
+    {
+        _httpClient = httpClient;
+    }
+
+    public async Task<int> GetCountAsync()
+    {
+        var result = await _httpClient.GetFromJsonAsync<int?>("api/massdata/count");
+        return result ?? 0;
+    }
+
+    public async Task<List<MassDataReadDto>> GetAllAsync(int skip, int take)
+    {
+        var result = await _httpClient.GetFromJsonAsync<List<MassDataReadDto>>($"{Endpoint}?skip={skip}&take={take}");
+        return result ?? new List<MassDataReadDto>();
+    }
+
+    public async Task<MassDataReadDto> UpsertAsync(MassDataWriteDto dto)
+    {
+        var response = await _httpClient.PostAsJsonAsync($"{Endpoint}/upsert", dto);
+        response.EnsureSuccessStatusCode();
+        var payload = await response.Content.ReadFromJsonAsync<MassDataReadDto>();
+        return payload ?? new MassDataReadDto();
+    }
+
+    public async Task<MassDataReadDto?> GetByCustomerNameAsync(string customerName)
+    {
+        if (string.IsNullOrWhiteSpace(customerName))
+        {
+            return null;
+        }
+
+        var response = await _httpClient.GetAsync($"{Endpoint}/{Uri.EscapeDataString(customerName)}");
+        if (response.StatusCode == System.Net.HttpStatusCode.NotFound)
+        {
+            return null;
+        }
+
+        response.EnsureSuccessStatusCode();
+        return await response.Content.ReadFromJsonAsync<MassDataReadDto>();
+    }
+}

DbFirst.BlazorWebApp/appsettings.Development.json

@@ -0,0 +1,9 @@
+{
+  "Logging": {
+    "LogLevel": {
+      "Default": "Information",
+      "Microsoft.AspNetCore": "Warning"
+    }
+  },
+  "ApiBaseUrl": "https://localhost:7204/"
+}

DbFirst.BlazorWebApp/appsettings.json

@@ -0,0 +1,10 @@
+{
+  "Logging": {
+    "LogLevel": {
+      "Default": "Information",
+      "Microsoft.AspNetCore": "Warning"
+    }
+  },
+  "ApiBaseUrl": "https://localhost:7204/",
+  "AllowedHosts": "*"
+}

DbFirst.BlazorWebApp/wwwroot/app.css

@@ -0,0 +1,51 @@
+html, body {
+    font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
+}
+
+a, .btn-link {
+    color: #006bb7;
+}
+
+.btn-primary {
+    color: #fff;
+    background-color: #1b6ec2;
+    border-color: #1861ac;
+}
+
+.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
+  box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
+}
+
+.content {
+    padding-top: 1.1rem;
+}
+
+h1:focus {
+    outline: none;
+}
+
+.valid.modified:not([type=checkbox]) {
+    outline: 1px solid #26b050;
+}
+
+.invalid {
+    outline: 1px solid #e50000;
+}
+
+.validation-message {
+    color: #e50000;
+}
+
+.blazor-error-boundary {
+    background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTYiIGhlaWdodD0iNDkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIG92ZXJmbG93PSJoaWRkZW4iPjxkZWZzPjxjbGlwUGF0aCBpZD0iY2xpcDAiPjxyZWN0IHg9IjIzNSIgeT0iNTEiIHdpZHRoPSI1NiIgaGVpZ2h0PSI0OSIvPjwvY2xpcFBhdGg+PC9kZWZzPjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMCkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0yMzUgLTUxKSI+PHBhdGggZD0iTTI2My41MDYgNTFDMjY0LjcxNyA1MSAyNjUuODEzIDUxLjQ4MzcgMjY2LjYwNiA1Mi4yNjU4TDI2Ny4wNTIgNTIuNzk4NyAyNjcuNTM5IDUzLjYyODMgMjkwLjE4NSA5Mi4xODMxIDI5MC41NDUgOTIuNzk1IDI5MC42NTYgOTIuOTk2QzI5MC44NzcgOTMuNTEzIDI5MSA5NC4wODE1IDI5MSA5NC42NzgyIDI5MSA5Ny4wNjUxIDI4OS4wMzggOTkgMjg2LjYxNyA5OUwyNDAuMzgzIDk5QzIzNy45NjMgOTkgMjM2IDk3LjA2NTEgMjM2IDk0LjY3ODIgMjM2IDk0LjM3OTkgMjM2LjAzMSA5NC4wODg2IDIzNi4wODkgOTMuODA3MkwyMzYuMzM4IDkzLjAxNjIgMjM2Ljg1OCA5Mi4xMzE0IDI1OS40NzMgNTMuNjI5NCAyNTkuOTYxIDUyLjc5ODUgMjYwLjQwNyA1Mi4yNjU4QzI2MS4yIDUxLjQ4MzcgMjYyLjI5NiA1MSAyNjMuNTA2IDUxWk0yNjMuNTg2IDY2LjAxODNDMjYwLjczNyA2Ni4wMTgzIDI1OS4zMTMgNjcuMTI0NSAyNTkuMzEzIDY5LjMzNyAyNTkuMzEzIDY5LjYxMDIgMjU5LjMzMiA2OS44NjA4IDI1OS4zNzEgNzAuMDg4N0wyNjEuNzk1IDg0LjAxNjEgMjY1LjM4IDg0LjAxNjEgMjY3LjgyMSA2OS43NDc1QzI2Ny44NiA2OS43MzA5IDI2Ny44NzkgNjkuNTg3NyAyNjcuODc5IDY5LjMxNzkgMjY3Ljg3OSA2Ny4xMTgyIDI2Ni40NDggNjYuMDE4MyAyNjMuNTg2IDY2LjAxODNaTTI2My41NzYgODYuMDU0N0MyNjEuMDQ5IDg2LjA1NDcgMjU5Ljc4NiA4Ny4zMDA1IDI1OS43ODYgODkuNzkyMSAyNTkuNzg2IDkyLjI4MzcgMjYxLjA0OSA5My41Mjk1IDI2My41NzYgOTMuNTI5NSAyNjYuMTE2IDkzLjUyOTUgMjY3LjM4NyA5Mi4yODM3IDI2Ny4zODcgODkuNzkyMSAyNjcuMzg3IDg3LjMwMDUgMjY2LjExNiA4Ni4wNTQ3IDI2My41NzYgODYuMDU0N1oiIGZpbGw9IiNGRkU1MDAiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvZz48L3N2Zz4=) no-repeat 1rem/1.8rem, #b32121;
+    padding: 1rem 1rem 1rem 3.7rem;
+    color: white;
+}
+
+    .blazor-error-boundary::after {
+        content: "An error has occurred."
+    }
+
+.darker-border-checkbox.form-check-input {
+    border-color: #929292;
+}

DbFirst.Domain/Entities/Massdata.cs

@@ -0,0 +1,12 @@
+namespace DbFirst.Domain.Entities;
+
+public class Massdata
+{
+    public int Id { get; set; }
+    public string CustomerName { get; set; } = string.Empty;
+    public decimal Amount { get; set; }
+    public string Category { get; set; } = string.Empty;
+    public bool StatusFlag { get; set; }
+    public DateTime AddedWhen { get; set; }
+    public DateTime? ChangedWhen { get; set; }
+}

DbFirst.Infrastructure/DependencyInjection.cs

@@ -11,6 +11,10 @@ public static class DependencyInjection
         services.Configure<TableConfigurations>(configuration.GetSection("TableConfigurations"));
         services.AddDbContext<ApplicationDbContext>(options =>
             options.UseSqlServer(configuration.GetConnectionString("DefaultConnection")));
+
+        services.AddDbContext<MassDataDbContext>(options =>
+            options.UseSqlServer(configuration.GetConnectionString("MassDataConnection")));
+
         return services;
     }
 }

DbFirst.Infrastructure/MassDataDbContext.cs

@@ -0,0 +1,44 @@
+using DbFirst.Domain.Entities;
+using Microsoft.EntityFrameworkCore;
+
+namespace DbFirst.Infrastructure;
+
+public class MassDataDbContext : DbContext
+{
+    public MassDataDbContext(DbContextOptions<MassDataDbContext> options)
+        : base(options)
+    {
+    }
+
+    public virtual DbSet<Massdata> Massdata { get; set; }
+
+    protected override void OnModelCreating(ModelBuilder modelBuilder)
+    {
+        modelBuilder.Entity<Massdata>(entity =>
+        {
+            entity.HasKey(e => e.Id);
+            entity.ToTable("MASSDATA");
+
+            entity.Property(e => e.Id).HasColumnName("ID");
+            entity.Property(e => e.CustomerName)
+                .HasMaxLength(200)
+                .IsUnicode(false)
+                .HasColumnName("CustomerName");
+            entity.Property(e => e.Amount)
+                .HasColumnType("decimal(12,2)")
+                .HasColumnName("Amount");
+            entity.Property(e => e.Category)
+                .HasMaxLength(100)
+                .IsUnicode(false)
+                .HasColumnName("Category");
+            entity.Property(e => e.StatusFlag)
+                .HasColumnName("StatusFlag");
+            entity.Property(e => e.AddedWhen)
+                .HasColumnType("datetime")
+                .HasColumnName("ADDED_WHEN");
+            entity.Property(e => e.ChangedWhen)
+                .HasColumnType("datetime")
+                .HasColumnName("CHANGED_WHEN");
+        });
+    }
+}

DbFirst.Infrastructure/Repositories/MassDataRepository.cs

@@ -0,0 +1,71 @@
+using System.Data;
+using DbFirst.Application.Repositories;
+using DbFirst.Domain.Entities;
+using Microsoft.Data.SqlClient;
+using Microsoft.EntityFrameworkCore;
+
+namespace DbFirst.Infrastructure.Repositories;
+
+public class MassDataRepository : IMassDataRepository
+{
+    private readonly MassDataDbContext _db;
+
+    public MassDataRepository(MassDataDbContext db)
+    {
+        _db = db;
+    }
+
+    public async Task<int> GetCountAsync(CancellationToken cancellationToken = default)
+    {
+        return await _db.Massdata.AsNoTracking().CountAsync(cancellationToken);
+    }
+
+    public async Task<List<Massdata>> GetAllAsync(CancellationToken cancellationToken = default)
+    {
+        return await _db.Massdata.AsNoTracking().ToListAsync(cancellationToken);
+    }
+
+    public async Task<Massdata?> GetByCustomerNameAsync(string customerName, CancellationToken cancellationToken = default)
+    {
+        return await _db.Massdata.AsNoTracking()
+            .FirstOrDefaultAsync(x => x.CustomerName == customerName, cancellationToken);
+    }
+
+    public async Task<List<Massdata>> GetAllAsync(int? skip = null, int? take = null, CancellationToken cancellationToken = default)
+    {
+        var query = _db.Massdata.AsNoTracking().OrderBy(x => x.Id).AsQueryable();
+
+        if (skip.HasValue)
+        {
+            query = query.Skip(skip.Value);
+        }
+
+        if (take.HasValue)
+        {
+            query = query.Take(take.Value);
+        }
+
+        return await query.ToListAsync(cancellationToken);
+    }
+
+    public async Task<Massdata> UpsertByCustomerNameAsync(string customerName, decimal amount, bool statusFlag, string category, CancellationToken cancellationToken = default)
+    {
+        var customerParam = new SqlParameter("@CustomerName", SqlDbType.VarChar, 200) { Value = customerName };
+        var amountParam = new SqlParameter("@Amount", SqlDbType.Decimal) { Value = amount, Precision = 12, Scale = 2 };
+        var statusParam = new SqlParameter("@StatusFlag", SqlDbType.Bit) { Value = statusFlag };
+        var categoryParam = new SqlParameter("@Category", SqlDbType.VarChar, 100) { Value = category };
+
+        await _db.Database.ExecuteSqlRawAsync(
+            "EXEC dbo.PRMassdata_UpsertByCustomerName @CustomerName, @Amount, @StatusFlag, @Category",
+            parameters: new[] { customerParam, amountParam, statusParam, categoryParam },
+            cancellationToken: cancellationToken);
+
+        var updated = await GetByCustomerNameAsync(customerName, cancellationToken);
+        if (updated == null)
+        {
+            throw new InvalidOperationException("Upsert completed but record could not be loaded.");
+        }
+
+        return updated;
+    }
+}

DbFirst.sln

@@ -13,6 +13,8 @@ Project("{FAE04EC0-301F-11D3-BF4B-00C04F79EFBC}") = "DbFirst.Domain", "DbFirst.D
 EndProject
 Project("{FAE04EC0-301F-11D3-BF4B-00C04F79EFBC}") = "DbFirst.BlazorWasm", "DbFirst.BlazorWasm\DbFirst.BlazorWasm.csproj", "{666BE786-6D04-4224-9948-FF13597481A0}"
 EndProject
+Project("{FAE04EC0-301F-11D3-BF4B-00C04F79EFBC}") = "DbFirst.BlazorWebApp", "DbFirst.BlazorWebApp\DbFirst.BlazorWebApp.csproj", "{FF1D77C4-A13D-43E0-BCE1-C18C01F1767C}"
+EndProject
 Global
 	GlobalSection(SolutionConfigurationPlatforms) = preSolution
 		Debug|Any CPU = Debug|Any CPU
@@ -83,6 +85,18 @@ Global
 		{666BE786-6D04-4224-9948-FF13597481A0}.Release|x64.Build.0 = Release|Any CPU
 		{666BE786-6D04-4224-9948-FF13597481A0}.Release|x86.ActiveCfg = Release|Any CPU
 		{666BE786-6D04-4224-9948-FF13597481A0}.Release|x86.Build.0 = Release|Any CPU
+		{FF1D77C4-A13D-43E0-BCE1-C18C01F1767C}.Debug|Any CPU.ActiveCfg = Debug|Any CPU
+		{FF1D77C4-A13D-43E0-BCE1-C18C01F1767C}.Debug|Any CPU.Build.0 = Debug|Any CPU
+		{FF1D77C4-A13D-43E0-BCE1-C18C01F1767C}.Debug|x64.ActiveCfg = Debug|Any CPU
+		{FF1D77C4-A13D-43E0-BCE1-C18C01F1767C}.Debug|x64.Build.0 = Debug|Any CPU
+		{FF1D77C4-A13D-43E0-BCE1-C18C01F1767C}.Debug|x86.ActiveCfg = Debug|Any CPU
+		{FF1D77C4-A13D-43E0-BCE1-C18C01F1767C}.Debug|x86.Build.0 = Debug|Any CPU
+		{FF1D77C4-A13D-43E0-BCE1-C18C01F1767C}.Release|Any CPU.ActiveCfg = Release|Any CPU
+		{FF1D77C4-A13D-43E0-BCE1-C18C01F1767C}.Release|Any CPU.Build.0 = Release|Any CPU
+		{FF1D77C4-A13D-43E0-BCE1-C18C01F1767C}.Release|x64.ActiveCfg = Release|Any CPU
+		{FF1D77C4-A13D-43E0-BCE1-C18C01F1767C}.Release|x64.Build.0 = Release|Any CPU
+		{FF1D77C4-A13D-43E0-BCE1-C18C01F1767C}.Release|x86.ActiveCfg = Release|Any CPU
+		{FF1D77C4-A13D-43E0-BCE1-C18C01F1767C}.Release|x86.Build.0 = Release|Any CPU
 	EndGlobalSection
 	GlobalSection(SolutionProperties) = preSolution
 		HideSolutionNode = FALSE