adding VO registry of registeries. Requires to move from dataset based...

adding VO registry of registeries. Requires to move from dataset based querying to query based querying

src/components/cards/QueryCard.js

+import React from 'react';
+import {Card, Table } from 'react-bootstrap'
+
+import { useGlobalReducer } from '../../Store';
+
+import DocumentationLink from '../buttons/DocumentationLink'
+
+
+// display a single query on a card
+export default function QueryCard(props) {
+
+    const [ my_state , my_dispatch] = useGlobalReducer()
+
+    // only show if there is content
+    if (!props.query) {
+        return null
+    }
+
+    return (
+
+        <Card className="card-description">
+            <Card.Body>
+                <Card.Title>{props.query.dataset_name}</Card.Title>
+                <Card.Text>
+                    <Table striped bordered hover size="sm">
+                        <tbody>
+                        <tr>
+                            <td className="key">ID</td>
+                            <td className="value">{props.query.query_id}</td>
+                        </tr>
+                        <tr>
+                            <td className="key">Query</td>
+                            <td className="value">{props.query.query}</td>
+                        </tr>
+                        <tr>
+                            <td className="key">Description</td>
+                            <td className="value">{props.query.res_description}</td>
+                        </tr>
+                        </tbody>
+                    </Table>
+
+                </Card.Text>
+                <DocumentationLink url={props.query.reference_url}/>&nbsp;
+            </Card.Body>
+
+        </Card>
+
+    );
+
+}
+
+

src/hooks/useFetchRunQuery.js

