From 10999c736d50a186b0cecf8fc801bb74d594af0a Mon Sep 17 00:00:00 2001 From: nnayk <79224511+nnayk@users.noreply.github.com> Date: Fri, 8 Dec 2023 00:18:53 -0800 Subject: [PATCH] Fix backend urls --- Frontend/src/pages/auth.js | 17 +++++---- Frontend/src/pages/create.js | 60 +++++++++++++++++-------------- Frontend/src/pages/leaderboard.js | 24 +++++++------ Frontend/src/pages/login.js | 4 +-- Frontend/src/pages/portfolio.js | 2 +- Frontend/src/pages/register.js | 4 +-- Frontend/src/pages/vote.js | 2 +- 7 files changed, 63 insertions(+), 50 deletions(-) diff --git a/Frontend/src/pages/auth.js b/Frontend/src/pages/auth.js index 10c7263..0dd2a1e 100644 --- a/Frontend/src/pages/auth.js +++ b/Frontend/src/pages/auth.js @@ -1,17 +1,20 @@ // auth.js (utility file) // Import the required libraries -import axios from 'axios'; +import axios from "axios"; // Function to check if the user is authenticated based on the backend verification export async function isAuthenticated(token) { try { // make axios get request sending cookie. - const response = await axios.get('http://localhost:5000/api/verify_user', { - headers: { - Authorization: `Bearer ${token}`, // Send the JWT token in the Authorization header - }, - }); + const response = await axios.get( + "https://picture-perfect.azurewebsites.net/api/verify_user", + { + headers: { + Authorization: `Bearer ${token}`, // Send the JWT token in the Authorization header + }, + } + ); return response.data.authenticated; } catch (error) { @@ -28,4 +31,4 @@ const AuthPage = () => { ); }; -export default AuthPage; \ No newline at end of file +export default AuthPage; diff --git a/Frontend/src/pages/create.js b/Frontend/src/pages/create.js index 8bec443..ffb7419 100644 --- a/Frontend/src/pages/create.js +++ b/Frontend/src/pages/create.js @@ -4,7 +4,6 @@ import Image from "next/image"; import Cookie from "js-cookie"; import { isAuthenticated } from "./auth"; - export default function Create() { const [text, setText] = useState(""); const [url, setUrl] = useState(""); @@ -19,15 +18,17 @@ export default function Create() { setGenerating(true); setFailed(false); setImageAccepted(null); - await axios.post( - "http://localhost:5000/generate_image", - { prompt: text }, - { - headers: { - "Authorization": `Bearer ${Cookie.get("token")}` + await axios + .post( + "https://picture-perfect.azurewebsites.net/generate_image", + { prompt: text }, + { + headers: { + Authorization: `Bearer ${Cookie.get("token")}`, + }, } - }, - ).then(response => { + ) + .then((response) => { if (response.data.output) { setUrl(response.data.output); setImageAccepted(null); // Reset the decision state when a new image is fetched @@ -35,34 +36,40 @@ export default function Create() { setFailed(true); console.error(response.data.error); } - }).catch((error) => { + }) + .catch((error) => { setFailed(true); console.error("Error:", error); - }).then(() => { + }) + .then(() => { setGenerating(false); - }); + }); }; const handleAccept = async (e) => { e.preventDefault(); setAccepting(true); - await axios.post("http://localhost:5000/store_image", + await axios + .post( + "https://picture-perfect.azurewebsites.net/store_image", { - "prompt": text, - "url": url + prompt: text, + url: url, }, { - headers: { - "Authorization": `Bearer ${Cookie.get("token")}` - } - }).catch((error) => console.error("Error: ", error)) - .then(() => { - setUrl(""); - setAccepting(false); - setImageAccepted(true); - }); - } + headers: { + Authorization: `Bearer ${Cookie.get("token")}`, + }, + } + ) + .catch((error) => console.error("Error: ", error)) + .then(() => { + setUrl(""); + setAccepting(false); + setImageAccepted(true); + }); + }; const handleReject = () => { setImageAccepted(false); @@ -131,12 +138,11 @@ export default function Create() { ); } - export async function getServerSideProps(context) { const { req } = context; const token = req.cookies["token"]; - if (!await isAuthenticated(token)) { + if (!(await isAuthenticated(token))) { // If the user is not authenticated, redirect them to the login page return { redirect: { diff --git a/Frontend/src/pages/leaderboard.js b/Frontend/src/pages/leaderboard.js index b87730c..07d570f 100644 --- a/Frontend/src/pages/leaderboard.js +++ b/Frontend/src/pages/leaderboard.js @@ -1,6 +1,6 @@ -import React, { useState, useEffect, useRef } from 'react'; -import axios from 'axios'; -import Image from 'next/image'; +import React, { useState, useEffect, useRef } from "react"; +import axios from "axios"; +import Image from "next/image"; const Leaderboard = () => { const [images, setImages] = useState([]); @@ -9,7 +9,8 @@ const Leaderboard = () => { useEffect(() => { // Make a GET request to your Flask server to fetch the top 20 images - axios.get('http://localhost:5000/top_elo_images') + axios + .get("https://picture-perfect.azurewebsites.net/top_elo_images") .then((response) => { setImages(response.data); }) @@ -47,13 +48,17 @@ const Leaderboard = () => { Votable Image
-

{image.creator}

-

{image.elo}

+

+ {image.creator} +

+

+ {image.elo} +

@@ -70,11 +75,10 @@ const Leaderboard = () => { + > Votable Image diff --git a/Frontend/src/pages/login.js b/Frontend/src/pages/login.js index 2044d0a..33f9455 100644 --- a/Frontend/src/pages/login.js +++ b/Frontend/src/pages/login.js @@ -34,8 +34,8 @@ const Login = () => { try { console.log("try"); const response = await axios.post( - "http://localhost:5000/login", - formData, + "https://picture-perfect.azurewebsites.net/login", + formData ); console.log("response", response); diff --git a/Frontend/src/pages/portfolio.js b/Frontend/src/pages/portfolio.js index e87dfe4..95f129c 100644 --- a/Frontend/src/pages/portfolio.js +++ b/Frontend/src/pages/portfolio.js @@ -13,7 +13,7 @@ export default function Portfolio() { useEffect(() => { async function fetch_portfolio() { await axios - .get("http://localhost:5000/fetch_portfolio", { + .get("https://picture-perfect.azurewebsites.net/fetch_portfolio", { headers: { Authorization: `Bearer ${Cookie.get("token")}`, }, diff --git a/Frontend/src/pages/register.js b/Frontend/src/pages/register.js index 4219918..3040734 100644 --- a/Frontend/src/pages/register.js +++ b/Frontend/src/pages/register.js @@ -93,8 +93,8 @@ const Register = () => { try { console.log("try"); const response = await axios.post( - "http://localhost:5000/register", - formData, + "https://picture-perfect.azurewebsites.net/register", + formData ); router.push("/login"); return response; diff --git a/Frontend/src/pages/vote.js b/Frontend/src/pages/vote.js index 0502782..1199ca5 100644 --- a/Frontend/src/pages/vote.js +++ b/Frontend/src/pages/vote.js @@ -5,7 +5,7 @@ import { isAuthenticated } from "./auth"; import axios from "axios"; import styles from "./vote.module.css"; -const backendUrl = "http://localhost:5000"; // Assuming your backend runs on port 5000 +const backendUrl = "https://picture-perfect.azurewebsites.net"; // Assuming your backend runs on port 5000 /** * Calculate the new Elo rating.