From 3d7ae02b392d53d468e9e3df90ab7f07da311320 Mon Sep 17 00:00:00 2001
From: Peace <syneffort@gmail.com>
Date: Mon, 5 Aug 2024 16:14:35 +0900
Subject: [PATCH] ~register page

---
 .../Components/Layout/NavMenu.razor           |  8 +++-
 .../Components/Pages/Home.razor               |  9 +++-
 .../Components/Pages/Login.razor              |  4 +-
 .../Components/Pages/Register.razor           | 46 +++++++++++++++++++
 .../Components/Pages/Weather.razor            | 26 ++---------
 .../Controllers/AccountController.cs          | 17 +++++++
 .../FluentBlazorApp/DTOs/LoginDTO.cs          |  5 +-
 .../FluentBlazorApp/DTOs/RegisterDTO.cs       |  3 --
 .../DTOs/WeatherForecastDTO.cs                | 10 ++++
 .../FluentBlazorApp/FluentBlazorApp.csproj    |  8 +++-
 ... 20240805064123_InitialCreate.Designer.cs} |  8 +---
 ...rst.cs => 20240805064123_InitialCreate.cs} |  4 +-
 .../Migrations/AppDbContextModelSnapshot.cs   |  4 --
 .../FluentBlazorApp/Models/ApplicationUser.cs |  2 -
 .../FluentBlazorApp/Repos/Account.cs          |  1 -
 .../Services/AccountService.cs                | 10 +++-
 .../Services/IAccountService.cs               |  1 +
 17 files changed, 114 insertions(+), 52 deletions(-)
 create mode 100644 FluentBlazorApp/FluentBlazorApp/Components/Pages/Register.razor
 create mode 100644 FluentBlazorApp/FluentBlazorApp/DTOs/WeatherForecastDTO.cs
 rename FluentBlazorApp/FluentBlazorApp/Migrations/{20240802051133_First.Designer.cs => 20240805064123_InitialCreate.Designer.cs} (88%)
 rename FluentBlazorApp/FluentBlazorApp/Migrations/{20240802051133_First.cs => 20240805064123_InitialCreate.cs} (88%)

diff --git a/FluentBlazorApp/FluentBlazorApp/Components/Layout/NavMenu.razor b/FluentBlazorApp/FluentBlazorApp/Components/Layout/NavMenu.razor
index 3828fe4..8471738 100644
--- a/FluentBlazorApp/FluentBlazorApp/Components/Layout/NavMenu.razor
+++ b/FluentBlazorApp/FluentBlazorApp/Components/Layout/NavMenu.razor
@@ -6,8 +6,12 @@
     <nav class="sitenav" aria-labelledby="main-menu">
         <FluentNavMenu Id="main-menu" Collapsible="true" Width="250" Title="Navigation menu" @bind-Expanded="expanded" CustomToggle="true">
             <FluentNavLink Href="/" Match="NavLinkMatch.All" Icon="@(new Icons.Regular.Size20.Home())" IconColor="Color.Accent">Home</FluentNavLink>
-            <FluentNavLink Href="counter" Icon="@(new Icons.Regular.Size20.NumberSymbolSquare())" IconColor="Color.Accent">Counter</FluentNavLink>
-            <FluentNavLink Href="weather" Icon="@(new Icons.Regular.Size20.WeatherPartlyCloudyDay())" IconColor="Color.Accent">Weather</FluentNavLink>
+            <AuthorizeView>
+                <Authorized>
+                    <FluentNavLink Href="counter" Icon="@(new Icons.Regular.Size20.NumberSymbolSquare())" IconColor="Color.Accent">Counter</FluentNavLink>
+                    <FluentNavLink Href="weather" Icon="@(new Icons.Regular.Size20.WeatherPartlyCloudyDay())" IconColor="Color.Accent">Weather</FluentNavLink>
+                </Authorized>
+            </AuthorizeView>
             <FluentNavLink Href="login" Icon="@(new Icons.Regular.Size20.PersonPasskey())" IconColor="Color.Accent">Login</FluentNavLink>
             <FluentNavLink Href="register" Icon="@(new Icons.Regular.Size20.PersonAdd())" IconColor="Color.Accent">Register</FluentNavLink>
         </FluentNavMenu>
