From 966f5d8450da01da7e5e7ac0961e92014cde4623 Mon Sep 17 00:00:00 2001
From: Brieuc Dubois <git@bhasher.com>
Date: Tue, 10 Sep 2024 21:39:05 +0300
Subject: [PATCH] Implement link URLs/mails/... in chat #67

---
 frontend/package-lock.json                    | 35 ++++++++++++++-----
 frontend/package.json                         |  2 ++
 .../lib/components/sessions/message.svelte    |  4 ++-
 .../lib/components/sessions/writebox.svelte   |  4 +--
 4 files changed, 33 insertions(+), 12 deletions(-)

diff --git a/frontend/package-lock.json b/frontend/package-lock.json
index b0f32bab..908ce7dc 100644
--- a/frontend/package-lock.json
+++ b/frontend/package-lock.json
@@ -9,6 +9,8 @@
 			"version": "0.0.1",
 			"dependencies": {
 				"emoji-picker-element": "^1.21.3",
+				"linkify-html": "^4.1.3",
+				"linkifyjs": "^4.1.3",
 				"sanitize-html": "^2.13.0",
 				"svelte-gravatar": "^1.0.3",
 				"svelte-i18n": "^4.0.0",
@@ -1727,9 +1729,9 @@
 			}
 		},
 		"node_modules/axios": {
-			"version": "1.7.3",
-			"resolved": "https://registry.npmjs.org/axios/-/axios-1.7.3.tgz",
-			"integrity": "sha512-Ar7ND9pU99eJ9GpoGQKhKf58GpUOgnzuaB7ueNQ5BMi0p+LZ5oaEnfF999fAArcTIBwXTCHAmGcHOZJaWPq9Nw==",
+			"version": "1.7.7",
+			"resolved": "https://registry.npmjs.org/axios/-/axios-1.7.7.tgz",
+			"integrity": "sha512-S4kL7XrjgBmvdGut0sN3yJxqYzrDOnivkBiN0OFs6hLiUam3UPvswUo0kqGyhqUZGEOytHyumEdXsAkgCOUf3Q==",
 			"dev": true,
 			"license": "MIT",
 			"dependencies": {
@@ -3633,6 +3635,21 @@
 			"dev": true,
 			"license": "MIT"
 		},
+		"node_modules/linkify-html": {
+			"version": "4.1.3",
+			"resolved": "https://registry.npmjs.org/linkify-html/-/linkify-html-4.1.3.tgz",
+			"integrity": "sha512-Ejb8X/pOxB4IVqG1U37tnF85UW3JtX+eHudH3zlZ2pODz2e/J7zQ/vj+VDWffwhTecJqdRehhluwrRmKoJz+iQ==",
+			"license": "MIT",
+			"peerDependencies": {
+				"linkifyjs": "^4.0.0"
+			}
+		},
+		"node_modules/linkifyjs": {
+			"version": "4.1.3",
+			"resolved": "https://registry.npmjs.org/linkifyjs/-/linkifyjs-4.1.3.tgz",
+			"integrity": "sha512-auMesunaJ8yfkHvK4gfg1K0SaKX/6Wn9g2Aac/NwX+l5VdmFZzo/hdPGxEOETj+ryRa4/fiOPjeeKURSAJx1sg==",
+			"license": "MIT"
+		},
 		"node_modules/locate-character": {
 			"version": "3.0.0",
 			"resolved": "https://registry.npmjs.org/locate-character/-/locate-character-3.0.0.tgz",
@@ -3756,9 +3773,9 @@
 			}
 		},
 		"node_modules/micromatch": {
-			"version": "4.0.7",
-			"resolved": "https://registry.npmjs.org/micromatch/-/micromatch-4.0.7.tgz",
-			"integrity": "sha512-LPP/3KorzCwBxfeUuZmaR6bG2kdeHSbe0P2tY3FLRU4vYrjYz5hI4QZwV0njUx3jeuKe67YukQ1LSPZBKDqO/Q==",
+			"version": "4.0.8",
+			"resolved": "https://registry.npmjs.org/micromatch/-/micromatch-4.0.8.tgz",
+			"integrity": "sha512-PXwfBhYu0hBCPw8Dn0E+WDYb7af3dSLVWKi3HGv84IdF4TyFoC0ysxFd0Goxw7nSv4T/PzEJQxsYsEiFCKo2BA==",
 			"dev": true,
 			"license": "MIT",
 			"dependencies": {
@@ -5104,9 +5121,9 @@
 			}
 		},
 		"node_modules/svelte": {
-			"version": "4.2.18",
-			"resolved": "https://registry.npmjs.org/svelte/-/svelte-4.2.18.tgz",
-			"integrity": "sha512-d0FdzYIiAePqRJEb90WlJDkjUEx42xhivxN8muUBmfZnP+tzUgz12DJ2hRJi8sIHCME7jeK1PTMgKPSfTd8JrA==",
+			"version": "4.2.19",
+			"resolved": "https://registry.npmjs.org/svelte/-/svelte-4.2.19.tgz",
+			"integrity": "sha512-IY1rnGr6izd10B0A8LqsBfmlT5OILVuZ7XsI0vdGPEvuonFV7NYEUK4dAkm9Zg2q0Um92kYjTpS1CAP3Nh/KWw==",
 			"license": "MIT",
 			"dependencies": {
 				"@ampproject/remapping": "^2.2.1",
diff --git a/frontend/package.json b/frontend/package.json
index 5548b0f0..f04376bc 100644
--- a/frontend/package.json
+++ b/frontend/package.json
@@ -47,6 +47,8 @@
 	"type": "module",
 	"dependencies": {
 		"emoji-picker-element": "^1.21.3",
+		"linkify-html": "^4.1.3",
+		"linkifyjs": "^4.1.3",
 		"sanitize-html": "^2.13.0",
 		"svelte-gravatar": "^1.0.3",
 		"svelte-i18n": "^4.0.0",
diff --git a/frontend/src/lib/components/sessions/message.svelte b/frontend/src/lib/components/sessions/message.svelte
index 98c69042..fe1c8d65 100644
--- a/frontend/src/lib/components/sessions/message.svelte
+++ b/frontend/src/lib/components/sessions/message.svelte
@@ -10,6 +10,8 @@
 	import ChatBubble from '../icons/chatBubble.svelte';
 	import { get } from 'svelte/store';
 	import type Feedback from '$lib/types/feedback';
+	import linkifyHtml from 'linkify-html';
+	import { sanitize } from '$lib/utils/sanitize';
 
 	export let message: Message;
 
@@ -194,7 +196,7 @@
 						>
 					{/if}
 				{:else}
-					{part.text}
+					{@html linkifyHtml(sanitize(part.text), { className: 'underline' })}
 				{/if}
 			{/each}
 		</div>
diff --git a/frontend/src/lib/components/sessions/writebox.svelte b/frontend/src/lib/components/sessions/writebox.svelte
index 0dc329d0..40613786 100644
--- a/frontend/src/lib/components/sessions/writebox.svelte
+++ b/frontend/src/lib/components/sessions/writebox.svelte
@@ -25,8 +25,8 @@
 	let disabled =
 		us == null ||
 		session.users.find((u) => us.id === u.id) === undefined ||
-		new Date() > session.end_time ||
-		new Date() < session.start_time;
+		new Date().getTime() > session.end_time.getTime() + 3600000 ||
+		new Date().getTime() < session.start_time.getTime() - 3600000;
 
 	async function sendMessage() {
 		message = message.trim();
-- 
GitLab