CEC-3149: Archive Manifest option (#241)

Co-authored-by: Alexander Andrews <aandrews@fiskerinc.com>

src/components/Manifest/Update/index.jsx

@@ -1,15 +1,15 @@
-import React, {useEffect, useState} from "react";
-import {useParams} from "react-router-dom";
+import React, { useEffect, useState } from "react";
+import { useParams } from "react-router-dom";
 import { Redirect } from "react-router";
 import useStyles from "../../useStyles";
-import {ManifestsProvider, useManifestsContext} from "../../Contexts/ManifestsContext";
-import {useUserContext} from "../../Contexts/UserContext";
-import {useStatusContext} from "../../Contexts/StatusContext";
-import {Button, FormControl, InputLabel, Select, TextField} from "@material-ui/core";
+import { ManifestsProvider, useManifestsContext } from "../../Contexts/ManifestsContext";
+import { useUserContext } from "../../Contexts/UserContext";
+import { useStatusContext } from "../../Contexts/StatusContext";
+import { Button, FormControl, InputLabel, Select, TextField } from "@material-ui/core";
 
 const manifestTypes = [
-  {value: "standard", label: "Standard"},
-  {value: "forced", label: "Forced"},
+  { value: "standard", label: "Standard" },
+  { value: "forced", label: "Forced" },
 ];
 
 const emptyManifest = {
@@ -19,23 +19,24 @@ const emptyManifest = {
 
 const MainForm = () => {
 
-  const {manifest_id} = useParams();
+  const { manifest_id } = useParams();
   const classes = useStyles();
 
   const [manifest, setManifest] = useState(null);
   const [redirect, setRedirect] = useState(null);
 
-  const {getManifest, busy, updateManifest} = useManifestsContext();
+  const { getManifest, busy, updateManifest } = useManifestsContext();
   const {
     token: {
-      idToken: {jwtToken: token},
+      idToken: { jwtToken: token },
     },
   } = useUserContext();
 
-  const {setMessage, setTitle, setSitePath} = useStatusContext();
+  const { setMessage, setTitle, setSitePath } = useStatusContext();
 
   const [name, setName] = useState("");
   const [type, setType] = useState("");
+  const [active, setActive] = useState(true); // So !active = archived
 
 
   const changeName = (e) => {
@@ -46,10 +47,14 @@ const MainForm = () => {
     setType(e.target.value);
   };
 
+  const changeActive = (e) => {
+    setActive(e.target.value === 'true')
+  }
+
   const onSubmit = async (e) => {
     e.preventDefault();
     try {
-      const result = await updateManifest(manifest_id, {name, type}, token);
+      const result = await updateManifest(manifest_id, { name, type, active }, token);
       if (!result || result.error) return;
 
       setMessage(`Updated manifest ${manifest_id}`);
@@ -70,6 +75,7 @@ const MainForm = () => {
           setManifest(result);
           setName(result.name);
           setType(result.type);
+          setActive(result.active)
         }
       } catch (e) {
         setMessage(e.message);
@@ -156,6 +162,29 @@ const MainForm = () => {
             ))}
           </Select>
         </FormControl>
+        <FormControl
+          className={classes.form}
+          variant="outlined"
+          fullWidth
+          margin="normal"
+        >
+          <InputLabel htmlFor="manifest-active" className={classes.whiteBackground}>
+            Type
+          </InputLabel>
+          <Select
+            native
+            value={active}
+            variant="outlined"
+            inputProps={{
+              name: "manifest-active",
+              id: "send-manifest-active",
+            }}
+            onChange={changeActive}
+          >
+            <option key={0} value={true}>active</option>
+            <option key={1} value={false}>archived</option>
+          </Select>
+        </FormControl>
         <Button
           type="submit"
           aria-label="send command"
@@ -176,7 +205,7 @@ const MainForm = () => {
 
 const ManifestUpdate = () => (
   <ManifestsProvider>
-    <MainForm/>
+    <MainForm />
   </ManifestsProvider>
 );