Skip to content
Snippets Groups Projects
Commit 9d563624 authored by Bjarke Madsen's avatar Bjarke Madsen
Browse files

reduce the madness that is API calls

parent f39c3f86
No related branches found
No related tags found
No related merge requests found
...@@ -23,7 +23,7 @@ export const options = { ...@@ -23,7 +23,7 @@ export const options = {
}; };
function DataAnalysis(): ReactElement { function DataAnalysis(): ReactElement {
function api<T>(url: string, options: RequestInit): Promise<T> { function api<T>(url: string, options: RequestInit | undefined = undefined): Promise<T> {
return fetch(url, options) return fetch(url, options)
.then((response) => { .then((response) => {
if (!response.ok) { if (!response.ok) {
...@@ -42,54 +42,38 @@ function DataAnalysis(): ReactElement { ...@@ -42,54 +42,38 @@ function DataAnalysis(): ReactElement {
const [selectedDataEntry, setSelectedDataEntry] = useState<number>(0); const [selectedDataEntry, setSelectedDataEntry] = useState<number>(0);
useEffect(() => { useEffect(() => {
// let timeoutRef = 0; // hardcode selected section for now
const getDataEntries = () => { const dataEntrySectionResponse: DataEntrySection = {
const dataEntrySectionResponse: DataEntrySection = { description: "Org",
description: "Org", items: [
items: [ {
{ id: 0,
id: 2, title: "NREN Budgets per year, in Millions EUR",
title: "NREN Budgets per year, in Millions EUR", url: "/api/data-entries/item/2"
url: "/api/data-entries/item/2" }
} // {
// { // id:3,
// id:3, // title:"NREN Budgets per NREN, in Millions EUR",
// title:"NREN Budgets per NREN, in Millions EUR", // url:"/api/data-entries/item/3"
// url:"/api/data-entries/item/3" // }
// } ],
], name: "Organisation"
name: "Organisation"
}
setDataEntrySection(dataEntrySectionResponse);
console.log("getDataEntries " + dataEntrySection);
// Autoload the first graph
if (dataEntrySectionResponse.items.length > 0) {
setSelectedDataEntry(dataEntrySectionResponse.items[0].id);
}
} }
const loadData = () => { setDataEntrySection(dataEntrySectionResponse);
console.log("selectedDataEntry " + selectedDataEntry) setSelectedDataEntry(dataEntrySectionResponse.items[0].id);
if (selectedDataEntry == 0) { }, [])
getDataEntries();
return;
}
console.log("budgetResponse " + budgetResponse)
if (budgetResponse == undefined) {
api<Budget[]>('/api/budget', {
referrerPolicy: "unsafe-url",
headers: {
"Access-Control-Allow-Origin": "*",
"Content-Type": "text/plain",
"Access-Control-Allow-Methods": "GET, POST, PATCH, PUT, DELETE, OPTIONS",
"Access-Control-Allow-Headers": "Origin, Content-Type, X-Auth-Token"
} useEffect(() => {
}) const loadData = async () => {
if (budgetResponse == undefined) {
api<Budget[]>('/api/budget/', {})
.then((budget: Budget[]) => { .then((budget: Budget[]) => {
if (selectedDataEntry == 2) console.log('budget:', budget)
options.plugins.title.text = 'NREN Budgets per year, in Millions EUR'; const entry = dataEntrySection?.items.find(i => i.id == selectedDataEntry)
console.log(selectedDataEntry, dataEntrySection, entry)
if (entry)
options.plugins.title.text = entry.title;
setBudget(budget) setBudget(budget)
console.log("API positive response Budget : " + budget)
convertToBudgetPerYearDataResponse(budget) convertToBudgetPerYearDataResponse(budget)
}) })
.catch(error => { .catch(error => {
...@@ -101,7 +85,7 @@ function DataAnalysis(): ReactElement { ...@@ -101,7 +85,7 @@ function DataAnalysis(): ReactElement {
} }
loadData() loadData()
}, [selectedDataEntry]); }, [dataEntrySection, selectedDataEntry]);
const empty_bar_response = { const empty_bar_response = {
data: { data: {
...@@ -128,13 +112,10 @@ function DataAnalysis(): ReactElement { ...@@ -128,13 +112,10 @@ function DataAnalysis(): ReactElement {
const convertToBudgetPerYearDataResponse = (budgetResponse: Budget[]) => { const convertToBudgetPerYearDataResponse = (budgetResponse: Budget[]) => {
console.log("convertToBudgetPerYearDataResponse budgetResponse " + budgetResponse);
const barResponse = budgetResponse != undefined ? budgetResponse : empty_budget_response; const barResponse = budgetResponse != undefined ? budgetResponse : empty_budget_response;
const labelsYear = [...new Set(barResponse.map((item) => item.BUDGET_YEAR))]; const labelsYear = [...new Set(barResponse.map((item) => item.BUDGET_YEAR))];
const labelsNREN = [...new Set(barResponse.map((item) => item.NREN))]; const labelsNREN = [...new Set(barResponse.map((item) => item.NREN))];
console.log("convertToBudgetPerYearDataResponse " + barResponse);
function getRandomColor() { function getRandomColor() {
const red = Math.floor(Math.random() * 256).toString(16).padStart(2, '0'); // generates a value between 00 and ff const red = Math.floor(Math.random() * 256).toString(16).padStart(2, '0'); // generates a value between 00 and ff
...@@ -173,7 +154,7 @@ function DataAnalysis(): ReactElement { ...@@ -173,7 +154,7 @@ function DataAnalysis(): ReactElement {
} }
}) })
if (selectedDataEntry == 2) { if (selectedDataEntry == 0) {
const dataResponse: BudgetMatrix = { const dataResponse: BudgetMatrix = {
data: { data: {
datasets: datasetPerNREN, datasets: datasetPerNREN,
...@@ -186,7 +167,7 @@ function DataAnalysis(): ReactElement { ...@@ -186,7 +167,7 @@ function DataAnalysis(): ReactElement {
" have been higher. (For comparison, the total budget" + " have been higher. (For comparison, the total budget" +
" according to the 2021 survey results based on the data" + " according to the 2021 survey results based on the data" +
" for all responding NRENs that year is €555 M). The" + " for all responding NRENs that year is €555 M). The" +
" percentage change is based on the previous years" + " percentage change is based on the previous year's" +
" budget.", " budget.",
id: "3", id: "3",
settings: {}, settings: {},
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment