Skip to content
Snippets Groups Projects
Commit ef3478ca authored by Klaas Kliffen's avatar Klaas Kliffen :satellite:
Browse files

FIXME: breaks the rules of hooks!

parent c227048c
No related branches found
No related tags found
1 merge request!109Clean up GUI part I
import React, { useContext, useEffect } from "react";
import { Table, Alert, Form } from "react-bootstrap";
import axios from "axios";
import React, { useContext, useEffect } from "react";
import { Alert, Form, Table } from "react-bootstrap";
import { BasketContext } from "../../../contexts/BasketContext";
import { GlobalContext } from "../../../contexts/GlobalContext";
import { QueryContext } from "../../../contexts/QueryContext";
import { BasketContext } from "../../../contexts/BasketContext";
import AddToBasket from "../../basket/AddToBasketCheckBox";
import LoadingSpinner from "../../LoadingSpinner";
import Paginate, { pagination_fields } from "../../Paginate";
import SaveBasketButton from "../../basket/SaveBasketButton";
import AddToBasket from "../../basket/AddToBasketCheckBox";
const DATETIME_OPTIONS = {
year: "numeric",
......@@ -20,7 +19,7 @@ const DATETIME_OPTIONS = {
timeZoneName: "short",
};
Object.isObject = function(obj) {
Object.isObject = function (obj) {
return (obj && obj.constructor === this) || false;
};
......@@ -89,7 +88,7 @@ function newPageCallback(setPage) {
};
}
function projectBasketItem(projectId, category){
function projectBasketItem(projectId, category) {
return {
archive: "zooniverse",
catalog: "project",
......@@ -98,7 +97,7 @@ function projectBasketItem(projectId, category){
};
}
function workflowBasketItem(projectId, workflowId, category){
function workflowBasketItem(projectId, workflowId, category) {
return {
archive: "zooniverse",
catalog: "workflow",
......@@ -205,7 +204,7 @@ function ZooniverseProjectResults(context) {
<td>
<a href={`https://zooniverse.org/projects/${result.slug}`}>
Link
</a>
</a>
</td>
{remaining_cells}
</tr>
......@@ -244,7 +243,7 @@ function ZooniverseWorkflowResults(context) {
let title = titleCase(field.replace("_", " "));
return <th key={`project_header_${field}`}>{title}</th>;
});
const saveBasketStyle = { marginBottom : "10px"} ;
return (
<>
<Paginate
......@@ -255,73 +254,73 @@ function ZooniverseWorkflowResults(context) {
/>
<Form>
{queryMap
.get("zooniverse_workflows")
.results.results.map((project) => {
return (
<div key={project.project_id}>
<h4>{project.display_name}</h4>
<Table className="mt-3" responsive>
<thead>
<tr className="bg-light">
{/* <th>
{queryMap
.get("zooniverse_workflows")
.results.results.map((project) => {
return (
<div key={project.project_id}>
<h4>{project.display_name}</h4>
<Table className="mt-3" responsive>
<thead>
<tr className="bg-light">
{/* <th>
<InputGroup>
<InputGroup.Checkbox />
</InputGroup>
</th> */}
<th>Select Classification Data</th>
<th>Select Subject Data</th>
<th>ID</th>
<th>Display Name</th>
<th>Created</th>
<th>Updated</th>
{remaining_headers}
{/* <th>View</th> */}
</tr>
</thead>
<tbody>
{project.workflows.map((workflow) => {
let created_at = date_formatter.format(
new Date(workflow.created_at)
);
let updated_at = date_formatter.format(
new Date(workflow.updated_at)
);
let remaining_cells = remaining_fields.map((field) => {
let reactKey = `workflow_${workflow.workflow_id}_${field}`;
return (
<td key={reactKey}>
{renderIfCompound(workflow[field], reactKey)}
</td>
<th>Select Classification Data</th>
<th>Select Subject Data</th>
<th>ID</th>
<th>Display Name</th>
<th>Created</th>
<th>Updated</th>
{remaining_headers}
{/* <th>View</th> */}
</tr>
</thead>
<tbody>
{project.workflows.map((workflow) => {
let created_at = date_formatter.format(
new Date(workflow.created_at)
);
let updated_at = date_formatter.format(
new Date(workflow.updated_at)
);
});
return (
<tr key={`workflow_${workflow.workflow_id}`}>
{/* <th>
let remaining_cells = remaining_fields.map((field) => {
let reactKey = `workflow_${workflow.workflow_id}_${field}`;
return (
<td key={reactKey}>
{renderIfCompound(workflow[field], reactKey)}
</td>
);
});
return (
<tr key={`workflow_${workflow.workflow_id}`}>
{/* <th>
<InputGroup>
<InputGroup.Checkbox />
</InputGroup>
</th> */}
<td>
<AddToBasket id={`selectClassifications_${workflow.workflow_id}`} item={workflowBasketItem(result.project_id, workflow.workflow_id, "classifications")} />
</td>
<td>
<AddToBasket id={`selectSubjects_${workflow.workflow_id}`} item={workflowBasketItem(result.project_id, workflow.workflow_id, "subjects")} />
</td>
<td>{workflow.workflow_id}</td>
<td>{workflow.display_name}</td>
<td>{created_at}</td>
<td>{updated_at}</td>
{remaining_cells}
{/* <td><a href={`https://zooniverse.org/workflows/${workflow.slug}`}>Link</a></td> */}
</tr>
);
})}
</tbody>
</Table>
</div>
);
})}
<td>
<AddToBasket id={`selectClassifications_${workflow.workflow_id}`} item={workflowBasketItem(result.project_id, workflow.workflow_id, "classifications")} />
</td>
<td>
<AddToBasket id={`selectSubjects_${workflow.workflow_id}`} item={workflowBasketItem(result.project_id, workflow.workflow_id, "subjects")} />
</td>
<td>{workflow.workflow_id}</td>
<td>{workflow.display_name}</td>
<td>{created_at}</td>
<td>{updated_at}</td>
{remaining_cells}
{/* <td><a href={`https://zooniverse.org/workflows/${workflow.slug}`}>Link</a></td> */}
</tr>
);
})}
</tbody>
</Table>
</div>
);
})}
</Form>
<Paginate
getNewPage={newPageCallback(setPage)}
......@@ -339,6 +338,7 @@ export default function ZooniverseResults({ catalog }) {
const { queryMap, page } = useContext(QueryContext);
const { api_host } = useContext(GlobalContext);
useEffect(() => {
const usp = new URLSearchParams(queryMap.get(catalog).esapquery);
usp.set("page", page);
......@@ -368,7 +368,10 @@ export default function ZooniverseResults({ catalog }) {
results: null,
});
});
}, [page])
}, [page]); // eslint-disable-line react-hooks/exhaustive-deps
// FIXME: React Hook useEffect has missing dependencies: 'api_host', 'catalog', and 'queryMap'. Either include them or remove the dependency array react-hooks/exhaustive-deps
// FIXME: breaks the rules of hooks!
if (!context.queryMap) return null;
if (context.queryMap.get(catalog).status === "fetched") {
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment