From 633dbb9c475e078fa8f9f8aa646fbf27862a7258 Mon Sep 17 00:00:00 2001
From: Sulaiman Hamouda <sulai@buildwithfern.com>
Date: Mon, 29 Jul 2024 19:05:56 -0400
Subject: [PATCH 1/4] Include 'alt' attribute for the logo

---
 packages/ui/app/src/docs/HeaderLogoSection.tsx | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/packages/ui/app/src/docs/HeaderLogoSection.tsx b/packages/ui/app/src/docs/HeaderLogoSection.tsx
index 27a3270339..72bcabfe7c 100644
--- a/packages/ui/app/src/docs/HeaderLogoSection.tsx
+++ b/packages/ui/app/src/docs/HeaderLogoSection.tsx
@@ -1,7 +1,7 @@
 import cn from "clsx";
 import { useAtomValue } from "jotai";
 import { PropsWithChildren, ReactElement } from "react";
-import { LOGO_HREF_ATOM, LOGO_TEXT_ATOM, VERSIONS_ATOM, useColors, useFile, useLogoHeight } from "../atoms";
+import { DOCS_ATOM, LOGO_HREF_ATOM, LOGO_TEXT_ATOM, VERSIONS_ATOM, useColors, useFile, useLogoHeight } from "../atoms";
 import { FernImage } from "../components/FernImage";
 import { FernLink } from "../components/FernLink";
 import { VersionDropdown } from "./VersionDropdown";
@@ -40,11 +40,13 @@ function FernLogoImage(): ReactElement | null {
     const colors = useColors();
     const logoImageHeight = useLogoHeight();
     const imageClassName = "max-h-full object-contain";
+    const title = useAtomValue(DOCS_ATOM).title;
     if (colors.dark != null && colors.light != null) {
         return (
             <>
                 {colors.light.logo != null && (
                     <FernFileImage
+                        alt={title}
                         fileId={colors.light.logo}
                         className={cn(imageClassName, "block dark:hidden")}
                         height={logoImageHeight}
@@ -56,6 +58,7 @@ function FernLogoImage(): ReactElement | null {
                 )}
                 {colors.dark.logo != null && (
                     <FernFileImage
+                        alt={title}
                         fileId={colors.dark.logo}
                         className={cn(imageClassName, "hidden dark:block")}
                         height={logoImageHeight}

From 01b21f4fdb35a4df7821e09a57dbd89176c4c627 Mon Sep 17 00:00:00 2001
From: Sulaiman Hamouda <sulai@buildwithfern.com>
Date: Tue, 30 Jul 2024 10:22:45 -0400
Subject: [PATCH 2/4] Add a fallback to the title - alt should never be empty

---
 packages/ui/app/src/docs/HeaderLogoSection.tsx | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/packages/ui/app/src/docs/HeaderLogoSection.tsx b/packages/ui/app/src/docs/HeaderLogoSection.tsx
index 72bcabfe7c..fca9ab0ded 100644
--- a/packages/ui/app/src/docs/HeaderLogoSection.tsx
+++ b/packages/ui/app/src/docs/HeaderLogoSection.tsx
@@ -40,7 +40,8 @@ function FernLogoImage(): ReactElement | null {
     const colors = useColors();
     const logoImageHeight = useLogoHeight();
     const imageClassName = "max-h-full object-contain";
-    const title = useAtomValue(DOCS_ATOM).title;
+    const title = useAtomValue(DOCS_ATOM).title || "Logo";
+
     if (colors.dark != null && colors.light != null) {
         return (
             <>

From 11ce24247fb99646233c2120ababa7e95af04cc2 Mon Sep 17 00:00:00 2001
From: Sulaiman Hamouda <sulai@buildwithfern.com>
Date: Tue, 30 Jul 2024 10:24:02 -0400
Subject: [PATCH 3/4] Provide a more clear alt title

---
 packages/ui/app/src/docs/HeaderLogoSection.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/ui/app/src/docs/HeaderLogoSection.tsx b/packages/ui/app/src/docs/HeaderLogoSection.tsx
index fca9ab0ded..3ca7b7de4d 100644
--- a/packages/ui/app/src/docs/HeaderLogoSection.tsx
+++ b/packages/ui/app/src/docs/HeaderLogoSection.tsx
@@ -40,7 +40,7 @@ function FernLogoImage(): ReactElement | null {
     const colors = useColors();
     const logoImageHeight = useLogoHeight();
     const imageClassName = "max-h-full object-contain";
-    const title = useAtomValue(DOCS_ATOM).title || "Logo";
+    const title = useAtomValue(DOCS_ATOM).title || "Company Logo";
 
     if (colors.dark != null && colors.light != null) {
         return (

From 6fed6f492f440988541b23fb88e10760457f14e5 Mon Sep 17 00:00:00 2001
From: Andrew Jiang <andrew@buildwithfern.com>
Date: Tue, 30 Jul 2024 14:35:33 -0400
Subject: [PATCH 4/4] Update HeaderLogoSection.tsx

---
 packages/ui/app/src/docs/HeaderLogoSection.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/ui/app/src/docs/HeaderLogoSection.tsx b/packages/ui/app/src/docs/HeaderLogoSection.tsx
index 3ca7b7de4d..eeed93d8ab 100644
--- a/packages/ui/app/src/docs/HeaderLogoSection.tsx
+++ b/packages/ui/app/src/docs/HeaderLogoSection.tsx
@@ -40,7 +40,7 @@ function FernLogoImage(): ReactElement | null {
     const colors = useColors();
     const logoImageHeight = useLogoHeight();
     const imageClassName = "max-h-full object-contain";
-    const title = useAtomValue(DOCS_ATOM).title || "Company Logo";
+    const title = useAtomValue(DOCS_ATOM).title ?? "Logo";
 
     if (colors.dark != null && colors.light != null) {
         return (