This commit is contained in:
Sebastian Seedorf
2022-08-18 09:20:00 +02:00
parent 92b762bbd2
commit de95f57b18
60 changed files with 3450 additions and 994 deletions

View File

@@ -1,18 +1,18 @@
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";
import {useRouter} from "next/router";
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'
import { useRouter } from 'next/router'
export const Home: FC = () => {
const router = useRouter()
const {factories} = useFactories()
const { factories } = useFactories()
const {
groups,
addGroup,
@@ -23,13 +23,14 @@ export const Home: FC = () => {
store,
load
} = useGroups()
const [newGroupValue, setNewGroupValue] = useState("New group")
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) =>
.reduce(
(acc, factory) =>
(factory.usedBy?.length ?? 0) >= 3
? [[...acc[0], factory], acc[1]]
: [acc[0], [...acc[1], factory]],
@@ -40,49 +41,66 @@ export const Home: FC = () => {
return (
<main>
<h1>Factorio Microservices</h1>
<button onClick={() => {
download('factorio-microservices.bin', store());
}}>Store</button>
<button onClick={async () => {
const res = await fetch( '/api/submit', {
method: 'POST',
headers: {
'Content-Type': 'application/json'
},
body: JSON.stringify({groups, ignored: ignoredFactories, base: baseFactories})
})
if (res.ok) {
const { uuid } = await res.json()
if (uuid) await router.push({query: {...router.query, id: uuid}})
}
}}>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={{pathname: '/visualize', query: router.query}}>Visualize</Link>
<button
onClick={() => {
download('factorio-microservices.bin', store())
}}
>
Store
</button>
<button
onClick={async () => {
const res = await fetch('/api/submit', {
method: 'POST',
headers: {
'Content-Type': 'application/json'
},
body: JSON.stringify({ groups, ignored: ignoredFactories, base: baseFactories })
})
if (res.ok) {
const { uuid } = await res.json()
if (uuid) await router.push({ query: { ...router.query, id: uuid } })
}
}}
>
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={{ pathname: '/visualize', query: router.query }}>Visualize</Link>
<Preferences />
<fieldset>
<legend>Missing export factories</legend>
<div className={styles.missingFactories}>
{ missingExport.map(missing => (
{missingExport.map(missing => (
<EntitySpan
key={missing.href}
value={missing}
onClick={() => {
addGroup(newGroupValue !== "New group" ? newGroupValue : missing.name, [missing.href])
setNewGroupValue("New group")
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"}
leftClickText={'Create a new group with this name and item as exported factory'}
rightClickText={'Exclude this recipe from suggestions'}
/>
))}
</div>
@@ -90,31 +108,34 @@ export const Home: FC = () => {
<fieldset>
<legend>Missing mall factories</legend>
<div className={styles.missingFactories}>
{ missingMall.map(missing => (
{missingMall.map(missing => (
<EntitySpan
key={missing.href}
value={missing}
onClick={() => {
addGroup(newGroupValue !== "New group" ? newGroupValue : missing.name, [], [missing.href])
setNewGroupValue("New group")
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"}
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} />)
}
{Object.values(groups)
.sort((a, b) => a.name.localeCompare(b.name))
.map(group => (
<GroupBox key={group.name} group={group} />
))}
</div>
</main>
)