feat: CQDG-414 variants save sets (#170)

* feat: CQDG-414 variants save sets * feat: CQDG-414 Adjust Cypress tests --------- Co-authored-by: Aymeric Toulouse <[email protected]> Co-authored-by: Karine St-Onge <[email protected]>
Ferlab-Ste-Justine · Oct 27, 2023 · 0a71b89 · 0a71b89
1 parent fbcf74d
commit 0a71b89
Show file tree

Hide file tree

Showing 12 changed files with 44 additions and 16 deletions.
diff --git a/cypress/e2e/Navigation/Pages.cy.ts b/cypress/e2e/Navigation/Pages.cy.ts
@@ -89,6 +89,13 @@ describe('Navigation', () => {
     cy.get('[data-cy="ProTable_DataFiles"]').should('exist');
     cy.get('[class*="QueryBar_selected"]').find('[class*="QueryPill_field"]').contains('File ID').should('exist');
     cy.get('[class*="QueryBar_selected"]').find('[class*="QueryValues_value"]').contains('Cypress Data Files').should('exist');
+
+    cy.visitDashboard();
+    cy.get('[data-cy="SavedSets"] [data-cy="Tab_Variants"]').click({force: true});
+    cy.get('[data-cy="SavedSets"]').contains('Cypress Variants').click({force: true});
+    cy.get('[data-cy="Title_Variants"]').should('exist');
+    cy.get('[class*="QueryBar_selected"]').find('[class*="QueryPill_field"]').contains('Variant ID').should('exist');
+    cy.get('[class*="QueryBar_selected"]').find('[class*="QueryValues_value"]').contains('Cypress Variants').should('exist');
   });
 
   it('Liens Saved Filters de la page Dashboard', () => {
@@ -99,7 +106,7 @@ describe('Navigation', () => {
     cy.get('[class*="QueryBar_selected"]').find('[class*="QueryValues_value"]').contains('Female').should('exist');
 
     cy.visitDashboard();
-    cy.get('[data-cy="Tab_Variants"]').click({force: true});
+    cy.get('[data-cy="SavedFilters"] [data-cy="Tab_Variants"]').click({force: true});
     cy.get('[data-cy="SavedFilters"]').contains('Cypress Variant Type Filter').click({force: true});
     cy.get('[data-cy="Title_Variants"]').should('exist');
     cy.get('[class*="QueryBar_selected"]').find('[class*="QueryPill_field"]').contains('Variant Type').should('exist');

diff --git a/src/components/uiKit/SetsManagementDropdown/index.tsx b/src/components/uiKit/SetsManagementDropdown/index.tsx
@@ -117,7 +117,7 @@ const getTitle = (type: string): string => {
     case INDEXES.BIOSPECIMEN:
       return intl.get('screen.dataExploration.saveBiospecimensSet');
     case INDEXES.VARIANT:
-      return intl.get('screen.dataExploration.saveBiospecimensSet');
+      return intl.get('screen.dataExploration.saveVariantsSet');
     default:
       return '';
   }

diff --git a/src/graphql/biospecimens/actions.ts b/src/graphql/biospecimens/actions.ts
@@ -12,6 +12,7 @@ export const useBiospecimens = (
 ) => {
   const { loading, result } = useLazyResultQuery<IBiospecimenResultTree>(GET_BIOSPECIMENS, {
     variables,
+    fetchPolicy: 'network-only',
   });
 
   return {

diff --git a/src/graphql/files/actions.ts b/src/graphql/files/actions.ts
@@ -12,6 +12,7 @@ import { GET_FILES, GET_FILES_COUNT } from './queries';
 export const useDataFiles = (variables?: IQueryVariable, operations?: IQueryOperationsConfig) => {
   const { loading, result } = useLazyResultQuery<IFileResultTree>(GET_FILES, {
     variables,
+    fetchPolicy: 'network-only',
   });
 
   return {

diff --git a/src/graphql/participants/actions.ts b/src/graphql/participants/actions.ts
@@ -13,6 +13,7 @@ export const useParticipants = (
 ) => {
   const { loading, result } = useLazyResultQuery<IParticipantResultTree>(GET_PARTICIPANTS, {
     variables,
+    fetchPolicy: 'network-only',
   });
 
   return {

diff --git a/src/graphql/variants/actions.ts b/src/graphql/variants/actions.ts
@@ -17,6 +17,7 @@ export const useVariant = (
 ): IQueryResults<IVariantEntity[]> => {
   const { loading, result } = useLazyResultQuery<IVariantResultTree>(SEARCH_VARIANT_QUERY, {
     variables,
+    fetchPolicy: 'network-only',
   });
 
   return {

diff --git a/src/locales/en.ts b/src/locales/en.ts
@@ -816,9 +816,6 @@ const en = {
           popoverContentLink: 'Data Exploration page',
           noSaved: 'You have no saved sets',
           lastSaved: 'Last saved: {date} ago',
-          files: 'Files',
-          participants: 'Participants',
-          biospecimens: 'Biospecimens',
           failedFetch: 'Failed to fetch sets saved',
         },
       },

diff --git a/src/locales/fr.ts b/src/locales/fr.ts
@@ -147,7 +147,7 @@ const fr = {
       type: 'Type',
       variant_class: 'Type de variant',
       variant_external_reference: 'Référence externe',
-      variant_id: 'Variant ID',
+      variant_id: 'ID de variant',
       biotype: 'Type de gène',
       zygosity: 'Zygosité',
       transmission: 'Transmission',
@@ -799,9 +799,6 @@ const fr = {
           popoverContentLink: 'page Exploration des données',
           noSaved: 'Vous n’avez aucun ensemble enregistré',
           lastSaved: 'Dernier enregistrement : il y a {date}',
-          files: 'Fichiers',
-          participants: 'Participants',
-          biospecimens: 'Biospécimens',
           failedFetch: 'Échec de la récupération des ensembles enregistrés',
         },
       },

diff --git a/src/utils/fieldMapper.ts b/src/utils/fieldMapper.ts
@@ -127,7 +127,7 @@ export const getIdFieldByType = (type: string): string => {
     case INDEXES.FILE:
       return 'file_id';
     case INDEXES.VARIANT:
-      return 'id';
+      return 'locus';
     case INDEXES.STUDY:
       return 'study_code';
     default:

diff --git a/src/utils/translation.ts b/src/utils/translation.ts
@@ -285,6 +285,7 @@ export const getFacetsDictionary = () => ({
   biospecimen_id: intl.get('entities.biospecimen.biospecimen_id'),
   file_id: intl.get('entities.file.file_id'),
   file_2_id: intl.get('entities.file.file_id'),
+  locus: intl.get('entities.variant.variant_id'),
   participant_id: intl.get('entities.participant.participant_id'),
   participant_2_id: intl.get('entities.participant.participant_id'),
   sample_id: intl.get('entities.biospecimen.sample_id'),

diff --git a/src/views/Dashboard/components/DashboardCards/SavedSets/ListItem/index.tsx b/src/views/Dashboard/components/DashboardCards/SavedSets/ListItem/index.tsx
@@ -15,15 +15,17 @@ import {
   DATA_EXPLORATION_FILTER_TAG,
   DATA_EXPLORATION_QB_ID,
 } from 'views/DataExploration/utils/constant';
+import { VARIANT_FILTER_TAG, VARIANT_REPO_QB_ID } from 'views/Variants/utils/constants';
 
 import { SetActionType } from 'components/uiKit/SetsManagementDropdown';
-import { IUserSetOutput } from 'services/api/savedSet/models';
+import { IUserSetOutput, SetType } from 'services/api/savedSet/models';
 import { deleteSavedSet } from 'store/savedSet/thunks';
 import { getIdFieldByType } from 'utils/fieldMapper';
 
 import CreateEditModal from '../CreateEditModal';
 
 import styles from './index.module.scss';
+
 const { Text } = Typography;
 
 const redirectToPage = (setType: string) => {
@@ -34,6 +36,8 @@ const redirectToPage = (setType: string) => {
       return `${DATA_EXPLORATION_FILTER_TAG}/participants`;
     case INDEXES.BIOSPECIMEN:
       return `${DATA_EXPLORATION_FILTER_TAG}/biospecimens`;
+    case INDEXES.VARIANT:
+      return `${VARIANT_FILTER_TAG}`;
     default:
       return DATA_EXPLORATION_FILTER_TAG;
   }
@@ -80,7 +84,8 @@ const ListItem = ({ data, icon }: IListItemProps) => {
           const setValue = `${SET_ID_PREFIX}${data.id}`;
 
           addQuery({
-            queryBuilderId: DATA_EXPLORATION_QB_ID,
+            queryBuilderId:
+              data.setType === SetType.VARIANT ? VARIANT_REPO_QB_ID : DATA_EXPLORATION_QB_ID,
             query: generateQuery({
               newFilters: [
                 generateValueFilter({

diff --git a/src/views/Dashboard/components/DashboardCards/SavedSets/index.tsx b/src/views/Dashboard/components/DashboardCards/SavedSets/index.tsx
@@ -10,6 +10,7 @@ import CardErrorPlaceholder from 'views/Dashboard/components/CardErrorPlaceHolde
 import CardHeader from 'views/Dashboard/components/CardHeader';
 import { DashboardCardProps } from 'views/Dashboard/components/DashboardCards';
 
+import LineStyleIcon from 'components/Icons/LineStyleIcon';
 import PopoverContentLink from 'components/uiKit/PopoverContentLink';
 import { IUserSetOutput, SetType } from 'services/api/savedSet/models';
 import { SUPPORT_EMAIL } from 'store/report/thunks';
@@ -19,7 +20,6 @@ import { STATIC_ROUTES } from 'utils/routes';
 import ListItem from './ListItem';
 
 import styles from './index.module.scss';
-
 const { Text } = Typography;
 
 const getItemList = (
@@ -67,7 +67,7 @@ const SavedSets = ({ id, key, className = '' }: DashboardCardProps) => {
       label: (
         <div data-cy="Tab_Participants">
           <UserOutlined />
-          {intl.get('screen.dashboard.cards.savedSets.participants')} (
+          {intl.get('entities.participant.participants')} (
           {savedSets.filter((s) => s.setType === SetType.PARTICIPANT).length})
         </div>
       ),
@@ -84,7 +84,7 @@ const SavedSets = ({ id, key, className = '' }: DashboardCardProps) => {
       label: (
         <div data-cy="Tab_Biospecimens">
           <ExperimentOutlined />
-          {intl.get('screen.dashboard.cards.savedSets.biospecimens')} (
+          {intl.get('entities.biospecimen.biospecimens')} (
           {savedSets.filter((s) => s.setType === SetType.BIOSPECIMEN).length})
         </div>
       ),
@@ -101,7 +101,7 @@ const SavedSets = ({ id, key, className = '' }: DashboardCardProps) => {
       label: (
         <div data-cy="Tab_Files">
           <FileTextOutlined />
-          {intl.get('screen.dashboard.cards.savedSets.files')} (
+          {intl.get('entities.file.files')} (
           {savedSets.filter((s) => s.setType === SetType.FILE).length})
         </div>
       ),
@@ -114,6 +114,23 @@ const SavedSets = ({ id, key, className = '' }: DashboardCardProps) => {
         <FileTextOutlined />,
       ),
     },
+    {
+      label: (
+        <div data-cy="Tab_Variants">
+          <LineStyleIcon height={16} width={16} className={styles.iconSvg} />
+          {intl.get('entities.variant.variants')} (
+          {savedSets.filter((s) => s.setType === SetType.VARIANT).length})
+        </div>
+      ),
+      key: 'variants',
+      children: getItemList(
+        SetType.VARIANT,
+        savedSets,
+        fetchingError,
+        isLoading,
+        <LineStyleIcon height={16} width={16} className={styles.iconSvg} />,
+      ),
+    },
   ];
 
   return (