fix: ARIA fixes, missing button labels

app/components/DocumentCard.tsx

@@ -108,7 +108,7 @@ function DocumentCard(props: Props) {
           <Actions dir={document.dir} gap={4}>
             {!isDragging && pin && (
               <Tooltip tooltip={t("Unpin")}>
-                <PinButton onClick={handleUnpin}>
+                <PinButton onClick={handleUnpin} aria-label={t("Unpin")}>
                   <CloseIcon color="currentColor" />
                 </PinButton>
               </Tooltip>

app/components/DocumentListItem.tsx

@@ -78,6 +78,7 @@ function DocumentListItem(
       as={DocumentLink}
       ref={ref}
       dir={document.dir}
+      role="menuitem"
       $isStarred={document.isStarred}
       $menuOpen={menuOpen}
       to={{

app/components/Sidebar/App.tsx

@@ -60,7 +60,12 @@ function AppSidebar() {
                 {...props}
                 title={team.name}
                 image={
-                  <StyledTeamLogo src={team.avatarUrl} width={32} height={32} />
+                  <StyledTeamLogo
+                    src={team.avatarUrl}
+                    width={32}
+                    height={32}
+                    alt={t("Logo")}
+                  />
                 }
                 showDisclosure
               />

app/components/Sidebar/Sidebar.tsx

@@ -177,6 +177,7 @@ const Sidebar = React.forwardRef<HTMLDivElement, Props>(
                   title={user.name}
                   image={
                     <StyledAvatar
+                      alt={user.name}
                       src={user.avatarUrl}
                       size={24}
                       showBorder={false}

app/components/Sidebar/components/Disclosure.tsx

@@ -1,5 +1,6 @@
 import { CollapsedIcon } from "outline-icons";
 import * as React from "react";
+import { useTranslation } from "react-i18next";
 import styled, { css } from "styled-components";
 import NudeButton from "~/components/NudeButton";
 
@@ -10,8 +11,16 @@ type Props = {
 };
 
 function Disclosure({ onClick, root, expanded, ...rest }: Props) {
+  const { t } = useTranslation();
+
   return (
-    <Button size={20} onClick={onClick} $root={root} {...rest}>
+    <Button
+      size={20}
+      onClick={onClick}
+      $root={root}
+      aria-label={expanded ? t("Collapse") : t("Expand")}
+      {...rest}
+    >
       <StyledCollapsedIcon expanded={expanded} size={20} color="currentColor" />
     </Button>
   );