From 8ef1c76ae113cfab4e9ca7d23dd8c867b71d9e4d Mon Sep 17 00:00:00 2001
From: Joshua <git@lio.cat>
Date: Mon, 20 Feb 2023 00:48:38 +0100
Subject: [PATCH] this is ugly  but it works

---
 src/components/Image.tsx | 41 +++++++++++++++++++++++++++++++++-------
 1 file changed, 34 insertions(+), 7 deletions(-)

diff --git a/src/components/Image.tsx b/src/components/Image.tsx
index 9fe67a9..95c6499 100644
--- a/src/components/Image.tsx
+++ b/src/components/Image.tsx
@@ -1,13 +1,40 @@
+import ImageStyle from "@/styles/Image.module.sass"
+import Link from "./Link";
 
 
+// const regex = /@(?<username>\w*)@(?<site>\w*\S*)/gm;
+
 const Image = ({ src, alt }: { src: string, alt: string }) => {
-    return (
-        <figure>
-            <img style={{
-                borderRadius: "10px",
-            }} src={src} alt={alt} />
-        </figure>
-    );
+    const regex = /@(?<username>\w+)@(?<site>\w{2,}\.[a-z]{2,10})/gm;
+    if (alt.match(regex)) {
+        const newAlt = alt.replace("art by", "")
+        const sub = "https://$<site>/@$<username>";
+        const link = newAlt.replace(regex, sub);
+        return (
+            <figure>
+                <img style={{
+                    borderRadius: "10px",
+                }} src={src} alt={alt} />
+                <span className={ImageStyle.alt} > art by <Link
+                    href={link}
+                    title={newAlt.replace(regex, link).replace('https://', "")}
+                /></span>
+            </figure>
+        )
+    }
+
+    else {
+
+        return (
+            <figure>
+                <img style={{
+                    borderRadius: "10px",
+                }} src={src} alt={alt} />
+                <span className={ImageStyle.alt}>{alt}</span>
+
+            </figure>
+        );
+    }
 };
 
 export default Image; 
\ No newline at end of file