From ccd93bd60916f67f1301964a4e9b70a0f06e2ae8 Mon Sep 17 00:00:00 2001
From: Jean-Philippe Sirois <jp@veksen.net>
Date: Wed, 1 Jan 2020 15:06:38 -0800
Subject: [PATCH] refact: use ramda for sorting

---
 src/components/ArchivesSidebar/index.tsx  |  3 ++-
 src/components/ResourcesList/index.tsx    |  3 ++-
 src/components/ResourcesSidebar/index.tsx |  4 ++--
 src/utils/index.ts                        | 12 +++++++-----
 4 files changed, 13 insertions(+), 9 deletions(-)

diff --git a/src/components/ArchivesSidebar/index.tsx b/src/components/ArchivesSidebar/index.tsx
index efad0d7..10559a8 100644
--- a/src/components/ArchivesSidebar/index.tsx
+++ b/src/components/ArchivesSidebar/index.tsx
@@ -1,4 +1,5 @@
 import { graphql, useStaticQuery } from "gatsby"
+import { sort } from "ramda"
 import React, { FC, HTMLAttributes } from "react"
 import { IAllArchivesQuery, IFileOrFolder } from "../../types"
 import { humanize } from "../../utils"
@@ -29,7 +30,7 @@ function plantTree(item: IFileOrFolder) {
 export const ArchivesSidebar: FC<HTMLAttributes<HTMLDivElement>> = props => {
   const archives = useStaticQuery<IAllArchivesQuery>(ALL_ARCHIVES)
   const tree = useBuildTree(archives, "/archives")
-  const sortedTree = tree.sort((a, b) => a.title.localeCompare(b.title))
+  const sortedTree = sort((a, b) => a.title.localeCompare(b.title), tree)
 
   return <Sidebar {...props}>{sortedTree.map(plantTree)}</Sidebar>
 }
diff --git a/src/components/ResourcesList/index.tsx b/src/components/ResourcesList/index.tsx
index 1f973bf..19f0e0d 100644
--- a/src/components/ResourcesList/index.tsx
+++ b/src/components/ResourcesList/index.tsx
@@ -5,6 +5,7 @@ import { IAllResourcesQuery, IFileOrFolder, IFolder } from "../../types"
 import { getPath, humanize } from "../../utils"
 import * as SC from "./styles"
 import useBuildTree from "./useBuildTree"
+import { sort } from "ramda"
 
 const ALL_RESOURCES = graphql`
   query {
@@ -77,7 +78,7 @@ export const ResourcesList: FC<IResourcesList> = props => {
   }
 
   const tree = useBuildTree(filteredResources)
-  const sortedTree = tree.sort((a, b) => a.title.localeCompare(b.title))
+  const sortedTree = sort((a, b) => a.title.localeCompare(b.title), tree)
 
   return (
     <SC.ResourcesListWrapper {...props}>
diff --git a/src/components/ResourcesSidebar/index.tsx b/src/components/ResourcesSidebar/index.tsx
index dfd4f0b..03fea4a 100644
--- a/src/components/ResourcesSidebar/index.tsx
+++ b/src/components/ResourcesSidebar/index.tsx
@@ -1,5 +1,5 @@
 import { graphql, useStaticQuery } from "gatsby"
-import { descend, sortWith } from "ramda"
+import { descend, sort, sortWith } from "ramda"
 import React, { FC, HTMLAttributes, memo, useState } from "react"
 import TriangleDown from "../../icons/triangle-down.svg"
 import { IAllResourcesQuery, IFileOrFolder, IFolder } from "../../types"
@@ -113,7 +113,7 @@ const FirstLevelFolder = memo(
 export const ResourcesSidebar: FC<HTMLAttributes<HTMLDivElement>> = props => {
   const resources = useStaticQuery<IAllResourcesQuery>(ALL_RESOURCES)
   const tree = useBuildTree(resources, "/resources")
-  const sortedTree = tree.sort((a, b) => a.title.localeCompare(b.title))
+  const sortedTree = sort((a, b) => a.title.localeCompare(b.title), tree)
 
   return (
     <Sidebar {...props}>
diff --git a/src/utils/index.ts b/src/utils/index.ts
index 76d49a1..7cb4234 100644
--- a/src/utils/index.ts
+++ b/src/utils/index.ts
@@ -2,6 +2,7 @@ import chain from "ramda/es/chain"
 import partition from "ramda/es/partition"
 import pipe from "ramda/es/pipe"
 
+import { sort } from "ramda"
 import { IFile, IFileOrFolder, IFolder } from "../types"
 
 function specificWordsToUpper(str: string): string {
@@ -91,16 +92,17 @@ function generateFolder({
   targets: IFolder[]
 }): IFolder {
   const children = join(chain(target => target.children, targets))
+  const sortedChildren = sort((a, b) => {
+    return a.title.split("/").length > b.title.split("/").length
+      ? -1
+      : a.title.localeCompare(b.title)
+  }, children)
 
   return {
     title,
     type: "folder",
     path,
-    children: children.sort((a, b) =>
-      a.title.split("/").length > b.title.split("/").length
-        ? -1
-        : a.title.localeCompare(b.title)
-    ),
+    children: sortedChildren,
   }
 }