From 890406be30423cb0f9d8b239ca3e4d60e9423471 Mon Sep 17 00:00:00 2001 From: bytesparallel Date: Tue, 22 Mar 2022 20:48:46 -0500 Subject: [PATCH] saving progress for the day --- src/ApplicationViews.js | 4 ++-- src/home/Home.js | 4 ++-- src/images/MyImageManager.js | 36 ++++++++++++++++++++++++++++++------ src/images/MyImages.js | 31 ++++++++++++++++++++++++++++++- src/nav/NavBar.js | 2 +- src/profile/EditProfile.js | 18 +++++++++++++++++- src/profile/Profile.js | 18 +++++++++++++++++- src/tags/PhotosByTag.js | 29 ++++++++++++++++++++++++++++- src/tags/SelectTags.js | 21 +++++++++++++++------ src/tags/TagManager.js | 12 ++++++++++++ 10 files changed, 154 insertions(+), 21 deletions(-) diff --git a/src/ApplicationViews.js b/src/ApplicationViews.js index 2bcc0a7..848ad4d 100644 --- a/src/ApplicationViews.js +++ b/src/ApplicationViews.js @@ -17,9 +17,9 @@ export const ApplicationViews = () => { - + - < + diff --git a/src/home/Home.js b/src/home/Home.js index 78ff1ee..1ee8e17 100644 --- a/src/home/Home.js +++ b/src/home/Home.js @@ -1,6 +1,7 @@ import React, {useState, useEffect} from "react"; import { useHistory,useParams } from "react-router-dom"; import { postImages, getImages } from "./HomeManager"; + export const Home = () => { const homeImages = useState([]) @@ -71,8 +72,7 @@ const defaultImageState = diff --git a/src/images/MyImageManager.js b/src/images/MyImageManager.js index 4121a29..6857556 100644 --- a/src/images/MyImageManager.js +++ b/src/images/MyImageManager.js @@ -1,8 +1,32 @@ -export const getImages = () => { - return fetch("http://localhost:8000/images", { - headers:{ - "Authorization": `Token ${localStorage.getItem("sf_token")}` - } - }) + +export const getImageData = () => { + return fetch(`http://localhost:8000/images`, { + headers: { + "Authorization": `Token ${localStorage.getItem("sf_token")}` + } + }) .then(response => response.json()) +} + +export const getImages = (URL) => { + return fetch(`http://localhost:8000/${URL}`, { + headers: { + "Authorization": `Token ${ + localStorage.getItem("sf_token") + }` + } + } + ) + .then(response => response.json()) + } + + +export const deleteImage = (id) => { + return fetch(`http://localhost:8000/images/${id}`, { + method:"DELETE", + headers:{ + "Authorization": `Token ${localStorage.getItem("sf_token")}` + } + } + ) } \ No newline at end of file diff --git a/src/images/MyImages.js b/src/images/MyImages.js index 68ecc9c..228c4e3 100644 --- a/src/images/MyImages.js +++ b/src/images/MyImages.js @@ -1,7 +1,36 @@ import React, {useState, useEffect} from "react"; import { useHistory,useParams } from "react-router-dom"; -import { getImages } from "./MyImageManager"; +import { getImages, getImageData, deleteImage } from "./MyImageManager"; export const MyImages = () => { const [allImages, setAllImages] = useState([]) + const [ imageData, setImageData] = useState([]) + const history = useHistory() + let { id } = useParams(); + + + + useEffect( + () => { + getImageData().then(data => setImageData(data)) + },[] + ) + + + return( + <> +

My Images

+
+ {imageData.map((image) =>{ + return ( + <> + + + + ) + } + )} +
+ + ) } \ No newline at end of file diff --git a/src/nav/NavBar.js b/src/nav/NavBar.js index bf24b7e..33d5a45 100644 --- a/src/nav/NavBar.js +++ b/src/nav/NavBar.js @@ -8,7 +8,7 @@ export const NavBar = () => {
  • - Upload Images + Upload Images
  • My Images diff --git a/src/profile/EditProfile.js b/src/profile/EditProfile.js index 5118bbe..47e218a 100644 --- a/src/profile/EditProfile.js +++ b/src/profile/EditProfile.js @@ -1,6 +1,22 @@ import React, {useState, useEffect} from "react"; import { useHistory,useParams } from "react-router-dom"; +import { getSmug_UserById, putSmug_User } from "./ProfileManager"; + export const EditProfile = () => { - + const { id } = useParams() + const history = useHistory() + const [ usertoedit, setusertoedit] = useState({}) + + useEffect( + () => { + getSmug_UserById().then(data => setusertoedit(data)) + },[] + ) + + return ( +
    + +
    + ) } \ No newline at end of file diff --git a/src/profile/Profile.js b/src/profile/Profile.js index 027c5ea..c4645b5 100644 --- a/src/profile/Profile.js +++ b/src/profile/Profile.js @@ -1,6 +1,22 @@ import React, {useState, useEffect} from "react"; import { useHistory,useParams } from "react-router-dom"; +import { getSmug_UserById } from "./ProfileManager"; export const Profile = () => { - + const [users, setUsers] = useState({}) + + useEffect( + () => { + getSmug_UserById().then(data => setUsers(data)) + },[] + ) +// How to filter a user by their uid? Not quite sure +return ( + <> +

    My Profile

    +
    +

    +
    + +) } \ No newline at end of file diff --git a/src/tags/PhotosByTag.js b/src/tags/PhotosByTag.js index 9e5aa19..727678e 100644 --- a/src/tags/PhotosByTag.js +++ b/src/tags/PhotosByTag.js @@ -1,6 +1,33 @@ import React, {useState, useEffect} from "react"; import { useHistory,useParams } from "react-router-dom"; +import { getImageData } from "../images/MyImageManager"; +import { getTags } from "./TagManager"; export const PhotosByTag = () => { - + const [ imageData, setImageData] = useState([]) + const [ tagdata, settagdata ] = useState([]) + + useEffect( + () => { + getImageData().then(data => setImageData(data)) + },[] + ) + + return( + <> +
    + {imageData.map((image) =>{ + return ( + //

    {tagdata.map((tag)=> tag.image_tag_name )}

    + <> + + + + + ) + } + )} +
    + + ) } \ No newline at end of file diff --git a/src/tags/SelectTags.js b/src/tags/SelectTags.js index e3aeb8f..b062d12 100644 --- a/src/tags/SelectTags.js +++ b/src/tags/SelectTags.js @@ -1,10 +1,12 @@ import react, {useState, useEffect, useRef} from "react" import { useHistory, useParams } from "react-router-dom" -import { getTags } from "./TagManager" +import { getTags, addTagsToImages } from "./TagManager" export const SelectTags = () => { const [tags, setTags] = useState([]) - const [tagselections, setTagSelections] = useState([]) + const [tag_selections, setTagSelections] = useState( new Array(tags.length).fill(0)) + let { id } = useParams(); + const tagscopy = [...tags] useEffect( () => { @@ -18,11 +20,11 @@ export const SelectTags = () => {
    - {tags.map((tagname) => { + {tagscopy.map((tagname) => { return( <> - { } + {tagname.forEach(setTagSelections(e.target.value)) } } /> @@ -31,7 +33,14 @@ export const SelectTags = () => { ) } - {/* */} + < button onClick = { + () => { + addTagsToImages(tag_selections, {id}) + } + } + + + >Submit
    diff --git a/src/tags/TagManager.js b/src/tags/TagManager.js index de29bdb..193f76a 100644 --- a/src/tags/TagManager.js +++ b/src/tags/TagManager.js @@ -21,4 +21,16 @@ export const createTags = (tag) => { ) .then(response => response.json()) + } + + export const addTagsToImages = (id, tag_selections) => { + return fetch(`http://localhost:8000/images/${id}`, { + method: "PUT", + headers:{ + "Authorization": `Token ${localStorage.getItem("sf_token")}`, + "Content-Type": "Application/json" + }, + body:JSON.stringify(tag_selections) + } + ) } \ No newline at end of file