fix(settings): sort followed channels by name

Seldszar · Aug 9, 2023 · 6542456 · 6542456
1 parent 2f8ea1a
commit 6542456
Showing 1 changed file with 8 additions and 1 deletion.
diff --git a/src/browser/views/settings/NotificationSettings.tsx b/src/browser/views/settings/NotificationSettings.tsx
@@ -1,3 +1,5 @@
+import { sortBy } from "lodash-es";
+import { useMemo } from "react";
 import tw, { styled } from "twin.macro";
 
 import { t } from "~/common/helpers";
@@ -22,6 +24,11 @@ export function Component() {
 
   const { data: followedChannels = [] } = useFollowedChannels();
 
+  const sortedFollowedChannels = useMemo(
+    () => sortBy(followedChannels, "broadcasterName"),
+    [followedChannels],
+  );
+
   return (
     <div>
       <Section>
@@ -45,7 +52,7 @@ export function Component() {
         <CheckboxGrid
           {...register("notifications.selectedUsers")}
           disabled={!settings.notifications.enabled || !settings.notifications.withFilters}
-          options={followedChannels.map((follow) => ({
+          options={sortedFollowedChannels.map((follow) => ({
             title: <ChannelName login={follow.broadcasterLogin} name={follow.broadcasterName} />,
             value: follow.broadcasterId,
           }))}