Styling tweaks for facets

datacite · Dec 24, 2024 · 948626f · 948626f
1 parent ac4ed86
commit 948626f
Show file tree

Hide file tree

Showing 6 changed files with 21 additions and 17 deletions.
diff --git a/src/components/AuthorsFacet/AuthorsFacet.tsx b/src/components/AuthorsFacet/AuthorsFacet.tsx
@@ -48,6 +48,7 @@ const AuthorsFacet: React.FunctionComponent<Props> = ({
             param="filterQuery"
             url={url}
             tooltipText={`This list includes only ${title} with ORCID iDs in DOI metadata.`}
+            radio
         />
     )
 }

diff --git a/src/components/FacetList/FacetList.tsx b/src/components/FacetList/FacetList.tsx
@@ -7,7 +7,6 @@ import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
 import FacetListItem from './FacetListItem'
 import { Facet } from 'src/data/types'
 import { faQuestionCircle } from '@fortawesome/free-regular-svg-icons'
-import ListGroup from 'react-bootstrap/ListGroup';
 import Accordion from 'react-bootstrap/Accordion';
 import styles from './FacetList.module.scss'
 
@@ -54,7 +53,6 @@ export default function FacetList(props: FacetListProps) {
         {props.tooltipText && <InfoTooltip text={props.tooltipText} /> }
       </Accordion.Header>
       <Accordion.Body>
-      <ListGroup as="ul" variant="flush">
         {data.map((facet, i) => (
           <FacetListItem
             key={'facet-item- ' +id + '-' + i}
@@ -66,7 +64,6 @@ export default function FacetList(props: FacetListProps) {
             radio={radio}
           />
         ))}
-      </ListGroup>
       </Accordion.Body>
     </Accordion.Item>
   )

diff --git a/src/components/FairFilter/FairFilter.tsx b/src/components/FairFilter/FairFilter.tsx
@@ -2,7 +2,6 @@
 
 import React from 'react'
 import Row from 'react-bootstrap/Row'
-import Col from 'react-bootstrap/Col'
 import OverlayTrigger from 'react-bootstrap/OverlayTrigger'
 import Tooltip from 'react-bootstrap/Tooltip'
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
@@ -46,7 +45,7 @@ export default function FairFilter({ url }: Props) {
 
     const tooltipFAIRfilters = (
         <Tooltip id="tooltipFAIRfilters">
-            See the repositories in re3data that meet the FAIR criterias.
+            See the repositories in re3data that meet the FAIR criteria.
         </Tooltip>
     )
 
@@ -83,16 +82,16 @@ export default function FairFilter({ url }: Props) {
 
 
     return (
-        <Row className="panel facets add"><Col>
+        <Row className="panel facets add">
             <OverlayTrigger placement="top" overlay={tooltipFAIRfilters}>
                 <h4>
-                    Criterias Compliance <FontAwesomeIcon icon={faQuestionCircle} />
+                    Criteria Compliance <FontAwesomeIcon icon={faQuestionCircle} />
                 </h4>
             </OverlayTrigger>
             <ul id="fair-filter">
                 {criterias.map(filterLink)}
             </ul>
-        </Col></Row>
+        </Row>
     )
 
 }
diff --git a/src/components/SearchOrganization/SearchOrganization.tsx b/src/components/SearchOrganization/SearchOrganization.tsx
@@ -94,6 +94,7 @@ export default function SearchOrganizations(props: Props) {
           id="country-facets"
           param="country"
           url="ror.org/?"
+          radio
         />
 
         <FacetList
@@ -102,6 +103,7 @@ export default function SearchOrganizations(props: Props) {
           id="organization-type-facets"
           param="types"
           url="ror.org/?"
+          radio
         />
       </FacetListGroup>
     )

diff --git a/src/components/SearchRepository/SearchRepository.tsx b/src/components/SearchRepository/SearchRepository.tsx
@@ -81,13 +81,15 @@ export default function SearchRepositories({ variables }: Props) {
         id="certificate"
         param="certificate"
         url="repositories/?"
+        radio
       />
       <FacetList
         data={repositories.software || []}
         title="Software"
         id="software"
         param="software"
         url="repositories/?"
+        radio
       />
     </FacetListGroup>)
   }

diff --git a/src/components/WorkFacets/WorkFacets.tsx b/src/components/WorkFacets/WorkFacets.tsx
@@ -64,23 +64,22 @@ export default function WorkFacets({
   const totalConnectionTypeCount = connectionTypesCounts ? connectionTypesCounts.references + connectionTypesCounts.citations + connectionTypesCounts.parts + connectionTypesCounts.partOf + connectionTypesCounts.otherRelated : 0
 
   const defaultActiveKeys = [ "authors-facets", "connection-type-facets", "published-facets", "work-type-facets", "license-facets", "language-facets", "field-of-science-facets", "registration-agency-facets" ]
+  const relatedWorkActiveKeys = [ "connection-type-facets" ]
+
+  const activeKeys = ['doi.org/?'].includes(url) ? defaultActiveKeys : relatedWorkActiveKeys
 
   return (
     <>
-      {!['doi.org?', 'orcid.org/?', 'ror.org/?'].includes(url) && (
-        <Card className="panel facets add mb-3">
-          <Card.Body>
-            <SearchBox path={path} />
-          </Card.Body>
-        </Card>
+      {!['doi.org/?', 'orcid.org/?', 'ror.org/?'].includes(url) && (
+        <SearchBox path={path} />
       )}
 
-      <FacetListGroup defaultActiveKey={defaultActiveKeys} >
+      <FacetListGroup defaultActiveKey={activeKeys} >
       {totalConnectionTypeCount > 0 && (
         <FacetList
           data={connectionTypeList.filter(f => f.count > 0)}
           title="Connection Types"
-          id="connections-type-facets"
+          id="connection-type-facets"
           param="connection-type"
           url={url}
           checked={(i) => !isConnectionTypeSet && i == 0}
@@ -101,7 +100,6 @@ export default function WorkFacets({
         param="published"
         url={url}
         radio
-        tooltipText="Filter by Publication Year"
       />
 
       <FacetList
@@ -110,6 +108,7 @@ export default function WorkFacets({
         id="work-type-facets"
         param="resource-type"
         url={url}
+        radio
       />
 
       <FacetList
@@ -118,6 +117,7 @@ export default function WorkFacets({
         id="license-facets"
         param="license"
         url={url}
+        radio
       />
 
       <FacetList
@@ -126,6 +126,7 @@ export default function WorkFacets({
         id="language-facets"
         param="language"
         url={url}
+        radio
       />
 
       <FacetList
@@ -134,6 +135,7 @@ export default function WorkFacets({
         id="field-of-science-facets"
         param="field-of-science"
         url={url}
+        radio
       />
 
       <FacetList
@@ -142,6 +144,7 @@ export default function WorkFacets({
         id="registration-agency-facets"
         param="registration-agency"
         url={url}
+        radio
       />
       </FacetListGroup>
     </>
-Original file line number
+Diff line change
@@ Expand Up / @@ -48,6 +48,7 @@ const AuthorsFacet: React.FunctionComponent<Props> = ({ @@
                 param="filterQuery"
                 url={url}
                 tooltipText={`This list includes only ${title} with ORCID iDs in DOI metadata.`}
+                radio
             />
         )
     }
@@ Expand Down @@