├── MyApp
    ├── App_Data
    │   ├── .gitkeep
    │   └── README.md
    ├── wwwroot
    │   ├── admin
    │   │   └── sections
    │   │   │   ├── index.mjs
    │   │   │   └── Bookings.mjs
    │   ├── posts
    │   │   ├── razor-ssg-new-blog-features.mjs
    │   │   ├── components
    │   │   │   ├── HelloApi.mjs
    │   │   │   ├── ChartJs.mjs
    │   │   │   └── VueComponentLibrary.mjs
    │   │   └── javascript.mjs
    │   ├── tailwind
    │   │   └── README.txt
    │   ├── pages
    │   │   ├── Account
    │   │   │   └── Manage
    │   │   │   │   └── EnableAuthenticator.mjs
    │   │   ├── Counter.mjs
    │   │   └── Bookings.mjs
    │   ├── lib
    │   │   └── typings
    │   │   │   ├── vue
    │   │   │       └── index.d.ts
    │   │   │   └── @vue
    │   │   │       └── compiler-dom.d.ts
    │   ├── img
    │   │   ├── logo.svg
    │   │   └── profiles
    │   │   │   ├── user3.svg
    │   │   │   └── user2.svg
    │   └── css
    │   │   ├── lite-yt-embed.css
    │   │   └── highlight.css
    ├── Components
    │   ├── Account
    │   │   ├── Pages
    │   │   │   ├── _Imports.razor
    │   │   │   ├── Manage
    │   │   │   │   ├── _Imports.razor
    │   │   │   │   ├── ApiKeys.razor
    │   │   │   │   ├── PersonalData.razor
    │   │   │   │   ├── ResetAuthenticator.razor
    │   │   │   │   ├── ManageNavPages.cs
    │   │   │   │   ├── Disable2fa.razor
    │   │   │   │   ├── GenerateRecoveryCodes.razor
    │   │   │   │   ├── Index.razor
    │   │   │   │   └── DeletePersonalData.razor
    │   │   │   ├── Logout.razor
    │   │   │   ├── InvalidUser.razor
    │   │   │   ├── InvalidPasswordReset.razor
    │   │   │   ├── Lockout.razor
    │   │   │   ├── ForgotPasswordConfirmation.razor
    │   │   │   ├── ResetPasswordConfirmation.razor
    │   │   │   ├── AccessDenied.razor
    │   │   │   ├── ConfirmEmail.razor
    │   │   │   ├── ConfirmEmailChange.razor
    │   │   │   ├── RegisterConfirmation.razor
    │   │   │   ├── ResendEmailConfirmation.razor
    │   │   │   ├── ForgotPassword.razor
    │   │   │   └── LoginWithRecoveryCode.razor
    │   │   ├── Shared
    │   │   │   ├── RedirectToLogin.razor
    │   │   │   ├── ManageLayout.razor
    │   │   │   ├── AccountLayout.razor
    │   │   │   ├── ShowRecoveryCodes.razor
    │   │   │   ├── ExternalLoginPicker.razor
    │   │   │   ├── ManageNavMenu.razor
    │   │   │   └── StatusMessage.razor
    │   │   ├── IdentityUserAccessor.cs
    │   │   ├── IdentityNoOpEmailSender.cs
    │   │   ├── IdentityRevalidatingAuthenticationStateProvider.cs
    │   │   └── IdentityRedirectManager.cs
    │   ├── Pages
    │   │   ├── Admin.razor
    │   │   ├── Counter.razor
    │   │   ├── Videos.razor
    │   │   ├── Docs.razor
    │   │   ├── Posts
    │   │   │   ├── Author.razor
    │   │   │   ├── Index.razor
    │   │   │   ├── Year.razor
    │   │   │   └── Tagged.razor
    │   │   ├── Error.razor
    │   │   ├── Weather.razor
    │   │   ├── Profile.razor
    │   │   ├── Secure
    │   │   │   └── Bookings.razor
    │   │   └── Home.razor
    │   ├── Shared
    │   │   ├── SrcVuePage.razor
    │   │   ├── SrcRazorPage.razor
    │   │   ├── BlogTitle.razor
    │   │   ├── ShellCommand.razor
    │   │   ├── FormLoading.razor
    │   │   ├── Footer.razor
    │   │   ├── BlogPosts.razor
    │   │   └── VideoGroup.razor
    │   ├── Routes.razor
    │   ├── _Imports.razor
    │   ├── App.razor
    │   └── Layout
    │   │   └── AdminLayout.razor
    ├── tailwind.config.js
    ├── _includes
    │   └── component-links.md
    ├── _posts
    │   ├── config.json
    │   └── authors.json
    ├── _videos
    │   ├── vue
    │   │   ├── admin.md
    │   │   ├── modern.md
    │   │   ├── components.md
    │   │   └── autoquerygrid.md
    │   └── blazor
    │   │   ├── tailwind.md
    │   │   ├── components.md
    │   │   ├── admin.md
    │   │   ├── blazor-vue.md
    │   │   ├── darkmode.md
    │   │   ├── universal.md
    │   │   └── blazor.md
    ├── appsettings.json
    ├── AppComponentBase.cs
    ├── appsettings.Development.json
    ├── Configure.Auth.cs
    ├── package.json
    ├── tsconfig.json
    ├── Configure.AutoQuery.cs
    ├── Configure.OpenApi.cs
    ├── Configure.HealthChecks.cs
    ├── Properties
    │   └── launchSettings.json
    ├── Configure.Db.cs
    ├── Configure.RequestLogs.cs
    ├── Configure.AI.Chat.cs
    ├── Configure.Markdown.cs
    ├── Markdown.Videos.cs
    ├── Configure.ApiKeys.cs
    ├── _pages
    │   └── about.md
    ├── Markdown.Meta.cs
    ├── Migrations
    │   └── Migration1000.cs
    ├── MyApp.csproj
    ├── Program.cs
    ├── Configure.AppHost.cs
    └── MarkdownTagHelper.cs
├── .kamal
    ├── hooks
    │   ├── docker-setup.sample
    │   ├── post-proxy-reboot.sample
    │   ├── pre-proxy-reboot.sample
    │   ├── post-deploy.sample
    │   ├── pre-connect.sample
    │   ├── pre-build.sample
    │   └── pre-deploy.sample
    └── secrets
├── MyApp.ServiceModel
    ├── Types
    │   └── README.md
    ├── Roles.cs
    ├── Hello.cs
    ├── AppRoles.cs
    ├── MyApp.ServiceModel.csproj
    └── User.cs
├── MyApp.slnx
├── MyApp.ServiceInterface
    ├── Data
    │   ├── ApplicationDbContext.cs
    │   ├── ApplicationUser.cs
    │   └── CustomUserSession.cs
    ├── MyApp.ServiceInterface.csproj
    ├── MyServices.cs
    └── EmailServices.cs
├── .vscode
    ├── tasks.json
    └── launch.json
├── README.md
├── MyApp.Tests
    ├── UnitTest.cs
    ├── MyApp.Tests.csproj
    ├── IntegrationTest.cs
    └── MigrationTasks.cs
├── load-env.sh
├── .github
    └── workflows
    │   └── build.yml
└── config
    └── deploy.yml


/MyApp/App_Data/.gitkeep:
--------------------------------------------------------------------------------
1 | 


--------------------------------------------------------------------------------
/.kamal/hooks/docker-setup.sample:
--------------------------------------------------------------------------------
1 | #!/bin/sh
2 | 
3 | echo "Docker set up on $KAMAL_HOSTS..."
4 | 


--------------------------------------------------------------------------------
/.kamal/hooks/post-proxy-reboot.sample:
--------------------------------------------------------------------------------
1 | #!/bin/sh
2 | 
3 | echo "Rebooted kamal-proxy on $KAMAL_HOSTS"
4 | 


--------------------------------------------------------------------------------
/.kamal/hooks/pre-proxy-reboot.sample:
--------------------------------------------------------------------------------
1 | #!/bin/sh
2 | 
3 | echo "Rebooting kamal-proxy on $KAMAL_HOSTS..."
4 | 


--------------------------------------------------------------------------------
/MyApp/wwwroot/admin/sections/index.mjs:
--------------------------------------------------------------------------------
1 | import Bookings from './Bookings.mjs'
2 | export {
3 |     Bookings,
4 | }


--------------------------------------------------------------------------------
/MyApp/Components/Account/Pages/_Imports.razor:
--------------------------------------------------------------------------------
1 | @using MyApp.Components.Account.Shared
2 | @layout AccountLayout
3 | 


--------------------------------------------------------------------------------
/MyApp/Components/Account/Pages/Manage/_Imports.razor:
--------------------------------------------------------------------------------
1 | @layout ManageLayout
2 | @attribute [Microsoft.AspNetCore.Authorization.Authorize]
3 | 


--------------------------------------------------------------------------------
/MyApp/wwwroot/posts/razor-ssg-new-blog-features.mjs:
--------------------------------------------------------------------------------
1 | import ChartJs from './components/ChartJs.mjs'
2 | 
3 | export default {
4 |     components: { ChartJs }
5 | }
6 | 


--------------------------------------------------------------------------------
/MyApp/Components/Pages/Admin.razor:
--------------------------------------------------------------------------------
1 | @page "/admin"
2 | @layout Layout.AdminLayout
3 | 
4 | <PageTitle>Admin</PageTitle>
5 | 
6 | <div data-component="pages/Admin.mjs"></div>


--------------------------------------------------------------------------------
/MyApp/Components/Shared/SrcVuePage.razor:
--------------------------------------------------------------------------------
1 | <SrcLink Href=@($"/MyApp/wwwroot/pages/{Path}") />
2 | 
3 | @code {
4 |     [Parameter] public required string Path { get; set; }
5 | }
6 | 


--------------------------------------------------------------------------------
/MyApp/Components/Shared/SrcRazorPage.razor:
--------------------------------------------------------------------------------
1 | <SrcLink Href=@($"/MyApp/Components/Pages/{Path}") />
2 | 
3 | @code {
4 |     [Parameter] public required string Path { get; set; }
5 | }
6 | 


