diff --git a/package.json b/package.json
index e9e96f80..0bb24ca7 100644
--- a/package.json
+++ b/package.json
@@ -19,7 +19,6 @@
"@radix-ui/react-collapsible": "^1.0.2",
"@radix-ui/react-dialog": "^1.0.3",
"@radix-ui/react-dropdown-menu": "^2.0.4",
- "@radix-ui/react-icons": "^1.3.0",
"@radix-ui/react-popover": "^1.0.5",
"@radix-ui/react-tabs": "^1.0.3",
"@radix-ui/react-tooltip": "^1.0.5",
@@ -30,6 +29,7 @@
"destr": "^1.2.2",
"emoji-mart": "^5.5.2",
"framer-motion": "^9.1.7",
+ "iconoir-react": "^6.6.0",
"jotai": "^2.0.3",
"next": "^13.3.0",
"nostr-relaypool": "^0.5.18",
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index d534a344..b6a19a4b 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -7,7 +7,6 @@ specifiers:
'@radix-ui/react-collapsible': ^1.0.2
'@radix-ui/react-dialog': ^1.0.3
'@radix-ui/react-dropdown-menu': ^2.0.4
- '@radix-ui/react-icons': ^1.3.0
'@radix-ui/react-popover': ^1.0.5
'@radix-ui/react-tabs': ^1.0.3
'@radix-ui/react-tooltip': ^1.0.5
@@ -34,6 +33,7 @@ specifiers:
eslint-plugin-react-hooks: ^4.6.0
framer-motion: ^9.1.7
husky: ^8.0.3
+ iconoir-react: ^6.6.0
jotai: ^2.0.3
lint-staged: ^13.2.0
next: ^13.3.0
@@ -61,7 +61,6 @@ dependencies:
'@radix-ui/react-collapsible': 1.0.2_biqbaboplfbrettd7655fr4n2y
'@radix-ui/react-dialog': 1.0.3_zn3vyfk3tbnwebg5ldvieekjaq
'@radix-ui/react-dropdown-menu': 2.0.4_zn3vyfk3tbnwebg5ldvieekjaq
- '@radix-ui/react-icons': 1.3.0_react@18.2.0
'@radix-ui/react-popover': 1.0.5_zn3vyfk3tbnwebg5ldvieekjaq
'@radix-ui/react-tabs': 1.0.3_biqbaboplfbrettd7655fr4n2y
'@radix-ui/react-tooltip': 1.0.5_zn3vyfk3tbnwebg5ldvieekjaq
@@ -72,6 +71,7 @@ dependencies:
destr: 1.2.2
emoji-mart: 5.5.2
framer-motion: 9.1.7_biqbaboplfbrettd7655fr4n2y
+ iconoir-react: 6.6.0_react@18.2.0
jotai: 2.0.3_react@18.2.0
next: 13.3.0_biqbaboplfbrettd7655fr4n2y
nostr-relaypool: 0.5.18_ws@8.13.0
@@ -755,15 +755,6 @@ packages:
react-dom: 18.2.0_react@18.2.0
dev: false
- /@radix-ui/react-icons/1.3.0_react@18.2.0:
- resolution:
- { integrity: sha512-jQxj/0LKgp+j9BiTXz3O3sgs26RNet2iLWmsPyRz2SIcR4q/4SbazXfnYwbAr+vLYKSfc7qxzyGQA1HLlYiuNw== }
- peerDependencies:
- react: ^16.x || ^17.x || ^18.x
- dependencies:
- react: 18.2.0
- dev: false
-
/@radix-ui/react-id/1.0.0_react@18.2.0:
resolution:
{ integrity: sha512-Q6iAB/U7Tq3NTolBBQbHTgclPmGWE3OlktGGqrClPozSw4vkQ1DfQAOtzgRPecKsMdJINE05iaoDUG8tRzCBjw== }
@@ -2971,6 +2962,15 @@ packages:
hasBin: true
dev: true
+ /iconoir-react/6.6.0_react@18.2.0:
+ resolution:
+ { integrity: sha512-7ueB0jQlSZFjEa4qUCaGbfWLRjGBtOc0E+RYHEb3Ek3zDwQuNh4VLtV9kwGoiATRfBYVv8bgCmXI0nr52TRXsw== }
+ peerDependencies:
+ react: ^16.8.6 || ^17 || ^18
+ dependencies:
+ react: 18.2.0
+ dev: false
+
/ignore/5.2.4:
resolution:
{ integrity: sha512-MAb38BcSbH0eHNBxn7ql2NH/kX33OkB3lZ1BNdh7ENeRChHTYsTvWrMubiIAMNS2llXEEgZ1MUOBtXChP3kaFQ== }
diff --git a/src/components/appHeader/actions.tsx b/src/components/appHeader/actions.tsx
index e370dfa9..aba61ff4 100644
--- a/src/components/appHeader/actions.tsx
+++ b/src/components/appHeader/actions.tsx
@@ -1,7 +1,7 @@
-import { ArrowLeftIcon, ArrowRightIcon, ReloadIcon } from '@radix-ui/react-icons';
import { platform } from '@tauri-apps/api/os';
+import { ArrowLeft, ArrowRight, Refresh } from 'iconoir-react';
import { useRouter } from 'next/router';
-import { useEffect, useState } from 'react';
+import { useLayoutEffect, useState } from 'react';
export default function AppActions() {
const router = useRouter();
@@ -19,7 +19,7 @@ export default function AppActions() {
router.reload();
};
- useEffect(() => {
+ useLayoutEffect(() => {
const getPlatform = async () => {
const result = await platform();
setOS(result);
@@ -34,19 +34,19 @@ export default function AppActions() {
onClick={() => goBack()}
className="group inline-flex h-6 w-6 items-center justify-center rounded-md hover:bg-zinc-900"
>
-
+
);
diff --git a/src/components/channels/channelList.tsx b/src/components/channels/channelList.tsx
index 626c729e..f9a0a78e 100644
--- a/src/components/channels/channelList.tsx
+++ b/src/components/channels/channelList.tsx
@@ -1,7 +1,7 @@
import { ChannelListItem } from '@components/channels/channelListItem';
import { CreateChannelModal } from '@components/channels/createChannelModal';
-import { GlobeIcon } from '@radix-ui/react-icons';
+import { Globe } from 'iconoir-react';
import Link from 'next/link';
import { useEffect, useState } from 'react';
@@ -26,7 +26,7 @@ export default function ChannelList() {
className="group inline-flex items-center gap-2 rounded-md px-2.5 py-1.5 hover:bg-zinc-950"
>
-
+
Browse channels
diff --git a/src/components/channels/createChannelModal.tsx b/src/components/channels/createChannelModal.tsx
index ab09699c..c225a787 100644
--- a/src/components/channels/createChannelModal.tsx
+++ b/src/components/channels/createChannelModal.tsx
@@ -3,8 +3,8 @@ import { RelayContext } from '@components/relaysProvider';
import { dateToUnix } from '@utils/getDate';
import * as Dialog from '@radix-ui/react-dialog';
-import { Cross1Icon, PlusIcon } from '@radix-ui/react-icons';
import useLocalStorage from '@rehooks/local-storage';
+import { Cancel, Plus } from 'iconoir-react';
import { getEventHash, signEvent } from 'nostr-tools';
import { useCallback, useContext, useState } from 'react';
import { useForm } from 'react-hook-form';
@@ -53,7 +53,7 @@ export const CreateChannelModal = () => {
Add a new channel
@@ -73,7 +73,7 @@ export const CreateChannelModal = () => {
autoFocus={false}
className="inline-flex h-5 w-5 items-center justify-center rounded hover:bg-zinc-900"
>
-
+
diff --git a/src/components/channels/messages/hideMessageButton.tsx b/src/components/channels/messages/hideMessageButton.tsx
index d6d4255c..4d8e233d 100644
--- a/src/components/channels/messages/hideMessageButton.tsx
+++ b/src/components/channels/messages/hideMessageButton.tsx
@@ -7,6 +7,7 @@ import HideIcon from '@assets/icons/hide';
import * as AlertDialog from '@radix-ui/react-alert-dialog';
import * as Tooltip from '@radix-ui/react-tooltip';
import useLocalStorage from '@rehooks/local-storage';
+import { EyeClose } from 'iconoir-react';
import { getEventHash, signEvent } from 'nostr-tools';
import { useCallback, useContext } from 'react';
@@ -36,7 +37,7 @@ export const HideMessageButton = ({ id }: { id: string }) => {
diff --git a/src/components/channels/messages/muteButton.tsx b/src/components/channels/messages/muteButton.tsx
index 07ea2a10..abc21a4b 100644
--- a/src/components/channels/messages/muteButton.tsx
+++ b/src/components/channels/messages/muteButton.tsx
@@ -2,11 +2,10 @@ import { RelayContext } from '@components/relaysProvider';
import { dateToUnix } from '@utils/getDate';
-import MuteIcon from '@assets/icons/mute';
-
import * as AlertDialog from '@radix-ui/react-alert-dialog';
import * as Tooltip from '@radix-ui/react-tooltip';
import useLocalStorage from '@rehooks/local-storage';
+import { MicMute } from 'iconoir-react';
import { getEventHash, signEvent } from 'nostr-tools';
import { useCallback, useContext } from 'react';
@@ -36,7 +35,7 @@ export const MuteButton = ({ pubkey }: { pubkey: string }) => {
diff --git a/src/components/channels/messages/replyButton.tsx b/src/components/channels/messages/replyButton.tsx
index 9ce76a7d..de589b37 100644
--- a/src/components/channels/messages/replyButton.tsx
+++ b/src/components/channels/messages/replyButton.tsx
@@ -1,8 +1,7 @@
import { channelReplyAtom } from '@stores/channel';
-import ReplyIcon from '@assets/icons/reply';
-
import * as Tooltip from '@radix-ui/react-tooltip';
+import { Reply } from 'iconoir-react';
import { useSetAtom } from 'jotai';
export const ReplyButton = ({ id, pubkey, content }: { id: string; pubkey: string; content: string }) => {
@@ -20,7 +19,7 @@ export const ReplyButton = ({ id, pubkey, content }: { id: string; pubkey: strin
onClick={() => createReply()}
className="inline-flex h-6 w-6 items-center justify-center rounded hover:bg-zinc-800"
>
-
+
diff --git a/src/components/chats/chatModal.tsx b/src/components/chats/chatModal.tsx
index ae6b88b3..fa89345a 100644
--- a/src/components/chats/chatModal.tsx
+++ b/src/components/chats/chatModal.tsx
@@ -1,8 +1,8 @@
import { ChatModalUser } from '@components/chats/chatModalUser';
import * as Dialog from '@radix-ui/react-dialog';
-import { Cross1Icon, PlusIcon } from '@radix-ui/react-icons';
import useLocalStorage from '@rehooks/local-storage';
+import { Cancel, Plus } from 'iconoir-react';
import { useCallback, useEffect, useState } from 'react';
export const ChatModal = () => {
@@ -25,7 +25,7 @@ export const ChatModal = () => {
Add a new chat
@@ -44,7 +44,7 @@ export const ChatModal = () => {
autoFocus={false}
className="inline-flex h-5 w-5 items-center justify-center rounded bg-zinc-900"
>
-
+
New chat
diff --git a/src/components/form/channelMessage.tsx b/src/components/form/channelMessage.tsx
index dd4db315..2467bc80 100644
--- a/src/components/form/channelMessage.tsx
+++ b/src/components/form/channelMessage.tsx
@@ -6,8 +6,8 @@ import { channelReplyAtom } from '@stores/channel';
import { dateToUnix } from '@utils/getDate';
-import { Cross1Icon } from '@radix-ui/react-icons';
import useLocalStorage from '@rehooks/local-storage';
+import { Cancel } from 'iconoir-react';
import { useAtomValue } from 'jotai';
import { useResetAtom } from 'jotai/utils';
import { getEventHash, signEvent } from 'nostr-tools';
@@ -93,7 +93,7 @@ export default function FormChannelMessage({ eventId }: { eventId: string | stri
onClick={() => stopReply()}
className="inline-flex h-5 w-5 items-center justify-center rounded hover:bg-zinc-800"
>
-
+
diff --git a/src/components/form/emojiPicker.tsx b/src/components/form/emojiPicker.tsx
index 7b57fa67..e48802cc 100644
--- a/src/components/form/emojiPicker.tsx
+++ b/src/components/form/emojiPicker.tsx
@@ -1,10 +1,9 @@
import { noteContentAtom } from '@stores/note';
-import EmojiIcon from '@assets/icons/emoji';
-
import data from '@emoji-mart/data';
import Picker from '@emoji-mart/react';
import * as Popover from '@radix-ui/react-popover';
+import { Emoji } from 'iconoir-react';
import { useAtom } from 'jotai';
export default function EmojiPicker() {
@@ -14,12 +13,12 @@ export default function EmojiPicker() {
diff --git a/src/components/multiAccounts/activeAccount.tsx b/src/components/multiAccounts/activeAccount.tsx
index a6c01475..a27cf54a 100644
--- a/src/components/multiAccounts/activeAccount.tsx
+++ b/src/components/multiAccounts/activeAccount.tsx
@@ -1,8 +1,8 @@
import { DEFAULT_AVATAR } from '@stores/constants';
import * as DropdownMenu from '@radix-ui/react-dropdown-menu';
-import { AvatarIcon, ExitIcon, GearIcon } from '@radix-ui/react-icons';
import { writeText } from '@tauri-apps/api/clipboard';
+import { LogOut, ProfileCircle, Settings } from 'iconoir-react';
import Image from 'next/image';
import { useRouter } from 'next/router';
import { nip19 } from 'nostr-tools';
@@ -44,7 +44,7 @@ export const ActiveAccount = ({ user }: { user: any }) => {
className="group relative flex h-7 select-none items-center rounded-sm px-1 pl-7 text-sm leading-none text-zinc-400 outline-none data-[disabled]:pointer-events-none data-[highlighted]:bg-zinc-800 data-[highlighted]:text-fuchsia-500"
>
Open profile
@@ -60,13 +60,13 @@ export const ActiveAccount = ({ user }: { user: any }) => {
-
+
Settings
-
+
Logout
diff --git a/src/components/multiAccounts/index.tsx b/src/components/multiAccounts/index.tsx
index f5b31f3e..aedc288d 100644
--- a/src/components/multiAccounts/index.tsx
+++ b/src/components/multiAccounts/index.tsx
@@ -5,8 +5,8 @@ import { APP_VERSION } from '@stores/constants';
import LumeSymbol from '@assets/icons/Lume';
-import { PlusIcon } from '@radix-ui/react-icons';
import useLocalStorage from '@rehooks/local-storage';
+import { Plus } from 'iconoir-react';
import Link from 'next/link';
import { useCallback, useEffect, useState } from 'react';
@@ -50,7 +50,7 @@ export default function MultiAccounts() {
href="/onboarding"
className="group relative flex h-11 w-11 shrink cursor-pointer items-center justify-center rounded-lg border-2 border-dashed border-zinc-600 hover:border-zinc-400"
>
-
+
diff --git a/src/components/navigation/channels.tsx b/src/components/navigation/channels.tsx
index e5a205f9..952c0cb5 100644
--- a/src/components/navigation/channels.tsx
+++ b/src/components/navigation/channels.tsx
@@ -1,7 +1,7 @@
import ChannelList from '@components/channels/channelList';
import * as Collapsible from '@radix-ui/react-collapsible';
-import { TriangleUpIcon } from '@radix-ui/react-icons';
+import { NavArrowUp } from 'iconoir-react';
import { useState } from 'react';
export default function Channels() {
@@ -16,7 +16,7 @@ export default function Channels() {
open ? 'rotate-180' : ''
}`}
>
-
+
Channels
diff --git a/src/components/navigation/chats.tsx b/src/components/navigation/chats.tsx
index 27270179..ae882c87 100644
--- a/src/components/navigation/chats.tsx
+++ b/src/components/navigation/chats.tsx
@@ -1,7 +1,7 @@
import ChatList from '@components/chats/chatList';
import * as Collapsible from '@radix-ui/react-collapsible';
-import { TriangleUpIcon } from '@radix-ui/react-icons';
+import { NavArrowUp } from 'iconoir-react';
import { useState } from 'react';
export default function Chats() {
@@ -16,7 +16,7 @@ export default function Chats() {
open ? 'rotate-180' : ''
}`}
>
-
+
Chats
diff --git a/src/components/navigation/newsfeed.tsx b/src/components/navigation/newsfeed.tsx
index c1d0f813..15d0bfea 100644
--- a/src/components/navigation/newsfeed.tsx
+++ b/src/components/navigation/newsfeed.tsx
@@ -1,7 +1,7 @@
import ActiveLink from '@components/activeLink';
import * as Collapsible from '@radix-ui/react-collapsible';
-import { TriangleUpIcon } from '@radix-ui/react-icons';
+import { NavArrowUp } from 'iconoir-react';
import { useState } from 'react';
export default function Newsfeed() {
@@ -16,7 +16,7 @@ export default function Newsfeed() {
open ? 'rotate-180' : ''
}`}
>
-
+
Newsfeed
diff --git a/src/components/note/meta/comment.tsx b/src/components/note/meta/comment.tsx
index 3817e44b..4b28ce31 100644
--- a/src/components/note/meta/comment.tsx
+++ b/src/components/note/meta/comment.tsx
@@ -4,11 +4,9 @@ import { UserExtend } from '@components/user/extend';
import { dateToUnix } from '@utils/getDate';
-import CommentIcon from '@assets/icons/comment';
-
import * as Dialog from '@radix-ui/react-dialog';
-import { SizeIcon } from '@radix-ui/react-icons';
import useLocalStorage from '@rehooks/local-storage';
+import { MultiBubble, OpenNewWindow } from 'iconoir-react';
import { useRouter } from 'next/router';
import { getEventHash, signEvent } from 'nostr-tools';
import { memo, useContext, useState } from 'react';
@@ -59,7 +57,7 @@ export const NoteComment = memo(function NoteComment({
@@ -111,7 +109,7 @@ export const NoteComment = memo(function NoteComment({
onClick={() => openThread()}
className="inline-flex h-6 w-6 cursor-pointer items-center justify-center rounded-md hover:bg-zinc-700"
>
-
+
diff --git a/src/components/note/meta/reaction.tsx b/src/components/note/meta/reaction.tsx
index 386a2895..6e2d765c 100644
--- a/src/components/note/meta/reaction.tsx
+++ b/src/components/note/meta/reaction.tsx
@@ -2,10 +2,8 @@ import { RelayContext } from '@components/relaysProvider';
import { dateToUnix } from '@utils/getDate';
-import LikeIcon from '@assets/icons/like';
-import LikedIcon from '@assets/icons/liked';
-
import useLocalStorage from '@rehooks/local-storage';
+import { Heart } from 'iconoir-react';
import { getEventHash, signEvent } from 'nostr-tools';
import { memo, useContext, useEffect, useState } from 'react';
@@ -54,7 +52,11 @@ export const NoteReaction = memo(function NoteReaction({
return (
diff --git a/src/components/user/extend.tsx b/src/components/user/extend.tsx
index 2ba60143..b0dc7f86 100644
--- a/src/components/user/extend.tsx
+++ b/src/components/user/extend.tsx
@@ -5,9 +5,9 @@ import { DEFAULT_AVATAR } from '@stores/constants';
import { useMetadata } from '@utils/metadata';
import { truncate } from '@utils/truncate';
-import { DotsHorizontalIcon } from '@radix-ui/react-icons';
import dayjs from 'dayjs';
import relativeTime from 'dayjs/plugin/relativeTime';
+import { MoreHoriz } from 'iconoir-react';
dayjs.extend(relativeTime);
@@ -35,7 +35,7 @@ export const UserExtend = ({ pubkey, time }: { pubkey: string; time: number }) =
diff --git a/src/components/user/large.tsx b/src/components/user/large.tsx
index 9986f1bc..3957cfa4 100644
--- a/src/components/user/large.tsx
+++ b/src/components/user/large.tsx
@@ -5,9 +5,9 @@ import { DEFAULT_AVATAR } from '@stores/constants';
import { useMetadata } from '@utils/metadata';
import { truncate } from '@utils/truncate';
-import { DotsHorizontalIcon } from '@radix-ui/react-icons';
import dayjs from 'dayjs';
import relativeTime from 'dayjs/plugin/relativeTime';
+import { MoreHoriz } from 'iconoir-react';
dayjs.extend(relativeTime);
@@ -36,7 +36,7 @@ export const UserLarge = ({ pubkey, time }: { pubkey: string; time: number }) =>
diff --git a/src/pages/newsfeed/following.tsx b/src/pages/newsfeed/following.tsx
index 9f037375..33ac6e98 100644
--- a/src/pages/newsfeed/following.tsx
+++ b/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"
>
-
+
Load latest
diff --git a/src/pages/onboarding/create/index.tsx b/src/pages/onboarding/create/index.tsx
index b445e068..5af39281 100644
--- a/src/pages/onboarding/create/index.tsx
+++ b/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"
>
-
+
@@ -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' ? (
-
+
) : (
-
+
)}
diff --git a/src/pages/onboarding/create/step-2.tsx b/src/pages/onboarding/create/step-2.tsx
index 9b5c7780..8f67f52e 100644
--- a/src/pages/onboarding/create/step-2.tsx
+++ b/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() {
{follows.includes(item.pubkey) && (
-
+
)}
diff --git a/src/pages/onboarding/index.tsx b/src/pages/onboarding/index.tsx
index 4843985d..b0c19b31 100644
--- a/src/pages/onboarding/index.tsx
+++ b/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
-
+
goBack()}
className="group inline-flex h-6 w-6 items-center justify-center rounded-md hover:bg-zinc-900"
>
-
+
@@ -80,7 +80,7 @@ export default function Page() {
{/* #TODO: add function */}