From 4035fcc72e619933db432722eb14983d89a02141 Mon Sep 17 00:00:00 2001
From: Graham McNeill <gjmcn@users.noreply.github.com>
Date: Thu, 5 Dec 2024 15:16:42 +0000
Subject: [PATCH] [Platform]: Study page fixes (#593)

* add batching to shared trait stuidies

* remove page study from results

* add condition column to metadata
---
 apps/platform/src/pages/StudyPage/Profile.tsx |  4 +-
 .../pages/StudyPage/StudyProfileHeader.gql    |  1 +
 .../pages/StudyPage/StudyProfileHeader.tsx    |  6 ++-
 .../src/study/GWASCredibleSets/Body.tsx       |  2 +
 .../src/study/SharedTraitStudies/Body.tsx     | 40 ++++++++++++++++---
 .../SharedTraitStudiesQuery.gql               |  5 ++-
 .../src/study/SharedTraitStudies/index.ts     |  2 +-
 7 files changed, 47 insertions(+), 13 deletions(-)

diff --git a/apps/platform/src/pages/StudyPage/Profile.tsx b/apps/platform/src/pages/StudyPage/Profile.tsx
index bb4eddcb3..c5fce3d54 100644
--- a/apps/platform/src/pages/StudyPage/Profile.tsx
+++ b/apps/platform/src/pages/StudyPage/Profile.tsx
@@ -37,9 +37,7 @@ const STUDY_PROFILE_QUERY = gql`
       ...StudyProfileSummaryFragment
     }
     sharedTraitStudies: studies(diseaseIds: $diseaseIds, page: { size: 2, index: 0 }) {
-      rows {
-        id
-      }
+      count
     }
   }
   ${ProfileHeader.fragments.profileHeader}
diff --git a/apps/platform/src/pages/StudyPage/StudyProfileHeader.gql b/apps/platform/src/pages/StudyPage/StudyProfileHeader.gql
index 425202661..4f04c6e46 100644
--- a/apps/platform/src/pages/StudyPage/StudyProfileHeader.gql
+++ b/apps/platform/src/pages/StudyPage/StudyProfileHeader.gql
@@ -37,4 +37,5 @@ fragment StudyProfileHeaderFragment on Gwas {
     biosampleId
     biosampleName
   }
+  condition
 }
diff --git a/apps/platform/src/pages/StudyPage/StudyProfileHeader.tsx b/apps/platform/src/pages/StudyPage/StudyProfileHeader.tsx
index 877947830..3e315d1ef 100644
--- a/apps/platform/src/pages/StudyPage/StudyProfileHeader.tsx
+++ b/apps/platform/src/pages/StudyPage/StudyProfileHeader.tsx
@@ -41,6 +41,7 @@ function ProfileHeader() {
     qualityControls,
     analysisFlags,
     biosample,
+    condition,
   } = data?.study || {};
 
   return (
@@ -77,7 +78,7 @@ function ProfileHeader() {
             )}
           </>
         )}
-        {studyType !== "gwas" && (
+        {studyType !== "gwas" && (  // QTL
           <>
             {target?.id && (
               <Field loading={loading} title="Affected gene">
@@ -94,6 +95,9 @@ function ProfileHeader() {
                 </Link>
               </Field>
             )}
+            <Field loading={loading} title="Condition">
+              {condition}
+            </Field>
           </>
         )}
         {publicationFirstAuthor && (
diff --git a/packages/sections/src/study/GWASCredibleSets/Body.tsx b/packages/sections/src/study/GWASCredibleSets/Body.tsx
index 3ebfc2c40..51d36c4b9 100644
--- a/packages/sections/src/study/GWASCredibleSets/Body.tsx
+++ b/packages/sections/src/study/GWASCredibleSets/Body.tsx
@@ -174,6 +174,8 @@ function Body({ id, entity }: BodyProps) {
       definition={definition}
       entity={entity}
       request={request}
+      showContentLoading
+      loadingMessage="Loading data. This may take some time..."
       renderDescription={() => <Description studyId={request.data?.study.id} />}
       renderBody={() => (
         <>
diff --git a/packages/sections/src/study/SharedTraitStudies/Body.tsx b/packages/sections/src/study/SharedTraitStudies/Body.tsx
index 68ef3d35f..49bf80fe2 100644
--- a/packages/sections/src/study/SharedTraitStudies/Body.tsx
+++ b/packages/sections/src/study/SharedTraitStudies/Body.tsx
@@ -1,13 +1,20 @@
 import { Fragment } from "react";
-import { useQuery } from "@apollo/client";
 import { Box, Typography } from "@mui/material";
-import { Link, SectionItem, Tooltip, PublicationsDrawer, OtTable } from "ui";
+import {
+  Link,
+  SectionItem,
+  Tooltip,
+  PublicationsDrawer,
+  OtTable,
+  useBatchQuery,
+} from "ui";
 import { definition } from ".";
 import Description from "./Description";
-import { naLabel } from "../../constants";
+import { naLabel, initialResponse, table5HChunkSize } from "../../constants";
 import SHARED_TRAIT_STUDIES_QUERY from "./SharedTraitStudiesQuery.gql";
 import { getStudyCategory } from "../../utils/getStudyCategory";
 import { epmcUrl } from "ui/src/utils/urls";
+import { useEffect, useState } from "react";
 
 function getColumns(diseaseIds: string[]) {
   const diseaseIdsSet = new Set(diseaseIds);
@@ -115,23 +122,44 @@ export function Body({ studyId, diseaseIds, entity }: BodyProps) {
     diseaseIds: diseaseIds,
   };
 
-  const request = useQuery(SHARED_TRAIT_STUDIES_QUERY, {
-    variables,
+  const [request, setRequest] = useState<responseType>(initialResponse);
+
+  const getData = useBatchQuery({
+    query: SHARED_TRAIT_STUDIES_QUERY,
+    variables: {
+      diseaseIds,
+      size: table5HChunkSize,
+      index: 0,
+    },
+    dataPath: "data.studies",
+    size: table5HChunkSize,
   });
 
+  useEffect(() => {
+    getData().then(r => {
+      setRequest(r);
+    });
+  }, []);
+
   const columns = getColumns(diseaseIds);
 
+  const rows = request.data?.studies?.rows?.filter(row => {
+    return row.id !== studyId;
+  });
+
   return (
     <SectionItem
       definition={definition}
       request={request}
       entity={"studies"}
+      showContentLoading
+      loadingMessage="Loading data. This may take some time..."
       renderDescription={() => <Description studyId={studyId} />}
       renderBody={() => {
         return (
           <OtTable
             columns={columns}
-            rows={request.data?.studies?.rows}
+            rows={rows}
             loading={request.loading}
             sortBy="nSamples"
             order="desc"
diff --git a/packages/sections/src/study/SharedTraitStudies/SharedTraitStudiesQuery.gql b/packages/sections/src/study/SharedTraitStudies/SharedTraitStudiesQuery.gql
index 8db97fea7..18c21e700 100644
--- a/packages/sections/src/study/SharedTraitStudies/SharedTraitStudiesQuery.gql
+++ b/packages/sections/src/study/SharedTraitStudies/SharedTraitStudiesQuery.gql
@@ -1,5 +1,6 @@
-query SharedTraitStudiesQuery($diseaseIds: [String!]!) {
-  studies(diseaseIds: $diseaseIds, page: { size: 2000, index: 0 }) {
+query SharedTraitStudiesQuery($diseaseIds: [String!]!, $size: Int!, $index: Int!) {
+  studies(diseaseIds: $diseaseIds,  page: { size: $size, index: $index }) {
+    count
     rows {
       id
       traitFromSource
diff --git a/packages/sections/src/study/SharedTraitStudies/index.ts b/packages/sections/src/study/SharedTraitStudies/index.ts
index ee171cc0f..651d8aff4 100644
--- a/packages/sections/src/study/SharedTraitStudies/index.ts
+++ b/packages/sections/src/study/SharedTraitStudies/index.ts
@@ -4,6 +4,6 @@ export const definition = {
   name: "Shared Trait Studies",
   shortName: "ST",
   hasData: data => {
-    return data?.sharedTraitStudies?.rows.length > 0 || data?.rows.length > 0;
+    return data?.sharedTraitStudies?.count > 1 || data?.count > 1;
   },
 };