[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

@@ -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}

apps/platform/src/pages/StudyPage/StudyProfileHeader.gql

@@ -37,4 +37,5 @@ fragment StudyProfileHeaderFragment on Gwas {
     biosampleId
     biosampleName
   }
+  condition
 }

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 && (

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={() => (
         <>

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"

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

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;
   },
 };