From ebbc14f84198f8c21be3a9be43c4f2a8f15c76b7 Mon Sep 17 00:00:00 2001
From: Jackson Harper <jacksonh@gmail.com>
Date: Thu, 3 Aug 2023 12:24:09 +0800
Subject: [PATCH] Sort labels in the left menu alphabetically

---
 .../components/templates/homeFeed/LibraryFilterMenu.tsx   | 8 +++++++-
 1 file changed, 7 insertions(+), 1 deletion(-)

diff --git a/packages/web/components/templates/homeFeed/LibraryFilterMenu.tsx b/packages/web/components/templates/homeFeed/LibraryFilterMenu.tsx
index 9d1fe702b..5acde5b38 100644
--- a/packages/web/components/templates/homeFeed/LibraryFilterMenu.tsx
+++ b/packages/web/components/templates/homeFeed/LibraryFilterMenu.tsx
@@ -203,6 +203,12 @@ function Labels(props: LibraryFilterMenuProps): JSX.Element {
     initialValue: false,
   })
 
+  const sortedLabels = useMemo(() => {
+    return labels.sort((left: Label, right: Label) =>
+      left.name.localeCompare(right.name)
+    )
+  }, [labels])
+
   return (
     <MenuPanel
       title="Labels"
@@ -212,7 +218,7 @@ function Labels(props: LibraryFilterMenuProps): JSX.Element {
         window.location.href = '/settings/labels'
       }}
     >
-      {labels.slice(0, viewAll ? undefined : 4).map((item) => {
+      {sortedLabels.slice(0, viewAll ? undefined : 4).map((item) => {
         return <LabelButton key={item.id} label={item} {...props} />
       })}
       <ViewAllButton state={viewAll} setState={setViewAll} />