diff --git a/packages/webpage-refactor/components/advancedOptions.js b/packages/webpage-refactor/components/advancedOptions/advancedOptions.js similarity index 85% rename from packages/webpage-refactor/components/advancedOptions.js rename to packages/webpage-refactor/components/advancedOptions/advancedOptions.js index c00dcf7..048cb5a 100644 --- a/packages/webpage-refactor/components/advancedOptions.js +++ b/packages/webpage-refactor/components/advancedOptions/advancedOptions.js @@ -1,7 +1,8 @@ import React, { useState } from "react"; -import { ShowComparisons } from "./advancedOptions/showComparisons.js"; -import { ComparisonsChanger } from "./advancedOptions/comparisonsChanger.js"; -import { DataSetChanger } from "./advancedOptions/datasetChanger.js"; +import { ShowComparisons } from "./showComparisons.js"; +import { ComparisonsChanger } from "./comparisonsChanger.js"; +import { DataSetChanger } from "./datasetChanger.js"; +import { setRevalidateHeaders } from "next/dist/server/send-payload/revalidate-headers.js"; const effectButtonStyle = "bg-transparent m-2 hover:bg-blue-500 text-blue-700 font-semibold hover:text-white py-2 px-4 border border-blue-500 hover:border-transparent rounded mt-5"; @@ -27,12 +28,12 @@ export function AdvancedOptions({ setShowChangeDataset(!showChangeDataset); const buttonNames = [ - "Show Comparisons", + // "Show Comparisons", "Load comparisons", "Use your own data", ]; const buttonToggles = [ - toggleShowComparisons, + // toggleShowComparisons, toggleShowLoadComparisons, toggleShowChangeDataset, ]; @@ -69,10 +70,12 @@ export function AdvancedOptions({ listOfElements={listOfElements} show={showLoadComparisons} moveToNextStep={moveToNextStep} + links={links} /> diff --git a/packages/webpage-refactor/components/advancedOptions/comparisonsChanger.js b/packages/webpage-refactor/components/advancedOptions/comparisonsChanger.js index 3559ea4..5af9425 100644 --- a/packages/webpage-refactor/components/advancedOptions/comparisonsChanger.js +++ b/packages/webpage-refactor/components/advancedOptions/comparisonsChanger.js @@ -1,4 +1,7 @@ -import React, { useState } from "react"; +import React, { useState, useEffect } from "react"; + +// import JSONInput from "react-json-editor-ajrm/index"; +// import locale from "react-json-editor-ajrm/locale/en"; const checkLinksAreOk = (links, listOfElements) => { let linkSourceNames = links.map((link) => link.source.name); @@ -25,8 +28,9 @@ export function ComparisonsChanger({ listOfElements, show, moveToNextStep, + links, }) { - let [value, setValue] = useState(``); + let [value, setValue] = useState(JSON.stringify(links, null, 4)); const [displayingDoneMessage, setDisplayingDoneMessage] = useState(false); const [displayingDoneMessageTimer, setDisplayingDoneMessageTimer] = useState(null); @@ -38,10 +42,10 @@ export function ComparisonsChanger({ let handleSubmitInner = (event) => { clearTimeout(displayingDoneMessageTimer); event.preventDefault(); + try { let newData = JSON.parse(value); - // setLinks - // newData + if (checkLinksAreOk(newData, listOfElements)) { setLinks(newData); moveToNextStep({ @@ -57,49 +61,51 @@ export function ComparisonsChanger({ } } catch (error) { setDisplayingDoneMessage(false); - let substituteText = `Error: ${error.message} - -Try something like: -[ - { - "source": "x", - "target": "y", - "distance": 99999.99999999999, - "reasoning": "blah blah" - }, - { - "source": "y", - "target": "z", - "distance": 1, - "reasoning": "blah blah" - }, - { - "source": "x", - "target": "z", - "distance": 10, - "reasoning": "blah blah" - } -] - -Your old input was: ${value}`; - setValue(substituteText); + alert(error); } }; + + useEffect(async () => { + setValue(JSON.stringify(links, null, 4)); + // console.log(JSON.stringify(config, null, 10)); + }, [links]); + return (

Load comparisons

-

These will override your current comparisons.

+

These can be edited, which will override your current comparisons.