From c972c44c2e5adbf712448e65dba25df500ca7bca Mon Sep 17 00:00:00 2001
From: stvoutsin <steliosvoutsinas@yahoo.com>
Date: Tue, 16 Nov 2021 14:43:32 +0200
Subject: [PATCH] Added Loading message to Workflows search page / Move code
from IDAContext to service
---
src/components/services/Interactive.js | 48 ++++++++++++++++++++++++--
src/contexts/IDAContext.js | 21 -----------
2 files changed, 46 insertions(+), 23 deletions(-)
diff --git a/src/components/services/Interactive.js b/src/components/services/Interactive.js
index 3224b0d..fb4a207 100644
--- a/src/components/services/Interactive.js
+++ b/src/components/services/Interactive.js
@@ -1,8 +1,10 @@
-import React, { useContext } from "react";
+import React, { createContext, useState, useEffect, useContext } from "react";
+import axios from "axios";
import { Button, Form, Container, Alert } from "react-bootstrap";
import { IDAContext } from "../../contexts/IDAContext";
import { GlobalContext } from "../../contexts/GlobalContext";
import "../../assets/Interactive.css";
+import LoadingSpinner from "../LoadingSpinner";
export default function Interactive() {
@@ -15,6 +17,32 @@ export default function Interactive() {
const [showMoreButton, setShowMoreButton] = React.useState(true);
const [showDeploy, setShowDeploy] = React.useState(false);
const [numberOfitemsShown, setNumberOfitemsShown] = React.useState(3)
+ const [loading, setLoading] = React.useState(true);
+
+
+ // Fetch Notebooks
+ useEffect(() => {
+ axios
+ .get(api_host + "ida/workflows/search")
+ .then((response) => {
+ console.log(response);
+ setList_of_workflows(response.data.results);
+ setWorkflowURL(response.data.results[0].url);
+ setLoading(false);
+ });
+ }, [api_host]);
+
+
+ // Fetch JHubs
+ useEffect(() => {
+ axios
+ .get(api_host + "ida/facilities/search")
+ .then((response) => {
+ setList_of_idaSystems(response.data.results);
+ setIdaSystemURL(response.data.results[0].url);
+ });
+ }, [api_host]);
+
let list_of_batchsystems = [
@@ -22,8 +50,24 @@ export default function Interactive() {
{"name" : "CTA DIRAC", "url" : "https://ccdcta-web.in2p3.fr/DIRAC/"},
]
+ if (loading) {
+ return (
+ <Container className="ida" fluid>
+ <h1>Interactive Analysis</h1>
+ { !showFacilities ?
+
+ <div class="workflow-div">
+ <h2>Workflows</h2>
+ </div>
+ : null }
+ <LoadingSpinner/>
+ </Container>
+ )
+
+ }
+
if ((!list_of_workflows) || (!list_of_idaSystems) || (!list_of_batchsystems)) {
- return null
+ return null;
}
const handleChange = event => {
diff --git a/src/contexts/IDAContext.js b/src/contexts/IDAContext.js
index 9503390..105f31a 100644
--- a/src/contexts/IDAContext.js
+++ b/src/contexts/IDAContext.js
@@ -13,27 +13,6 @@ export function IDAContextProvider({ children }) {
const [list_of_workflows, setList_of_workflows] = useState();
const [list_of_idaSystems, setList_of_idaSystems] = useState();
- // Fetch Notebooks
- useEffect(() => {
- axios
- .get(api_host + "ida/workflows/search")
- .then((response) => {
- setList_of_workflows(response.data.results);
- setWorkflowURL(response.data.results[0].url);
- });
- }, [api_host]);
-
-
- // Fetch JHubs
- useEffect(() => {
- axios
- .get(api_host + "ida/facilities/search")
- .then((response) => {
- setList_of_idaSystems(response.data.results);
- setIdaSystemURL(response.data.results[0].url);
- });
- }, [api_host]);
-
return (
<IDAContext.Provider
--
GitLab