import { useGroups } from '../contexts/GroupProvider'
import { FC, useMemo } from 'react'
import { calculateInputs } from '../../src/calculateInputs'
import Head from 'next/head'
import { ScrollContainer } from './ScrollContainer/ScrollContainer'
import { ProducingGraph } from './ProducingGraph/ProducingGraph'
import { NodeOverview, OverviewGraphNode } from './NodeOverview/NodeOverview'
import { useFactories } from '../contexts/FactoryProvider'
import { i18n, I18n } from '../shared/I18n/I18n'
import { useIntl } from 'react-intl'
export const PageOverview: FC = () => {
const intl = useIntl()
const { exportedFactories, baseFactories, groups } = useGroups()
const { findFactory } = useFactories()
const producingNodes: OverviewGraphNode[] = useMemo(() => {
return Object.values(groups).map(group => ({
inputs: calculateInputs(
[...group.exports, ...group.malls],
baseFactories,
exportedFactories,
findFactory
)[0],
outputs: group.exports,
name: group.name,
icons: [...group.exports, ...group.malls]
}))
}, [baseFactories, exportedFactories, findFactory, groups])
return (
<>
<I18n id={'page.visualize.details.title'} />
)
}