refactor: migrate from lucide-react to heroicons

Vagabonds-Labs · Nov 11, 2024 · 4117178 · 4117178
1 parent 717a54a
commit 4117178
Show file tree

Hide file tree

Showing 5 changed files with 9 additions and 9 deletions.
diff --git a/apps/web/package.json b/apps/web/package.json
@@ -4,7 +4,8 @@
 	"private": true,
 	"type": "module",
 	"prisma": {
-		"seed": "node prisma/seed.js"
+		"schema": "apps/web/prisma/schema.prisma",
+		"seed": "node apps/web/prisma/seed.js"
 	},
 	"scripts": {
 		"build": "next build",
@@ -34,7 +35,6 @@
 		"geist": "^1.3.0",
 		"get-starknet-core": "^3.3.3",
 		"i18next": "^23.15.1",
-		"lucide-react": "^0.454.0",
 		"next": "^14.2.4",
 		"next-auth": "^4.24.7",
 		"react": "^18.3.1",

diff --git a/apps/web/src/app/_components/features/FilterModal.tsx b/apps/web/src/app/_components/features/FilterModal.tsx
@@ -1,6 +1,6 @@
+import { XMarkIcon } from "@heroicons/react/24/outline";
 import { motion } from "framer-motion";
 import { useAtom } from "jotai";
-import { X } from "lucide-react";
 import { useState } from "react";
 import {
 	isLoadingAtom,
@@ -95,7 +95,7 @@ export default function FilterModal({ isOpen, onClose }: FilterModalProps) {
 						)}
 					</div>
 					<button onClick={onClose} className="p-1" type="button">
-						<X size={24} />
+						<XMarkIcon className="h-6 w-6" />
 					</button>
 				</div>
 

diff --git a/apps/web/src/app/_components/features/SearchBar.tsx b/apps/web/src/app/_components/features/SearchBar.tsx
@@ -1,7 +1,7 @@
+import { FunnelIcon } from "@heroicons/react/24/outline";
 import { zodResolver } from "@hookform/resolvers/zod";
 import InputField from "@repo/ui/form/inputField";
 import { useAtom } from "jotai";
-import { Filter } from "lucide-react";
 import React, { useEffect, useState } from "react";
 import { useForm } from "react-hook-form";
 import { z } from "zod";
@@ -71,7 +71,7 @@ export default function SearchBar() {
 					onClick={() => setIsFilterOpen(true)}
 					className="bg-surface-secondary-default p-3.5 rounded-lg"
 				>
-					<Filter size={24} />
+					<FunnelIcon className="h-6 w-6" />
 				</button>
 			</div>
 			<FilterModal

diff --git a/bun.lockb b/bun.lockb
diff --git a/packages/ui/src/form/inputField.tsx b/packages/ui/src/form/inputField.tsx
@@ -1,5 +1,5 @@
+import { MagnifyingGlassIcon } from "@heroicons/react/24/outline";
 import cs from "classnames";
-import { Search } from "lucide-react";
 import { useController } from "react-hook-form";
 import type { Control, FieldPath, FieldValues } from "react-hook-form";
 
@@ -61,15 +61,15 @@ function InputField<T extends FieldValues>({
 			<div className={cs("relative", inputClassName)}>
 				{showSearchIcon && (
 					<div className="absolute left-3 top-1/2 transform -translate-y-1/2 text-gray-400">
-						<Search size={20} />
+						<MagnifyingGlassIcon className="h-5 w-5" />
 					</div>
 				)}
 				<input
 					{...field}
 					id={name}
 					type="text"
 					className={cs(
-						"w-full rounded-lg border text-base font-normal font-['Inter'] leading-normal focus:outline-none focus:ring-2 focus:ring-[#ffc222] focus:border-transparent",
+						"w-full px-4 py-[13px] bg-white rounded-lg border text-base font-normal font-['Inter'] leading-normal focus:outline-none focus:ring-2 focus:ring-[#ffc222] focus:border-transparent",
 						{
 							"pl-10 pr-4": showSearchIcon,
 							"px-4": !showSearchIcon,