1 files changed, 35 insertions, 0 deletions
diff --git a/opendc-web/opendc-web-ui/src/containers/projects/NewProjectContainer.js b/opendc-web/opendc-web-ui/src/containers/projects/NewProjectContainer.js
new file mode 100644
index 00000000..e03b5c07
--- /dev/null
+++ b/opendc-web/opendc-web-ui/src/containers/projects/NewProjectContainer.js
@@ -0,0 +1,35 @@
+import React, { useState } from 'react'
+import { useDispatch } from 'react-redux'
+import { addProject } from '../../redux/actions/projects'
+import TextInputModal from '../../components/modals/TextInputModal'
+import { Button } from 'reactstrap'
+import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
+import { faPlus } from '@fortawesome/free-solid-svg-icons'
+
+/**
+ * A container for creating a new project.
+ */
+const NewProjectContainer = () => {
+    const [isVisible, setVisible] = useState(false)
+    const dispatch = useDispatch()
+    const callback = (text) => {
+        if (text) {
+            dispatch(addProject(text))
+        }
+        setVisible(false)
+    }
+
+    return (
+        <>
+            <div className="bottom-btn-container">
+                <Button color="primary" className="float-right" onClick={() => setVisible(true)}>
+                    <FontAwesomeIcon icon={faPlus} className="mr-2" />
+                    New Project
+                </Button>
+            </div>
+            <TextInputModal title="New Project" label="Project title" show={isVisible} callback={callback} />
+        </>
+    )
+}
+
+export default NewProjectContainer