Update main layout to show/hide the sidebar (#254)

Author: justinyoo

.github/workflows/azure-dev-build-only.yml

@@ -53,11 +53,18 @@ jobs:
       run: |
         dotnet build
 
+    - name: Install playwright
+      shell: pwsh
+      run: |
+        $playwright = Get-ChildItem -File Microsoft.Playwright.dll -Path . -Recurse
+        $installer = "$($playwright[0].Directory.FullName)/playwright.ps1"
+        & "$installer" install
+
     - name: Run unit tests
       shell: bash
       run: |
-        dotnet test ./test/AzureOpenAIProxy.AppHost.Tests --logger "trx" --collect:"XPlat Code Coverage"
-        dotnet test ./test/AzureOpenAIProxy.ApiApp.Tests --logger "trx" --collect:"XPlat Code Coverage"
+        dotnet test ./test/AzureOpenAIProxy.AppHost.Tests --no-build --logger "trx" --collect:"XPlat Code Coverage"
+        dotnet test ./test/AzureOpenAIProxy.ApiApp.Tests --no-build --logger "trx" --collect:"XPlat Code Coverage"
 
     - name: Run integration tests
       shell: bash
@@ -68,7 +75,7 @@ jobs:
 
         sleep 30
 
-        dotnet test ./test/AzureOpenAIProxy.PlaygroundApp.Tests --logger "trx" --collect:"XPlat Code Coverage"
+        dotnet test ./test/AzureOpenAIProxy.PlaygroundApp.Tests --no-build --logger "trx" --collect:"XPlat Code Coverage"
 
         kill $DOTNET_PID
 

.github/workflows/azure-dev.yml

@@ -65,13 +65,20 @@ jobs:
     - name: Build solution
       shell: bash
       run: |
-        dotnet build
+        dotnet build -c Release
+
+    - name: Install playwright
+      shell: pwsh
+      run: |
+        $playwright = Get-ChildItem -File Microsoft.Playwright.dll -Path . -Recurse
+        $installer = "$($playwright[0].Directory.FullName)/playwright.ps1"
+        & "$installer" install
 
     - name: Run unit tests
       shell: bash
       run: |
-        dotnet test ./test/AzureOpenAIProxy.AppHost.Tests --logger "trx" --collect:"XPlat Code Coverage"
-        dotnet test ./test/AzureOpenAIProxy.ApiApp.Tests --logger "trx" --collect:"XPlat Code Coverage"
+        dotnet test ./test/AzureOpenAIProxy.AppHost.Tests -c Release --no-build --logger "trx" --collect:"XPlat Code Coverage"
+        dotnet test ./test/AzureOpenAIProxy.ApiApp.Tests -c Release --no-build --logger "trx" --collect:"XPlat Code Coverage"
 
     - name: Run integration tests
       shell: bash
@@ -82,7 +89,7 @@ jobs:
 
         sleep 30
 
-        dotnet test ./test/AzureOpenAIProxy.PlaygroundApp.Tests --logger "trx" --collect:"XPlat Code Coverage"
+        dotnet test ./test/AzureOpenAIProxy.PlaygroundApp.Tests -c Release --no-build --logger "trx" --collect:"XPlat Code Coverage"
 
         kill $DOTNET_PID
 

Directory.Build.props

@@ -15,13 +15,15 @@
     <OpenTelemetryExtensionsVersion>1.*</OpenTelemetryExtensionsVersion>
     <OpenTelemetryInstrumentationVersion>1.*</OpenTelemetryInstrumentationVersion>
     <SwashbuckleVersion>6.*</SwashbuckleVersion>
+    <SystemTextJsonVersion>8.*</SystemTextJsonVersion>
     <FluentUIVersion>4.*</FluentUIVersion>
 
     <CoverletVersion>6.*</CoverletVersion>
     <FluentAssertionsVersion>6.*</FluentAssertionsVersion>
     <MicrosoftTestSdkVersion>17.*</MicrosoftTestSdkVersion>
     <NSubstituteVersion>5.*</NSubstituteVersion>
-    <SystemTextJsonVersion>8.*</SystemTextJsonVersion>
+    <NUnitVersion>4.*</NUnitVersion>
+    <PlaywrightVersion>1.*</PlaywrightVersion>
     <XunitVersion>2.*</XunitVersion>
   </PropertyGroup>
 </Project>

src/AzureOpenAIProxy.PlaygroundApp/Components/Layout/MainLayout.razor

@@ -1,15 +1,14 @@
 @inherits LayoutComponentBase
 
 <div class="page">
-    <div class="sidebar">
-        <NavMenu />
-    </div>
-
-    <main>
-        <div class="top-row px-4">
-            <a href="https://learn.microsoft.com/aspnet/core/" target="_blank">About</a>
+    @if (this._isAdmin == true)
+    {
+        <div class="sidebar">
+            <NavMenu />
         </div>
+    }
 
+    <main>
         <article class="content px-4">
             @Body
         </article>

src/AzureOpenAIProxy.PlaygroundApp/Components/Layout/MainLayout.razor.cs

@@ -0,0 +1,26 @@
+using Microsoft.AspNetCore.Components;
+
+namespace AzureOpenAIProxy.PlaygroundApp.Components.Layout;
+
+/// <summary>
+/// This represents the layout component for the main layout.
+/// </summary>
+public partial class MainLayout : LayoutComponentBase
+{
+    private bool _isAdmin;
+
+    /// <summary>
+    /// Injects the <see cref="NavigationManager"/> instance.
+    /// </summary>
+    [Inject]
+    private NavigationManager? NavMan { get; set; }
+
+    /// <inheritdoc />
+    protected override async Task OnInitializedAsync()
+    {
+        var path = new Uri(this.NavMan!.Uri).AbsolutePath;
+        this._isAdmin = path.StartsWith("/admin", StringComparison.CurrentCultureIgnoreCase);
+
+        await Task.CompletedTask;
+    }
+}

test/AzureOpenAIProxy.ApiApp.Tests/UnitTest1.cs

@@ -1,4 +1,4 @@
-<Project Sdk="Microsoft.NET.Sdk">
+<Project Sdk="Microsoft.NET.Sdk">
 
   <PropertyGroup>
     <IsPackable>false</IsPackable>
@@ -15,19 +15,20 @@
     </PackageReference>
     <PackageReference Include="FluentAssertions" Version="$(FluentAssertionsVersion)" />
     <PackageReference Include="Microsoft.NET.Test.Sdk" Version="$(MicrosoftTestSdkVersion)" />
-    <PackageReference Include="xunit" Version="$(XunitVersion)" />
-    <PackageReference Include="xunit.runner.visualstudio" Version="$(XunitVersion)">
+    <PackageReference Include="Microsoft.Playwright.NUnit" Version="$(PlaywrightVersion)" />
+    <PackageReference Include="NUnit.Analyzers" Version="$(NUnitVersion)">
       <PrivateAssets>all</PrivateAssets>
       <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
     </PackageReference>
+    <PackageReference Include="NUnit3TestAdapter" Version="$(NUnitVersion)" />
   </ItemGroup>
 
-  <ItemGroup>
+  <!--<ItemGroup>
     <ProjectReference Include="..\..\src\AzureOpenAIProxy.PlaygroundApp\AzureOpenAIProxy.PlaygroundApp.csproj" />
-  </ItemGroup>
+  </ItemGroup>-->
 
   <ItemGroup>
-    <Using Include="Xunit" />
+    <Using Include="NUnit.Framework" />
   </ItemGroup>
 
 </Project>

test/AzureOpenAIProxy.PlaygroundApp.Tests/AzureOpenAIProxy.PlaygroundApp.Tests.csproj

@@ -0,0 +1,28 @@
+using Microsoft.Playwright;
+using Microsoft.Playwright.NUnit;
+
+namespace AzureOpenAIProxy.PlaygroundApp.Tests.Pages;
+
+[Parallelizable(ParallelScope.Self)]
+[TestFixture]
+[Property("Category", "Integration")]
+public class HomePageTests : PageTest
+{
+    public override BrowserNewContextOptions ContextOptions() => new()
+    {
+        IgnoreHTTPSErrors = true,
+    };
+
+    [Test]
+    public async Task Given_Root_Page_When_Navigated_Then_It_Should_No_Sidebar()
+    {
+        // Arrange
+        await this.Page.GotoAsync("https://localhost:5001");
+
+        // Act
+        var sidebar = this.Page.Locator("div.sidebar");
+
+        // Assert
+        Expect(sidebar).Equals(null);
+    }
+}