Skip to content

Commit 4b3dccb

Browse files
KSemenenkoKSemenenko
committed
Sidebar
1 parent 56dd322 commit 4b3dccb

24 files changed

Lines changed: 312 additions & 31 deletions

‎src/PrompterOne.Shared/Contracts/UiTestIds.Library.cs‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,9 @@ public static partial class UiTestIds
55
public static class Library
66
{
77
public const string Sidebar = "library-sidebar";
8+
public const string SidebarClose = "library-sidebar-close";
9+
public const string SidebarScrim = "library-sidebar-scrim";
10+
public const string SidebarToggle = "library-sidebar-toggle";
811
public const string Page = "library-page";
912
public const string CreateScript = "library-create-script";
1013
public const string CreateScriptSurface = "library-create-script-surface";

‎src/PrompterOne.Shared/Editor/Components/EditorViewModels.cs‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
1-
using PrompterOne.Core.Models.Editor;
21
using Microsoft.AspNetCore.Components.Forms;
2+
using PrompterOne.Core.Models.Editor;
33

44
namespace PrompterOne.Shared.Components.Editor;
55

‎src/PrompterOne.Shared/Editor/Services/EditorBlockAttachmentStore.cs‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
using PrompterOne.Core.Abstractions;
2-
using PrompterOne.Shared.Services;
32

43
namespace PrompterOne.Shared.Services.Editor;
54

‎src/PrompterOne.Shared/GoLive/Services/GoLiveBlockTakeStore.cs‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
using PrompterOne.Core.Abstractions;
2-
using PrompterOne.Shared.Services;
32

43
namespace PrompterOne.Shared.Services;
54

‎src/PrompterOne.Shared/Library/Components/LibrarySidebar.razor‎

Lines changed: 24 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,21 @@
44
@using PrompterOne.Shared.Localization
55
@inject IStringLocalizer<SharedResource> Localizer
66

7-
<div class="lib-sidebar" data-test="@UiTestIds.Library.Sidebar">
7+
<aside id="library-sidebar-panel"
8+
class="lib-sidebar"
9+
aria-hidden="@AriaHiddenValue"
10+
data-sidebar-state="@(IsOpen ? "open" : "closed")"
11+
data-test="@UiTestIds.Library.Sidebar">
12+
<div class="lib-sidebar-topbar">
13+
<button class="lib-sidebar-close"
14+
type="button"
15+
title="@Text(UiTextKey.LibraryCloseSidebar)"
16+
aria-label="@Text(UiTextKey.LibraryCloseSidebar)"
17+
data-test="@UiTestIds.Library.SidebarClose"
18+
@onclick="HandleCloseAsync">
19+
<UiIcon Kind="UiIconKind.PanelLeft" Size="16" />
20+
</button>
21+
</div>
822
<nav class="lib-nav">
923
<a class="nav-item @(IsAllSelected ? "active" : null)"
1024
@onclick="HandleSelectAllAsync"
@@ -86,7 +100,7 @@
86100
@Text(UiTextKey.LibrarySettings)
87101
</a>
88102
</nav>
89-
</div>
103+
</aside>
90104

91105
@code {
92106
private const string ActiveStateValue = "active";
@@ -100,6 +114,8 @@
100114

101115
[Parameter, EditorRequired] public bool IsFavoritesSelected { get; set; }
102116

117+
[Parameter, EditorRequired] public bool IsOpen { get; set; }
118+
103119
[Parameter, EditorRequired] public int FavoriteScriptCount { get; set; }
104120

105121
[Parameter, EditorRequired] public LibraryOrganizationTerminology OrganizationTerminology { get; set; } =
@@ -111,8 +127,12 @@
111127

112128
[Parameter, EditorRequired] public EventCallback<string> OnSelectFolder { get; set; }
113129

130+
[Parameter, EditorRequired] public EventCallback OnClose { get; set; }
131+
114132
[Parameter, EditorRequired] public EventCallback OnStartCreateFolder { get; set; }
115133

134+
private string AriaHiddenValue => IsOpen ? "false" : "true";
135+
116136
private Task HandleSelectAllAsync() => OnSelectFolder.InvokeAsync(LibrarySelectionKeys.All);
117137

118138
private Task HandleSelectFavoritesAsync() => OnSelectFolder.InvokeAsync(LibrarySelectionKeys.Favorites);
@@ -122,6 +142,8 @@
122142

123143
private Task HandleStartCreateAsync() => OnStartCreateFolder.InvokeAsync();
124144

145+
private Task HandleCloseAsync() => OnClose.InvokeAsync();
146+
125147
private string GetOrganizationModeClass(LibraryOrganizationMode mode) =>
126148
mode == SelectedOrganizationMode
127149
? "lib-organization-option active"

‎src/PrompterOne.Shared/Library/Pages/LibraryPage.ViewState.cs‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -86,7 +86,7 @@ private IEnumerable<LibraryCardViewModel> SortCards(IEnumerable<LibraryCardViewM
8686
.OrderBy(card => card.Author, StringComparer.OrdinalIgnoreCase)
8787
.ThenBy(card => card.Title, StringComparer.OrdinalIgnoreCase),
8888
LibrarySortMode.Project => cards
89-
.OrderBy(card => ResolveProjectSortLabel(card), StringComparer.OrdinalIgnoreCase)
89+
.OrderBy(ResolveProjectSortLabel, StringComparer.OrdinalIgnoreCase)
9090
.ThenBy(card => card.Title, StringComparer.OrdinalIgnoreCase),
9191
_ => cards
9292
.OrderBy(card => card.DisplayOrder)

‎src/PrompterOne.Shared/Library/Pages/LibraryPage.razor‎

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -6,22 +6,47 @@
66

77
<div id="screen-library"
88
class="screen active"
9+
data-sidebar-state="@SidebarStateValue"
910
data-test="@UiTestIds.Library.Page"
1011
@onclick="HandleLibrarySurfaceClick">
1112
<LibrarySidebar Folders="_folderNodes"
1213
AllScriptCount="_allCards.Count"
1314
IsAllSelected="IsAllSelected"
1415
IsFavoritesSelected="IsFavoritesSelected"
16+
IsOpen="_isSidebarOpen"
1517
FavoriteScriptCount="_allCards.Count(card => card.IsFavorite)"
1618
OrganizationTerminology="OrganizationTerminology"
1719
SelectedOrganizationMode="_organizationMode"
1820
OnOrganizationModeChanged="SetOrganizationMode"
1921
OnSelectFolder="SelectFolder"
22+
OnClose="CloseSidebar"
2023
OnStartCreateFolder="StartCreateFolder" />
2124

25+
@if (_isSidebarOpen)
26+
{
27+
<button class="lib-sidebar-scrim"
28+
type="button"
29+
aria-label="@Text(UiTextKey.LibraryCloseSidebar)"
30+
data-test="@UiTestIds.Library.SidebarScrim"
31+
@onclick="CloseSidebar"
32+
@onclick:stopPropagation="true"></button>
33+
}
34+
2235
<main class="lib-main">
2336
<div class="lib-scroll">
2437
<div class="lib-sort-bar">
38+
<button class="lib-sidebar-toggle"
39+
type="button"
40+
title="@Text(SidebarToggleLabelKey)"
41+
aria-label="@Text(SidebarToggleLabelKey)"
42+
aria-controls="library-sidebar-panel"
43+
aria-expanded="@(_isSidebarOpen ? "true" : "false")"
44+
data-sidebar-state="@SidebarStateValue"
45+
data-test="@UiTestIds.Library.SidebarToggle"
46+
@onclick="ToggleSidebar"
47+
@onclick:stopPropagation="true">
48+
<UiIcon Kind="UiIconKind.PanelLeft" Size="16" />
49+
</button>
2550
<span class="sort-label" data-test="@UiTestIds.Library.SortLabel">@Text(UiTextKey.LibrarySortBy)</span>
2651
<button class="sort-btn @GetSortClass(LibrarySortMode.Name)"
2752
@onclick="() => SetSortMode(LibrarySortMode.Name)"

‎src/PrompterOne.Shared/Library/Pages/LibraryPage.razor.cs‎

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,7 @@
55
using PrompterOne.Core.Services;
66
using PrompterOne.Core.Services.Preview;
77
using PrompterOne.Shared.Components.Library;
8+
using PrompterOne.Shared.Localization;
89
using PrompterOne.Shared.Services;
910
using PrompterOne.Shared.Services.Diagnostics;
1011

@@ -39,6 +40,7 @@ public partial class LibraryPage : ComponentBase, IDisposable
3940
[Inject] private TpsDocumentReader TpsDocumentReader { get; set; } = null!;
4041
private bool _loadLibrary = true;
4142
private bool _isCreatingFolder;
43+
private bool _isSidebarOpen = true;
4244
private string _folderDraftName = string.Empty;
4345
private string _folderDraftParentId = LibrarySelectionKeys.Root;
4446
private string _selectedFolderId = LibrarySelectionKeys.All;
@@ -61,4 +63,13 @@ public partial class LibraryPage : ComponentBase, IDisposable
6163
LibraryOrganizationTerminologyCatalog.Resolve(_organizationMode);
6264

6365
private void HandleLibrarySurfaceClick() => _dismissCardMenuRevision++;
66+
67+
private string SidebarStateValue => _isSidebarOpen ? "open" : "closed";
68+
69+
private UiTextKey SidebarToggleLabelKey =>
70+
_isSidebarOpen ? UiTextKey.LibraryCloseSidebar : UiTextKey.LibraryOpenSidebar;
71+
72+
private void ToggleSidebar() => _isSidebarOpen = !_isSidebarOpen;
73+
74+
private void CloseSidebar() => _isSidebarOpen = false;
6475
}

‎src/PrompterOne.Shared/Localization/SharedResource.de.resx‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -87,6 +87,12 @@
8787
<data name="LibraryNewSequence" xml:space="preserve">
8888
<value>Neue Sequenz</value>
8989
</data>
90+
<data name="LibraryOpenSidebar" xml:space="preserve">
91+
<value>Seitenleiste öffnen</value>
92+
</data>
93+
<data name="LibraryCloseSidebar" xml:space="preserve">
94+
<value>Seitenleiste schließen</value>
95+
</data>
9096
<data name="LibrarySettings" xml:space="preserve">
9197
<value>Einstellungen</value>
9298
</data>

‎src/PrompterOne.Shared/Localization/SharedResource.es.resx‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -87,6 +87,12 @@
8787
<data name="LibraryNewSequence" xml:space="preserve">
8888
<value>Nueva secuencia</value>
8989
</data>
90+
<data name="LibraryOpenSidebar" xml:space="preserve">
91+
<value>Abrir barra lateral</value>
92+
</data>
93+
<data name="LibraryCloseSidebar" xml:space="preserve">
94+
<value>Cerrar barra lateral</value>
95+
</data>
9096
<data name="LibrarySettings" xml:space="preserve">
9197
<value>Configuración</value>
9298
</data>

0 commit comments

Comments
 (0)