From 2270e6186566c7f1fbbb167fd1e1b4cb8282e934 Mon Sep 17 00:00:00 2001
From: Sebastian Martinez <me@sebastinez.dev>
Date: Mon, 28 Apr 2025 09:21:14 +0200
Subject: [PATCH] Allow `radicle-external-link` components in commit
 descriptions

To allow some very basic hyperlinking in commit descriptions we can
replace fully specified urls with a valid scheme into
`radicle-external-link` components.
---
 src/lib/markdown.ts           |  1 +
 src/views/repos/Commit.svelte | 14 +++++++++++++-
 2 files changed, 14 insertions(+), 1 deletion(-)

diff --git a/src/lib/markdown.ts b/src/lib/markdown.ts
index f89846678..772337b1f 100644
--- a/src/lib/markdown.ts
+++ b/src/lib/markdown.ts
@@ -50,6 +50,7 @@ dompurify.setConfig({
     "ol",
     "p",
     "pre",
+    "radicle-external-link",
     "table",
     "tbody",
     "td",
diff --git a/src/views/repos/Commit.svelte b/src/views/repos/Commit.svelte
index 30449090f..df243566c 100644
--- a/src/views/repos/Commit.svelte
+++ b/src/views/repos/Commit.svelte
@@ -1,6 +1,8 @@
 <script lang="ts">
   import type { BaseUrl, Commit, Repo, SeedingPolicy } from "@http-client";
 
+  import dompurify from "dompurify";
+  import escape from "lodash/escape";
   import { baseUrlToString, formatObjectId } from "@app/lib/utils";
 
   import Button from "@app/components/Button.svelte";
@@ -32,6 +34,14 @@
   });
 
   $: header = commit.commit;
+
+  function convertUrlsToExternalLinks(text: string): string {
+    const urlRegex = /(https?:\/\/[^\s]+)/g;
+    return text.replace(
+      urlRegex,
+      '<radicle-external-link href="$1">$1</radicle-external-link>',
+    );
+  }
 </script>
 
 <style>
@@ -115,7 +125,9 @@
         </CommitAuthorship>
       </div>
       {#if header.description}
-        <pre class="description txt-small">{header.description}</pre>
+        <pre class="description txt-small">{@html dompurify.sanitize(
+            convertUrlsToExternalLinks(escape(header.description)),
+          )}</pre>
       {/if}
     </div>
     <Changeset