Merge remote-tracking branch 'origin/dev' into dev

pepkit · Feb 2, 2024 · efbc283 · efbc283
2 parents 849fa92 + 1c2b869
commit efbc283
Show file tree

Hide file tree

Showing 2 changed files with 52 additions and 3 deletions.
diff --git a/web/src/components/modals/download-geo.tsx b/web/src/components/modals/download-geo.tsx
@@ -0,0 +1,38 @@
+import { FC } from 'react';
+import { Modal } from 'react-bootstrap';
+
+interface Props {
+  show: boolean;
+  onHide: () => void;
+}
+
+export const DownloadGeo: FC<Props> = ({ show, onHide }) => {
+  return (
+    <Modal
+      centered
+      animation={false}
+      show={show}
+      onHide={() => {
+        onHide();
+      }}
+    >
+      <Modal.Header closeButton>
+        <h1 className="modal-title fs-5">Download all GEO metadata</h1>
+      </Modal.Header>
+      <Modal.Body>
+        <p>
+          This will download all available PEPs that we have for the Gene Expresion Omnibus. The file is about 1.1G and
+          will be downloaded as a single <code>tar</code> file.
+        </p>
+      </Modal.Body>
+      <Modal.Footer>
+        <button type="button" className="btn btn-dark">
+          Yes, download
+        </button>
+        <button type="button" className="btn btn-outline-dark" onClick={onHide}>
+          Nevemind
+        </button>
+      </Modal.Footer>
+    </Modal>
+  );
+};
diff --git a/web/src/pages/Namespace.tsx b/web/src/pages/Namespace.tsx
@@ -6,6 +6,7 @@ import { GitHubAvatar } from '../components/badges/github-avatar';
 import { PageLayout } from '../components/layout/page-layout';
 import { Pagination } from '../components/layout/pagination';
 import { AddPEPModal } from '../components/modals/add-pep';
+import { DownloadGeo } from '../components/modals/download-geo';
 import { NamespaceAPIEndpointsModal } from '../components/modals/namespace-api-endpoints';
 import { NamespaceBadge } from '../components/namespace/namespace-badge';
 import { NamespacePagePlaceholder } from '../components/namespace/namespace-page-placeholder';
@@ -45,6 +46,7 @@ export const NamespacePage: FC = () => {
   // state
   const [showAddPEPModal, setShowAddPEPModal] = useState(false);
   const [showEndpointsModal, setShowEndpointsModal] = useState(false);
+  const [showGeoDownloadModal, setShowGeoDownloadModal] = useState(false);
   const [view, setView] = useState<View>(viewFromUrl === 'stars' ? 'stars' : 'peps');
   const [starSearch, setStarSearch] = useState<string>(urlParams.get('starSearch') || '');
 
@@ -73,9 +75,6 @@ export const NamespacePage: FC = () => {
 
   const projectsFiltered = projects?.items.filter((p) => p.number_of_samples < MAX_SAMPLE_COUNT) || [];
 
-  console.log(stars);
-  console.log(view);
-
   // update url when search changes
   useEffect(() => {
     if (typeof window !== 'undefined' && search === '') {
@@ -143,6 +142,17 @@ export const NamespacePage: FC = () => {
               <i className="bi bi-hdd-rack me-1"></i>
               API
             </button>
+            {namespace === 'geo' && (
+              <button
+                className="btn btn-sm btn-dark"
+                onClick={() => {
+                  setShowGeoDownloadModal(true);
+                }}
+              >
+                <i className="bi bi-download me-1"></i>
+                Download
+              </button>
+            )}
             {user?.login === namespace || user?.orgs.includes(namespace || '') ? (
               <Fragment>
                 <button
@@ -264,6 +274,7 @@ export const NamespacePage: FC = () => {
           show={showEndpointsModal}
           onHide={() => setShowEndpointsModal(false)}
         />
+        <DownloadGeo show={showGeoDownloadModal} onHide={() => setShowGeoDownloadModal(false)} />
       </PageLayout>
     );
   }