Skip to content

refactor(samples): consolidate shared components across Blazor samples #81

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
mckaragoz merged 8 commits into from
Oct 16, 2026
Merged

refactor(samples): consolidate shared components across Blazor samples #81

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
8 commits
Select commit Hold shift + click to select a range
3bbbb88
Add Shared Sample Project and Remove Sample Code Duplication
mckaragoz Oct 14, 2026
0860c21
Brand and Common Folders
mckaragoz Oct 14, 2026
b0462fa
DarkModeManager Duplication
mckaragoz Oct 14, 2026
089a8cb
Pages and Layouts
mckaragoz Oct 14, 2026
0fe205c
Interactive Wasm Setup Fix & Docs Sample Page Description
mckaragoz Oct 14, 2026
b22b6bf
CSS & Layout
mckaragoz Oct 15, 2026
f90dbc2
Shared.Hub Project
mckaragoz Oct 16, 2026
41a052e
Cleanup
mckaragoz Oct 16, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 2 additions & 0 deletions UltimateAuth.slnx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -13,6 +13,8 @@
<Project Path="samples/blazor-server/CodeBeam.UltimateAuth.Sample.BlazorServer/CodeBeam.UltimateAuth.Sample.BlazorServer.csproj" />
<Project Path="samples/blazor-standalone-wasm/CodeBeam.UltimateAuth.Sample.BlazorStandaloneWasm/CodeBeam.UltimateAuth.Sample.BlazorStandaloneWasm.csproj" Id="27bd3c4d-65a9-4c70-a6c9-4178b1897730" />
<Project Path="samples/CodeBeam.UltimateAuth.Sample.Seed/CodeBeam.UltimateAuth.Sample.Seed.csproj" Id="c79b227b-409e-439d-97df-8979a3dc1a60" />
<Project Path="samples/CodeBeam.UltimateAuth.Sample.Shared.Hub/CodeBeam.UltimateAuth.Sample.Shared.Hub.csproj" Id="74bde9eb-9997-479e-846d-ed205195d3c3" />
<Project Path="samples/CodeBeam.UltimateAuth.Sample.Shared/CodeBeam.UltimateAuth.Sample.Shared.csproj" Id="9edb3d33-3814-4c95-88b0-488c5b4fa25c" />
<Project Path="samples/int-wasm/CodeBeam.UAuth.Sample.IntWasm/CodeBeam.UAuth.Sample.IntWasm.Client/CodeBeam.UAuth.Sample.IntWasm.Client.csproj" Id="f17355ac-c53c-44e8-b372-a258493bf950" />
<Project Path="samples/int-wasm/CodeBeam.UAuth.Sample.IntWasm/CodeBeam.UAuth.Sample.IntWasm/CodeBeam.UAuth.Sample.IntWasm.csproj" Id="65386675-4cf7-4745-b4d7-544b6404e0c3" />
<Project Path="samples/resource-api/CodeBeam.UltimateAuth.Sample.ResourceApi.EfCore/CodeBeam.UltimateAuth.Sample.ResourceApi.EfCore.csproj" Id="ac247836-455a-4a71-9a52-73587c2393f3" />
Expand Down
8 changes: 4 additions & 4 deletions ...Wasm/CodeBeam.UltimateAuth.Docs.Wasm.Client/CodeBeam.UltimateAuth.Docs.Wasm.Client.csproj
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,10 +11,10 @@
</PropertyGroup>

<ItemGroup>
<PackageReference Include="CodeBeam.MudBlazor.Extensions" Version="9.0.4" />
<PackageReference Include="CodeBeam.MudBlazor.Extensions.Code" Version="9.0.1" />
<PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="10.0.5" />
<PackageReference Include="MudBlazor" Version="9.3.0" />
<PackageReference Include="CodeBeam.MudBlazor.Extensions" Version="9.2.0" />
<PackageReference Include="CodeBeam.MudBlazor.Extensions.Code" Version="9.1.1" />
<PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="10.0.13" />
<PackageReference Include="MudBlazor" Version="9.11.0" />
</ItemGroup>