@@ -41,14 +41,8 @@ export const useFetchRunQuery = (url, options) => {
             // this sets the json in the response, which is in itself a useState hook
             setResponse(json);
 
-            //let query_results = {}
-            //query_results[query] = json.query_results
-
             // dispatch the fetched data (per query) and the status to the global state
             my_dispatch({type: SET_FETCHED_QUERY_RESULTS, fetched_query_results: json.query_results})
-
-            //query_status = query+":fetched"
-            //query_status_object[query]=query_status
             my_dispatch({type: SET_STATUS_RUN_QUERY, status_run_query: query+":fetched"})
 
 

src/routes/query/QueryArchives.js

@@ -238,8 +238,7 @@ export default function QueryArchives(props) {
         // clear previous results
         my_dispatch({type: SET_FETCHED_QUERY_INPUT, fetched_query: undefined})
 
-
-        my_dispatch({type: SET_FETCHED_QUERY_RESULTS, fetched_query_results: {}})
+        //my_dispatch({type: SET_FETCHED_QUERY_RESULTS, fetched_query_results: {}})
 
         // this clears the output results grid/tiles of the executed queries
         my_dispatch({type: SET_STATUS_RUN_QUERY, status_run_query: undefined})
@@ -248,7 +247,7 @@ export default function QueryArchives(props) {
         let queries = my_state.queries_to_run
         if (queries) {
             for (var i = 0; i < queries.length; i++) {
-                my_dispatch({type: SET_STATUS_RUN_QUERY, status_run_query: queries[i].dataset_name + ":fetched"})
+                my_dispatch({type: SET_STATUS_RUN_QUERY, status_run_query: queries[i].dataset_name + ":n/a"})
 
             }
         }

src/routes/query/QueryInputResultsGrid.js

@@ -70,17 +70,25 @@ export default function QueryInputResultsGrid(props) {
 
     const columns = [
         {
-            name: 'dataset uri',
-            selector: 'dataset',
+            name: 'ID',
+            selector: 'query_id',
             sortable: true,
             width: "10%"
         },
         {
-            name: 'dataset name',
+            name: 'dataset',
             selector: 'dataset_name',
             sortable: true,
             width: "15%"
         },
+/*
+        {
+            name: 'Waveband',
+            selector: 'waveband',
+            sortable: true,
+            width: "10%"
+        },
+*/
 /*
         {
             name: 'service',
@@ -88,20 +96,26 @@ export default function QueryInputResultsGrid(props) {
             sortable: true,
             width: "5%"
         },
-*/
+
         {
             name: 'service connector',
             selector: 'service_connector',
             sortable: true,
             width: "10%"
         },
-
+*/
         {
             name: 'status',
             sortable: true,
             width: "10%",
             cell: row => getStatus(row),
         },
+        {
+            name: 'access_url',
+            sortable: true,
+            width: "20%",
+            selector: 'service_url',
+        },
 /*
         {
             name: 'resource',
@@ -110,6 +124,7 @@ export default function QueryInputResultsGrid(props) {
             width: "10%"
         },
 */
+/*
         {
             name: 'query',
             selector: 'query',
@@ -119,6 +134,16 @@ export default function QueryInputResultsGrid(props) {
                     {row.query} 
                 </a>,
         },
+*/
+        {
+            name: 'Reference',
+            selector: 'reference_url',
+            sortable: true,
+            cell: row =>
+                <a href={row.reference_url} target="_blank">
+                    {row.reference_url}&nbsp;
+                </a>,
+        },
 
     ];
 

src/routes/query/QueryOutputResultsGrid.js

@@ -9,6 +9,7 @@ import { getBackendUrl } from '../../utils/web'
 
 import AddToBasketButton from '../../components/buttons/AddToBasketButton'
 import DataProductImageCard from '../../components/cards/DataProductImageCard'
+import QueryCard from '../../components/cards/QueryCard'
 
 // the definition of the columns
 // moved outside of the main function so that it will not rerender
@@ -80,13 +81,12 @@ export default function QueryOutputResultsGrid(props) {
             sortable: true,
             width: "20%"
         },
-
         {
             name: 'Result',
             selector: 'result',
             sortable: true,
             cell: row => drawResult(row),
-            width: "20%"
+            //width: "20%"
         },
         {
             name: 'Link to data',
@@ -121,19 +121,18 @@ export default function QueryOutputResultsGrid(props) {
     // get the query results from the state
     let datasetsToQuery = my_state.queries_to_run
     let data
-    let title = "Query Results (List)"
 
-    if (props.dataset) {
-        // filter the data on dataset
-        title = "Query Results: " + props.dataset.dataset_name
-        let key = "fetched_query_results." + props.dataset.dataset_name
-        data = my_state[key]
+    if (props.query) {
+        // dataset is given as a parameter (current situation)
+        data = my_state["fetched_query_results." + props.query.dataset_name]
     } else
 
     if (props.data) {
+        // data is given as a parameter (currently not used)
        data = props.data
 
     } else {
+
         // combine the results from different queries.
         // iterate through the results of the several queries
         data = []
@@ -152,11 +151,12 @@ export default function QueryOutputResultsGrid(props) {
         // alert('total length = ' + data.length.toString())
     }
 
+    let queryCard = <QueryCard query={props.query}/>
+
     return (
         <div>
-            <h4>&nbsp;&nbsp;{title}</h4>
+            {queryCard}
             <DataTable
-                // title="Query Results"
                 columns={columns}
                 data={data}
                 striped={true}

src/routes/query/QueryOutputResultsTiles.js

@@ -6,6 +6,7 @@ import { useGlobalReducer } from '../../Store';
 import { SET_ACTIVE_DATASET } from '../../reducers/GlobalStateReducer'
 import { getBackendUrl } from '../../utils/web'
 
+import QueryCard from '../../components/cards/QueryCard'
 import AddToBasketButton from '../../components/buttons/AddToBasketButton'
 
 import Tiles from '../../components/Tiles'
@@ -20,10 +21,10 @@ export default function QueryOutputResultsTiles(props) {
     // iterate through the results of the several queries
     data = []
 
-    if (props.dataset) {
+    if (props.query) {
         // filter the data on dataset
-        title = "Query Results: " + props.dataset.dataset_name
-        let key = "fetched_query_results." + props.dataset.dataset_name
+        title = "Query Results: " + props.query.dataset_name
+        let key = "fetched_query_results." + props.query.dataset_name
         data = my_state[key]
     } else
 
@@ -51,9 +52,11 @@ export default function QueryOutputResultsTiles(props) {
         renderData = <Tiles data = {data} />
     }
 
+    let queryCard = <QueryCard query={props.query}/>
+
     return (
         <div>
-            <h4>&nbsp;&nbsp;{title}</h4>
+            {queryCard}
             <div className="App">
 
                 <Container fluid>

src/routes/query/QueryResultsPage.js

@@ -21,11 +21,11 @@ export default function QueryResultsPage(props) {
     // get the query results from the state
     let renderOutputResults
 
-    const renderQueryResults = (dataset) => {
-        if (dataset.output_format.toUpperCase()==='TILES') {
-            return <QueryOutputResultsTiles dataset={dataset}/>
+    const renderQueryResults = (query) => {
+        if (query.output_format.toUpperCase()==='TILES') {
+            return <QueryOutputResultsTiles query={query}/>
         } else {
-            return <QueryOutputResultsGrid dataset={dataset}/>
+            return <QueryOutputResultsGrid query={query}/>
         }
     }
 
@@ -39,7 +39,6 @@ export default function QueryResultsPage(props) {
             // iterate through the results of the several queries
 
             renderOutputResults = my_state.queries_to_run.map(query => {
-                //let key = "fetched_query_results." + dataset.dataset
                 let key = "fetched_query_results." + query.dataset_name
                 let resultsPerQuery = my_state[key]