Merge branch 'dev-nico' into 'master'

Dev nico

See merge request astron-sdc/esap-gui!10

src/components/basket/addtobasket.js

@@ -4,7 +4,7 @@ import { Form } from "react-bootstrap";
 import { GlobalContext } from "../../contexts/GlobalContext";
 import { BasketContext } from "../../contexts/BasketContext";
 
-export default function Addtobasket(props) {
+export default function AddtoBasket(props) {
   const { isAuthenticated } = useContext(GlobalContext);
   const basketContext = useContext(BasketContext);
 
@@ -23,7 +23,10 @@ export default function Addtobasket(props) {
     console.log([removeFromBasketItem, basketContext]);
   }
 
-  if (isAuthenticated){
+  // fake authentication when in 'development' mode.
+  let authenticated = isAuthenticated || (process.env.NODE_ENV === "development")
+
+  if (authenticated){
     return (
       <Form.Check id={props.id} type="checkbox" onChange={(event) => {
         const action = event.target.checked ? addToBasket : removeFromBasket;

src/components/basket/savebasket.js

@@ -17,6 +17,7 @@ export default function SaveBasket(props) {
     axios
       .get(profileUrl, {withCredentials: true})
       .then((response) => {
+        console.log(response.data)
         const userProfileUrl = profileUrl + response.data.results[0].user_name + "/";
 
         axios
@@ -33,8 +34,11 @@ export default function SaveBasket(props) {
       });
   }
 
+  // fake authentication when in 'development' mode.
+  let authenticated = isAuthenticated || (process.env.NODE_ENV === "development")
+
+  if(authenticated) {
 
-  if(isAuthenticated){
     return (
         <Button
           type="button"

src/components/query/QueryResults.js

@@ -5,6 +5,7 @@ import ZooniverseResults from "./ZooniverseResults";
 import VORegListResults from "./VORegListResults";
 import LOFARResults from "./LOFARResults";
 import RucioResults from "./RucioResults";
+import SampResults from "./SampResults";
 
 export default function QueryResults({ catalog }) {
   switch (catalog) {
@@ -22,6 +23,8 @@ export default function QueryResults({ catalog }) {
       return <LOFARResults catalog={catalog} />;
     case "rucio":
       return <RucioResults catalog={catalog} />;
+    case "samp":
+      return <SampResults catalog={catalog} />;
     default:
       return null;
   }

src/components/query/SampResults.js

+import React, { useContext, useState, useEffect } from "react";
+import SampPage from './samp/SampPage';
+
+// TODO: this is not hooked up to the database yet as a catalog
+export default function SampResults({ catalog }) {
+    return <SampPage/>
+}

src/components/query/samp/SampGrid.js

-import React from "react";
+import React, {useState, useContext }  from 'react';
 import { Table } from "react-bootstrap";
+import { BasketContext } from "../../../contexts/BasketContext";
+import AddToBasket from "../../basket/addtobasket";
+
+function SAMPBasketItem(record){
+    return {
+        archive: "samp",
+        record: record,
+    };
+}
 
 export default function SampResults(props) {
+    const basketContext = useContext(BasketContext);
 
     let fieldnames = props.fieldnames
     let data = props.votable_in_json['data']
@@ -12,6 +22,7 @@ export default function SampResults(props) {
             <thead>
 
             <tr className="bg-light">
+                <th>Select</th>
                 {fieldnames.map((field) => {
                     return (
                         <th key={field}>{field}</th>
@@ -22,9 +33,18 @@ export default function SampResults(props) {
 
             </thead>
             <tbody>
-                {data.map((record) => {
+
+                {data.map((record, index) => {
+
+                    let id = `samp${index}`
+                    if (index > 10) {
+                        return
+                    }
                     return (
                         <tr key={record}>
+                            <td>
+                                <AddToBasket id={id}  item={SAMPBasketItem(record)} />
+                            </td>
                             {record.map((col) => {
                                 let value = col.toString()
 

src/components/query/samp/SampPage.js

-import React, {useState }  from 'react';
+import React, {useState, useContext }  from 'react';
 
 import { getVOTableAsJSON } from './ReactVOTable'
 import SampGrid from './SampGrid'
+import { GlobalContext } from "../../../contexts/GlobalContext";
+import { QueryContext } from "../../../contexts/QueryContext";
+import { BasketContext } from "../../../contexts/BasketContext";
+import SaveBasket from "../../basket/savebasket";
+
 
 export default function SampPage(props) {
+    const context = useContext(QueryContext);
+    const basketContext = useContext(BasketContext);
+
     const [ myVOTable, setMyVOTable] = useState([]);
 
     // register to existing SAMP hub
@@ -88,6 +96,7 @@ export default function SampPage(props) {
                 <p>Start a SAMP enabled application (like Topcat), register to the hub and transmit data from Topcat.</p>
                 <button variant="outline-warning" onClick={() => register()}>register</button>&nbsp;
                 <button variant="outline-warning" onClick={() => unregister()}>unregister</button>&nbsp;
+                <SaveBasket />
 
                 {renderSampGrid}
             </div>

src/contexts/GlobalContext.js

@@ -18,7 +18,7 @@ export function GlobalContextProvider({ children }) {
   
   const api_host =
     process.env.NODE_ENV === "development"
-      ? "http://localhost:8000/esap-api/"
+      ? "http://localhost:5555/esap-api/"
       : "https://sdc-dev.astron.nl:5555/esap-api/";
   // "https://sdc.astron.nl:5555/esap-api/"
   // "http://localhost:5555/esap-api/"

src/routes/Routes.js

@@ -10,6 +10,7 @@ import NavBar from "../components/NavBar";
 import Rucio from "../components/Rucio";
 import Interactive from "../components/Interactive";
 
+import { BasketContextProvider } from "../contexts/BasketContext";
 import { IVOAContextProvider } from "../contexts/IVOAContext";
 import { IDAContext } from "../contexts/IDAContext";
 import SampPage from '../components/query/samp/SampPage';
@@ -49,9 +50,13 @@ export default function Routes() {
         <Route exact path={["/adex-query", "/archives/:uri/query"]}>
           <QueryCatalogs />
         </Route>
-        <Route exact path="/samp" component={SampPage} />
+        <Route exact path="/samp"  >
+          <BasketContextProvider>
+            <SampPage/>
+          </BasketContextProvider>
+        </Route>
       </Switch>
-      <footer><small>esap-gui version 30 april 2021 11:00</small></footer>
+      <footer><small>esap-gui version 18 may 2021</small></footer>
     </Router>
   );
 }