116 lines
4.1 KiB
TypeScript
116 lines
4.1 KiB
TypeScript
import {FC, useMemo, useRef, useState} from "react";
|
|
import {GroupBox} from "./GroupBox/GroupBox";
|
|
import styles from "./Home.module.css"
|
|
import {useFactories} from "../../src/hooks/useFactories";
|
|
import {EnrichedEntity} from "../../src/types";
|
|
import {EntitySpan} from "./EntitySpan/EntitySpan";
|
|
import {useGroups} from "../contexts/GroupProvider";
|
|
import {Preferences} from "./Preferences/Preferences";
|
|
import {download, streamToArrayBuffer} from "../../src/download";
|
|
import Link from "next/link";
|
|
|
|
export const Home: FC = () => {
|
|
const {factories} = useFactories()
|
|
const {
|
|
groups,
|
|
addGroup,
|
|
doNotSuggest,
|
|
baseFactories,
|
|
ignoredFactories,
|
|
setIgnoredFactories,
|
|
store,
|
|
load
|
|
} = useGroups()
|
|
const [newGroupValue, setNewGroupValue] = useState("New group")
|
|
const inputRef = useRef<HTMLInputElement>(null)
|
|
|
|
const [missingExport, missingMall] = useMemo<[EnrichedEntity[], EnrichedEntity[]]>(() => {
|
|
return factories
|
|
.filter(factory => !doNotSuggest.has(factory.href) && factory.recipe)
|
|
.reduce((acc, factory) =>
|
|
(factory.usedBy?.length ?? 0) >= 3
|
|
? [[...acc[0], factory], acc[1]]
|
|
: [acc[0], [...acc[1], factory]],
|
|
[[], []] as [EnrichedEntity[], EnrichedEntity[]]
|
|
)
|
|
}, [factories, doNotSuggest])
|
|
|
|
return (
|
|
<main>
|
|
<h1>Factorio Microservices</h1>
|
|
<button onClick={() => {
|
|
download('factorio-microservices.bin', store());
|
|
}}>Store</button>
|
|
<button onClick={async () => {
|
|
await fetch( '/api/submit', {
|
|
method: 'POST',
|
|
headers: {
|
|
'Content-Type': 'application/json'
|
|
},
|
|
body: JSON.stringify({groups, ignored: ignoredFactories, base: baseFactories})
|
|
})
|
|
}}>Upload</button>
|
|
<input type={"file"} multiple={false} ref={inputRef} onChange={async evt => {
|
|
const stream = evt.currentTarget.files?.[0].stream() as globalThis.ReadableStream<Uint8Array>|undefined
|
|
if (stream) {
|
|
const array = await streamToArrayBuffer(stream)
|
|
load(array)
|
|
if (inputRef.current) inputRef.current.value = null as unknown as string
|
|
}
|
|
}}/>
|
|
<Link href={'/visualize'}>Visualize</Link>
|
|
<Preferences />
|
|
<fieldset>
|
|
<legend>Missing export factories</legend>
|
|
<div className={styles.missingFactories}>
|
|
{ missingExport.map(missing => (
|
|
<EntitySpan
|
|
key={missing.href}
|
|
value={missing}
|
|
onClick={() => {
|
|
addGroup(newGroupValue !== "New group" ? newGroupValue : missing.name, [missing.href])
|
|
setNewGroupValue("New group")
|
|
}}
|
|
onContextMenu={event => {
|
|
event.preventDefault()
|
|
setIgnoredFactories([...ignoredFactories, missing.href])
|
|
}}
|
|
leftClickText={"Create a new group with this name and item as exported factory"}
|
|
rightClickText={"Exclude this recipe from suggestions"}
|
|
/>
|
|
))}
|
|
</div>
|
|
</fieldset>
|
|
<fieldset>
|
|
<legend>Missing mall factories</legend>
|
|
<div className={styles.missingFactories}>
|
|
{ missingMall.map(missing => (
|
|
<EntitySpan
|
|
key={missing.href}
|
|
value={missing}
|
|
onClick={() => {
|
|
addGroup(newGroupValue !== "New group" ? newGroupValue : missing.name, [], [missing.href])
|
|
setNewGroupValue("New group")
|
|
}}
|
|
onContextMenu={event => {
|
|
event.preventDefault()
|
|
setIgnoredFactories([...ignoredFactories, missing.href])
|
|
}}
|
|
leftClickText={"Create a new group with this name and item as mall factory"}
|
|
rightClickText={"Exclude this recipe from suggestions"}
|
|
/>
|
|
))}
|
|
</div>
|
|
</fieldset>
|
|
<div className={styles.grid}>
|
|
{
|
|
Object
|
|
.values(groups)
|
|
.sort((a, b) => a.name.localeCompare(b.name))
|
|
.map((group) => <GroupBox key={group.name} group={group} />)
|
|
}
|
|
</div>
|
|
</main>
|
|
)
|
|
}
|