import React, { useState } from "react"; 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"; export function AdvancedOptions({ links, setLinks, listOfElements, moveToNextStep, onChangeOfDataset, }) { const [showAdvancedOptions, changeShowAdvanceOptions] = useState(false); const [showComparisons, setShowComparisons] = useState(false); const toggleShowComparisons = () => setShowComparisons(!showComparisons); const [showLoadComparisons, setShowLoadComparisons] = useState(false); const toggleShowLoadComparisons = () => setShowLoadComparisons(!showLoadComparisons); const [showChangeDataset, setShowChangeDataset] = useState(false); const toggleShowChangeDataset = () => setShowChangeDataset(!showChangeDataset); const buttonNames = [ // "Show Comparisons", "Load comparisons", "Use your own data", ]; const buttonToggles = [ // toggleShowComparisons, toggleShowLoadComparisons, toggleShowChangeDataset, ]; return (

{/* Show advanced options*/}
{/* Toggle buttons */}
{buttonNames.map((buttonName, i) => { return ( ); })} {/* Element: Show comparisons */} {/* Element: Change comparisons */}
); }