<Target Name="BuildDocs" BeforeTargets="Build">
Expand Down
131 changes: 113 additions & 18 deletions ...odeBeam.UltimateAuth.Docs.Wasm/CodeBeam.UltimateAuth.Docs.Wasm.Client/Pages/Samples.razor
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@
<MudStack Spacing="4" Class="text-center">
<MudText Typo="Typo.h3"><b>Samples</b></MudText>
<MudText Typo="Typo.subtitle2">Explore working examples and see UltimateAuth in action.</MudText>
<MudText Typo="Typo.caption">Interactive online samples are coming soon.</MudText>
<MudText Typo="Typo.caption">Identity Lab (hosted live demo) is coming soon.</MudText>

<MudDivider />

Expand All @@ -15,6 +15,14 @@
</MudText>

<MudGrid>
<MudItem xs="12">
<MudPaper Class="pa-4 d-flex flex-column align-center justify-center" Style="background: transparent; min-height: 200px" Outlined="true" Elevation="0">
<MudText Typo="Typo.h6">Sample.Shared</MudText>
<MudText Typo="Typo.subtitle2">Shared component designs across all modern .NET platforms.</MudText>
<MudButton Class="mt-4" Variant="Variant.Filled" Href="https://github.com/CodeBeamOrg/UltimateAuth/tree/dev/samples/shared" Target="_blank" StartIcon="@Icons.Material.Outlined.OpenInNew">View Source Code on GitHub</MudButton>
</MudPaper>
</MudItem>

<MudItem xs="12" md="6">
<MudPaper Class="pa-4 d-flex flex-column align-center justify-center" Style="background: transparent; min-height: 200px" Outlined="true" Elevation="0">
<MudText Typo="Typo.h6">Blazor Server (EF Core)</MudText>
Expand All @@ -31,17 +39,33 @@
</MudPaper>
</MudItem>

<MudItem xs="12">
<MudItem xs="12" md="6">
<MudPaper Class="pa-4 d-flex flex-column align-center justify-center" Style="background: transparent; min-height: 200px" Outlined="true" Elevation="0">
<MudText Typo="Typo.h6">Blazor WASM (Standalone)</MudText>
<MudText Typo="Typo.h6">Blazor Standalone WASM</MudText>
<MudText Typo="Typo.subtitle2">Client-side sample using Hybrid authentication model.</MudText>
<MudButton Class="mt-4" Variant="Variant.Filled" Href="https://github.com/CodeBeamOrg/UltimateAuth/tree/dev/samples/blazor-standalone-wasm/CodeBeam.UltimateAuth.Sample.BlazorStandaloneWasm" Target="_blank" StartIcon="@Icons.Material.Outlined.OpenInNew">View Source Code on GitHub</MudButton>
</MudPaper>
</MudItem>

<MudItem xs="12" md="6">
<MudPaper Class="pa-4 d-flex flex-column align-center justify-center" Style="background: transparent; min-height: 200px" Outlined="true" Elevation="0">
<MudText Typo="Typo.h6">UAuthHub</MudText>
<MudText Typo="Typo.h6">Blazor Interactive WASM</MudText>
<MudText Typo="Typo.subtitle2">Client-side interactive render mode sample using Hybrid authentication model.</MudText>
<MudButton Class="mt-4" Variant="Variant.Filled" Href="https://github.com/CodeBeamOrg/UltimateAuth/tree/dev/samples/int-wasm/CodeBeam.UAuth.Sample.IntWasm" Target="_blank" StartIcon="@Icons.Material.Outlined.OpenInNew">View Source Code on GitHub</MudButton>
</MudPaper>
</MudItem>

<MudItem xs="12" md="6">
<MudPaper Class="pa-4 d-flex flex-column align-center justify-center" Style="background: transparent; min-height: 200px" Outlined="true" Elevation="0">
<MudText Typo="Typo.h6">UAuthHub (EF Core)</MudText>
<MudText Typo="Typo.subtitle2">Complete Auth server with UI, working together with WASM client and EF Core.</MudText>
<MudButton Class="mt-4" Variant="Variant.Filled" Href="https://github.com/CodeBeamOrg/UltimateAuth/tree/dev/samples/UAuthHub/CodeBeam.UltimateAuth.Sample.UAuthHub.EFCore" Target="_blank" StartIcon="@Icons.Material.Outlined.OpenInNew">View Source Code on GitHub</MudButton>
</MudPaper>
</MudItem>

