diff options
author | Erlend <erlendniko@hotmail.com> | 2022-06-24 11:51:51 +0200 |
---|---|---|
committer | Erlend <erlendniko@hotmail.com> | 2022-06-24 11:51:51 +0200 |
commit | 2390f95ecdff90beec7b54c5440132d9ed3110df (patch) | |
tree | f0c5f873f567e2d0759619b7dcbfa0b6329a04db /client | |
parent | 1a284bd1d34a5cddc88e2ed36ebbb2a04232bb70 (diff) |
QueryInput now switches between input and button depending on the chosen method
Diffstat (limited to 'client')
6 files changed, 16 insertions, 16 deletions
diff --git a/client/js/app/src/app/pages/querybuilder/Components/Buttons/AddQueryInputButton.jsx b/client/js/app/src/app/pages/querybuilder/Components/Buttons/AddQueryInputButton.jsx index 90625397d1d..5af361a85d1 100644 --- a/client/js/app/src/app/pages/querybuilder/Components/Buttons/AddQueryInputButton.jsx +++ b/client/js/app/src/app/pages/querybuilder/Components/Buttons/AddQueryInputButton.jsx @@ -7,7 +7,7 @@ export default function AddQueryInput() { const updateInputs = (e) => { e.preventDefault(); - setId(id + 1); + setId((id) => id + 1); setInputs((prevInputs) => [ ...prevInputs, { id: id + 1, type: '', input: '', hasChildren: false, children: [] }, diff --git a/client/js/app/src/app/pages/querybuilder/Components/Contexts/QueryInputContext.jsx b/client/js/app/src/app/pages/querybuilder/Components/Contexts/QueryInputContext.jsx index 378b9c96d4f..b316c30027a 100644 --- a/client/js/app/src/app/pages/querybuilder/Components/Contexts/QueryInputContext.jsx +++ b/client/js/app/src/app/pages/querybuilder/Components/Contexts/QueryInputContext.jsx @@ -14,7 +14,7 @@ export const QueryInputProvider = (prop) => { }, ]); - // id is the id if the newest QueryInput, gets updated each time a new one is added + // This is the id of the newest QueryInput, gets updated each time a new one is added const [id, setId] = useState(1); // These are the methods that can be chosen in a QueryInput diff --git a/client/js/app/src/app/pages/querybuilder/Components/Text/QueryDropDownForm.jsx b/client/js/app/src/app/pages/querybuilder/Components/Text/QueryDropDownForm.jsx index 4df3c27c261..30cafac08fc 100644 --- a/client/js/app/src/app/pages/querybuilder/Components/Text/QueryDropDownForm.jsx +++ b/client/js/app/src/app/pages/querybuilder/Components/Text/QueryDropDownForm.jsx @@ -10,18 +10,20 @@ export default function QueryDropdownFormn({ choices, id }) { const updateType = (e) => { e.preventDefault(); const newType = e.target.value; - const index = inputs.findIndex((element) => element.id === id); - inputs[index].type = newType; + const newInputs = inputs.slice(); + const index = newInputs.findIndex((element) => element.id === id); + newInputs[index].type = newType; let hasChildren = levelZeroParameters[newType].hasChildren; - inputs[index].hasChildren = hasChildren; - setInputs(inputs); + newInputs[index].hasChildren = hasChildren; + setInputs(newInputs); }; // On start set the type of the first QueryInput to the first in the list of choices useEffect(() => { - const index = inputs.findIndex((element) => element.id === id); + const newInputs = inputs.slice(); + const index = newInputs.findIndex((element) => element.id === id); const key = Object.keys(choices)[0]; - inputs[index].type = choices[key].name; + newInputs[index].type = choices[key].name; setInputs(inputs); }, []); diff --git a/client/js/app/src/app/pages/querybuilder/Components/Text/QueryInput.jsx b/client/js/app/src/app/pages/querybuilder/Components/Text/QueryInput.jsx index a651088ff60..427498229ce 100644 --- a/client/js/app/src/app/pages/querybuilder/Components/Text/QueryInput.jsx +++ b/client/js/app/src/app/pages/querybuilder/Components/Text/QueryInput.jsx @@ -18,10 +18,11 @@ export default function QueryInput() { const updateInput = (e) => { e.preventDefault(); const fid = parseInt(e.target.id.replace('v', '')); - const index = inputs.findIndex((element) => element.id === fid); - inputs[index].input = e.target.value; - setInputs(inputs); - console.log(inputs); + const newInputs = inputs.slice(); + const index = newInputs.findIndex((element) => element.id === fid); + newInputs[index].input = e.target.value; + setInputs(newInputs); + console.log(newInputs); }; const inputList = inputs.map((value, index) => { diff --git a/client/js/app/src/app/pages/querybuilder/Components/Text/SimpleDropDownForm.jsx b/client/js/app/src/app/pages/querybuilder/Components/Text/SimpleDropDownForm.jsx index a734a861a89..8fb283c54dd 100644 --- a/client/js/app/src/app/pages/querybuilder/Components/Text/SimpleDropDownForm.jsx +++ b/client/js/app/src/app/pages/querybuilder/Components/Text/SimpleDropDownForm.jsx @@ -22,7 +22,7 @@ export default function SimpleDropDownForm({ }); function handleChange(e) { - setChoice(e.target.value); + setChoice((choice) => (choice = e.target.value)); } return ( diff --git a/client/js/app/src/app/pages/querybuilder/query-builder.jsx b/client/js/app/src/app/pages/querybuilder/query-builder.jsx index 8598cbda54e..44a37f424fb 100644 --- a/client/js/app/src/app/pages/querybuilder/query-builder.jsx +++ b/client/js/app/src/app/pages/querybuilder/query-builder.jsx @@ -1,8 +1,6 @@ import React from 'react'; import SimpleButton from './Components/Buttons/SimpleButton'; import QueryInput from './Components/Text/QueryInput'; -import SimpleDropDownForm from './Components/Text/SimpleDropDownForm'; -import SimpleForm from './Components/Text/SimpleForm'; import TextBox from './Components/Text/TextBox'; import ImageButton from './Components/Buttons/ImageButton'; import OverlayImageButton from './Components/Buttons/OverlayImageButton'; @@ -10,7 +8,6 @@ import AddQueryInput from './Components/Buttons/AddQueryInputButton'; import { QueryInputProvider } from './Components/Contexts/QueryInputContext'; import pasteImage from './assets/img/paste.svg'; import copyImage from './assets/img/copy.svg'; -import refreshImage from './assets/img/reload.svg'; import '../../styles/agency.css'; import '../../styles/vespa.css'; |