(edit) add the WarningCard to the contirbute page instead of Layout

AlexsLemonade · Sep 14, 2023 · 65e2c89 · 65e2c89
1 parent 71d3ff4
commit 65e2c89
Show file tree

Hide file tree

Showing 2 changed files with 39 additions and 15 deletions.
diff --git a/client/src/components/Layout.js b/client/src/components/Layout.js
@@ -4,7 +4,6 @@ import { useBanner } from 'hooks/useBanner'
 import { useResizeObserver } from 'hooks/useResizeObserver'
 import { Box, Main } from 'grommet'
 import { ContributeBanner } from 'components/ContributeBanner'
-import { ContributePageCard } from 'components/ContributePageCard'
 import { Footer } from 'components/Footer'
 import { Header } from 'components/Header'
 import { PageLoader } from 'components/PageLoader'
@@ -69,12 +68,6 @@ export const Layout = ({ children }) => {
   const includeContributeBanner = []
   const showContributeBanner = includeContributeBanner.includes(router.pathname)
 
-  // include the contribution page card in the following pages
-  const includeContributePageCard = ['/contribute']
-  const showContributePageCard = includeContributePageCard.includes(
-    router.pathname
-  )
-
   return (
     <Box height={{ min: '100vh' }}>
       <Box height={fixedBoxHeight}>
@@ -85,7 +78,6 @@ export const Layout = ({ children }) => {
         </FixedBox>
       </Box>
       {showContributeBanner && <ContributeBanner />}
-      {showContributePageCard && <ContributePageCard />}
       <Main
         width={showWide ? 'full' : 'xlarge'}
         alignSelf="center"

diff --git a/client/src/pages/contribute.js b/client/src/pages/contribute.js
@@ -2,6 +2,7 @@ import React from 'react'
 import {
   Box,
   Heading,
+  Paragraph,
   Table,
   TableCell,
   TableHeader as GrommetTableHeader,
@@ -11,6 +12,7 @@ import {
 import { Button } from 'components/Button'
 import { MarkdownPage } from 'components/MarkdownPage'
 import { Link } from 'components/Link'
+import { WarningCard } from 'components/WarningCard'
 import { config } from 'config'
 import contributionGuidelines from 'config/contribution-guidelines.md'
 import styled from 'styled-components'
@@ -133,13 +135,43 @@ export const Contribute = () => {
   }
 
   return (
-    <Box alignSelf="end" margin={{ top: 'large' }}>
-      <MarkdownPage
-        components={components}
-        markdown={contributionGuidelines}
-        width="xlarge"
-      />
-    </Box>
+    <>
+      <WarningCard label="We are NOT currently accepting contributions">
+        <Box
+          align="center"
+          direction="row"
+          gap="large"
+          justify="between"
+          pad={{ horizontal: 'small', bottom: 'xlarge' }}
+        >
+          <Box width={{ max: '750px' }}>
+            <Heading level={5} margin={{ bottom: 'small' }} size="16px">
+              Interested in contributing? Sign up to be notified.
+            </Heading>
+            <Paragraph>
+              If you have an existing single-cell dataset you are interested in
+              making available via the portal, please sign up to be notified
+              about future opportunities. In the future, there will be a process
+              for determining if your data meets the necessary requirements to
+              be shared on the portal.
+            </Paragraph>
+          </Box>
+          <Button
+            href={config.links.contribute_hsform}
+            label="Sign Up For Notifications"
+            target="_blank"
+            primary
+          />
+        </Box>
+      </WarningCard>
+      <Box alignSelf="end" margin={{ top: 'large' }}>
+        <MarkdownPage
+          components={components}
+          markdown={contributionGuidelines}
+          width="xlarge"
+        />
+      </Box>
+    </>
   )
 }