diff --git a/FluentBlazorApp/FluentBlazorApp/Components/Pages/Home.razor b/FluentBlazorApp/FluentBlazorApp/Components/Pages/Home.razor
index 96714a2..af21d69 100644
--- a/FluentBlazorApp/FluentBlazorApp/Components/Pages/Home.razor
+++ b/FluentBlazorApp/FluentBlazorApp/Components/Pages/Home.razor
@@ -4,4 +4,11 @@
 
 <h1>Hello, world!</h1>
 
-Welcome to your new Fluent Blazor app.
\ No newline at end of file
+<AuthorizeView>
+    <Authorized>
+        <h3>Hi, @(context.User.Identity!.Name), Welcome</h3>
+    </Authorized>
+    <NotAuthorized>
+        <h3>You are not logged in</h3>
+    </NotAuthorized>
+</AuthorizeView>
\ No newline at end of file
diff --git a/FluentBlazorApp/FluentBlazorApp/Components/Pages/Login.razor b/FluentBlazorApp/FluentBlazorApp/Components/Pages/Login.razor
index b893c61..a4fa33a 100644
--- a/FluentBlazorApp/FluentBlazorApp/Components/Pages/Login.razor
+++ b/FluentBlazorApp/FluentBlazorApp/Components/Pages/Login.razor
@@ -9,9 +9,9 @@
             <DataAnnotationsValidator/>
             <FluentValidationSummary/>
 
-            <FluentStack Orientation="Orientation.Vertical">
+            <FluentStack Orientation="Orientation.Vertical" VerticalGap="5">
                 <div>
-                    <FluentTextField @bind-Value="login.Name" Label="Id" Required/>
+                    <FluentTextField @bind-Value="login.Name" Label="Name" Required/>
                     <FluentValidationMessage For="@(() => login.Name)"/>
                 </div>
                 <div>
diff --git a/FluentBlazorApp/FluentBlazorApp/Components/Pages/Register.razor b/FluentBlazorApp/FluentBlazorApp/Components/Pages/Register.razor
new file mode 100644
index 0000000..2afc0cc
--- /dev/null
+++ b/FluentBlazorApp/FluentBlazorApp/Components/Pages/Register.razor
@@ -0,0 +1,46 @@
+@page "/register"
+@inject IToastService ToastService
+@rendermode RenderMode.InteractiveServer
+
+<FluentGrid Justify="JustifyContent.Center">
+    <FluentGridItem sm="4">
+        <h2>Login</h2>
+        <FluentEditForm Model="@register" OnValidSubmit="@OnRegisterSubmit">
+            <DataAnnotationsValidator/>
+            <FluentValidationSummary/>
+
+            <FluentStack Orientation="Orientation.Vertical" VerticalGap="5">
+                <div>
+                    <FluentTextField @bind-Value="register.Name" Label="Name" Required />
+                    <FluentValidationMessage For="@(() => register.Name)" />
+                </div>
+                <div>
+                    <FluentTextField @bind-Value="register.Password" TextFieldType="TextFieldType.Password" Label="Password" Required />
+                    <FluentValidationMessage For="@(() => register.Password)" />
+                </div>
+                <div>
+                    <FluentTextField @bind-Value="register.ConfirmPassword" TextFieldType="TextFieldType.Password" Label="Confirm Password" Required />
+                    <FluentValidationMessage For="@(() => register.ConfirmPassword)" />
+                </div>
+                <FluentButton Type="ButtonType.Submit" Appearance="Appearance.Accent">Register</FluentButton>
+            </FluentStack>
+        </FluentEditForm>
+    </FluentGridItem>
+</FluentGrid>
+
+@code {
+    RegisterDTO register = new RegisterDTO();
+
+    async Task OnRegisterSubmit(EditContext context)
+    {
+        RegistrationResonse response = await AccountService.RegisterAsync(register);
+        if (!response.Flag)
+        {
+            ToastService.ShowError(response.message, 5000);
+            return;
+        }
+
+        ToastService.ShowSuccess(response.message, 5000);
+        register = new RegisterDTO();
+    }
+}
diff --git a/FluentBlazorApp/FluentBlazorApp/Components/Pages/Weather.razor b/FluentBlazorApp/FluentBlazorApp/Components/Pages/Weather.razor
index 411cd5e..f55b64b 100644
--- a/FluentBlazorApp/FluentBlazorApp/Components/Pages/Weather.razor
+++ b/FluentBlazorApp/FluentBlazorApp/Components/Pages/Weather.razor
@@ -14,7 +14,7 @@
 else
 {
     <!-- This page is rendered in SSR mode, so the FluentDataGrid component does not offer any interactivity (like sorting). -->
-    <FluentDataGrid Id="weathergrid" Items="@forecasts" GridTemplateColumns="1fr 1fr 1fr 2fr" TGridItem="WeatherForecast">
+    <FluentDataGrid Id="weathergrid" Items="@forecasts" GridTemplateColumns="1fr 1fr 1fr 2fr" TGridItem="WeatherForecastDTO">
         <PropertyColumn Title="Date" Property="@(c => c!.Date)" Align="Align.Start"/>
         <PropertyColumn Title="Temp. (C)" Property="@(c => c!.TemperatureC)" Align="Align.Center"/>
         <PropertyColumn Title="Temp. (F)" Property="@(c => c!.TemperatureF)" Align="Align.Center"/>
@@ -23,28 +23,8 @@ else
 }
 
 @code {
-    private IQueryable<WeatherForecast>? forecasts;
+    private IQueryable<WeatherForecastDTO>? forecasts;
 
     protected override async Task OnInitializedAsync()
-    {
-        // Simulate asynchronous loading to demonstrate streaming rendering
-        await Task.Delay(500);
-
-        var startDate = DateOnly.FromDateTime(DateTime.Now);
-        var summaries = new[] { "Freezing", "Bracing", "Chilly", "Cool", "Mild", "Warm", "Balmy", "Hot", "Sweltering", "Scorching" };
-        forecasts = Enumerable.Range(1, 5).Select(index => new WeatherForecast
-        {
-            Date = startDate.AddDays(index),
-            TemperatureC = Random.Shared.Next(-20, 55),
-            Summary = summaries[Random.Shared.Next(summaries.Length)]
-        }).AsQueryable();
-    }
-
-    private class WeatherForecast
-    {
-        public DateOnly Date { get; set; }
-        public int TemperatureC { get; set; }
-        public string? Summary { get; set; }
-        public int TemperatureF => 32 + (int)(TemperatureC / 0.5556);
-    }
+        => forecasts = (await AccountService.GetWeatherForecastsAync()).AsQueryable();
 }
diff --git a/FluentBlazorApp/FluentBlazorApp/Controllers/AccountController.cs b/FluentBlazorApp/FluentBlazorApp/Controllers/AccountController.cs
index 0a617fd..b76f21e 100644
--- a/FluentBlazorApp/FluentBlazorApp/Controllers/AccountController.cs
+++ b/FluentBlazorApp/FluentBlazorApp/Controllers/AccountController.cs
@@ -1,5 +1,6 @@
 using FluentBlazorApp.DTOs;
 using FluentBlazorApp.Repos;
+using Microsoft.AspNetCore.Authorization;
 using Microsoft.AspNetCore.Http;
 using Microsoft.AspNetCore.Mvc;
 using static FluentBlazorApp.Responses.CustomResponses;
@@ -18,6 +19,7 @@ namespace FluentBlazorApp.Controllers
         }
 
         [HttpPost("register")]
+        [AllowAnonymous]
         public async Task<ActionResult<RegistrationResonse>> RegiserAsync(RegisterDTO model)
         {
             var result = await _accountRepo.RegisterAsync(model);
@@ -25,10 +27,25 @@ namespace FluentBlazorApp.Controllers
     }
 
         [HttpPost("login")]
+        [AllowAnonymous]
         public async Task<ActionResult<LoginResponse>> LoginAsync(LoginDTO model)
         {
             var result = await _accountRepo.LoginAsync(model);
             return Ok(result);
         }
