summaryrefslogtreecommitdiff
path: root/opendc-web/opendc-web-ui/src/containers/app/sidebars/project/TopologyListContainer.js
blob: a2244a30fc5e9492b18ba755be17972ab1baa5a0 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
import React, { useState } from 'react'
import { useDispatch } from 'react-redux'
import TopologyListComponent from '../../../../components/app/sidebars/project/TopologyListComponent'
import { setCurrentTopology } from '../../../../redux/actions/topology/building'
import { useRouter } from 'next/router'
import { addTopology } from '../../../../redux/actions/topologies'
import NewTopologyModalComponent from '../../../../components/modals/custom-components/NewTopologyModalComponent'
import { useActiveTopology, useProjectTopologies } from '../../../../data/topology'
import { useMutation } from 'react-query'

const TopologyListContainer = () => {
    const dispatch = useDispatch()
    const router = useRouter()
    const { project: currentProjectId } = router.query
    const topologies =
        useProjectTopologies(currentProjectId).data?.map((topology) => ({ _id: topology._id, name: topology.name })) ??
        []
    const currentTopologyId = useActiveTopology()?._id
    const [isVisible, setVisible] = useState(false)

    const { mutate: deleteTopology } = useMutation('deleteTopology')

    const onChooseTopology = async (id) => {
        dispatch(setCurrentTopology(id))
        await router.push(`/projects/${currentProjectId}/topologies/${id}`)
    }
    const onDeleteTopology = async (id) => {
        if (id) {
            deleteTopology(id)
            await router.push(`/projects/${currentProjectId}`)
        }
    }
    const onCreateTopology = (name) => {
        if (name) {
            dispatch(addTopology(currentProjectId, name, undefined))
        }
        setVisible(false)
    }
    const onDuplicateTopology = (name, id) => {
        if (name) {
            dispatch(addTopology(currentProjectId, name, id))
        }
        setVisible(false)
    }
    const onCancel = () => setVisible(false)

    return (
        <>
            <TopologyListComponent
                topologies={topologies}
                currentTopologyId={currentTopologyId}
                onChooseTopology={onChooseTopology}
                onNewTopology={() => setVisible(true)}
                onDeleteTopology={onDeleteTopology}
            />
            <NewTopologyModalComponent
                show={isVisible}
                topologies={topologies}
                onCreateTopology={onCreateTopology}
                onDuplicateTopology={onDuplicateTopology}
                onCancel={onCancel}
            />
        </>
    )
}

export default TopologyListContainer