Remove custom icons

TanStack · Jan 9, 2024 · 8437cae · 8437cae
1 parent 4a1d93f
commit 8437cae
Show file tree

Hide file tree

Showing 19 changed files with 167 additions and 740 deletions.
diff --git a/app/components/Docs.tsx b/app/components/Docs.tsx
@@ -1,12 +1,7 @@
 import { useMemo, useRef } from 'react'
 import * as DocSearch from '@docsearch/react'
-import {
-  FaSolidArrowLeft,
-  FaSolidArrowRight,
-  FaSolidTimes,
-  GgClose,
-  GgMenuLeft,
-} from '~/components/icons'
+import { CgClose, CgMenuLeft } from 'react-icons/cg/index'
+import { FaArrowLeft, FaArrowRight, FaTimes } from 'react-icons/fa/index'
 import { NavLink, Outlet, useMatches } from '@remix-run/react'
 import { last } from '~/utils/utils'
 import { Carbon } from '~/components/Carbon'
@@ -160,8 +155,8 @@ export function Docs({
       >
         <summary className="p-4 flex gap-2 items-center justify-between">
           <div className="flex gap-2 items-center text-xl md:text-2xl">
-            <GgMenuLeft className="icon-open mr-2 cursor-pointer" />
-            <GgClose className="icon-close mr-2 cursor-pointer" />
+            <CgMenuLeft className="icon-open mr-2 cursor-pointer" />
+            <CgClose className="icon-close mr-2 cursor-pointer" />
             {logo}
           </div>
           <Search {...config.docSearch} />
@@ -264,7 +259,7 @@ export function Docs({
                 shadow-lg dark:border dark:border-gray-800
                 lg:text-lg"
                 >
-                  <FaSolidArrowLeft /> {prevItem.label}
+                  <FaArrowLeft /> {prevItem.label}
                 </LinkOrA>
               ) : null}
               {nextItem ? (
@@ -288,7 +283,7 @@ export function Docs({
                     >
                       {nextItem.label}
                     </span>{' '}
-                    <FaSolidArrowRight className={textColor} />
+                    <FaArrowRight className={textColor} />
                   </div>
                 </LinkOrA>
               ) : null}
@@ -316,7 +311,7 @@ export function Docs({
                   setShowBytes(false)
                 }}
               >
-                <FaSolidTimes />
+                <FaTimes />
               </button>
             </div>
           </div>

diff --git a/app/components/RootDocument.tsx b/app/components/RootDocument.tsx
@@ -7,7 +7,7 @@ import {
   useMatches,
   useNavigation,
 } from '@remix-run/react'
-import { GgSpinner } from '~/components/icons'
+import { CgSpinner } from 'react-icons/cg/index'
 import type { ReactNode } from 'react'
 
 export function RootDocument({
@@ -75,7 +75,7 @@ export function RootDocument({
               navigation.state !== 'idle' ? 'opacity-1' : 'opacity-0'
             }`}
         >
-          <GgSpinner className="text-2xl animate-spin" />
+          <CgSpinner className="text-2xl animate-spin" />
         </div>
       </body>
     </html>

diff --git a/app/components/Select.tsx b/app/components/Select.tsx
@@ -1,9 +1,6 @@
 import { Fragment } from 'react'
 import { Listbox, Transition } from '@headlessui/react'
-import {
-  HeroiconsSolidCheck,
-  HeroiconsSolidChevronDown,
-} from '~/components/icons'
+import { HiCheck, HiChevronDown } from 'react-icons/hi/index'
 import { Form } from '@remix-run/react'
 
 export type AvailableOptions = Record<
@@ -47,7 +44,7 @@ export function Select({
               ) : null}
               <span className="truncate">{selectedOption.label}</span>
               <span className="pointer-events-none absolute inset-y-0 right-0 flex items-center pr-2">
-                <HeroiconsSolidChevronDown
+                <HiChevronDown
                   className="h-5 w-5 text-gray-400"
                   aria-hidden="true"
                 />
@@ -93,10 +90,7 @@ export function Select({
                         </span>
                         {selected ? (
                           <span className="absolute inset-y-0 right-0 flex items-center pr-3 text-gray-800 dark:text-gray-400">
-                            <HeroiconsSolidCheck
-                              className="h-5 w-5"
-                              aria-hidden="true"
-                            />
+                            <HiCheck className="h-5 w-5" aria-hidden="true" />
                           </span>
                         ) : null}
                       </>