Chore belindas nextjs update api evironment

.env.sample

@@ -0,0 +1,4 @@
+# Copy and create new .env file
+# Public API URL: https://belindascloset.com/api
+# Local API URL: http://localhost:3001/api  // localhost Port and Server's port need to match
+API_URL=http://localhost:3001/api

app/add-product-page/page.tsx

@@ -22,9 +22,8 @@ import {
   ProductSizePantsInseamList,
 } from "./product-prop-list";
 import UnauthorizedPageMessage from "@/components/UnauthorizedPageMessage";
-// WARNING: You won't be able to connect to local backend unless you remove the env variable below.
-const URL =
-  process.env.BELINDAS_CLOSET_PUBLIC_API_URL || "http://localhost:3000/api";
+
+const URL = process.env.BELINDAS_CLOSET_PUBLIC_API_URL;
 
 const AddProduct = () => {
   const [productType, setProductType] = useState<string>("");

app/archived-products-page/page.tsx

@@ -5,8 +5,8 @@ import ProductCard from "@/components/ProductCard";
 import logo from "@/public/belinda-images/logo.png";
 import { Container, Grid, Typography } from "@mui/material";
 import UnauthorizedPageMessage from "@/components/UnauthorizedPageMessage";
-// WARNING: You won't be able to connect to local backend unless you remove the env variable below.
-const URL = process.env.BELINDAS_CLOSET_PUBLIC_API_URL || "http://localhost:3000/api";
+
+const URL = process.env.BELINDAS_CLOSET_PUBLIC_API_URL;
 const placeholderImg = logo;
 interface Product {
   _id: string;

app/auth/change-password-page/page.tsx

@@ -21,9 +21,8 @@ import ErrorAlert from "@/components/ErrorAlert";
 import SuccessAlert from "@/components/SuccessAlert";
 import { useRouter } from "next/navigation";
 import UnauthorizedPageMessage from "@/components/UnauthorizedPageMessage";
-// WARNING: You won't be able to connect to local backend unless you remove the env variable below.
-const URL =
-  process.env.BELINDAS_CLOSET_PUBLIC_API_URL || "http://localhost:3000/api";
+
+const URL = process.env.BELINDAS_CLOSET_PUBLIC_API_URL;
 
 const ChangePasswordPage = () => {
   const [password, setPassword] = useState({

app/auth/reset-password-page/page.tsx

@@ -14,9 +14,8 @@ import {
   TextField,
   Typography,
 } from "@mui/material";
-// WARNING: You won't be able to connect to local backend unless you remove the env variable below.
-const URL =
-  process.env.BELINDAS_CLOSET_PUBLIC_API_URL || "http://localhost:3000/api";
+
+const URL = process.env.BELINDAS_CLOSET_PUBLIC_API_URL;
 
 const ResetPasswordPage = () => {
   const [password, setPassword] = useState({

app/auth/sign-in/page.tsx

@@ -16,8 +16,11 @@ import {
   useMediaQuery,
 } from "@mui/material";
 import useAuth from "@/hooks/useAuth";
-// WARNING: You won't be able to connect to local backend unless you remove the env variable below.
-const URL = process.env.BELINDAS_CLOSET_PUBLIC_API_URL || "http://localhost:3000/api";
+// Check env.local file to update API address
+const URL = process.env.BELINDAS_CLOSET_PUBLIC_API_URL;
+if (URL?.includes('localhost')) {
+  console.log('Dev API Address: ',URL)
+}
 
 const Signin = () => {
   const [error, setError] = useState("");

app/auth/sign-up/page.tsx

@@ -11,9 +11,11 @@ import { Link as MuiLink } from "@mui/material";
 import ErrorAlert from "@/components/ErrorAlert";
 import SuccessAlert from "@/components/SuccessAlert";
 import { useRouter } from "next/navigation";
-// WARNING: You won't be able to connect to local backend unless you remove the env variable below.
-const URL =
-  process.env.BELINDAS_CLOSET_PUBLIC_API_URL || "http://localhost:3000/api";
+// Check env.local file to update API address
+const URL = process.env.BELINDAS_CLOSET_PUBLIC_API_URL;
+if (URL?.includes('localhost')) {
+  console.log('Dev API Address: ',URL)
+}
 
 const SignUp = () => {
   // handling user's incoming info

app/category-page/[categoryId]/page.tsx

@@ -4,9 +4,9 @@ import React, { useState, useEffect, Dispatch, SetStateAction } from "react";
 import ProductCard from "@/components/ProductCard";
 import logo from "@/public/belinda-images/logo.png";
 import { Container, Grid, Typography } from "@mui/material";
-// WARNING: You won't be able to connect to local backend unless you remove the env variable below.
+
 const URL =
-  process.env.BELINDAS_CLOSET_PUBLIC_API_URL || "http://localhost:3000/api";
+  process.env.BELINDAS_CLOSET_PUBLIC_API_URL;
 const placeholderImg = logo;
 interface Product {
   _id: string;

app/category-page/[categoryId]/products/[productId]/page.tsx

@@ -3,9 +3,9 @@
 import React, { useState, useEffect } from "react";
 import { CircularProgress } from "@mui/material";
 import ProductDetailDisplay from "../[productId]/ProductDetailDisplay";
-// WARNING: You won't be able to connect to local backend unless you remove the env variable below.
+
 const URL =
-  process.env.BELINDAS_CLOSET_PUBLIC_API_URL || "http://localhost:3000/api";
+  process.env.BELINDAS_CLOSET_PUBLIC_API_URL;
 interface Product {
   _id: string;
   productType: string[];

app/category-page/all-products/page.tsx

@@ -4,8 +4,8 @@ import React, { useState, useEffect, Dispatch, SetStateAction } from "react";
 import ProductCard from "@/components/ProductCard";
 import logo from "@/public/belinda-images/logo.png";
 import { Container, Grid, Typography } from "@mui/material";
-// WARNING: You won't be able to connect to local backend unless you remove the env variable below.
-const URL = process.env.BELINDAS_CLOSET_PUBLIC_API_URL || "http://localhost:3000/api";
+
+const URL = process.env.BELINDAS_CLOSET_PUBLIC_API_URL;
 const placeholderImg = logo;
 interface Product {
   _id: string;

app/edit-user-role-page/page.tsx

@@ -3,9 +3,8 @@ import React, { useState, useEffect } from "react";
 import UserCard from "../../components/UserCard";
 import { Stack, Typography } from "@mui/material";
 import UnauthorizedPageMessage from "@/components/UnauthorizedPageMessage";
-// WARNING: You won't be able to connect to local backend unless you remove the env variable below.
-const URL =
-  process.env.BELINDAS_CLOSET_PUBLIC_API_URL || "http://localhost:3000/api";
+
+const URL = process.env.BELINDAS_CLOSET_PUBLIC_API_URL;
 
 /**
  * Represents a user.

app/profile/page.tsx

@@ -6,8 +6,8 @@ import { Box, Button, Stack, Typography, useMediaQuery, useTheme } from "@mui/ma
 import EditUserDetailsDialog from "@/components/EditUserDetailsDialog";
 import { useRouter } from "next/navigation";
 import UnauthorizedPageMessage from "@/components/UnauthorizedPageMessage";
-// WARNING: You won't be able to connect to local backend unless you remove the env variable below.
-const URL = process.env.BELINDAS_CLOSET_PUBLIC_API_URL || "http://localhost:3000/api";
+
+const URL = process.env.BELINDAS_CLOSET_PUBLIC_API_URL;
 
 /**
  * Represents a user.

components/ConfirmArchiveDialog.tsx

@@ -7,9 +7,8 @@ import React, { useState } from "react";
 import { Product } from "@/app/category-page/[categoryId]/products/[productId]/ProductDetailDisplay";
 import Snackbar from "@mui/material/Snackbar";
 import { useMediaQuery, useTheme } from "@mui/material";
-// WARNING: You won't be able to connect to local backend unless you remove the env variable below.
-const URL =
-  process.env.BELINDAS_CLOSET_PUBLIC_API_URL || "http://localhost:3000/api";
+
+const URL =  process.env.BELINDAS_CLOSET_PUBLIC_API_URL;
 /**
  * Props for the ConfirmArchiveDialog component.
  */

components/ConfirmDeleteDialog.tsx

@@ -7,9 +7,8 @@ import React, { useState } from "react";
 import { Product } from "@/app/category-page/[categoryId]/products/[productId]/ProductDetailDisplay";
 import Snackbar, { SnackbarOrigin } from "@mui/material/Snackbar";
 import { useMediaQuery, useTheme } from "@mui/material";
-// WARNING: You won't be able to connect to local backend unless you remove the env variable below.
-const URL =
-  process.env.BELINDAS_CLOSET_PUBLIC_API_URL || "http://localhost:3000/api";
+
+const URL = process.env.BELINDAS_CLOSET_PUBLIC_API_URL;
 /**
  * Props for the ConfirmDeleteDialog component.
  */

components/EditProductDialog.tsx

@@ -19,8 +19,7 @@ import {
 import { TextField, useMediaQuery, useTheme } from "@mui/material";
 import { Padding } from "@mui/icons-material";
 // WARNING: You won't be able to connect to local backend unless you remove the env variable below.
-const URL =
-  process.env.BELINDAS_CLOSET_PUBLIC_API_URL || "http://localhost:3000/api";
+const URL = process.env.BELINDAS_CLOSET_PUBLIC_API_URL;
 
 /**
  * Props for the EditProductDialog component.

components/EditUserRoleDialog.tsx

@@ -15,9 +15,8 @@ import { UserCardProps } from "./UserCard";
 import Snackbar from "@mui/material/Snackbar";
 import Alert, { AlertColor } from "@mui/material/Alert";
 import { useMediaQuery, useTheme } from "@mui/material";
-// WARNING: You won't be able to connect to local backend unless you remove the env variable below.
-const URL =
-  process.env.BELINDAS_CLOSET_PUBLIC_API_URL || "http://localhost:3000/api";
+
+const URL = process.env.BELINDAS_CLOSET_PUBLIC_API_URL;
 
 const options = ["admin", "creator", "user"];
 

components/ProductCard.tsx

@@ -8,9 +8,8 @@ import { Stack, Button, Link, useTheme, useMediaQuery } from "@mui/material";
 import Image from "next/image";
 import DeleteIcon from "@mui/icons-material/Delete";
 import ArchiveIcon from "@mui/icons-material/Archive";
-// WARNING: You won't be able to connect to local backend unless you remove the env variable below.
-const URL =
-  process.env.BELINDAS_CLOSET_PUBLIC_API_URL || "http://localhost:3000/api";
+
+const URL = process.env.BELINDAS_CLOSET_PUBLIC_API_URL;
 
 type ProductCardProps = {
   image: StaticImageData;

next.config.js

@@ -3,8 +3,8 @@ const nextConfig = {
   distDir: "build",
   //reactStrictMode: false, // Uncomment to test API behavior using front-end
   env: {
-    // variable call would be process.env.BELINDAS_CLOSET_PUBLIC_API_URL,
-    BELINDAS_CLOSET_PUBLIC_API_URL: "https://belindascloset.com/api",
+    // Check env.local file to update API address
+    BELINDAS_CLOSET_PUBLIC_API_URL: process.env.API_URL,
   },
 };