converted all icons to iconoir

src/pages/newsfeed/following.tsx

@@ -10,7 +10,7 @@ import { hasNewerNoteAtom } from '@stores/note';
 import { dateToUnix } from '@utils/getDate';
 import { filterDuplicateParentID } from '@utils/transform';
 
-import { ArrowUpIcon } from '@radix-ui/react-icons';
+import { ArrowUp } from 'iconoir-react';
 import { useAtom } from 'jotai';
 import {
   JSXElementConstructor,
@@ -97,7 +97,7 @@ export default function Page() {
             onClick={() => loadLatest()}
             className="inline-flex h-8 transform items-center justify-center gap-1 rounded-full bg-fuchsia-500 pl-3 pr-3.5 text-sm shadow-md shadow-fuchsia-800/20 active:translate-y-1"
           >
-            <ArrowUpIcon className="h-3.5 w-3.5" />
+            <ArrowUp width={14} height={14} />
             Load latest
           </button>
         </div>

src/pages/onboarding/create/index.tsx

@@ -2,7 +2,7 @@ import BaseLayout from '@layouts/base';
 
 import { RelayContext } from '@components/relaysProvider';
 
-import { ArrowLeftIcon, EyeClosedIcon, EyeOpenIcon } from '@radix-ui/react-icons';
+import { ArrowLeft, EyeClose, EyeEmpty } from 'iconoir-react';
 import Image from 'next/image';
 import { useRouter } from 'next/router';
 import { generatePrivateKey, getEventHash, getPublicKey, nip19, signEvent } from 'nostr-tools';
@@ -95,7 +95,7 @@ export default function Page() {
           onClick={() => goBack()}
           className="group inline-flex h-6 w-6 items-center justify-center rounded-md hover:bg-zinc-900"
         >
-          <ArrowLeftIcon className="h-4 w-4 text-zinc-500 group-hover:text-zinc-300" />
+          <ArrowLeft width={16} height={16} className="text-zinc-500 group-hover:text-zinc-300" />
         </button>
         <div>
           <h1 className="bg-gradient-to-br from-zinc-200 to-zinc-400 bg-clip-text text-3xl font-medium text-transparent">
@@ -131,9 +131,9 @@ export default function Page() {
                   className="group absolute right-2 top-1/2 -translate-y-1/2 transform rounded p-1 hover:bg-zinc-700"
                 >
                   {type === 'password' ? (
-                    <EyeClosedIcon className="h-5 w-5 text-zinc-500 group-hover:text-zinc-200" />
+                    <EyeClose width={20} height={20} className="text-zinc-500 group-hover:text-zinc-200" />
                   ) : (
-                    <EyeOpenIcon className="h-5 w-5 text-zinc-500 group-hover:text-zinc-200" />
+                    <EyeEmpty width={20} height={20} className="text-zinc-500 group-hover:text-zinc-200" />
                   )}
                 </button>
               </div>

src/pages/onboarding/create/step-2.tsx

@@ -6,8 +6,8 @@ import { UserBase } from '@components/user/base';
 import { fetchMetadata } from '@utils/metadata';
 import { followsTag } from '@utils/transform';
 
-import { CheckCircledIcon } from '@radix-ui/react-icons';
 import { createClient } from '@supabase/supabase-js';
+import { CheckCircle } from 'iconoir-react';
 import { useRouter } from 'next/router';
 import { getEventHash, signEvent } from 'nostr-tools';
 import {
@@ -146,7 +146,7 @@ export default function Page() {
               <UserBase pubkey={item.pubkey} />
               {follows.includes(item.pubkey) && (
                 <div>
-                  <CheckCircledIcon className="h-4 w-4 text-green-400" />
+                  <CheckCircle width={16} height={16} className="text-zinc-400" />
                 </div>
               )}
             </button>

src/pages/onboarding/index.tsx

@@ -1,6 +1,6 @@
 import BaseLayout from '@layouts/base';
 
-import { ArrowRightIcon } from '@radix-ui/react-icons';
+import { ArrowRight } from 'iconoir-react';
 import Image from 'next/image';
 import Link from 'next/link';
 import { JSXElementConstructor, ReactElement, ReactFragment, ReactPortal } from 'react';
@@ -115,7 +115,7 @@ export default function Page() {
             className="relative inline-flex h-14 w-64 items-center justify-center gap-2 rounded-full bg-zinc-900 px-6 text-lg font-medium ring-1 ring-zinc-800 hover:bg-zinc-800"
           >
             Create new key
-            <ArrowRightIcon className="h-5 w-5" />
+            <ArrowRight width={20} height={20} />
           </Link>
           <Link
             href="/onboarding/login"

src/pages/onboarding/login/index.tsx

@@ -1,6 +1,6 @@
 import BaseLayout from '@layouts/base';
 
-import { ArrowLeftIcon, LightningBoltIcon } from '@radix-ui/react-icons';
+import { ArrowLeft, CableTag } from 'iconoir-react';
 import { useRouter } from 'next/router';
 import { nip19 } from 'nostr-tools';
 import { JSXElementConstructor, ReactElement, ReactFragment, ReactPortal } from 'react';
@@ -64,7 +64,7 @@ export default function Page() {
           onClick={() => goBack()}
           className="group inline-flex h-6 w-6 items-center justify-center rounded-md hover:bg-zinc-900"
         >
-          <ArrowLeftIcon className="h-4 w-4 text-zinc-500 group-hover:text-zinc-300" />
+          <ArrowLeft width={16} height={16} className="text-zinc-500 group-hover:text-zinc-300" />
         </button>
         <div>
           <h1 className="bg-gradient-to-br from-zinc-200 via-white to-zinc-300 bg-clip-text text-3xl font-semibold text-transparent">
@@ -80,7 +80,7 @@ export default function Page() {
               {/* #TODO: add function */}
               <button className="inline-flex w-full transform items-center justify-center gap-1.5 rounded-lg bg-zinc-700 px-3.5 py-2.5 font-medium text-zinc-200 shadow-input ring-1 ring-zinc-600 active:translate-y-1">
                 {/* #TODO: change to nostr connect logo */}
-                <LightningBoltIcon className="h-5 w-5 text-fuchsia-500" />
+                <CableTag width={20} height={20} className="text-fuchsia-500" />
                 <span>Continue with Nostr Connect</span>
               </button>
             </div>