diff --git a/client/src/components/AppHeader.vue b/client/src/components/AppHeader.vue index e178fa501..bf12d7fbe 100644 --- a/client/src/components/AppHeader.vue +++ b/client/src/components/AppHeader.vue @@ -607,7 +607,13 @@ function formatBadgeStyle(fmt: string) { - @@ -692,6 +698,7 @@ function formatBadgeStyle(fmt: string) { variant="ghost" size="icon" :class="destinationClass(isStatisticsActive)" + :aria-label="t('components.appHeader.statistics')" @click="navigateToStatistics" > @@ -702,7 +709,13 @@ function formatBadgeStyle(fmt: string) { - @@ -711,7 +724,14 @@ function formatBadgeStyle(fmt: string) { - @@ -726,7 +746,13 @@ function formatBadgeStyle(fmt: string) { - @@ -824,7 +856,14 @@ function formatBadgeStyle(fmt: string) { - diff --git a/client/src/components/ViewHeader.vue b/client/src/components/ViewHeader.vue index bf13daffb..ba28ccaa4 100644 --- a/client/src/components/ViewHeader.vue +++ b/client/src/components/ViewHeader.vue @@ -6,6 +6,7 @@ import { CheckSquare, LayoutGrid, List, SlidersHorizontal, Square, Table2 } from import { Button } from '@/components/ui/button' import { Popover, PopoverContent, PopoverTrigger } from '@/components/ui/popover' import { Sheet, SheetContent, SheetDescription, SheetHeader, SheetTitle } from '@/components/ui/sheet' +import { Tooltip, TooltipContent, TooltipTrigger } from '@/components/ui/tooltip' import type { TableDensity } from '@bookorbit/types' import type { BookViewMode } from '@/composables/useDisplaySettings' import ViewHeaderDesktopSearch from '@/components/view-header/ViewHeaderDesktopSearch.vue' @@ -85,6 +86,62 @@ const mobileSearchOpen = ref(false) function handleShowJumpRailsUpdate(value: boolean) { emit('update:showJumpRails', value) } + +function handleCoverSizeUpdate(value: number) { + emit('update:coverSize', value) +} + +function handleGridGapUpdate(value: number) { + emit('update:gridGap', value) +} + +function handleRowDensityUpdate(value: TableDensity) { + emit('update:rowDensity', value) +} + +function handleCoverFallbackUpdate(value: boolean) { + emit('update:coverFallback', value) +} + +function handleCoverShapeUpdate(value: 'square' | 'circle') { + emit('update:coverShape', value) +} + +function handleViewModeUpdate(value: BookViewMode) { + emit('update:viewMode', value) +} + +function handleSearchQueryUpdate(value: string) { + emit('update:searchQuery', value) +} + +function handleToggleSelection() { + emit('toggle-selection') +} + +function handleGridView() { + handleViewModeUpdate('grid') +} + +function handleListView() { + handleViewModeUpdate('list') +} + +function handleTableView() { + handleViewModeUpdate('table') +} + +function handleOpenDisplay() { + mobileDisplayOpen.value = true +} + +function handleOpenMobileSearch() { + mobileSearchOpen.value = true +} + +function handleMobileSearchOpenUpdate(value: boolean) { + mobileSearchOpen.value = value +}