feat: Refactored to avoid useState in lib/findPaths.js

Note: This is important because it allows for restarting
the utility-function extractor. It also makes for code
which is more understandable.
This commit is contained in:
NunoSempere 2021-12-08 11:56:20 +01:00
parent 958a2e366f
commit 3d6a544a72
2 changed files with 53 additions and 5 deletions

View File

@ -88,8 +88,9 @@ export default function ComparisonView({ listOfElementsForView }) {
setQuantitativeComparisons(initialQuantitativeComparisons) setQuantitativeComparisons(initialQuantitativeComparisons)
setIsListOrdered(initialIsListOdered) setIsListOrdered(initialIsListOdered)
setOrderedList(initialOrderedList) setOrderedList(initialOrderedList)
changeNumSteps(0) changeNumSteps(initialNumSteps)
removeOldSvg() removeOldSvg()
setTableRows(initialTableRows)
} }
let changeDataSet = (listOfElementsNew) => { let changeDataSet = (listOfElementsNew) => {
@ -209,16 +210,26 @@ export default function ComparisonView({ listOfElementsForView }) {
setReasoning('') setReasoning('')
changeNumSteps(numSteps + 1) changeNumSteps(numSteps + 1)
if (successStatus) { if (successStatus) {
let jsObject = nicelyFormatLinks(quantitativeComparisons, listOfElements) let jsObject = nicelyFormatLinks(quantitativeComparisons, listOfElements)
await pushToMongo(jsObject) await pushToMongo(jsObject)
console.log(jsObject) console.log(jsObject)
alert("Comparisons completed. Background work might take a while, or straight-out fail") alert("Comparisons completed. Background work might take a while, or straight-out fail")
setTimeout(async () => { setTimeout(async () => {
// Make sure to do this after the // Make sure to do this after the
setIsListOrdered(true) setIsListOrdered(true)
setOrderedList(result) setOrderedList(result)
}, 500); await buildRows({
isListOrdered: true,
orderedList: result,
listOfElements,
links: buildLinks(newQuantitativeComparisons),
rows: tableRows,
setTableRows })
}, 100);
} }
} }

View File

@ -189,9 +189,8 @@ export async function buildRows({ isListOrdered, orderedList, listOfElements, li
} }
// return rows // return rows
} }
export function CreateTableWithDistancesWithUseEffect({ isListOrdered, orderedList, listOfElements, links, tableRows, setTableRows }) {
export function CreateTableWithDistances({ isListOrdered, orderedList, listOfElements, links, tableRows, setTableRows }) {
useEffect(async () => { useEffect(async () => {
await buildRows({ isListOrdered, orderedList, listOfElements, links, rows: tableRows, setTableRows }) await buildRows({ isListOrdered, orderedList, listOfElements, links, rows: tableRows, setTableRows })
/* /*
@ -224,6 +223,7 @@ export function CreateTableWithDistances({ isListOrdered, orderedList, listOfEle
} }
*/ */
}); // this useEffect should ideally only work when isListOrdered changes, but I haven't bothered to program that. }); // this useEffect should ideally only work when isListOrdered changes, but I haven't bothered to program that.
return ( return (
<div> <div>
@ -259,6 +259,43 @@ export function CreateTableWithDistances({ isListOrdered, orderedList, listOfEle
</div> </div>
) )
}
export function CreateTableWithDistances({ tableRows }) {
return (
<div>
<table className="">
<thead>
<tr >
<th >Id</th>
<th>&nbsp;&nbsp;&nbsp;</th>
<th >Position</th>
<th>&nbsp;&nbsp;&nbsp;</th>
<th >Element</th>
<th> &nbsp;&nbsp;&nbsp;</th>
<th >Possible relative values</th>
<th> &nbsp;&nbsp;&nbsp;</th>
<th >Average relative value</th>
</tr>
</thead>
<tbody>
{tableRows.map(row => <tr key={row.id}>
<td className="" >{row.id}</td>
<td>&nbsp;&nbsp;&nbsp;</td>
<td className="" >{row.position}</td>
<td>&nbsp;&nbsp;&nbsp;</td>
<td className="">{row.name}</td>
<td>&nbsp;&nbsp;&nbsp;</td>
<td className="">{abridgeArrayAndDisplay(row.distances)}</td>
<td>&nbsp;&nbsp;&nbsp;</td>
<td className="">{formatLargeOrSmall(avg(row.distances))}</td>
</tr>
)}
</tbody>
</table>
</div>
)
} }
function CreateTableWithoutDistances({ isListOrdered, orderedList, listOfElements, links }) { function CreateTableWithoutDistances({ isListOrdered, orderedList, listOfElements, links }) {