<MudItem xs="12" md="6">
<MudPaper Class="pa-4 d-flex flex-column align-center justify-center" Style="background: transparent; min-height: 200px" Outlined="true" Elevation="0">
<MudText Typo="Typo.h6">UAuthHub (InMemory)</MudText>
<MudText Typo="Typo.subtitle2">Complete Auth server with UI, working together with WASM client.</MudText>
<MudButton Class="mt-4" Variant="Variant.Filled" Href="https://github.com/CodeBeamOrg/UltimateAuth/tree/dev/samples/UAuthHub/CodeBeam.UltimateAuth.Sample.UAuthHub" Target="_blank" StartIcon="@Icons.Material.Outlined.OpenInNew">View Source Code on GitHub</MudButton>
</MudPaper>
Expand All @@ -54,20 +78,91 @@
<MudButton Class="mt-4" Variant="Variant.Filled" Href="https://github.com/CodeBeamOrg/UltimateAuth/tree/dev/samples/resource-api/CodeBeam.UltimateAuth.Sample.ResourceApi" Target="_blank" StartIcon="@Icons.Material.Outlined.OpenInNew">View Source Code on GitHub</MudButton>
</MudPaper>
</MudItem>
</MudGrid>

<MudAlert Severity="Severity.Info" Class="mt-6" ContentAlignment="HorizontalAlignment.Center">
<b>WASM Sample Setup:</b><br />
Start the following projects together:<br />
(1) UAuthHub<br />
(2) ResourceApi<br />
(3) BlazorStandaloneWasm<br />
After opening the solution, configure multiple startup projects in Visual Studio.
</MudAlert>

<MudAlert Severity="Severity.Info" Class="my-6">
Each sample refreshes (clear + seed) it's data on each restart. When you close application it will be reset.
</MudAlert>
</MudGrid>


<MudDivider Class="my-6" />

<MudStack Spacing="3" Class="text-start">

<MudText Typo="Typo.h5" Align="Align.Center">
<b>Running the Samples</b>
</MudText>

<MudText Typo="Typo.body2" Align="Align.Center">
The samples are preconfigured with different hosting and storage setups.
Follow the project combinations below to run them locally.
</MudText>

<MudPaper Outlined="true" Elevation="0" Class="pa-4">
<MudStack Spacing="2">
<MudStack Row="true" AlignItems="AlignItems.Center" Justify="Justify.SpaceBetween">
<MudText Typo="Typo.h6">Blazor Server</MudText>
<MudChip T="string" Color="Color.Success" Variant="Variant.Outlined" Size="Size.Small">Standalone</MudChip>
</MudStack>

<MudText Typo="Typo.body2">
Run either Blazor Server (InMemory) or Blazor Server (EF Core) independently.
No additional projects are required.
</MudText>
</MudStack>
</MudPaper>

<MudPaper Outlined="true" Elevation="0" Class="pa-4">
<MudStack Spacing="2">
<MudStack Row="true"AlignItems="AlignItems.Center" Justify="Justify.SpaceBetween">
<MudText Typo="Typo.h6">Blazor Standalone WASM</MudText>
<MudChip T="string" Variant="Variant.Outlined" Size="Size.Small">3 Projects</MudChip>
</MudStack>

<MudText Typo="Typo.body2">Start these projects together:</MudText>

<MudStack Spacing="1" Class="pl-3">
<MudText Typo="Typo.body2">1. UAuthHub</MudText>
<MudText Typo="Typo.body2">2. ResourceApi</MudText>
<MudText Typo="Typo.body2">3. BlazorStandaloneWasm</MudText>
</MudStack>

<MudText Typo="Typo.caption" Color="Color.Info">Preconfigured with InMemory storage.</MudText>
</MudStack>
</MudPaper>

<MudPaper Outlined="true" Elevation="0" Class="pa-4">
<MudStack Spacing="2">
<MudStack Row="true" AlignItems="AlignItems.Center" Justify="Justify.SpaceBetween">
<MudText Typo="Typo.h6">Blazor Interactive WASM</MudText>
<MudChip T="string" Variant="Variant.Outlined" Size="Size.Small">3 Projects</MudChip>
</MudStack>

<MudText Typo="Typo.body2">Start these projects together:</MudText>

<MudStack Spacing="1" Class="pl-3">
<MudText Typo="Typo.body2">1. UAuthHub EF Core</MudText>
<MudText Typo="Typo.body2">2. Resource API EF Core</MudText>
<MudText Typo="Typo.body2">3. Blazor Interactive WASM</MudText>
</MudStack>

<MudText Typo="Typo.caption" Color="Color.Info">Preconfigured with EF Core storage.</MudText>
</MudStack>
</MudPaper>

