misc cleanup (#206)

- copy: 'Tilt-Series' -> 'Tilt Series' - copy: 'Resolutions Available' -> 'Samplings Available' - hide aligned tilt series binning - disable unused run tab - hide unused how to cite tab - update navbar and footer - hide filter panel - remove unused pages - update landing page copy - remove 'own' from view datasets CTA addresses #84, #85, #204
chanzuckerberg · Dec 5, 2023 · 9276956 · 9276956
1 parent 25dde8f
commit 9276956
Show file tree

Hide file tree

Showing 13 changed files with 69 additions and 78 deletions.
diff --git a/frontend/packages/data-portal/app/components/BrowseData/BrowseDataTabs.tsx b/frontend/packages/data-portal/app/components/BrowseData/BrowseDataTabs.tsx
@@ -1,4 +1,4 @@
-import { useLocation, useNavigate } from '@remix-run/react'
+import { useLocation } from '@remix-run/react'
 import { useMemo } from 'react'
 import { useTypedLoaderData } from 'remix-typedjson'
 
@@ -11,34 +11,37 @@ export enum BrowseDataTab {
   Runs = 'runs',
 }
 
+// TODO: uncomment features when implemented
 export function BrowseDataTabs() {
-  const navigate = useNavigate()
+  // const navigate = useNavigate()
   const { pathname } = useLocation()
   const tab = pathname.includes('/browse-data/datasets')
     ? BrowseDataTab.Datasets
     : BrowseDataTab.Runs
 
   const data = useTypedLoaderData<GetToolbarDataQuery>()
   const datasetCount = data.datasets_aggregate.aggregate?.count ?? 0
-  const runCount = data.runs_aggregate.aggregate?.count ?? 0
+  // const runCount = data.runs_aggregate.aggregate?.count ?? 0
 
   const tabOptions = useMemo<TabData<BrowseDataTab>[]>(
     () => [
       {
         label: i18n.datasetsTab(datasetCount),
         value: BrowseDataTab.Datasets,
       },
-      {
-        label: i18n.runsTab(runCount),
-        value: BrowseDataTab.Runs,
-      },
+      // {
+      //   label: i18n.runsTab(runCount),
+      //   value: BrowseDataTab.Runs,
+      // },
     ],
-    [datasetCount, runCount],
+    [datasetCount],
+    // [datasetCount, runCount],
   )
 
   return (
     <Tabs
-      onChange={(nextTab) => navigate(`/browse-data/${nextTab}`)}
+      // onChange={(nextTab) => navigate(`/browse-data/${nextTab}`)}
+      onChange={() => null}
       value={tab}
       tabs={tabOptions}
     />

diff --git a/frontend/packages/data-portal/app/components/Index/IndexContributors.tsx b/frontend/packages/data-portal/app/components/Index/IndexContributors.tsx
@@ -10,7 +10,7 @@ Jane Ding
 Ben Engel
 Ryan Feathers
 Sara Goetz
-Danielle Grotjhan
+Danielle Grotjahn
 Gus Hart
 Grant Jensen
 Mohammed Kaplan

diff --git a/frontend/packages/data-portal/app/components/Layout/AboutAndHelpDropdown.tsx b/frontend/packages/data-portal/app/components/Layout/AboutAndHelpDropdown.tsx
@@ -3,31 +3,31 @@ import { MenuItemHeader } from 'app/components/MenuItemHeader'
 import { MenuItemLink } from 'app/components/MenuItemLink'
 import { i18n } from 'app/i18n'
 
+const REPO = 'https://github.com/chanzuckerberg/cryoet-data-portal'
+
 export function AboutAndHelpDropdown({ className }: { className?: string }) {
   return (
     <MenuDropdown className={className} title={i18n.aboutAndHelp}>
       <MenuItemHeader>{i18n.about}</MenuItemHeader>
 
       <MenuItemLink to="/faq">{i18n.faq}</MenuItemLink>
-      <MenuItemLink to="/license">{i18n.license}</MenuItemLink>
+      {/* <MenuItemLink to="/license">{i18n.license}</MenuItemLink> */}
       <MenuItemLink to="/privacy">{i18n.privacyPolicy}</MenuItemLink>
-      <MenuItemLink to="/terms" divider>
+      {/* <MenuItemLink to="/terms" divider>
         {i18n.termsOfUse}
-      </MenuItemLink>
+      </MenuItemLink> */}
 
       <MenuItemHeader>{i18n.helpAndReport}</MenuItemHeader>
 
-      <MenuItemLink to="https://chanzuckerberg.github.io/cryoet-data-portal/">
+      <MenuItemLink to="https://chanzuckerberg.github.io/cryoet-data-portal">
         {i18n.goToDocs}
       </MenuItemLink>
 
-      <MenuItemLink to="https://github.com/chanzuckerberg/cryoet-data-portal/issues">
-        {i18n.api}
+      <MenuItemLink to={`${REPO}/issues`}>
+        {i18n.reportIssueOnGithub}
       </MenuItemLink>
 
-      <MenuItemLink to="https://example.com">
-        {i18n.submitFeedback}
-      </MenuItemLink>
+      <MenuItemLink to={`${REPO}/discussions`}>{i18n.askOnGitHub}</MenuItemLink>
     </MenuDropdown>
   )
 }
diff --git a/frontend/packages/data-portal/app/components/Layout/CryoETHomeLink.tsx b/frontend/packages/data-portal/app/components/Layout/CryoETHomeLink.tsx
@@ -1,15 +1,15 @@
-import { CryoETIcon } from 'app/components/icons'
 import { Link } from 'app/components/Link'
 import { i18n } from 'app/i18n'
 
 export function CryoETHomeLink() {
   return (
-    <div className="flex items-center gap-1 text-sds-gray-white">
-      <CryoETIcon />
-
+    <div className="flex items-center gap-sds-s text-sds-gray-white">
       <Link className="text-sds-header-m font-semibold ml-2 " to="/">
         {i18n.title}
       </Link>
+      <div className="px-sds-xs py-sds-xxxs bg-sds-info-400 rounded-sds-m text-sds-body-xxxs">
+        {i18n.beta}
+      </div>
     </div>
   )
 }
diff --git a/frontend/packages/data-portal/app/components/Layout/Footer.tsx b/frontend/packages/data-portal/app/components/Layout/Footer.tsx
@@ -29,19 +29,19 @@ const DEV_LINKS = [
 const LEGAL_LINKS = [
   {
     label: i18n.privacy,
-    href: 'https://example.com',
-  },
-  {
-    label: i18n.terms,
-    href: 'https://example.com',
-  },
-  {
-    label: i18n.license,
-    href: 'https://example.com',
+    href: '/privacy',
   },
+  // {
+  //   label: i18n.terms,
+  //   href: 'https://example.com',
+  // },
+  // {
+  //   label: i18n.license,
+  //   href: 'https://example.com',
+  // },
   {
     label: i18n.cookiePolicy,
-    href: 'https://example.com',
+    href: '/data-submission-policy',
   },
 ]
 

diff --git a/frontend/packages/data-portal/app/components/MetadataDrawer.tsx b/frontend/packages/data-portal/app/components/MetadataDrawer.tsx
@@ -19,10 +19,10 @@ const TAB_OPTIONS: TabData<MetadataTab>[] = [
     label: i18n.metadata,
     value: MetadataTab.Metadata,
   },
-  {
-    label: i18n.howToCite,
-    value: MetadataTab.HowToCite,
-  },
+  // {
+  //   label: i18n.howToCite,
+  //   value: MetadataTab.HowToCite,
+  // },
 ]
 
 const ACTIVE_TAB_PARAM = 'tab'
@@ -109,12 +109,13 @@ export function MetadataDrawer({
             className="!m-0"
             tabs={TAB_OPTIONS}
             value={activeTab}
-            onChange={(tab) =>
-              setSearchParams((params) => {
-                params.set(ACTIVE_TAB_PARAM, tab)
-                return params
-              })
-            }
+            onChange={() => null}
+            // onChange={(tab) =>
+            //   setSearchParams((params) => {
+            //     params.set(ACTIVE_TAB_PARAM, tab)
+            //     return params
+            //   })
+            // }
           />
         </div>
 

diff --git a/frontend/packages/data-portal/app/components/Run/RunTiltSeriesTable.tsx b/frontend/packages/data-portal/app/components/Run/RunTiltSeriesTable.tsx
@@ -21,7 +21,8 @@ const SELECT_FIELDS = [
   TiltSeriesKeys.TotalFlux,
   TiltSeriesKeys.BinningFromFrames,
   TiltSeriesKeys.SeriesIsAligned,
-  TiltSeriesKeys.AlignedBinning,
+  // not done on the backend yet
+  // TiltSeriesKeys.AlignedBinning,
   TiltSeriesKeys.RelatedEmpiarEntry,
 ]
 

diff --git a/frontend/packages/data-portal/app/i18n.ts b/frontend/packages/data-portal/app/i18n.ts
@@ -15,7 +15,7 @@ export const i18n = {
   affiliationName: 'Affiliation Name',
   affiliationNames: 'Affiliation Names',
   affineTransformationMatrix: 'Affine Transformation Matrix',
-  alignedTiltSeriesBinning: 'Aligned Tilt-Series Binning',
+  alignedTiltSeriesBinning: 'Aligned Tilt Series Binning',
   annotatedObjects: 'Annotated Objects',
   annotationConfidence: 'Annotation Confidence',
   annotationDetails: 'Annotation Details',
@@ -27,6 +27,7 @@ export const i18n = {
   annotationSoftware: 'Annotation Software',
   api: 'API',
   apply: 'Apply',
+  askOnGitHub: 'Ask a Question on GitHub',
   author: 'Author',
   authorName: 'Author Name',
   authorOrcid: 'Author ORCID',
@@ -35,6 +36,7 @@ export const i18n = {
   availableFiles: 'Available Files',
   availableProcessing: 'Available Processing',
   backToResults: 'Back to Results',
+  beta: 'Beta',
   bingingFromFrames: 'Binning from Frames',
   browseData: 'Browse Data',
   cameraManufacturer: 'Camera Manufacturer',
@@ -146,7 +148,7 @@ export const i18n = {
   releaseDate: (date: string) => `Release Date: ${date}`,
   releaseDateBlank: 'Release Date',
   reportIssueOnGithub: 'Report Issue on GitHub',
-  resolutionsAvailable: 'Resolutions Available',
+  resolutionsAvailable: 'Samplings Available',
   run: 'Run',
   runCount: (count: number, max: number) => `${count} of ${max} Runs`,
   runDetails: 'Run Details',
@@ -174,10 +176,10 @@ export const i18n = {
     'Angle is in degrees (°). Tilt range is the difference between the max tilt angle and the min tilt angle.',
   tiltRangeFilterTitle: 'Add min/max angle to define filter range:',
   tiltScheme: 'Tilt Scheme',
-  tiltSeries: 'Tilt-Series',
-  tiltSeriesAlignment: 'Tilt-Series Alignment',
-  tiltSeriesMetadata: 'Tilt-Series Metadata',
-  tiltSeriesQualityScore: 'Tilt-Series Quality Score',
+  tiltSeries: 'Tilt Series',
+  tiltSeriesAlignment: 'Tilt Series Alignment',
+  tiltSeriesMetadata: 'Tilt Series Metadata',
+  tiltSeriesQualityScore: 'Tilt Series Quality Score',
   tiltStep: 'Tilt Step',
   tissueName: 'Tissue Name',
   title: 'CryoET Data Portal',

diff --git a/frontend/packages/data-portal/app/routes/browse-data.datasets.tsx b/frontend/packages/data-portal/app/routes/browse-data.datasets.tsx
@@ -9,7 +9,6 @@ import { gql } from 'app/__generated__'
 import { Datasets_Bool_Exp, Order_By } from 'app/__generated__/graphql'
 import { apolloClient } from 'app/apollo.server'
 import { DatasetTable } from 'app/components/BrowseData'
-import { DatasetFilter } from 'app/components/DatasetFilter'
 import { NoResults } from 'app/components/NoResults'
 import { TablePageLayout } from 'app/components/TablePageLayout'
 import { MAX_PER_PAGE } from 'app/constants/pagination'
@@ -288,7 +287,7 @@ export default function BrowseDatasetsPage() {
     <TablePageLayout
       type={i18n.datasets}
       filteredCount={filteredDatasetCount}
-      filters={<DatasetFilter />}
+      // filters={<DatasetFilter />}
       table={<DatasetTable />}
       totalCount={datasetCount}
       noResults={

diff --git a/frontend/packages/data-portal/app/routes/browse-data.runs.tsx b/frontend/packages/data-portal/app/routes/browse-data.runs.tsx
diff --git a/frontend/packages/data-portal/app/routes/license.tsx b/frontend/packages/data-portal/app/routes/license.tsx
diff --git a/frontend/packages/data-portal/app/routes/terms.tsx b/frontend/packages/data-portal/app/routes/terms.tsx
diff --git a/frontend/packages/data-portal/public/locales/en/translation.json b/frontend/packages/data-portal/public/locales/en/translation.json
@@ -6,7 +6,7 @@
   "affiliationName": "Affiliation Name",
   "affiliationNames": "Affiliation Names",
   "affineTransformationMatrix": "Affine Transformation Matrix",
-  "alignedTiltSeriesBinning": "Aligned Tilt-Series Binning",
+  "alignedTiltSeriesBinning": "Aligned Tilt Series Binning",
   "all": "All",
   "annotatedObjects": "Annotated Objects",
   "annotationConfidence": "Annotation Confidence",
@@ -20,6 +20,7 @@
   "api": "API",
   "apiDocLink": "https://chanzuckerberg.github.io/cryoet-data-portal",
   "apply": "Apply",
+  "askOnGithub": "Ask a Question on GitHub",
   "author": "Author",
   "authorName": "Author Name",
   "authorOrcid": "Author ORCID",
@@ -30,6 +31,7 @@
   "awsCliLink": "https://docs.aws.amazon.com/cli/latest/userguide/getting-started-install.html",
   "back": "Back",
   "backToResults": "Back to Results",
+  "beta": "Beta",
   "bingingFromFrames": "Binning from Frames",
   "browse": "Browse",
   "browseData": "Browse Data",
@@ -116,7 +118,7 @@
   "landingHeaderImageAttribution": "Top Image: The inner workings of an algal cell as depicted with cryo-electron tomography, which aggregates multiple snapshots of a single piece of material. Visible are the Golgi apparatus (green and magenta), and vesicles (multi-colored circles). | Photo credit: Y. S. Bykkov et al./eLIFE (CC BY 4.0)",
   "landingHeaderTitle": "Open access to annotated cryoET tomograms",
   "landingPageCopy1": "Currently, annotating tomograms from cryo-electron tomography (cryoET) experiments is a tedious, time-consuming, and often manual process. Our goal is to accelerate this process by catalyzing the development of sophisticated machine-learning methods for automatic annotation, helping researchers find scientific insights faster.",
-  "landingPageCopy2": "The portal provides biologists and developers open access to high-quality, standardized, annotated data they can readily use to retrain or develop new annotation models and algorithms. Currently, the portal contains 13,861 tomograms from 53 datasets contributed by the groups of Julia Mahamid, Jürgen Plitzko, David Agard, John Briggs, Abhay Kotecha, Ben Engel, Danielle Grotjhan, and Grant Jensen.",
+  "landingPageCopy2": "The portal provides biologists and developers open access to high-quality, standardized, annotated data they can readily use to retrain or develop new annotation models and algorithms. Currently, the portal contains 13,861 tomograms from 53 datasets contributed by the groups of Julia Mahamid, Jürgen Plitzko, David Agard, John Briggs, Abhay Kotecha, Ben Engel, Danielle Grotjahn, and Grant Jensen.",
   "landingPageCopy3": "All tomograms include rich standardized metadata such as data tree structure and naming conventions. Most groups have already provided annotations for their data, and there is a structure to add new annotations to existing tomograms.",
   "landingPageCopy4": "We are actively growing the number of annotated datasets on the portal and encourage researchers to <url to='$t(urlDataContributionForm)'>share their data</url>. We are actively growing the number of annotated datasets on the CZ Imaging Institute portal and encourage researchers to share their data. We are working with <url to='$t(urlEMPIAR)'>EMPIAR</url> to host the data and support annotation.",
   "landingPageCopy5": "Ultimately, our vision is to contribute to developing a large, open-access database of annotated and validated 3D structural information for cells that researchers can use to gain new insights into cellular and structural biology.",
@@ -172,7 +174,7 @@
   "releaseDate": "Release Date: {{date}}",
   "releaseDateBlank": "Release Date",
   "reportIssueOnGithub": "Report Issue on GitHub",
-  "resolutionsAvailable": "Resolutions Available",
+  "resolutionsAvailable": "Samplings Available",
   "run": "Run",
   "runDataIncludes": "Run data includes all available movie frames, tilt series image stack, tomograms, annotations, and associated metadata.",
   "runDetails": "Run Details",
@@ -205,10 +207,10 @@
   "tiltRangeFilterDescription": "Angle is in degrees (°). Tilt range is the difference between the max tilt angle and the min tilt angle.",
   "tiltRangeFilterTitle": "Add min/max angle to define filter range:",
   "tiltScheme": "Tilt Scheme",
-  "tiltSeries": "Tilt-Series",
-  "tiltSeriesAlignment": "Tilt-Series Alignment",
-  "tiltSeriesMetadata": "Tilt-Series Metadata",
-  "tiltSeriesQualityScore": "Tilt-Series Quality Score",
+  "tiltSeries": "Tilt Series",
+  "tiltSeriesAlignment": "Tilt Series Alignment",
+  "tiltSeriesMetadata": "Tilt Series Metadata",
+  "tiltSeriesQualityScore": "Tilt Series Quality Score",
   "tiltStep": "Tilt Step",
   "tissueName": "Tissue Name",
   "title": "CryoET Data Portal",
@@ -227,15 +229,15 @@
   "unitVolts": "{{value}} V",
   "urlCZ": "https://chanzuckerberg.com/",
   "urlCZII": "https://www.czimaginginstitute.org/",
-  "urlDataContributionForm": "https://airtable.com/apppmytRJXoXYTO9w/shr5UxgeQcUTSGyiY?prefill_Event=Contribution+from+portal&hide_Event=true",
+  "urlDataContributionForm": "https://airtable.com/apppmytRJXoXYTO9w/shr5UxgeQcUTSGyiY?prefill_Event=Portal&hide_Event=true",
   "urlEMPIAR": "https://www.ebi.ac.uk/empiar/",
   "valueToValue": "{{value1} to {value2}}",
   "veryPoor": "Very Poor",
   "viaApi": "via API",
   "viaAwsS3": "via AWS S3",
   "viaCurl": "via cURL",
   "viewAndDownloadDatasets": "View and Download Datasets",
-  "viewDatasetsCta": "Find and visualize cryoET datasets in the portal and download to use for your own work.",
+  "viewDatasetsCta": "Find and visualize cryoET datasets in the portal and download to use for your work.",
   "viewTomogram": "View Tomogram",
   "voxelSpacingId": "Voxel Spacing ID",
   "yes": "Yes",