From 9639c4b0efab2eeef1915798170390854cc8e43f Mon Sep 17 00:00:00 2001
From: Vincent Emonet <vincent.emonet@gmail.com>
Date: Mon, 30 Sep 2024 11:41:23 +0200
Subject: [PATCH] improve search to filter variables on mapped concept IDs

---
 README.md                                 |  5 +++++
 frontend/src/components/VariablesList.tsx |  2 +-
 frontend/src/pages/cohorts.tsx            |  1 +
 frontend/src/pages/upload.tsx             | 19 +++++++++----------
 4 files changed, 16 insertions(+), 11 deletions(-)

diff --git a/README.md b/README.md
index c8580a2..de5fc57 100644
--- a/README.md
+++ b/README.md
@@ -90,6 +90,11 @@ Requirements: [Docker](https://docs.docker.com/engine/install/)
    ADMINS=admin1@email.com,admin2@email.com
    ```
 
+   > [!WARNING]
+   >
+   > * Make sure to add the user you will login with to the list of `ADMINS` if you want to be able to upload any cohort.
+   > * Get a token from Decentriq for your login email (the explorer needs a token to access Decentriq API)
+
 2. Put the excel spreadsheet with all cohorts metadata in `data/iCARE4CVD_Cohorts.xlsx`. Uploaded cohorts will go to separated folders in `data/cohorts/`
 
 3. Start the whole stack in development with docker compose, with hot reload for the frontend and backend:
diff --git a/frontend/src/components/VariablesList.tsx b/frontend/src/components/VariablesList.tsx
index f04ae87..95edd21 100644
--- a/frontend/src/components/VariablesList.tsx
+++ b/frontend/src/components/VariablesList.tsx
@@ -81,7 +81,7 @@ const VariablesList = ({cohortId, searchFilters = {searchQuery: ''}}: any) => {
         .filter(
           ([variableName, variableData]: any) =>
             variableName.toLowerCase().includes(searchFilters.searchQuery.toLowerCase()) ||
-            variableData.var_label.toLowerCase().includes(searchFilters.searchQuery.toLowerCase())
+            JSON.stringify(variableData).toLowerCase().includes(searchFilters.searchQuery.toLowerCase())
         )
         .filter(
           ([variableName, variableData]: any) =>
diff --git a/frontend/src/pages/cohorts.tsx b/frontend/src/pages/cohorts.tsx
index 3747d51..dbaaff1 100644
--- a/frontend/src/pages/cohorts.tsx
+++ b/frontend/src/pages/cohorts.tsx
@@ -35,6 +35,7 @@ export default function CohortsList() {
       })
       .map(([, cohortData]) => cohortData);
   }, [searchQuery, selectedDataTypes, selectedStudyTypes, selectedInstitutes, cohortsData]);
+  // NOTE: filtering variables is done in VariablesList component
 
   return (
     <main className="flex w-full p-4 bg-base-200 h-full min-h-screen space-x-4">
diff --git a/frontend/src/pages/upload.tsx b/frontend/src/pages/upload.tsx
index dce368d..6b7bea5 100644
--- a/frontend/src/pages/upload.tsx
+++ b/frontend/src/pages/upload.tsx
@@ -1,7 +1,7 @@
 'use client';
 
 import React, {useState} from 'react';
-import {Upload, UploadCloud} from 'react-feather';
+import {Upload} from 'react-feather';
 import {useCohorts} from '@/components/CohortsContext';
 import {TrashIcon} from '@/components/Icons';
 import {apiUrl} from '@/utils';
@@ -16,11 +16,11 @@ export default function UploadPage() {
   const [publishedDCR, setPublishedDCR]: any = useState(null);
   const [isLoading, setIsLoading] = useState(false);
 
-  // const cohortsNoVariables = cohortsData
+  // Show all cohorts for now, in case people need to reupload
+  const cohortsUserCanEdit = cohortsData ? Object.keys(cohortsData).filter(cohortId => cohortsData[cohortId]['can_edit']) : [];
+  // const cohortsUserCanEdit = cohortsData
   //   ? Object.keys(cohortsData).filter(cohortId => Object.keys(cohortsData[cohortId]['variables']).length === 0)
   //   : [];
-  // Show all cohorts for now, in case people need to reupload
-  const cohortsNoVariables = cohortsData ? Object.keys(cohortsData).filter(cohortId => true) : [];
 
   const handleCohortIdChange = (event: any) => {
     setCohortId(event.target.value);
@@ -112,13 +112,12 @@ export default function UploadPage() {
               required
             >
               <option value="">Select the cohort to upload</option>
-              {cohortsNoVariables.map((cohortId: string) =>
-                cohortsData[cohortId]['can_edit'] ? (
-                  <React.Fragment key={cohortId}>
-                    <option value={cohortId}>{cohortId}</option>
-                  </React.Fragment>
-                ) : null
+              {cohortsUserCanEdit.map((cohortId: string) =>
+                <React.Fragment key={cohortId}>
+                  <option value={cohortId}>{cohortId}</option>
+                </React.Fragment>
               )}
+              {cohortsUserCanEdit.length === 0 && <option value="" disabled>No cohorts available</option>}
             </select>
           </div>