From 050a25039be44dd9255ec8d37fd583fccf9b1bc4 Mon Sep 17 00:00:00 2001
From: jay-hodgson <jay.hodgson@sagebase.org>
Date: Mon, 9 Dec 2024 14:57:56 -0800
Subject: [PATCH] PORTALS-3358: add an On Synapse link

---
 .../arkportal/src/config/synapseConfigs/datasets.tsx       | 6 ++++--
 apps/portals/arkportal/src/pages/DatasetDetailsPage.tsx    | 7 ++++++-
 apps/portals/arkportal/src/pages/ProgramDetailsPage.tsx    | 7 ++++++-
 apps/portals/arkportal/src/pages/ProjectDetailsPage.tsx    | 7 ++++++-
 4 files changed, 22 insertions(+), 5 deletions(-)

diff --git a/apps/portals/arkportal/src/config/synapseConfigs/datasets.tsx b/apps/portals/arkportal/src/config/synapseConfigs/datasets.tsx
index 763ff45f50..776b383a9d 100644
--- a/apps/portals/arkportal/src/config/synapseConfigs/datasets.tsx
+++ b/apps/portals/arkportal/src/config/synapseConfigs/datasets.tsx
@@ -41,10 +41,12 @@ export const datasetSchema: GenericCardSchema = {
   title: 'name',
   subTitle: 'program',
   description: 'description',
-  secondaryLabels: ['project', 'assay', 'datasetType'],
+  secondaryLabels: ['project', 'assay', 'datasetType', 'id'],
   icon: 'datasetType',
 }
-
+export const datasetColumnAliases: Record<string, string> = {
+  id: 'On Synapse',
+}
 export const datasetCardConfiguration: CardConfiguration = {
   type: SynapseConstants.GENERIC_CARD,
   genericCardSchema: datasetSchema,
diff --git a/apps/portals/arkportal/src/pages/DatasetDetailsPage.tsx b/apps/portals/arkportal/src/pages/DatasetDetailsPage.tsx
index bc33be7606..e75fbad8a2 100644
--- a/apps/portals/arkportal/src/pages/DatasetDetailsPage.tsx
+++ b/apps/portals/arkportal/src/pages/DatasetDetailsPage.tsx
@@ -12,7 +12,10 @@ import {
 } from 'synapse-react-client'
 import columnAliases from '../config/columnAliases'
 import { datasetsSql } from '../config/resources'
-import { datasetCardConfiguration } from '../config/synapseConfigs/datasets'
+import {
+  datasetCardConfiguration,
+  datasetColumnAliases,
+} from '../config/synapseConfigs/datasets'
 
 export function DatasetDetailsPage() {
   const searchParams = useGetPortalComponentSearchParams()
@@ -23,6 +26,8 @@ export function DatasetDetailsPage() {
         sql={datasetsSql}
         isHeader
         searchParams={searchParams}
+        columnAliases={datasetColumnAliases}
+        secondaryLabelLimit={4}
       />
       <DetailsPage
         sql={datasetsSql}
diff --git a/apps/portals/arkportal/src/pages/ProgramDetailsPage.tsx b/apps/portals/arkportal/src/pages/ProgramDetailsPage.tsx
index 88f7201979..0eeae61575 100644
--- a/apps/portals/arkportal/src/pages/ProgramDetailsPage.tsx
+++ b/apps/portals/arkportal/src/pages/ProgramDetailsPage.tsx
@@ -3,7 +3,10 @@ import { DetailsPageContextConsumer } from '@sage-bionetworks/synapse-portal-fra
 import DetailsPage from '@sage-bionetworks/synapse-portal-framework/components/DetailsPage/index'
 import { useGetPortalComponentSearchParams } from '@sage-bionetworks/synapse-portal-framework/utils/UseGetPortalComponentSearchParams'
 import React from 'react'
-import { datasetCardConfiguration } from 'src/config/synapseConfigs/datasets'
+import {
+  datasetCardConfiguration,
+  datasetColumnAliases,
+} from 'src/config/synapseConfigs/datasets'
 import { CardContainerLogic } from 'synapse-react-client'
 import columnAliases from '../config/columnAliases'
 import { datasetsSql, programSql, projectsSql } from '../config/resources'
@@ -60,6 +63,8 @@ export function ProgramsDetailPage() {
                       {...datasetCardConfiguration}
                       sql={datasetsSql}
                       searchParams={{ program: value! }}
+                      columnAliases={datasetColumnAliases}
+                      secondaryLabelLimit={4}
                     />
                   )}
                 </DetailsPageContextConsumer>
diff --git a/apps/portals/arkportal/src/pages/ProjectDetailsPage.tsx b/apps/portals/arkportal/src/pages/ProjectDetailsPage.tsx
index c76398438a..e3368a235f 100644
--- a/apps/portals/arkportal/src/pages/ProjectDetailsPage.tsx
+++ b/apps/portals/arkportal/src/pages/ProjectDetailsPage.tsx
@@ -7,7 +7,10 @@ import React from 'react'
 import { CardContainerLogic } from 'synapse-react-client'
 import columnAliases from '../config/columnAliases'
 import { datasetsSql, projectsSql } from '../config/resources'
-import { datasetCardConfiguration } from '../config/synapseConfigs/datasets'
+import {
+  datasetCardConfiguration,
+  datasetColumnAliases,
+} from '../config/synapseConfigs/datasets'
 import {
   projectsCardConfiguration,
   projectSchema,
@@ -45,6 +48,8 @@ export function ProjectDetailsPage() {
                       {...datasetCardConfiguration}
                       sql={datasetsSql}
                       searchParams={{ project: value! }}
+                      columnAliases={datasetColumnAliases}
+                      secondaryLabelLimit={4}
                     />
                   )}
                 </DetailsPageContextConsumer>