feat: link implementation (#100)

* link implementation

* add docs for links

* use btn instead of badge

frontend/composables/utils.test.ts

@@ -0,0 +1,32 @@
+import { describe, expect, test } from "vitest";
+import { maybeUrl } from "./utils";
+
+describe("maybeURL works as expected", () => {
+  test("basic valid URL case", () => {
+    const result = maybeUrl("https://example.com");
+    expect(result.isUrl).toBe(true);
+    expect(result.url).toBe("https://example.com");
+    expect(result.text).toBe("Link");
+  });
+
+  test("special URL syntax", () => {
+    const result = maybeUrl("[My Text](http://example.com)");
+    expect(result.isUrl).toBe(true);
+    expect(result.url).toBe("http://example.com");
+    expect(result.text).toBe("My Text");
+  });
+
+  test("not a url", () => {
+    const result = maybeUrl("not a url");
+    expect(result.isUrl).toBe(false);
+    expect(result.url).toBe("");
+    expect(result.text).toBe("");
+  });
+
+  test("malformed special syntax", () => {
+    const result = maybeUrl("[My Text(http://example.com)");
+    expect(result.isUrl).toBe(false);
+    expect(result.url).toBe("");
+    expect(result.text).toBe("");
+  });
+});

frontend/composables/utils.ts

@@ -33,3 +33,35 @@ export function fmtCurrency(value: number | string, currency = "USD", locale = "
   });
   return formatter.format(value);
 }
+
+export type MaybeUrlResult = {
+  isUrl: boolean;
+  url: string;
+  text: string;
+};
+
+export function maybeUrl(str: string): MaybeUrlResult {
+  const result: MaybeUrlResult = {
+    isUrl: str.startsWith("http://") || str.startsWith("https://"),
+    url: "",
+    text: "",
+  };
+
+  if (!result.isUrl && !str.startsWith("[")) {
+    return result;
+  }
+
+  if (str.startsWith("[")) {
+    const match = str.match(/\[(.*)\]\((.*)\)/);
+    if (match && match.length === 3) {
+      result.isUrl = true;
+      result.text = match[1];
+      result.url = match[2];
+    }
+  } else {
+    result.url = str;
+    result.text = "Link";
+  }
+
+  return result;
+}