update dependencies

src/shared/avatarUploader.tsx

@@ -1,5 +1,6 @@
 import { message, open } from '@tauri-apps/plugin-dialog';
 import { readBinaryFile } from '@tauri-apps/plugin-fs';
+import { fetch } from '@tauri-apps/plugin-http';
 import { Dispatch, SetStateAction, useState } from 'react';
 
 import { LoaderIcon, PlusIcon } from '@shared/icons';

src/shared/bannerUploader.tsx

@@ -1,5 +1,6 @@
 import { message, open } from '@tauri-apps/plugin-dialog';
 import { readBinaryFile } from '@tauri-apps/plugin-fs';
+import { fetch } from '@tauri-apps/plugin-http';
 import { Dispatch, SetStateAction, useState } from 'react';
 
 import { LoaderIcon, PlusIcon } from '@shared/icons';

src/shared/notes/actions/zap.tsx

@@ -1,7 +1,7 @@
 import { webln } from '@getalby/sdk';
 import { SendPaymentResponse } from '@getalby/sdk/dist/types';
 import * as Dialog from '@radix-ui/react-dialog';
-import { invoke } from '@tauri-apps/api';
+import { invoke } from '@tauri-apps/api/primitives';
 import { message } from '@tauri-apps/plugin-dialog';
 import { QRCodeSVG } from 'qrcode.react';
 import { useEffect, useRef, useState } from 'react';

src/shared/notes/kinds/articleDetail.tsx

@@ -1,6 +1,7 @@
 import { NDKEvent } from '@nostr-dev-kit/ndk';
 import ReactMarkdown from 'react-markdown';
 import { Link } from 'react-router-dom';
+import rehypeExternalLinks from 'rehype-external-links';
 import remarkGfm from 'remark-gfm';
 
 import { Boost, Hashtag, Invoice, MentionUser } from '@shared/notes';
@@ -32,6 +33,7 @@ export function ArticleDetailNote({ event }: { event: NDKEvent }) {
     <ReactMarkdown
       className="break-p prose prose-neutral max-w-none select-text whitespace-pre-line leading-normal dark:prose-invert prose-headings:mb-1 prose-headings:mt-3 prose-p:mb-0 prose-p:mt-0 prose-p:last:mb-1 prose-a:font-normal prose-a:text-blue-500 prose-blockquote:mb-1 prose-blockquote:mt-1 prose-blockquote:border-l-[2px] prose-blockquote:border-blue-500 prose-blockquote:pl-2 prose-pre:whitespace-pre-wrap prose-pre:bg-white/10 prose-ol:m-0 prose-ol:mb-1 prose-ul:mb-1 prose-ul:mt-1 prose-img:mb-2 prose-img:mt-3 prose-hr:mx-0 prose-hr:my-2 hover:prose-a:text-blue-500"
       remarkPlugins={[remarkGfm]}
+      rehypePlugins={[rehypeExternalLinks({ target: '_blank' })]}
       components={{
         a: ({ href }) => {
           const cleanURL = new URL(href);
@@ -59,7 +61,6 @@ export function ArticleDetailNote({ event }: { event: NDKEvent }) {
           }
         },
       }}
-      linkTarget={'_blank'}
     >
       {event.content}
     </ReactMarkdown>

src/shared/notes/kinds/text.tsx

@@ -1,6 +1,7 @@
 import { memo } from 'react';
 import ReactMarkdown from 'react-markdown';
 import { Link } from 'react-router-dom';
+import rehypeExternalLinks from 'rehype-external-links';
 import remarkGfm from 'remark-gfm';
 
 import {
@@ -25,9 +26,9 @@ export function TextNote(props: { content?: string }) {
         <ReactMarkdown
           className="break-p prose prose-neutral max-w-none select-text whitespace-pre-line leading-normal dark:prose-invert prose-headings:mb-1 prose-headings:mt-3 prose-p:mb-0 prose-p:mt-0 prose-p:last:mb-1 prose-a:font-normal prose-a:text-blue-500 prose-blockquote:mb-1 prose-blockquote:mt-1 prose-blockquote:border-l-[2px] prose-blockquote:border-blue-500 prose-blockquote:pl-2 prose-pre:whitespace-pre-wrap prose-pre:bg-white/10 prose-ol:m-0 prose-ol:mb-1 prose-ul:mb-1 prose-ul:mt-1 prose-img:mb-2 prose-img:mt-3 prose-hr:mx-0 prose-hr:my-2 hover:prose-a:text-blue-500"
           remarkPlugins={[remarkGfm]}
+          rehypePlugins={[rehypeExternalLinks({ target: '_blank' })]}
           disallowedElements={['h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'pre', 'code']}
           unwrapDisallowed={true}
-          linkTarget={'_blank'}
         >
           {props.content}
         </ReactMarkdown>
@@ -40,6 +41,7 @@ export function TextNote(props: { content?: string }) {
       <ReactMarkdown
         className="break-p prose prose-neutral max-w-none select-text whitespace-pre-line leading-normal dark:prose-invert prose-headings:mb-1 prose-headings:mt-3 prose-p:mb-0 prose-p:mt-0 prose-p:last:mb-1 prose-a:font-normal prose-a:text-blue-500 prose-blockquote:mb-1 prose-blockquote:mt-1 prose-blockquote:border-l-[2px] prose-blockquote:border-blue-500 prose-blockquote:pl-2 prose-pre:whitespace-pre-wrap prose-pre:bg-white/10 prose-ol:m-0 prose-ol:mb-1 prose-ul:mb-1 prose-ul:mt-1 prose-img:mb-2 prose-img:mt-3 prose-hr:mx-0 prose-hr:my-2 hover:prose-a:text-blue-500"
         remarkPlugins={[remarkGfm]}
+        rehypePlugins={[rehypeExternalLinks({ target: '_blank' })]}
         components={{
           a: ({ href }) => {
             const cleanURL = new URL(href);
@@ -69,7 +71,6 @@ export function TextNote(props: { content?: string }) {
         }}
         disallowedElements={['h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'pre', 'code']}
         unwrapDisallowed={true}
-        linkTarget={'_blank'}
       >
         {richContent.parsed}
       </ReactMarkdown>

src/shared/user.tsx

@@ -4,6 +4,7 @@ import { minidenticon } from 'minidenticons';
 import { memo } from 'react';
 import ReactMarkdown from 'react-markdown';
 import { Link } from 'react-router-dom';
+import rehypeExternalLinks from 'rehype-external-links';
 import remarkGfm from 'remark-gfm';
 
 import { RepostIcon, WorldIcon } from '@shared/icons';
@@ -168,10 +169,10 @@ export const User = memo(function User({
             </p>
             <ReactMarkdown
               remarkPlugins={[remarkGfm]}
+              rehypePlugins={[rehypeExternalLinks({ target: '_blank' })]}
               className="markdown-simple line-clamp-6 whitespace-pre-line break-all"
               disallowedElements={['h1', 'h2', 'h3', 'h4', 'h5', 'h6']}
               unwrapDisallowed={true}
-              linkTarget={'_blank'}
             >
               {user?.about || user?.bio || 'No bio'}
             </ReactMarkdown>