From b1777ca1911805406e7deb8aa09f31e7d03cf4c8 Mon Sep 17 00:00:00 2001
From: Jean Ribeiro <contact@jeanribeiro.dev>
Date: Wed, 22 May 2024 03:55:15 -0300
Subject: [PATCH] feat: adds Link in NotificationTile (#2528)

---
 .../components/tiles/NotificationTile.svelte    | 17 +++++++++++------
 1 file changed, 11 insertions(+), 6 deletions(-)

diff --git a/packages/shared/src/components/tiles/NotificationTile.svelte b/packages/shared/src/components/tiles/NotificationTile.svelte
index 6779a8fae1..2ff499c296 100644
--- a/packages/shared/src/components/tiles/NotificationTile.svelte
+++ b/packages/shared/src/components/tiles/NotificationTile.svelte
@@ -1,6 +1,6 @@
 <script lang="ts">
     import { notificationsManager } from '@auxiliary/wallet-connect/notifications'
-    import { Text, Tile } from '@bloomwalletio/ui'
+    import { Link, Text, Tile } from '@bloomwalletio/ui'
     import { getBestTimeDuration } from '@core/utils'
     import { NotificationAvatar } from '@ui/avatars'
     import { NotifyClientTypes } from '@walletconnect/notify-client'
@@ -15,11 +15,16 @@
     <div class="flex justify-between gap-4 w-full">
         <NotificationAvatar {subscription} notificationType={notification.type} />
         <div class="flex-grow flex flex-col items-start">
-            <div class="flex justify-between items-center gap-2">
-                <Text type="sm" lineClamp={1}>{notification.title}</Text>
-                <Text type="xs" fontWeight="normal"
-                    >{getBestTimeDuration(new Date().getTime() - notification.sentAt, 'day', true)}</Text
-                >
+            <div class="w-full flex justify-between items-center gap-2">
+                <div class="flex items-center gap-2">
+                    <Text type="sm" lineClamp={1}>{notification.title}</Text>
+                    <Text type="xs" fontWeight="normal">
+                        {getBestTimeDuration(new Date().getTime() - notification.sentAt, 'day', true)}
+                    </Text>
+                </div>
+                {#if notification.url}
+                    <Link textType="xs" href={notification.url} external />
+                {/if}
             </div>
             <Text type="xs" fontWeight="normal" lineClamp={2}>{notification.body}</Text>
         </div>