From 0d72aba8daafc9309da4a419689c90bf4b47845a Mon Sep 17 00:00:00 2001
From: Nicolai Ort <info@nicolai-ort.com>
Date: Mon, 16 Aug 2021 18:22:41 +0200
Subject: [PATCH] Added visits table to details

---
 src/routes/details.svelte | 37 +++++++++++++++++++++++++++++++++++--
 1 file changed, 35 insertions(+), 2 deletions(-)

diff --git a/src/routes/details.svelte b/src/routes/details.svelte
index d46246b..022fbdb 100644
--- a/src/routes/details.svelte
+++ b/src/routes/details.svelte
@@ -9,7 +9,7 @@
     Apiclient.getUrlDetails(shortcode).then((res)=>{
         urlDetails=res;
     });
-    Apiclient.getUrlVisits(shortcode).then((res)=>{
+    let visitQuery = Apiclient.getUrlVisits(shortcode).then((res)=>{
         urlVisists=res;
     });
 </script>
@@ -25,4 +25,37 @@
     {urlDetails.target}
     <h2>Visits:</h2> 
     {urlDetails.visits}
-</div>
\ No newline at end of file
+</div>
+
+<div class="rounded-xl">
+	<table class="min-w-full divide-y divide-gray-200">
+		<thead class="bg-gray-50 dark:bg-gray-900 text-gray-800 dark:text-gray-100">
+			<tr>
+				<th scope="col" class="px-6 py-3 text-left text-xs font-medium  uppercase tracking-wider">
+					Timestamp
+				</th>
+			</tr>
+		</thead>
+		<tbody class="bg-white dark:bg-gray-700 divide-y divide-gray-200 dark:text-gray-100" x-max="1">
+			{#await visitQuery}
+				<tr>
+					<td
+						class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-900 dark:text-gray-200"
+					>
+						Loading data...
+					</td>
+				</tr>
+			{:then}
+				{#each urlVisists as visit}
+					<tr>
+						<td
+							class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-900 dark:text-gray-200"
+						>
+							{visit.timestamp}
+						</td>
+					</tr>
+				{/each}
+			{/await}
+		</tbody>
+	</table>
+</div>