From f71bfcfb66ee19701c118d482ad40a9eaeb1a884 Mon Sep 17 00:00:00 2001
From: Josh Creek <8179928+jcreek@users.noreply.github.com>
Date: Wed, 12 Jul 2023 11:59:01 +0000
Subject: [PATCH] feat(*): Add share room link button

---
 src/routes/estimation/[roomId]/+page.svelte | 32 +++++++++++++++++++--
 1 file changed, 29 insertions(+), 3 deletions(-)

diff --git a/src/routes/estimation/[roomId]/+page.svelte b/src/routes/estimation/[roomId]/+page.svelte
index b226aae..14cbe93 100644
--- a/src/routes/estimation/[roomId]/+page.svelte
+++ b/src/routes/estimation/[roomId]/+page.svelte
@@ -142,14 +142,21 @@
 	onMount(() => {
 		socket = connectToWebSocket(data.roomId, onMessageReceived);
 	});
+
+	async function copyToClipboard() {
+		try {
+			await navigator.clipboard.writeText(window.location.href);
+			alert('Room link copied to clipboard!');
+		} catch (err) {
+			console.error('Failed to copy: ', err);
+		}
+	}
 </script>
 
 {#if showModal}
 	<Modal {closeModal} {joinRoom} />
 {/if}
 
-
-
 <UsersList bind:this={usersList} {users} {showEstimates} {userId} {handleEmojiTrigger} />
 
 <div class="button-container">
@@ -169,6 +176,10 @@
 	{/if}
 </div>
 
+<button id="copy-link-btn" class="button button-white" on:click={copyToClipboard}
+	>Share Room Link</button
+>
+
 <Estimates onEstimateClick={handleEstimateClick} />
 
 {#if Object.keys(estimateGroups).length > 0}
@@ -182,7 +193,7 @@
 		justify-content: center;
 		margin-bottom: 1em;
 	}
-	
+
 	.button {
 		appearance: none;
 		border: 1px solid rgba(27, 31, 35, 0.15);
@@ -230,4 +241,19 @@
 	.button-red:hover {
 		background-color: #a2021f;
 	}
+
+	.button-white {
+		background-color: #ffffff;
+		color: black;
+	}
+
+    .button-white:hover {
+		background-color: #E6E6E6;
+	}
+
+	#copy-link-btn {
+		position: fixed;
+		top: 10px;
+		right: 10px;
+	}
 </style>