From 4372fccacc4e1fe14280e26bcece4b0154eb79b3 Mon Sep 17 00:00:00 2001
From: Benjamin Elo <beneloca@fb.com>
Date: Mon, 29 Jul 2019 04:20:45 -0700
Subject: [PATCH] Alphabetize bookmarks

Summary: The bookmarks would appear in different order upon reloading the app. Here I have a fixed order.

Reviewed By: jknoxville

Differential Revision: D16540496

fbshipit-source-id: ebc3e1065dbd2ae76b919a943c2cc7f81d857ca8
---
 .../navigation/components/BookmarksSidebar.js | 32 ++++++++++++-------
 1 file changed, 20 insertions(+), 12 deletions(-)

diff --git a/src/plugins/navigation/components/BookmarksSidebar.js b/src/plugins/navigation/components/BookmarksSidebar.js
index d6fb809ae..24cd6a62d 100644
--- a/src/plugins/navigation/components/BookmarksSidebar.js
+++ b/src/plugins/navigation/components/BookmarksSidebar.js
@@ -53,6 +53,10 @@ const BookmarksList = styled('div')({
   },
 });
 
+const alphabetizeBookmarkCompare = (b1: Bookmark, b2: Bookmark) => {
+  return b1.uri < b2.uri ? -1 : b1.uri > b2.uri ? 1 : 0;
+};
+
 export default (props: Props) => {
   const {bookmarks, onNavigate} = props;
   return (
@@ -61,18 +65,22 @@ export default (props: Props) => {
         <NoData grow>No Bookmarks</NoData>
       ) : (
         <BookmarksList>
-          {[...bookmarks.values()].map(bookmark => (
-            <div
-              className="bookmark-container"
-              role="button"
-              tabIndex={0}
-              onClick={() => {
-                onNavigate(bookmark.uri);
-              }}>
-              <div className="bookmark-common-name">{bookmark.commonName}</div>
-              <div className="bookmark-uri">{bookmark.uri}</div>
-            </div>
-          ))}
+          {[...bookmarks.values()]
+            .sort(alphabetizeBookmarkCompare)
+            .map(bookmark => (
+              <div
+                className="bookmark-container"
+                role="button"
+                tabIndex={0}
+                onClick={() => {
+                  onNavigate(bookmark.uri);
+                }}>
+                <div className="bookmark-common-name">
+                  {bookmark.commonName}
+                </div>
+                <div className="bookmark-uri">{bookmark.uri}</div>
+              </div>
+            ))}
         </BookmarksList>
       )}
     </DetailSidebar>