--------------------------------------------------------------------------------
/MyApp.ServiceModel/Types/README.md:
--------------------------------------------------------------------------------
1 | As part of our [Physical Project Structure](https://docs.servicestack.net/physical-project-structure) convention we recommend maintaining any shared non Request/Response DTOs in the `ServiceModel.Types` namespace.


--------------------------------------------------------------------------------
/MyApp.ServiceModel/Roles.cs:
--------------------------------------------------------------------------------
1 | namespace MyApp.ServiceModel;
2 | 
3 | public class Roles
4 | {
5 |     public const string Admin = nameof(Admin);
6 |     public const string Manager = nameof(Manager);
7 |     public const string Employee = nameof(Employee);
8 | }
9 | 


--------------------------------------------------------------------------------
/MyApp.slnx:
--------------------------------------------------------------------------------
1 | <Solution>
2 |   <Project Path="MyApp.ServiceInterface/MyApp.ServiceInterface.csproj" />
3 |   <Project Path="MyApp.ServiceModel/MyApp.ServiceModel.csproj" />
4 |   <Project Path="MyApp.Tests/MyApp.Tests.csproj" />
5 |   <Project Path="MyApp/MyApp.csproj" />
6 | </Solution>
7 | 


--------------------------------------------------------------------------------
/MyApp/tailwind.config.js:
--------------------------------------------------------------------------------
 1 | export default {
 2 |   theme: {
 3 |     extend: {
 4 |       colors: {
 5 |         'accent-1': '#FAFAFA',
 6 |         'accent-2': '#EAEAEA',
 7 |         danger: 'rgb(153 27 27)',
 8 |         success: 'rgb(22 101 52)',
 9 |       },
10 |     },
11 |   }
12 | }


--------------------------------------------------------------------------------
/MyApp/wwwroot/tailwind/README.txt:
--------------------------------------------------------------------------------
1 | Source code of components containing tailwind classes that also need to be included in tailwind's generated /css/app.css 
2 | Available from: https://raw.githubusercontent.com/ServiceStack/ServiceStack/main/ServiceStack.Blazor/src/ServiceStack.Blazor/dist/tailwind.html


--------------------------------------------------------------------------------
/MyApp/Components/Account/Pages/Logout.razor:
--------------------------------------------------------------------------------
 1 | @page "/Account/Logout"
 2 | 
 3 | <PageTitle>Signed out</PageTitle>
 4 | 
 5 | <div class="mt-8 mx-auto max-w-lg">
 6 |     <div>
 7 |         <Heading1>Signed out</Heading1>
 8 |         <p class="my-4">You have successfully signed out.</p>
 9 |     </div>
10 | </div>


--------------------------------------------------------------------------------
/MyApp/Components/Account/Shared/RedirectToLogin.razor:
--------------------------------------------------------------------------------
1 | @inject NavigationManager NavigationManager
2 | 
3 | @code {
4 |     protected override void OnInitialized()
5 |     {
6 |         NavigationManager.NavigateTo($"Account/Login?returnUrl={Uri.EscapeDataString(NavigationManager.Uri)}", forceLoad: true);
7 |     }
8 | }
9 | 


--------------------------------------------------------------------------------
/MyApp/Components/Account/Pages/InvalidUser.razor:
--------------------------------------------------------------------------------
 1 | @page "/Account/InvalidUser"
 2 | 
 3 | <PageTitle>Invalid user</PageTitle>
 4 | 
 5 | <div class="mt-8 mx-auto max-w-lg">
 6 | 
 7 |     <Heading3>Invalid user</Heading3>
 8 | 
 9 |     <div class="max-w-xl">
10 |         <StatusMessage />
11 |     </div>
12 | 
13 | </div>
14 | 


--------------------------------------------------------------------------------
/MyApp.ServiceInterface/Data/ApplicationDbContext.cs:
--------------------------------------------------------------------------------
1 | using Microsoft.AspNetCore.Identity.EntityFrameworkCore;
2 | using Microsoft.EntityFrameworkCore;
3 | 
4 | namespace MyApp.Data;
5 | 
6 | public class ApplicationDbContext(DbContextOptions<ApplicationDbContext> options)
7 |     : IdentityDbContext<ApplicationUser>(options)
8 | {
9 | }


--------------------------------------------------------------------------------
/MyApp.ServiceModel/Hello.cs:
--------------------------------------------------------------------------------
 1 | using ServiceStack;
 2 | 
 3 | namespace MyApp.ServiceModel;
 4 | 
 5 | [Route("/hello/{Name}")]
 6 | public class Hello : IGet, IReturn<HelloResponse>
 7 | {
 8 |     public string? Name { get; set; }
 9 | }
10 | 
11 | public class HelloResponse
12 | {
13 |     public required string Result { get; set; }
14 | }


--------------------------------------------------------------------------------
/MyApp/wwwroot/pages/Account/Manage/EnableAuthenticator.mjs:
--------------------------------------------------------------------------------
 1 | import { addScript, $1 } from "@servicestack/client"
 2 | const loadJs = addScript('../../../lib/js/qrcode.min.js')
 3 | 
 4 | export default {
 5 |     async load() {
 6 |         await loadJs
 7 |         new QRCode($1("#qrCode"), $1('#qrCodeData').dataset.url)
 8 |     }
 9 | }
10 | 


--------------------------------------------------------------------------------
/MyApp.ServiceModel/AppRoles.cs:
--------------------------------------------------------------------------------
 1 | namespace MyApp;
 2 | 
 3 | public static class AppRoles
 4 | {
 5 |     public const string Admin = nameof(Admin);
 6 |     public const string Employee = nameof(Employee);
 7 |     public const string Manager = nameof(Manager);
 8 | 
 9 |     public static string[] All { get; set; } = { Admin, Employee, Manager };
10 | }
11 | 


--------------------------------------------------------------------------------
/MyApp/wwwroot/lib/typings/vue/index.d.ts:
--------------------------------------------------------------------------------
1 | import { CompilerOptions } from '@vue/compiler-dom';
2 | import { RenderFunction } from '@vue/runtime-dom';
3 | export * from '@vue/runtime-dom';
4 | 
5 | export declare function compileToFunction(template: string | HTMLElement, options?: CompilerOptions): RenderFunction;
6 | 
7 | export { compileToFunction as compile };
8 | 


--------------------------------------------------------------------------------
/MyApp/Components/Account/Pages/InvalidPasswordReset.razor:
--------------------------------------------------------------------------------
 1 | @page "/Account/InvalidPasswordReset"
 2 | 
 3 | <PageTitle>Invalid password reset</PageTitle>
 4 | 
 5 | <div class="mt-8 mx-auto max-w-lg">
 6 | 
 7 |     <Heading1>Invalid password reset</Heading1>
 8 | 
 9 |     <p class="my-4">
10 |         The password reset link is invalid.
11 |     </p>
12 | 
13 | </div>
14 | 


--------------------------------------------------------------------------------
/MyApp/Components/Account/Pages/Lockout.razor:
--------------------------------------------------------------------------------
 1 | @page "/Account/Lockout"
 2 | 
 3 | <PageTitle>Locked out</PageTitle>
 4 | 
 5 | <div class="mt-8 mx-auto max-w-lg">
 6 | 
 7 |     <header>
 8 |         <Heading1>Locked out</Heading1>
 9 |         <p class="my-4 text-danger">This account has been locked out, please try again later.</p>
10 |     </header>
11 | 
12 | </div>
13 | 
14 | 


--------------------------------------------------------------------------------
/MyApp/Components/Account/Pages/ForgotPasswordConfirmation.razor:
--------------------------------------------------------------------------------
 1 | @page "/Account/ForgotPasswordConfirmation"
 2 | 
 3 | <PageTitle>Forgot password confirmation</PageTitle>
 4 | 
 5 | <div class="mt-8 mx-auto max-w-lg">
 6 |     <Heading1>Forgot password confirmation</Heading1>
 7 | 
 8 |     <p class="my-4">
 9 |         Please check your email to reset your password.
10 |     </p>
11 | </div>
12 | 
13 | 


--------------------------------------------------------------------------------
/MyApp/_includes/component-links.md:
--------------------------------------------------------------------------------
1 | - [.NET Blazor Vue Components in Markdown](/posts/javascript)
2 | - [.NET Razor SSG Vue Components in Markdown](https://razor-ssg.web-templates.io/posts/javascript)
3 | - [Vue Components in Markdown](https://press-vue.servicestack.net/posts/markdown-components-in-vue)
4 | - [React Components in Markdown](https://press-react.servicestack.net/posts/markdown-components-in-react)
5 | 


--------------------------------------------------------------------------------
/.kamal/hooks/post-deploy.sample:
--------------------------------------------------------------------------------
 1 | #!/bin/sh
 2 | 
 3 | # A sample post-deploy hook
 4 | #
 5 | # These environment variables are available:
 6 | # KAMAL_RECORDED_AT
 7 | # KAMAL_PERFORMER
 8 | # KAMAL_VERSION
 9 | # KAMAL_HOSTS
10 | # KAMAL_ROLE (if set)
11 | # KAMAL_DESTINATION (if set)
12 | # KAMAL_RUNTIME
13 | 
14 | echo "$KAMAL_PERFORMER deployed $KAMAL_VERSION to $KAMAL_DESTINATION in $KAMAL_RUNTIME seconds"
15 | 


--------------------------------------------------------------------------------
/MyApp/_posts/config.json:
--------------------------------------------------------------------------------
 1 | {
 2 |   "localBaseUrl": "https://localhost:5001",
 3 |   "publicBaseUrl": "https://blazor-vue.web-templates.io",
 4 |   "siteTwitter": "@BlazorVue",
 5 |   "blogTitle": "From the blog",
 6 |   "blogDescription": "Learnings, recommendations & new features from ServiceStack engineers",
 7 |   "blogEmail": "email@example.org (Blazor Vue)",
 8 |   "blogImageUrl": "https://servicestack.net/img/logo.png"
 9 | }
10 | 


--------------------------------------------------------------------------------
/MyApp/Components/Shared/BlogTitle.razor:
--------------------------------------------------------------------------------
 1 | @inject MarkdownBlog Blog
 2 | 
 3 | <div class="text-center">
 4 |     <h2 class="text-3xl font-bold tracking-tight text-gray-900 dark:text-gray-100 sm:text-4xl">@Blog.Config.BlogTitle</h2>
 5 |     <p class="mx-auto mt-3 max-w-2xl text-xl text-gray-500 sm:mt-4">
 6 |         @BlazorHtml.Raw(Heading)
 7 |     </p>
 8 | </div>
 9 | 
10 | @code {
11 |     [Parameter] public required string Heading { get; set; }
12 | }
13 | 


--------------------------------------------------------------------------------
/MyApp/wwwroot/pages/Counter.mjs:
--------------------------------------------------------------------------------
 1 | import { ref } from 'vue'
 2 | 
 3 | export default {
 4 |     template: `
 5 |         <p class="my-4">Current count: {{currentCount}}</p>
 6 | 
 7 |         <PrimaryButton @click="incrementCount">Click me</PrimaryButton>
 8 |     `,
 9 |     setup() {
10 |         const currentCount = ref(0)
11 |         const incrementCount = () => currentCount.value++
12 | 
13 |         return { currentCount, incrementCount }
14 |     }
15 | }
16 | 


--------------------------------------------------------------------------------
/MyApp/Components/Account/Pages/ResetPasswordConfirmation.razor:
--------------------------------------------------------------------------------
 1 | @page "/Account/ResetPasswordConfirmation"
 2 | <PageTitle>Reset password confirmation</PageTitle>
 3 | 
 4 | <div class="mt-8 mx-auto max-w-lg">
 5 | 
 6 |     <Heading1>Reset password confirmation</Heading1>
 7 | 
 8 |     <p class="my-4">
 9 |         Your password has been reset. Please <HyperLink class="font-semibold" href="Account/Login">click here to log in</HyperLink>.
10 |     </p>
11 | 
12 | </div>
13 | 


--------------------------------------------------------------------------------
/MyApp/Components/Account/Pages/AccessDenied.razor:
--------------------------------------------------------------------------------
 1 | @page "/Account/AccessDenied"
 2 | 
 3 | 
 4 | <PageTitle>Access Denied</PageTitle>
 5 | 
 6 | <div class="mt-8 mx-auto max-w-lg">
 7 |     <h1 class="text-3xl font-bold tracking-tight sm:text-4xl text-danger">Access Denied</h1>
 8 | 
 9 |     <p class="my-4 text-danger">
10 |         You do not have access to this resource.
11 |     </p>
12 | </div>
13 | 
14 | @code {
15 |     [Parameter] public string ReturnUrl { get; set; }
16 | }


--------------------------------------------------------------------------------
/MyApp/Components/Routes.razor:
--------------------------------------------------------------------------------
 1 | <Router AppAssembly="@typeof(Program).Assembly">
 2 |     <Found Context="routeData">
 3 |         <AuthorizeRouteView RouteData="@routeData" DefaultLayout="@typeof(Layout.MainLayout)">
 4 |            <NotAuthorized>
 5 |                 <MyApp.Components.Pages.Account.Login />
 6 |             </NotAuthorized>
 7 |         </AuthorizeRouteView>
 8 |         <FocusOnNavigate RouteData="@routeData" Selector="h1" />
 9 |     </Found>
10 | </Router>
11 | 


--------------------------------------------------------------------------------
/MyApp/Components/Pages/Counter.razor:
--------------------------------------------------------------------------------
 1 | @page "/counter"
 2 | 
 3 | <PageTitle>Counter</PageTitle>
 4 | 
 5 | <div class="mt-8 mb-20 mx-auto max-w-fit">
 6 |     <Heading1>Counter</Heading1>
 7 | 
 8 |     <div data-component="pages/Counter.mjs"></div>
 9 | 
10 |     <div>
11 |         <div class="mt-8 flex justify-center gap-x-4">
12 |             <SrcRazorPage Path="Counter.razor" />
13 |             <SrcVuePage Path="Counter.mjs" />
14 |         </div>
15 |     </div>
16 | 
17 | </div>
18 | 
19 | 


--------------------------------------------------------------------------------
/MyApp/_videos/vue/admin.md:
--------------------------------------------------------------------------------
 1 | ---
 2 | title: Build beautiful custom .NET Admin UIs in minutes
 3 | url: https://youtu.be/wlRA4_owEsc
 4 | tags: [vue,autoquery]
 5 | date: 14-06-2023
 6 | order: 3
 7 | ---
 8 | 
 9 | In this video we explore the Server Multi Razor Page and Client rendered Admin UI Pages in the latest 
10 | .NET blazor-vue and razor-vue project templates to see how to use the new SidebarLayout and 
11 | AutoQueryGrid Vue Tailwind components to build beautiful Admin UI Pages within minutes.


--------------------------------------------------------------------------------
/MyApp/Components/Account/Pages/Manage/ApiKeys.razor:
--------------------------------------------------------------------------------
 1 | @page "/Account/Manage/ApiKeys"
 2 | 
 3 | <PageTitle>Manage API Keys</PageTitle>
 4 | 
 5 | <div>
 6 |     <Heading3>Manage API Keys</Heading3>
 7 |     <div data-component="pages/Account/Manage/ManageUserApiKeys.mjs" data-props="@ToProps()"></div>
 8 | </div>
 9 | 
10 | @code {
11 |     public MarkupString ToProps() => BlazorHtml.RawJson(new {
12 |         info = HostContext.AppHost.GetPlugin<ApiKeysFeature>()?.GetApiKeyInfo(),
13 |     });
14 | }
15 | 


--------------------------------------------------------------------------------
/MyApp/_videos/vue/modern.md:
--------------------------------------------------------------------------------
 1 | ---
 2 | title: Modern Razor Pages & MVC .NET Tailwind templates
 3 | url: https://youtu.be/SyppvQB7IPs
 4 | tags: [vue,razor]
 5 | date: 08-02-2023
 6 | order: 4
 7 | ---
 8 | 
 9 | ServiceStack templates provide a wide range of options when it comes to using Razor Pages in your .NET application
10 | 
11 | These templates come with Tailwind, JS Modules, and Vue components already built-in, making it easy to build 
12 | hybrid apps containing both Server-Side Rendering (SSR) and static resources


--------------------------------------------------------------------------------
/.vscode/tasks.json:
--------------------------------------------------------------------------------
 1 | {
 2 |     // See https://go.microsoft.com/fwlink/?LinkId=733558
 3 |     // for the documentation about the tasks.json format
 4 |     "version": "2.0.0",
 5 |     "tasks": [
 6 |         {
 7 |             "label": "build",
 8 |             "command": "dotnet build",
 9 |             "type": "shell",
10 |             "group": "build",
11 |             "presentation": {
12 |                 "reveal": "silent"
13 |             },
14 |             "problemMatcher": "$msCompile"
15 |         }
16 |     ]
17 | }


--------------------------------------------------------------------------------
/MyApp.ServiceModel/MyApp.ServiceModel.csproj:
--------------------------------------------------------------------------------
 1 | <Project Sdk="Microsoft.NET.Sdk">
 2 | 
 3 |     <PropertyGroup>
 4 |         <TargetFramework>net10.0</TargetFramework>
 5 |         <ImplicitUsings>enable</ImplicitUsings>
 6 |         <Nullable>enable</Nullable>
 7 |     </PropertyGroup>
 8 | 
 9 |     <ItemGroup>
10 |         <PackageReference Include="ServiceStack.Interfaces" Version="10.*" />
11 |     </ItemGroup>
12 | 
13 |     <ItemGroup>
14 |         <Folder Include="Types\" />
15 |     </ItemGroup>
16 | 
17 | </Project>
18 | 


--------------------------------------------------------------------------------
/MyApp/App_Data/README.md:
--------------------------------------------------------------------------------
 1 | ## App Writable Folder
 2 | 
 3 | This directory is designated for:
 4 | 
 5 | - **Embedded Databases**: Such as SQLite.
 6 | - **Writable Files**: Files that the application might need to modify during its operation.
 7 | 
 8 | For applications running in **Docker**, it's a common practice to mount this directory as an external volume. This ensures:
 9 | 
10 | - **Data Persistence**: App data is preserved across deployments.
11 | - **Easy Replication**: Facilitates seamless data replication for backup or migration purposes.
12 | 


--------------------------------------------------------------------------------
/MyApp/appsettings.json:
--------------------------------------------------------------------------------
 1 | {
 2 |     "Logging": {
 3 |         "IncludeScopes": false,
 4 |         "Debug": {
 5 |             "LogLevel": {
 6 |                 "Default": "Warning"
 7 |             }
 8 |         },
 9 |         "Console": {
10 |             "LogLevel": {
11 |                 "Default": "Warning"
12 |             }
13 |         }
14 |     },
15 |     "AllowedHosts": "*",
16 |     "AppConfig": {
17 |         "LocalBaseUrl": "https://localhost:5001",
18 |         "PublicBaseUrl": "https://blazor-vue.web-templates.io"
19 |     }
20 | }
21 | 


--------------------------------------------------------------------------------
/MyApp/_videos/vue/components.md:
--------------------------------------------------------------------------------
 1 | ---
 2 | title: Vue 3 Tailwind Components Library
 3 | url: https://youtu.be/YIa0w6whe2U
 4 | tags: [vue,autoquery]
 5 | date: 14-02-2023
 6 | order: 2
 7 | ---
 8 | 
 9 | In this video, we demonstrate using the @servicestack/vue components library for Vue.js 3 Multipage Apps (MPAs) along with the `vue-mjs` template. 
10 | 
11 | The template illustrates building content-heavy or complex sites while avoiding the intricacies of Single Page Apps (SPAs) through the use of JavaScript Modules, Tailwind, Vue.js, Razor Pages, and ServiceStack.


--------------------------------------------------------------------------------
/MyApp/Components/Account/Shared/ManageLayout.razor:
--------------------------------------------------------------------------------
 1 | @inherits LayoutComponentBase
 2 | @layout AccountLayout
 3 | 
 4 | <div class="mt-8 mx-auto max-w-screen-lg">
 5 |     <Heading1>Manage your account</Heading1>
 6 |     <Heading4>Change your account settings</Heading4>
 7 |     <hr class="mt-4 dark:border-gray-700" />
 8 |     <div class="flex flex-wrap">
 9 |         <div class="grow-0">
10 |             <ManageNavMenu />
11 |         </div>
12 |         <div class="grow p-4 sm:pl-16">
13 |             @Body
14 |         </div>
15 |     </div>
16 | </div>
17 | 
18 | 


--------------------------------------------------------------------------------
/MyApp/_videos/blazor/tailwind.md:
--------------------------------------------------------------------------------
 1 | ---
 2 | title: Creating Beautiful Blazor Apps with Tailwind
 3 | url: https://youtu.be/3gD_MMcYI-4
 4 | tags: [blazor,autoquery]
 5 | date: 25-07-2022
 6 | order: 6
 7 | ---
 8 | 
 9 | We tour the Blazor Web Assembly template that utilizes Tailwind CSS, 
10 | and show you how to set up hot reload for both during development. 
11 | 
12 | Tailwind CSS is a popular utility-first CSS framework that provides a 
13 | comprehensive set of pre-defined CSS styles, enabling developers to 
14 | create modern and responsive designs with ease.
15 | 


--------------------------------------------------------------------------------
/MyApp/_videos/blazor/components.md:
--------------------------------------------------------------------------------
 1 | ---
 2 | title: Rapidly Develop Beautiful Apps with Blazor Tailwind Components
 3 | url: https://youtu.be/iKpQI2233nY
 4 | tags: blazor,components,autoquery
 5 | date: 11-10-2022
 6 | order: 3
 7 | ---
 8 | 
 9 | The ServiceStack Blazor components for Blazor WASM and Server Rendered Apps are a powerful set of tools that enable 
10 | developers to quickly and easily create interactive data grids from their AutoQuery services using minimal code. 
11 | 
12 | These components can be styled with Tailwind CSS, enabling creating professional-looking custom applications.


--------------------------------------------------------------------------------
/MyApp/_videos/vue/autoquerygrid.md:
--------------------------------------------------------------------------------
 1 | ---
 2 | title: Instantly Manage your data using AutoQueryGrid Vue
 3 | url: https://youtu.be/znCoC-Ct0Ps
 4 | tags: [vue,autoquery]
 5 | date: 16-03-2023
 6 | order: 1
 7 | ---
 8 | 
 9 | This walkthrough explores the ServiceStack Vue 3 library and the functionality of the AutoQueryGrid component. The AutoQueryGrid component simplifies the integration of AutoQuery services by generating a customizable UI. 
10 | 
11 | By following this guide, you'll learn how to effectively utilize these tools to enhance your application's user interface and overall user experience.
12 | 


--------------------------------------------------------------------------------
/MyApp/AppComponentBase.cs:
--------------------------------------------------------------------------------
 1 | using Microsoft.AspNetCore.Components;
 2 | using ServiceStack;
 3 | using ServiceStack.Blazor;
 4 | using ServiceStack.Text;
 5 | 
 6 | namespace MyApp;
 7 | 
 8 | /// <summary>
 9 | /// For Pages and Components that make use of ServiceStack functionality, e.g. Client
10 | /// </summary>
11 | public abstract class AppComponentBase : ServiceStack.Blazor.BlazorComponentBase, IHasJsonApiClient
12 | {
13 | }
14 | 
15 | /// <summary>
16 | /// For Pages and Components requiring Authentication
17 | /// </summary>
18 | public abstract class AppAuthComponentBase : AuthBlazorComponentBase
19 | {
20 | }
21 | 


--------------------------------------------------------------------------------
/MyApp/appsettings.Development.json:
--------------------------------------------------------------------------------
 1 | {
 2 |     "DebugMode": true,
 3 |     "DetailedErrors": true,
 4 |     "Logging": {
 5 |         "IncludeScopes": false,
 6 |         "Debug": {
 7 |             "LogLevel": {
 8 |                 "Default": "Debug",
 9 |                 "System": "Information",
10 |                 "Microsoft": "Information"
11 |             }
12 |         },
13 |         "Console": {
14 |             "LogLevel": {
15 |                 "Default": "Debug",
16 |                 "System": "Information",
17 |                 "Microsoft": "Information"
18 |             }
19 |         }
20 |     }
21 | }
22 | 


--------------------------------------------------------------------------------
/MyApp/Configure.Auth.cs:
--------------------------------------------------------------------------------
 1 | using ServiceStack.Auth;
 2 | using MyApp.Data;
 3 | 
 4 | [assembly: HostingStartup(typeof(MyApp.ConfigureAuth))]
 5 | 
 6 | namespace MyApp;
 7 | 
 8 | public class ConfigureAuth : IHostingStartup
 9 | {
10 |     public void Configure(IWebHostBuilder builder) => builder
11 |         .ConfigureServices(services => {
12 |             services.AddPlugin(new AuthFeature(IdentityAuth.For<ApplicationUser>(options => {
13 |                 options.SessionFactory = () => new CustomUserSession();
14 |                 options.CredentialsAuth();
15 |                 options.AdminUsersFeature();
16 |             })));
17 |         });
18 | }
19 | 


--------------------------------------------------------------------------------
/MyApp/_videos/blazor/admin.md:
--------------------------------------------------------------------------------
 1 | ---
 2 | title: Create Beautiful UX optimized Blazor Apps with Auto Admin pages
 3 | url: https://youtu.be/tt0ytzVVjEY
 4 | tags: [blazor,admin]
 5 | date: 12-12-2022
 6 | order: 4
 7 | ---
 8 | 
 9 | We walk through the process of creating admin screens using ServiceStack Blazor Components by looking at our Blazor Diffusion
10 | App as an example which generates AI artworks using Stable Diffusion and curates a gallery of amazing visuals. 
11 | 
12 | With the ServiceStack Blazor Components, we'll show you how to quickly create a powerful and intuitive admin interface for 
13 | managing the application data, with minimal coding required.
14 | 


--------------------------------------------------------------------------------
/MyApp/_videos/blazor/blazor-vue.md:
--------------------------------------------------------------------------------
 1 | ---
 2 | title: Fast, SEO-friendly, Blazor Static Rendered Apps with Vue
 3 | url: https://youtu.be/ujbTGn4IwFs
 4 | tags: [blazor, tailwind, vue]
 5 | date: 22-11-2023
 6 | order: 1
 7 | ---
 8 | 
 9 | The new **Blazor Vue** template is ideal for building Fast, SEO-friendly, 100% statically rendered Blazor Web Apps where 
10 | all its dynamic functionally uses Vue.js and the [Vue Components library](https://docs.servicestack.net/vue/) to 
11 | progressively enhance Blazor's statically rendered content - eliminating Blazor's current limitations of being able to 
12 | use Blazor SSR to develop an entire App without any Blazor Interactivity downsides.
13 | 


--------------------------------------------------------------------------------
/MyApp/_videos/blazor/darkmode.md:
--------------------------------------------------------------------------------
 1 | ---
 2 | title: Beautiful Blazor Tailwind Components with Darkmode
 3 | url: https://youtu.be/8nwpC_B4AC4
 4 | tags: [darkmode,blazor,components]
 5 | date: 07-12-2022
 6 | order: 7
 7 | ---
 8 | 
 9 | We walkthrough the ServiceStack Blazor Components support for Darkmode. 
10 | Our Blazor Components provide a suite of powerful, pre-built UI components that are easy to use, customizable, 
11 | and can be used to build high-performing, responsive web applications.
12 | 
13 | The components support both Blazor Server and Blazor WASM, and are designed to work seamlessly with 
14 | ServiceStack's features, providing a simplified and integrated developer experience.


--------------------------------------------------------------------------------
/MyApp/package.json:
--------------------------------------------------------------------------------
 1 | {
 2 |     "scripts": {
 3 |         "postinstall": "node postinstall.js && npm run migrate",
 4 |         "dtos": "npx get-dtos mjs",
 5 |         "dev": "dotnet watch",
 6 |         "ui:dev": "tailwindcss -i ./tailwind.input.css -o ./wwwroot/css/app.css --watch",
 7 |         "ui:build": "tailwindcss -i ./tailwind.input.css -o ./wwwroot/css/app.css --minify",
 8 |         "build": "npm run ui:build",
 9 |         "migrate": "dotnet run --AppTasks=migrate",
10 |         "revert:last": "dotnet run --AppTasks=migrate.revert:last",
11 |         "revert:all": "dotnet run --AppTasks=migrate.revert:all",
12 |         "rerun:last": "npm run revert:last && npm run migrate"
13 |     }
14 | }
15 | 


--------------------------------------------------------------------------------
/MyApp.ServiceInterface/Data/ApplicationUser.cs:
--------------------------------------------------------------------------------
 1 | using Microsoft.AspNetCore.Identity;
 2 | 
 3 | namespace MyApp.Data;
 4 | 
 5 | /* After modifying ApplicationUser, delete and recreate the initial EF Core migration with:
 6 |    rm Migrations/202*.cs Migrations/ApplicationDbContextModelSnapshot.cs
 7 |    dotnet ef migrations add CreateIdentitySchema
 8 | */
 9 | 
10 | // Add profile data for application users by adding properties to the ApplicationUser class
11 | public class ApplicationUser : IdentityUser
12 | {
13 |     public string? FirstName { get; set; }
14 |     public string? LastName { get; set; }
15 |     public string? DisplayName { get; set; }
16 |     public string? ProfileUrl { get; set; }
17 | }
18 | 


--------------------------------------------------------------------------------
/MyApp/_videos/blazor/universal.md:
--------------------------------------------------------------------------------
 1 | ---
 2 | title: Universal Blazor API Components for Blazor Server and WASM
 3 | url: https://youtu.be/66DgLHExC9E
 4 | tags: [blazor,server,wasm,components]
 5 | date: 04-01-2023
 6 | order: 4
 7 | ---
 8 | 
 9 | We walk through the process of creating universal Blazor API components for Blazor Server 
10 | and Blazor WASM using the ServiceStack.Blazor library. 
11 | 
12 | We'll show how Developers can create UI components that can be shared between their Blazor 
13 | applications without worrying about the hosting model used. This allows developers to streamline 
14 | their development process and reduce the amount of code they need to write, making it easier to build 
15 | and maintain complex Apps.
16 | 


--------------------------------------------------------------------------------
/MyApp/Components/Account/IdentityUserAccessor.cs:
--------------------------------------------------------------------------------
 1 | using Microsoft.AspNetCore.Identity;
 2 | using MyApp.Data;
 3 | 
 4 | namespace MyApp.Components.Account;
 5 | 
 6 | internal sealed class IdentityUserAccessor(UserManager<ApplicationUser> userManager, IdentityRedirectManager redirectManager)
 7 | {
 8 |     public async Task<ApplicationUser> GetRequiredUserAsync(HttpContext context)
 9 |     {
10 |         var user = await userManager.GetUserAsync(context.User);
11 | 
12 |         if (user is null)
13 |         {
14 |             redirectManager.RedirectToWithStatus("Account/InvalidUser", $"Error: Unable to load user with ID '{userManager.GetUserId(context.User)}'.", context);
15 |         }
16 | 
17 |         return user;
18 |     }
19 | }
20 | 


--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
 1 | # blazor-vue
 2 | 
 3 | .NET 10.0 Simple, Server Rendered Blazor Tailwind App with Vue interactivity
 4 | 
 5 | [![](https://raw.githubusercontent.com/ServiceStack/Assets/master/csharp-templates/blazor-vue.png)](http://blazor-vue.web-templates.io/)
 6 | 
 7 | > Browse [source code](https://github.com/NetCoreTemplates/blazor-vue), view live demo [blazor-vue.web-templates.io](http://blazor-vue.web-templates.io):
 8 | 
 9 | ```bash
10 | npx create-net blazor-vue ProjectName
11 | ```
12 | 
13 | ## Jumpstart with Copilot
14 | 
15 | Instantly [scaffold a new App with this template](https://github.com/new?template_name=blazor-vue&template_owner=NetCoreTemplates) using GitHub Copilot, just describe the features you want and watch Copilot build it!
16 | 


--------------------------------------------------------------------------------
/MyApp/_videos/blazor/blazor.md:
--------------------------------------------------------------------------------
 1 | ---
 2 | title: Blazor Tailwind App for .NET 8
 3 | url: https://youtu.be/hqyozHSL0Nk
 4 | tags: [blazor, tailwind]
 5 | date: 21-11-2023
 6 | order: 2
 7 | ---
 8 | 
 9 | ServiceStack's new Blazor project template takes advantage of .NET 8 Blazor's new features that redefines modern Web 
10 | Development in C# which we explore in this video overview, covering how the template adopts Blazor's familiar ASP.NET 
11 | Core Identity and Entity Framework for its authentication, utilizes the modern Tailwind CSS framework for beautiful 
12 | responsive design and adopts .NET's best-practice Docker Containerization support for its built-in GitHub Action 
13 | Deployments - enabling a simple ready-made CI solution for deployment to any Linux Host via SSH and Docker compose.
14 | 


--------------------------------------------------------------------------------
/MyApp/Components/_Imports.razor:
--------------------------------------------------------------------------------
 1 | @using System.Net.Http
 2 | @using System.Net.Http.Json
 3 | @using Microsoft.AspNetCore.Components.Authorization
 4 | @using Microsoft.AspNetCore.Components.Forms
 5 | @using Microsoft.AspNetCore.Components.Routing
 6 | @using Microsoft.AspNetCore.Components.Web
 7 | @using Microsoft.AspNetCore.Authorization
 8 | @using static Microsoft.AspNetCore.Components.Web.RenderMode
 9 | @using Microsoft.AspNetCore.Components.Web.Virtualization
10 | @using Microsoft.JSInterop
11 | @using ServiceStack
12 | @using ServiceStack.Web
13 | @using ServiceStack.Html
14 | @using ServiceStack.Blazor
15 | @using ServiceStack.Blazor.Components
16 | @using ServiceStack.Blazor.Components.Tailwind
17 | @using MyApp
18 | @using MyApp.Components
19 | @using MyApp.Components.Shared
20 | @using MyApp.ServiceModel
21 | 


--------------------------------------------------------------------------------
/MyApp.Tests/UnitTest.cs:
--------------------------------------------------------------------------------
 1 | using NUnit.Framework;
 2 | using ServiceStack;
 3 | using ServiceStack.Testing;
 4 | using MyApp.ServiceInterface;
 5 | using MyApp.ServiceModel;
 6 | 
 7 | namespace MyApp.Tests;
 8 | 
 9 | public class UnitTest
10 | {
11 |     private readonly ServiceStackHost appHost;
12 | 
13 |     public UnitTest()
14 |     {
15 |         appHost = new BasicAppHost().Init();
16 |         appHost.Container.AddTransient<MyServices>();
17 |     }
18 | 
19 |     [OneTimeTearDown]
20 |     public void OneTimeTearDown() => appHost.Dispose();
21 | 
22 |     [Test]
23 |     public void Can_call_MyServices()
24 |     {
25 |         var service = appHost.Container.Resolve<MyServices>();
26 | 
27 |         var response = (HelloResponse)service.Any(new Hello { Name = "World" });
28 | 
29 |         Assert.That(response.Result, Is.EqualTo("Hello, World!"));
30 |     }
31 | }


--------------------------------------------------------------------------------
/MyApp/wwwroot/posts/components/HelloApi.mjs:
--------------------------------------------------------------------------------
 1 | import { ref } from "vue"
 2 | import { useClient } from "@servicestack/vue"
 3 | import { Hello } from "../../mjs/dtos.mjs"
 4 | 
 5 | export default {
 6 |     template:`<div class="flex flex-wrap justify-center">
 7 |         <TextInput v-model="name" @keyup="update" />
 8 |         <div class="ml-3 mt-2 text-lg">{{ result }}</div>
 9 |     </div>`,
10 |     props:['value'],
11 |     setup(props) {
12 |         let name = ref(props.value)
13 |         let result = ref('')
14 |         let client = useClient()
15 | 
16 |         async function update() {
17 |             let api = await client.api(new Hello({ name }))
18 |             if (api.succeeded) {
19 |                 result.value = api.response.result
20 |             }
21 |         }
22 |         update()
23 | 
24 |         return { name, update, result }
25 |     }
26 | }
27 | 


--------------------------------------------------------------------------------
/MyApp/tsconfig.json:
--------------------------------------------------------------------------------
 1 | {
 2 |   "compilerOptions": {
 3 |     "target": "ESNext",
 4 |     "sourceMap": true,
 5 |     "baseUrl": "./",
 6 |     "typeRoots": ["./wwwroot/lib/typings"],
 7 |     "experimentalDecorators": true,
 8 |     "allowJs": true,
 9 |     "noEmit": true,
10 |     "lib": [
11 |       "ES2020",
12 |       "DOM",
13 |       "DOM.Iterable"
14 |     ],
15 |     "paths": {
16 |         "*": [
17 |             "./wwwroot/lib/*",
18 |             "./wwwroot/lib/typings/*"
19 |         ],
20 |         "vue": [ "./wwwroot/lib/typings/vue/index.d.ts" ],
21 |         "@servicestack/client": [ "./wwwroot/lib/typings/@servicestack/client/index.d.ts" ],
22 |         "@servicestack/vue": [ "./wwwroot/lib/typings/@servicestack/vue/index.d.ts" ]
23 |     }
24 |   },
25 |   "include": [
26 |     "./wwwroot/**/*",
27 |     "./components.d.ts"
28 |   ],
29 |   "exclude": [
30 |     "node_modules"
31 |   ]
32 | }


--------------------------------------------------------------------------------
/MyApp.ServiceModel/User.cs:
--------------------------------------------------------------------------------
 1 | using ServiceStack;
 2 | using ServiceStack.DataAnnotations;
 3 | 
 4 | namespace MyApp.ServiceModel;
 5 | 
 6 | /// <summary>
 7 | /// Public User DTO
 8 | /// </summary>
 9 | [Icon(Svg = "<svg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'><path fill='currentColor' d='M12 4a4 4 0 0 1 4 4a4 4 0 0 1-4 4a4 4 0 0 1-4-4a4 4 0 0 1 4-4m0 10c4.42 0 8 1.79 8 4v2H4v-2c0-2.21 3.58-4 8-4'/></svg>")]
10 | [Alias("AspNetUsers")]
11 | public class User
12 | {
13 |     public string Id { get; set; }
14 |     public string UserName { get; set; }
15 |     public string? FirstName { get; set; }
16 |     public string? LastName { get; set; }
17 |     public string? DisplayName { get; set; }
18 |     public string? ProfileUrl { get; set; }
19 | }
20 | 
21 | [ValidateIsAdmin]
22 | public class QueryUsers : QueryDb<User>
23 | {
24 |     public string? Id { get; set; }
25 | }
26 | 


--------------------------------------------------------------------------------
/MyApp/Components/Account/Shared/AccountLayout.razor:
--------------------------------------------------------------------------------
 1 | @inherits LayoutComponentBase
 2 | @layout MyApp.Components.Layout.MainLayout
 3 | @inject NavigationManager NavigationManager
 4 | 
 5 | @if (HttpContext is null)
 6 | {
 7 |     <p>Loading...</p>
 8 | }
 9 | else
10 | {
11 |     @Body
12 | }
13 | 
14 | @code {
15 |     [CascadingParameter]
16 |     private HttpContext? HttpContext { get; set; }
17 | 
18 |     protected override void OnParametersSet()
19 |     {
20 |         if (HttpContext is null)
21 |         {
22 |             // If this code runs, we're currently rendering in interactive mode, so there is no HttpContext.
23 |             // The identity pages need to set cookies, so they require an HttpContext. To achieve this we
24 |             // must transition back from interactive mode to a server-rendered page.
25 |             NavigationManager.Refresh(forceReload: true);
26 |         }
27 |     }
28 | }
29 | 


--------------------------------------------------------------------------------
/MyApp/wwwroot/posts/components/ChartJs.mjs:
--------------------------------------------------------------------------------
 1 | import { ref, onMounted } from "vue"
 2 | import { addScript } from "@servicestack/client"
 3 | 
 4 | const loadJs = addScript('https://cdn.jsdelivr.net/npm/chart.js/dist/chart.umd.min.js')
 5 | 
 6 | export default {
 7 |     template:`<div><canvas ref="chart"></canvas></div>`,
 8 |     props:['type','data','options'],
 9 |     setup(props) {
10 |         const chart = ref()
11 |         onMounted(async () => {
12 |             await loadJs
13 | 
14 |             const options = props.options || {
15 |                 responsive: true,
16 |                 legend: {
17 |                     position: "top"
18 |                 }
19 |             }
20 |             new Chart(chart.value, {
21 |                 type: props.type || "bar",
22 |                 data: props.data,
23 |                 options,
24 |             })
25 | 
26 |         })
27 |         return { chart }
28 |     }
29 | }
30 | 


--------------------------------------------------------------------------------
/MyApp.ServiceInterface/MyApp.ServiceInterface.csproj:
--------------------------------------------------------------------------------
 1 | <Project Sdk="Microsoft.NET.Sdk">
 2 | 
 3 |     <PropertyGroup>
 4 |         <TargetFramework>net10.0</TargetFramework>
 5 |         <ImplicitUsings>enable</ImplicitUsings>
 6 |         <Nullable>enable</Nullable>
 7 |     </PropertyGroup>
 8 | 
 9 |     <ItemGroup>
10 |         <PackageReference Include="Microsoft.AspNetCore.Diagnostics.EntityFrameworkCore" Version="10.*" />
11 |         <PackageReference Include="Microsoft.AspNetCore.Identity.EntityFrameworkCore" Version="10.*" />
12 |         <PackageReference Include="ServiceStack" Version="10.*" />
13 |         <PackageReference Include="ServiceStack.Extensions" Version="10.*" />
14 |         <PackageReference Include="ServiceStack.Ormlite" Version="10.*" />
15 |         <PackageReference Include="ServiceStack.Server" Version="10.*" />
16 |     </ItemGroup>
17 | 
18 |     <ItemGroup>
19 |         <ProjectReference Include="..\MyApp.ServiceModel\MyApp.ServiceModel.csproj" />
20 |     </ItemGroup>
21 | 
22 | </Project>
23 | 


--------------------------------------------------------------------------------
/MyApp/Configure.AutoQuery.cs:
--------------------------------------------------------------------------------
 1 | using ServiceStack.Data;
 2 | 
 3 | [assembly: HostingStartup(typeof(MyApp.ConfigureAutoQuery))]
 4 | 
 5 | namespace MyApp;
 6 | 
 7 | public class ConfigureAutoQuery : IHostingStartup
 8 | {
 9 |     public void Configure(IWebHostBuilder builder) => builder
10 |         .ConfigureServices(services => {
11 |             // Enable Audit History
12 |             services.AddSingleton<ICrudEvents>(c =>
13 |                 new OrmLiteCrudEvents(c.GetRequiredService<IDbConnectionFactory>()));
14 | 
15 |             // For TodosService
16 |             services.AddPlugin(new AutoQueryDataFeature());
17 |             
18 |             // For Bookings https://docs.servicestack.net/autoquery-crud-bookings
19 |             services.AddPlugin(new AutoQueryFeature {
20 |                 MaxLimit = 1000,
21 |                 //IncludeTotal = true,
22 |             });
23 |         })
24 |         .ConfigureAppHost(appHost => {
25 |             appHost.Resolve<ICrudEvents>().InitSchema();
26 |         });
27 | }


--------------------------------------------------------------------------------
/MyApp/_posts/authors.json:
--------------------------------------------------------------------------------
 1 | [
 2 |   {
 3 |     "name": "Lucy Bates",
 4 |     "email": "lucy@email.org",
 5 |     "bio": "Works in software design, company building, and the aerospace industry.",
 6 |     "profileUrl": "img/profiles/user1.svg",
 7 |     "twitterUrl": "https://twitter.com/lucy",
 8 |     "threadsUrl": "https://threads.net/@lucy",
 9 |     "gitHubUrl": "https://github.com/lucy"
10 |   },
11 |   {
12 |     "name": "Gayle Smith",
13 |     "email": "gayle@email.org",
14 |     "bio": "Gayle is an author, consultant, and founder focusing on improving tech.",
15 |     "profileUrl": "img/profiles/user2.svg",
16 |     "twitterUrl": "https://twitter.com/gayle",
17 |     "mastodonUrl": "https://mastodon.social/@gayle"
18 |   },
19 |   {
20 |     "name": "Brandon Foley",
21 |     "email": "brandon@email.org",
22 |     "bio": "I am a programmer at heart. I like to tinker with code and build generic coding structures.",
23 |     "profileUrl": "img/profiles/user3.svg",
24 |     "gitHubUrl": "https://github.com/brandon"
25 |   }
26 | ]


--------------------------------------------------------------------------------
/MyApp.Tests/MyApp.Tests.csproj:
--------------------------------------------------------------------------------
 1 | <Project Sdk="Microsoft.NET.Sdk">
 2 | 
 3 |     <PropertyGroup>
 4 |         <TargetFramework>net10.0</TargetFramework>
 5 |         <Nullable>enable</Nullable>
 6 |         <ImplicitUsings>enable</ImplicitUsings>
 7 |         <DebugType>portable</DebugType>
 8 |         <OutputType>Library</OutputType>
 9 |     </PropertyGroup>
10 | 
11 |     <ItemGroup>
12 |         <ProjectReference Include="..\MyApp.ServiceInterface\MyApp.ServiceInterface.csproj" />
13 |         <ProjectReference Include="..\MyApp.ServiceModel\MyApp.ServiceModel.csproj" />
14 |         <ProjectReference Include="..\MyApp\MyApp.csproj" />
15 | 
16 |         <PackageReference Include="NUnit" Version="4.*" />
17 |         <PackageReference Include="NUnit3TestAdapter" Version="5.*" />
18 |         <PackageReference Include="Microsoft.NET.Test.Sdk" Version="18.*" />
19 |         <PackageReference Include="ServiceStack" Version="10.*" />
20 |         <PackageReference Include="ServiceStack.Kestrel" Version="10.*" />
21 |     </ItemGroup>
22 | 
23 | </Project>
24 | 


--------------------------------------------------------------------------------
/MyApp/Components/Account/Shared/ShowRecoveryCodes.razor:
--------------------------------------------------------------------------------
 1 | <Heading3>Recovery codes</Heading3>
 2 | <div class="max-w-xl">
 3 |     <StatusMessage Message="@StatusMessage" />
 4 | 
 5 |     <Alert class="mt-4" Type="AlertType.Warning">
 6 |         <p class="mb-3">
 7 |             <strong>Put these codes in a safe place.</strong>
 8 |         </p>
 9 |         <p class="mb-3">
10 |             If you lose your device and don't have the recovery codes you will lose access to your account.
11 |         </p>
12 |     </Alert>
13 | 
14 |     <div class="mt-4">
15 |         @for (var row = 0; row < RecoveryCodes.Length; row += 2)
16 |         {
17 |             <code class="recovery-code">@RecoveryCodes[row]</code>
18 | 
19 |             <text>&nbsp;</text>
20 | 
21 |             <code class="recovery-code">@RecoveryCodes[row + 1]</code>
22 | 
23 |             <br />
24 |         }
25 |     </div>
26 | </div>
27 | 
28 | @code {
29 |     [Parameter]
30 |     public string[] RecoveryCodes { get; set; } = default!;
31 | 
32 |     [Parameter]
33 |     public string StatusMessage { get; set; } = default!;
34 | }
35 | 


--------------------------------------------------------------------------------
/MyApp.ServiceInterface/MyServices.cs:
--------------------------------------------------------------------------------
 1 | using ServiceStack;
 2 | using MyApp.ServiceModel;
 3 | using ServiceStack.OrmLite;
 4 | 
 5 | namespace MyApp.ServiceInterface;
 6 | 
 7 | public class MyServices : Service
 8 | {
 9 |     public object Any(Hello request)
10 |     {
11 |         return new HelloResponse { Result = $"Hello, {request.Name}!" };
12 |     }
13 | 
14 |     public async Task<object> Any(AdminData request)
15 |     {
16 |         var tables = new (string Label, Type Type)[] 
17 |         {
18 |             ("Bookings", typeof(Booking)),
19 |             ("Coupons",  typeof(Coupon)),
20 |         };
21 |         var dialect = Db.GetDialectProvider();
22 |         var totalSql = tables.Map(x => $"SELECT '{x.Label}', COUNT(*) FROM {dialect.GetQuotedTableName(x.Type.GetModelMetadata())}")
23 |             .Join(" UNION ");
24 |         var results = await Db.DictionaryAsync<string,int>(totalSql);
25 |         
26 |         return new AdminDataResponse {
27 |             PageStats = tables.Map(x => new PageStats {
28 |                 Label = x.Label, 
29 |                 Total = results[x.Label],
30 |             })
31 |         };
32 |     }
33 | }
34 | 


--------------------------------------------------------------------------------
/MyApp/Configure.OpenApi.cs:
--------------------------------------------------------------------------------
 1 | using ServiceStack;
 2 | 
 3 | [assembly: HostingStartup(typeof(MyApp.ConfigureOpenApi))]
 4 | 
 5 | namespace MyApp;
 6 | 
 7 | public class ConfigureOpenApi : IHostingStartup
 8 | {
 9 |     public void Configure(IWebHostBuilder builder) => builder
10 |         .ConfigureServices((context, services) => {
11 |             if (context.HostingEnvironment.IsDevelopment())
12 |             {
13 |                 services.AddEndpointsApiExplorer();
14 |                 services.AddSwaggerGen();
15 |                 services.AddServiceStackSwagger();
16 |                 services.AddBasicAuth<Data.ApplicationUser>();
17 |                 services.AddApiKeys();
18 |                 // services.AddJwtAuth();
19 |            
20 |                 services.AddTransient<IStartupFilter,StartupFilter>();
21 |             }
22 |         });
23 | 
24 |     public class StartupFilter : IStartupFilter
25 |     {
26 |         public Action<IApplicationBuilder> Configure(Action<IApplicationBuilder> next) => app =>
27 |         {
28 |             app.UseSwagger();
29 |             app.UseSwaggerUI();
30 |             next(app);
31 |         };
32 |     }
33 | }
34 | 


--------------------------------------------------------------------------------
/MyApp/Components/Pages/Videos.razor:
--------------------------------------------------------------------------------
 1 | @page "/videos"
 2 | 
 3 | <PageTitle>Video Library</PageTitle>
 4 | 
 5 | <div class="flex justify-center my-10">
 6 |     <div class="text-center">
 7 |         <svg class="text-indigo-600 w-36 h-36 inline-block" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path fill="currentColor" d="m18 16l-4-3.2V16H6V8h8v3.2L18 8m2-4H4a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2V6a2 2 0 0 0-2-2Z" /></svg>
 8 |         <h1 class="text-6xl md:text-7xl lg:text-8xl font-bold tracking-tighter leading-tight md:leading-none mb-12 text-center md:text-left">
 9 |             Videos
10 |         </h1>
11 |     </div>
12 | </div>
13 | 
14 | <VideoGroup
15 |     Title="Blazor Web Apps"
16 |     Summary="Use ServiceStack.Blazor Templates and Components to rapidly develop Blazor Web Apps"
17 |     Group="blazor"
18 |     LearnMore="https://servicestack.net/blazor"
19 |     Background="bg-slate-100 dark:bg-slate-800" />
20 | 
21 | <VideoGroup
22 |     Title="Vue Components"
23 |     Summary="Learn about productive features in our growing Vue Component Library"
24 |     Group="vue"
25 |     LearnMore="https://docs.servicestack.net/vue/" />
26 | 


--------------------------------------------------------------------------------
/.kamal/secrets:
--------------------------------------------------------------------------------
 1 | # Secrets defined here are available for reference under registry/password, env/secret, builder/secrets,
 2 | # and accessories/*/env/secret in config/deploy.yml. All secrets should be pulled from either
 3 | # password manager, ENV, or a file. DO NOT ENTER RAW CREDENTIALS HERE! This file needs to be safe for git.
 4 | 
 5 | # Option 1: Read secrets from the environment
 6 | KAMAL_REGISTRY_PASSWORD=$KAMAL_REGISTRY_PASSWORD
 7 | KAMAL_REGISTRY_USERNAME=$KAMAL_REGISTRY_USERNAME
 8 | SERVICESTACK_LICENSE=$SERVICESTACK_LICENSE
 9 | APPSETTINGS_JSON_BASE64=$APPSETTINGS_JSON_BASE64
10 | 
11 | # Option 2: Read secrets via a command
12 | # RAILS_MASTER_KEY=$(cat config/master.key)
13 | 
14 | # Option 3: Read secrets via kamal secrets helpers
15 | # These will handle logging in and fetching the secrets in as few calls as possible
16 | # There are adapters for 1Password, LastPass + Bitwarden
17 | #
18 | # SECRETS=$(kamal secrets fetch --adapter 1password --account my-account --from MyVault/MyItem KAMAL_REGISTRY_PASSWORD RAILS_MASTER_KEY)
19 | # KAMAL_REGISTRY_PASSWORD=$(kamal secrets extract KAMAL_REGISTRY_PASSWORD $SECRETS)
20 | # RAILS_MASTER_KEY=$(kamal secrets extract RAILS_MASTER_KEY $SECRETS)
21 | 


--------------------------------------------------------------------------------
/MyApp/wwwroot/posts/javascript.mjs:
--------------------------------------------------------------------------------
 1 | import { ref } from "vue"
 2 | import HelloApi from './components/HelloApi.mjs'
 3 | import VueComponentGallery from './components/VueComponentGallery.mjs'
 4 | import VueComponentLibrary from './components/VueComponentLibrary.mjs'
 5 | 
 6 | /** Simple inline component examples */
 7 | const Hello = {
 8 |     template: `<b>Hello, {{name}}!</b>`,
 9 |     props: { name: String }
10 | }
11 | const Counter = {
12 |     template: `<b @click="count++">Counter {{count}}</b>`,
13 |     setup() {
14 |         let count = ref(1)
15 |         return { count }
16 |     }
17 | }
18 | const Plugin = {
19 |     template: `<div>
20 |         <PrimaryButton @click="show=true">Open Modal</PrimaryButton>
21 |         <ModalDialog v-if="show" @done="show=false">
22 |             <div class="p-8">Hello @servicestack/vue!</div>
23 |         </ModalDialog>
24 |     </div>`,
25 |     setup() {
26 |         const show = ref(false)
27 |         return { show }
28 |     }
29 | }
30 | 
31 | export default {
32 |     components: {
33 |         Hello,
34 |         Counter,
35 |         Plugin,
36 |         HelloApi,
37 |         VueComponentGallery,
38 |         VueComponentLibrary,
39 |     }
40 | }
41 | 


--------------------------------------------------------------------------------
/MyApp/Configure.HealthChecks.cs:
--------------------------------------------------------------------------------
 1 | using Microsoft.Extensions.Diagnostics.HealthChecks;
 2 | 
 3 | [assembly: HostingStartup(typeof(MyApp.HealthChecks))]
 4 | 
 5 | namespace MyApp;
 6 | 
 7 | public class HealthChecks : IHostingStartup
 8 | {
 9 |     public class HealthCheck : IHealthCheck
10 |     {
11 |         public async Task<HealthCheckResult> CheckHealthAsync(HealthCheckContext context, CancellationToken token = default)
12 |         {
13 |             // Perform health check logic here
14 |             return HealthCheckResult.Healthy();
15 |         }
16 |     }
17 | 
18 |     public void Configure(IWebHostBuilder builder)
19 |     {
20 |         builder.ConfigureServices(services =>
21 |         {
22 |             services.AddHealthChecks()
23 |                 .AddCheck<HealthCheck>("HealthCheck");
24 | 
25 |             services.AddTransient<IStartupFilter, StartupFilter>();
26 |         });
27 |     }
28 |     
29 |     public class StartupFilter : IStartupFilter
30 |     {
31 |         public Action<IApplicationBuilder> Configure(Action<IApplicationBuilder> next)
32 |             => app => {
33 |                 app.UseHealthChecks("/up");
34 |                 next(app);
35 |             };
36 |     }
37 | }


--------------------------------------------------------------------------------
/MyApp.Tests/IntegrationTest.cs:
--------------------------------------------------------------------------------
 1 | using Funq;
 2 | using ServiceStack;
 3 | using NUnit.Framework;
 4 | using MyApp.ServiceInterface;
 5 | using MyApp.ServiceModel;
 6 | 
 7 | namespace MyApp.Tests;
 8 | 
 9 | public class IntegrationTest
10 | {
11 |     const string BaseUri = "http://localhost:2000/";
12 |     private readonly ServiceStackHost appHost;
13 | 
14 |     class AppHost : AppSelfHostBase
15 |     {
16 |         public AppHost() : base(nameof(IntegrationTest), typeof(MyServices).Assembly) { }
17 | 
18 |         public override void Configure(Container container)
19 |         {
20 |         }
21 |     }
22 | 
23 |     public IntegrationTest()
24 |     {
25 |         appHost = new AppHost()
26 |             .Init()
27 |             .Start(BaseUri);
28 |     }
29 | 
30 |     [OneTimeTearDown]
31 |     public void OneTimeTearDown() => appHost.Dispose();
32 | 
33 |     public IServiceClient CreateClient() => new JsonServiceClient(BaseUri);
34 | 
35 |     [Test]
36 |     public void Can_call_Hello_Service()
37 |     {
38 |         var client = CreateClient();
39 | 
40 |         var response = client.Get(new Hello { Name = "World" });
41 | 
42 |         Assert.That(response.Result, Is.EqualTo("Hello, World!"));
43 |     }
44 | }


--------------------------------------------------------------------------------
/MyApp/Properties/launchSettings.json:
--------------------------------------------------------------------------------
 1 | {
 2 |   "iisSettings": {
 3 |     "windowsAuthentication": false,
 4 |     "anonymousAuthentication": true,
 5 |     "iisExpress": {
 6 |       "applicationUrl": "https://localhost:5001/;http://localhost:5000/",
 7 |       "sslPort": 0
 8 |     }
 9 |   },
10 |   "profiles": {
11 |     "IIS Express": {
12 |       "commandName": "IISExpress",
13 |       "launchBrowser": true,
14 |       "environmentVariables": {
15 |         "ASPNETCORE_ENVIRONMENT": "Development"
16 |       }
17 |     },
18 |     "MyApp": {
19 |       "commandName": "Project",
20 |       "launchBrowser": true,
21 |       "environmentVariables": {
22 |         "ASPNETCORE_ENVIRONMENT": "Development"
23 |       },
24 |       "applicationUrl": "https://localhost:5001/;http://localhost:5000/"
25 |     },
26 |     "Watch": {
27 |       "commandName": "Executable",
28 |       "executablePath": "dotnet",
29 |       "workingDirectory": "$(ProjectDir)",
30 |       "hotReloadEnabled": true,
31 |       "hotReloadProfile" : "aspnetcore",
32 |       "commandLineArgs": "watch run",
33 |       "launchBrowser": true,
34 |       "environmentVariables": {
35 |         "ASPNETCORE_ENVIRONMENT": "Development"
36 |       }
37 |     }
38 |   }
39 | }


--------------------------------------------------------------------------------
/.vscode/launch.json:
--------------------------------------------------------------------------------
 1 | {
 2 |     // Use IntelliSense to learn about possible attributes.
 3 |     // Hover to view descriptions of existing attributes.
 4 |     // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
 5 |     "version": "0.2.0",
 6 |     "configurations": [
 7 |         {
 8 |             "name": ".NET Core Launch (web)",
 9 |             "type": "coreclr",
10 |             "request": "launch",
11 |             "preLaunchTask": "build",
12 |             "program": "${workspaceFolder}/MyApp/bin/Debug/net6.0/MyApp.dll",
13 |             "args": [],
14 |             "cwd": "${workspaceFolder}/MyApp",
15 |             "stopAtEntry": false,
16 |             "serverReadyAction": {
17 |                 "action": "openExternally",
18 |                 "pattern": "\\bNow listening on:\\s+(https?://\\S+)"
19 |             },
20 |             "env": {
21 |                 "ASPNETCORE_ENVIRONMENT": "Development"
22 |             },
23 |             "sourceFileMap": {
24 |                 "/Views": "${workspaceFolder}/Views"
25 |             }
26 |         },
27 |         {
28 |             "name": ".NET Core Attach",
29 |             "type": "coreclr",
30 |             "request": "attach"
31 |         }
32 |     ]
33 | }


--------------------------------------------------------------------------------
/.kamal/hooks/pre-connect.sample:
--------------------------------------------------------------------------------
 1 | #!/usr/bin/env ruby
 2 | 
 3 | # A sample pre-connect check
 4 | #
 5 | # Warms DNS before connecting to hosts in parallel
 6 | #
 7 | # These environment variables are available:
 8 | # KAMAL_RECORDED_AT
 9 | # KAMAL_PERFORMER
10 | # KAMAL_VERSION
11 | # KAMAL_HOSTS
12 | # KAMAL_ROLE (if set)
13 | # KAMAL_DESTINATION (if set)
14 | # KAMAL_RUNTIME
15 | 
16 | hosts = ENV["KAMAL_HOSTS"].split(",")
17 | results = nil
18 | max = 3
19 | 
20 | elapsed = Benchmark.realtime do
21 |   results = hosts.map do |host|
22 |     Thread.new do
23 |       tries = 1
24 | 
25 |       begin
26 |         Socket.getaddrinfo(host, 0, Socket::AF_UNSPEC, Socket::SOCK_STREAM, nil, Socket::AI_CANONNAME)
27 |       rescue SocketError
28 |         if tries < max
29 |           puts "Retrying DNS warmup: #{host}"
30 |           tries += 1
31 |           sleep rand
32 |           retry
33 |         else
34 |           puts "DNS warmup failed: #{host}"
35 |           host
36 |         end
37 |       end
38 | 
39 |       tries
40 |     end
41 |   end.map(&:value)
42 | end
43 | 
44 | retries = results.sum - hosts.size
45 | nopes = results.count { |r| r == max }
46 | 
47 | puts "Prewarmed %d DNS lookups in %.2f sec: %d retries, %d failures" % [ hosts.size, elapsed, retries, nopes ]
48 | 


--------------------------------------------------------------------------------
/MyApp/Components/Account/IdentityNoOpEmailSender.cs:
--------------------------------------------------------------------------------
 1 | using Microsoft.AspNetCore.Identity;
 2 | using Microsoft.AspNetCore.Identity.UI.Services;
 3 | using MyApp.Data;
 4 | 
 5 | namespace MyApp.Components.Account;
 6 | 
 7 | // Remove the "else if (EmailSender is IdentityNoOpEmailSender)" block from RegisterConfirmation.razor after updating with a real implementation.
 8 | internal sealed class IdentityNoOpEmailSender : IEmailSender<ApplicationUser>
 9 | {
10 |     private readonly IEmailSender emailSender = new NoOpEmailSender();
11 | 
12 |     public Task SendConfirmationLinkAsync(ApplicationUser user, string email, string confirmationLink) =>
13 |         emailSender.SendEmailAsync(email, "Confirm your email", $"Please confirm your account by <a href='{confirmationLink}'>clicking here</a>.");
14 | 
15 |     public Task SendPasswordResetLinkAsync(ApplicationUser user, string email, string resetLink) =>
16 |         emailSender.SendEmailAsync(email, "Reset your password", $"Please reset your password by <a href='{resetLink}'>clicking here</a>.");
17 | 
18 |     public Task SendPasswordResetCodeAsync(ApplicationUser user, string email, string resetCode) =>
19 |         emailSender.SendEmailAsync(email, "Reset your password", $"Please reset your password using the following code: {resetCode}");
20 | }
21 | 


--------------------------------------------------------------------------------
/MyApp.Tests/MigrationTasks.cs:
--------------------------------------------------------------------------------
 1 | using NUnit.Framework;
 2 | using ServiceStack.OrmLite;
 3 | using MyApp.Migrations;
 4 | using ServiceStack;
 5 | using ServiceStack.Data;
 6 | 
 7 | namespace MyApp.Tests;
 8 | 
 9 | [TestFixture, Explicit, Category(nameof(MigrationTasks))]
10 | public class MigrationTasks
11 | {
12 |     IDbConnectionFactory ResolveDbFactory() => new ConfigureDb().ConfigureAndResolve<IDbConnectionFactory>();
13 |     Migrator CreateMigrator() => new(ResolveDbFactory(), typeof(Migration1000).Assembly); 
14 |     
15 |     [Test]
16 |     public void Migrate()
17 |     {
18 |         var migrator = CreateMigrator();
19 |         var result = migrator.Run();
20 |         Assert.That(result.Succeeded);
21 |     }
22 | 
23 |     [Test]
24 |     public void Revert_All()
25 |     {
26 |         var migrator = CreateMigrator();
27 |         var result = migrator.Revert(Migrator.All);
28 |         Assert.That(result.Succeeded);
29 |     }
30 | 
31 |     [Test]
32 |     public void Revert_Last()
33 |     {
34 |         var migrator = CreateMigrator();
35 |         var result = migrator.Revert(Migrator.Last);
36 |         Assert.That(result.Succeeded);
37 |     }
38 | 
39 |     [Test]
40 |     public void Rerun_Last_Migration()
41 |     {
42 |         Revert_Last();
43 |         Migrate();
44 |     }
45 | }


--------------------------------------------------------------------------------
/MyApp/wwwroot/img/logo.svg:
--------------------------------------------------------------------------------
1 | <svg style="color:rgb(91, 33, 182)" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" preserveAspectRatio="xMidYMid meet" viewBox="0 0 24 24">
2 |     <path d="M23.834 8.101a13.912 13.912 0 0 1-13.643 11.72a10.105 10.105 0 0 1-1.994-.12a6.111 6.111 0 0 1-5.082-5.761a5.934 5.934 0 0 1 11.867-.084c.025.983-.401 1.846-1.277 1.871c-.936 0-1.374-.668-1.374-1.567v-2.5a1.531 1.531 0 0 0-1.52-1.533H8.715a3.648 3.648 0 1 0 2.695 6.08l.073-.11l.074.121a2.58 2.58 0 0 0 2.2 1.048a2.909 2.909 0 0 0 2.695-3.04a7.912 7.912 0 0 0-.217-1.933a7.404 7.404 0 0 0-14.64 1.603a7.497 7.497 0 0 0 7.308 7.405s.549.05 1.167.035a15.803 15.803 0 0 0 8.475-2.528c.036-.025.072.025.048.061a12.44 12.44 0 0 1-9.69 3.963a8.744 8.744 0 0 1-8.9-8.972a9.049 9.049 0 0 1 3.635-7.247a8.863 8.863 0 0 1 5.229-1.726h2.813a7.915 7.915 0 0 0 5.839-2.578a.11.11 0 0 1 .059-.034a.112.112 0 0 1 .12.053a.113.113 0 0 1 .015.067a7.934 7.934 0 0 1-1.227 3.549a.107.107 0 0 0-.014.06a.11.11 0 0 0 .073.095a.109.109 0 0 0 .062.004a8.505 8.505 0 0 0 5.913-4.876a.155.155 0 0 1 .055-.053a.15.15 0 0 1 .147 0a.153.153 0 0 1 .054.053A10.779 10.779 0 0 1 23.834 8.1zM8.895 11.628a2.188 2.188 0 1 0 2.188 2.188v-2.042a.158.158 0 0 0-.15-.15z" fill="currentColor"/>
3 | </svg>


--------------------------------------------------------------------------------
/MyApp/Components/Account/Pages/Manage/PersonalData.razor:
--------------------------------------------------------------------------------
 1 | @page "/Account/Manage/PersonalData"
 2 | 
 3 | @inject IdentityUserAccessor UserAccessor
 4 | 
 5 | <PageTitle>Personal Data</PageTitle>
 6 | 
 7 | <Heading3>Personal Data</Heading3>
 8 | 
 9 | <div class="max-w-xl">
10 |     <StatusMessage />
11 | 
12 |     <div class="flex flex-col gap-4">
13 |         <p>Your account contains personal data that you have given us. This page allows you to download or delete that data.</p>
14 |         <p>
15 |             <strong>Deleting this data will permanently remove your account, and this cannot be recovered.</strong>
16 |         </p>
17 |         <form id="download-data" action="Account/Manage/DownloadPersonalData" method="post">
18 |             <AntiforgeryToken />
19 |             <PrimaryButton type="submit">Download</PrimaryButton>
20 |         </form>
21 |         <p>
22 |             <PrimaryButton Style="ButtonStyle.Red" id="delete" href="Account/Manage/DeletePersonalData">Delete</PrimaryButton>
23 |         </p>
24 |     </div>
25 | </div>
26 | 
27 | @code {
28 |     [CascadingParameter]
29 |     private HttpContext HttpContext { get; set; } = default!;
30 | 
31 |     protected override async Task OnInitializedAsync()
32 |     {
33 |         _ = await UserAccessor.GetRequiredUserAsync(HttpContext);
34 |     }
35 | }
36 | 


--------------------------------------------------------------------------------
/MyApp/Configure.Db.cs:
--------------------------------------------------------------------------------
 1 | using Microsoft.EntityFrameworkCore;
 2 | using ServiceStack.Data;
 3 | using ServiceStack.OrmLite;
 4 | using MyApp.Data;
 5 | using Microsoft.EntityFrameworkCore.Diagnostics;
 6 | 
 7 | [assembly: HostingStartup(typeof(MyApp.ConfigureDb))]
 8 | 
 9 | namespace MyApp;
10 | 
11 | public class ConfigureDb : IHostingStartup
12 | {
13 |     public void Configure(IWebHostBuilder builder) => builder
14 |         .ConfigureServices((context, services) => {
15 |             var connectionString = context.Configuration.GetConnectionString("DefaultConnection")
16 |                                    ?? "DataSource=App_Data/app.db;Cache=Shared";
17 |             
18 |             services.AddOrmLite(options => options.UseSqlite(connectionString));
19 | 
20 |             // $ dotnet ef migrations add CreateIdentitySchema
21 |             // $ dotnet ef database update
22 |             services.AddDbContext<ApplicationDbContext>(options => {
23 |                 options.UseSqlite(connectionString, b => b.MigrationsAssembly(nameof(MyApp)));
24 |                 options.ConfigureWarnings(w => w.Ignore(RelationalEventId.PendingModelChangesWarning));
25 |             });
26 |             
27 |             // Enable built-in Database Admin UI at /admin-ui/database
28 |             services.AddPlugin(new AdminDatabaseFeature());
29 |         });
30 | }


--------------------------------------------------------------------------------
/.kamal/hooks/pre-build.sample:
--------------------------------------------------------------------------------
 1 | #!/bin/sh
 2 | 
 3 | # A sample pre-build hook
 4 | #
 5 | # Checks:
 6 | # 1. We have a clean checkout
 7 | # 2. A remote is configured
 8 | # 3. The branch has been pushed to the remote
 9 | # 4. The version we are deploying matches the remote
10 | #
11 | # These environment variables are available:
12 | # KAMAL_RECORDED_AT
13 | # KAMAL_PERFORMER
14 | # KAMAL_VERSION
15 | # KAMAL_HOSTS
16 | # KAMAL_ROLE (if set)
17 | # KAMAL_DESTINATION (if set)
18 | 
19 | if [ -n "$(git status --porcelain)" ]; then
20 |   echo "Git checkout is not clean, aborting..." >&2
21 |   git status --porcelain >&2
22 |   exit 1
23 | fi
24 | 
25 | first_remote=$(git remote)
26 | 
27 | if [ -z "$first_remote" ]; then
28 |   echo "No git remote set, aborting..." >&2
29 |   exit 1
30 | fi
31 | 
32 | current_branch=$(git branch --show-current)
33 | 
34 | if [ -z "$current_branch" ]; then
35 |   echo "Not on a git branch, aborting..." >&2
36 |   exit 1
37 | fi
38 | 
39 | remote_head=$(git ls-remote $first_remote --tags $current_branch | cut -f1)
40 | 
41 | if [ -z "$remote_head" ]; then
42 |   echo "Branch not pushed to remote, aborting..." >&2
43 |   exit 1
44 | fi
45 | 
46 | if [ "$KAMAL_VERSION" != "$remote_head" ]; then
47 |   echo "Version ($KAMAL_VERSION) does not match remote HEAD ($remote_head), aborting..." >&2
48 |   exit 1
49 | fi
50 | 
51 | exit 0
52 | 


--------------------------------------------------------------------------------
/MyApp/Configure.RequestLogs.cs:
--------------------------------------------------------------------------------
 1 | using ServiceStack.Jobs;
 2 | using ServiceStack.Web;
 3 | 
 4 | [assembly: HostingStartup(typeof(MyApp.ConfigureRequestLogs))]
 5 | 
 6 | namespace MyApp;
 7 | 
 8 | public class ConfigureRequestLogs : IHostingStartup
 9 | {
10 |     public void Configure(IWebHostBuilder builder) => builder
11 |         .ConfigureServices((context, services) => {
12 |             
13 |             services.AddPlugin(new RequestLogsFeature {
14 |                 RequestLogger = new SqliteRequestLogger(),
15 |                 // EnableResponseTracking = true,
16 |                 EnableRequestBodyTracking = true,
17 |                 EnableErrorTracking = true
18 |             });
19 |             services.AddHostedService<RequestLogsHostedService>();
20 |         });
21 | }
22 | 
23 | public class RequestLogsHostedService(ILogger<RequestLogsHostedService> log, IRequestLogger requestLogger) : BackgroundService
24 | {
25 |     protected override async Task ExecuteAsync(CancellationToken stoppingToken)
26 |     {
27 |         var dbRequestLogger = (SqliteRequestLogger)requestLogger;
28 |         using var timer = new PeriodicTimer(TimeSpan.FromSeconds(3));
29 |         while (!stoppingToken.IsCancellationRequested && await timer.WaitForNextTickAsync(stoppingToken))
30 |         {
31 |             await dbRequestLogger.TickAsync(log, stoppingToken);
32 |         }
33 |     }
34 | }
35 | 


--------------------------------------------------------------------------------
/MyApp/wwwroot/admin/sections/Bookings.mjs:
--------------------------------------------------------------------------------
 1 | export default {
 2 |     group: "Bookings",
 3 |     items: {
 4 |         Bookings: {
 5 |             type: 'Booking',
 6 |             component: {
 7 |                 template:`<AutoQueryGrid :type="type" 
 8 |                     selected-columns="id,name,roomType,roomNumber,bookingStartDate,bookingEndDate,cost,couponId,discount"
 9 |                     :header-titles="{ roomNumber:'Room No', bookingStartDate:'Start Date', bookingEndDate:'End Date', couponId:'Coupon' }"
10 |                     :visible-from="{ roomNumber:'lg', bookingEndDate:'xl', cost:'md', couponId:'xl', discount:'never' }">
11 |                   <template #formfooter="{ form, type, apis, model, id }">
12 |                     <AuditEvents v-if="form === 'edit'" class="mt-4" :key="id" :type="type" :id="id" />
13 |                   </template>
14 |                 </AutoQueryGrid>`,
15 |             },
16 |         },
17 |         Coupons: {
18 |             type: 'Coupon',
19 |             component: {
20 |                 template:`<AutoQueryGrid :type="type" 
21 |                     selected-columns="id,name,description,discount,expiryDate">
22 |                   <template #formfooter="{ form, type, apis, model, id }">
23 |                     <AuditEvents v-if="form === 'edit'" class="mt-4" :key="id" :type="type" :id="id" />
24 |                   </template>
25 |                 </AutoQueryGrid>`,
26 |             },
27 |         },
28 |     },
29 | }
30 | 


--------------------------------------------------------------------------------
/MyApp/Components/Pages/Docs.razor:
--------------------------------------------------------------------------------
 1 | @page "/{Slug:regex(^[-\\w]+$)}"
 2 | @inherits AppComponentBase
 3 | @inject MarkdownPages Markdown
 4 | 
 5 | @if (doc != null)
 6 | {
 7 |     <PageTitle>@doc.Title</PageTitle>
 8 | 
 9 |     <div class="mx-auto">
10 |         <section class="text-center mt-16 mb-16 md:mb-12">
11 |             <h1 class="text-4xl tracking-tight font-extrabold text-gray-900 dark:text-gray-50 sm:text-5xl md:text-6xl">
12 |                 @doc.Title
13 |             </h1>
14 |         </section>
15 |         <div class="mx-auto prose lg:prose-xl mb-24">
16 |             @BlazorHtml.Raw(doc.Preview)
17 |         </div>
18 |     </div>
19 | }
20 | else
21 | {
22 |     <div class="mt-3 mb-20 mx-auto max-w-fit">
23 |         @if (error != null)
24 |         {
25 |             <ErrorSummary Status=@error />
26 |         }
27 |         else
28 |         {
29 |             <Loading />
30 |         }
31 |     </div>
32 | }
33 | 
34 | @code {
35 |     [Parameter]
36 |     public required string Slug { get; set; }
37 | 
38 |     MarkdownFileInfo? doc;
39 |     ResponseStatus? error;
40 | 
41 |     void load()
42 |     {
43 |         doc = Markdown.GetBySlug(Slug);
44 |         if (doc == null)
45 |         {
46 |             error = new() { Message = $"_pages/{Slug}.md was not found" };
47 |             return;
48 |         }
49 |     }
50 | 
51 |     protected override void OnInitialized() => load();
52 | 
53 |     protected override void OnParametersSet() => load();
54 | }
55 | 


--------------------------------------------------------------------------------
/MyApp/Components/App.razor:
--------------------------------------------------------------------------------
 1 | <!DOCTYPE html>
 2 | <html lang="en">
 3 | 
 4 | <head>
 5 |     <meta charset="utf-8" />
 6 |     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
 7 |     <base href="/" />
 8 |     <link rel="icon" href="/img/logo.svg" type="image/svg+xml">
 9 |     <link rel="stylesheet" href="css/app.css" />
10 |     <link rel="stylesheet" href="css/typography.css">
11 |     <link rel="stylesheet" href="css/highlight.css">
12 |     <link rel="stylesheet" href="css/lite-yt-embed.css">
13 |     @BlazorHtml.ImportMap(new()
14 |     {
15 |         ["app.mjs"] =              ("/mjs/app.mjs",                     "/mjs/app.mjs"),
16 |         ["vue"] =                  ("/lib/mjs/vue.mjs",                 "/lib/mjs/vue.min.mjs"),
17 |         ["@servicestack/client"] = ("/lib/mjs/servicestack-client.mjs", "/lib/mjs/servicestack-client.min.mjs"),
18 |         ["@servicestack/vue"] =    ("/lib/mjs/servicestack-vue.mjs",    "/lib/mjs/servicestack-vue.min.mjs"),
19 |         ["dtos.mjs"] =             ("/mjs/dtos.mjs",                    "/mjs/dtos.mjs"),
20 |     })
21 | 
22 |     <HeadOutlet />
23 | </head>
24 | 
25 | <body class="bg-white dark:bg-black dark:text-white">
26 |     <Routes />
27 |     <script src="_framework/blazor.web.js"></script>
28 |     <script src="js/servicestack-blazor.js"></script>
29 |     <script>JS.init({ colorScheme:false })</script>
30 |     <script src="lib/js/lite-yt-embed.js"></script>
31 |     <script src="lib/js/highlight.js"></script>
32 |     <script>hljs.highlightAll()</script>
33 | </body>
34 | 
35 | </html>
36 | 


--------------------------------------------------------------------------------
/MyApp/Configure.AI.Chat.cs:
--------------------------------------------------------------------------------
 1 | using ServiceStack.AI;
 2 | 
 3 | [assembly: HostingStartup(typeof(MyApp.ConfigureAiChat))]
 4 | 
 5 | namespace MyApp;
 6 | 
 7 | public class ConfigureAiChat : IHostingStartup
 8 | {
 9 |     public void Configure(IWebHostBuilder builder) => builder
10 |         .ConfigureServices((context, services) => {
11 | 
12 |             // Docs: https://docs.servicestack.net/ai-chat-api
13 |             services.AddPlugin(new ChatFeature {
14 |                 EnableProviders = [
15 |                     "servicestack",
16 |                     // "groq",
17 |                     // "google_free",
18 |                     // "openrouter_free",
19 |                     // "ollama",
20 |                     // "google",
21 |                     // "anthropic",
22 |                     // "openai",
23 |                     // "grok",
24 |                     // "qwen",
25 |                     // "z.ai",
26 |                     // "mistral",
27 |                     // "openrouter",
28 |                 ]
29 |             });
30 | 
31 |             // Persist AI Chat History, enables analytics at /admin-ui/chat
32 |             services.AddSingleton<IChatStore, DbChatStore>();
33 |             // Or store history in monthly partitioned tables in PostgreSQL:
34 |             // services.AddSingleton<IChatStore, PostgresChatStore>();
35 |             
36 |             // Add AI Chat link to /metadata
37 |             services.ConfigurePlugin<MetadataFeature>(feature => {
38 |                 feature.AddPluginLink("/chat", "AI Chat");
39 |             });
40 |         });
41 | }


--------------------------------------------------------------------------------
/load-env.sh:
--------------------------------------------------------------------------------
 1 | #!/usr/bin/env bash
 2 | 
 3 | # Load variables from the .env file into the current shell so they're available to kamal and other commands.
 4 | # NOTE: This script must be *sourced*, not executed, e.g.:
 5 | #   source load-env.sh
 6 | # or
 7 | #   . ./load-env.sh
 8 | 
 9 | # Add the necessary variables used by ./config/deploy.yml to .env file, e.g:
10 | # - GITHUB_REPOSITORY=org/repo         # Repo name used to derive image/service name and folder paths
11 | # - KAMAL_DEPLOY_IP=100.100.100.100    # IP address of server to deploy to
12 | # - KAMAL_DEPLOY_HOST=www.example.org  # domain name of website
13 | # - KAMAL_REGISTRY_USERNAME=user       # Container registry credentials (for ghcr.io)
14 | # - KAMAL_REGISTRY_PASSWORD=ghp_xxx      
15 | # Login with:
16 | # echo $KAMAL_REGISTRY_PASSWORD | docker login ghcr.io -u mythz --password-stdin
17 | 
18 | # If this script is run directly (./load-env.sh), print a warning because
19 | # environment changes will not persist in the parent shell.
20 | if [[ "${BASH_SOURCE[0]}" == "$0" ]]; then
21 |   echo "[load-env] This script must be sourced to affect the current shell:" >&2
22 |   echo "  source load-env.sh" >&2
23 |   exit 1
24 | fi
25 | 
26 | SCRIPT_DIR="$(cd "$(dirname "${BASH_SOURCE[0]}")" && pwd)"
27 | ENV_FILE="$SCRIPT_DIR/.env"
28 | 
29 | if [[ ! -f "$ENV_FILE" ]]; then
30 |   echo "[load-env] No .env file found at: $ENV_FILE" >&2
31 |   return 1
32 | fi
33 | 
34 | # Auto-export all variables defined while the script runs
35 | set -a
36 | source "$ENV_FILE"
37 | set +a
38 | 
39 | echo "[load-env] Loaded environment variables from $ENV_FILE"
40 | 


--------------------------------------------------------------------------------
/.github/workflows/build.yml:
--------------------------------------------------------------------------------
 1 | name: Build
 2 | 
 3 | on:
 4 |   pull_request: {}
 5 |   push:
 6 |     branches:
 7 |       - '**'        # matches every branch
 8 | 
 9 | jobs:
10 |   build:
11 |     runs-on: ubuntu-latest
12 |     steps:
13 |       - name: checkout
14 |         uses: actions/checkout@v5
15 | 
16 |       - name: Setup dotnet
17 |         uses: actions/setup-dotnet@v5
18 |         with:
19 |           dotnet-version: 10.0.x
20 | 
21 |       - name: Restore NuGet packages
22 |         run: dotnet restore MyApp.slnx
23 | 
24 |       # If your feed requires authentication, enable and configure the step below.
25 |       # This example uses a Personal Access Token stored in secrets.NUGET_API_KEY.
26 |       # Alternatively, you can use the NuGet Authenticate action from Azure Pipelines.
27 |       # - name: Authenticate private NuGet feed
28 |       #   env:
29 |       #     NUGET_API_KEY: ${{ secrets.NUGET_API_KEY }}
30 |       #   run: |
31 |       #     dotnet nuget add source "https://YOUR_FEED_URL/index.json" \
32 |       #       --name "PrivateFeed" \
33 |       #       --username "YOUR_USERNAME" \
34 |       #       --password "$NUGET_API_KEY" \
35 |       #       --store-password-in-clear-text
36 | 
37 |       - name: build
38 |         run: dotnet build --no-restore
39 |         working-directory: .
40 | 
41 |       - name: test
42 |         run: |
43 |           dotnet test
44 |           if [ $? -eq 0 ]; then
45 |             echo TESTS PASSED
46 |           else
47 |             echo TESTS FAILED
48 |             exit 1
49 |           fi
50 |         working-directory: ./MyApp.Tests
51 | 
52 | 


--------------------------------------------------------------------------------
/MyApp/Components/Account/Pages/ConfirmEmail.razor:
--------------------------------------------------------------------------------
 1 | @page "/Account/ConfirmEmail"
 2 | 
 3 | @using System.Text
 4 | @using Microsoft.AspNetCore.Identity
 5 | @using Microsoft.AspNetCore.WebUtilities
 6 | @using MyApp.Data
 7 | 
 8 | @inject UserManager<ApplicationUser> UserManager
 9 | @inject IdentityRedirectManager RedirectManager
10 | 
11 | <PageTitle>Confirm email</PageTitle>
12 | 
13 | <div class="mt-8 mx-auto max-w-lg">
14 |     <Heading1>Confirm email</Heading1>
15 | 
16 |     <StatusMessage Message="@statusMessage" />
17 | </div>
18 | 
19 | @code {
20 |     private string? statusMessage;
21 | 
22 |     [CascadingParameter]
23 |     private HttpContext HttpContext { get; set; } = default!;
24 | 
25 |     [SupplyParameterFromQuery]
26 |     private string? UserId { get; set; }
27 | 
28 |     [SupplyParameterFromQuery]
29 |     private string? Code { get; set; }
30 | 
31 |     protected override async Task OnInitializedAsync()
32 |     {
33 |         if (UserId is null || Code is null)
34 |         {
35 |             RedirectManager.RedirectTo("");
36 |         }
37 | 
38 |         var user = await UserManager.FindByIdAsync(UserId);
39 |         if (user is null)
40 |         {
41 |             HttpContext.Response.StatusCode = StatusCodes.Status404NotFound;
42 |             statusMessage = $"Error loading user with ID {UserId}";
43 |         }
44 |         else
45 |         {
46 |             var code = Encoding.UTF8.GetString(WebEncoders.Base64UrlDecode(Code));
47 |             var result = await UserManager.ConfirmEmailAsync(user, code);
48 |             statusMessage = result.Succeeded ? "Thank you for confirming your email." : "Error confirming your email.";
49 |         }
50 |     }
51 | }
52 | 


--------------------------------------------------------------------------------
/MyApp/Components/Account/Shared/ExternalLoginPicker.razor:
--------------------------------------------------------------------------------
 1 | @using Microsoft.AspNetCore.Authentication
 2 | @using Microsoft.AspNetCore.Identity
 3 | @using MyApp.Data
 4 | 
 5 | @inject SignInManager<ApplicationUser> SignInManager
 6 | @inject IdentityRedirectManager RedirectManager
 7 | 
 8 | @if (externalLogins.Length == 0)
 9 | {
10 |     <div>
11 |         <p>
12 |             There are no external authentication services configured.
13 |             See this <HyperLink href="https://go.microsoft.com/fwlink/?LinkID=532715">article
14 |             about setting up this ASP.NET application to support logging in via external services</HyperLink>.
15 |         </p>
16 |     </div>
17 | }
18 | else
19 | {
20 |     <form id="external-account" class="form-horizontal" action="Account/PerformExternalLogin" method="post">
21 |         <div>
22 |             <AntiforgeryToken />
23 |             <input type="hidden" name="ReturnUrl" value="@ReturnUrl" />
24 |             <div class="space-x-2">
25 |                 @foreach (var provider in externalLogins)
26 |                 {
27 |                     <button type="submit" class="@SecondaryButton.Classes" name="provider" value="@provider.Name" title="Log in using your @provider.DisplayName account">@provider.DisplayName</button>
28 |                 }
29 |             </div>
30 |         </div>
31 |     </form>
32 | }
33 | 
34 | @code {
35 |     private AuthenticationScheme[] externalLogins = [];
36 | 
37 |     [SupplyParameterFromQuery]
38 |     private string? ReturnUrl { get; set; }
39 | 
40 |     protected override async Task OnInitializedAsync()
41 |     {
42 |         externalLogins = (await SignInManager.GetExternalAuthenticationSchemesAsync()).ToArray();
43 |     }
44 | }
45 | 


--------------------------------------------------------------------------------
/MyApp/Components/Pages/Posts/Author.razor:
--------------------------------------------------------------------------------
 1 | @page "/posts/author/{Slug}"
 2 | @inject MarkdownBlog Blog
 3 | @inject AppConfig AppConfig
 4 | 
 5 | @if (author != null)
 6 | {
 7 |     <PageTitle>@author.Name posts</PageTitle>
 8 | 
 9 |     <div class="relative bg-gray-50 dark:bg-gray-900 px-6 pt-16 pb-20 lg:px-8 lg:pt-24 lg:pb-28">
10 |         <div class="absolute inset-0">
11 |             <div class="h-1/3 bg-white dark:bg-black sm:h-2/3"></div>
12 |         </div>
13 |         <div class="relative mx-auto max-w-7xl">
14 |             <BlogTitle Heading=@($"All posts written by <b>{author.Name}</b>") />
15 |         </div>
16 |         <div class="mt-12 relative mx-auto max-w-7xl">
17 |             <BlogPosts Posts=@Blog.GetPosts(author: author.Name) />
18 | 
19 |             <div class="mt-8 text-center">
20 |                 <a class="text-sm font-semibold hover:underline" href="@Blog.GetPostsLink()">view all posts</a>
21 |             </div>
22 |         </div>
23 |     </div>
24 | }
25 | else
26 | {
27 |     <div class="mt-3 mb-20 mx-auto max-w-fit">
28 |     @if (error != null)
29 |     {
30 |         <ErrorSummary Status=@error />
31 |     }
32 |     else
33 |     {
34 |         <Loading />
35 |     }
36 |     </div>
37 | }
38 | 
39 | @code {
40 |     [Parameter] public required string Slug { get; set; }
41 | 
42 |     AuthorInfo? author;
43 |     ResponseStatus? error;
44 | 
45 |     void load()
46 |     {
47 |         author = Blog.GetAuthorBySlug(Slug);
48 |         if (author == null)
49 |         {
50 |             error = new() { Message = $"Author '{Slug}' was not found" };
51 |             return;
52 |         }
53 |     }
54 | 
55 |     protected override void OnInitialized() => load();
56 | 
57 |     protected override void OnParametersSet() => load();
58 | }
59 | 


--------------------------------------------------------------------------------
/MyApp/Components/Pages/Error.razor:
--------------------------------------------------------------------------------
 1 | @page "/Error"
 2 | @using System.Diagnostics
 3 | 
 4 | <PageTitle>Error</PageTitle>
 5 | 
 6 | <div class="mx-auto">
 7 |     <section class="text-center mt-16 mb-16 md:mb-12">
 8 |         <h1 class="text-4xl tracking-tight font-extrabold text-gray-900 dark:text-gray-50 sm:text-5xl md:text-6xl">
 9 |             Error.
10 |         </h1>
11 |         <Heading2 class="text-danger">An error occurred while processing your request.</Heading2>
12 |     </section>
13 |     <div class="mx-auto prose lg:prose-xl mb-24">
14 |         @if (ShowRequestId)
15 |         {
16 |             <p>
17 |                 <strong>Request ID:</strong> <code>@RequestId</code>
18 |             </p>
19 |         }
20 | 
21 |         <h3>Development Mode</h3>
22 |         <p>
23 |             Swapping to <strong>Development</strong> environment will display more detailed information about the error that occurred.
24 |         </p>
25 |         <p>
26 |             <strong>The Development environment shouldn't be enabled for deployed applications.</strong>
27 |             It can result in displaying sensitive information from exceptions to end users.
28 |             For local debugging, enable the <strong>Development</strong> environment by setting the <strong>ASPNETCORE_ENVIRONMENT</strong> environment variable to <strong>Development</strong>
29 |             and restarting the app.
30 |         </p>
31 |     </div>
32 | </div>
33 | 
34 | @code {
35 |     [CascadingParameter] public HttpContext? HttpContext { get; set; }
36 | 
37 |     public string? RequestId { get; set; }
38 |     public bool ShowRequestId => !string.IsNullOrEmpty(RequestId);
39 | 
40 |     protected override void OnInitialized() =>
41 |         RequestId = Activity.Current?.Id ?? HttpContext?.TraceIdentifier;
42 | }
43 | 


--------------------------------------------------------------------------------
/MyApp/Configure.Markdown.cs:
--------------------------------------------------------------------------------
 1 | using ServiceStack.IO;
 2 | 
 3 | [assembly: HostingStartup(typeof(MyApp.ConfigureMarkdown))]
 4 | 
 5 | namespace MyApp;
 6 | 
 7 | public class ConfigureMarkdown : IHostingStartup
 8 | {
 9 |     public void Configure(IWebHostBuilder builder) => builder
10 |         .ConfigureServices(services => {
11 |             services.AddSingleton<MarkdownIncludes>();
12 |             services.AddSingleton<MarkdownPages>();
13 |             services.AddSingleton<MarkdownVideos>();
14 |             services.AddSingleton<MarkdownBlog>();
15 |             services.AddSingleton<MarkdownMeta>();
16 |         })
17 |         .ConfigureAppHost(afterPluginsLoaded: appHost => {
18 |             MarkdigConfig.Set(new MarkdigConfig
19 |             {
20 |                 ConfigurePipeline = pipeline =>
21 |                 {
22 |                     // Extend Markdig Pipeline
23 |                 },
24 |                 ConfigureContainers = config =>
25 |                 {
26 |                     config.AddBuiltInContainers();
27 |                     // Add Custom Block or Inline containers
28 |                 }
29 |             });
30 | 
31 |             var includes = appHost.Resolve<MarkdownIncludes>();
32 |             var pages = appHost.Resolve<MarkdownPages>();
33 |             var videos = appHost.Resolve<MarkdownVideos>();
34 |             var blogPosts = appHost.Resolve<MarkdownBlog>();
35 |             var meta = appHost.Resolve<MarkdownMeta>();
36 | 
37 |             meta.Features = [pages, videos, blogPosts];
38 |             
39 |             includes.LoadFrom("_includes");
40 |             pages.LoadFrom("_pages");
41 |             videos.LoadFrom("_videos");
42 |             blogPosts.LoadFrom("_posts");
43 |         });
44 | }
45 | 
46 | // Add additional frontmatter info to include
47 | public class MarkdownFileInfo : MarkdownFileBase
48 | {
49 | }
50 | 


--------------------------------------------------------------------------------
/MyApp/Components/Shared/ShellCommand.razor:
--------------------------------------------------------------------------------
 1 | @inject IJSRuntime JS
 2 | 
 3 | <div class=@CssUtils.ClassNames("lang relative bg-gray-700 text-gray-300 pl-5 py-3 sm:rounded flex", @class)>
 4 |     <div class="flex ml-2 w-full justify-between cursor-pointer" @onclick="copyCommand">
 5 |         <label @ref="elCmd">@ChildContent</label>
 6 |         <small class="text-xs text-gray-400 px-3 -mt-1">sh</small>
 7 |     </div>
 8 | @if (SuccessText != string.Empty)
 9 | {
10 |     <div class="absolute right-0 -mr-28 -mt-3 rounded-md bg-green-50 p-3">
11 |         <div class="flex">
12 |             <div class="flex-shrink-0">
13 |                 <svg class="h-5 w-5 text-green-400" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true">
14 |                     <path fill-rule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.857-9.809a.75.75 0 00-1.214-.882l-3.483 4.79-1.88-1.88a.75.75 0 10-1.06 1.061l2.5 2.5a.75.75 0 001.137-.089l4-5.5z" clip-rule="evenodd" />
15 |                 </svg>
16 |             </div>
17 |             <div class="ml-3">
18 |                 <p class="text-sm font-medium text-green-800">
19 |                     @SuccessText
20 |                 </p>
21 |             </div>
22 |         </div>
23 |     </div>
24 | }
25 | </div>
26 | 
27 | @code {
28 |     [Parameter]
29 |     public string? @class { get; set; }
30 | 
31 |     [Parameter]
32 |     public RenderFragment? ChildContent { get; set; }
33 | 
34 |     string SuccessText { get; set; } = string.Empty;
35 | 
36 |     private ElementReference elCmd;
37 | 
38 |     async Task copyCommand(MouseEventArgs e)
39 |     {
40 |         SuccessText = "copied";
41 |         var text = await JS.InvokeAsync<string>("JS.invoke", elCmd, "innerText");
42 |         await JS.InvokeVoidAsync("navigator.clipboard.writeText", text);
43 |         await Task.Delay(3_000);
44 |         SuccessText = string.Empty;
45 |     }
46 | }
47 | 


--------------------------------------------------------------------------------
/MyApp.ServiceInterface/Data/CustomUserSession.cs:
--------------------------------------------------------------------------------
 1 | using System.Security.Claims;
 2 | using Microsoft.AspNetCore.Identity;
 3 | using Microsoft.Extensions.Options;
 4 | using ServiceStack;
 5 | using ServiceStack.Web;
 6 | 
 7 | namespace MyApp.Data;
 8 | 
 9 | public class CustomUserSession : AuthUserSession
10 | {
11 |     public override void PopulateFromClaims(IRequest httpReq, ClaimsPrincipal principal)
12 |     {
13 |         // Populate Session with data from Identity Auth Claims
14 |         ProfileUrl = principal.FindFirstValue(JwtClaimTypes.Picture);
15 |     }
16 | }
17 | 
18 | /// <summary>
19 | /// Add additional claims to the Identity Auth Cookie
20 | /// </summary>
21 | public class AdditionalUserClaimsPrincipalFactory(
22 |     UserManager<ApplicationUser> userManager,
23 |     RoleManager<IdentityRole> roleManager,
24 |     IApiKeySource apiKeySource,
25 |     IOptions<IdentityOptions> optionsAccessor)
26 |     : UserClaimsPrincipalFactory<ApplicationUser,IdentityRole>(userManager, roleManager, optionsAccessor)
27 | {
28 |     public override async Task<ClaimsPrincipal> CreateAsync(ApplicationUser user)
29 |     {
30 |         var principal = await base.CreateAsync(user);
31 |         var identity = (ClaimsIdentity)principal.Identity!;
32 | 
33 |         var claims = new List<Claim>();
34 |         // Add additional claims here
35 |         if (user.ProfileUrl != null)
36 |         {
37 |             claims.Add(new Claim(JwtClaimTypes.Picture, user.ProfileUrl));
38 |         }
39 |         
40 |         // Add Users latest API Key to Auth Cookie (Allows [ValidateApiKey] with User Auth)
41 |         var latestApiKey = (await apiKeySource.GetApiKeysByUserIdAsync(user.Id))
42 |             .OrderByDescending(x => x.CreatedDate)
43 |             .FirstOrDefault();
44 |         if (latestApiKey != null)
45 |         {
46 |             claims.Add(new Claim(JwtClaimTypes.ApiKey, latestApiKey.Key));
47 |         }
48 | 
49 |         identity.AddClaims(claims);
50 |         return principal;
51 |     }
52 | }
53 | 


--------------------------------------------------------------------------------
/MyApp/wwwroot/lib/typings/@vue/compiler-dom.d.ts:
--------------------------------------------------------------------------------
 1 | import { ParserOptions, NodeTransform, SourceLocation, CompilerError, DirectiveTransform, RootNode, CompilerOptions, CodegenResult } from '@vue/compiler-core';
 2 | export * from '@vue/compiler-core';
 3 | 
 4 | export declare const parserOptions: ParserOptions;
 5 | 
 6 | export declare const V_MODEL_RADIO: unique symbol;
 7 | export declare const V_MODEL_CHECKBOX: unique symbol;
 8 | export declare const V_MODEL_TEXT: unique symbol;
 9 | export declare const V_MODEL_SELECT: unique symbol;
10 | export declare const V_MODEL_DYNAMIC: unique symbol;
11 | export declare const V_ON_WITH_MODIFIERS: unique symbol;
12 | export declare const V_ON_WITH_KEYS: unique symbol;
13 | export declare const V_SHOW: unique symbol;
14 | export declare const TRANSITION: unique symbol;
15 | export declare const TRANSITION_GROUP: unique symbol;
16 | 
17 | export declare const transformStyle: NodeTransform;
18 | 
19 | interface DOMCompilerError extends CompilerError {
20 |     code: DOMErrorCodes;
21 | }
22 | export declare function createDOMCompilerError(code: DOMErrorCodes, loc?: SourceLocation): DOMCompilerError;
23 | export declare enum DOMErrorCodes {
24 |     X_V_HTML_NO_EXPRESSION = 53,
25 |     X_V_HTML_WITH_CHILDREN = 54,
26 |     X_V_TEXT_NO_EXPRESSION = 55,
27 |     X_V_TEXT_WITH_CHILDREN = 56,
28 |     X_V_MODEL_ON_INVALID_ELEMENT = 57,
29 |     X_V_MODEL_ARG_ON_ELEMENT = 58,
30 |     X_V_MODEL_ON_FILE_INPUT_ELEMENT = 59,
31 |     X_V_MODEL_UNNECESSARY_VALUE = 60,
32 |     X_V_SHOW_NO_EXPRESSION = 61,
33 |     X_TRANSITION_INVALID_CHILDREN = 62,
34 |     X_IGNORED_SIDE_EFFECT_TAG = 63,
35 |     __EXTEND_POINT__ = 64
36 | }
37 | export declare const DOMErrorMessages: {
38 |     [code: number]: string;
39 | };
40 | 
41 | export declare const DOMNodeTransforms: NodeTransform[];
42 | export declare const DOMDirectiveTransforms: Record<string, DirectiveTransform>;
43 | export declare function compile(src: string | RootNode, options?: CompilerOptions): CodegenResult;
44 | export declare function parse(template: string, options?: ParserOptions): RootNode;
45 | 
46 | 


--------------------------------------------------------------------------------
/MyApp/Components/Pages/Weather.razor:
--------------------------------------------------------------------------------
 1 | @page "/weather"
 2 | @attribute [StreamRendering(true)]
 3 | 
 4 | <PageTitle>Weather</PageTitle>
 5 | 
 6 | <div class="mt-8 mb-20 mx-auto max-w-screen-md">
 7 |     <Heading1>Weather</Heading1>
 8 | 
 9 |     <p class="my-4">This component demonstrates showing data.</p>
10 | 
11 |     @if (forecasts == null)
12 |     {
13 |         <Loading />
14 |     }
15 |     else
16 |     {
17 |         <DataGrid Items=@forecasts class="max-w-screen-md" TableStyle="TableStyle.StripedRows | TableStyle.UppercaseHeadings">
18 |             <Column Field="(WeatherForecast x) => x.Date" Format="dd/MM/yyyy" />
19 |             <Column Title="Temp. (C)" Field="(WeatherForecast x) => x.TemperatureC" />
20 |             <Column Title="Temp. (F)" Field="(WeatherForecast x) => x.TemperatureF" />
21 |             <Column Field="(WeatherForecast x) => x.Summary" />
22 |         </DataGrid>
23 |     }
24 | 
25 |     <div>
26 |         <div class="mt-5 flex justify-center gap-x-4">
27 |             <SrcRazorPage Path="Weather.razor" />
28 |         </div>
29 |     </div>
30 | </div>
31 | 
32 | @code {
33 |     private WeatherForecast[]? forecasts;
34 | 
35 |     protected override async Task OnInitializedAsync()
36 |     {
37 |         // Simulate asynchronous loading to demonstrate streaming rendering
38 |         await Task.Delay(500);
39 | 
40 |         var startDate = DateOnly.FromDateTime(DateTime.Now);
41 |         var summaries = new[] { "Freezing", "Bracing", "Chilly", "Cool", "Mild", "Warm", "Balmy", "Hot", "Sweltering", "Scorching" };
42 |         forecasts = Enumerable.Range(1, 5).Select(index => new WeatherForecast
43 |         {
44 |             Date = startDate.AddDays(index),
45 |             TemperatureC = Random.Shared.Next(-20, 55),
46 |             Summary = summaries[Random.Shared.Next(summaries.Length)]
47 |         }).ToArray();
48 |     }
49 | 
50 |     public class WeatherForecast
51 |     {
52 |         public DateOnly Date { get; set; }
53 |         public int TemperatureC { get; set; }
54 |         public string? Summary { get; set; }
55 |         public int TemperatureF => 32 + (int)(TemperatureC / 0.5556);
56 |     }
57 | }
58 | 


--------------------------------------------------------------------------------
/MyApp/Components/Account/IdentityRevalidatingAuthenticationStateProvider.cs:
--------------------------------------------------------------------------------
 1 | using Microsoft.AspNetCore.Components.Authorization;
 2 | using Microsoft.AspNetCore.Components.Server;
 3 | using Microsoft.AspNetCore.Identity;
 4 | using Microsoft.Extensions.Options;
 5 | using MyApp.Data;
 6 | using System.Security.Claims;
 7 | 
 8 | namespace MyApp.Components.Account;
 9 | 
10 | // This is a server-side AuthenticationStateProvider that revalidates the security stamp for the connected user
11 | // every 30 minutes an interactive circuit is connected.
12 | internal sealed class IdentityRevalidatingAuthenticationStateProvider(
13 |         ILoggerFactory loggerFactory,
14 |         IServiceScopeFactory scopeFactory,
15 |         IOptions<IdentityOptions> options)
16 |     : RevalidatingServerAuthenticationStateProvider(loggerFactory)
17 | {
18 |     protected override TimeSpan RevalidationInterval => TimeSpan.FromMinutes(30);
19 | 
20 |     protected override async Task<bool> ValidateAuthenticationStateAsync(
21 |         AuthenticationState authenticationState, CancellationToken cancellationToken)
22 |     {
23 |         // Get the user manager from a new scope to ensure it fetches fresh data
24 |         await using var scope = scopeFactory.CreateAsyncScope();
25 |         var userManager = scope.ServiceProvider.GetRequiredService<UserManager<ApplicationUser>>();
26 |         return await ValidateSecurityStampAsync(userManager, authenticationState.User);
27 |     }
28 | 
29 |     private async Task<bool> ValidateSecurityStampAsync(UserManager<ApplicationUser> userManager, ClaimsPrincipal principal)
30 |     {
31 |         var user = await userManager.GetUserAsync(principal);
32 |         if (user is null)
33 |         {
34 |             return false;
35 |         }
36 |         else if (!userManager.SupportsUserSecurityStamp)
37 |         {
38 |             return true;
39 |         }
40 |         else
41 |         {
42 |             var principalStamp = principal.FindFirstValue(options.Value.ClaimsIdentity.SecurityStampClaimType);
43 |             var userStamp = await userManager.GetSecurityStampAsync(user);
44 |             return principalStamp == userStamp;
45 |         }
46 |     }
47 | }
48 | 


--------------------------------------------------------------------------------
/MyApp/Components/Account/Shared/ManageNavMenu.razor:
--------------------------------------------------------------------------------
 1 | @using Microsoft.AspNetCore.Identity;
 2 | @using MyApp.Components.Pages.Account.Manage
 3 | @using MyApp.Data;
 4 | 
 5 | @inject NavigationManager NavigationManager
 6 | @inject SignInManager<ApplicationUser> SignInManager
 7 | 
 8 | <ul class="mt-4">
 9 |     <li>
10 |         <NavLink class="@ManageNavPages.IndexNavClass(NavigationManager)" 
11 |                  id="profile" href="@ManageNavPages.Index" Match="NavLinkMatch.All">Profile</NavLink>
12 |     </li>
13 |     <li>
14 |         <NavLink class="@ManageNavPages.EmailNavClass(NavigationManager)" 
15 |                  id="manage-email" href="@ManageNavPages.Email">Email</NavLink>
16 |     </li>
17 |     <li>
18 |         <NavLink class="@ManageNavPages.ChangePasswordNavClass(NavigationManager)" 
19 |                  id="change-password" href="@ManageNavPages.ChangePassword">Password</NavLink>
20 |     </li>
21 |     @if (hasExternalLogins)
22 |     {
23 |         <li id="external-logins">
24 |             <NavLink class="@ManageNavPages.ExternalLoginsNavClass(NavigationManager)" 
25 |                      id="external-login" href="@ManageNavPages.ExternalLogins">External logins</NavLink>
26 |         </li>
27 |     }
28 |     <li>
29 |         <NavLink class="@ManageNavPages.TwoFactorAuthenticationNavClass(NavigationManager)" 
30 |                  id="two-factor" href="@ManageNavPages.TwoFactorAuthentication">Two-factor authentication</NavLink>
31 |     </li>
32 |     <li>
33 |         <NavLink class="@ManageNavPages.PersonalDataNavClass(NavigationManager)" 
34 |                  id="personal-data" href="@ManageNavPages.PersonalData">Personal data</NavLink>
35 |     </li>
36 |     @if (HostContext.AppHost.HasPlugin<ApiKeysFeature>())
37 |     {
38 |         <li>
39 |             <NavLink class="@ManageNavPages.PageNavClass(NavigationManager, "Account/Manage/ApiKeys")" 
40 |                      id="api-keys" href="Account/Manage/ApiKeys">API Keys</NavLink>
41 |         </li>
42 |     }
43 | </ul>
44 | 
45 | @code {
46 |     private bool hasExternalLogins;
47 | 
48 |     protected override async Task OnInitializedAsync()
49 |     {
50 |         hasExternalLogins = (await SignInManager.GetExternalAuthenticationSchemesAsync()).Any();
51 |     }
52 | }
53 | 


--------------------------------------------------------------------------------
/MyApp/Markdown.Videos.cs:
--------------------------------------------------------------------------------
 1 | // BSD License: https://docs.servicestack.net/BSD-LICENSE.txt
 2 | // run node postinstall.js to update to latest version
 3 | using ServiceStack.IO;
 4 | 
 5 | namespace MyApp;
 6 | 
 7 | public class MarkdownVideos(ILogger<MarkdownVideos> log, IWebHostEnvironment env, IVirtualFiles fs)
 8 |     : MarkdownPagesBase<MarkdownFileInfo>(log, env, fs)
 9 | {
10 |     public override string Id => "videos";
11 |     public Dictionary<string, List<MarkdownFileInfo>> Groups { get; set; } = new();
12 | 
13 |     public List<MarkdownFileInfo> GetVideos(string group)
14 |     {
15 |         return Groups.TryGetValue(group, out var docs)
16 |             ? Fresh(docs.Where(IsVisible).OrderBy(x => x.Order).ThenBy(x => x.FileName).ToList())
17 |             : [];
18 |     }
19 |     
20 |     public void LoadFrom(string fromDirectory)
21 |     {
22 |         Groups.Clear();
23 |         var dirs = VirtualFiles.GetDirectory(fromDirectory).GetDirectories().ToList();
24 |         log.LogInformation("Found {Count} video directories", dirs.Count);
25 | 
26 |         var pipeline = CreatePipeline();
27 | 
28 |         foreach (var dir in dirs)
29 |         {
30 |             var group = dir.Name;
31 | 
32 |             foreach (var file in dir.GetFiles().OrderBy(x => x.Name))
33 |             {
34 |                 try
35 |                 {
36 |                     var doc = Load(file.VirtualPath, pipeline);
37 |                     if (doc == null)
38 |                         continue;
39 | 
40 |                     doc.Group = group;
41 |                     var groupVideos = Groups.GetOrAdd(group, v => new List<MarkdownFileInfo>());
42 |                     groupVideos.Add(doc);
43 |                 }
44 |                 catch (Exception e)
45 |                 {
46 |                     log.LogError(e, "Couldn't load {VirtualPath}: {Message}", file.VirtualPath, e.Message);
47 |                 }
48 |             }
49 |         }
50 |     }
51 |     
52 |     public override List<MarkdownFileBase> GetAll()
53 |     {
54 |         var to = new List<MarkdownFileBase>();
55 |         foreach (var entry in Groups)
56 |         {
57 |             to.AddRange(entry.Value.Where(IsVisible).Map(doc => ToMetaDoc(doc, x => x.Content = StripFrontmatter(doc.Content))));
58 |         }
59 |         return to;
60 |     }
61 | }


--------------------------------------------------------------------------------
/MyApp/Components/Pages/Posts/Index.razor:
--------------------------------------------------------------------------------
 1 | @page "/posts/"
 2 | @inject MarkdownBlog Blog
 3 | 
 4 | <div class="relative bg-gray-50 dark:bg-gray-900 px-6 pt-16 pb-20 lg:px-8 lg:pt-24 lg:pb-28">
 5 |     <div class="absolute inset-0">
 6 |         <div class="h-1/3 bg-white dark:bg-black sm:h-2/3"></div>
 7 |     </div>
 8 |     <div class="relative mx-auto max-w-7xl">
 9 |         <BlogTitle Heading=@Blog.Config.BlogDescription />
10 |     </div>
11 |     <div class="relative my-4 mx-auto max-w-7xl">
12 |         <div class="flex flex-wrap justify-center">
13 |             @foreach (var tag in allTags.OrderByDescending(tag => tagCounts[tag]))
14 |             {
15 |                 <a href="@Blog.GetTagLink(tag)" class="mr-2 mb-2 text-xs leading-5 font-semibold bg-slate-400/10 rounded-full py-1 px-3 flex items-center space-x-2 hover:bg-slate-400/20 dark:highlight-white/5">@tag</a>
16 |             }
17 |         </div>
18 |     </div>
19 |     <div class="relative mb-8 mx-auto max-w-7xl">
20 |         <div class="flex flex-wrap justify-center">
21 |             <b class="text-sm font-semibold">@thisYear</b>
22 |             @foreach (var year in allYears.Where(x => x != thisYear))
23 |             {
24 |                 <a class="ml-3 text-sm text-indigo-700 font-semibold hover:underline" href="@Blog.GetYearLink(year)">@year</a>
25 |             }
26 |         </div>
27 |     </div>
28 |     <div class="relative mx-auto max-w-7xl">
29 |         <BlogPosts Posts=@allPosts.Where(x => x.Date.Value.Year == thisYear).ToList() />
30 |     </div>
31 | </div>
32 | 
33 | @code {
34 |     List<MarkdownFileInfo> allPosts = new();
35 |     IEnumerable<string> allTags = [];
36 |     Dictionary<string, int> tagCounts = new();
37 |     IOrderedEnumerable<int> allYears => allPosts.Select(x => x.Date.Value.Year).Distinct().OrderByDescending(x => x);
38 |     int thisYear;
39 | 
40 |     void load()
41 |     {
42 |         allPosts = Blog.GetPosts();
43 |         allTags = allPosts.SelectMany(x => x.Tags).Distinct();
44 |         tagCounts = new();
45 |         allTags.Each(tag => tagCounts[tag] = allPosts.Count(x => x.Tags.Safe().Contains(tag)));
46 |         thisYear = DateTime.UtcNow.Year;
47 |     }
48 | 
49 |     protected override void OnInitialized() => load();
50 | 
51 |     protected override void OnParametersSet() => load();
52 | }
53 | 


--------------------------------------------------------------------------------
/MyApp/wwwroot/pages/Bookings.mjs:
--------------------------------------------------------------------------------
 1 | import { ref } from "vue"
 2 | import { useClient, useFormatters, AutoQueryGrid } from "@servicestack/vue"
 3 | import { QueryCoupons } from "../mjs/dtos.mjs"
 4 | 
 5 | export default {
 6 |   template:`
 7 |     <AutoQueryGrid type="Booking" :visible-from="{ name:'xl', bookingStartDate:'sm', bookingEndDate:'xl', createdBy:'2xl' }">
 8 |         <template #id="{ id }">
 9 |             <span class="text-gray-900" v-html="id"></span>
10 |         </template>
11 | 
12 |         <template #name="{ name }">{{name}}</template>
13 | 
14 |         <template #roomNumber-header>
15 |             <span class="hidden lg:inline">Room </span>No
16 |         </template>
17 | 
18 |         <template #cost="{ cost }">
19 |             <span v-html="currency(cost)"></span>
20 |         </template>
21 | 
22 |         <template #bookingStartDate-header>
23 |             Start<span class="hidden lg:inline"> Date</span>
24 |         </template>
25 | 
26 |         <template #bookingEndDate-header>
27 |             End<span class="hidden lg:inline"> Date</span>
28 |         </template>
29 | 
30 |         <template #createdBy-header>
31 |             Employee
32 |         </template>
33 | 
34 |         <template #createdBy="{ createdBy }" v-html="createdBy"></template>
35 | 
36 |         <template #discount="{ discount }">
37 |             <TextLink v-if="discount" class="flex items-end" @click.stop="showCoupon(discount.id)" :title="discount.id">
38 |                 <Icon class="w-5 h-5 mr-1" type="Coupon" />
39 |                 <PreviewFormat :value="discount.description" />
40 |             </TextLink>
41 |         </template>
42 |     </AutoQueryGrid>
43 |     <AutoEditForm v-if="coupon" type="UpdateCoupon" v-model="coupon" v-on:done="close" v-on:save="close" />
44 |   `,
45 |   props: { bookings:Array },
46 |     setup() {
47 |         const client = useClient()
48 |         const coupon = ref()
49 |         const { currency } = useFormatters()
50 |         async function showCoupon(id) {
51 |             const api = await client.api(new QueryCoupons({ id }))
52 |             if (api.succeeded) {
53 |                 coupon.value = api.response.results[0]
54 |             }
55 |         }
56 |         const close = () => coupon.value = null
57 |         return { coupon, showCoupon, close, currency }
58 |     }
59 | }
60 | 


--------------------------------------------------------------------------------
/MyApp/Components/Pages/Posts/Year.razor:
--------------------------------------------------------------------------------
 1 | @page "/posts/year/{ForYear:int}"
 2 | @inject MarkdownBlog Blog
 3 | @inject AppConfig AppConfig
 4 | 
 5 | @if (allYears.Count > 0)
 6 | {
 7 |     <PageTitle>@ForYear posts</PageTitle>
 8 | 
 9 |     <div class="relative bg-gray-50 dark:bg-gray-900 px-6 pt-16 pb-20 lg:px-8 lg:pt-24 lg:pb-28">
10 |         <div class="absolute inset-0">
11 |             <div class="h-1/3 bg-white dark:bg-black sm:h-2/3"></div>
12 |         </div>
13 |         <div class="relative mx-auto max-w-7xl">
14 |             <BlogTitle Heading=@($"All posts published in <b>{ForYear}</b>") />
15 |         </div>
16 |         <div class="mt-4 relative mb-8 mx-auto max-w-7xl">
17 |             <div class="flex flex-wrap justify-center">
18 |                 @foreach (var year in allYears)
19 |                 {
20 |                     if (ForYear == year)
21 |                     {
22 |                         <b class="ml-3 text-sm font-semibold">@year</b>
23 |                     }
24 |                     else
25 |                     {
26 |                         <a class="ml-3 text-sm text-indigo-700 font-semibold hover:underline" href="@Blog.GetYearLink(year)">@year</a>
27 |                     }
28 |                 }
29 |             </div>
30 |         </div>
31 |         <div class="mt-12 relative mx-auto max-w-7xl">
32 |             <BlogPosts Posts=@Blog.GetPosts(year: ForYear) />
33 | 
34 |             <div class="mt-8 text-center">
35 |                 <a class="text-sm font-semibold hover:underline" href="@Blog.GetPostsLink()">view all posts</a>
36 |             </div>
37 |         </div>
38 | 
39 |     </div>
40 | }
41 | else
42 | {
43 |     <div class="mt-3 mb-20 mx-auto max-w-fit">
44 |     @if (error != null)
45 |     {
46 |         <ErrorSummary Status=@error />
47 |     }
48 |     else
49 |     {
50 |         <Loading />
51 |     }
52 |     </div>
53 | }
54 | 
55 | @code {
56 |     [Parameter] public required int ForYear { get; set; }
57 | 
58 |     List<int> allYears = new();
59 |     ResponseStatus? error;
60 | 
61 |     void load()
62 |     {
63 |         allYears = Blog.VisiblePosts.Select(x => x.Date.Value.Year).Distinct().OrderByDescending(x => x).ToList();
64 |     }
65 | 
66 |     protected override void OnInitialized() => load();
67 | 
68 |     protected override void OnParametersSet() => load();
69 | }
70 | 


--------------------------------------------------------------------------------
/MyApp/Components/Shared/FormLoading.razor:
--------------------------------------------------------------------------------
 1 | @using ServiceStack
 2 | @inject IJSRuntime JsRuntime
 3 | @inject NavigationManager NavigationManager
 4 | 
 5 | @if (Loading)
 6 | {
 7 |     <div class=@CssUtils.ClassNames("flex", @class) title="loading...">
 8 |     @if (Icon)
 9 |     {
10 |         <svg xmlns="http://www.w3.org/2000/svg" x="0px" y="0px" width="24px" height="30px" viewBox="0 0 24 30">
11 |             <rect x="0" y="10" width="4" height="10" fill="#333" opacity="0.2">
12 |             <animate attributeName="opacity" attributeType="XML" values="0.2; 1; .2" begin="0s" dur="0.6s" repeatCount="indefinite"/>
13 |             <animate attributeName="height" attributeType="XML" values="10; 20; 10" begin="0s" dur="0.6s" repeatCount="indefinite"/>
14 |             <animate attributeName="y" attributeType="XML" values="10; 5; 10" begin="0s" dur="0.6s" repeatCount="indefinite"/>
15 |             </rect>
16 |             <rect x="8" y="10" width="4" height="10" fill="#333" opacity="0.2">
17 |             <animate attributeName="opacity" attributeType="XML" values="0.2; 1; .2" begin="0.15s" dur="0.6s" repeatCount="indefinite"/>
18 |             <animate attributeName="height" attributeType="XML" values="10; 20; 10" begin="0.15s" dur="0.6s" repeatCount="indefinite"/>
19 |             <animate attributeName="y" attributeType="XML" values="10; 5; 10" begin="0.15s" dur="0.6s" repeatCount="indefinite"/>
20 |             </rect>
21 |             <rect x="16" y="10" width="4" height="10" fill="#333" opacity="0.2">
22 |             <animate attributeName="opacity" attributeType="XML" values="0.2; 1; .2" begin="0.3s" dur="0.6s" repeatCount="indefinite"/>
23 |             <animate attributeName="height" attributeType="XML" values="10; 20; 10" begin="0.3s" dur="0.6s" repeatCount="indefinite"/>
24 |             <animate attributeName="y" attributeType="XML" values="10; 5; 10" begin="0.3s" dur="0.6s" repeatCount="indefinite"/>
25 |             </rect>
26 |         </svg>
27 |     }
28 |         <span class="ml-2 mt-1 text-gray-400">@Text</span>
29 |     </div>
30 | }
31 | 
32 | @code {
33 |     [Parameter]
34 |     public bool Loading { get; set; }
35 | 
36 |     [Parameter]
37 |     public bool Icon { get; set; } = true;
38 | 
39 |     [Parameter]
40 |     public string Text { get; set; } = "loading...";
41 | 
42 |     [Parameter]
43 |     public string? @class { get; set; }
44 | }
45 | 


--------------------------------------------------------------------------------
/MyApp/Components/Account/Pages/Manage/ResetAuthenticator.razor:
--------------------------------------------------------------------------------
 1 | @page "/Account/Manage/ResetAuthenticator"
 2 | 
 3 | @using Microsoft.AspNetCore.Identity
 4 | @using MyApp.Data
 5 | 
 6 | @inject UserManager<ApplicationUser> UserManager
 7 | @inject SignInManager<ApplicationUser> SignInManager
 8 | @inject IdentityUserAccessor UserAccessor
 9 | @inject IdentityRedirectManager RedirectManager
10 | @inject ILogger<ResetAuthenticator> Logger
11 | 
12 | <PageTitle>Reset authenticator key</PageTitle>
13 | 
14 | <Heading3>Reset authenticator key</Heading3>
15 | 
16 | <div class="max-w-xl">
17 |     <StatusMessage />
18 | 
19 |     <Alert Type="AlertType.Warning">
20 |         <p class="mb-3">
21 |             <strong>If you reset your authenticator key your authenticator app will not work until you reconfigure it.</strong>
22 |         </p>
23 |         <p class="mb-3">
24 |             This process disables 2FA until you verify your authenticator app.
25 |             If you do not complete your authenticator app configuration you may lose access to your account.
26 |         </p>
27 |     </Alert>
28 | 
29 |     <div class="pt-4">
30 |         <form id="reset-authenticator-form" @formname="reset-authenticator" @onsubmit="OnSubmitAsync" method="post">
31 |             <AntiforgeryToken />
32 |             <PrimaryButton Style="ButtonStyle.Red" id="reset-authenticator-button" type="submit">Reset authenticator key</PrimaryButton>
33 |         </form>
34 |     </div>
35 | </div>
36 | 
37 | @code {
38 |     [CascadingParameter]
39 |     private HttpContext HttpContext { get; set; } = default!;
40 | 
41 |     private async Task OnSubmitAsync()
42 |     {
43 |         var user = await UserAccessor.GetRequiredUserAsync(HttpContext);
44 |         await UserManager.SetTwoFactorEnabledAsync(user, false);
45 |         await UserManager.ResetAuthenticatorKeyAsync(user);
46 |         var userId = await UserManager.GetUserIdAsync(user);
47 |         Logger.LogInformation("User with ID '{UserId}' has reset their authentication app key.", userId);
48 | 
49 |         await SignInManager.RefreshSignInAsync(user);
50 | 
51 |         RedirectManager.RedirectToWithStatus(
52 |             "Account/Manage/EnableAuthenticator",
53 |             "Your authenticator app key has been reset, you will need to configure your authenticator app using the new key.",
54 |             HttpContext);
55 |     }
56 | }
57 | 


--------------------------------------------------------------------------------
/MyApp/Components/Account/Pages/ConfirmEmailChange.razor:
--------------------------------------------------------------------------------
 1 | @page "/Account/ConfirmEmailChange"
 2 | 
 3 | @using System.Text
 4 | @using Microsoft.AspNetCore.Identity
 5 | @using Microsoft.AspNetCore.WebUtilities
 6 | @using MyApp.Data
 7 | 
 8 | @inject UserManager<ApplicationUser> UserManager
 9 | @inject SignInManager<ApplicationUser> SignInManager
10 | @inject IdentityRedirectManager RedirectManager
11 | 
12 | <PageTitle>Confirm email change</PageTitle>
13 | 
14 | <Heading1>Confirm email change</Heading1>
15 | 
16 | <div class="mt-8 mx-auto max-w-lg">
17 |     <StatusMessage Message="@message" />
18 | </div>
19 | 
20 | @code {
21 |     private string? message;
22 | 
23 |     [CascadingParameter]
24 |     private HttpContext HttpContext { get; set; } = default!;
25 | 
26 |     [SupplyParameterFromQuery]
27 |     private string? UserId { get; set; }
28 | 
29 |     [SupplyParameterFromQuery]
30 |     private string? Email { get; set; }
31 | 
32 |     [SupplyParameterFromQuery]
33 |     private string? Code { get; set; }
34 | 
35 |     protected override async Task OnInitializedAsync()
36 |     {
37 |         if (UserId is null || Email is null || Code is null)
38 |         {
39 |             RedirectManager.RedirectToWithStatus(
40 |                 "Account/Login", "Error: Invalid email change confirmation link.", HttpContext);
41 |         }
42 | 
43 |         var user = await UserManager.FindByIdAsync(UserId);
44 |         if (user is null)
45 |         {
46 |             message = "Unable to find user with Id '{userId}'";
47 |             return;
48 |         }
49 | 
50 |         var code = Encoding.UTF8.GetString(WebEncoders.Base64UrlDecode(Code));
51 |         var result = await UserManager.ChangeEmailAsync(user, Email, code);
52 |         if (!result.Succeeded)
53 |         {
54 |             message = "Error changing email.";
55 |             return;
56 |         }
57 | 
58 |         // In our UI email and user name are one and the same, so when we update the email
59 |         // we need to update the user name.
60 |         var setUserNameResult = await UserManager.SetUserNameAsync(user, Email);
61 |         if (!setUserNameResult.Succeeded)
62 |         {
63 |             message = "Error changing user name.";
64 |             return;
65 |         }
66 | 
67 |         await SignInManager.RefreshSignInAsync(user);
68 |         message = "Thank you for confirming your email change.";
69 |     }
70 | }
71 | 


--------------------------------------------------------------------------------
/MyApp/Components/Shared/Footer.razor:
--------------------------------------------------------------------------------
 1 | <footer class="bg-accent-1 dark:bg-black border-t border-accent-2 dark:border-gray-600">
 2 | 
 3 |     <nav class="pt-8 columns-2 sm:flex sm:justify-center sm:space-x-12" aria-label="Footer">
 4 |         <div class="pb-6">
 5 |             <NavLink href="about" class="text-sm leading-6 text-gray-600 dark:text-gray-400 hover:text-gray-900 dark:hover:text-gray-50">About</NavLink>
 6 |         </div>
 7 | 
 8 |         <div class="pb-6">
 9 |             <NavLink href="crud" class="text-sm leading-6 text-gray-600 dark:text-gray-400 hover:text-gray-900 dark:hover:text-gray-50">CRUD APIs + UI</NavLink>
10 |         </div>
11 | 
12 |         <div class="pb-6">
13 |             <NavLink href="deploy" class="text-sm leading-6 text-gray-600 dark:text-gray-400 hover:text-gray-900 dark:hover:text-gray-50">Deploy</NavLink>
14 |         </div>
15 | 
16 |         <div class="pb-6">
17 |             <NavLink href="blog" class="text-sm leading-6 text-gray-600 dark:text-gray-400 hover:text-gray-900 dark:hover:text-gray-50">Blog</NavLink>
18 |         </div>
19 | 
20 |         <div class="pb-6">
21 |             <NavLink href="posts" class="text-sm leading-6 text-gray-600 dark:text-gray-400 hover:text-gray-900 dark:hover:text-gray-50">Archive</NavLink>
22 |         </div>
23 | 
24 |         <div class="pb-6">
25 |             <NavLink href="privacy" class="text-sm leading-6 text-gray-600 dark:text-gray-400 hover:text-gray-900 dark:hover:text-gray-50">Privacy</NavLink>
26 |         </div>
27 |     </nav>
28 | 
29 |     <div class="container mx-auto px-5">
30 |         <div class="py-20 flex flex-col lg:flex-row items-center">
31 |             <h3 class="text-4xl lg:text-6xl font-bold tracking-tighter leading-tight text-center lg:text-left mb-10 lg:mb-0 lg:pr-4 lg:w-1/2">A ServiceStack Project</h3>
32 |             <div class="flex flex-col lg:flex-row justify-center items-center lg:pl-4 lg:w-1/2">
33 |                 <a href="https://docs.servicestack.net" class="mx-3 bg-black dark:bg-gray-700 hover:bg-white dark:hover:bg-gray-200 hover:text-black border border-black text-white font-bold py-3 px-12 lg:px-8 duration-200 transition-colors mb-6 lg:mb-0">Read Documentation</a>
34 |                 <a href="https://github.com/NetCoreTemplates/blazor-vue" class="mx-3 font-bold hover:underline">View on GitHub</a>
35 |             </div>
36 |         </div>
37 |     </div>
38 | 
39 | </footer>
40 | 


--------------------------------------------------------------------------------
/MyApp/Components/Account/IdentityRedirectManager.cs:
--------------------------------------------------------------------------------
 1 | using Microsoft.AspNetCore.Components;
 2 | using System.Diagnostics.CodeAnalysis;
 3 | 
 4 | namespace MyApp.Components.Account;
 5 | 
 6 | internal sealed class IdentityRedirectManager(NavigationManager navigationManager)
 7 | {
 8 |     public const string StatusCookieName = "Identity.StatusMessage";
 9 | 
10 |     private static readonly CookieBuilder StatusCookieBuilder = new()
11 |     {
12 |         SameSite = SameSiteMode.Strict,
13 |         HttpOnly = true,
14 |         IsEssential = true,
15 |         MaxAge = TimeSpan.FromSeconds(5),
16 |     };
17 | 
18 |     [DoesNotReturn]
19 |     public void RedirectTo(string? uri)
20 |     {
21 |         uri ??= "";
22 | 
23 |         // Prevent open redirects.
24 |         if (!Uri.IsWellFormedUriString(uri, UriKind.Relative))
25 |         {
26 |             uri = navigationManager.ToBaseRelativePath(uri);
27 |         }
28 | 
29 |         // During static rendering, NavigateTo throws a NavigationException which is handled by the framework as a redirect.
30 |         // So as long as this is called from a statically rendered Identity component, the InvalidOperationException is never thrown.
31 |         navigationManager.NavigateTo(uri);
32 |         throw new InvalidOperationException($"{nameof(IdentityRedirectManager)} can only be used during static rendering.");
33 |     }
34 | 
35 |     [DoesNotReturn]
36 |     public void RedirectTo(string uri, Dictionary<string, object?> queryParameters)
37 |     {
38 |         var uriWithoutQuery = navigationManager.ToAbsoluteUri(uri).GetLeftPart(UriPartial.Path);
39 |         var newUri = navigationManager.GetUriWithQueryParameters(uriWithoutQuery, queryParameters);
40 |         RedirectTo(newUri);
41 |     }
42 | 
43 |     [DoesNotReturn]
44 |     public void RedirectToWithStatus(string uri, string message, HttpContext context)
45 |     {
46 |         context.Response.Cookies.Append(StatusCookieName, message, StatusCookieBuilder.Build(context));
47 |         RedirectTo(uri);
48 |     }
49 | 
50 |     private string CurrentPath => navigationManager.ToAbsoluteUri(navigationManager.Uri).GetLeftPart(UriPartial.Path);
51 | 
52 |     [DoesNotReturn]
53 |     public void RedirectToCurrentPage() => RedirectTo(CurrentPath);
54 | 
55 |     [DoesNotReturn]
56 |     public void RedirectToCurrentPageWithStatus(string message, HttpContext context)
57 |         => RedirectToWithStatus(CurrentPath, message, context);
58 | }
59 | 


--------------------------------------------------------------------------------
/MyApp/Components/Account/Pages/Manage/ManageNavPages.cs:
--------------------------------------------------------------------------------
 1 | using Microsoft.AspNetCore.Components;
 2 | using Microsoft.AspNetCore.Mvc.Rendering;
 3 | using Microsoft.AspNetCore.Mvc.ViewFeatures;
 4 | using ServiceStack;
 5 | 
 6 | namespace MyApp.Components.Pages.Account.Manage;
 7 | 
 8 | public static class ManageNavPages
 9 | {
10 |     const string NavItemClass = "text-gray-600 dark:text-gray-300 hover:bg-gray-50 dark:hover:bg-gray-900 hover:text-gray-900 dark:hover:text-gray-50 group flex items-center px-4 py-2 text-base font-medium rounded-md mr-2 whitespace-nowrap";
11 | 
12 |     const string ActiveClass = "bg-gray-100 dark:bg-gray-800 text-gray-900 dark:text-gray-50";
13 |     public static string Index => "Account/Manage";
14 |     public static string Email => "Account/Manage/Email";
15 | 
16 |     public static string ChangePassword => "Account/Manage/ChangePassword";
17 | 
18 |     public static string ExternalLogins => "Account/Manage/ExternalLogins";
19 | 
20 |     public static string TwoFactorAuthentication => "Account/Manage/TwoFactorAuthentication";
21 |     public static string PersonalData => "Account/Manage/PersonalData";
22 | 
23 |     public static string? IndexNavClass(NavigationManager navigationManager) => PageNavClass(navigationManager, Index);
24 |     public static string? EmailNavClass(NavigationManager navigationManager) => PageNavClass(navigationManager, Email);
25 | 
26 |     public static string? ChangePasswordNavClass(NavigationManager navigationManager) => PageNavClass(navigationManager, ChangePassword);
27 | 
28 |     public static string? ExternalLoginsNavClass(NavigationManager navigationManager) => PageNavClass(navigationManager, ExternalLogins);
29 | 
30 |     public static string? TwoFactorAuthenticationNavClass(NavigationManager navigationManager) => PageNavClass(navigationManager, TwoFactorAuthentication);
31 | 
32 |     public static string? PersonalDataNavClass(NavigationManager navigationManager) => PageNavClass(navigationManager, PersonalData);
33 |     public static string? PageNavClass(NavigationManager navigationManager, string page)
34 |     {
35 |         return navigationManager.Uri.EndsWith(page, StringComparison.OrdinalIgnoreCase) 
36 |             ? CssUtils.ClassNames(NavItemClass, ActiveClass) 
37 |             : NavItemClass;
38 |     }
39 | 
40 |     public static string ActivePageKey => "ActivePage";
41 |     public static void AddActivePage(this ViewDataDictionary viewData, string activePage) => viewData[ActivePageKey] = activePage;
42 | }
43 | 


--------------------------------------------------------------------------------
/MyApp/Configure.ApiKeys.cs:
--------------------------------------------------------------------------------
 1 | using MyApp.Data;
 2 | using ServiceStack;
 3 | using ServiceStack.Data;
 4 | using ServiceStack.OrmLite;
 5 | using ServiceStack.Configuration;
 6 | 
 7 | [assembly: HostingStartup(typeof(MyApp.ConfigureApiKeys))]
 8 | 
 9 | namespace MyApp;
10 | 
11 | public class ConfigureApiKeys : IHostingStartup
12 | {
13 |     public void Configure(IWebHostBuilder builder) => builder
14 |         .ConfigureServices(services =>
15 |         {
16 |             services.AddPlugin(new ApiKeysFeature
17 |             {
18 |                 // Optional: Available Scopes Admin Users can assign to any API Key
19 |                 // Features = [
20 |                 //     "Paid",
21 |                 //     "Tracking",
22 |                 // ],
23 |                 // Optional: Available Features Admin Users can assign to any API Key
24 |                 // Scopes = [
25 |                 //     "todo:read",
26 |                 //     "todo:write",
27 |                 // ],
28 |                 
29 |                 // Optional: Limit available Scopes Users can assign to their own API Keys
30 |                 // UserScopes = [
31 |                 //     "todo:read",
32 |                 // ],
33 |                 // Optional: Limit available Features Users can assign to their own API Keys
34 |                 // UserFeatures = [
35 |                 //     "Tracking",
36 |                 // ],
37 |             });
38 |         })
39 |         .ConfigureAppHost(appHost =>
40 |         {
41 |             using var db = appHost.Resolve<IDbConnectionFactory>().Open();
42 |             var feature = appHost.GetPlugin<ApiKeysFeature>();
43 |             feature.InitSchema(db);
44 |             
45 |             // Optional: Create API Key for specified Users on Startup
46 |             if (feature.ApiKeyCount(db) == 0 && db.TableExists(IdentityUsers.TableName))
47 |             {
48 |                 var createApiKeysFor = new [] { "admin@email.com", "manager@email.com", "employee@email.com" };
49 |                 var users = IdentityUsers.GetByUserNames(db, createApiKeysFor);
50 |                 foreach (var user in users)
51 |                 {
52 |                     List<string> scopes = user.UserName == "admin@email.com"
53 |                         ? [RoleNames.Admin] 
54 |                         : [];
55 |                     feature.Insert(db, 
56 |                         new() { Name = "Seed API Key", UserId = user.Id, UserName = user.UserName, Scopes = scopes });
57 |                 }
58 |             }
59 |         });
60 | }


--------------------------------------------------------------------------------
/MyApp/Components/Account/Pages/Manage/Disable2fa.razor:
--------------------------------------------------------------------------------
 1 | @page "/Account/Manage/Disable2fa"
 2 | 
 3 | @using Microsoft.AspNetCore.Identity
 4 | @using MyApp.Data
 5 | 
 6 | @inject UserManager<ApplicationUser> UserManager
 7 | @inject IdentityUserAccessor UserAccessor
 8 | @inject IdentityRedirectManager RedirectManager
 9 | @inject ILogger<Disable2fa> Logger
10 | 
11 | <PageTitle>Disable two-factor authentication (2FA)</PageTitle>
12 | 
13 | <Heading3>Disable two-factor authentication (2FA)</Heading3>
14 | 
15 | <div class="max-w-xl">
16 |     <StatusMessage />
17 | 
18 |     <Alert Type="AlertType.Warning">
19 |         <p class="mb-3">
20 |             <strong>This action only disables 2FA.</strong>
21 |         </p>
22 |         <p class="mb-3">
23 |             Disabling 2FA does not change the keys used in authenticator apps. If you wish to change the key
24 |             used in an authenticator app you should <a href="Account/Manage/ResetAuthenticator">reset your authenticator keys.</a>
25 |         </p>
26 |     </Alert>
27 | 
28 |     <div class="mt-4">
29 |         <form @formname="disable-2fa" @onsubmit="OnSubmitAsync" method="post">
30 |             <AntiforgeryToken />
31 |             <PrimaryButton Style="ButtonStyle.Red" type="submit">Disable 2FA</PrimaryButton>
32 |         </form>
33 |     </div>
34 | </div>
35 | 
36 | @code {
37 |     private ApplicationUser user = default!;
38 | 
39 |     [CascadingParameter]
40 |     private HttpContext HttpContext { get; set; } = default!;
41 | 
42 |     protected override async Task OnInitializedAsync()
43 |     {
44 |         user = await UserAccessor.GetRequiredUserAsync(HttpContext);
45 | 
46 |         if (HttpMethods.IsGet(HttpContext.Request.Method) && !await UserManager.GetTwoFactorEnabledAsync(user))
47 |         {
48 |             throw new InvalidOperationException("Cannot disable 2FA for user as it's not currently enabled.");
49 |         }
50 |     }
51 | 
52 |     private async Task OnSubmitAsync()
53 |     {
54 |         var disable2faResult = await UserManager.SetTwoFactorEnabledAsync(user, false);
55 |         if (!disable2faResult.Succeeded)
56 |         {
57 |             throw new InvalidOperationException("Unexpected error occurred disabling 2FA.");
58 |         }
59 | 
60 |         var userId = await UserManager.GetUserIdAsync(user);
61 |         Logger.LogInformation("User with ID '{UserId}' has disabled 2fa.", userId);
62 |         RedirectManager.RedirectToWithStatus(
63 |             "Account/Manage/TwoFactorAuthentication",
64 |             "2fa has been disabled. You can reenable 2fa when you setup an authenticator app",
65 |             HttpContext);
66 |     }
67 | }
68 | 


--------------------------------------------------------------------------------
/MyApp/_pages/about.md:
--------------------------------------------------------------------------------
 1 | ---
 2 | title: About this Blazor App
 3 | ---
 4 | 
 5 | ## .NET 8 Blazor App Templates
 6 | 
 7 | ServiceStack's new .NET 8 Blazor templates enhances the default ASP.NET Blazor App templates with several modern, high-productivity features, including:
 8 | 
 9 |  - [Vue.js](https://vuejs.org) - Enhance your statically rendered Blazor Apps with Vue.js for all your interactive UIs
10 |  - [Tailwind CSS](https://tailwindcss.com) - Style your Blazor Apps with the modern popular utility-first CSS framework for creating beautiful, maintainable responsive UIs with DarkMode support
11 |  - [ServiceStack Vue Components](https://blazor-gallery.jamstacks.net) - Rapidly develop beautiful Blazor Apps integrated with Rich high-productivity UI Tailwind Components like [AutoQueryGrid](https://docs.servicestack.net/vue/autoquerygrid) and [AutoForms](https://docs.servicestack.net/vue/autoform)
12 |  - [ServiceStack.Blazor Components](https://blazor-gallery.jamstacks.net) - Utilize ServiceStack.Blazor's beautiful Tailwind Components in your statically rendered Blazor Apps
13 |  - [ASP .NET Identity Auth](https://learn.microsoft.com/en-us/aspnet/core/blazor/security/) - Use the same ASP .NET Identity Auth used in ASP.NET's .NET 8 Blazor Apps, with all Identity Pages upgraded with beautiful Tailwind CSS styling
14 |  - [Entity Framework](https://learn.microsoft.com/ef/) & [OrmLite](https://docs.servicestack.net/ormlite/) - Choose the Best ORM to build each App feature, with a unified solution that sees [OrmLite's Code-First DB Migrations](https://docs.servicestack.net/ormlite/db-migrations) run both EF and OrmLite migrations, inc. Seed Data with a single command at Development or Deployment
15 |  - [AutoQuery](https://docs.servicestack.net/autoquery/) - Rapidly developing data-driven APIs, UIs and CRUD Apps
16 |  - [Auto Admin Pages](https://youtu.be/wlRA4_owEsc) - Quickly develop your back-office CRUD Admin UIs to manage your App's Database tables at [/admin](/admin)
17 |  - [Markdown](https://docs.servicestack.net/razor-press/syntax) - Maintain SEO-friendly documentation and content-rich pages like this one with just Markdown, beautifully styled with [@tailwindcss/typography](https://tailwindcss.com/docs/typography-plugin)
18 |  - [Built-in UIs](https://servicestack.net/auto-ui) - Use ServiceStack's Auto UIs to [Explore your APIs](https://docs.servicestack.net/api-explorer) at [/ui](/ui/) 
19 |    or Query your [App's Database Tables](https://docs.servicestack.net/admin-ui-database) at [/admin-ui/database](/admin-ui/database) 
20 |  - [Built-in Docker Deployments](/deploy) - Use the built-in GitHub Actions to effortlessly deploy .NET 8 containerized Blazor Apps with Docker and GitHub Registry via SSH to any Linux Server


--------------------------------------------------------------------------------
/MyApp/Markdown.Meta.cs:
--------------------------------------------------------------------------------
 1 | using ServiceStack.IO;
 2 | using ServiceStack.Text;
 3 | 
 4 | namespace MyApp;
 5 | 
 6 | public class MarkdownMeta
 7 | {
 8 |     public List<IMarkdownPages> Features { get; set; } = [];
 9 | 
10 |     public async Task RenderToAsync(string metaDir, string baseUrl)
11 |     {
12 |         FileSystemVirtualFiles.RecreateDirectory(metaDir);
13 |         using var scope = JsConfig.With(new Config { ExcludeTypeInfo = true });
14 |         var featureDocs = new Dictionary<string, List<MarkdownFileBase>>();
15 |         var allYears = new HashSet<int>();
16 |         var index = new Dictionary<string, object>();
17 |         foreach (var feature in Features.Safe())
18 |         {
19 |             var allDocs = feature.GetAll()
20 |                 .OrderByDescending(x => x.Date!.Value)
21 |                 .ThenBy(x => x.Order)
22 |                 .ThenBy(x => x.FileName)
23 |                 .ToList();
24 |             allDocs.ForEach(x => {
25 |                 if (x.Url?.StartsWith("/") == true)
26 |                     x.Url = baseUrl.CombineWith(x.Url);
27 |                 if (x.Image?.StartsWith("/") == true)
28 |                     x.Image = baseUrl.CombineWith(x.Image);
29 |             });
30 |             featureDocs[feature.Id] = allDocs;
31 |             var featureYears = allDocs.Select(x => x.Date!.Value.Year).Distinct().OrderBy(x => x).ToList();
32 |             featureYears.ForEach(x => allYears.Add(x));
33 |             
34 |             index[feature.Id] = featureYears.Map(x => baseUrl.CombineWith($"/meta/{x}/{feature.Id}.json"));
35 |             foreach (var year in featureYears)
36 |             {
37 |                 var yearDocs = allDocs
38 |                     .Where(x => x.Date!.Value.Year == year)
39 |                     .ToList();
40 |                 var yearDir = metaDir.CombineWith(year).AssertDir();
41 |                 var metaPath = yearDir.CombineWith($"{feature.Id}.json");
42 |                 await File.WriteAllTextAsync(metaPath, yearDocs.ToJson());
43 |             }
44 |         }
45 |         await File.WriteAllTextAsync(metaDir.CombineWith("index.json"), JSON.stringify(index));
46 | 
47 |         await File.WriteAllTextAsync(metaDir.CombineWith("all.json"), JSON.stringify(featureDocs));
48 |         foreach (var year in allYears.OrderBy(x => x))
49 |         {
50 |             var yearDocs = new Dictionary<string, List<MarkdownFileBase>>();
51 |             foreach (var entry in featureDocs)
52 |             {
53 |                 yearDocs[entry.Key] = entry.Value
54 |                     .Where(x => x.Date!.Value.Year == year)
55 |                     .ToList();
56 |             }
57 |             await File.WriteAllTextAsync(metaDir.CombineWith($"{year}/all.json"), JSON.stringify(yearDocs));
58 |         }
59 |     }
60 | }


--------------------------------------------------------------------------------
/MyApp/wwwroot/posts/components/VueComponentLibrary.mjs:
--------------------------------------------------------------------------------
 1 | export default {
 2 |     template:`
 3 |     <div class="not-prose">
 4 |         <div class="text-center">
 5 |             <h1 class="mt-2 text-4xl font-bold tracking-tight text-gray-900 dark:text-gray-100 sm:text-5xl">
 6 |                 Vue Library
 7 |             </h1>
 8 |         </div>
 9 |         <div class="pt-4 pb-16">
10 |             <div class="mx-auto">
11 |                 <NavList class="mt-8" title="">
12 |                     <NavListItem title="useMetadata" href="https://docs.servicestack.net/vue/use-metadata" :iconSvg="Icons.Code">
13 |                         Reflective utils for inspecting API AppMetadata
14 |                     </NavListItem>
15 |                     <NavListItem title="useClient" href="https://docs.servicestack.net/vue/use-client" :iconSvg="Icons.Code">
16 |                         Utilize JSON Api Client features in Components
17 |                     </NavListItem>
18 |                     <NavListItem title="useAuth" href="https://docs.servicestack.net/vue/use-auth" :iconSvg="Icons.Code">
19 |                         Inspect Authenticated Users Info, Roles &amp; Permissions
20 |                     </NavListItem>
21 |                     <NavListItem title="useFormatters" href="https://docs.servicestack.net/vue/use-formatters" :iconSvg="Icons.Code">
22 |                         Built-in Formats and formatting functions
23 |                     </NavListItem>
24 |                     <NavListItem title="useFiles" href="https://docs.servicestack.net/vue/use-files" :iconSvg="Icons.Code">
25 |                         File utils for resolving SVG icons, extensions and MIME types
26 |                     </NavListItem>
27 |                     <NavListItem title="useConfig" href="https://docs.servicestack.net/vue/use-config" :iconSvg="Icons.Code">
28 |                         Manage global configuration &amp; defaults
29 |                     </NavListItem>
30 |                     <NavListItem title="useUtils" href="https://docs.servicestack.net/vue/use-utils" :iconSvg="Icons.Code">
31 |                         General functionality and utils
32 |                     </NavListItem>
33 |                 </NavList>
34 |             </div>
35 |         </div>
36 |     </div>        
37 |     `,
38 |     setup() {
39 |         const svg = (viewbox,body) =>
40 |             `<svg class='h-6 w-6 text-indigo-700 dark:text-indigo-300' xmlns='http://www.w3.org/2000/svg' viewBox='${viewbox}'>${body}</svg>`
41 | 
42 |         const Icons = {
43 |             Code: svg("0 0 24 24",     "<path fill='none' stroke='currentColor' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m10 20l4-16m4 4l4 4l-4 4M6 16l-4-4l4-4'></path>"),
44 |         }
45 |         return { Icons }
46 |     }
47 | }
48 | 


--------------------------------------------------------------------------------
/MyApp/Components/Pages/Posts/Tagged.razor:
--------------------------------------------------------------------------------
 1 | @page "/posts/tagged/{Slug}"
 2 | @inject MarkdownBlog Blog
 3 | @inject AppConfig AppConfig
 4 | 
 5 | @if (selectedTag != null)
 6 | {
 7 |     <PageTitle>@selectedTag tagged posts</PageTitle>
 8 | 
 9 |     <div class="relative bg-gray-50 dark:bg-gray-900 px-6 pt-16 pb-20 lg:px-8 lg:pt-24 lg:pb-28">
10 |         <div class="absolute inset-0">
11 |             <div class="h-1/3 bg-white dark:bg-black sm:h-2/3"></div>
12 |         </div>
13 |         <div class="relative mx-auto max-w-7xl">
14 |             <BlogTitle Heading=@($"All posts tagged in <b>{selectedTag}</b>") />
15 |         </div>
16 |         <div class="relative my-4 mx-auto max-w-7xl">
17 |             <div class="flex flex-wrap justify-center">
18 |                 @foreach (var tag in allTags.OrderByDescending(tag => tagCounts[tag]))
19 |                 {
20 |                     if (tag == selectedTag)
21 |                     {
22 |                         <span class="mr-2 mb-2 text-xs leading-5 font-semibold bg-indigo-600 text-white rounded-full py-1 px-3 flex items-center space-x-2">@tag</span>
23 |                     }
24 |                     else
25 |                     {
26 |                         <a href="@Blog.GetTagLink(tag)" class="mr-2 mb-2 text-xs leading-5 font-semibold bg-slate-400/10 rounded-full py-1 px-3 flex items-center space-x-2 hover:bg-slate-400/20 dark:highlight-white/5">@tag</a>
27 |                     }
28 |                 }
29 |             </div>
30 |         </div>
31 |         <div class="mt-12 relative mx-auto max-w-7xl">
32 |             <BlogPosts Posts=@Blog.GetPosts(tag: selectedTag ?? "unknown") />
33 | 
34 |             <div class="mt-8 text-center">
35 |                 <a class="text-sm font-semibold hover:underline" href="@Blog.GetPostsLink()">view all posts</a>
36 |             </div>
37 |         </div>
38 |     </div>
39 | }
40 | else
41 | {
42 |     <div class="mt-3 mb-20 mx-auto max-w-fit">
43 |     @if (error != null)
44 |     {
45 |         <ErrorSummary Status=@error />
46 |     }
47 |     else
48 |     {
49 |         <Loading />
50 |     }
51 |     </div>
52 | }
53 | 
54 | @code {
55 |     [Parameter] public required string Slug { get; set; }
56 | 
57 |     string? selectedTag;
58 |     List<MarkdownFileInfo> allPosts = new();
59 |     List<string> allTags = new();
60 |     Dictionary<string, int> tagCounts = new();
61 |     ResponseStatus? error;
62 | 
63 |     void load()
64 |     {
65 |         selectedTag = Blog.GetTagBySlug(Slug);
66 |         allPosts = Blog.GetPosts();
67 |         allTags = allPosts.SelectMany(x => x.Tags).Distinct().ToList();
68 |         tagCounts = new();
69 |         allTags.Each(tag => tagCounts[tag] = allPosts.Count(x => x.Tags.Safe().Contains(tag)));
70 |     }
71 | 
72 |     protected override void OnInitialized() => load();
73 | 
74 |     protected override void OnParametersSet() => load();
75 | }
76 | 


--------------------------------------------------------------------------------
/MyApp/Migrations/Migration1000.cs:
--------------------------------------------------------------------------------
 1 | using System.Data;
 2 | using ServiceStack;
 3 | using ServiceStack.DataAnnotations;
 4 | using ServiceStack.OrmLite;
 5 | 
 6 | namespace MyApp.Migrations;
 7 | 
 8 | public class Migration1000 : MigrationBase
 9 | {
10 |     public class Booking : AuditBase
11 |     {
12 |         [AutoIncrement]
13 |         public int Id { get; set; }
14 |         public string Name { get; set; } = default!;
15 |         public RoomType RoomType { get; set; }
16 |         public int RoomNumber { get; set; }
17 |         public DateTime BookingStartDate { get; set; }
18 |         public DateTime? BookingEndDate { get; set; }
19 |         public decimal Cost { get; set; }
20 |         public string? Notes { get; set; }
21 |         public bool? Cancelled { get; set; }
22 | 
23 |         [References(typeof(Coupon))]
24 |         public string? CouponId { get; set; }
25 |     }
26 | 
27 |     public class Coupon
28 |     {
29 |         public string Id { get; set; } = default!;
30 |         public string Description { get; set; } = default!;
31 |         public int Discount { get; set; }
32 |         public DateTime ExpiryDate { get; set; }
33 |     }
34 | 
35 |     public enum RoomType
36 |     {
37 |         Queen,
38 |         Double,
39 |         Suite,
40 |     }
41 | 
42 |     public override void Up()
43 |     {
44 |         Db.CreateTable<Coupon>();
45 |         Db.CreateTable<Booking>();
46 | 
47 |         new[] { 5, 10, 15, 20, 25, 30, 40, 50, 60, 70, }.Each(percent => {
48 |             Db.Insert(new Coupon
49 |             {
50 |                 Id = $"BOOK{percent}",
51 |                 Description = $"{percent}% off",
52 |                 Discount = percent,
53 |                 ExpiryDate = DateTime.UtcNow.AddDays(30)
54 |             });
55 |         });
56 | 
57 |         CreateBooking(Db, "First Booking!", RoomType.Queen, 10, 100, "BOOK10", "employee@email.com");
58 |         CreateBooking(Db, "Booking 2", RoomType.Double, 12, 120, "BOOK25", "manager@email.com");
59 |         CreateBooking(Db, "Booking the 3rd", RoomType.Suite, 13, 130, null, "employee@email.com");
60 |     }
61 | 
62 |     public void CreateBooking(IDbConnection? db,
63 |         string name, RoomType type, int roomNo, decimal cost, string? couponId, string by) =>
64 |         db.Insert(new Booking
65 |         {
66 |             Name = name,
67 |             RoomType = type,
68 |             RoomNumber = roomNo,
69 |             Cost = cost,
70 |             BookingStartDate = DateTime.UtcNow.AddDays(roomNo),
71 |             BookingEndDate = DateTime.UtcNow.AddDays(roomNo + 7),
72 |             CouponId = couponId,
73 |             CreatedBy = by,
74 |             CreatedDate = DateTime.UtcNow,
75 |             ModifiedBy = by,
76 |             ModifiedDate = DateTime.UtcNow,
77 |         });
78 | 
79 |     public override void Down()
80 |     {
81 |         Db.DropTable<Booking>();
82 |         Db.DropTable<Coupon>();
83 |     }
84 | }


--------------------------------------------------------------------------------
/MyApp/Components/Shared/BlogPosts.razor:
--------------------------------------------------------------------------------
 1 | @inject MarkdownBlog Blog
 2 | 
 3 | <div class="mx-auto grid max-w-lg gap-5 lg:max-w-none lg:grid-cols-3">
 4 |     @foreach (var post in Posts)
 5 |     {
 6 |         var authorHref = Blog.GetAuthorLink(post.Author);
 7 |         <div class="flex flex-col overflow-hidden rounded-lg shadow-lg">
 8 |             <div class="flex-shrink-0">
 9 |                 <a href="@Blog.GetPostLink(post)">
10 |                     <img class="h-48 w-full object-cover" src="@Blog.GetSplashImage(post)" alt="">
11 |                 </a>
12 |             </div>
13 |             <div class="flex flex-1 flex-col justify-between bg-white dark:bg-black p-6">
14 |                 <div class="flex-1">
15 |                     <p class="text-sm font-medium text-indigo-600 dark:text-indigo-300">
16 |                         Article
17 |                     </p>
18 |                     <a href="@Blog.GetPostLink(post)" class="mt-2 block">
19 |                         <p class="text-xl font-semibold text-gray-900 dark:text-gray-50 whitespace-nowrap overflow-hidden text-ellipsis" title="@post.Title">
20 |                             @post.Title
21 |                         </p>
22 |                         <p class="mt-3 text-base text-gray-500">@post.Summary</p>
23 |                     </a>
24 |                 </div>
25 |                 <div class="mt-6 flex items-center">
26 |                     <div class="flex-shrink-0">
27 |                         <a href="">
28 |                             <span class="sr-only">@post.Author</span>
29 |                             <img class="h-10 w-10 rounded-full" src="@Blog.GetAuthorProfileUrl(post.Author)" alt="@post.Title background">
30 |                         </a>
31 |                     </div>
32 |                     <div class="ml-3">
33 |                         <p class="text-sm font-medium text-gray-900">
34 |                             @if (authorHref != null)
35 |                             {
36 |                                 <a href="@Blog.GetAuthorLink(post.Author!)" class="hover:underline">@post.Author</a>
37 |                             }
38 |                             else
39 |                             {
40 |                                 <span>@post.Author</span>
41 |                             }
42 |                         </p>
43 |                         <div class="flex space-x-1 text-sm text-gray-500">
44 |                             <time datetime="@Blog.GetDateTimestamp(post.Date)">@Blog.GetDateLabel(post.Date)</time>
45 |                             <span class="px-1" aria-hidden="true">&middot;</span>
46 |                             <span>@Blog.MinutesToRead(post.WordCount) min read</span>
47 |                         </div>
48 |                     </div>
49 |                 </div>
50 |             </div>
51 |         </div>
52 |     }
53 | </div>
54 | 
55 | @code {
56 |     [Parameter]
57 |     public required List<MarkdownFileInfo> Posts { get; set; }
58 | }
59 | 


--------------------------------------------------------------------------------
/config/deploy.yml:
--------------------------------------------------------------------------------
 1 | # <% require "dotenv"; Dotenv.load(".env") %>
 2 | # Kamal deploy config for this repository. Uses environment variables:
 3 | # - GITHUB_REPOSITORY (e.g. acme/example.org) - from GitHub Action ${github.repository}
 4 | #     SERVICE (e.g. example-org)
 5 | #     IMAGE   (e.g. ghcr.io/acme/example.org)
 6 | # - KAMAL_REGISTRY_USERNAME (e.g. my-user)    - from GitHub Action ${github.actor}
 7 | # - KAMAL_REGISTRY_PASSWORD ($GITHUB_TOKEN)   - from GitHub Action ${secrets.GITHUB_TOKEN}
 8 | # - KAMAL_DEPLOY_IP (e.g. 100.100.100.100)    - from GitHub Action Secret
 9 | # - KAMAL_DEPLOY_HOST (e.g. example.org)      - from GitHub Action Secret
10 | # - POSTGRES_PASSWORD (e.g. random-password)  - from GitHub Action Secret
11 | #
12 | # Using environment variables keeps this configuration reusable across multiple apps.
13 | # For a simpler app-specific setup (without needing .env), they can be replaced with hard-coded values.
14 | 
15 | # Name of your application. Used to uniquely configure containers. (e.g. example-org)
16 | service: <%= ENV['SERVICE'] %>
17 | 
18 | # Name of the container image. (e.g. ghcr.io/acme/example.org)
19 | image: <%= ENV['IMAGE'] %>
20 | 
21 | # Required for use of ASP.NET Core with Kamal-Proxy.
22 | env:
23 |   clear:
24 |     ASPNETCORE_FORWARDEDHEADERS_ENABLED: true
25 |   # secrets from ./kamal/secrets
26 |   secret:
27 |     - SERVICESTACK_LICENSE
28 |     - APPSETTINGS_JSON_BASE64
29 | 
30 | # Deploy to these servers.
31 | servers:
32 |   # IP address of server to deploy to. (e.g. 100.100.100.100)
33 |   web:
34 |     hosts:
35 |      - <%= ENV['KAMAL_DEPLOY_IP'] %>
36 | 
37 | # Enable SSL auto certification via Let's Encrypt (and allow for multiple apps on one server).
38 | # If using something like Cloudflare, it is recommended to set encryption mode
39 | # in Cloudflare's SSL/TLS setting to "Full" to enable end-to-end encryption.
40 | proxy:
41 |   ssl: true
42 |   # Hostname to proxy. (e.g. example.org)
43 |   host: <%= ENV['KAMAL_DEPLOY_HOST'] %>
44 |   # kamal-proxy connects to your container over port 80, use `app_port` to specify a different port.
45 |   app_port: 8080
46 | 
47 | # Credentials for your image host.
48 | registry:
49 |   # Specify the registry server, if you're not using Docker Hub
50 |   server: ghcr.io
51 |   username:
52 |     - KAMAL_REGISTRY_USERNAME
53 | 
54 |   # Always use an access token rather than real password (pulled from .kamal/secrets).
55 |   password:
56 |     - KAMAL_REGISTRY_PASSWORD
57 | 
58 | # Configure builder setup.
59 | builder:
60 |   arch: amd64
61 | 
62 | volumes:
63 |   - "/opt/docker/<%= ENV['SERVICE'] %>/App_Data:/app/App_Data"
64 | 
65 | #accessories:
66 | #  litestream:
67 | #    roles: ["web"]
68 | #    image: litestream/litestream
69 | #    files: ["config/litestream.yml:/etc/litestream.yml"]
70 | #    volumes: ["/opt/docker/MyApp/App_Data:/data"]
71 | #    cmd: replicate
72 | #    env:
73 | #      secret:
74 | #        - ACCESS_KEY_ID
75 | #        - SECRET_ACCESS_KEY
76 | 


--------------------------------------------------------------------------------
/MyApp/Components/Account/Pages/RegisterConfirmation.razor:
--------------------------------------------------------------------------------
 1 | @page "/Account/RegisterConfirmation"
 2 | 
 3 | @using System.Text
 4 | @using Microsoft.AspNetCore.Identity
 5 | @using Microsoft.AspNetCore.WebUtilities
 6 | @using MyApp.Data
 7 | 
 8 | @inject UserManager<ApplicationUser> UserManager
 9 | @inject IEmailSender<ApplicationUser> EmailSender
10 | @inject NavigationManager NavigationManager
11 | @inject IdentityRedirectManager RedirectManager
12 | 
13 | <PageTitle>Register confirmation</PageTitle>
14 | 
15 | <div class="mt-8 mx-auto max-w-lg">
16 |     <Heading1>Register confirmation</Heading1>
17 | 
18 |     <StatusMessage Message="@statusMessage" />
19 | 
20 |     @if (emailConfirmationLink is not null)
21 |     {
22 |         <p class="my-4">
23 |             This app does not currently have a real email sender registered, see 
24 |             <HyperLink class="font-semibold" href="https://aka.ms/aspaccountconf">these docs</HyperLink> for how to configure a real email sender.
25 |         </p>
26 |         <p class="my-4">
27 |             Normally this would be emailed:
28 |             <HyperLink class="font-semibold" id="confirm-link" href="@emailConfirmationLink">Click here to confirm your account</HyperLink>
29 |         </p>
30 |     }
31 |     else
32 |     {
33 |         <p class="my-4">Please check your email to confirm your account.</p>
34 |     }
35 | </div>
36 | 
37 | @code {
38 |     private string? emailConfirmationLink;
39 |     private string? statusMessage;
40 | 
41 |     [CascadingParameter]
42 |     private HttpContext HttpContext { get; set; } = default!;
43 | 
44 |     [SupplyParameterFromQuery]
45 |     private string? Email { get; set; }
46 | 
47 |     [SupplyParameterFromQuery]
48 |     private string? ReturnUrl { get; set; }
49 | 
50 |     protected override async Task OnInitializedAsync()
51 |     {
52 |         if (Email is null)
53 |         {
54 |             RedirectManager.RedirectTo("");
55 |         }
56 | 
57 |         var user = await UserManager.FindByEmailAsync(Email);
58 |         if (user is null)
59 |         {
60 |             HttpContext.Response.StatusCode = StatusCodes.Status404NotFound;
61 |             statusMessage = "Error finding user for unspecified email";
62 |         }
63 |         else if (EmailSender is IdentityNoOpEmailSender)
64 |         {
65 |             // Once you add a real email sender, you should remove this code that lets you confirm the account
66 |             var userId = await UserManager.GetUserIdAsync(user);
67 |             var code = await UserManager.GenerateEmailConfirmationTokenAsync(user);
68 |             code = WebEncoders.Base64UrlEncode(Encoding.UTF8.GetBytes(code));
69 |             emailConfirmationLink = NavigationManager.GetUriWithQueryParameters(
70 |                 NavigationManager.ToAbsoluteUri("Account/ConfirmEmail").AbsoluteUri,
71 |                 new Dictionary<string, object?> { ["userId"] = userId, ["code"] = code, ["returnUrl"] = ReturnUrl });
72 |         }
73 |     }
74 | }
75 | 


--------------------------------------------------------------------------------
/MyApp/Components/Account/Pages/Manage/GenerateRecoveryCodes.razor:
--------------------------------------------------------------------------------
 1 | @page "/Account/Manage/GenerateRecoveryCodes"
 2 | 
 3 | @using Microsoft.AspNetCore.Identity
 4 | @using MyApp.Data
 5 | 
 6 | @inject UserManager<ApplicationUser> UserManager
 7 | @inject IdentityUserAccessor UserAccessor
 8 | @inject IdentityRedirectManager RedirectManager
 9 | @inject ILogger<GenerateRecoveryCodes> Logger
10 | 
11 | <PageTitle>Generate two-factor authentication (2FA) recovery codes</PageTitle>
12 | 
13 | <div class="max-w-xl">
14 |     @if (recoveryCodes is not null)
15 |     {
16 |         <ShowRecoveryCodes RecoveryCodes="recoveryCodes.ToArray()" StatusMessage="@message" />
17 |     }
18 |     else
19 |     {
20 |         <Heading3>Generate two-factor authentication (2FA) recovery codes</Heading3>
21 |         <Alert Type="AlertType.Warning">
22 |             <p class="mb-3">
23 |                 <strong>Put these codes in a safe place.</strong>
24 |             </p>
25 |             <p class="mb-3">
26 |                 If you lose your device and don't have the recovery codes you will lose access to your account.
27 |             </p>
28 |             <p class="mb-3">
29 |                 Generating new recovery codes does not change the keys used in authenticator apps. 
30 |                 If you wish to change the key used in an authenticator app you should
31 |                 <HyperLink class="font-semibold" href="Account/Manage/ResetAuthenticator">reset your authenticator keys.</HyperLink>
32 |             </p>
33 |         </Alert>
34 |         <div class="mt-4">
35 |             <form @formname="generate-recovery-codes" @onsubmit="OnSubmitAsync" method="post">
36 |                 <AntiforgeryToken />
37 |                 <PrimaryButton Style="ButtonStyle.Red" type="submit">Generate Recovery Codes</PrimaryButton>
38 |             </form>
39 |         </div>
40 |     }
41 | </div>
42 | 
43 | @code {
44 |     private string? message;
45 |     private ApplicationUser user = default!;
46 |     private IEnumerable<string>? recoveryCodes;
47 | 
48 |     [CascadingParameter]
49 |     private HttpContext HttpContext { get; set; } = default!;
50 | 
51 |     protected override async Task OnInitializedAsync()
52 |     {
53 |         user = await UserAccessor.GetRequiredUserAsync(HttpContext);
54 | 
55 |         var isTwoFactorEnabled = await UserManager.GetTwoFactorEnabledAsync(user);
56 |         if (!isTwoFactorEnabled)
57 |         {
58 |             throw new InvalidOperationException("Cannot generate recovery codes for user because they do not have 2FA enabled.");
59 |         }
60 |     }
61 | 
62 |     private async Task OnSubmitAsync()
63 |     {
64 |         var userId = await UserManager.GetUserIdAsync(user);
65 |         recoveryCodes = await UserManager.GenerateNewTwoFactorRecoveryCodesAsync(user, 10);
66 |         message = "You have generated new recovery codes.";
67 | 
68 |         Logger.LogInformation("User with ID '{UserId}' has generated new 2FA recovery codes.", userId);
69 |     }
70 | }
71 | 


--------------------------------------------------------------------------------
/MyApp/wwwroot/img/profiles/user3.svg:
--------------------------------------------------------------------------------
 1 | <?xml version="1.0" encoding="iso-8859-1"?>
 2 | <!-- Generator: Adobe Illustrator 18.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
 3 | <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
 4 | <svg version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
 5 | 	 viewBox="0 0 144.773 144.773" style="enable-background:new 0 0 144.773 144.773;" xml:space="preserve">
 6 | <g>
 7 | 	<circle style="fill:#13AEC0;" cx="72.387" cy="72.386" r="72.386"/>
 8 | 	<g>
 9 | 		<defs>
10 | 			<circle id="SVGID_1_" cx="72.387" cy="72.386" r="72.386"/>
11 | 		</defs>
12 | 		<clipPath id="SVGID_2_">
13 | 			<use xlink:href="#SVGID_1_"  style="overflow:visible;"/>
14 | 		</clipPath>
15 | 		<g style="clip-path:url(#SVGID_2_);">
16 | 			<path style="fill:#F1C9A5;" d="M107.053,116.94c-4.666-8.833-34.666-14.376-34.666-14.376s-30,5.543-34.666,14.376
17 | 				c-3.449,12.258-6.334,27.833-6.334,27.833h41h41C113.387,144.773,111.438,128.073,107.053,116.94z"/>
18 | 			<path style="fill:#E4B692;" d="M72.387,102.564c0,0,30,5.543,34.666,14.376c4.386,11.133,6.334,27.833,6.334,27.833h-41V102.564z
19 | 				"/>
20 | 			<rect x="64.22" y="84.607" style="fill:#F1C9A5;" width="16.334" height="27.336"/>
21 | 			<rect x="72.387" y="84.607" style="fill:#E4B692;" width="8.167" height="27.336"/>
22 | 			<path style="opacity:0.1;fill:#DDAC8C;" d="M64.22,97.273c1.469,4.217,7.397,6.634,11.751,6.634c1.575,0,3.107-0.264,4.583-0.747
23 | 				V84.606H64.22V97.273z"/>
24 | 			<path style="fill:#F1C9A5;" d="M93.387,67.357c0-17.074-9.402-26.783-21-26.783c-11.598,0-21,9.709-21,26.783
25 | 				c0,22.966,9.402,30.917,21,30.917C83.984,98.274,93.387,89.366,93.387,67.357z"/>
26 | 			<path style="fill:#E4B692;" d="M90.19,79.197c-3.807-0.399-6.377-4.5-5.733-9.156c0.637-4.66,4.242-8.12,8.051-7.724
27 | 				c3.805,0.396,6.371,4.496,5.729,9.156C97.599,76.134,93.997,79.591,90.19,79.197z"/>
28 | 			<path style="fill:#F1C9A5;" d="M46.685,71.474c-0.643-4.66,1.924-8.76,5.727-9.156c3.811-0.397,7.416,3.063,8.055,7.724
29 | 				c0.642,4.656-1.93,8.758-5.734,9.156C50.925,79.591,47.323,76.134,46.685,71.474z"/>
30 | 			<path style="fill:#E4B692;" d="M93.387,67.357c0-17.074-9.402-26.783-21-26.783v57.7C83.984,98.274,93.387,89.366,93.387,67.357z
31 | 				"/>
32 | 			<path style="fill:#265A68;" d="M52.188,73.014c0,0,2.888-5.551,4.12-16.22c8.713,8.279,18.978,9.604,32.546,0
33 | 				c0.334,7.779,2.609,12.631,5.276,16.22c1.641-13.441,5.266-20.066,4.049-27.13c-9.043,1.496-12.227-5.936-25.793-5.936
34 | 				c-13.568,0-16.587,7.149-25.018,6.51C47.369,54.851,51.387,59.323,52.188,73.014z"/>
35 | 			<path style="fill:#2D5972;" d="M107.053,116.94c-2.99-5.66-16.375-9.966-25.61-12.331c-0.359,4.691-4.272,8.389-9.056,8.389
36 | 				c-4.783,0-8.696-3.697-9.056-8.389c-9.235,2.365-22.62,6.671-25.61,12.331c-3.449,12.258-6.334,27.833-6.334,27.833h41h41
37 | 				C113.387,144.773,111.438,128.073,107.053,116.94z"/>
38 | 		</g>
39 | 	</g>
40 | </g>
41 | </svg>
42 | 


--------------------------------------------------------------------------------
/MyApp/Components/Account/Pages/ResendEmailConfirmation.razor:
--------------------------------------------------------------------------------
 1 | @page "/Account/ResendEmailConfirmation"
 2 | 
 3 | @using System.ComponentModel.DataAnnotations
 4 | @using System.Text
 5 | @using System.Text.Encodings.Web
 6 | @using Microsoft.AspNetCore.Identity
 7 | @using Microsoft.AspNetCore.WebUtilities
 8 | @using MyApp.Data
 9 | 
10 | @inject UserManager<ApplicationUser> UserManager
11 | @inject IEmailSender<ApplicationUser> EmailSender
12 | @inject NavigationManager NavigationManager
13 | @inject IdentityRedirectManager RedirectManager
14 | 
15 | <PageTitle>Resend email confirmation</PageTitle>
16 | 
17 | <div class="mt-8 mx-auto max-w-lg">
18 |     <Heading1>Resend email confirmation</Heading1>
19 |     <Heading3>Enter your email.</Heading3>
20 | 
21 |     <StatusMessage class="mb-3" Message="@message" />
22 |     <EditForm Model="Input" FormName="resend-email-confirmation" OnValidSubmit="OnValidSubmitAsync" method="post">
23 |         <DataAnnotationsValidator />
24 |         <ValidationSummary class="mb-3 text-danger text-center font-semibold" />
25 |         <div class="flex flex-col gap-y-4">
26 |             <div>
27 |                 <label for="email" class="@TextInput.LabelClasses">Email</label>
28 |                 <div class="mt-1 relative">
29 |                     <InputText id="email" type="text" @bind-Value="Input.Email" class="@TextInput.InputClasses" aria-required="true" placeholder="name@example.com" />
30 |                 </div>
31 |                 <ValidationMessage For="() => Input.Email" class="mt-2 text-danger text-sm" />
32 |             </div>
33 |             <div>
34 |                 <PrimaryButton type="submit">Resend</PrimaryButton>
35 |             </div>
36 |         </div>
37 |     </EditForm>
38 | </div>
39 | 
40 | @code {
41 |     private string? message;
42 | 
43 |     [SupplyParameterFromForm]
44 |     private InputModel Input { get; set; } = new();
45 | 
46 |     private async Task OnValidSubmitAsync()
47 |     {
48 |         var user = await UserManager.FindByEmailAsync(Input.Email!);
49 |         if (user is null)
50 |         {
51 |             message = "Verification email sent. Please check your email.";
52 |             return;
53 |         }
54 | 
55 |         var userId = await UserManager.GetUserIdAsync(user);
56 |         var code = await UserManager.GenerateEmailConfirmationTokenAsync(user);
57 |         code = WebEncoders.Base64UrlEncode(Encoding.UTF8.GetBytes(code));
58 |         var callbackUrl = NavigationManager.GetUriWithQueryParameters(
59 |             NavigationManager.ToAbsoluteUri("Account/ConfirmEmail").AbsoluteUri,
60 |             new Dictionary<string, object?> { ["userId"] = userId, ["code"] = code });
61 |         await EmailSender.SendConfirmationLinkAsync(user, Input.Email, HtmlEncoder.Default.Encode(callbackUrl));
62 | 
63 |         message = "Verification email sent. Please check your email.";
64 |     }
65 | 
66 |     private sealed class InputModel
67 |     {
68 |         [Required]
69 |         [EmailAddress]
70 |         public string Email { get; set; } = "";
71 |     }
72 | }
73 | 


--------------------------------------------------------------------------------
/.kamal/hooks/pre-deploy.sample:
--------------------------------------------------------------------------------
  1 | #!/usr/bin/env ruby
  2 | 
  3 | # A sample pre-deploy hook
  4 | #
  5 | # Checks the Github status of the build, waiting for a pending build to complete for up to 720 seconds.
  6 | #
  7 | # Fails unless the combined status is "success"
  8 | #
  9 | # These environment variables are available:
 10 | # KAMAL_RECORDED_AT
 11 | # KAMAL_PERFORMER
 12 | # KAMAL_VERSION
 13 | # KAMAL_HOSTS
 14 | # KAMAL_COMMAND
 15 | # KAMAL_SUBCOMMAND
 16 | # KAMAL_ROLE (if set)
 17 | # KAMAL_DESTINATION (if set)
 18 | 
 19 | # Only check the build status for production deployments
 20 | if ENV["KAMAL_COMMAND"] == "rollback" || ENV["KAMAL_DESTINATION"] != "production"
 21 |   exit 0
 22 | end
 23 | 
 24 | require "bundler/inline"
 25 | 
 26 | # true = install gems so this is fast on repeat invocations
 27 | gemfile(true, quiet: true) do
 28 |   source "https://rubygems.org"
 29 | 
 30 |   gem "octokit"
 31 |   gem "faraday-retry"
 32 | end
 33 | 
 34 | MAX_ATTEMPTS = 72
 35 | ATTEMPTS_GAP = 10
 36 | 
 37 | def exit_with_error(message)
 38 |   $stderr.puts message
 39 |   exit 1
 40 | end
 41 | 
 42 | class GithubStatusChecks
 43 |   attr_reader :remote_url, :git_sha, :github_client, :combined_status
 44 | 
 45 |   def initialize
 46 |     @remote_url = `git config --get remote.origin.url`.strip.delete_prefix("https://github.com/")
 47 |     @git_sha = `git rev-parse HEAD`.strip
 48 |     @github_client = Octokit::Client.new(access_token: ENV["GITHUB_TOKEN"])
 49 |     refresh!
 50 |   end
 51 | 
 52 |   def refresh!
 53 |     @combined_status = github_client.combined_status(remote_url, git_sha)
 54 |   end
 55 | 
 56 |   def state
 57 |     combined_status[:state]
 58 |   end
 59 | 
 60 |   def first_status_url
 61 |     first_status = combined_status[:statuses].find { |status| status[:state] == state }
 62 |     first_status && first_status[:target_url]
 63 |   end
 64 | 
 65 |   def complete_count
 66 |     combined_status[:statuses].count { |status| status[:state] != "pending"}
 67 |   end
 68 | 
 69 |   def total_count
 70 |     combined_status[:statuses].count
 71 |   end
 72 | 
 73 |   def current_status
 74 |     if total_count > 0
 75 |       "Completed #{complete_count}/#{total_count} checks, see #{first_status_url} ..."
 76 |     else
 77 |       "Build not started..."
 78 |     end
 79 |   end
 80 | end
 81 | 
 82 | 
 83 | $stdout.sync = true
 84 | 
 85 | puts "Checking build status..."
 86 | attempts = 0
 87 | checks = GithubStatusChecks.new
 88 | 
 89 | begin
 90 |   loop do
 91 |     case checks.state
 92 |     when "success"
 93 |       puts "Checks passed, see #{checks.first_status_url}"
 94 |       exit 0
 95 |     when "failure"
 96 |       exit_with_error "Checks failed, see #{checks.first_status_url}"
 97 |     when "pending"
 98 |       attempts += 1
 99 |     end
100 | 
101 |     exit_with_error "Checks are still pending, gave up after #{MAX_ATTEMPTS * ATTEMPTS_GAP} seconds" if attempts == MAX_ATTEMPTS
102 | 
103 |     puts checks.current_status
104 |     sleep(ATTEMPTS_GAP)
105 |     checks.refresh!
106 |   end
107 | rescue Octokit::NotFound
108 |   exit_with_error "Build status could not be found"
109 | end
110 | 


--------------------------------------------------------------------------------
/MyApp/Components/Account/Pages/ForgotPassword.razor:
--------------------------------------------------------------------------------
 1 | @page "/Account/ForgotPassword"
 2 | 
 3 | @using System.ComponentModel.DataAnnotations
 4 | @using System.Text
 5 | @using System.Text.Encodings.Web
 6 | @using Microsoft.AspNetCore.Identity
 7 | @using Microsoft.AspNetCore.WebUtilities
 8 | @using MyApp.Data
 9 | 
10 | @inject UserManager<ApplicationUser> UserManager
11 | @inject IEmailSender<ApplicationUser> EmailSender
12 | @inject NavigationManager NavigationManager
13 | @inject IdentityRedirectManager RedirectManager
14 | 
15 | <PageTitle>Forgot your password?</PageTitle>
16 | 
17 | <div class="mt-8 mx-auto max-w-lg">
18 |     <Heading1>Forgot your password?</Heading1>
19 |     <Heading3>Enter your email.</Heading3>
20 | 
21 |     <EditForm Model="Input" FormName="forgot-password" OnValidSubmit="OnValidSubmitAsync" method="post">
22 |         <DataAnnotationsValidator />
23 |         <ValidationSummary class="mb-3 text-danger text-center font-semibold" />
24 |         <div class="flex flex-col gap-y-4">
25 |             <div>
26 |                 <label for="email" class="@TextInput.LabelClasses">Email</label>
27 |                 <div class="mt-1 relative">
28 |                     <InputText id="email" type="text" @bind-Value="Input.Email" class="@TextInput.InputClasses" autocomplete="username" aria-required="true" placeholder="name@example.com" />
29 |                 </div>
30 |                 <ValidationMessage For="() => Input.Email" class="mt-2 text-danger text-sm" />
31 |             </div>
32 |             <div>
33 |                 <PrimaryButton type="submit">Reset password</PrimaryButton>
34 |             </div>
35 |         </div>
36 |     </EditForm>
37 | </div>
38 | 
39 | @code {
40 |     [SupplyParameterFromForm]
41 |     private InputModel Input { get; set; } = new();
42 | 
43 |     private async Task OnValidSubmitAsync()
44 |     {
45 |         var user = await UserManager.FindByEmailAsync(Input.Email);
46 |         if (user is null || !(await UserManager.IsEmailConfirmedAsync(user)))
47 |         {
48 |             // Don't reveal that the user does not exist or is not confirmed
49 |             RedirectManager.RedirectTo("Account/ForgotPasswordConfirmation");
50 |         }
51 | 
52 |         // For more information on how to enable account confirmation and password reset please
53 |         // visit https://go.microsoft.com/fwlink/?LinkID=532713
54 |         var code = await UserManager.GeneratePasswordResetTokenAsync(user);
55 |         code = WebEncoders.Base64UrlEncode(Encoding.UTF8.GetBytes(code));
56 |         var callbackUrl = NavigationManager.GetUriWithQueryParameters(
57 |             NavigationManager.ToAbsoluteUri("Account/ResetPassword").AbsoluteUri,
58 |             new Dictionary<string, object?> { ["code"] = code });
59 | 
60 |         await EmailSender.SendPasswordResetLinkAsync(user, Input.Email, HtmlEncoder.Default.Encode(callbackUrl));
61 | 
62 |         RedirectManager.RedirectTo("Account/ForgotPasswordConfirmation");
63 |     }
64 | 
65 |     private sealed class InputModel
66 |     {
67 |         [Required]
68 |         [EmailAddress]
69 |         public string Email { get; set; } = "";
70 |     }
71 | }
72 | 


--------------------------------------------------------------------------------
/MyApp/wwwroot/css/lite-yt-embed.css:
--------------------------------------------------------------------------------
 1 | lite-youtube {
 2 |     background-color: #000;
 3 |     transition: all 0.2s cubic-bezier(0, 0, 0.2, 1);
 4 |     position: relative;
 5 |     display: block;
 6 |     contain: content;
 7 |     background-position: center center;
 8 |     background-size: cover;
 9 |     cursor: pointer;
10 |     max-width: 720px;
11 | }
12 | 
13 | lite-youtube:hover {
14 |     transition: all 0.2s cubic-bezier(0, 0, 0.2, 1);
15 | }
16 | 
17 | /* gradient */
18 | lite-youtube::before {
19 |     content: '';
20 |     display: block;
21 |     position: absolute;
22 |     top: 0;
23 |     /*background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAADGCAYAAAAT+OqFAAAAdklEQVQoz42QQQ7AIAgEF/T/D+kbq/RWAlnQyyazA4aoAB4FsBSA/bFjuF1EOL7VbrIrBuusmrt4ZZORfb6ehbWdnRHEIiITaEUKa5EJqUakRSaEYBJSCY2dEstQY7AuxahwXFrvZmWl2rh4JZ07z9dLtesfNj5q0FU3A5ObbwAAAABJRU5ErkJggg==);*/
24 |     background-position: top;
25 |     background-repeat: repeat-x;
26 |     height: 60px;
27 |     padding-bottom: 50px;
28 |     width: 100%;
29 |     transition: all 0.2s cubic-bezier(0, 0, 0.2, 1);
30 | }
31 | 
32 | /* responsive iframe with a 16:9 aspect ratio
33 |     thanks https://css-tricks.com/responsive-iframes/
34 | */
35 | lite-youtube::after {
36 |     content: "";
37 |     display: block;
38 |     padding-bottom: calc(100% / (16 / 9));
39 | }
40 | lite-youtube > iframe {
41 |     width: 100%;
42 |     height: 100%;
43 |     position: absolute;
44 |     top: 0;
45 |     left: 0;
46 |     border: 0;
47 | }
48 | 
49 | /* play button */
50 | lite-youtube > .lty-playbtn {
51 |     width: 60px;
52 |     height: 42px;
53 |     position: absolute;
54 |     cursor: pointer;
55 |     transform: translate3d(-50%, -50%, 0);
56 |     color: white;
57 |     top: 50%;
58 |     left: 50%;
59 |     z-index: 1;
60 |     opacity: 30%;
61 |     background: transparent url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 68 48"><path fill="%23f00" fill-opacity="0.8" d="M66.52,7.74c-0.78-2.93-2.49-5.41-5.42-6.19C55.79,.13,34,0,34,0S12.21,.13,6.9,1.55 C3.97,2.33,2.27,4.81,1.48,7.74C0.06,13.05,0,24,0,24s0.06,10.95,1.48,16.26c0.78,2.93,2.49,5.41,5.42,6.19 C12.21,47.87,34,48,34,48s21.79-0.13,27.1-1.55c2.93-0.78,4.64-3.26,5.42-6.19C67.94,34.95,68,24,68,24S67.94,13.05,66.52,7.74z"></path><path d="M 45,24 27,14 27,34" fill="%23fff"></path></svg>') no-repeat;
62 |     filter: grayscale(100%);
63 |     border: none;
64 | }
65 | 
66 | lite-youtube:hover > .lty-playbtn,
67 | lite-youtube .lty-playbtn:focus {
68 |     filter: grayscale(0);
69 |     transition: opacity 0.5s, filter .1s cubic-bezier(0, 0, 0.2, 1);
70 |     -webkit-transition: opacity 0.5s;
71 |     opacity: 100%;
72 |     outline: none;
73 | }
74 | 
75 | /* Post-click styles */
76 | lite-youtube.lyt-activated {
77 |     cursor: unset;
78 | }
79 | lite-youtube.lyt-activated::before,
80 | lite-youtube.lyt-activated > .lty-playbtn {
81 |     opacity: 0;
82 |     pointer-events: none;
83 | }
84 | 
85 | .lyt-visually-hidden {
86 |     clip: rect(0 0 0 0);
87 |     clip-path: inset(50%);
88 |     height: 1px;
89 |     overflow: hidden;
90 |     position: absolute;
91 |     white-space: nowrap;
92 |     width: 1px;
93 | }


--------------------------------------------------------------------------------
/MyApp/Components/Pages/Profile.razor:
--------------------------------------------------------------------------------
 1 | @page "/profile"
 2 | @attribute [Authorize]
 3 | @inherits AppAuthComponentBase
 4 | 
 5 | @inject NavigationManager NavigationManager
 6 | 
 7 | <div class="rounded-lg bg-white dark:bg-black overflow-hidden shadow dark:border dark:border-gray-800 mb-3">
 8 |     <h2 class="sr-only" id="profile-overview-title">Profile Overview</h2>
 9 |     <div class="bg-white dark:bg-black p-6">
10 |         <div class="sm:flex sm:items-center sm:justify-between">
11 |             <div class="sm:flex sm:space-x-5">
12 |                 <div class="flex-shrink-0">
13 |                     <img class="mx-auto w-24 h-24 max-h-24 max-w-24 rounded-full" src=@User.GetPicture() alt="">
14 |                 </div>
15 |                 <div class="mt-4 sm:mt-0 sm:pt-1 sm:text-left">
16 |                     <p class="text-sm font-medium text-gray-600 dark:text-gray-400">Welcome back,</p>
17 |                     <p class="text-xl font-bold text-gray-900 dark:text-gray-200 sm:text-2xl mb-2">@User.GetDisplayName()</p>
18 |                     @if (User.GetRoles().Length > 0)
19 |                     {
20 |                         <div class="mb-2 flex flex-wrap">
21 |                             @foreach (var role in User.GetRoles())
22 |                             {
23 |                                 <span @key="role" title="Role"
24 |                                       class="inline-flex items-center px-2.5 py-0.5 mr-1 mb-1 rounded-full text-xs font-medium bg-green-100 dark:bg-green-800 text-green-800 dark:text-green-100">
25 |                                     @role
26 |                                 </span>
27 |                             }
28 |                         </div>
29 |                     }
30 |                     @if (User.GetPermissions().Length > 0)
31 |                     {
32 |                         <div class="mb-2 flex flex-wrap">
33 |                             @foreach (var perm in User.GetPermissions())
34 |                             {
35 |                                 <span @key="perm" title="Role"
36 |                                       class="inline-flex items-center px-2.5 py-0.5 mr-1 mb-1 rounded-full text-xs font-medium bg-green-100 dark:bg-green-800 text-green-800 dark:text-green-100">
37 |                                     @perm
38 |                                 </span>
39 |                             }
40 |                         </div>
41 |                     }
42 |                 </div>
43 |             </div>
44 |             <div class="mt-5 flex justify-center sm:mt-0">
45 |                 <form action="Account/Logout" method="post">
46 |                     <AntiforgeryToken />
47 |                     <input type="hidden" name="ReturnUrl" value="@currentUrl" />
48 |                     <SecondaryButton type="submit">
49 |                         Sign Out
50 |                     </SecondaryButton>
51 |                 </form>
52 |             </div>
53 |         </div>
54 |     </div>
55 | </div>
56 | 
57 | @code {
58 |     private string? currentUrl;
59 | 
60 |     protected override void OnInitialized()
61 |     {
62 |         currentUrl = NavigationManager.ToBaseRelativePath(NavigationManager.Uri);
63 |     }
64 | }
65 | 
66 | 


--------------------------------------------------------------------------------
/MyApp/Components/Pages/Secure/Bookings.razor:
--------------------------------------------------------------------------------
 1 | @page "/secure/bookings"
 2 | @attribute [Authorize(Roles = "Employee")]
 3 | 
 4 | <div class="mt-8 mb-20 mx-auto max-w-fit">
 5 | 
 6 |     <Heading1>Bookings AutoQueryGrid</Heading1>
 7 | 
 8 |     <div id="bookings" data-component="pages/Bookings.mjs"></div>
 9 | 
10 |     <div>
11 |         <div class="mt-5 flex justify-center gap-x-4">
12 |             <SrcRazorPage Path="Secure/Bookings.razor" />
13 |             <SrcVuePage Path="Bookings.mjs" />
14 |         </div>
15 |     </div>
16 | 
17 |     <div class="pb-20">
18 | 
19 |         <h4 class="mt-20 text-center text-xl">
20 |             Manage Bookings in
21 |             <HyperLink class="font-semibold" href="/admin/#Bookings" data-enhance-nav="false">Admin</HyperLink>,
22 |             <HyperLink class="font-semibold" href="/locode/QueryBookings" data-enhance-nav="false">Locode</HyperLink> or
23 |             <HyperLink class="font-semibold" href="/ui/QueryBookings" data-enhance-nav="false">API Explorer</HyperLink>
24 |         </h4>
25 | 
26 |         <div class="mt-20 mx-auto text-gray-500 max-w-screen-lg">
27 |             <h2 class="mt-4 text-3xl sm:text-4xl text-slate-900 font-extrabold tracking-tight dark:text-slate-50">
28 |                 Create a multi-user Booking system in minutes
29 |             </h2>
30 |             <p class="my-3 mx-auto text-base text-gray-500 sm:text-lg md:mt-5 md:text-xl">
31 |                 The Bookings APIs are built using
32 |                 <HyperLink class="font-semibold" href="https://docs.servicestack.net/autoquery-crud">AutoQuery CRUD</HyperLink>,
33 |                 allowing for rapid development of typed CRUD Services using only declarative POCO DTOs, enabling
34 |                 developing entire
35 |                 <HyperLink class="font-semibold" href="https://docs.servicestack.net/autoquery-crud#advanced-crud-example">audited</HyperLink>
36 |                 &amp; <HyperLink class="font-semibold" href="https://docs.servicestack.net/autoquery-audit-log">verifiable</HyperLink>
37 |                 data-driven systems in mins
38 |                 <HyperLink class="font-semibold" href="https://docs.servicestack.net/autoquery-crud-bookings">more...</HyperLink>
39 |             </p>
40 |             <iframe class="mt-4 w-full aspect-video" src="https://www.youtube.com/embed/rSFiikDjGos" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen></iframe>
41 |         </div>
42 | 
43 |         <div class="mt-20 mx-auto text-gray-500 max-w-screen-lg">
44 |             <h2 class="mt-4 text-3xl sm:text-4xl text-slate-900 font-extrabold tracking-tight dark:text-slate-50">
45 |                 Instantly Manage your data using AutoQueryGrid Vue
46 |             </h2>
47 |             <p class="my-3 mx-auto text-base text-gray-500 sm:text-lg md:mt-5 md:text-xl">
48 |                 This walkthrough explores the ServiceStack Vue 3 library and the functionality of the AutoQueryGrid component.
49 |                 The AutoQueryGrid component simplifies the integration of AutoQuery services by generating a customizable UI.
50 |             </p>
51 |             <iframe class="mt-4 w-full aspect-video" src="https://www.youtube.com/embed/znCoC-Ct0Ps" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen></iframe>
52 |         </div>
53 | 
54 |     </div>
55 | 
56 | </div>
57 | 


--------------------------------------------------------------------------------
/MyApp/Components/Pages/Home.razor:
--------------------------------------------------------------------------------
 1 | @page "/"
 2 | 
 3 | <PageTitle>Home</PageTitle>
 4 | 
 5 | <div class="mx-auto mt-16 max-w-7xl px-4 sm:mt-24">
 6 |     <div class="text-center">
 7 |         <h1 class="text-4xl font-bold tracking-tight text-gray-900 dark:text-gray-100 sm:text-5xl md:text-6xl">
 8 |             <span class="block xl:inline">Welcome to</span>
 9 |             <span class="block text-indigo-600 dark:text-indigo-500 xl:inline">Blazor Vue</span>
10 |         </h1>
11 |         <p class="mx-auto mt-3 max-w-md text-base text-gray-500 sm:text-lg md:mt-5 md:max-w-3xl md:text-xl">
12 |             Welcome to your new Blazor Vue App, checkout links below to get started:
13 |         </p>
14 |         <div class="mx-auto mt-5 sm:flex sm:justify-center md:mt-8">
15 |             <div class="rounded-md shadow">
16 |                 <a href="/admin" class="flex w-full items-center justify-center rounded-md border border-transparent bg-white dark:bg-gray-800 dark:border-gray-600 px-8 py-3 text-base font-medium text-indigo-600 dark:text-gray-100 hover:bg-gray-50 dark:hover:bg-gray-700 md:py-4 md:px-10 md:text-lg">
17 |                     Admin UI
18 |                 </a>
19 |             </div>
20 |             <div class="mt-3 rounded-md shadow sm:mt-0 sm:ml-3">
21 |                 <a href="https://blazor-gallery.servicestack.net/" class="flex w-full items-center justify-center rounded-md border border-transparent bg-purple-600 px-8 py-3 text-base font-medium text-white hover:bg-purple-700 md:py-4 md:px-10 md:text-lg">
22 |                     Blazor Gallery
23 |                 </a>
24 |             </div>
25 |             <div class="mt-3 rounded-md shadow sm:mt-0 sm:ml-3">
26 |                 <a href="https://docs.servicestack.net/vue/" class="flex w-full items-center justify-center rounded-md border border-transparent bg-green-600 px-8 py-3 text-base font-medium text-white hover:bg-green-700 md:py-4 md:px-10 md:text-lg">
27 |                     Vue Gallery
28 |                 </a>
29 |             </div>
30 |             
31 |         </div>
32 |     </div>
33 | </div>
34 | 
35 | <section class="py-8 flex">
36 |     <div class="mt-8 mx-auto">
37 |         <h2 class="mt-2 text-3xl font-extrabold tracking-tight text-gray-900 dark:text-gray-100 sm:text-4xl text-center">
38 |             Getting Started
39 |         </h2>
40 |         <div>
41 |             <div data-component="GettingStarted" data-props="{template:'blazor-vue'}"></div>
42 |         </div>
43 |     </div>
44 | </section>
45 | 
46 | <div class="flex justify-center my-20 py-20 bg-slate-100 dark:bg-slate-800">
47 |     <div class="text-center">
48 |         <svg class="text-indigo-600 w-36 h-36 inline-block" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path fill="currentColor" d="m18 16l-4-3.2V16H6V8h8v3.2L18 8m2-4H4a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2V6a2 2 0 0 0-2-2Z" /></svg>
49 |         <h1 class="text-6xl md:text-7xl lg:text-8xl font-bold tracking-tighter leading-tight md:leading-none mb-12 text-center md:text-left">
50 |             Videos
51 |         </h1>
52 |     </div>
53 | </div>
54 | 
55 | <VideoGroup
56 |     Title="Blazor Templates and Components"
57 |     Summary="Use ServiceStack.Blazor Templates and Components to rapidly develop Blazor Web Apps"
58 |     Group="blazor"
59 |     LearnMore="https://servicestack.net/blazor" />
60 | 


--------------------------------------------------------------------------------
/MyApp/wwwroot/css/highlight.css:
--------------------------------------------------------------------------------
 1 | /* highlight.js - vs.css */
 2 | .hljs {background:white;color:black}
 3 | .hljs-comment,.hljs-quote,.hljs-variable{color:#008000}
 4 | .hljs-keyword,.hljs-selector-tag,.hljs-built_in,.hljs-name,.hljs-tag{color:#00f}
 5 | .hljs-string,.hljs-title,.hljs-section,.hljs-attribute,.hljs-literal,.hljs-template-tag,.hljs-template-variable,.hljs-type,.hljs-addition{color:#a31515}
 6 | .hljs-deletion,.hljs-selector-attr,.hljs-selector-pseudo,.hljs-meta{color:#2b91af}
 7 | .hljs-doctag{color:#808080}
 8 | .hljs-attr{color: #f00}
 9 | .hljs-symbol,.hljs-bullet,.hljs-link{color:#00b0e8}
10 | .hljs-emphasis{font-style:italic}
11 | .hljs-strong{font-weight:bold}
12 | 
13 | /* https://unpkg.com/@highlightjs/cdn-assets/styles/atom-one-dark.min.css */
14 | pre code.hljs{display:block;overflow-x:auto;padding:1em}code.hljs{padding:3px 5px}.hljs{color:#abb2bf;background:#282c34}
15 | .hljs-comment,.hljs-quote{color:#5c6370;font-style:italic}.hljs-doctag,.hljs-formula,.hljs-keyword{color:#c678dd}
16 | .hljs-deletion,.hljs-name,.hljs-section,.hljs-selector-tag,.hljs-subst,.hljs-tag{color:#e06c75}
17 | .hljs-literal{color:#56b6c2}
18 | .hljs-addition,.hljs-attribute,.hljs-meta .hljs-string,.hljs-regexp,.hljs-string{color:#98c379}
19 | .hljs-attr,.hljs-number,.hljs-selector-attr,.hljs-selector-class,.hljs-selector-pseudo,.hljs-template-variable,.hljs-type,.hljs-variable{color:#d19a66}
20 | .hljs-bullet,.hljs-link,.hljs-meta,.hljs-selector-id,.hljs-symbol,.hljs-title{color:#61aeee}
21 | .hljs-built_in,.hljs-class .hljs-title,.hljs-title.class_{color:#e6c07b}.hljs-emphasis{font-style:italic}.hljs-strong{font-weight:700}
22 | .hljs-link{text-decoration:underline}
23 | 
24 | /*highlightjs*/
25 | .hljs, .prose :where(pre):not(:where([class~="not-prose"] *)) .hljs {
26 |     color: #e5e7eb !important;
27 |     background-color: #282c34 !important;
28 | }
29 | .hljs-comment, .hljs-quote {
30 |     color: rgb(148 163 184); /*text-slate-400*/
31 | }
32 | 
33 | pre {
34 |     overflow-x: auto;
35 |     font-weight: 400;
36 |     font-size: .875em;
37 |     line-height: 1.7142857;
38 |     margin-top: 1.7142857em;
39 |     margin-bottom: 1.7142857em;
40 |     border-radius: .375rem;
41 |     padding: .8571429em 1.1428571em;    
42 |     max-width: calc(100vw - 1rem);
43 |     min-width: fit-content;
44 |     background-color: #282c34 !important;
45 | }
46 | pre code.hljs {
47 |     display: block;
48 |     overflow-x: auto;
49 |     padding: 1em;
50 | }
51 | 
52 | /*  atom-one-dark */
53 | pre code.hljs{display:block;overflow-x:auto;padding:1em}code.hljs{padding:3px 5px}.hljs{color:#abb2bf;background:#282c34}
54 | .hljs-comment,.hljs-quote{color:#5c6370;font-style:italic}.hljs-doctag,.hljs-formula,.hljs-keyword{color:#c678dd}
55 | .hljs-deletion,.hljs-name,.hljs-section,.hljs-selector-tag,.hljs-subst{color:#e06c75}.hljs-literal{color:#56b6c2}
56 | .hljs-addition,.hljs-attribute,.hljs-meta .hljs-string,.hljs-regexp,.hljs-string{color:#98c379}
57 | .hljs-attr,.hljs-number,.hljs-selector-attr,.hljs-selector-class,.hljs-selector-pseudo,.hljs-template-variable,.hljs-type,.hljs-variable{color:#d19a66}
58 | .hljs-bullet,.hljs-link,.hljs-meta,.hljs-selector-id,.hljs-symbol,.hljs-title{color:#61aeee}
59 | .hljs-built_in,.hljs-class .hljs-title,.hljs-title.class_{color:#e6c07b}
60 | .hljs-emphasis{font-style:italic}
61 | .hljs-strong{font-weight:700}
62 | .hljs-link{text-decoration:underline}


--------------------------------------------------------------------------------
/MyApp.ServiceInterface/EmailServices.cs:
--------------------------------------------------------------------------------
 1 | using System.Net.Mail;
 2 | using Microsoft.Extensions.Logging;
 3 | using ServiceStack;
 4 | using ServiceStack.Jobs;
 5 | 
 6 | namespace MyApp.ServiceInterface;
 7 | 
 8 | /// <summary>
 9 | /// Configuration for sending emails using SMTP servers in EmailServices
10 | /// E.g. for managed services like Amazon (SES): https://aws.amazon.com/ses/ or https://mailtrap.io
11 | /// </summary>
12 | public class SmtpConfig
13 | {
14 |     /// <summary>
15 |     /// Username of the SMTP Server account
16 |     /// </summary>
17 |     public string Username { get; set; }
18 |     /// <summary>
19 |     /// Password of the SMTP Server account
20 |     /// </summary>
21 |     public string Password { get; set; }
22 |     /// <summary>
23 |     /// Hostname of the SMTP Server
24 |     /// </summary>
25 |     public string Host { get; set; }
26 |     /// <summary>
27 |     /// Port of the SMTP Server
28 |     /// </summary>
29 |     public int Port { get; set; } = 587;
30 |     /// <summary>
31 |     /// Which email address to send emails from
32 |     /// </summary>
33 |     public string FromEmail { get; set; }
34 |     /// <summary>
35 |     /// The name of the Email Sender
36 |     /// </summary>
37 |     public string? FromName { get; set; }
38 |     /// <summary>
39 |     /// Prevent emails from being sent to real users during development by sending to this Dev email instead
40 |     /// </summary>
41 |     public string? DevToEmail { get; set; }
42 |     /// <summary>
43 |     /// Keep a copy of all emails sent by BCC'ing a copy to this email address
44 |     /// </summary>
45 |     public string? Bcc { get; set; }
46 | }
47 | 
48 | public class SendEmail
49 | {
50 |     public string To { get; set; }
51 |     public string? ToName { get; set; }
52 |     public string Subject { get; set; }
53 |     public string? BodyText { get; set; }
54 |     public string? BodyHtml { get; set; }
55 | }
56 | 
57 | [Worker("smtp")]
58 | public class SendEmailCommand(ILogger<SendEmailCommand> logger, IBackgroundJobs jobs, SmtpConfig config) 
59 |     : SyncCommand<SendEmail>
60 | {
61 |     private static long count = 0;
62 |     protected override void Run(SendEmail request)
63 |     {
64 |         Interlocked.Increment(ref count);
65 |         var log = Request.CreateJobLogger(jobs, logger);
66 |         log.LogInformation("Sending {Count} email to {Email} with subject {Subject}", 
67 |             count, request.To, request.Subject);
68 | 
69 |         using var client = new SmtpClient(config.Host, config.Port);
70 |         client.Credentials = new System.Net.NetworkCredential(config.Username, config.Password);
71 |         client.EnableSsl = true;
72 | 
73 |         // If DevToEmail is set, send all emails to that address instead
74 |         var emailTo = config.DevToEmail != null
75 |             ? new MailAddress(config.DevToEmail)
76 |             : new MailAddress(request.To, request.ToName);
77 | 
78 |         var emailFrom = new MailAddress(config.FromEmail, config.FromName);
79 | 
80 |         var msg = new MailMessage(emailFrom, emailTo)
81 |         {
82 |             Subject = request.Subject,
83 |             Body = request.BodyHtml ?? request.BodyText,
84 |             IsBodyHtml = request.BodyHtml != null,
85 |         };
86 | 
87 |         if (config.Bcc != null)
88 |         {
89 |             msg.Bcc.Add(new MailAddress(config.Bcc));
90 |         }
91 | 
92 |         client.Send(msg);
93 |     }
94 | }
95 | 


--------------------------------------------------------------------------------
/MyApp/MyApp.csproj:
--------------------------------------------------------------------------------
 1 | <Project Sdk="Microsoft.NET.Sdk.Web">
 2 | 
 3 |     <PropertyGroup>
 4 |         <TargetFramework>net10.0</TargetFramework>
 5 |         <Nullable>enable</Nullable>
 6 |         <ImplicitUsings>enable</ImplicitUsings>
 7 |         <UserSecretsId>aspnet-MyApp-7b2ab71a-0b50-423f-969d-e35a9402b1b5</UserSecretsId>
 8 |         <TypeScriptCompileBlocked>true</TypeScriptCompileBlocked>
 9 |         <PublishProfile>DefaultContainer</PublishProfile>
10 |     </PropertyGroup>
11 | 
12 |     <ItemGroup>
13 |         <ContainerLabel Include="service" Value="my-app" />
14 |     </ItemGroup>
15 | 
16 |     <ItemGroup>
17 |         <Using Include="MyApp" />
18 |         <Using Include="ServiceStack" />
19 |     </ItemGroup>
20 | 
21 |     <ItemGroup>
22 |         <PackageReference Include="Microsoft.AspNetCore.Diagnostics.EntityFrameworkCore" Version="10.*" />
23 |         <PackageReference Include="Microsoft.AspNetCore.Identity.EntityFrameworkCore" Version="10.*" />
24 |         <PackageReference Include="Microsoft.EntityFrameworkCore.Sqlite" Version="10.*" />
25 |         <PackageReference Include="Microsoft.EntityFrameworkCore.Tools" Version="10.*" />
26 |         <PackageReference Include="Markdig" Version="0.44.*" />
27 |     </ItemGroup>
28 | 
29 |     <ItemGroup>
30 |         <PackageReference Include="ServiceStack" Version="10.*" />
31 |         <PackageReference Include="ServiceStack.Jobs" Version="10.*" />
32 |         <PackageReference Include="ServiceStack.Server" Version="10.*" />
33 |         <PackageReference Include="ServiceStack.OrmLite.Sqlite.Data" Version="10.*" />
34 |         <PackageReference Include="ServiceStack.Extensions" Version="10.*" />
35 |         <PackageReference Include="ServiceStack.Blazor" Version="10.*" />
36 |         <PackageReference Include="ServiceStack.AI.Chat" Version="10.*" />
37 |         <PackageReference Include="ServiceStack.OpenApi.Swashbuckle" Version="10.*" />
38 |     </ItemGroup>
39 | 
40 |     <ItemGroup>
41 |         <ProjectReference Include="..\MyApp.ServiceInterface\MyApp.ServiceInterface.csproj" />
42 |         <ProjectReference Include="..\MyApp.ServiceModel\MyApp.ServiceModel.csproj" />
43 |     </ItemGroup>
44 | 
45 |     <ItemGroup>
46 |         <Content Include="_includes\**" CopyToPublishDirectory="PreserveNewest" />
47 |         <Content Include="_pages\**" CopyToPublishDirectory="PreserveNewest" />
48 |         <Content Include="_posts\*.md" CopyToPublishDirectory="PreserveNewest" />
49 |         <Content Include="_videos\**" CopyToPublishDirectory="PreserveNewest" />
50 |     </ItemGroup>
51 | 
52 |   <PropertyGroup>
53 |     <DefaultItemExcludes>$(DefaultItemExcludes);App_Data\**;node_modules\**</DefaultItemExcludes>
54 |   </PropertyGroup>
55 | 
56 |   <Target Name="CreateWwwrootFolderBuild" AfterTargets="AfterBuild">
57 |     <MakeDir Directories="$(BuildDir)wwwroot" Condition="!Exists('$(BuildDir)wwwroot')" />
58 |   </Target>
59 | 
60 |   <Target Name="CreateAppDataFolder" BeforeTargets="Publish">
61 |     <MakeDir Directories="$(PublishDir)App_Data" Condition="!Exists('$(PublishDir)App_Data')" />
62 |     <Exec Command="npm install" />
63 |     <Exec Command="npm run ui:build" />
64 |     <RemoveDir Directories="$(PublishDir)wwwroot" />
65 |     <ItemGroup>
66 |       <CopyDist Include="./wwwroot/**/*.*" />
67 |     </ItemGroup>
68 |     <Copy SourceFiles="@(CopyDist)" DestinationFiles="@(CopyDist->'$(PublishDir)wwwroot\%(RecursiveDir)%(Filename)%(Extension)')" />
69 |   </Target>
70 | 
71 | </Project>


--------------------------------------------------------------------------------
/MyApp/Program.cs:
--------------------------------------------------------------------------------
 1 | using System.Net;
 2 | using Microsoft.AspNetCore.Components.Authorization;
 3 | using Microsoft.AspNetCore.Components.Server;
 4 | using Microsoft.AspNetCore.DataProtection;
 5 | using Microsoft.AspNetCore.Identity;
 6 | using Microsoft.EntityFrameworkCore;
 7 | using ServiceStack.Blazor;
 8 | using MyApp.Components;
 9 | using MyApp.Data;
10 | using MyApp.Components.Account;
11 | using MyApp.ServiceInterface;
12 | 
13 | var builder = WebApplication.CreateBuilder(args);
14 | 
15 | var services = builder.Services;
16 | var config = builder.Configuration;
17 | 
18 | // Add services to the container.
19 | services.AddRazorComponents();
20 | 
21 | services.AddCascadingAuthenticationState();
22 | services.AddScoped<IdentityUserAccessor>();
23 | services.AddScoped<IdentityRedirectManager>();
24 | services.AddScoped<AuthenticationStateProvider, ServerAuthenticationStateProvider>();
25 | 
26 | services.AddAuthorization();
27 | services.AddAuthentication(options =>
28 |     {
29 |         options.DefaultScheme = IdentityConstants.ApplicationScheme;
30 |         options.DefaultSignInScheme = IdentityConstants.ExternalScheme;
31 |     })
32 |     .AddIdentityCookies();
33 | services.AddDataProtection()
34 |     .PersistKeysToFileSystem(new DirectoryInfo("App_Data"));
35 | 
36 | services.AddDatabaseDeveloperPageExceptionFilter();
37 | 
38 | services.AddIdentityCore<ApplicationUser>(options => options.SignIn.RequireConfirmedAccount = true)
39 |     .AddRoles<IdentityRole>()
40 |     .AddEntityFrameworkStores<ApplicationDbContext>()
41 |     .AddSignInManager()
42 |     .AddDefaultTokenProviders();
43 | 
44 | services.AddSingleton<IEmailSender<ApplicationUser>, IdentityNoOpEmailSender>();
45 | // Uncomment to send emails with SMTP, configure SMTP with "SmtpConfig" in appsettings.json
46 | // services.AddSingleton<IEmailSender<ApplicationUser>, EmailSender>();
47 | services.AddScoped<IUserClaimsPrincipalFactory<ApplicationUser>, AdditionalUserClaimsPrincipalFactory>();
48 | 
49 | var baseUrl = builder.Configuration["ApiBaseUrl"] ??
50 |     (builder.Environment.IsDevelopment() ? "https://localhost:5001" : "http://" + IPAddress.Loopback);
51 | services.AddScoped(c => new HttpClient { BaseAddress = new Uri(baseUrl) });
52 | services.AddBlazorServerIdentityApiClient(baseUrl);
53 | services.AddLocalStorage();
54 | 
55 | services.AddServiceStack(typeof(MyServices).Assembly);
56 | 
57 | var app = builder.Build();
58 | 
59 | // Configure the HTTP request pipeline.
60 | if (app.Environment.IsDevelopment())
61 | {
62 |     app.UseMigrationsEndPoint();
63 | }
64 | else
65 | {
66 |     app.UseExceptionHandler("/Error", createScopeForErrors: true);
67 |     // The default HSTS value is 30 days. You may want to change this for production scenarios, see https://aka.ms/aspnetcore-hsts.
68 |     app.UseHsts();
69 | }
70 | 
71 | app.UseHttpsRedirection();
72 | 
73 | app.UseStaticFiles();
74 | app.UseAntiforgery();
75 | 
76 | app.MapRazorComponents<App>();
77 | 
78 | // Add additional endpoints required by the Identity /Account Razor components.
79 | app.MapAdditionalIdentityEndpoints();
80 | 
81 | app.UseServiceStack(new AppHost(), options => {
82 |     options.MapEndpoints();
83 | });
84 | 
85 | BlazorConfig.Set(new()
86 | {
87 |     Services = app.Services,
88 |     JSParseObject = JS.ParseObject,
89 |     IsDevelopment = app.Environment.IsDevelopment(),
90 |     EnableLogging = app.Environment.IsDevelopment(),
91 |     EnableVerboseLogging = app.Environment.IsDevelopment(),
92 | });
93 | 
94 | app.Run();
95 | 


--------------------------------------------------------------------------------
/MyApp/Configure.AppHost.cs:
--------------------------------------------------------------------------------
 1 | using Microsoft.AspNetCore.Mvc.Rendering;
 2 | using ServiceStack.Configuration;
 3 | using ServiceStack.IO;
 4 | using ServiceStack.Text;
 5 | 
 6 | [assembly: HostingStartup(typeof(MyApp.AppHost))]
 7 | 
 8 | namespace MyApp;
 9 | 
10 | public class AppHost() : AppHostBase("MyApp"), IHostingStartup
11 | {
12 |     public void Configure(IWebHostBuilder builder) => builder
13 |         .ConfigureServices((context,services) => {
14 |             // Configure ASP.NET Core IOC Dependencies
15 |             context.Configuration.GetSection(nameof(AppConfig)).Bind(AppConfig.Instance);
16 |             services.AddSingleton(AppConfig.Instance);
17 |             
18 |             // Optional: Enable Managed File Uploads: https://docs.servicestack.net/locode/files-overview
19 |             var fileFs = new FileSystemVirtualFiles(context.HostingEnvironment.ContentRootPath);
20 |             services.AddPlugin(new FilesUploadFeature(
21 |                 // User writable, public readable
22 |                 new UploadLocation("pub", 
23 |                     fileFs,
24 |                     readAccessRole: RoleNames.AllowAnon,
25 |                     maxFileBytes: 10 * 1024 * 1024,
26 |                     resolvePath:ctx => $"pub/{DateTime.UtcNow.ToUnixTime()}/{ctx.FileName}"),
27 |                 // User writable, User readable
28 |                 new UploadLocation("secure", 
29 |                     fileFs,
30 |                     maxFileBytes: 10 * 1024 * 1024,
31 |                     resolvePath:ctx => $"/users/{ctx.UserAuthId}/{ctx.FileName}")
32 |             ));
33 |         });
34 | 
35 |     public override void Configure()
36 |     {
37 |         AppConfig.Instance.GitPagesBaseUrl ??= ResolveGitBlobBaseUrl(ContentRootDirectory);
38 |     }
39 |     
40 |     private string? ResolveGitBlobBaseUrl(IVirtualDirectory contentDir)
41 |     {
42 |         var srcDir = new DirectoryInfo(contentDir.RealPath);
43 |         var gitConfig = new FileInfo(Path.Combine(srcDir.Parent!.FullName, ".git", "config"));
44 |         if (gitConfig.Exists)
45 |         {
46 |             var txt = gitConfig.ReadAllText();
47 |             var pos = txt.IndexOf("url = ", StringComparison.Ordinal);
48 |             if (pos >= 0)
49 |             {
50 |                 var url = txt[(pos + "url = ".Length)..].LeftPart(".git").LeftPart('\n').Trim();
51 |                 var gitBaseUrl = url.CombineWith($"blob/main/{srcDir.Name}");
52 |                 return gitBaseUrl;
53 |             }
54 |         }
55 |         return null;
56 |     }
57 | }
58 | 
59 | public class AppConfig
60 | {
61 |     public static AppConfig Instance { get; } = new();
62 |     public string LocalBaseUrl { get; set; }
63 |     public string PublicBaseUrl { get; set; }
64 |     public string? GitPagesBaseUrl { get; set; }
65 | }
66 | 
67 | public static class HtmlHelpers
68 | {
69 |     public static string ToAbsoluteContentUrl(string? relativePath) => HostContext.DebugMode 
70 |         ? AppConfig.Instance.LocalBaseUrl.CombineWith(relativePath)
71 |         : AppConfig.Instance.PublicBaseUrl.CombineWith(relativePath);
72 |     public static string ToAbsoluteApiUrl(string? relativePath) => HostContext.DebugMode 
73 |         ? AppConfig.Instance.LocalBaseUrl.CombineWith(relativePath)
74 |         : AppConfig.Instance.PublicBaseUrl.CombineWith(relativePath);
75 | 
76 |     public static string ContentUrl(this IHtmlHelper html, string? relativePath) => ToAbsoluteContentUrl(relativePath); 
77 |     public static string ApiUrl(this IHtmlHelper html, string? relativePath) => ToAbsoluteApiUrl(relativePath);
78 | }
79 | 


--------------------------------------------------------------------------------
/MyApp/MarkdownTagHelper.cs:
--------------------------------------------------------------------------------
 1 | // run node postinstall.js to update to latest version
 2 | using Markdig;
 3 | using Microsoft.AspNetCore.Mvc.ViewFeatures;
 4 | using Microsoft.AspNetCore.Razor.TagHelpers;
 5 | 
 6 | namespace MyApp;
 7 | 
 8 | [HtmlTargetElement("markdown", TagStructure = TagStructure.NormalOrSelfClosing)]
 9 | [HtmlTargetElement(Attributes = "markdown")]
10 | public class MarkdownTagHelper : TagHelper
11 | {
12 |     public ModelExpression? Content { get; set; }
13 |     
14 |     public override async Task ProcessAsync(TagHelperContext context, TagHelperOutput output)
15 |     {
16 |         if (output.TagName == "markdown")
17 |         {
18 |             output.TagName = null;
19 |         }
20 |         output.Attributes.RemoveAll("markdown");
21 | 
22 |         var content = await GetContent(output);
23 |         
24 |         var pipeline = new MarkdownPipelineBuilder()
25 |             .UseAdvancedExtensions()
26 |             .Build();
27 | 
28 |         var writer = new StringWriter();
29 |         var cls = output.Attributes["class"]?.Value ?? "prose";
30 |         await writer.WriteAsync($"<div class=\"{cls}\">");
31 |         var renderer = new Markdig.Renderers.HtmlRenderer(writer);
32 |         pipeline.Setup(renderer);
33 | 
34 |         var include = output.Attributes["include"]?.Value?.ToString() ?? "";
35 |         if (!string.IsNullOrEmpty(include))
36 |         {
37 |             MarkdownFileBase? doc = null;
38 |             if (include.EndsWith(".md"))
39 |             {
40 |                 var includes = HostContext.TryResolve<MarkdownIncludes>();
41 |                 var pages = HostContext.TryResolve<MarkdownPages>();
42 |                 // default relative path to _includes/
43 |                 include = include[0] != '/'
44 |                     ? "_includes/" + include
45 |                     : include.TrimStart('/');
46 |                 
47 |                 doc = includes.Pages.FirstOrDefault(x => x.Path == include);
48 |                 if (doc == null && pages != null)
49 |                 {
50 |                     var prefix = include.LeftPart('/');
51 |                     var slug = include.LeftPart('.');
52 |                     var allIncludes = pages.GetVisiblePages(prefix, allDirectories: true);
53 |                     doc = allIncludes.FirstOrDefault(x => x.Slug == slug);
54 |                 }
55 | 
56 |                 if (doc?.Preview != null)
57 |                 {
58 |                     renderer.WriteLine(doc.Preview!);
59 |                 }
60 |                 else
61 |                 {
62 |                     var log = HostContext.Resolve<ILogger<IncludeContainerInlineRenderer>>();
63 |                     log.LogError("Could not find: {Include}", include);
64 |                     renderer.WriteLine($"Could not find: {include}");
65 |                 }
66 |             }
67 |             else
68 |             {
69 |                 renderer.WriteLine($"Could not find: {include}");
70 |             }
71 |         }
72 |         else
73 |         {
74 |             var document = Markdown.Parse(content ?? "", pipeline);
75 |             renderer.Render(document);
76 |         }
77 | 
78 |         await writer.WriteAsync("</div>");
79 |         await writer.FlushAsync();
80 |         var html = writer.ToString();
81 | 
82 |         output.Content.SetHtmlContent(html ?? "");
83 |     }
84 | 
85 |     private async Task<string?> GetContent(TagHelperOutput output)
86 |     {
87 |         if (Content == null)
88 |             return (await output.GetChildContentAsync()).GetContent();
89 | 
90 |         return Content.Model?.ToString();
91 |     }
92 | }


--------------------------------------------------------------------------------
/MyApp/Components/Account/Pages/Manage/Index.razor:
--------------------------------------------------------------------------------
 1 | @page "/Account/Manage"
 2 | 
 3 | @using System.ComponentModel.DataAnnotations
 4 | @using Microsoft.AspNetCore.Identity
 5 | @using MyApp.Data
 6 | 
 7 | @inject UserManager<ApplicationUser> UserManager
 8 | @inject SignInManager<ApplicationUser> SignInManager
 9 | @inject IdentityUserAccessor UserAccessor
10 | @inject IdentityRedirectManager RedirectManager
11 | 
12 | <PageTitle>Profile</PageTitle>
13 | 
14 | <Heading3>Profile</Heading3>
15 | <StatusMessage />
16 | 
17 | <div class="max-w-xl">
18 |     <div class="shadow overflow-hidden sm:rounded-md">
19 |         <EditForm id="profile-form" Model="Input" FormName="profile" OnValidSubmit="OnValidSubmitAsync" method="post"
20 |                   class="px-4 bg-white dark:bg-black sm:p-6">
21 |             <DataAnnotationsValidator />
22 |             <ValidationSummary class="mb-3 text-danger text-center font-semibold" />
23 | 
24 |             <div class="flex flex-col gap-y-4">
25 |                 <div>
26 |                     <label for="username" class="@TextInput.LabelClasses">Username</label>
27 |                     <div class="mt-1 relative">
28 |                         <input id="username" type="text" value="@username" class="@TextInput.InputClasses" placeholder="Please choose your username." disabled />
29 |                     </div>
30 |                 </div>
31 |                 <div>
32 |                     <label for="phone-number" class="@TextInput.LabelClasses">Phone number</label>
33 |                     <div class="mt-1 relative">
34 |                         <InputText id="phone-number" type="text" @bind-Value="Input.PhoneNumber" class="@TextInput.InputClasses" placeholder="Please enter your phone number." />
35 |                     </div>
36 |                     <ValidationMessage For="() => Input.PhoneNumber" class="mt-2 text-danger text-sm" />
37 |                 </div>
38 |                 <div>
39 |                     <PrimaryButton id="update-profile-button" type="submit">Save</PrimaryButton>
40 |                 </div>
41 |             </div>
42 |         </EditForm>
43 |     </div>
44 | </div>
45 | 
46 | @code {
47 |     private ApplicationUser user = default!;
48 |     private string? username;
49 |     private string? phoneNumber;
50 | 
51 |     [CascadingParameter]
52 |     private HttpContext HttpContext { get; set; } = default!;
53 | 
54 |     [SupplyParameterFromForm]
55 |     private InputModel Input { get; set; } = new();
56 | 
57 |     protected override async Task OnInitializedAsync()
58 |     {
59 |         user = await UserAccessor.GetRequiredUserAsync(HttpContext);
60 |         username = await UserManager.GetUserNameAsync(user);
61 |         phoneNumber = await UserManager.GetPhoneNumberAsync(user);
62 | 
63 |         Input.PhoneNumber ??= phoneNumber;
64 |     }
65 | 
66 |     private async Task OnValidSubmitAsync()
67 |     {
68 |         if (Input.PhoneNumber != phoneNumber)
69 |         {
70 |             var setPhoneResult = await UserManager.SetPhoneNumberAsync(user, Input.PhoneNumber);
71 |             if (!setPhoneResult.Succeeded)
72 |             {
73 |                 RedirectManager.RedirectToCurrentPageWithStatus("Error: Failed to set phone number.", HttpContext);
74 |             }
75 |         }
76 | 
77 |         await SignInManager.RefreshSignInAsync(user);
78 |         RedirectManager.RedirectToCurrentPageWithStatus("Your profile has been updated", HttpContext);
79 |     }
80 | 
81 |     private sealed class InputModel
82 |     {
83 |         [Phone]
84 |         [Display(Name = "Phone number")]
85 |         public string? PhoneNumber { get; set; }
86 |     }
87 | }
88 | 


--------------------------------------------------------------------------------
/MyApp/Components/Account/Shared/StatusMessage.razor:
--------------------------------------------------------------------------------
 1 | @if (!string.IsNullOrEmpty(DisplayMessage))
 2 | {
 3 |     <div class="@CssUtils.ClassNames("alert", @class)">
 4 |         @if (DisplayMessage.StartsWith("Error"))
 5 |         {
 6 |             <div class="rounded-md bg-red-50 dark:bg-red-900 p-4">
 7 |                 <div class="flex">
 8 |                     <div class="flex-shrink-0">
 9 |                         <svg class="h-5 w-5 text-red-400" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true">
10 |                             <path fill-rule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zM8.28 7.22a.75.75 0 00-1.06 1.06L8.94 10l-1.72 1.72a.75.75 0 101.06 1.06L10 11.06l1.72 1.72a.75.75 0 101.06-1.06L11.06 10l1.72-1.72a.75.75 0 00-1.06-1.06L10 8.94 8.28 7.22z" clip-rule="evenodd" />
11 |                         </svg>
12 |                     </div>
13 |                     <div class="ml-3">
14 |                         <h3 class="text-sm font-medium text-red-800 dark:text-red-100">@DisplayMessage</h3>
15 |                     </div>
16 |                 </div>
17 |             </div>
18 |         }
19 |         else
20 |         {
21 |             <div class="rounded-md bg-green-50 dark:bg-green-900 p-4">
22 |                 <div class="flex">
23 |                     <div class="flex-shrink-0">
24 |                         <svg class="h-5 w-5 text-green-400" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true">
25 |                             <path fill-rule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.857-9.809a.75.75 0 00-1.214-.882l-3.483 4.79-1.88-1.88a.75.75 0 10-1.06 1.061l2.5 2.5a.75.75 0 001.137-.089l4-5.5z" clip-rule="evenodd" />
26 |                         </svg>
27 |                     </div>
28 |                     <div class="ml-3">
29 |                         <p class="text-sm font-medium text-green-800 dark:text-green-100">@DisplayMessage</p>
30 |                     </div>
31 |                     <div class="ml-auto pl-3">
32 |                         <div class="-mx-1.5 -my-1.5">
33 |                             <button onclick="this.closest('.alert').classList.add('hidden')" type="button" class="inline-flex rounded-md bg-green-50 dark:bg-green-900 p-1.5 text-green-500 hover:bg-green-100 focus:outline-none focus:ring-2 focus:ring-green-600 focus:ring-offset-2 focus:ring-offset-green-50">
34 |                                 <span class="sr-only">Dismiss</span>
35 |                                 <svg class="h-5 w-5" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true">
36 |                                     <path d="M6.28 5.22a.75.75 0 00-1.06 1.06L8.94 10l-3.72 3.72a.75.75 0 101.06 1.06L10 11.06l3.72 3.72a.75.75 0 101.06-1.06L11.06 10l3.72-3.72a.75.75 0 00-1.06-1.06L10 8.94 6.28 5.22z" />
37 |                                 </svg>
38 |                             </button>
39 |                         </div>
40 |                     </div>
41 |                 </div>
42 |             </div>
43 |         }
44 |     </div>
45 | }
46 | 
47 | @code {
48 |     private string? messageFromCookie;
49 | 
50 |     [Parameter]
51 |     public string? @class { get; set; }
52 | 
53 |     [Parameter]
54 |     public string? Message { get; set; }
55 | 
56 |     [CascadingParameter]
57 |     private HttpContext HttpContext { get; set; } = default!;
58 | 
59 |     private string? DisplayMessage => Message ?? messageFromCookie;
60 | 
61 |     protected override void OnInitialized()
62 |     {
63 |         messageFromCookie = HttpContext.Request.Cookies[IdentityRedirectManager.StatusCookieName];
64 | 
65 |         if (messageFromCookie is not null)
66 |         {
67 |             HttpContext.Response.Cookies.Delete(IdentityRedirectManager.StatusCookieName);
68 |         }
69 |     }
70 | }
71 | 


--------------------------------------------------------------------------------
/MyApp/Components/Account/Pages/Manage/DeletePersonalData.razor:
--------------------------------------------------------------------------------
 1 | @page "/Account/Manage/DeletePersonalData"
 2 | 
 3 | @using System.ComponentModel.DataAnnotations
 4 | @using Microsoft.AspNetCore.Identity
 5 | @using MyApp.Data
 6 | 
 7 | @inject UserManager<ApplicationUser> UserManager
 8 | @inject SignInManager<ApplicationUser> SignInManager
 9 | @inject IdentityUserAccessor UserAccessor
10 | @inject IdentityRedirectManager RedirectManager
11 | @inject ILogger<DeletePersonalData> Logger
12 | 
13 | <PageTitle>Delete Personal Data</PageTitle>
14 | 
15 | <Heading3>Delete Personal Data</Heading3>
16 | 
17 | <div class="max-w-xl">
18 |     <Alert Type="AlertType.Error" class="mb-3">
19 |         Deleting this data permanently removes your account, and cannot be recovered.
20 |     </Alert>
21 | 
22 |     <div class="mt-3 shadow overflow-hidden sm:rounded-md">
23 |         <div class="px-4 bg-white dark:bg-black sm:p-6">
24 |             <StatusMessage Message="@message" />
25 | 
26 |             <EditForm class="mt-3" id="delete-user" Model="Input" FormName="delete-user" OnValidSubmit="OnValidSubmitAsync" method="post">
27 |                 <DataAnnotationsValidator />
28 |                 <ValidationSummary class="mt-2 text-danger text-sm" />
29 | 
30 |                 <div class="flex flex-col gap-4">
31 |                     @if (requirePassword)
32 |                     {
33 |                         <div>
34 |                             <label for="password" class="@TextInput.LabelClasses">Password</label>
35 |                             <div class="mt-1 relative">
36 |                                 <InputText id="password" type="password" @bind-Value="Input.Password" class="@TextInput.InputClasses" autocomplete="current-password" aria-required="true" placeholder="Please enter your password." />
37 |                             </div>
38 |                             <ValidationMessage For="() => Input.Password" class="mt-2 text-danger text-sm" />
39 |                         </div>
40 |                     }
41 |                     <PrimaryButton Style="ButtonStyle.Red" type="submit">Delete data and close my account</PrimaryButton>
42 |                 </div>
43 |             </EditForm>
44 |         </div>
45 |     </div>
46 | </div>
47 | 
48 | @code {
49 |     private string? message;
50 |     private ApplicationUser user = default!;
51 |     private bool requirePassword;
52 | 
53 |     [CascadingParameter]
54 |     private HttpContext HttpContext { get; set; } = default!;
55 | 
56 |     [SupplyParameterFromForm]
57 |     private InputModel Input { get; set; } = new();
58 | 
59 |     protected override async Task OnInitializedAsync()
60 |     {
61 |         Input ??= new();
62 |         user = await UserAccessor.GetRequiredUserAsync(HttpContext);
63 |         requirePassword = await UserManager.HasPasswordAsync(user);
64 |     }
65 | 
66 |     private async Task OnValidSubmitAsync()
67 |     {
68 |         if (requirePassword && !await UserManager.CheckPasswordAsync(user, Input.Password))
69 |         {
70 |             message = "Error: Incorrect password.";
71 |             return;
72 |         }
73 | 
74 |         var result = await UserManager.DeleteAsync(user);
75 |         if (!result.Succeeded)
76 |         {
77 |             throw new InvalidOperationException("Unexpected error occurred deleting user.");
78 |         }
79 | 
80 |         await SignInManager.SignOutAsync();
81 | 
82 |         var userId = await UserManager.GetUserIdAsync(user);
83 |         Logger.LogInformation("User with ID '{UserId}' deleted themselves.", userId);
84 | 
85 |         RedirectManager.RedirectToCurrentPage();
86 |     }
87 | 
88 |     private sealed class InputModel
89 |     {
90 |         [DataType(DataType.Password)]
91 |         public string Password { get; set; } = "";
92 |     }
93 | }
94 | 


--------------------------------------------------------------------------------
/MyApp/Components/Layout/AdminLayout.razor:
--------------------------------------------------------------------------------
 1 | @inherits LayoutComponentBase
 2 | @inject IServiceGatewayFactory GatewayFactory
 3 | 
 4 | <script>window.Server = @metadataHtml</script>
 5 | <script type="module">
 6 | import { useAuth, useMetadata } from "@@servicestack/vue"
 7 | const { signIn } = useAuth()
 8 | signIn(@authJson)
 9 | 
10 | const { loadMetadata } = useMetadata()
11 | loadMetadata({
12 |     olderThan: null
13 | })
14 | </script>
15 | 
16 | <div class="min-h-screen">
17 |     <Header />
18 | 
19 |     <main role="main">
20 |         @Body
21 |     </main>
22 | </div>
23 | 
24 | <script type="module">
25 | import { remount } from "/mjs/app.mjs"
26 | remount()
27 | </script>
28 | 
29 | <div id="blazor-error-ui" class="hidden fixed bottom-0 w-full z-10">
30 |     <div class="flex rounded-md bg-yellow-50 p-4 m-4">
31 |         <div class="flex-shrink-0">
32 |             <!-- Heroicon name: solid/exclamation -->
33 |             <svg class="h-5 w-5 text-yellow-400" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true">
34 |                 <path fill-rule="evenodd" d="M8.257 3.099c.765-1.36 2.722-1.36 3.486 0l5.58 9.92c.75 1.334-.213 2.98-1.742 2.98H4.42c-1.53 0-2.493-1.646-1.743-2.98l5.58-9.92zM11 13a1 1 0 11-2 0 1 1 0 012 0zm-1-8a1 1 0 00-1 1v3a1 1 0 002 0V6a1 1 0 00-1-1z" clip-rule="evenodd" />
35 |             </svg>
36 |         </div>
37 |         <div class="ml-3">
38 |             <environment include="Staging,Production">
39 |                 <h3 class="text-sm font-medium text-yellow-800">An error has occurred. This application may no longer respond until reloaded.</h3>
40 |             </environment>
41 |             <environment include="Development">
42 |                 <h3 class="text-sm font-medium text-yellow-800">An unhandled exception has occurred. See browser dev tools for details.</h3>
43 |             </environment>
44 |             <div class="mt-4">
45 |                 <div class="-mx-2 -my-1.5 flex">
46 |                     <button type="button" class="reload bg-yellow-50 px-2 py-1.5 rounded-md text-sm font-medium text-yellow-800 hover:bg-yellow-100 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-offset-yellow-50 focus:ring-yellow-600">Reload</button>
47 |                 </div>
48 |             </div>
49 |         </div>
50 |         <div class="ml-auto pl-3">
51 |             <div class="-mx-1.5 -my-1.5">
52 |                 <button type="button" class="dismiss inline-flex bg-yellow-50 rounded-md p-1.5 text-yellow-500 hover:bg-yellow-100 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-offset-yellow-50 focus:ring-yellow-600">
53 |                     <span class="sr-only">Dismiss</span>
54 |                     <!-- Heroicon name: solid/x -->
55 |                     <svg class="h-5 w-5" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true">
56 |                         <path fill-rule="evenodd" d="M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z" clip-rule="evenodd" />
57 |                     </svg>
58 |                 </button>
59 |             </div>
60 |         </div>
61 |     </div>
62 | </div>
63 | 
64 | @code {
65 |     MarkupString? metadataHtml = null;
66 |     MarkupString? authJson = null;
67 |     [CascadingParameter]
68 |     private HttpContext HttpContext { get; set; } = default!;
69 | 
70 |     protected override async Task OnInitializedAsync()
71 |     {
72 |         await base.OnInitializedAsync();
73 |         var gateway = GatewayFactory.GetServiceGateway(HttpContext.ToRequest());
74 |         metadataHtml = await gateway.ApiAsJsonAsync(new MetadataApp());
75 |         authJson = await gateway.ApiAsJsonAsync(new Authenticate());
76 |     }
77 | }
78 | 


--------------------------------------------------------------------------------
/MyApp/Components/Shared/VideoGroup.razor:
--------------------------------------------------------------------------------
 1 | @inject MarkdownVideos Videos
 2 | 
 3 | <section>
 4 |     <div class="@Background py-24 sm:py-32">
 5 |         <div class="mx-auto max-w-7xl px-6 lg:px-8">
 6 |             <div class="mx-auto max-w-5xl">
 7 |                 <h2 class="text-3xl font-bold tracking-tight text-gray-900 dark:text-gray-50 sm:text-4xl">@Title</h2>
 8 |                 <p class="mt-2 text-lg leading-8 text-gray-600 dark:text-gray-400">
 9 |                     @Summary
10 |                     @if (LearnMore != null)
11 |                     {
12 |                         <a href="@LearnMore" class="ml-2 text-sm font-semibold leading-6">Learn more <span aria-hidden="true">→</span></a>                
13 |                     }
14 |                 </p>
15 |                 <div class="mt-16 space-y-20 lg:mt-20 lg:space-y-20">
16 |                     @foreach (var video in videos)
17 |                     {
18 |                         var videoId = video.Url.LastRightPart('/');
19 |                         <article class="relative isolate flex flex-col gap-8 lg:flex-row">
20 |                             <div class="relative lg:w-1/2 lg:shrink-0">
21 |                                 <lite-youtube width="560" height="315" videoid="@videoId" class="@Border"
22 |                                               style="margin-bottom:3px;background-image: url('https://img.youtube.com/vi/@videoId/maxresdefault.jpg')">
23 |                                 </lite-youtube>
24 |                             </div>
25 |                             <div>
26 |                                 <div class="flex items-center gap-x-4 text-xs">
27 |                                     <time datetime="2020-03-16" class="text-gray-500">@($"{video.Date!.Value:MMMM d, yyyy}")</time>
28 |                                     @foreach (var tag in video.Tags.Safe())
29 |                                     {
30 |                                         <span class="relative z-10 rounded-full bg-gray-50 dark:bg-gray-900 py-1.5 px-3 font-medium text-gray-600 dark:text-gray-300">@tag</span>
31 |                                     }
32 |                                 </div>
33 |                                 <div class="group relative max-w-xl">
34 |                                     <h3 class="mt-3 text-lg font-semibold leading-6 text-gray-900 dark:text-gray-50 group-hover:text-gray-600 dark:group-hover:text-gray-400">
35 |                                         <a href="@video.Url">
36 |                                             @video.Title
37 |                                         </a>
38 |                                     </h3>
39 |                                     <div class="mt-5 text-sm leading-6 text-gray-600 dark:text-gray-400">
40 |                                         <div class="prose">
41 |                                             @BlazorHtml.Raw(video.Preview)
42 |                                         </div>
43 |                                     </div>
44 |                                 </div>
45 |                             </div>
46 |                         </article>
47 |                     }
48 |                 </div>
49 |             </div>
50 |         </div>
51 |     </div>
52 | </section>
53 | 
54 | @code {
55 |     [Parameter] public required string Group { get; set; }
56 |     [Parameter] public string? Title { get; set; }
57 |     [Parameter] public string? Background { get; set; }
58 |     [Parameter] public string? Summary { get; set; }
59 |     [Parameter] public string? Border { get; set; }
60 |     [Parameter] public string? LearnMore { get; set; }
61 | 
62 |     List<MarkdownFileInfo> videos = new();
63 | 
64 |     void load()
65 |     {
66 |         videos = Videos.GetVideos(Group);
67 |     }
68 | 
69 |     protected override void OnInitialized() => load();
70 | 
71 |     protected override void OnParametersSet() => load();
72 | }
73 | 


--------------------------------------------------------------------------------
/MyApp/Components/Account/Pages/LoginWithRecoveryCode.razor:
--------------------------------------------------------------------------------
 1 | @page "/Account/LoginWithRecoveryCode"
 2 | 
 3 | @using System.ComponentModel.DataAnnotations
 4 | @using Microsoft.AspNetCore.Identity
 5 | @using MyApp.Data
 6 | 
 7 | @inject SignInManager<ApplicationUser> SignInManager
 8 | @inject UserManager<ApplicationUser> UserManager
 9 | @inject IdentityRedirectManager RedirectManager
10 | @inject ILogger<LoginWithRecoveryCode> Logger
11 | 
12 | <PageTitle>Recovery code verification</PageTitle>
13 | 
14 | <div class="mt-8 mx-auto max-w-lg">
15 |     <Heading1>Recovery code verification</Heading1>
16 | 
17 |     <StatusMessage Message="@message" />
18 |     <p class="my-4">
19 |         You have requested to log in with a recovery code. This login will not be remembered until you provide
20 |         an authenticator app code at log in or disable 2FA and log in again.
21 |     </p>
22 |     <div class="mt-3 shadow overflow-hidden sm:rounded-md">
23 |         <div class="px-4 bg-white dark:bg-black sm:p-6">
24 |             <EditForm Model="Input" FormName="login-with-recovery-code" OnValidSubmit="OnValidSubmitAsync" method="post">
25 |                 <DataAnnotationsValidator />
26 |                 <ValidationSummary class="mb-3 text-danger text-center font-semibold" />
27 |                 <div class="flex flex-col gap-y-4">
28 |                     <div>
29 |                         <label for="recovery-code" class="@TextInput.LabelClasses">Recovery Code</label>
30 |                         <div class="mt-1 relative">
31 |                             <InputText id="recovery-code" type="text" @bind-Value="Input.RecoveryCode" class="@TextInput.InputClasses" autocomplete="off" placeholder="RecoveryCode" />
32 |                         </div>
33 |                         <ValidationMessage For="() => Input.RecoveryCode" class="mt-2 text-danger text-sm" />
34 |                     </div>
35 |                     <div>
36 |                         <PrimaryButton type="submit">Log in</PrimaryButton>
37 |                     </div>
38 |                 </div>
39 |             </EditForm>
40 |         </div>
41 |     </div>
42 | </div>
43 | 
44 | @code {
45 |     private string? message;
46 |     private ApplicationUser user = default!;
47 | 
48 |     [SupplyParameterFromForm]
49 |     private InputModel Input { get; set; } = new();
50 | 
51 |     [SupplyParameterFromQuery]
52 |     private string? ReturnUrl { get; set; }
53 | 
54 |     protected override async Task OnInitializedAsync()
55 |     {
56 |         // Ensure the user has gone through the username & password screen first
57 |         user = await SignInManager.GetTwoFactorAuthenticationUserAsync() ??
58 |             throw new InvalidOperationException("Unable to load two-factor authentication user.");
59 |     }
60 | 
61 |     private async Task OnValidSubmitAsync()
62 |     {
63 |         var recoveryCode = Input.RecoveryCode.Replace(" ", string.Empty);
64 | 
65 |         var result = await SignInManager.TwoFactorRecoveryCodeSignInAsync(recoveryCode);
66 | 
67 |         var userId = await UserManager.GetUserIdAsync(user);
68 | 
69 |         if (result.Succeeded)
70 |         {
71 |             Logger.LogInformation("User with ID '{UserId}' logged in with a recovery code.", userId);
72 |             RedirectManager.RedirectTo(ReturnUrl);
73 |         }
74 |         else if (result.IsLockedOut)
75 |         {
76 |             Logger.LogWarning("User account locked out.");
77 |             RedirectManager.RedirectTo("Account/Lockout");
78 |         }
79 |         else
80 |         {
81 |             Logger.LogWarning("Invalid recovery code entered for user with ID '{UserId}' ", userId);
82 |             message = "Error: Invalid recovery code entered.";
83 |         }
84 |     }
85 | 
86 |     private sealed class InputModel
87 |     {
88 |         [Required]
89 |         [DataType(DataType.Text)]
90 |         [Display(Name = "Recovery Code")]
91 |         public string RecoveryCode { get; set; } = "";
92 |     }
93 | }
94 | 


--------------------------------------------------------------------------------
/MyApp/wwwroot/img/profiles/user2.svg:
--------------------------------------------------------------------------------
 1 | <?xml version="1.0" encoding="iso-8859-1"?>
 2 | <!-- Generator: Adobe Illustrator 18.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
 3 | <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
 4 | <svg version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
 5 | 	 viewBox="0 0 144.773 144.773" style="enable-background:new 0 0 144.773 144.773;" xml:space="preserve">
 6 | <g>
 7 | 	<circle style="fill:#12B5BA;" cx="72.387" cy="72.386" r="72.386"/>
 8 | 	<g>
 9 | 		<defs>
10 | 			<circle id="SVGID_1_" cx="72.387" cy="72.386" r="72.386"/>
11 | 		</defs>
12 | 		<clipPath id="SVGID_2_">
13 | 			<use xlink:href="#SVGID_1_"  style="overflow:visible;"/>
14 | 		</clipPath>
15 | 		<g style="clip-path:url(#SVGID_2_);">
16 | 			<path style="fill:#F1C9A5;" d="M106.971,116.94c-4.666-8.833-34.666-14.376-34.666-14.376s-30,5.543-34.666,14.376
17 | 				c-3.449,12.258-6.334,27.833-6.334,27.833h41h41C113.305,144.773,111.357,128.073,106.971,116.94z"/>
18 | 			<path style="fill:#E4B692;" d="M72.305,102.564c0,0,30,5.543,34.666,14.376c4.386,11.133,6.334,27.833,6.334,27.833h-41V102.564z
19 | 				"/>
20 | 			<rect x="64.138" y="84.606" style="fill:#F1C9A5;" width="16.334" height="27.336"/>
21 | 			<rect x="72.305" y="84.606" style="fill:#E4B692;" width="8.167" height="27.336"/>
22 | 			<path style="opacity:0.1;fill:#DDAC8C;" d="M64.138,97.273c1.469,4.217,7.397,6.634,11.751,6.634
23 | 				c1.575,0,3.107-0.264,4.583-0.747V84.606H64.138V97.273z"/>
24 | 			<path style="fill:#F1C9A5;" d="M93.305,67.357c0-17.074-9.402-26.783-21-26.783c-11.598,0-21,9.709-21,26.783
25 | 				s9.402,30.917,21,30.917C83.903,98.274,93.305,84.432,93.305,67.357z"/>
26 | 			<path style="fill:#E4B692;" d="M90.109,79.195c-3.807-0.424-6.377-4.783-5.732-9.732c0.637-4.953,4.242-8.63,8.051-8.209
27 | 				c3.805,0.422,6.371,4.779,5.729,9.732C97.517,75.939,93.916,79.613,90.109,79.195z"/>
28 | 			<path style="fill:#F1C9A5;" d="M46.603,70.986c-0.643-4.953,1.924-9.311,5.726-9.732c3.811-0.421,7.416,3.256,8.055,8.209
29 | 				c0.643,4.949-1.93,9.309-5.734,9.732C50.843,79.613,47.242,75.939,46.603,70.986z"/>
30 | 			<path style="fill:#E4B692;" d="M93.305,67.357c0-17.074-9.402-26.783-21-26.783v57.7C83.903,98.274,93.305,84.432,93.305,67.357z
31 | 				"/>
32 | 			<path style="fill:#0F303F;" d="M62.371,90.815c0,0-9.057-7.381-7.044-17.107c2.012-9.727,7.044-11.403,7.044-15.766
33 | 				c8.385,10.064,15.767,17.105,29.183,13.417c4.025,2.349-1.006,14.427-7.045,20.799c17.108-9.393,36.898-43.942-4.361-57.361
34 | 				C38.888,21.379,27.15,88.803,62.371,90.815z"/>
35 | 			<path style="fill:#F3641E;" d="M72.304,51.159c10.84,0,19.845,7.834,21.678,18.148c0.224-1.26,0.347-2.554,0.347-3.877
36 | 				c0-12.163-9.86-22.024-22.025-22.024c-12.163,0-22.023,9.861-22.023,22.024c0,1.323,0.123,2.617,0.348,3.877
37 | 				C52.46,58.993,61.464,51.159,72.304,51.159z"/>
38 | 			<path style="fill:#FA582A;" d="M56.287,106.577c2.938,1.574,9.807,4.855,16.017,4.855c8.168,0,18.845-4,18.845-4l-1.469-0.423
39 | 				c-3.341-1.089-6.661-1.994-9.497-2.698c-8.118,4.865-16.036,0.076-16.044,0.071C61.756,104.979,59.05,105.715,56.287,106.577z"/>
40 | 			<path style="fill:#1594A3;" d="M106.971,116.94c-1.578-2.987-6.056-5.596-11.287-7.743c-2.888,10.196-12.258,17.67-23.379,17.67
41 | 				s-20.491-7.474-23.379-17.67c-5.231,2.148-9.709,4.756-11.287,7.743c-3.449,12.258-6.334,27.833-6.334,27.833h41h41
42 | 				C113.305,144.773,111.357,128.073,106.971,116.94z"/>
43 | 			<path style="fill:#FA582A;" d="M119.941,101.12c-4.5-1.604-11.667,1.896-16.375,1.444c-5.145-0.494-7.93,3.002-11.094,2.368
44 | 				c-6.083-1.219-6.643,0.985-6.643,0.985s-1.471-2.985,4.613-2.011c6.084,0.975,10.734-1.933,12.124-3.808
45 | 				c2.101-2.834,9.125-2.166,9.125-2.166l-3.666-4.251c-2.583-0.5-6.417-0.167-8.5,3.417c-2.083,3.584-4,4-9.845,3.333
46 | 				c-5.845-0.667-9.497,3.879-9.497,3.879l11.05,3.216c0,0,2.28,0.622,4.614,0.562c2.334-0.061,4.774-2.464,9.656-2.094
47 | 				c5.229,0.396,9.979-2.146,16.132,0.154L119.941,101.12z"/>
48 | 		</g>
49 | 	</g>
50 | </g>
51 | </svg>
52 | 


--------------------------------------------------------------------------------