added thumbnail view or DS9 view for smaller fits file, solved SDC-88

src/components/archives/ArchiveDetails.js

 import React, { useContext } from "react";
 import { useParams } from "react-router-dom";
 import { GlobalContext } from "../../contexts/GlobalContext";
-import { QueryContextProvider } from "../../contexts/QueryContext";
 import {
   Container,
   Row,
@@ -77,9 +76,7 @@ export default function ArchiveDetails(props) {
             </Row>
             <Row className="pt-3">
               <Col>
-                <QueryContextProvider>
-                  <DataProductCategories archive={archive} />
-                </QueryContextProvider>
+                <DataProductCategories archive={archive} />
               </Col>
             </Row>
           </Col>

src/components/archives/DataProductCategories.js

@@ -46,8 +46,9 @@ export default function DataProductCategories({ archive }) {
                   // probably need to define onSubmit instead of point to query_url
                   <Button  
                     onClick={() => {
+                      console.log('onClick', category)
                       setDPLevel(category.level);
-                      setCollection(category.category);
+                      setCollection(category.collection);
                       history.push(query_url);}}
                   >
                     Browse Catalog & Run Queries

src/components/query/ASTRONVOResults.js

 import React, { useContext } from "react";
-import { Table, Alert } from "react-bootstrap";
+import { Table, Alert, Button } from "react-bootstrap";
+import { useHistory } from "react-router-dom";
 import { QueryContext } from "../../contexts/QueryContext";
 import LoadingSpinner from "../LoadingSpinner";
 import Paginate from "../Paginate";
 
 export default function ASTRONVOResults({ catalog }) {
-  const { queryMap, page, setPage } = useContext(QueryContext);
+  const { queryMap, page, setPage, setFits } = useContext(QueryContext);
+  const history = useHistory();
   if (!queryMap) return null;
   if (queryMap.get(catalog).status === "fetched") {
     if (!("results" in queryMap.get(catalog).results))
@@ -41,6 +43,7 @@ export default function ASTRONVOResults({ catalog }) {
               <th>Calibration Level</th>
               <th>Size</th>
               <th>Link to data</th>
+              <th></th>
             </tr>
           </thead>
           <tbody>
@@ -61,9 +64,30 @@ export default function ASTRONVOResults({ catalog }) {
                   <td>{Number((result.size / 1024).toFixed(1))} MB</td>
                   <td>
                     <a href={result.url} rel="noopener noreferrer" download>
-                      Download
+                      Download data
                     </a>
                   </td>
+                  <td>
+                    {/* if results is in .fits format and is smaller than 10 MB,
+                      display it with js9 */}
+                    {((result.url.includes('fits')  || (result.url.includes('FITS'))) && 
+                      Number(result.size) < 10000) ? 
+                      (<Button 
+                        onClick={() => {
+                          setFits(result.result);
+                          history.push('/fitsviewer');
+                        }}
+                      >View fits with DS9</Button>) :
+                      (result.thumbnail && (
+                        <a
+                          href={result.thumbnail}
+                          target="_blank"
+                          rel="noopener noreferrer"
+                          className="ml-3"
+                        >
+                          View Thumbnail
+                        </a>))}
+                  </td>
                 </tr>
               );
             })}

src/components/query/ApertifResults.js

@@ -41,6 +41,7 @@ export default function ApertifResults({ catalog }) {
               <th>Data Product Type</th>
               <th>Data Product Subtype</th>
               <th>Link to data</th>
+              <th></th>
             </tr>
           </thead>
           <tbody>
@@ -64,17 +65,20 @@ export default function ApertifResults({ catalog }) {
                       href={result.url}
                       target="_blank"
                       rel="noopener noreferrer"
+                      download
                     >
-                      View data
+                      Download data
                     </a>
-                    {result.dataProductSubType === "continuumMF" ? (
+                  </td>
+                  <td>
+                    {result.thumbnail ? (
                       <a
                         href={result.thumbnail}
                         target="_blank"
                         rel="noopener noreferrer"
                         className="ml-3"
                       >
-                        Thumbnail
+                        View Thumbnail
                       </a>
                     ) : null}
                   </td>

src/components/query/VOServiceResults.js

@@ -37,6 +37,7 @@ export default function VORegistryResults({ catalog }) {
           <thead>
             <tr className="bg-light">
               <th>Link to data</th>
+              <th></th>
             </tr>
           </thead>
           <tbody>
@@ -49,15 +50,25 @@ export default function VORegistryResults({ catalog }) {
                     </a>
                   </td>
                   <td>
-                    {/* if results is in .fits format
-                      display it with js9 */}
-                    {(result.result.endsWith('.fits')) && 
-                      <Button 
+                    {/* if results is in .fits format and is smaller than 10 MB,
+                    display it with js9 */}
+                    {((result.result.includes('fits')  || (result.result.includes('FITS'))) && 
+                      Number(result.size) < 10000) ? 
+                      (<Button 
                         onClick={() => {
                           setFits(result.result);
                           history.push('/fitsviewer');
                         }}
-                      >View fits</Button>}
+                      >View fits with DS9</Button>) :
+                      (result.thumbnail && (
+                        <a
+                          href={result.thumbnail}
+                          target="_blank"
+                          rel="noopener noreferrer"
+                          className="ml-3"
+                        >
+                          View Thumbnail
+                        </a>))}
                   </td>
                 </tr>
               );

src/contexts/QueryContext.js

@@ -31,8 +31,14 @@ export function QueryContextProvider({ children }) {
         console.log("collection value: ", collection);
         console.log("dplevel value: ", dplevel);
         Object.keys(props).map((key) => {
-          if (key == "collection")
+          if (key == "collection" && collection) {
             console.log("has key collection, default value is: ", props[key]["default"]);
+            props[key]["default"] = collection;
+          }
+          if (key == "level" && dplevel) {
+            console.log("has key dplevel, default value is: ", props[key]["default"]);
+            props[key]["default"] = dplevel;
+          }
         });
         setConfig(config);
       });

src/routes/Routes.js

@@ -7,7 +7,7 @@ import QueryCatalogs from "../components/query/QueryCatalogs";
 import QueryIVOARegistry from "../components/query/QueryIVOARegistry";
 import { BrowserRouter as Router } from "react-router-dom";
 import NavBar from "../components/NavBar";
-import { QueryContext, QueryContextProvider } from "../contexts/QueryContext";
+import { QueryContext } from "../contexts/QueryContext";
 import Rucio from "../components/Rucio";
 import Interactive from "../components/Interactive";
 import { IVOAContextProvider } from "../contexts/IVOAContext";