Files
node-factorio-recipes/components/home/Home.tsx
2022-08-12 19:05:15 +02:00

99 lines
3.6 KiB
TypeScript

import {FC, useMemo, useState} from "react";
import {GroupBox} from "./Group/Group";
import {FactorySelect} from "./FactorySelect/FactorySelect";
import styles from "./Home.module.css"
import {useFactories} from "../../src/hooks/useFactories";
import {EnrichedEntity, Entity} from "../../src/types";
import pako from 'pako';
import {EntitySpan} from "./EntitySpan/EntitySpan";
import {useGroups} from "../contexts/GroupProvider";
import {sortByProperty} from "../../src/utils";
import {Preferences} from "./Preferences/Preferences";
export const HomeComponent: FC = () => {
const {factories} = useFactories()
const {
groups,
addGroup,
doNotSuggest,
ignoredFactories,
setIgnoredFactories
} = useGroups()
const [newGroupValue, setNewGroupValue] = useState("New group")
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])
const store = () => {
const string = JSON.stringify(groups)
const btoa = (bin: Uint8Array) => Buffer.from(bin).toString('base64')
const atob = (str: string) => Buffer.from(str, 'base64')
const compressed = btoa(pako.deflate(string))
console.log(string.length, compressed.length)
const uncompressed = pako.inflate(atob(compressed), {to: "string"})
}
return (
<main>
<h1>Factorio Microservices</h1>
<button onClick={store}>Store</button>
<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(sortByProperty(g => g.name)).map((group) => <GroupBox key={group.name} group={group} />)
}
</div>
</main>
)
}