Ryddet i aria-feil rundt ikoner uten aria-label eller aria-hidden.

navikt · Dec 17, 2024 · 07ab830 · 07ab830
1 parent ec10b15
commit 07ab830
Show file tree

Hide file tree

Showing 15 changed files with 45 additions and 38 deletions.
diff --git a/client/src/Pages/MineSaker/MineSakerKort.tsx b/client/src/Pages/MineSaker/MineSakerKort.tsx
@@ -140,7 +140,7 @@ export const MineSakerKort = ({
                                 variant="tertiary-neutral"
                                 icon={
                                     <NotePencilIcon
-                                        focusable="true"
+                                        aria-hidden
                                         fontSize={"1.5rem"}
                                     />
                                 }

diff --git a/client/src/Pages/MineSaker/Sorteringsknapper.tsx b/client/src/Pages/MineSaker/Sorteringsknapper.tsx
@@ -40,36 +40,40 @@ export const Sorteringsknapper = ({ onSortChange }: SorteringsknapperProps) => {
         );
     };
 
-    const renderIcon = (type: "date" | "alphabetical") => {
-        if (sortType !== type) {
-            return <ArrowsUpDownIcon />;
-        } else if (isAscending) {
-            return <ArrowUpIcon />;
-        } else {
-            return <ArrowDownIcon />;
-        }
-    };
+
 
     return (
         <ButtonContainer>
             <Button
                 size="medium"
                 variant="tertiary"
                 iconPosition="right"
-                icon={renderIcon("alphabetical")}
+                icon={<RenderIcon erSortertPåType={"alphabetical" === sortType} isAscending={isAscending} />}
                 onClick={() => handleSortToggle("alphabetical")}
+                aria-label="Sorter etter alfabetisk rekkefølge"
             >
                 Alfabetisk rekkefølge
             </Button>
             <Button
                 size="medium"
                 variant="tertiary"
                 iconPosition="right"
-                icon={renderIcon("date")}
+                icon={<RenderIcon erSortertPåType={"date" === sortType} isAscending={isAscending} />}
                 onClick={() => handleSortToggle("date")}
+                aria-label="Sorter etter sist endret"
             >
                 Sist endret
             </Button>
         </ButtonContainer>
     );
 };
