Replace react-feather icon library with lucide

client/src/components/Autocomplete.tsx

@@ -1,6 +1,6 @@
 import { Combobox, Transition } from '@headlessui/react';
+import { ChevronDown } from 'lucide-react';
 import { useState } from 'react';
-import { ChevronDown } from 'react-feather';
 import { twMerge } from 'tailwind-merge';
 
 type AutocompleteProps<T extends string> = {

client/src/components/CourseAverages.tsx

@@ -1,7 +1,7 @@
 import { produce } from 'immer';
 import _ from 'lodash';
+import { ChevronDown } from 'lucide-react';
 import { Fragment, useEffect, useState } from 'react';
-import { ChevronDown } from 'react-feather';
 import { IoIosArrowDown, IoIosArrowUp } from 'react-icons/io';
 import { Link } from 'react-router-dom';
 import { twMerge } from 'tailwind-merge';

client/src/components/CourseInfo.tsx

@@ -1,5 +1,5 @@
+import { ExternalLink } from 'lucide-react';
 import { useEffect, useState } from 'react';
-import { ExternalLink } from 'react-feather';
 import { VscBell, VscBellSlash } from 'react-icons/vsc';
 import { toast } from 'sonner';
 

client/src/components/CourseReview.tsx

@@ -1,7 +1,7 @@
 import { Transition } from '@headlessui/react';
 import { format } from 'date-fns';
+import { Edit, Tag } from 'lucide-react';
 import { Fragment, useEffect, useState } from 'react';
-import { Edit, Tag } from 'react-feather';
 import { BsPinFill } from 'react-icons/bs';
 import { LuFlame, LuThumbsDown, LuThumbsUp } from 'react-icons/lu';
 import { Link } from 'react-router-dom';

client/src/components/CourseSearchBar.tsx

@@ -1,5 +1,5 @@
+import { Layers, Telescope, User } from 'lucide-react';
 import { useState } from 'react';
-import { Layers, User } from 'react-feather';
 import { Link, useNavigate } from 'react-router-dom';
 import { twMerge } from 'tailwind-merge';
 
@@ -84,7 +84,7 @@ const ExploreButton = () => {
           isHovering ? highlightResultStyle : 'bg-gray-100 dark:bg-neutral-800'
         )}
       >
-        <Layers className='dark:text-gray-200' />
+        <Telescope className='dark:text-gray-200' />
         <div className='z-50 ml-2 dark:text-gray-200'>Explore all courses</div>
       </div>
     </Link>

client/src/components/CourseTerms.tsx

@@ -1,6 +1,6 @@
 import { produce } from 'immer';
+import { ChevronDown } from 'lucide-react';
 import { useEffect, useState } from 'react';
-import { ChevronDown } from 'react-feather';
 import { BsSun } from 'react-icons/bs';
 import { FaLeaf, FaRegSnowflake } from 'react-icons/fa';
 import { GoX } from 'react-icons/go';

client/src/components/DeleteButton.tsx

@@ -1,6 +1,6 @@
 import { Dialog, Transition } from '@headlessui/react';
+import { Trash2 } from 'lucide-react';
 import { Fragment, useState } from 'react';
-import { Trash2 } from 'react-feather';
 import { twMerge } from 'tailwind-merge';
 
 import { useDarkMode } from '../hooks/useDarkMode';

client/src/components/MultiSelect.tsx

@@ -1,6 +1,6 @@
 import { Combobox, Transition } from '@headlessui/react';
+import { Check, ChevronDown, X } from 'lucide-react';
 import { useState } from 'react';
-import { Check, ChevronDown, X } from 'react-feather';
 import { twMerge } from 'tailwind-merge';
 
 type MultiSelectProps = {

client/src/components/ProfileDropdown.tsx

@@ -1,6 +1,6 @@
 import { Menu, Transition } from '@headlessui/react';
+import { ChevronRight, User } from 'lucide-react';
 import { Fragment } from 'react';
-import { ChevronRight, User } from 'react-feather';
 import { Link } from 'react-router-dom';
 import { twMerge } from 'tailwind-merge';
 

client/src/components/ResetButton.tsx

@@ -1,4 +1,4 @@
-import { RefreshCw } from 'react-feather';
+import { RefreshCw } from 'lucide-react';
 import { twMerge } from 'tailwind-merge';
 
 type ResetButtonProps = {

client/src/components/SearchBar.tsx

@@ -1,4 +1,4 @@
-import { Search } from 'react-feather';
+import { Search } from 'lucide-react';
 import { twMerge } from 'tailwind-merge';
 
 export const SearchBar = ({

client/src/pages/Instructor.tsx

@@ -1,6 +1,6 @@
 import _ from 'lodash';
+import { ExternalLink } from 'lucide-react';
 import { Fragment, useEffect, useState } from 'react';
-import { ExternalLink } from 'react-feather';
 import { Helmet } from 'react-helmet-async';
 import { Link, useParams } from 'react-router-dom';
 import { toast } from 'sonner';

client/src/pages/Profile.tsx

@@ -1,6 +1,6 @@
 import { Tab } from '@headlessui/react';
+import { User } from 'lucide-react';
 import { useEffect, useState } from 'react';
-import { User } from 'react-feather';
 import { Helmet } from 'react-helmet-async';
 import { LuFileText } from 'react-icons/lu';
 import { VscBell } from 'react-icons/vsc';

package.json

@@ -29,10 +29,10 @@
     "framer-motion": "^11.11.9",
     "immer": "^10.1.1",
     "lodash": "^4.17.21",
+    "lucide-react": "^0.471.0",
     "react": "^18.3.1",
     "react-dom": "^18.3.1",
     "react-error-boundary": "^4.0.13",
-    "react-feather": "^2.0.10",
     "react-helmet-async": "^2.0.5",
     "react-icons": "^4.12.0",
     "react-infinite-scroll-component": "^6.1.0",