bug: url parser

fixes #564

packages/app/src/Element/ProxyImg.tsx

@@ -1,6 +1,7 @@
 import useImgProxy from "Hooks/useImgProxy";
 import { useEffect, useState } from "react";
 import { FormattedMessage } from "react-intl";
+import { getUrlHostname } from "Util";
 
 interface ProxyImgProps extends React.DetailedHTMLProps<React.ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement> {
   size?: number;
@@ -34,7 +35,7 @@ export const ProxyImg = (props: ProxyImgProps) => {
         <FormattedMessage
           defaultMessage="Failed to proxy image from {host}, click here to load directly"
           values={{
-            host: new URL(src ?? "").hostname,
+            host: getUrlHostname(src),
           }}
         />
       </div>

packages/app/src/Element/Text.tsx

@@ -166,7 +166,7 @@ export default function Text({ content, tags, creator, disableMedia, depth }: Te
             if (t) {
               return <ProxyImg src={t[2]} size={15} className="custom-emoji" />;
             } else {
-              return i;
+              return `:${i}:`;
             }
           });
         }

packages/app/src/Util.ts

@@ -497,6 +497,14 @@ export function getRelayName(url: string) {
   return parsedUrl.host + parsedUrl.search;
 }
 
+export function getUrlHostname(url?: string) {
+  try {
+    return new URL(url ?? "").hostname;
+  } catch {
+    return url?.match(/(\S+\.\S+)/i)?.[1] ?? url;
+  }
+}
+
 export interface NostrLink {
   type: NostrPrefix;
   id: string;