+
+const RenderIcon = ({ erSortertPåType, isAscending }: { erSortertPåType: boolean, isAscending: boolean }) => {
+    if (!erSortertPåType) {
+        return <ArrowsUpDownIcon aria-hidden />;
+    } else if (isAscending) {
+        return <ArrowUpIcon aria-label="Sortert stigende" />;
+    } else {
+        return <ArrowDownIcon aria-label="Sortert synkende" />;
+    }
+};
diff --git a/client/src/Pages/MineSaker/TeamDropdown.tsx b/client/src/Pages/MineSaker/TeamDropdown.tsx
@@ -36,7 +36,7 @@ export default function TeamDropdown({ open, setOpen, iaSak }: TeamModalProps) {
             >
                 <Button
                     onClick={() => setOpen(true)}
-                    icon={<ChevronDownIcon />}
+                    icon={<ChevronDownIcon aria-hidden />}
                     iconPosition={"right"}
                     variant={"tertiary"}
                     size={"small"}
@@ -45,17 +45,17 @@ export default function TeamDropdown({ open, setOpen, iaSak }: TeamModalProps) {
                     <HStack align={"center"} gap={"1"}>
                         {brukerErEierAvSak ? (
                             <>
-                                <PersonFillIcon />
+                                <PersonFillIcon aria-hidden />
                                 <BodyShort>Du eier saken</BodyShort>
                             </>
                         ) : brukerFølgerSak ? (
                             <>
-                                <HeartFillIcon />
+                                <HeartFillIcon aria-hidden />
                                 <BodyShort>Du følger saken</BodyShort>
                             </>
                         ) : (
                             <>
-                                <PersonGroupIcon />
+                                <PersonGroupIcon aria-hidden />
                                 <BodyShort>Følg eller ta eierskap</BodyShort>
                             </>
                         )}

diff --git a/client/src/Pages/MineSaker/TeamInnhold.tsx b/client/src/Pages/MineSaker/TeamInnhold.tsx
@@ -103,9 +103,9 @@ export default function TeamInnhold({ iaSak }: { iaSak: IASak }) {
                     >
                         <HStack gap={"2"} align={"center"}>
                             {iaSak.eidAv !== brukerIdent ? (
-                                <PersonIcon />
+                                <PersonIcon aria-hidden />
                             ) : (
-                                <PersonFillIcon />
+                                <PersonFillIcon aria-hidden />
                             )}
                             {iaSak.eidAv !== brukerIdent ? (
                                 <BodyShort>Ta eierskap</BodyShort>

diff --git a/client/src/Pages/Virksomhet/Kartlegging/BehovsvurderingCardHeaderInnhold.tsx b/client/src/Pages/Virksomhet/Kartlegging/BehovsvurderingCardHeaderInnhold.tsx
@@ -226,7 +226,8 @@ export const BehovsvurderingCardHeaderInnhold = ({
                                                     true,
                                                 )
                                             }
-                                            icon={<TrashIcon />}
+                                            icon={<TrashIcon aria-hidden />}
+                                            aria-label="Slett behovsvurdering"
                                         />
                                     )}
                                 </>
@@ -301,7 +302,8 @@ export const BehovsvurderingCardHeaderInnhold = ({
                                                         true,
                                                     )
                                                 }
-                                                icon={<TrashIcon />}
+                                                icon={<TrashIcon aria-hidden />}
+                                                aria-label="Slett behovsvurdering"
                                             />
                                         </>
                                     )}

diff --git a/client/src/Pages/Virksomhet/Kartlegging/EksportVisning.tsx b/client/src/Pages/Virksomhet/Kartlegging/EksportVisning.tsx
@@ -226,7 +226,7 @@ const EksportVisning = ({
         <>
             <Button
                 loading={erIEksportMode}
-                icon={<FilePdfIcon fontSize="1.5rem" />}
+                icon={<FilePdfIcon fontSize="1.5rem" aria-hidden />}
                 variant="secondary"
                 size="small"
                 onClick={(e) => {

diff --git a/client/src/Pages/Virksomhet/Plan/EditTemaKnapp.tsx b/client/src/Pages/Virksomhet/Plan/EditTemaKnapp.tsx
@@ -78,7 +78,7 @@ export default function EditTemaKnapp({
                     loggModalÅpnet("Rediger tema");
                     setModalOpen(true);
                 }}
-                icon={<DocPencilIcon />}
+                icon={<DocPencilIcon aria-hidden />}
             >
                 Rediger tema
             </Button>

diff --git a/client/src/Pages/Virksomhet/Plan/EksportVisning.tsx b/client/src/Pages/Virksomhet/Plan/EksportVisning.tsx
@@ -56,7 +56,7 @@ export default function EksportVisning({
     return (
         <Button
             loading={lagrer}
-            icon={<FilePdfIcon fontSize="1.5rem" />}
+            icon={<FilePdfIcon fontSize="1.5rem" aria-hidden />}
             variant="secondary"
             size="small"
             onClick={(e) => {

diff --git a/client/src/Pages/Virksomhet/Plan/LeggTilTemaKnapp.tsx b/client/src/Pages/Virksomhet/Plan/LeggTilTemaKnapp.tsx
@@ -149,7 +149,7 @@ export default function LeggTilTemaKnapp({
                 size="medium"
                 iconPosition="left"
                 variant="primary"
-                icon={<NotePencilIcon />}
+                icon={<NotePencilIcon aria-hidden />}
                 style={{ margin: "1rem", minWidth: "10.5rem" }}
                 onClick={() => {
                     loggModalÅpnet("Rediger plan");

diff --git a/client/src/Pages/Virksomhet/Samarbeid/EierskapKnapp.tsx b/client/src/Pages/Virksomhet/Samarbeid/EierskapKnapp.tsx
@@ -9,14 +9,14 @@ export function EierskapKnapp({ iaSak }: { iaSak?: IASak }) {
         return (
             <Button
                 onClick={() => setIsModalOpen(true)}
-                icon={<ChevronDownIcon />}
+                icon={<ChevronDownIcon aria-hidden />}
                 iconPosition={"right"}
                 variant={"tertiary"}
                 size={"small"}
                 disabled={true}
             >
                 <HStack align={"center"} gap={"1"}>
-                    <CircleSlashIcon />
+                    <CircleSlashIcon aria-hidden />
                     <BodyShort>Ingen aktiv sak</BodyShort>
                 </HStack>
             </Button>

diff --git a/client/src/Pages/Virksomhet/Samarbeid/EndreSamarbeidModal.tsx b/client/src/Pages/Virksomhet/Samarbeid/EndreSamarbeidModal.tsx
@@ -202,7 +202,6 @@ export const EndreSamarbeidModal = ({
                 <SquareButton
                     icon={
                         <TrashIcon
-                            focusable="true"
                             title={`Slett "${samarbeid.navn}"`}
                             fontSize="2rem"
                         />

diff --git a/client/src/Pages/Virksomhet/Samarbeid/Evaluering/EvalueringCardHeaderInnhold.tsx b/client/src/Pages/Virksomhet/Samarbeid/Evaluering/EvalueringCardHeaderInnhold.tsx
@@ -214,7 +214,8 @@ export const EvalueringCardHeaderInnhold = ({
                                                     true,
                                                 )
                                             }
-                                            icon={<TrashIcon />}
+                                            icon={<TrashIcon aria-hidden />}
+                                            aria-label="Slett behovsvurdering"
                                         />
                                     )}
                                 </>
@@ -291,7 +292,8 @@ export const EvalueringCardHeaderInnhold = ({
                                                         true,
                                                     )
                                                 }
-                                                icon={<TrashIcon />}
+                                                icon={<TrashIcon aria-hidden />}
+                                                aria-label="Slett behovsvurdering"
                                             />
                                         </>
                                     )}

diff --git a/client/src/Pages/Virksomhet/Samarbeid/SamarbeidsDropdown.tsx b/client/src/Pages/Virksomhet/Samarbeid/SamarbeidsDropdown.tsx
@@ -59,7 +59,7 @@ export const SamarbeidsDropdown = ({
             <Dropdown>
                 <Button
                     as={Dropdown.Toggle}
-                    icon={<ChevronDownIcon />}
+                    icon={<ChevronDownIcon aria-hidden />}
                     iconPosition="right"
                     variant="primary-neutral"
                     size="small"

diff --git a/...src/Pages/Virksomhet/Virksomhetsoversikt/VirksomhetsinfoHeader/SaksgangDropdownToggle.tsx b/...src/Pages/Virksomhet/Virksomhetsoversikt/VirksomhetsinfoHeader/SaksgangDropdownToggle.tsx
@@ -73,7 +73,7 @@ export function SaksgangDropdownToggle({
                     size={"small"}
                     variant={"primary"}
                     iconPosition={"right"}
-                    icon={<ChevronDownIcon />}
+                    icon={<ChevronDownIcon aria-hidden />}
                 >
                     Ikke aktiv
                 </IkkeAktivKnapp>
@@ -84,7 +84,7 @@ export function SaksgangDropdownToggle({
                     size={"small"}
                     variant={"primary"}
                     iconPosition={"right"}
-                    icon={<ChevronDownIcon />}
+                    icon={<ChevronDownIcon aria-hidden />}
                 >
                     {penskrivIAStatus(iaSak.status)}
                 </VurderesKnapp>
@@ -95,7 +95,7 @@ export function SaksgangDropdownToggle({
                     size={"small"}
                     variant={"primary"}
                     iconPosition={"right"}
-                    icon={<ChevronDownIcon />}
+                    icon={<ChevronDownIcon aria-hidden />}
                 >
                     {penskrivIAStatus(iaSak.status)}
                 </KontaktesKnapp>
@@ -106,7 +106,7 @@ export function SaksgangDropdownToggle({
                     size={"small"}
                     variant={"primary"}
                     iconPosition={"right"}
-                    icon={<ChevronDownIcon />}
+                    icon={<ChevronDownIcon aria-hidden />}
                 >
                     {penskrivIAStatus(iaSak.status)}
                 </KartleggesKnapp>
@@ -117,7 +117,7 @@ export function SaksgangDropdownToggle({
                     size={"small"}
                     variant={"primary"}
                     iconPosition={"right"}
-                    icon={<ChevronDownIcon />}
+                    icon={<ChevronDownIcon aria-hidden />}
                 >
                     {penskrivIAStatus(iaSak.status)}
                 </ViBistårKnapp>
@@ -128,7 +128,7 @@ export function SaksgangDropdownToggle({
                     size={"small"}
                     variant={"primary"}
                     iconPosition={"right"}
-                    icon={<ChevronDownIcon />}
+                    icon={<ChevronDownIcon aria-hidden />}
                 >
                     {penskrivIAStatus(iaSak.status)}
                 </IkkeAktivKnapp>
@@ -139,7 +139,7 @@ export function SaksgangDropdownToggle({
                     size={"small"}
                     variant={"primary"}
                     iconPosition={"right"}
-                    icon={<ChevronDownIcon />}
+                    icon={<ChevronDownIcon aria-hidden />}
                 >
                     {penskrivIAStatus(iaSak.status)}
                 </IkkeAktuellKnapp>

diff --git a/...ges/Virksomhet/Virksomhetsoversikt/VirksomhetsinfoHeader/VirksomhetOgSamarbeidsHeader.tsx b/...ges/Virksomhet/Virksomhetsoversikt/VirksomhetsinfoHeader/VirksomhetOgSamarbeidsHeader.tsx
@@ -105,7 +105,7 @@ export default function VirksomhetOgSamarbeidsHeader({
 
                             {gjeldendeSamarbeid && (
                                 <>
-                                    <ChevronRightIcon fontSize="2rem" />
+                                    <ChevronRightIcon fontSize="2rem" aria-hidden />
                                     <Heading level={"1"} size={"large"}>
                                         {defaultNavnHvisTomt(
                                             gjeldendeSamarbeid.navn,