From 8d379a19354965fbe7dd3f668776338001b14641 Mon Sep 17 00:00:00 2001
From: Dominik Zborowski <dominik.zborowski@gmail.com>
Date: Thu, 7 Nov 2024 01:39:24 +0100
Subject: [PATCH] Link field in text widget

---
 domains/grid/components/AddWidgetText.vue  | 11 +++++++++++
 domains/grid/components/GridWidgetText.vue |  7 +++++--
 domains/grid/schema/textWidgetSchema.ts    |  1 +
 translations/en_US.json                    |  5 +++++
 4 files changed, 22 insertions(+), 2 deletions(-)

diff --git a/domains/grid/components/AddWidgetText.vue b/domains/grid/components/AddWidgetText.vue
index f8bcdd7e..0c55581f 100644
--- a/domains/grid/components/AddWidgetText.vue
+++ b/domains/grid/components/AddWidgetText.vue
@@ -164,6 +164,17 @@ const handleBackToSelection = () => {
           "
         ></lukso-color-picker>
       </div>
+
+      <!-- Link -->
+      <lukso-input
+        .value="inputValues?.link"
+        :label="formatMessage('add_widget_text_link_label')"
+        :placeholder="formatMessage('add_widget_text_link_placeholder')"
+        is-full-width
+        @on-input="
+          (customEvent: CustomEvent) => handleFieldChange(customEvent, 'link')
+        "
+      ></lukso-input>
     </div>
 
     <!-- Buttons -->
diff --git a/domains/grid/components/GridWidgetText.vue b/domains/grid/components/GridWidgetText.vue
index 374b83e1..18e1b996 100644
--- a/domains/grid/components/GridWidgetText.vue
+++ b/domains/grid/components/GridWidgetText.vue
@@ -5,15 +5,18 @@ type Props = {
   backgroundColor?: string
   titleColor?: string
   textColor?: string
+  link?: string
 }
 
 defineProps<Props>()
 </script>
 
 <template>
-  <div
+  <a
     class="m-3 flex h-full flex-col items-center justify-center overflow-hidden rounded-8 p-4 text-neutral-100"
     :style="{ backgroundColor }"
+    :href="link"
+    target="_blank"
   >
     <h1
       class="heading-apax-24-medium break-word"
@@ -31,5 +34,5 @@ defineProps<Props>()
     >
       {{ text }}
     </p>
-  </div>
+  </a>
 </template>
diff --git a/domains/grid/schema/textWidgetSchema.ts b/domains/grid/schema/textWidgetSchema.ts
index d1ba0592..c946d551 100644
--- a/domains/grid/schema/textWidgetSchema.ts
+++ b/domains/grid/schema/textWidgetSchema.ts
@@ -6,6 +6,7 @@ export const textWidgetSchema = z.object({
   backgroundColor: z.string().default('#f9f9f9').superRefine(hexColorValidator),
   title: z.string().optional(),
   text: z.string().optional(),
+  link: z.string().optional(),
 })
 
 export type TextWidgetProperties = z.input<typeof textWidgetSchema>
diff --git a/translations/en_US.json b/translations/en_US.json
index 25723c28..90e6a1bd 100644
--- a/translations/en_US.json
+++ b/translations/en_US.json
@@ -19,6 +19,7 @@
   "error_rejected_request": "You rejected the request",
   "dapp_showcase_06_image": "/images/universal-grave-dapp.jpg",
   "button_create_testnet_profile": "CREATE A TESTNET PROFILE",
+  "grid_mobile_limitations_title": "Editing on mobile",
   "modal_switch_network_title": "Change extension network",
   "hero_title_01": "Discover",
   "modal_follower_title": "Followers",
@@ -61,9 +62,11 @@
   "tooltip_text_copy_raw": "Copy raw",
   "add_widget_section_website": "Website",
   "data_provider_graph_description": "Load data via the our Envio indexing service. This results in faster loading times and smoother UX, however inappropriate content might be removed.",
+  "grid_mobile_limitations_confirm": "I understand",
   "transak_success_message": "Please note that it can take some time for your balance to update.",
   "missing_asset_label_added": "Added",
   "error_no_accounts": "Account not found.",
+  "add_widget_text_link_label": "Link",
   "asset_all_creators_unverified": "Un-verified creators",
   "add_widget_text_text_label": "Description",
   "add_grid_columns_label": "Number of columns",
@@ -176,6 +179,7 @@
   "token_asset_type_video": "VIDEO",
   "beta_warning": "You are on <strong>LUKSO Testnet</strong>. Do not send real LYX to any profiles made on this network!<br /><strong>If you are looking for LUKSO Mainnet, please use the switch in the footer.</strong>",
   "add_widget_iframe_input_placeholder": "URL of the webpage",
+  "add_widget_text_link_placeholder": "Link URL",
   "profile_card_follow_button": "Follow",
   "header_discovery": "Discover",
   "asset_all_creators_verified": "Verified creators",
@@ -268,6 +272,7 @@
   "dapp_showcase_02_url": "https://universalswaps.io/",
   "token_collection_of": "Owns {count}",
   "add_widget_images_description": "Allows to embed image files.",
+  "grid_mobile_limitations_message": "some editing features are not available on mobile right now",
   "add_widget_text_title_placeholder": "Header text",
   "data_provider_rpc_description": "Loads data directly from the blockchain using an RPC provider. If a custom RPC provider (This feature will be added later) is used the read data can not be manipulated by us. \n\nWill result in slower loading times during the loading of assets and some app features might be limited.",
   "move_widget_description": "Please select to which Grid you want to move this widget.",