+
+
);
}
diff --git a/src/app/virtual-tours/[tourId]/tour-end/page.tsx b/src/app/virtual-tours/[tourId]/tour-end/page.tsx
index 21507c6..0ccbedc 100644
--- a/src/app/virtual-tours/[tourId]/tour-end/page.tsx
+++ b/src/app/virtual-tours/[tourId]/tour-end/page.tsx
@@ -10,6 +10,7 @@ import { fetchTourDisplays } from '../../../../supabase/tour_displays/queries';
import { BackArrow, Congratulations } from '../../../../../public/icons';
import ButtonWithText from '../../../../components/userComponents/ButtonWithText/ButtonWithText';
import RelatedLinks from '../../../../components/userComponents/RelatedLinks/RelatedLinks';
+import Footer from '../../../../components/userComponents/Footer/Footer';
/**
* @param params -
@@ -84,6 +85,7 @@ export default function TourEndPage({
+
) : (
@@ -114,6 +116,7 @@ export default function TourEndPage({
+
);
}
diff --git a/src/app/virtual-tours/page.tsx b/src/app/virtual-tours/page.tsx
index 272424a..4c00e2c 100644
--- a/src/app/virtual-tours/page.tsx
+++ b/src/app/virtual-tours/page.tsx
@@ -11,6 +11,7 @@ import { TourRow, MediaRow, TourMediaRow } from '../../types/types';
import { BackArrow } from '../../../public/icons';
import NavBar from '../../components/userComponents/NavBar/NavBar';
import NextButton from '../../components/userComponents/NextButton/NextButton';
+import Footer from '../../components/userComponents/Footer/Footer';
/**
* @returns The virtual tours page.
@@ -52,158 +53,165 @@ export default function VirtualToursPage() {
{isWide ? (
-
-
-
-
- Home / Virtual Tours
-
-
Virtual Tours
-
- Take a virtual sneak peek behind the scenes at our Wildlife Care
- Center. Here you will find outside enclosures where sick,
- injured, and orphaned wildlife recuperate and acclimate before
- being released back into their natural habitat. Choose your
- favorite animal to start the tour.
-
-
-
+ <>
+
+
+
+
+ Home / Virtual
+ Tours
+
+
Virtual Tours
+
+ Take a virtual sneak peek behind the scenes at our Wildlife
+ Care Center. Here you will find outside enclosures where sick,
+ injured, and orphaned wildlife recuperate and acclimate before
+ being released back into their natural habitat. Choose your
+ favorite animal to start the tour.
+
- Take a virtual sneak peek behind the scenes at our Wildlife Care
- Center. Here you will find outside enclosures where sick, injured,
- and orphaned wildlife recuperate and acclimate before being
- released back into their natural habitat. Choose your favorite
- animal to start the tour.
-
+
Virtual Tours
+
+ Take a virtual sneak peek behind the scenes at our Wildlife Care
+ Center. Here you will find outside enclosures where sick,
+ injured, and orphaned wildlife recuperate and acclimate before
+ being released back into their natural habitat. Choose your
+ favorite animal to start the tour.
+
)}
+
);
}
diff --git a/src/app/wildlife-spotlights/page.tsx b/src/app/wildlife-spotlights/page.tsx
index 9470e22..a5f5a76 100644
--- a/src/app/wildlife-spotlights/page.tsx
+++ b/src/app/wildlife-spotlights/page.tsx
@@ -9,6 +9,7 @@ import { fetchAllTourMedia } from '../../supabase/tour_media/queries';
import NavBar from '../../components/userComponents/NavBar/NavBar';
import { TourRow, MediaRow, TourMediaRow } from '../../types/types';
import { BackArrow } from '../../../public/icons';
+import Footer from '../../components/userComponents/Footer/Footer';
/**
* @returns The spotlights page.
@@ -62,160 +63,166 @@ export default function WildlifeSpotlightsPage() {
{isWide ? (
-
-
-
- Home / Wildlife
- Spotlights
-
-
-
Wildlife Spotlights
-
- Wildlife Spotlights provide answers to many frequently asked
- questions. You’ll find information on topics ranging from what
- to do if you encounter a baby bird lost from its nest to how to
- deal with nuisance animals in your yard.
-
-
-
+ <>
+
+
+
+ Home / Wildlife
+ Spotlights
+
+
+
Wildlife Spotlights
+
+ Wildlife Spotlights provide answers to many frequently asked
+ questions. You’ll find information on topics ranging from what
+ to do if you encounter a baby bird lost from its nest to how
+ to deal with nuisance animals in your yard.
+
- Wildlife Spotlights provide answers to many frequently asked
- questions. You’ll find information on topics ranging from what
- to do if you encounter a baby bird lost from its nest to how to
- deal with nuisance animals in your yard.
-
-
+
+
Wildlife Spotlights
+
+ Wildlife Spotlights provide answers to many frequently asked
+ questions. You’ll find information on topics ranging from what
+ to do if you encounter a baby bird lost from its nest to how
+ to deal with nuisance animals in your yard.
+
+ );
+}
+
+/**
+ * @returns the footer component seen on bottom of every page
+ * if no email is entered and the user clicks the submit button, an error message will pop up.
+ * if an invalid email is entered and the user clicks the submit button, another error message will pop up.
+ * otherwise, if a valid email is submitted and properly subscribed, another pop up will appear that will tell the user they are subscribed and direct them to another page.
+ */
+export default function Footer() {
+ const [inputValueName, setNameValue] = useState('');
+ const [inputValueEmail, setEmailValue] = useState('');
+ const [showError, setShowError] = useState(false);
+ const [errorMsg, setErrorMsg] = useState('');
+
+ const subbed = () =>
+ Boolean(JSON.parse(window.sessionStorage.getItem('subscribed') || 'false'));
+ const [subscribed, setSubscribed] = useState(subbed);
+
+ useEffect(() => {
+ window.sessionStorage.setItem('subscribed', subscribed.toString());
+ }, [subscribed]);
+
+ const handleNameChange = (e: React.ChangeEvent) => {
+ setNameValue(e.target.value);
+ setShowError(false);
+ };
+
+ const handleEmailChange = (e: React.ChangeEvent) => {
+ setEmailValue(e.target.value);
+ setShowError(false);
+ };
+
+ // const { error } = await supabase.from('emails').insert({ id: 1, name: 'Denmark' })
+
+ const isValidEmail = (email: string) => {
+ const emailRegex = /^[^\s@]+@[^\s@]+\.(com|ca)$/;
+ return emailRegex.test(email);
+ };
+
+ const handleSubmit = async (e: React.FormEvent) => {
+ e.preventDefault();
+ // check name
+ if (!inputValueName.trim()) {
+ setShowError(true);
+ const nameElem = document.getElementById('nameInput');
+ if (nameElem) {
+ nameElem.style.borderColor = 'red';
+ }
+ setErrorMsg('Please enter a name');
+ } else if (!inputValueEmail.trim()) {
+ // Handle the case for an empty email
+ setShowError(true);
+ const emailElem = document.getElementById('emailInput');
+ if (emailElem) {
+ emailElem.style.borderColor = 'red';
+ }
+ setErrorMsg('Please enter an email address');
+ } else if (isValidEmail(inputValueEmail)) {
+ // Handle the submission for a valid email
+ try {
+ // Insert the email into the Supabase database
+ const { error } = await supabase
+ .from('emails')
+ .insert({ emails: inputValueEmail, first_name: inputValueName });
+ // console.log('successfully inserted?');
+ } catch (error) {
+ // console.error(error);
+ return error;
+ }
+
+ // miha's edits
+
+ //
+ setSubscribed(true);
+ // console.log('Valid email:', inputValueEmail);
+ // Additional logic for handling a valid email
+ } else {
+ // Handle the case for an invalid email
+ setShowError(true);
+ const emailElem = document.getElementById('emailInput');
+ if (emailElem) {
+ emailElem.style.borderColor = 'red';
+ }
+ setErrorMsg('Enter a valid email format (ex. example@mail.com)');
+ }
+ return null;
+ };
+ return (
+
+
+
+ );
+}
diff --git a/src/components/userComponents/emailPopup/page.tsx b/src/components/userComponents/emailPopup/page.tsx
deleted file mode 100644
index af4b935..0000000
--- a/src/components/userComponents/emailPopup/page.tsx
+++ /dev/null
@@ -1,211 +0,0 @@
-'use client';
-
-import React, { ChangeEventHandler, Fragment, useState } from 'react';
-import { Dialog, Transition } from '@headlessui/react';
-import { PiPaperPlaneTiltBold, PiSealCheck } from 'react-icons/pi';
-import { VscClose } from 'react-icons/vsc';
-import { BiErrorCircle } from 'react-icons/bi';
-import Link from 'next/link';
-import supabase from '../../../supabase/client';
-
-/**
- *
- * @param props - props
- * @param props.backLink - the link to the page the user will be directed to after they subscribe
- * @returns an email pop up.
- */
-function EmailSuccess({ backLink }: { backLink: string }) {
- return (
-
-
-
-
-
-
- THANKS FOR SUBSCRIBING!
-
-
-
-
- Your sign-up request was successful! Please check your email inbox to
- confirm.
-
-
-
-
-
-
-
-
-
- );
-}
-
-type EmailInputProps = {
- inputValue: string;
- // eslint-disable-next-line @typescript-eslint/no-explicit-any
- handleChange: (e: any) => void;
- // eslint-disable-next-line @typescript-eslint/no-explicit-any
- handleSubmit: (e: any) => void;
- showError: boolean;
- errorMsg: string;
-};
-
-/**
- *
- * @param props - props
- * @param props.inputValue - the value of the email input
- * @param props.handleChange - the function that handles the change of the email input
- * @param props.handleSubmit - the function that handles the submission of the email input
- * @param props.showError - a boolean that determines if the error message should be shown
- * @param props.errorMsg - the error message that will be shown if showError is true
- * @returns an email pop up.
- */
-function EmailInput({
- inputValue,
- handleChange,
- handleSubmit,
- showError,
- errorMsg,
-}: EmailInputProps) {
- return (
- <>
-
-
-
-
-
-
-
- JOIN OUR NEWSLETTER!
-
-
-
-
- Monthly updates on our work and involvement opportunities.
-
-
-
-
-
-
-
-
-
-
-
- {showError && (
-
- {/* Display your error message or handle the error case */}
-
-
-
-
- {errorMsg}
-
-
- )}
-
- );
-}
-
-/**
- * @param props - props
- * @param props.backLink - the link to the page the user will be directed to after they subscribe
- * @returns an email pop up.
- * if no email is entered and the user clicks the submit button, an error message will pop up.
- * if an invalid email is entered and the user clicks the submit button, another error message will pop up.
- * otherwise, if a valid email is submitted and properly subscribed, another pop up will appear that will tell the user they are subscribed and direct them to another page.
- */
-export default function EmailPopup({ backLink }: { backLink: string }) {
- const [isOpen, setIsOpen] = useState(true);
- const [inputValue, setInputValue] = useState('');
- const [showError, setShowError] = useState(false);
- const [errorMsg, setErrorMsg] = useState('');
- const [subscribed, setSubscribed] = useState(false);
-
- const closeModal = () => {
- setIsOpen(false);
- };
-
- // eslint-disable-next-line @typescript-eslint/no-explicit-any
- const handleChange = (e: any) => {
- setInputValue(e.target.value);
- setShowError(false);
- };
-
- // const { error } = await supabase.from('emails').insert({ id: 1, name: 'Denmark' })
-
- const isValidEmail = (email: string) => {
- const emailRegex = /^[^\s@]+@[^\s@]+\.(com|ca)$/;
- return emailRegex.test(email);
- };
-
- // eslint-disable-next-line @typescript-eslint/no-explicit-any, consistent-return
- const handleSubmit = async (e: any) => {
- e.preventDefault();
-
- if (!inputValue.trim()) {
- // Handle the case for an empty email
- setShowError(true);
- setErrorMsg('Please enter an email address');
- } else if (isValidEmail(inputValue)) {
- // Handle the submission for a valid email
- try {
- // Insert the email into the Supabase database
- const { error } = await supabase
- .from('emails')
- .insert({ emails: inputValue });
- } catch (error) {
- console.error(error);
- return error;
- }
-
- // miha's edits
-
- //
- setSubscribed(true);
- console.log('Valid email:', inputValue);
- // Additional logic for handling a valid email
- } else {
- // Handle the case for an invalid email
- setShowError(true);
- setErrorMsg('Enter a valid email format (ex. example@mail.com)');
- }
- };
-
- return (
-
+
+