<MudAlert Severity="Severity.Info" Variant="Variant.Text">
<b>Storage flexibility:</b>
These are sample configurations, not framework limitations.
Both WASM hosting models can use InMemory or EF Core backends.
The combinations above are simply the preconfigured examples provided in this repository.
</MudAlert>

<MudText Typo="Typo.body2" Align="Align.Center">
In Visual Studio, open <b>Configure Startup Projects</b>, select <b>Multiple startup projects</b>, and set the required projects to <b>Start</b>.
</MudText>

<MudAlert Severity="Severity.Info" Variant="Variant.Text">
<b>Sample Data:</b>
Sample data is reset and seeded again on each restart in the provided demo configurations.
</MudAlert>
</MudStack>

</MudStack>
</MudContainer>
</MudPage>
2 changes: 1 addition & 1 deletion ...mateAuth.Docs.Wasm/CodeBeam.UltimateAuth.Docs.Wasm/CodeBeam.UltimateAuth.Docs.Wasm.csproj
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@

<ItemGroup>
<ProjectReference Include="..\CodeBeam.UltimateAuth.Docs.Wasm.Client\CodeBeam.UltimateAuth.Docs.Wasm.Client.csproj" />
<PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.Server" Version="10.0.5" />
<PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.Server" Version="10.0.13" />
</ItemGroup>

</Project>
23 changes: 23 additions & 0 deletions ...es/CodeBeam.UltimateAuth.Sample.Shared.Hub/CodeBeam.UltimateAuth.Sample.Shared.Hub.csproj
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,23 @@
<Project Sdk="Microsoft.NET.Sdk.Razor">

<PropertyGroup>
<TargetFramework>net10.0</TargetFramework>
<Nullable>enable</Nullable>
<ImplicitUsings>enable</ImplicitUsings>
</PropertyGroup>


<ItemGroup>
<SupportedPlatform Include="browser" />
</ItemGroup>

<ItemGroup>
<PackageReference Include="Microsoft.AspNetCore.Components.Web" Version="10.0.13" />
</ItemGroup>

<ItemGroup>
<ProjectReference Include="..\..\src\CodeBeam.UltimateAuth.Server\CodeBeam.UltimateAuth.Server.csproj" />
<ProjectReference Include="..\CodeBeam.UltimateAuth.Sample.Shared\CodeBeam.UltimateAuth.Sample.Shared.csproj" />
</ItemGroup>

</Project>
92 changes: 92 additions & 0 deletions samples/CodeBeam.UltimateAuth.Sample.Shared.Hub/Components/Page/SampleHubHome.razor
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,92 @@
@inherits UAuthHubPageBase
@implements IDisposable

@inject IUAuthClient UAuthClient
@inject IAuthStore AuthStore
@inject IHubFlowService HubFlowService
@inject IPkceService PkceService
@inject IHubCredentialResolver HubCredentialResolver
@inject IClientStorage BrowserStorage
@inject ISnackbar Snackbar
@inject IUAuthClientProductInfoProvider ClientProductInfoProvider
@inject IDeviceIdProvider DeviceIdProvider
@inject IDialogService DialogService
@inject IOptions<UAuthClientOptions> Options

<MudPage FullScreen="FullScreen.FullWithoutAppbar" Column="1" Row="1">
<MudContainer Class="d-flex align-center justify-center" MaxWidth="MaxWidth.Medium" Gutters="false">
<MudGrid Spacing="0">
<MudItem Class="order-1 order-sm-0" xs="12" sm="6">
<MudPaper Class="mud-theme-secondary uauth-login-paper pa-8 d-flex flex-column align-center justify-center" Elevation="3">
<MudStack Class="my-4">
<div class="uauth-brand-glow uauth-logo-slide d-flex justify-center">
<UAuthLogo Size="90" ShieldColor="#f6f5ae" KeyColor="var(--mud-palette-secondary)" />
</div>
<MudText Style="font-weight: 700" Typo="Typo.h4" Align="Align.Center">UAuthHub</MudText>
<MudText Align="Align.Center">The centralized AuthServer for your application.</MudText>
</MudStack>

<MudDivider />