+
+        [HttpGet("weather")]
+        [Authorize]
+        public ActionResult<WeatherForecastDTO[]> GetWeatherForecast()
+        {
+            var startDate = DateOnly.FromDateTime(DateTime.Now);
+            var summaries = new[] { "Freezing", "Bracing", "Chilly", "Cool", "Mild", "Warm", "Balmy", "Hot", "Sweltering", "Scorching" };
+            return Ok(Enumerable.Range(1, 5).Select(index => new WeatherForecastDTO
+            {
+                Date = startDate.AddDays(index),
+                TemperatureC = Random.Shared.Next(-20, 55),
+                Summary = summaries[Random.Shared.Next(summaries.Length)]
+            }).ToArray());
+        }
     }
 }
diff --git a/FluentBlazorApp/FluentBlazorApp/DTOs/LoginDTO.cs b/FluentBlazorApp/FluentBlazorApp/DTOs/LoginDTO.cs
index 21d8094..0ae7869 100644
--- a/FluentBlazorApp/FluentBlazorApp/DTOs/LoginDTO.cs
+++ b/FluentBlazorApp/FluentBlazorApp/DTOs/LoginDTO.cs
@@ -1,4 +1,5 @@
-using System.ComponentModel.DataAnnotations;
+using System.ComponentModel;
+using System.ComponentModel.DataAnnotations;
 
 namespace FluentBlazorApp.DTOs
 {
@@ -7,7 +8,7 @@ namespace FluentBlazorApp.DTOs
         [Required, DataType(DataType.Text), StringLength(50, MinimumLength = 2)]
         public string Name { get; set; } = string.Empty;
 
-        [Required, DataType(DataType.Password)]
+        [Required, DataType(DataType.Password), StringLength(50, MinimumLength = 4)]
         public string Password { get; set; } = string.Empty;
     }
 }
