FEAT: Add Footer

[naumch1k]

Description

This PR introduces page footer.

Task Link

Project Figma

Changes Made

• Updated useNavigation hook to hide the main navigation when the user scrolls to the footer.
• Implemented useFormWithValidation to prevent empty or multiple form submissions.
• Added <Loader /> UI component for reuse across the webpage.
• Added constants re-export to shorten multiple file imports.

Screenshots, GIFs, or videos

Responsiveness

Form Validation

Form uses built-in HTML validation to check user input. Error messages are shown until the input meets the required criteria. When user submits form, here is a loader to indicate that form is being sent, while submit button is disabled to prevent multiple submissions.

If submission is successful, the form resets, and button text changes to 'MESSAGE SENT ✔'. After 10 seconds, button text returns to 'SEND MESSAGE'.

https://github.com/user-attachments/assets/bcfcabf7-af8f-4f94-a3f6-a77ab7c8d7de

Usage

Form still needs to be integrated with email sending service, for now it is set up using a little timeout to simulate form being sent.

  const simulateFormSubmission = () => {
    return new Promise<void>(resolve => {
      setTimeout(() => resolve(), 2000)
    })
  }

  const handleSubmit = (e: FormEvent<HTMLFormElement>) => {
    e.preventDefault()
    setIsSubmitting(true)

    simulateFormSubmission()
      .then(() => {
        setFormSuccessfullySent(true)
        resetForm()
      })
      .catch(error => console.log(error))
      .finally(() => setIsSubmitting(false))
  }

[netlify[bot]]

✅ Deploy Preview for one-fall ready!

Name	Link
🔨 Latest commit	49095a26769af62ffd540b77d0c5d07b2f302368
🔍 Latest deploy log	https://app.netlify.com/sites/one-fall/deploys/669fb5b5c95e4a0008bc49ba
😎 Deploy Preview	https://deploy-preview-16--one-fall.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site configuration.