diff --git a/apps/platform/src/components/Facets/FacetsSuggestion.tsx b/apps/platform/src/components/Facets/FacetsSuggestion.tsx index 51dddfa5d..280268d5e 100644 --- a/apps/platform/src/components/Facets/FacetsSuggestion.tsx +++ b/apps/platform/src/components/Facets/FacetsSuggestion.tsx @@ -4,9 +4,10 @@ import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"; import { Box } from "@mui/material"; import { useAotfContext } from "../AssociationsToolkit"; import { ENTITY } from "./facetsTypes"; +import { Link } from "ui"; const EXAMPLE = { - [ENTITY.DISEASE]: "Measurement", + [ENTITY.DISEASE]: "Eczema", [ENTITY.TARGET]: "Enzyme", }; @@ -15,22 +16,30 @@ function FacetsSuggestion(): ReactElement { return ( - - theme.spacing(1), - }} - > - - Tip: + + + How do facet filters work? +
    +
  • + Please search by {entityToGet} or filter by {entityToGet} category. Example:{" "} + {EXAMPLE[entityToGet]} +
  • +
  • + Filters across categories use AND +
  • +
  • + Filters within a category use OR +
  • +
- - Please search by {entityToGet} or filter by {entityToGet} category. Example:{" "} - {EXAMPLE[entityToGet]} + + + Read more details here. +
diff --git a/apps/platform/src/components/Facets/facetsLayout.tsx b/apps/platform/src/components/Facets/facetsLayout.tsx index 078fb4c37..2b6eb1e20 100644 --- a/apps/platform/src/components/Facets/facetsLayout.tsx +++ b/apps/platform/src/components/Facets/facetsLayout.tsx @@ -14,7 +14,7 @@ export const FacetsSelect = styled(Select)(({ theme }) => ({ })); export const FacetsAutocomplete = styled(Autocomplete)(({ theme }) => ({ - minWidth: "280px", + minWidth: "320px", width: 1, maxWidth: 1, flexWrap: "nowrap", diff --git a/apps/platform/src/pages/DiseasePage/DiseaseAssociations/DiseaseAssociations.tsx b/apps/platform/src/pages/DiseasePage/DiseaseAssociations/DiseaseAssociations.tsx index 45a53e1ac..0519744d8 100644 --- a/apps/platform/src/pages/DiseasePage/DiseaseAssociations/DiseaseAssociations.tsx +++ b/apps/platform/src/pages/DiseasePage/DiseaseAssociations/DiseaseAssociations.tsx @@ -33,7 +33,7 @@ function DiseaseAssociations(pros: DiseaseAssociationsProps): ReactElement { - +
diff --git a/apps/platform/src/pages/TargetPage/TargetAssociations/TargetAssociations.tsx b/apps/platform/src/pages/TargetPage/TargetAssociations/TargetAssociations.tsx index dc349051f..98c610e02 100644 --- a/apps/platform/src/pages/TargetPage/TargetAssociations/TargetAssociations.tsx +++ b/apps/platform/src/pages/TargetPage/TargetAssociations/TargetAssociations.tsx @@ -24,13 +24,11 @@ function TargetAssociations({ ensgId }: TargetAssociationsProps): ReactElement { <> - theme.spacing(2) }} - > + - +