From ac246d206a7eddf6aada87eadbbe029aa3e93f9a Mon Sep 17 00:00:00 2001
From: Alex Tideman <alex.tideman@gmail.com>
Date: Wed, 2 Oct 2024 13:26:09 -0500
Subject: [PATCH] Add Link Namespace

---
 src/lib/components/event/event-link.svelte        | 15 ++++++++-------
 .../components/event/event-links-expanded.svelte  | 13 +++++++++----
 .../lines-and-dots/workflow-callback.svelte       | 13 +++++++------
 src/lib/i18n/locales/en/common.ts                 |  2 ++
 4 files changed, 26 insertions(+), 17 deletions(-)

diff --git a/src/lib/components/event/event-link.svelte b/src/lib/components/event/event-link.svelte
index 82838da7e..efb6f87e2 100644
--- a/src/lib/components/event/event-link.svelte
+++ b/src/lib/components/event/event-link.svelte
@@ -1,31 +1,32 @@
 <script lang="ts">
   import Badge from '$lib/holocene/badge.svelte';
   import Link from '$lib/holocene/link.svelte';
+  import { translate } from '$lib/i18n/translate';
   import type { EventLink } from '$lib/types/events';
   import { routeForEventHistory } from '$lib/utilities/route-for';
 
   export let link: EventLink;
-  export let label = 'Link';
-  export let xs = false;
-
-  $: href = routeForEventHistory({
+  export let value = link.workflowEvent.workflowId;
+  export let label = translate('common.link');
+  export let href = routeForEventHistory({
     namespace: link.workflowEvent.namespace,
     workflow: link.workflowEvent.workflowId,
     run: link.workflowEvent.runId,
     eventId: link.workflowEvent.eventRef?.eventId,
   });
+  export let xs = false;
 </script>
 
 <div
-  class="flex max-w-lg flex-row items-center gap-2 overflow-hidden first:pt-0 last:border-b-0 xl:max-w-xl {$$props.class}"
+  class="flex max-w-lg flex-row items-center gap-1 gap-2 overflow-hidden first:pt-0 last:border-b-0 xl:max-w-xl {$$props.class}"
 >
   <p class="max-w-fit whitespace-nowrap text-right text-sm" class:text-xs={xs}>
     {label}
   </p>
-  <div class="overflow-hidden truncate pr-1">
+  <div class="overflow-hidden truncate">
     <Badge type="subtle">
       <Link {href}>
-        {link.workflowEvent.workflowId}
+        {value}
       </Link>
     </Badge>
   </div>
diff --git a/src/lib/components/event/event-links-expanded.svelte b/src/lib/components/event/event-links-expanded.svelte
index 90c0385a3..06dc69850 100644
--- a/src/lib/components/event/event-links-expanded.svelte
+++ b/src/lib/components/event/event-links-expanded.svelte
@@ -1,5 +1,7 @@
 <script lang="ts">
+  import { translate } from '$lib/i18n/translate';
   import type { EventLink as ELink } from '$lib/types/events';
+  import { routeForNamespace } from '$lib/utilities/route-for';
 
   import EventLink from './event-link.svelte';
 
@@ -13,12 +15,15 @@
     >
       <EventLink {link} />
     </div>
-  {/if}
-  <!-- {#if link?.workflowEvent}
     <div
       class="block flex w-full items-center gap-4 px-2 py-1 py-1 text-left text-left xl:flex"
     >
-      Link Namespace
+      <EventLink
+        {link}
+        label={translate('common.link-namespace')}
+        value={link.workflowEvent.namespace}
+        href={routeForNamespace({ namespace: link.workflowEvent.namespace })}
+      />
     </div>
-  {/if} -->
+  {/if}
 {/each}
diff --git a/src/lib/components/lines-and-dots/workflow-callback.svelte b/src/lib/components/lines-and-dots/workflow-callback.svelte
index 759bbe43c..9808d2bc7 100644
--- a/src/lib/components/lines-and-dots/workflow-callback.svelte
+++ b/src/lib/components/lines-and-dots/workflow-callback.svelte
@@ -7,6 +7,7 @@
   import { timeFormat } from '$lib/stores/time-format';
   import type { CallbackInfo } from '$lib/types';
   import { formatDate } from '$lib/utilities/format-date';
+  import { routeForNamespace } from '$lib/utilities/route-for';
 
   import EventLink from '../event/event-link.svelte';
 
@@ -34,13 +35,13 @@
   <div class="flex flex-col gap-2 pt-2">
     {#if link}
       <EventLink {link} />
+      <EventLink
+        {link}
+        label={translate('common.link-namespace')}
+        value={link.workflowEvent.namespace}
+        href={routeForNamespace({ namespace: link.workflowEvent.namespace })}
+      />
     {/if}
-    <p class="flex items-center gap-2">
-      {translate('common.url')}
-      <Badge type="subtle">
-        {callback.callback.nexus.url}
-      </Badge>
-    </p>
     <div class="flex flex-col items-start gap-2 md:flex-row md:items-center">
       <p class="flex items-center gap-2">
         {translate('common.state')}
diff --git a/src/lib/i18n/locales/en/common.ts b/src/lib/i18n/locales/en/common.ts
index cc0e14549..6d0169b7c 100644
--- a/src/lib/i18n/locales/en/common.ts
+++ b/src/lib/i18n/locales/en/common.ts
@@ -181,4 +181,6 @@ export const Strings = {
   message: 'Message',
   'upload-json': 'Upload JSON',
   'input-valid-json': 'Input must be valid JSON',
+  link: 'Link',
+  'link-namespace': 'Link Namespace',
 } as const;