saving work to pass in URL parameter

src/ApplicationViews.js

@@ -19,6 +19,7 @@ export const ApplicationViews = () => {
             </Route >
         <Route exact path = "/SelectTags">
             <SelectTags />
+                <
         </Route>
         <Route exact path = "/PhotosByTag">
             <PhotosByTag />

src/home/Home.js

@@ -4,6 +4,7 @@ import { postImages, getImages } from "./HomeManager";
 
 export const Home = () => {
     const homeImages = useState([])
+    const { id } = useParams()
     const history = useHistory()
     const[ businessImages, setbusinessImages] = useState([])
     const [image, setImage] = useState({
@@ -71,7 +72,7 @@ const defaultImageState =
      () => 
  { postImages(image, file_name)
  .then(setImage(defaultImageState))
- .then(history.push("/SelectTags"))
+ .then(history.push(`/SelectTags/${image.id}`))
  // code to rename the browse label. This is not working but should be done after other views are complete .then(setfile_Name("").then(resetFileNameOnUpload("No file chosen"))
      // Upload the stringified image that is stored in state
  }}>Upload</button>

src/images/MyImages.js

@@ -1,6 +1,7 @@
 import React, {useState, useEffect} from "react";
 import { useHistory,useParams } from "react-router-dom";
+import { getImages } from "./MyImageManager";
 
 export const MyImages = () => {
-    
+    const [allImages, setAllImages] = useState([])
 }

src/tags/SelectTags.js

@@ -1,9 +1,10 @@
-import react, {useState, useEffect} from "react"
+import react, {useState, useEffect, useRef} from "react"
 import { useHistory, useParams } from "react-router-dom"
 import { getTags } from "./TagManager"
 
 export const SelectTags = () => {
     const [tags, setTags] = useState([])
+    const [tagselections, setTagSelections] = useState([])
     
     useEffect( 
         () => {
@@ -12,6 +13,27 @@ export const SelectTags = () => {
      )
 
      return(
-         <h2>Select Tags for Images</h2>
+         <>
+            <h2>Select Tags for Images</h2>
+
+            <div>
+                
+            {tags.map((tagname) => {
+                    return(
+                        <>
+                        <input type="checkbox" name="imagetags" id= "imagetags" onChange={
+                            (e) => { }
+                        } />
+                        <label for="imagetags">{tagname.image_tag_name}</label>
+                        </>
+                    )
+                }
+                )
+                
+            }
+            {/* <button onClick={(e) =}>Submit</button> */}
+         </div>
+         
+         </>
      )
 }

src/tags/TagManager.js

@@ -1,5 +1,5 @@
 export const getTags = () => {
-    return fetch("http://localhost:8000/tags", {
+    return fetch("http://localhost:8000/image_tags", {
         headers:{
             "Authorization": `Token ${localStorage.getItem("sf_token")}`
         }
@@ -10,7 +10,7 @@ export const getTags = () => {
 
 
 export const createTags = (tag) => {
-    return fetch(`http://localhost:8000/events`, {
+    return fetch(`http://localhost:8000/image_tags`, {
         method: "POST",
         headers:{
             "Authorization": `Token ${localStorage.getItem("sf_token")}`,