diff --git a/components/Group.tsx b/components/Group.tsx index 194b929..6717dcf 100644 --- a/components/Group.tsx +++ b/components/Group.tsx @@ -1,23 +1,19 @@ import {FC, useMemo} from "react"; import {FactorySelect} from "./FactorySelect"; import {useDetails} from "../src/hooks/useDetails"; -import {Entity} from "../src/types"; +import {Entity, Group} from "../src/types"; import styles from "./Group.module.css" import {EntitySpan} from "./EntitySpan"; interface Props { onRemove: () => void onSetOutputFactories: (uids: string[]) => void - outputFactories: string[] onSetIntermediateFactories: (uids: string[]) => void - intermediateFactories: string[] onSetInputFactories: (uids: string[]) => void - inputFactories: string[] onToggleExported: () => void - isExported: boolean onRename: (name: string) => void onDoIgnore: (name: string) => void - name: string + group: Group sets: { doNotSuggest: Set basic: Set @@ -25,18 +21,20 @@ interface Props { } } -export const Group: FC = ({ +export const GroupBox: FC = ({ onRemove, onRename, onSetOutputFactories, - outputFactories, onSetIntermediateFactories, - intermediateFactories, onSetInputFactories, - inputFactories, onToggleExported, - isExported, - name, + group: { + inputs, + intermediates, + factories, + isExported, + name + }, sets: { doNotSuggest, basic, @@ -46,18 +44,18 @@ export const Group: FC = ({ }) => { const details = useDetails() - const inputs = useMemo(() => { + const calculatedInputs = useMemo(() => { const newData: string[] = details - .filter(detail => intermediateFactories.includes(detail.href) || outputFactories.includes(detail.href)) + .filter(detail => intermediates.includes(detail.href) || factories.includes(detail.href)) .flatMap(detail => Object.keys(detail.recipe?.prerequisites ?? {})) const uniqueInputs = Array.from(new Set(newData)) return uniqueInputs - .filter(input => !intermediateFactories.includes(input) && !outputFactories.includes(input)) - }, [details, intermediateFactories, outputFactories]) + .filter(input => !intermediates.includes(input) && !factories.includes(input)) + }, [details, intermediates, factories]) const suggestions = useMemo(() => { - const availableIngredients = Array.from(new Set([...intermediateFactories, ...outputFactories, ...inputs, ...inputFactories])) - const selectedValues = Array.from(new Set([...intermediateFactories, ...outputFactories, ...inputFactories])) + const availableIngredients = Array.from(new Set([...intermediates, ...factories, ...calculatedInputs, ...inputs])) + const selectedValues = Array.from(new Set([...intermediates, ...factories, ...inputs])) return details .filter(detail => { if (!detail.recipe) return false @@ -66,14 +64,14 @@ export const Group: FC = ({ const prerequisites = Object.keys(detail.recipe?.prerequisites ?? {}) return prerequisites.every(pre => availableIngredients.includes(pre)) }) - }, [inputFactories, doNotSuggest, details, inputs, intermediateFactories, outputFactories]) + }, [inputs, doNotSuggest, details, calculatedInputs, intermediates, factories]) const addIntermediateFactory = (uid: string) => { - onSetIntermediateFactories([...intermediateFactories, uid]) + onSetIntermediateFactories([...intermediates, uid]) } const addOutputFactory = (uid: string) => { - onSetOutputFactories([...outputFactories, uid]) + onSetOutputFactories([...factories, uid]) } return
@@ -92,17 +90,17 @@ export const Group: FC = ({
@@ -110,7 +108,7 @@ export const Group: FC = ({

Inputs

    { - inputs.map(input =>
  • addIntermediateFactory(input)} style={{color: basic.has(input) ? 'darkgreen' : exported.has(input) ? 'orange' : undefined}} diff --git a/components/Home.tsx b/components/Home.tsx index d64025b..3b49875 100644 --- a/components/Home.tsx +++ b/components/Home.tsx @@ -1,22 +1,14 @@ import {FC, useCallback, useEffect, useMemo, useState} from "react"; import {useLocalStorage} from "../src/hooks/useLocalStorage"; -import {Group} from "./Group"; +import {GroupBox} from "./Group"; import {FactorySelect} from "./FactorySelect"; import styles from "./Home.module.css" import {sortByProperty} from "../src/utils"; import {useDetails} from "../src/hooks/useDetails"; -import {Entity} from "../src/types"; +import {Entity, Group} from "../src/types"; import pako from 'pako'; import {EntitySpan} from "./EntitySpan"; -interface Group { - name: string - isExported?: boolean - factories: string[] - intermediates: string[] - inputs: string[] -} - export const HomeComponent: FC = () => { const details = useDetails() const [newGroupValue, setNewGroupValue] = useState("New group") @@ -24,7 +16,7 @@ export const HomeComponent: FC = () => { const [basicValues, setBasicValues] = useLocalStorage('basicValues', []) const [groups, setGroups] = useLocalStorage('serviceGroups', []) - const [clientGroups, setClientGroups] = useState([]) + const [clientGroups, setClientGroups] = useState([]) const doNotSuggest = useMemo>(() => { return new Set([...groups.flatMap(group => [...(group.name.includes('Mall') ? group.intermediates : []), ...group.factories]), ...excludedSuggestions, ...basicValues]) @@ -50,8 +42,8 @@ export const HomeComponent: FC = () => { groups.splice(idx, 1) return groups }) - const appendGroup = useCallback((name: string) => setGroups(groups => { - groups.push({name, factories: [], intermediates: [], inputs: []}) + const appendGroup = useCallback((name: string, factories: string[] = []) => setGroups(groups => { + groups.push({name, factories, intermediates: [], inputs: []}) groups.sort(sortByProperty(group => group.name)) return groups }), [setGroups]) @@ -111,13 +103,18 @@ export const HomeComponent: FC = () => { Missing factories
    { missingFactories.map(missing => ( - { + appendGroup(newGroupValue !== "New group" ? newGroupValue : missing.name, [missing.href]) + setNewGroupValue("New group") + }} onContextMenu={event => { event.preventDefault() setExcludedSuggestions([...excludedSuggestions, missing.href]) }} + leftClickText={"Create a new factory with this item and name"} rightClickText={"Exclude this recipe from suggestions"} /> ))} @@ -125,13 +122,9 @@ export const HomeComponent: FC = () => {
    { - clientGroups.map((group, idx) => removeGroup(idx)} onRename={(name: string) => renameGroup(idx, name)} onSetOutputFactories={uids => setFactories(idx, uids, 'factories')} diff --git a/src/types.ts b/src/types.ts index 3d0c880..6a40d73 100644 --- a/src/types.ts +++ b/src/types.ts @@ -13,3 +13,11 @@ export interface UnfetchedEntity { export interface Entity extends UnfetchedEntity { recipe?: Recipe } + +export interface Group { + name: string + isExported?: boolean + factories: string[] + intermediates: string[] + inputs: string[] +}