<MudStack Class="mt-4" Wrap="Wrap.Wrap" Spacing="0">
<MudText Typo="Typo.subtitle2" Align="Align.Center"><b>@_productInfo?.ProductName</b> v @_productInfo?.Version</MudText>
<MudText Typo="Typo.subtitle2" Align="Align.Center">Client Profile: @_productInfo?.ClientProfile.ToString()</MudText>
<MudText Typo="Typo.subtitle2" Align="Align.Center">@_productInfo?.FrameworkDescription</MudText>
</MudStack>
</MudPaper>
</MudItem>

<MudItem Class="order-0 order-sm-1" xs="12" sm="6">
<MudPaper Class="uauth-login-paper pa-8" Elevation="3">
<UAuthLoginForm @ref="_loginForm" Identifier="@_username" Secret="@_password" LoginType="UAuthLoginType.Pkce" SubmitMode="UAuthSubmitMode.TryAndCommit" OnTryResult="@HandleLoginResult">
<MudStack Class="mud-width-full">
<MudStack Row="true" AlignItems="AlignItems.Center">
<UAuthLogo Size="48" ShieldColor="var(--mud-palette-primary)" KeyColor="white" />
<MudText Typo="Typo.h5">
<MudText Style="font-weight: 700" Inline="true" Typo="Typo.h5" Color="Color.Primary">Sign <MudText Inline="true" Style="font-weight: 700" Typo="Typo.h5" Color="Color.Secondary">In</MudText></MudText>
</MudText>
</MudStack>
<MudTextField @bind-Value="@_username" Variant="Variant.Outlined" Label="Username" Required="true" Immediate="true" HelperText="@(_remainingAttempts != null ? $"Remaining Attempts: {_remainingAttempts}" : null)" />
<MudPasswordField @bind-Value="@_password" Variant="Variant.Outlined" Label="Password" Required="true" Immediate="true" />
<MudButton Variant="Variant.Filled" Color="Color.Primary" Disabled="@_isLocked" ButtonType="ButtonType.Submit">Login</MudButton>
@if (_isLocked)
{
<MudAlert NoIcon="true" Severity="Severity.Error" Variant="Variant.Filled">
<MudStack Row="true" AlignItems="AlignItems.Center" Justify="Justify.SpaceBetween">
<MudStack Spacing="0">
<MudText Typo="Typo.subtitle2">Your account is locked.</MudText>
<MudText Typo="Typo.subtitle2">Try again in </MudText>
</MudStack>
<MudProgressCircular Class="mud-theme-error" Value="@_progressPercent" Max="100" Size="Size.Large">
@_remaining.Minutes.ToString("00"):@_remaining.Seconds.ToString("00")
</MudProgressCircular>
</MudStack>
</MudAlert>
}
</MudStack>
</UAuthLoginForm>
<MudAlert Severity="Severity.Info" Variant="Variant.Text" Dense="true">
Default sample users:
<b>admin/admin</b> (Admin),
<b>user/user</b> (Standard User)
</MudAlert>

<MudDivider Class="my-8" />

<MudStack Class="mud-width-full">
<MudButton Variant="Variant.Filled" Color="Color.Primary" OnClick="ProgrammaticPkceLogin">Programmatic Login</MudButton>
<MudText Style="color: var(--mud-palette-text-secondary)" Typo="Typo.subtitle2" Align="Align.Center">Login programmatically as admin/admin.</MudText>
</MudStack>

@* <MudDivider Class="my-2" /> *@

<MudStack>
@* TODO: Enhance sample *@
@* <MudText Align="Align.Center" Typo="Typo.subtitle2"><MudLink Class="cursor-pointer" OnClick="OpenResetDialog">Forgot Password</MudLink></MudText> *@
@* <MudText Align="Align.Center" Typo="Typo.subtitle2">Don't have an account? <MudLink Class="cursor-pointer" Href="/register">SignUp</MudLink></MudText> *@
</MudStack>
</MudPaper>
</MudItem>
</MudGrid>
</MudContainer>
</MudPage>
4 changes: 2 additions & 2 deletions ...Hub.EFCore/Components/Pages/Home.razor.cs → ...ub/Components/Page/SampleHubHome.razor.cs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,9 +7,9 @@
using CodeBeam.UltimateAuth.Server.Stores;
using MudBlazor;

namespace CodeBeam.UltimateAuth.Sample.UAuthHub.EFCore.Components.Pages;
namespace CodeBeam.UltimateAuth.Sample.Shared.Hub.Components.Page;

public partial class Home
public partial class SampleHubHome
{
private string? _username;
private string? _password;
Expand Down
Loading
Loading