mirror of
https://github.com/suitenumerique/docs.git
synced 2026-04-25 17:15:01 +02:00
♿️(frontend) make doc search result labels uniquely identifiable
Include each doc's relative update date in `SimpleDocItem` aria-label.
This commit is contained in:
@@ -14,14 +14,15 @@ and this project adheres to
|
|||||||
|
|
||||||
### Changed
|
### Changed
|
||||||
|
|
||||||
- ♿️(frontend) structure correctly 5xx error alerts #2128
|
- ♿️(frontend) structure correctly 5xx error alerts #2128
|
||||||
|
- ♿️(frontend) make doc search result labels uniquely identifiable #2212
|
||||||
|
|
||||||
## [v4.8.6] - 2026-04-08
|
## [v4.8.6] - 2026-04-08
|
||||||
|
|
||||||
### Added
|
### Added
|
||||||
|
|
||||||
- 🚸(frontend) allow opening "@page" links with
|
- 🚸(frontend) allow opening "@page" links with
|
||||||
ctrl/command/middle-mouse click #2170
|
ctrl/command/middle-mouse click #2170
|
||||||
- ✅ E2E - Any instance friendly #2142
|
- ✅ E2E - Any instance friendly #2142
|
||||||
|
|
||||||
### Changed
|
### Changed
|
||||||
|
|||||||
@@ -38,7 +38,15 @@ export const SimpleDocItem = ({
|
|||||||
const { isDesktop } = useResponsiveStore();
|
const { isDesktop } = useResponsiveStore();
|
||||||
const { untitledDocument } = useTrans();
|
const { untitledDocument } = useTrans();
|
||||||
const { isChild } = useDocUtils(doc);
|
const { isChild } = useDocUtils(doc);
|
||||||
const { relativeDate } = useDate();
|
const { relativeDate, formatDate } = useDate();
|
||||||
|
const docTitle = doc.title || untitledDocument;
|
||||||
|
const docRelativeUpdate = relativeDate(doc.updated_at);
|
||||||
|
const itemAriaLabel = `${t('Open document {{title}}', { title: docTitle })}. ${t(
|
||||||
|
'Last update: {{update}}',
|
||||||
|
{
|
||||||
|
update: formatDate(doc.updated_at),
|
||||||
|
},
|
||||||
|
)}`;
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Box
|
<Box
|
||||||
@@ -47,8 +55,7 @@ export const SimpleDocItem = ({
|
|||||||
$overflow="auto"
|
$overflow="auto"
|
||||||
$width="100%"
|
$width="100%"
|
||||||
className="--docs--simple-doc-item"
|
className="--docs--simple-doc-item"
|
||||||
role="presentation"
|
aria-label={itemAriaLabel}
|
||||||
aria-label={`${t('Open document {{title}}', { title: doc.title || untitledDocument })}`}
|
|
||||||
>
|
>
|
||||||
<Box
|
<Box
|
||||||
$direction="row"
|
$direction="row"
|
||||||
@@ -90,7 +97,7 @@ export const SimpleDocItem = ({
|
|||||||
$css={ItemTextCss}
|
$css={ItemTextCss}
|
||||||
data-testid="doc-title"
|
data-testid="doc-title"
|
||||||
>
|
>
|
||||||
{doc.title || untitledDocument}
|
{docTitle}
|
||||||
</Text>
|
</Text>
|
||||||
{(!isDesktop || showAccesses) && (
|
{(!isDesktop || showAccesses) && (
|
||||||
<Box
|
<Box
|
||||||
@@ -101,7 +108,7 @@ export const SimpleDocItem = ({
|
|||||||
aria-hidden="true"
|
aria-hidden="true"
|
||||||
>
|
>
|
||||||
<Text $size="xs" $variation="tertiary">
|
<Text $size="xs" $variation="tertiary">
|
||||||
{relativeDate(doc.updated_at)}
|
{docRelativeUpdate}
|
||||||
</Text>
|
</Text>
|
||||||
</Box>
|
</Box>
|
||||||
)}
|
)}
|
||||||
|
|||||||
Reference in New Issue
Block a user