diff --git a/frontend/modules/Constants/index.tsx b/frontend/modules/Constants/index.tsx index 8c179c3d..99c0eb35 100644 --- a/frontend/modules/Constants/index.tsx +++ b/frontend/modules/Constants/index.tsx @@ -1,3 +1,12 @@ -const WORKERS_URL= "http://127.0.0.1:8787" -export const SHORTEN_URL = `${WORKERS_URL}/shorten` -export const RETRIEVE_URL = `${WORKERS_URL}/retrieve` \ No newline at end of file +const env = process.env.NODE_ENV; +let WORKERS_URL; +export let BASENAME_URL; +if (env == "development") { + WORKERS_URL = "http://localhost:8787"; + BASENAME_URL = "http://localhost:3000/api"; +} else if (env == "production") { + WORKERS_URL = "https://ristek-link-workers.jonathanfilbert.workers.dev"; + BASENAME_URL = "https://ristek.link"; +} +export const SHORTEN_URL = `${WORKERS_URL}/shorten`; +export const RETRIEVE_URL = `${WORKERS_URL}/retrieve`; diff --git a/frontend/modules/Home/index.tsx b/frontend/modules/Home/index.tsx index bb042fd9..7d2f55c9 100644 --- a/frontend/modules/Home/index.tsx +++ b/frontend/modules/Home/index.tsx @@ -8,6 +8,8 @@ import Button from "../components/Button"; import ResultBox from "../components/ResultBox"; import { useToast } from "@chakra-ui/react"; import useClipboard from "react-use-clipboard"; +import { useRouter } from 'next/router' +import { BASENAME_URL } from '../Constants' const HomePage = () => { const [alias, setAlias] = useState(""); @@ -17,7 +19,7 @@ const HomePage = () => { const [isLoading, setIsLoading] = useState(false); const [isGenerated, setIsGenerated] = useState(false); const [result, setResult] = useState(""); - const [isCopied, setCopied] = useClipboard(`https://ristek.link/${result}`, { + const [isCopied, setCopied] = useClipboard(`${BASENAME_URL}/${result}`, { successDuration: 3000, }); const toast = useToast(); @@ -62,9 +64,11 @@ const HomePage = () => { setIsLoading(false); setAlias(""); setIsGenerated(false); + let message + if (result.error === "AlreadyExists") message = `The short url /${alias} already exists. Please choose another one.` toast({ title: "Error occured", - description: result.data, + description: result.message, status: "error", duration: 5000, isClosable: true, @@ -73,6 +77,20 @@ const HomePage = () => { }); }; + const router = useRouter(); + useEffect(() => { + const { notfound } = router.query + if (notfound) { + toast({ + title: "Error occured", + description: `The short url /${notfound} does not exist.`, + status: "error", + duration: 5000, + isClosable: true, + }); + } + },[router]) + useEffect(() => { if (!!alias && isUrlValid) { return setIsAllowed(true); diff --git a/frontend/modules/components/ResultBox/index.tsx b/frontend/modules/components/ResultBox/index.tsx index c75a47d7..17f1f814 100644 --- a/frontend/modules/components/ResultBox/index.tsx +++ b/frontend/modules/components/ResultBox/index.tsx @@ -1,4 +1,5 @@ import React from "react"; +import { BASENAME_URL } from "../../Constants"; type ResultBoxProps = { onCopy?: () => any; @@ -15,7 +16,7 @@ const ResultBox = (props: ResultBoxProps) => { } else { return (