diff --git a/FluentBlazorApp/FluentBlazorApp/DTOs/RegisterDTO.cs b/FluentBlazorApp/FluentBlazorApp/DTOs/RegisterDTO.cs
index e41fcbb..8442aaa 100644
--- a/FluentBlazorApp/FluentBlazorApp/DTOs/RegisterDTO.cs
+++ b/FluentBlazorApp/FluentBlazorApp/DTOs/RegisterDTO.cs
@@ -4,9 +4,6 @@ namespace FluentBlazorApp.DTOs
 {
     public class RegisterDTO : LoginDTO
     {
-        [Required, DataType(DataType.EmailAddress), EmailAddress]
-        public string Email { get; set; } = string.Empty;
-
         [Required, DataType(DataType.Password), Compare(nameof(Password))]
         public string ConfirmPassword { get; set; } = string.Empty;
     }
diff --git a/FluentBlazorApp/FluentBlazorApp/DTOs/WeatherForecastDTO.cs b/FluentBlazorApp/FluentBlazorApp/DTOs/WeatherForecastDTO.cs
new file mode 100644
index 0000000..1c7e2a7
--- /dev/null
+++ b/FluentBlazorApp/FluentBlazorApp/DTOs/WeatherForecastDTO.cs
@@ -0,0 +1,10 @@
+namespace FluentBlazorApp.DTOs
+{
+    public class WeatherForecastDTO
+    {
+        public DateOnly Date { get; set; }
+        public int TemperatureC { get; set; }
+        public string? Summary { get; set; }
+        public int TemperatureF => 32 + (int)(TemperatureC / 0.5556);
+    }
+}
diff --git a/FluentBlazorApp/FluentBlazorApp/FluentBlazorApp.csproj b/FluentBlazorApp/FluentBlazorApp/FluentBlazorApp.csproj
index e7ec760..0af43e9 100644
--- a/FluentBlazorApp/FluentBlazorApp/FluentBlazorApp.csproj
+++ b/FluentBlazorApp/FluentBlazorApp/FluentBlazorApp.csproj
@@ -1,4 +1,4 @@
-<Project Sdk="Microsoft.NET.Sdk.Web">
+<Project Sdk="Microsoft.NET.Sdk.Web">
 
   <PropertyGroup>
     <TargetFramework>net8.0</TargetFramework>
@@ -25,4 +25,10 @@
     <PackageReference Include="Microsoft.FluentUI.AspNetCore.Components.Icons" Version="4.*-* " />
     <PackageReference Include="Microsoft.AspNetCore.Components.Authorization" Version="8.0.7" />
   </ItemGroup>
+
+  <ItemGroup>
+    <Content Update="Components\Pages\Register.razor">
+      <ExcludeFromSingleFile>true</ExcludeFromSingleFile>
+    </Content>
+  </ItemGroup>
 </Project>
diff --git a/FluentBlazorApp/FluentBlazorApp/Migrations/20240802051133_First.Designer.cs b/FluentBlazorApp/FluentBlazorApp/Migrations/20240805064123_InitialCreate.Designer.cs
similarity index 88%
rename from FluentBlazorApp/FluentBlazorApp/Migrations/20240802051133_First.Designer.cs
rename to FluentBlazorApp/FluentBlazorApp/Migrations/20240805064123_InitialCreate.Designer.cs
index 66a4dc3..94ec9c6 100644
--- a/FluentBlazorApp/FluentBlazorApp/Migrations/20240802051133_First.Designer.cs
+++ b/FluentBlazorApp/FluentBlazorApp/Migrations/20240805064123_InitialCreate.Designer.cs
@@ -11,8 +11,8 @@ using Microsoft.EntityFrameworkCore.Storage.ValueConversion;
 namespace FluentBlazorApp.Migrations
 {
     [DbContext(typeof(AppDbContext))]
-    [Migration("20240802051133_First")]
-    partial class First
+    [Migration("20240805064123_InitialCreate")]
+    partial class InitialCreate
     {
         /// <inheritdoc />
         protected override void BuildTargetModel(ModelBuilder modelBuilder)
@@ -32,10 +32,6 @@ namespace FluentBlazorApp.Migrations
 
                     MySqlPropertyBuilderExtensions.UseMySqlIdentityColumn(b.Property<int>("Id"));
 
-                    b.Property<string>("Email")
-                        .IsRequired()
-                        .HasColumnType("longtext");
-
                     b.Property<string>("Name")
                         .IsRequired()
                         .HasColumnType("longtext");
diff --git a/FluentBlazorApp/FluentBlazorApp/Migrations/20240802051133_First.cs b/FluentBlazorApp/FluentBlazorApp/Migrations/20240805064123_InitialCreate.cs
similarity index 88%
rename from FluentBlazorApp/FluentBlazorApp/Migrations/20240802051133_First.cs
rename to FluentBlazorApp/FluentBlazorApp/Migrations/20240805064123_InitialCreate.cs
index a1d895a..e08f78e 100644
--- a/FluentBlazorApp/FluentBlazorApp/Migrations/20240802051133_First.cs
+++ b/FluentBlazorApp/FluentBlazorApp/Migrations/20240805064123_InitialCreate.cs
@@ -6,7 +6,7 @@ using Microsoft.EntityFrameworkCore.Migrations;
 namespace FluentBlazorApp.Migrations
 {
     /// <inheritdoc />
-    public partial class First : Migration
+    public partial class InitialCreate : Migration
     {
         /// <inheritdoc />
         protected override void Up(MigrationBuilder migrationBuilder)
@@ -22,8 +22,6 @@ namespace FluentBlazorApp.Migrations
                         .Annotation("MySql:ValueGenerationStrategy", MySqlValueGenerationStrategy.IdentityColumn),
                     Name = table.Column<string>(type: "longtext", nullable: false)
                         .Annotation("MySql:CharSet", "utf8mb4"),
-                    Email = table.Column<string>(type: "longtext", nullable: false)
-                        .Annotation("MySql:CharSet", "utf8mb4"),
                     Password = table.Column<string>(type: "longtext", nullable: false)
                         .Annotation("MySql:CharSet", "utf8mb4")
                 },
diff --git a/FluentBlazorApp/FluentBlazorApp/Migrations/AppDbContextModelSnapshot.cs b/FluentBlazorApp/FluentBlazorApp/Migrations/AppDbContextModelSnapshot.cs
index df817f4..3bf4b54 100644
--- a/FluentBlazorApp/FluentBlazorApp/Migrations/AppDbContextModelSnapshot.cs
+++ b/FluentBlazorApp/FluentBlazorApp/Migrations/AppDbContextModelSnapshot.cs
@@ -29,10 +29,6 @@ namespace FluentBlazorApp.Migrations
 
                     MySqlPropertyBuilderExtensions.UseMySqlIdentityColumn(b.Property<int>("Id"));
 
-                    b.Property<string>("Email")
-                        .IsRequired()
-                        .HasColumnType("longtext");
-
                     b.Property<string>("Name")
                         .IsRequired()
                         .HasColumnType("longtext");
diff --git a/FluentBlazorApp/FluentBlazorApp/Models/ApplicationUser.cs b/FluentBlazorApp/FluentBlazorApp/Models/ApplicationUser.cs
index 1485dea..0f58932 100644
--- a/FluentBlazorApp/FluentBlazorApp/Models/ApplicationUser.cs
+++ b/FluentBlazorApp/FluentBlazorApp/Models/ApplicationUser.cs
@@ -6,8 +6,6 @@
 
         public string Name { get; set; } = string.Empty;
 
-        public string Email { get; set; } = string.Empty;
-
         public string Password { get; set; } = string.Empty;
     }
 }
diff --git a/FluentBlazorApp/FluentBlazorApp/Repos/Account.cs b/FluentBlazorApp/FluentBlazorApp/Repos/Account.cs
index 0468e19..d32700d 100644
--- a/FluentBlazorApp/FluentBlazorApp/Repos/Account.cs
+++ b/FluentBlazorApp/FluentBlazorApp/Repos/Account.cs
@@ -50,7 +50,6 @@ namespace FluentBlazorApp.Repos
                 new ApplicationUser()
                 {
                     Name = model.Name,
-                    Email = model.Email,
                     Password = BCrypt.Net.BCrypt.HashPassword(model.Password)
                 });
 
diff --git a/FluentBlazorApp/FluentBlazorApp/Services/AccountService.cs b/FluentBlazorApp/FluentBlazorApp/Services/AccountService.cs
index 6b282b8..f488d9b 100644
--- a/FluentBlazorApp/FluentBlazorApp/Services/AccountService.cs
+++ b/FluentBlazorApp/FluentBlazorApp/Services/AccountService.cs
@@ -7,6 +7,7 @@ namespace FluentBlazorApp.Services
     public class AccountService : IAccountService
     {
         private readonly HttpClient _httpClient;
+        private readonly string BASE_URL = "api/account";
 
         public AccountService(HttpClient httpClient)
         {
@@ -15,16 +16,21 @@ namespace FluentBlazorApp.Services
 
         public async Task<LoginResponse> LoginAsync(LoginDTO model)
         {
-            var resonse = await _httpClient.PostAsJsonAsync("api/account/login", model);
+            var resonse = await _httpClient.PostAsJsonAsync($"{BASE_URL}/login", model);
             var result = await resonse.Content.ReadFromJsonAsync<LoginResponse>();
             return result;
         }
 
         public async Task<RegistrationResonse> RegisterAsync(RegisterDTO model)
         {
-            var resonse = await _httpClient.PostAsJsonAsync("api/account/register", model);
+            var resonse = await _httpClient.PostAsJsonAsync($"{BASE_URL}/register", model);
             var result = await resonse.Content.ReadFromJsonAsync<RegistrationResonse>();
             return result;
         }
+
+        public async Task<WeatherForecastDTO[]> GetWeatherForecastsAync()
+            => await _httpClient.GetFromJsonAsync<WeatherForecastDTO[]>($"{BASE_URL}/weather");
+
+
     }
 }
diff --git a/FluentBlazorApp/FluentBlazorApp/Services/IAccountService.cs b/FluentBlazorApp/FluentBlazorApp/Services/IAccountService.cs
index 4a93312..e139acc 100644
--- a/FluentBlazorApp/FluentBlazorApp/Services/IAccountService.cs
+++ b/FluentBlazorApp/FluentBlazorApp/Services/IAccountService.cs
@@ -7,5 +7,6 @@ namespace FluentBlazorApp.Services
     {
         Task<RegistrationResonse> RegisterAsync(RegisterDTO model);
         Task<LoginResponse> LoginAsync(LoginDTO model);
+        Task<WeatherForecastDTO[]> GetWeatherForecastsAync();
     }
 }