chore: update dependencies

package.json

@@ -18,13 +18,13 @@
   },
   "dependencies": {
     "@codemirror/commands": "6.1.2",
-    "@codemirror/lang-markdown": "6.0.4",
+    "@codemirror/lang-markdown": "6.0.5",
     "@codemirror/language": "6.3.0",
-    "@codemirror/state": "6.1.2",
-    "@codemirror/view": "6.4.0",
+    "@codemirror/state": "6.1.3",
+    "@codemirror/view": "6.4.2",
     "@crossbell/ipfs-gateway": "0.0.15",
     "@crossbell/ipfs-react": "0.0.15",
-    "@emoji-mart/data": "1.0.6",
+    "@emoji-mart/data": "1.0.7",
     "@emoji-mart/react": "1.0.1",
     "@floating-ui/react-dom-interactions": "0.10.3",
     "@headlessui/react": "1.7.4",
@@ -36,15 +36,15 @@
     "@tanstack/react-query": "4.14.5",
     "@tanstack/react-query-devtools": "4.14.5",
     "@tanstack/react-query-persist-client": "4.14.5",
-    "@uiw/codemirror-extensions-events": "4.12.4",
-    "@uiw/react-codemirror": "4.13.0",
+    "@uiw/codemirror-extensions-events": "4.13.2",
+    "@uiw/react-codemirror": "4.13.2",
     "@urql/core": "3.0.5",
     "axios": "1.1.3",
     "clsx": "1.2.1",
     "crossbell.js": "0.10.38",
     "dayjs": "1.11.6",
     "dotenv": "16.0.3",
-    "emoji-mart": "5.2.2",
+    "emoji-mart": "5.3.1",
     "ethers": "5.7.2",
     "fast-deep-equal": "3.1.3",
     "idb-keyval": "6.2.0",
@@ -60,7 +60,7 @@
     "prismjs": "1.29.0",
     "react": "18.2.0",
     "react-dom": "18.2.0",
-    "react-hook-form": "7.39.1",
+    "react-hook-form": "7.39.3",
     "react-hot-toast": "2.4.0",
     "react-infinite-scroller": "1.2.6",
     "react-scroll": "1.8.8",
@@ -82,13 +82,13 @@
     "remark-stringify": "10.0.2",
     "sharp": "0.31.2",
     "sortablejs": "1.15.0",
-    "unidata.js": "0.7.3",
+    "unidata.js": "0.7.4",
     "unified": "10.1.2",
     "unist-builder": "3.0.0",
     "unist-util-visit": "4.1.1",
     "use-onclickoutside": "0.4.1",
     "uuid": "9.0.0",
-    "wagmi": "0.7.10",
+    "wagmi": "0.8.1",
     "zustand": "4.1.4"
   },
   "devDependencies": {
@@ -113,22 +113,22 @@
     "@types/sortablejs": "1.15.0",
     "@types/ua-parser-js": "0.7.36",
     "@types/uuid": "8.3.4",
-    "@unocss/cli": "0.46.3",
-    "@unocss/preset-icons": "0.46.3",
+    "@unocss/cli": "0.46.4",
+    "@unocss/preset-icons": "0.46.4",
     "autoprefixer": "10.4.13",
     "cross-spawn": "7.0.3",
     "esbuild": "0.15.13",
-    "esbuild-register": "3.3.3",
+    "esbuild-register": "3.4.1",
     "eslint": "8.27.0",
     "eslint-config-next": "13.0.2",
-    "husky": "8.0.1",
+    "husky": "8.0.2",
     "lint-staged": "13.0.3",
     "postcss-import": "15.0.0",
     "prettier": "2.7.1",
-    "tailwindcss": "3.2.2",
+    "tailwindcss": "3.2.3",
     "typescript": "4.8.4",
     "unocss": "0.46.4",
-    "vitest": "0.25.0"
+    "vitest": "0.25.1"
   },
   "engines": {
     "node": ">=14"

src/components/common/CommentInput.tsx

@@ -10,8 +10,7 @@ import { useConnectModal } from "@rainbow-me/rainbowkit"
 import { useState, useEffect } from "react"
 import { useCommentPage } from "~/queries/page"
 import { useRouter } from "next/router"
-// @ts-ignore
-import Picker from "@emoji-mart/react"
+import { EmojiPicker } from "./EmojiPicker"
 import { Popover } from "@headlessui/react"
 import { FaceSmileIcon } from "@heroicons/react/24/outline"
 
@@ -99,13 +98,7 @@ export const CommentInput: React.FC<{
                   <FaceSmileIcon className="w-6 h-6 text-zinc-400 hover:text-zinc-500" />
                 </Popover.Button>
                 <Popover.Panel className="absolute left-0 top-full z-10">
-                  <Picker
-                    data={async () => {
-                      const response = await fetch(
-                        "https://cdn.jsdelivr.net/npm/@emoji-mart/data",
-                      )
-                      return response.json()
-                    }}
+                  <EmojiPicker
                     onEmojiSelect={(e: any) =>
                       form.setValue(
                         "content",

src/components/common/ConnectButton.tsx

@@ -56,7 +56,7 @@ export const ConnectButton: React.FC<{
   ]
 
   const { data: balance } = useBalance({
-    addressOrName: address,
+    address: address,
   })
 
   const [InsufficientBalance, setInsufficientBalance] = useState<boolean>(false)

src/components/common/EmojiPicker.tsx

@@ -0,0 +1,23 @@
+import { useEffect, useRef } from "react"
+
+export const EmojiPicker: React.FC<{
+  onEmojiSelect: (e: any) => void
+}> = ({ onEmojiSelect }) => {
+  const ref = useRef<any>()
+
+  useEffect(() => {
+    import("emoji-mart").then(async (EmojiMart) => {
+      const response = await fetch(
+        "https://cdn.jsdelivr.net/npm/@emoji-mart/data",
+      )
+      const data = await response.json()
+      new EmojiMart.Picker({
+        onEmojiSelect,
+        data,
+        ref,
+      })
+    })
+  }, [])
+
+  return <div ref={ref}></div>
+}

src/pages/dashboard/new-site.tsx

@@ -20,7 +20,7 @@ export default function NewSitePage() {
   const [addressIn, setAddressIn] = useState<string>("")
   const { address } = useAccount()
   const { data: balance } = useBalance({
-    addressOrName: address,
+    address: address,
   })
   const [balanceFormatted, setBalanceFormatted] = useState<string>("")