diff --git a/client/src/components/Projects/RenameSnapshotModal.js b/client/src/components/Projects/RenameSnapshotModal.js
new file mode 100644
index 00000000..bb092976
--- /dev/null
+++ b/client/src/components/Projects/RenameSnapshotModal.js
@@ -0,0 +1,81 @@
+import React, { useState } from "react";
+import PropTypes from "prop-types";
+import { createUseStyles, useTheme } from "react-jss";
+
+import Button from "../Button/Button";
+import { faCopy } from "@fortawesome/free-solid-svg-icons";
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+
+import ModalDialog from "../UI/AriaModal/ModalDialog";
+
+const useStyles = createUseStyles(theme => ({
+ buttonFlexBox: {
+ display: "flex",
+ flexDirection: "row",
+ justifyContent: "center",
+ margin: 0
+ },
+ heading1: theme.typography.heading1,
+ buttonColor: {
+ backgroundColor: "#eaeff2"
+ }
+}));
+
+export default function RenameSnapshotModal({
+ mounted,
+ onClose,
+ selectedProjectName
+}) {
+ const theme = useTheme();
+ const classes = useStyles({ theme });
+ const [snapshotProjectName, setSnapshotProjectName] = useState(
+ `${selectedProjectName}`
+ );
+
+ return (
+
+
+ Rename Snapshot?
+
+
+ What would you like to rename your snapshot to?
+
+
+ setSnapshotProjectName(e.target.value)}
+ />
+
+
+
+
+
+
+ );
+}
+
+RenameSnapshotModal.propTypes = {
+ mounted: PropTypes.bool,
+ onClose: PropTypes.func,
+ selectedProjectName: PropTypes.string
+};
diff --git a/client/src/services/project.service.js b/client/src/services/project.service.js
index 00096a48..cdeb587c 100644
--- a/client/src/services/project.service.js
+++ b/client/src/services/project.service.js
@@ -30,6 +30,10 @@ export function snapshot(id) {
return axios.put(baseUrl + "/snapshot", id);
}
+export function renameSnapshot(id) {
+ return axios.put(baseUrl + "/renameSnapshot", id);
+}
+
export function getAllArchivedProjects() {
try {
return axios.get(`${baseUrl}/archivedprojects`);