diff --git a/Components/App.razor b/Components/App.razor index 1e8963d..a2917af 100644 --- a/Components/App.razor +++ b/Components/App.razor @@ -14,7 +14,7 @@ - + diff --git a/Components/Layout/MainLayout.razor b/Components/Layout/MainLayout.razor index 78624f3..7e9232b 100644 --- a/Components/Layout/MainLayout.razor +++ b/Components/Layout/MainLayout.razor @@ -1,12 +1,24 @@ @inherits LayoutComponentBase -
-
- +
+
+
+ About
@@ -21,3 +33,12 @@ Reload 🗙
+ +@code { + private bool sidebarCollapsed = true; + + private void ToggleSidebar() + { + sidebarCollapsed = !sidebarCollapsed; + } +} diff --git a/Components/Layout/MainLayout.razor.css b/Components/Layout/MainLayout.razor.css index 38d1f25..8204d7a 100644 --- a/Components/Layout/MainLayout.razor.css +++ b/Components/Layout/MainLayout.razor.css @@ -6,6 +6,7 @@ main { flex: 1; + min-width: 0; } .sidebar { @@ -36,6 +37,27 @@ main { text-overflow: ellipsis; } +.sidebar-toggle { + display: none; + align-items: center; + justify-content: center; + flex-direction: column; + gap: 0.2rem; + width: 2.5rem; + height: 2.5rem; + margin-right: auto; + border: 1px solid #d6d5d5; + border-radius: 0.65rem; + background: #fff; +} + +.sidebar-toggle-bar { + width: 1rem; + height: 2px; + background: #334155; + border-radius: 999px; +} + @media (max-width: 640.98px) { .top-row { justify-content: space-between; @@ -56,6 +78,9 @@ main { height: 100vh; position: sticky; top: 0; + transition: width 0.2s ease; + overflow: hidden; + flex: 0 0 auto; } .top-row { @@ -74,6 +99,14 @@ main { padding-left: 2rem !important; padding-right: 1.5rem !important; } + + .sidebar-toggle { + display: inline-flex; + } + + .sidebar.sidebar-collapsed { + width: 5rem; + } } #blazor-error-ui { diff --git a/Components/Layout/NavMenu.razor b/Components/Layout/NavMenu.razor index 5d09d86..4a34d50 100644 --- a/Components/Layout/NavMenu.razor +++ b/Components/Layout/NavMenu.razor @@ -2,59 +2,72 @@ @using WorkTracker.Configuration @inject IOptions AppAuthOptions +@code { + [Parameter] public bool IsCollapsed { get; set; } +} + +
- WorkTracker + + WorkTracker + +
- - -
-
diff --git a/Components/Layout/NavMenu.razor.css b/Components/Layout/NavMenu.razor.css index 950f82c..b4e5429 100644 --- a/Components/Layout/NavMenu.razor.css +++ b/Components/Layout/NavMenu.razor.css @@ -1,20 +1,3 @@ -.navbar-toggler { - appearance: none; - cursor: pointer; - width: 3.5rem; - height: 2.5rem; - color: white; - position: absolute; - top: 0.5rem; - right: 1rem; - border: 1px solid rgba(255, 255, 255, 0.1); - background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 0.55%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") no-repeat center/1.75rem rgba(255, 255, 255, 0.1); -} - -.navbar-toggler:checked { - background-color: rgba(255, 255, 255, 0.5); -} - .top-row { min-height: 3.5rem; background-color: rgba(0,0,0,0.4); @@ -24,6 +7,14 @@ font-size: 1.1rem; } +.sidebar-brand-compact { + display: none; +} + +.nav-menu-shell { + height: 100%; +} + .bi { display: inline-block; position: relative; @@ -83,6 +74,12 @@ padding-bottom: 0.5rem; } +.nav-label { + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; +} + .nav-item:first-of-type { padding-top: 1rem; } @@ -114,24 +111,59 @@ } .nav-scrollable { - display: none; -} - -.navbar-toggler:checked ~ .nav-scrollable { display: block; + height: calc(100vh - 3.5rem); + overflow-y: auto; } -@media (min-width: 641px) { - .navbar-toggler { +@media (max-width: 640.98px) { + .nav-menu-shell-collapsed .sidebar-brand-full, + .nav-menu-shell:not(.nav-menu-shell-collapsed) .sidebar-brand-compact { display: none; } .nav-scrollable { - /* Never collapse the sidebar for wide screens */ - display: block; - - /* Allow sidebar to scroll for tall menus */ - height: calc(100vh - 3.5rem); - overflow-y: auto; + height: auto; + } +} + +@media (min-width: 641px) { + .nav-menu-shell-collapsed .top-row { + padding-left: 0.5rem !important; + padding-right: 0.5rem !important; + } + + .nav-menu-shell-collapsed .container-fluid { + justify-content: center; + } + + .nav-menu-shell-collapsed .sidebar-brand-full, + .nav-menu-shell:not(.nav-menu-shell-collapsed) .sidebar-brand-compact, + .nav-menu-shell-collapsed .nav-label { + display: none; + } + + .nav-menu-shell-collapsed .nav-item { + padding-bottom: 0.3rem; + } + + .nav-menu-shell-collapsed .nav-item.px-3 { + padding-left: 0.5rem !important; + padding-right: 0.5rem !important; + } + + .nav-menu-shell-collapsed .nav-item ::deep .nav-link { + justify-content: center; + padding-left: 0; + padding-right: 0; + } + + .nav-menu-shell-collapsed .nav-item ::deep .nav-link, + .nav-menu-shell-collapsed .nav-item ::deep button.nav-link { + min-width: 0; + } + + .nav-menu-shell-collapsed .bi { + margin-right: 0; } } diff --git a/Components/Pages/CalendarView.razor b/Components/Pages/CalendarView.razor index 93eb539..60f2df0 100644 --- a/Components/Pages/CalendarView.razor +++ b/Components/Pages/CalendarView.razor @@ -81,7 +81,7 @@ else @if (IsActiveCell(cell.Date)) { -
+
@cell.Date.ToString("dddd d MMMM")
@@ -241,6 +241,7 @@ else currentWeek[dayOfWeek] = new CalendarCell { Date = d, + ColumnIndex = dayOfWeek, IsWeekend = d.DayOfWeek is DayOfWeek.Saturday or DayOfWeek.Sunday, IsFestivity = festivities.Contains(d), Entry = lookup.GetValueOrDefault(d) @@ -293,6 +294,16 @@ else activeDate = null; } + private static string GetPopupClass(CalendarCell cell) + { + if (cell.ColumnIndex == 0) + { + return "calendar-popup-left"; + } + + return cell.ColumnIndex >= 5 ? "calendar-popup-right" : string.Empty; + } + private bool IsActiveCell(DateOnly date) => activeDate == date; private void CreateWorkUnit(DateOnly date) @@ -437,6 +448,7 @@ else private sealed class CalendarCell { public DateOnly Date { get; set; } + public int ColumnIndex { get; set; } public bool IsWeekend { get; set; } public bool IsFestivity { get; set; } public WorkDayDocument? Entry { get; set; } diff --git a/Components/Pages/MonthlySummary.razor b/Components/Pages/MonthlySummary.razor index 79edd24..ed4ba65 100644 --- a/Components/Pages/MonthlySummary.razor +++ b/Components/Pages/MonthlySummary.razor @@ -3,7 +3,8 @@ @attribute [Authorize] @rendermode InteractiveServer -@inject IWorkDayService WorkDayService +@using System.Globalization +@inject global::WorkTracker.Services.WorkDays.IWorkDayService WorkDayService Monthly Summary @@ -20,11 +21,16 @@
+
+ + +
+ @if (loading) {

Loading...

} -else if (summary is not null) +else if (viewMode == SummaryViewMode.Cards && summary is not null) {
@@ -141,14 +147,75 @@ else if (summary is not null)
} +else if (viewMode == SummaryViewMode.Timesheet && timesheet is not null) +{ +
+
+
+ + + + + @for (var i = 0; i < timesheet.Days.Count; i++) + { + var day = timesheet.Days[i]; + + } + + + + + @foreach (var row in timesheet.Rows) + { + + + @for (var i = 0; i < row.DailyValues.Count; i++) + { + + } + + + } + +
Categoria +
@day.Date.Day
+
@GetDayHeader(day.Date)
+
+
@day.Date.ToString("dddd d MMMM", ItalianCulture)
+ @if (day.WorkUnitSummaries.Count == 0 && day.EventSummaries.Count == 0) + { +
Nessun elemento registrato.
+ } + else + { + @foreach (var workUnit in day.WorkUnitSummaries) + { +
@workUnit
+ } + + @foreach (var calendarEvent in day.EventSummaries) + { +
@calendarEvent
+ } + } +
+ 		Totale
@row.Label@FormatTimesheetValue(row.DailyValues[i], row.ValueFormat)@FormatTimesheetValue(row.Total, row.ValueFormat)
+
+
+
+} @code { [Parameter] public string? YearMonth { get; set; } + private static readonly CultureInfo ItalianCulture = CultureInfo.GetCultureInfo("it-IT"); + private DateOnly currentMonth; private bool loading = true; private bool includePreview; - private MonthlySummaryModel? summary; + private global::WorkTracker.Domain.MonthlySummaryModel? summary; + private global::WorkTracker.Domain.MonthlyTimesheetModel? timesheet; + private SummaryViewMode viewMode = SummaryViewMode.Timesheet; protected override async Task OnInitializedAsync() { @@ -174,6 +241,7 @@ else if (summary is not null) { loading = true; summary = await WorkDayService.GetMonthlySummaryAsync(currentMonth.Year, currentMonth.Month, includePreview); + timesheet = await WorkDayService.GetMonthlyTimesheetAsync(currentMonth.Year, currentMonth.Month, includePreview); loading = false; } @@ -189,6 +257,53 @@ else if (summary is not null) await LoadSummary(); } + private void SetViewMode(SummaryViewMode mode) + { + viewMode = mode; + } + + private static string GetDayHeader(DateOnly date) + { + return ItalianCulture.TextInfo.ToTitleCase(date.ToString("ddd", ItalianCulture)); + } + + private static string GetDayColumnClass(global::WorkTracker.Domain.MonthlyTimesheetDayModel day) + { + if (day.IsWeekend || day.IsHoliday) + { + return "timesheet-summary-day-danger"; + } + + return day.IsClosure ? "timesheet-summary-day-closure" : string.Empty; + } + + private static string GetDayPopupClass(int index, int totalDays) + { + if (index == 0) + { + return "timesheet-summary-day-popup-left"; + } + + return index >= totalDays - 2 ? "timesheet-summary-day-popup-right" : string.Empty; + } + + private static string FormatTimesheetValue(decimal? value, global::WorkTracker.Domain.MonthlyTimesheetValueFormat valueFormat) + { + if (!value.HasValue || value.Value <= 0m) + { + return string.Empty; + } + + return valueFormat == global::WorkTracker.Domain.MonthlyTimesheetValueFormat.Days + ? value.Value.ToString("0.##", ItalianCulture) + : FormatDecimalHours(value.Value); + } + + private static string FormatDecimalHours(decimal value) + { + return value.ToString("0.##", ItalianCulture); + } + private static string FormatHours(decimal value) { var totalMinutes = (int)Math.Round(value * 60m, MidpointRounding.AwayFromZero); @@ -196,4 +311,10 @@ else if (summary is not null) var minutes = totalMinutes % 60; return $"{hours:00}:{minutes:00}"; } + + private enum SummaryViewMode + { + Cards, + Timesheet + } } diff --git a/Domain/MonthlyTimesheetDaySummary.cs b/Domain/MonthlyTimesheetDaySummary.cs new file mode 100644 index 0000000..e7687f7 --- /dev/null +++ b/Domain/MonthlyTimesheetDaySummary.cs @@ -0,0 +1,26 @@ +namespace WorkTracker.Domain; + +public sealed class MonthlyTimesheetDaySummary +{ + public DateOnly Date { get; set; } + + public decimal OfficeHours { get; set; } + + public decimal HomeHours { get; set; } + + public decimal OvertimeHours { get; set; } + + public decimal WeekendHours { get; set; } + + public decimal NightHours { get; set; } + + public decimal VacationDays { get; set; } + + public decimal PermitHours { get; set; } + + public decimal CompensatoryRestDays { get; set; } + + public decimal SickDays { get; set; } + + public decimal HolidayDays { get; set; } +} \ No newline at end of file diff --git a/Domain/MonthlyTimesheetModel.cs b/Domain/MonthlyTimesheetModel.cs new file mode 100644 index 0000000..5b0ff34 --- /dev/null +++ b/Domain/MonthlyTimesheetModel.cs @@ -0,0 +1,46 @@ +namespace WorkTracker.Domain; + +public sealed class MonthlyTimesheetModel +{ + public int Year { get; set; } + + public int Month { get; set; } + + public List Days { get; set; } = []; + + public List Rows { get; set; } = []; +} + +public sealed class MonthlyTimesheetDayModel +{ + public DateOnly Date { get; set; } + + public bool IsWeekend { get; set; } + + public bool IsHoliday { get; set; } + + public bool IsClosure { get; set; } + + public List WorkUnitSummaries { get; set; } = []; + + public List EventSummaries { get; set; } = []; +} + +public sealed class MonthlyTimesheetRowModel +{ + public string Key { get; set; } = string.Empty; + + public string Label { get; set; } = string.Empty; + + public MonthlyTimesheetValueFormat ValueFormat { get; set; } + + public List DailyValues { get; set; } = []; + + public decimal? Total { get; set; } +} + +public enum MonthlyTimesheetValueFormat +{ + Hours = 0, + Days = 1 +} \ No newline at end of file diff --git a/Services/WorkDays/CouchbaseLiteWorkDayService.cs b/Services/WorkDays/CouchbaseLiteWorkDayService.cs index dcd7f1c..27a9b1d 100644 --- a/Services/WorkDays/CouchbaseLiteWorkDayService.cs +++ b/Services/WorkDays/CouchbaseLiteWorkDayService.cs @@ -212,6 +212,55 @@ public sealed class CouchbaseLiteWorkDayService : IWorkDayService }; } + public async Task GetMonthlyTimesheetAsync(int year, int month, bool includePreview, CancellationToken cancellationToken = default) + { + var from = new DateOnly(year, month, 1); + var to = from.AddMonths(1).AddDays(-1); + var days = await GetRangeAsync(from, to, cancellationToken); + var dayLookup = days.ToDictionary(day => day.Date); + var settings = await appSettingsService.GetAsync(cancellationToken); + + var daySummaries = new List(); + for (var date = from; date <= to; date = date.AddDays(1)) + { + dayLookup.TryGetValue(date, out var day); + daySummaries.Add(CreateTimesheetDaySummary(day, date, includePreview, settings.StandardWorkHoursPerDay)); + } + + return new MonthlyTimesheetModel + { + Year = year, + Month = month, + Days = daySummaries.Select(summary => new MonthlyTimesheetDayModel + { + Date = summary.Date, + IsWeekend = summary.Date.DayOfWeek is DayOfWeek.Saturday or DayOfWeek.Sunday, + IsHoliday = summary.HolidayDays > 0m || dayLookup.GetValueOrDefault(summary.Date)?.IsItalianFestivity == true, + IsClosure = summary.VacationDays > 0m && HasEventType(dayLookup.GetValueOrDefault(summary.Date), CalendarEventType.Closure), + WorkUnitSummaries = dayLookup.GetValueOrDefault(summary.Date)?.WorkUnits + .Where(unit => includePreview || !unit.IsPreview) + .Select(FormatTimesheetWorkUnitSummary) + .ToList() ?? [], + EventSummaries = dayLookup.GetValueOrDefault(summary.Date)?.CalendarEvents + .Select(FormatTimesheetEventSummary) + .ToList() ?? [] + }).ToList(), + Rows = + [ + CreateTimesheetRow("office", "Ore lavorative in presenza", MonthlyTimesheetValueFormat.Hours, daySummaries.Select(summary => summary.OfficeHours)), + CreateTimesheetRow("home", "Ore lavorative in smart working", MonthlyTimesheetValueFormat.Hours, daySummaries.Select(summary => summary.HomeHours)), + CreateTimesheetRow("overtime", "Straordinari", MonthlyTimesheetValueFormat.Hours, daySummaries.Select(summary => summary.OvertimeHours)), + CreateTimesheetRow("weekend", "Weekend", MonthlyTimesheetValueFormat.Hours, daySummaries.Select(summary => summary.WeekendHours)), + CreateTimesheetRow("night", "Notturni (22-06)", MonthlyTimesheetValueFormat.Hours, daySummaries.Select(summary => summary.NightHours)), + CreateTimesheetRow("vacation", "Giorni di ferie", MonthlyTimesheetValueFormat.Days, daySummaries.Select(summary => summary.VacationDays)), + CreateTimesheetRow("permit", "Ore di permesso", MonthlyTimesheetValueFormat.Hours, daySummaries.Select(summary => summary.PermitHours)), + CreateTimesheetRow("compensatory-rest", "Riposo compensativo", MonthlyTimesheetValueFormat.Days, daySummaries.Select(summary => summary.CompensatoryRestDays), includeZeroTotal: false), + CreateTimesheetRow("sick", "Giorni di malattia", MonthlyTimesheetValueFormat.Days, daySummaries.Select(summary => summary.SickDays)), + CreateTimesheetRow("holiday", "Festività", MonthlyTimesheetValueFormat.Days, daySummaries.Select(summary => summary.HolidayDays)) + ] + }; + } + public async Task GenerateMonthlyPreviewWorkUnitsAsync(int year, int month, CancellationToken cancellationToken = default) { cancellationToken.ThrowIfCancellationRequested(); @@ -431,6 +480,64 @@ public sealed class CouchbaseLiteWorkDayService : IWorkDayService return days.Count(day => day.CalendarEvents.Any(calendarEvent => calendarEvent.EventType == eventType)); } + private static MonthlyTimesheetDaySummary CreateTimesheetDaySummary(WorkDayDocument? day, DateOnly date, bool includePreview, decimal defaultStandardHours) + { + var includedUnits = day?.WorkUnits.Where(unit => includePreview || !unit.IsPreview).ToList() ?? []; + var totalHours = includedUnits.Sum(unit => unit.ManualWorkedHours); + var explicitHoliday = HasEventType(day, CalendarEventType.Holiday); + var illness = HasEventType(day, CalendarEventType.Illness); + var dayOff = HasEventType(day, CalendarEventType.DayOff); + var closure = HasEventType(day, CalendarEventType.Closure); + var isWeekend = date.DayOfWeek is DayOfWeek.Saturday or DayOfWeek.Sunday; + var isAutomaticHoliday = day?.IsItalianFestivity ?? false; + var standardHours = includedUnits.FirstOrDefault()?.CoeffSnapshot.StandardWorkHoursPerDay ?? defaultStandardHours; + var nightHours = includedUnits.Sum(GetNightHours); + var weekdayDaytimeHours = isWeekend ? 0m : Math.Max(0m, totalHours - nightHours); + var suppressVacation = isWeekend || explicitHoliday || isAutomaticHoliday || illness; + var hasNonWorkingEvent = explicitHoliday || illness || dayOff || closure; + var permitHours = !isWeekend && !isAutomaticHoliday && !hasNonWorkingEvent && totalHours < standardHours + ? standardHours - totalHours + : 0m; + + return new MonthlyTimesheetDaySummary + { + Date = date, + OfficeHours = includedUnits.Where(unit => unit.Location == WorkUnitLocation.Office).Sum(unit => unit.ManualWorkedHours), + HomeHours = includedUnits.Where(unit => unit.Location == WorkUnitLocation.Home).Sum(unit => unit.ManualWorkedHours), + OvertimeHours = Math.Max(0m, weekdayDaytimeHours - standardHours), + WeekendHours = isWeekend ? totalHours : 0m, + NightHours = nightHours, + VacationDays = (dayOff || closure) && !suppressVacation ? 1m : 0m, + PermitHours = Math.Max(0m, permitHours), + CompensatoryRestDays = 0m, + SickDays = illness ? 1m : 0m, + HolidayDays = explicitHoliday && !isWeekend ? 1m : 0m + }; + } + + private static MonthlyTimesheetRowModel CreateTimesheetRow( + string key, + string label, + MonthlyTimesheetValueFormat valueFormat, + IEnumerable values, + bool includeZeroTotal = true) + { + var dailyValues = values + .Select(value => value > 0m ? value : (decimal?)null) + .ToList(); + + var total = dailyValues.Where(value => value.HasValue).Sum(value => value ?? 0m); + + return new MonthlyTimesheetRowModel + { + Key = key, + Label = label, + ValueFormat = valueFormat, + DailyValues = dailyValues, + Total = includeZeroTotal || total > 0m ? total : null + }; + } + private static decimal GetHoursOff(WorkDayDocument day, bool includePreview) { var includedUnits = day.WorkUnits.Where(unit => includePreview || !unit.IsPreview).ToList(); @@ -449,6 +556,63 @@ public sealed class CouchbaseLiteWorkDayService : IWorkDayService return eventType is CalendarEventType.DayOff or CalendarEventType.Closure or CalendarEventType.Holiday or CalendarEventType.Illness; } + private static bool HasEventType(WorkDayDocument? day, CalendarEventType eventType) + { + return day?.CalendarEvents.Any(calendarEvent => calendarEvent.EventType == eventType) == true; + } + + private static string FormatTimesheetWorkUnitSummary(WorkUnitDocument unit) + { + var prefix = unit.Location == WorkUnitLocation.Home ? "SW" : "Pres"; + var hours = FormatCompactHours(unit.ManualWorkedHours); + if (unit.StartTime.HasValue && unit.EndTime.HasValue) + { + return $"{prefix}: {unit.Label} ({unit.StartTime:HH:mm}-{unit.EndTime:HH:mm}, {hours}h{(unit.IsPreview ? ", preview" : string.Empty)})"; + } + + return $"{prefix}: {unit.Label} ({hours}h{(unit.IsPreview ? ", preview" : string.Empty)})"; + } + + private static string FormatTimesheetEventSummary(CalendarEventDocument calendarEvent) + { + if (calendarEvent.StartTime.HasValue) + { + return $"{calendarEvent.EventType}: {calendarEvent.Description} ({calendarEvent.StartTime:HH:mm})"; + } + + return $"{calendarEvent.EventType}: {calendarEvent.Description}"; + } + + private static string FormatCompactHours(decimal value) + { + return value == decimal.Truncate(value) + ? value.ToString("0") + : value.ToString("0.##", System.Globalization.CultureInfo.InvariantCulture); + } + + private static decimal GetNightHours(WorkUnitDocument unit) + { + if (!unit.StartTime.HasValue || !unit.EndTime.HasValue || unit.EndTime <= unit.StartTime) + { + return 0m; + } + + return GetOverlapHours(unit.StartTime.Value, unit.EndTime.Value, new TimeOnly(0, 0), new TimeOnly(6, 0)) + + GetOverlapHours(unit.StartTime.Value, unit.EndTime.Value, new TimeOnly(22, 0), new TimeOnly(23, 59, 59)); + } + + private static decimal GetOverlapHours(TimeOnly rangeStart, TimeOnly rangeEnd, TimeOnly windowStart, TimeOnly windowEnd) + { + var overlapStart = rangeStart > windowStart ? rangeStart : windowStart; + var overlapEnd = rangeEnd < windowEnd ? rangeEnd : windowEnd; + if (overlapEnd <= overlapStart) + { + return 0m; + } + + return Math.Round((decimal)(overlapEnd - overlapStart).TotalHours, 2, MidpointRounding.AwayFromZero); + } + private static WorkUnitDocument CreatePreviewWorkUnit(string label, TimeOnly startTime, TimeOnly endTime, AppSettingsDocument settings) { var workUnit = new WorkUnitDocument diff --git a/Services/WorkDays/IWorkDayService.cs b/Services/WorkDays/IWorkDayService.cs index 32a6805..c6bc5b8 100644 --- a/Services/WorkDays/IWorkDayService.cs +++ b/Services/WorkDays/IWorkDayService.cs @@ -22,5 +22,7 @@ public interface IWorkDayService Task GetMonthlySummaryAsync(int year, int month, bool includePreview, CancellationToken cancellationToken = default); + Task GetMonthlyTimesheetAsync(int year, int month, bool includePreview, CancellationToken cancellationToken = default); + Task GenerateMonthlyPreviewWorkUnitsAsync(int year, int month, CancellationToken cancellationToken = default); } diff --git a/tests/playwright/auth-bypass.spec.ts b/tests/playwright/auth-bypass.spec.ts index 5250760..670b5e8 100644 --- a/tests/playwright/auth-bypass.spec.ts +++ b/tests/playwright/auth-bypass.spec.ts @@ -1,5 +1,30 @@ import { expect, test } from '@playwright/test'; +test.describe('sidebar collapse', () => { + test('starts collapsed and expands through the toggle button', async ({ page }) => { + await page.setViewportSize({ width: 1440, height: 960 }); + await page.goto('/'); + + const sidebar = page.getByTestId('sidebar-shell'); + const toggle = page.getByRole('button', { name: 'Toggle sidebar' }); + + await expect(sidebar).toHaveAttribute('data-collapsed', 'true'); + await expect(toggle).toHaveAttribute('aria-expanded', 'false'); + await expect(page.getByRole('link', { name: 'Dashboard' })).toBeVisible(); + + await toggle.click(); + + await expect(sidebar).toHaveAttribute('data-collapsed', 'false'); + await expect(toggle).toHaveAttribute('aria-expanded', 'true'); + await expect(page.getByText('Dashboard')).toBeVisible(); + + await toggle.click(); + + await expect(sidebar).toHaveAttribute('data-collapsed', 'true'); + await expect(toggle).toHaveAttribute('aria-expanded', 'false'); + }); +}); + test('home loads without a login screen', async ({ page }) => { await page.goto('/'); @@ -14,7 +39,7 @@ test('protected pages are directly available without redirecting to login', asyn { path: '/calendar', heading: 'Calendar' }, { path: '/summary', heading: 'Monthly Summary' }, { path: '/settings', heading: 'Settings' }, - { path: '/workday', heading: 'Work Day Entry' }, + { path: '/work-unit', heading: 'Work Unit' }, { path: '/auth', heading: 'You are authenticated' } ]; diff --git a/wwwroot/app.css b/wwwroot/app.css index 7c9f49b..071fd5d 100644 --- a/wwwroot/app.css +++ b/wwwroot/app.css @@ -161,7 +161,8 @@ h1:focus { top: 2rem; left: 0.35rem; z-index: 20; - width: min(18rem, calc(100vw - 3rem)); + width: min(16rem, calc(100vw - 2rem)); + max-width: calc(100vw - 2rem); background: #fff; border: 1px solid rgba(0, 0, 0, 0.15); border-radius: 0.75rem; @@ -169,6 +170,16 @@ h1:focus { padding: 0.75rem; } +.calendar-popup-right { + left: auto; + right: 0.35rem; +} + +.calendar-popup-left { + left: 0.35rem; + right: auto; +} + .calendar-popup-section { display: flex; flex-direction: column; @@ -228,4 +239,124 @@ h1:focus { left: 0; width: calc(100vw - 2rem); } +} + +/* Monthly timesheet summary */ +.timesheet-summary-card { + overflow: hidden; +} + +.timesheet-summary-table { + min-width: max-content; +} + +.timesheet-summary-table thead th { + background-color: #f8f9fa; + white-space: nowrap; +} + +.timesheet-summary-table th, +.timesheet-summary-table td { + min-width: 2.2rem; + padding: 0.25rem 0.12rem; + vertical-align: middle; +} + +.timesheet-summary-sticky-column { + position: sticky; + left: 0; + z-index: 2; + min-width: 15rem !important; + background-color: #fff; +} + +.timesheet-summary-table thead .timesheet-summary-sticky-column { + z-index: 3; + background-color: #f8f9fa; +} + +.timesheet-summary-total-column { + background-color: #f8f9fa; + min-width: 3.3rem !important; +} + +.timesheet-summary-table tbody tr:nth-child(odd) td, +.timesheet-summary-table tbody tr:nth-child(odd) .timesheet-summary-sticky-column { + background-color: #fcfcfd; +} + +.timesheet-summary-table .timesheet-summary-day-danger { + background-color: #f8d7da !important; +} + +.timesheet-summary-table .timesheet-summary-day-closure { + background-color: #e2e3e5 !important; +} + +.timesheet-summary-day-header { + position: relative; + cursor: default; +} + +.timesheet-summary-day-popup { + position: absolute; + top: calc(100% + 0.35rem); + left: 50%; + z-index: 15; + width: min(18rem, calc(100vw - 2rem)); + max-width: calc(100vw - 2rem); + padding: 0.65rem 0.75rem; + border: 1px solid rgba(0, 0, 0, 0.12); + border-radius: 0.7rem; + background: #fff; + box-shadow: 0 0.75rem 2rem rgba(15, 23, 42, 0.18); + text-align: left; + transform: translateX(-50%); + opacity: 0; + pointer-events: none; + visibility: hidden; +} + +.timesheet-summary-day-header:hover .timesheet-summary-day-popup, +.timesheet-summary-day-header:focus-within .timesheet-summary-day-popup { + opacity: 1; + visibility: visible; +} + +.timesheet-summary-day-popup-left .timesheet-summary-day-popup { + left: 0; + transform: none; +} + +.timesheet-summary-day-popup-right .timesheet-summary-day-popup { + left: auto; + right: 0; + transform: none; +} + +.timesheet-summary-day-popup-item { + font-size: 0.75rem; + line-height: 1.35; + color: #1f2937; +} + +.timesheet-summary-day-popup-item + .timesheet-summary-day-popup-item { + margin-top: 0.35rem; +} + +.timesheet-summary-day-popup-item-event { + color: #475569; +} + +@media (max-width: 767.98px) { + .timesheet-summary-sticky-column { + min-width: 12rem !important; + } + + .timesheet-summary-day-popup { + left: 0; + right: 0; + width: auto; + transform: none; + } } \ No newline at end of file