diff --git a/src/app/(main)/contact/page.tsx b/src/app/(main)/contact/page.tsx index 0482887..c7edc76 100644 --- a/src/app/(main)/contact/page.tsx +++ b/src/app/(main)/contact/page.tsx @@ -38,11 +38,10 @@ export default async function ContactPage() {
- - }> - - - + + }> + +
); diff --git a/src/app/(main)/home-bg-video/page.tsx b/src/app/(main)/home-bg-video/page.tsx index a7a9dfa..6b78ae9 100644 --- a/src/app/(main)/home-bg-video/page.tsx +++ b/src/app/(main)/home-bg-video/page.tsx @@ -1,18 +1,18 @@ // "use client"; -import Hero6 from "@/components/Hero"; +import Hero from "@/components/Hero"; // const ParallaxContainer = dynamic(() => import("@/components/ParallaxContainer"), { // ssr: false, // }); -export default function Home1BGVideoMultiPage() { +export default function HomeBgVideo() { return ( <>
- +
diff --git a/src/app/(main)/not-found.tsx b/src/app/(main)/not-found.tsx new file mode 100644 index 0000000..e2bc124 --- /dev/null +++ b/src/app/(main)/not-found.tsx @@ -0,0 +1,39 @@ +"use client"; +import Link from "next/link"; + +export default function NotFound() { + return ( +
+
+ {/* Home Section Content */} +
+
+
+
+
+

404

+
+
+

The page you were looking for could not be found.

+
+
+ + + Back To Home Page + +
+
+
+
+
+ {/* End Home Section Content */} +
+
+ ); +} diff --git a/src/app/(main)/slick-about-dark/AboutDropdown.tsx b/src/app/(main)/slick-about-dark/AboutDropdown.tsx deleted file mode 100644 index 46f7854..0000000 --- a/src/app/(main)/slick-about-dark/AboutDropdown.tsx +++ /dev/null @@ -1,54 +0,0 @@ -"use client"; -import React, { useState, useRef } from "react"; -import Link from "next/link"; - -export default function AboutDropdown() { - // State to manage dropdown visibility - const [isDropdownOpen, setIsDropdownOpen] = useState(false); - - const dropdownRef = useRef(null); - - // Toggle dropdown visibility - const toggleDropdown = () => { - setIsDropdownOpen(!isDropdownOpen); - }; - - return ( -
  • - { - e.preventDefault(); - toggleDropdown(); - }} - > - About - - - {/* Dropdown menu with sliding effect */} -
      -
    • - - Our Oncology Center - -
      • -
    • - - Our Staff - -
      • -
    • - - Announcements - -
      • -
    -
    • - ); -} diff --git a/src/app/(main)/slick-about-dark/page.tsx b/src/app/(main)/slick-about-dark/page.tsx deleted file mode 100644 index a9b21e2..0000000 --- a/src/app/(main)/slick-about-dark/page.tsx +++ /dev/null @@ -1,84 +0,0 @@ -import Image from "next/image"; - -export const metadata = { - title: "Slick About Dark || Cochise Oncology", - description: "Cochise Oncology", -}; -const dark = true; -export default function SlickAboutPageDark() { - return ( - <> -
    - {/* */} -
    - -
    - {/* */} - -
    -
    -
    -

    Our Oncology Center

    - - {/*

    - Crafting immersive digital journeys for brands. -

    */} -
    -
    -
    -
    - {/*
    */} -
    -
    -
    -
    -

    Our Commitment to Excellence

    -

    - Get compassionate care and excellent medical services from COCHISE ONCOLOGY in Sierra Vista, Arizona. We - offer a multidisciplinary approach to cancer care with multiple physicians who work together to guide - each patient through diagnosis, treatment, and recovery. Our services cover radiation, chemotherapy, - immunotherapy, hematology, and infusion services. -

    - -

    - Cochise Oncology’s professional staff works hard to ensure a positive experience throughout the entire - course of treatment. While we are best known for our leading-edge cancer therapies, we take particular - pride in compassion and dedication to our doctors and entire staff. Excellence in patient care on every - level is our commitment. -

    - -

    - Here at Cochise Oncology, we offer the most up-to-date technology in cancer treatment that rivals the - largest and most prestigious centers in the country. -

    - -

    We go the extra mile to address the needs of our patients.

    -
    -
    -
    -
    - -
    -
    -

    Begin your path to healing with Cochise Oncology

    -

    - Our dedicated team in Sierra Vista, AZ is here to support you with hope, strength, and courage. We offer - personalized cancer care using innovative treatments in our state-of-the-art facility. Take the first step - towards comprehensive, patient-focused treatment by scheduling a consultation. Let us listen to your needs, - answer your questions, and create a tailored plan for your journey. Fill out our form to connect with our - compassionate experts and discover how Cochise Oncology can stand with you in your fight against cancer. -

    - - Get Started → - -
    -
    - - ); -} diff --git a/src/app/(main)/slick-about-dark/page1.tsx b/src/app/(main)/slick-about-dark/page1.tsx deleted file mode 100644 index c33b78a..0000000 --- a/src/app/(main)/slick-about-dark/page1.tsx +++ /dev/null @@ -1,226 +0,0 @@ -import Facts from "@/components/Facts"; -import Testimonials from "@/components/Testimonials"; -import TestimonialsDark from "@/components/TestimonialsDark"; -import { features4 } from "@/data/features"; -import Image from "next/image"; -import Link from "next/link"; - -export const metadata = { - title: "Slick About Dark || Cochise Oncology", - description: "Cochise Oncology", -}; -const dark = true; -export default function SlickAboutPageDark() { - return ( - <> -
    - {/* */} -
    - -
    - {/* */} - -
    -
    -
    -

    Our Oncology Center

    - - {/*

    - Crafting immersive digital journeys for brands. -

    */} -
    -
    -
    -
    - {/*
    */} -
    -
    -
    -
    -

    Our Commitment to Excellence

    -

    - Get compassionate care and excellent medical services from COCHISE ONCOLOGY in Sierra Vista, Arizona. We - offer a multidisciplinary approach to cancer care with multiple physicians who work together to guide - each patient through diagnosis, treatment, and recovery. Our services cover radiation, chemotherapy, - immunotherapy, hematology, and infusion services. -

    - -

    - Cochise Oncology’s professional staff works hard to ensure a positive experience throughout the entire - course of treatment. While we are best known for our leading-edge cancer therapies, we take particular - pride in compassion and dedication to our doctors and entire staff. Excellence in patient care on every - level is our commitment. -

    - -

    - Here at Cochise Oncology, we offer the most up-to-date technology in cancer treatment that rivals the - largest and most prestigious centers in the country. -

    - -

    We go the extra mile to address the needs of our patients.

    -
    -
    -
    -
    - -
    -
    -

    Begin your path to healing with Cochise Oncology

    -

    - Our dedicated team in Sierra Vista, AZ is here to support you with hope, strength, and courage. We offer - personalized cancer care using innovative treatments in our state-of-the-art facility. Take the first step - towards comprehensive, patient-focused treatment by scheduling a consultation. Let us listen to your needs, - answer your questions, and create a tailored plan for your journey. Fill out our form to connect with our - compassionate experts and discover how Cochise Oncology can stand with you in your fight against cancer. -

    - - Get Started → - -
    -
    - -
    -
    -
    - {/* Section Text */} -
    -
    -

    Our Story

    -

    We believe in creatives with a passion to smart design.

    -

    - Etiam fermentum vehicula faucibus. Praesent ullamcorper urna id arcu molestie scelerisque. Sed - imperdiet tristique mauris et faucibus. Maecenas semper augue non fringilla placerat. Curabitur luctus - erat sit amet ultricies aliquam. Donec dictum convallis mauris et maximus. Nullam massa arcu, porta - quis felis et, eleifend varius quam. -

    - {/* Features List */} -
    - {/* Features List Item */} - {features4.map((feature, index) => ( -
    -
    - -
    -
    {feature.text}
    -
    - ))} - {/* End Features List Item */} -
    - {/* End Features List */} -
    - - Start a project - - - - - Learn more - - - -
    -
    -
    - {/* End Section Text */} - {/* Image */} -
    -
    -
    -
    - -
    -
    -
    - Image Description -
    -
    -
    -
    - Image Description -
    -
    -
    -
    -
    - {/* End Images */} -
    -
    -
    -
    - -
    -
    - {dark ? : } -
    -
    -
    -
    - {/* Decoration Circles */} -
    -
    - {/* End Decoration Circles */} -
    -
    -
    -
    -

    Like our creative works?

    -

    - Quisque posuere mollis ullamcorper. Ut eget metus lorem ipsum posuere eget at ex. Aenean consequat - vitae lorem in vehicula. -

    -
    -
    - - View all works - -
    -
    -
    -
    -
    -
    -
    - - ); -} diff --git a/src/app/(main)/slick-about/page.tsx b/src/app/(main)/slick-about/page.tsx deleted file mode 100644 index ad42177..0000000 --- a/src/app/(main)/slick-about/page.tsx +++ /dev/null @@ -1,174 +0,0 @@ -import Facts from "@/components/Facts"; -import Testimonials from "@/components/Testimonials"; -import TestimonialsDark from "@/components/TestimonialsDark"; -import { features4 } from "@/data/features"; -import Image from "next/image"; -import Link from "next/link"; - -export const metadata = { - title: "Slick About || Cochise Oncology", - description: "Cochise Oncology", -}; - -const dark = false; -export default function SlickAboutPage() { - return ( - <> -
    - {/* */} -
    - -
    - {/* */} - -
    -
    -
    -

    About Studio

    - -

    - Crafting immersive digital journeys for brands. -

    -
    -
    -
    -
    -
    -
    -
    - {/* Section Text */} -
    -
    -

    Our Story

    -

    We believe in creatives with a passion to smart design.

    -

    - Etiam fermentum vehicula faucibus. Praesent ullamcorper urna id arcu molestie scelerisque. Sed - imperdiet tristique mauris et faucibus. Maecenas semper augue non fringilla placerat. Curabitur luctus - erat sit amet ultricies aliquam. Donec dictum convallis mauris et maximus. Nullam massa arcu, porta - quis felis et, eleifend varius quam. -

    - {/* Features List */} -
    - {/* Features List Item */} - {features4.map((feature, index) => ( -
    -
    - -
    -
    {feature.text}
    -
    - ))} - {/* End Features List Item */} -
    - {/* End Features List */} -
    - - Start a project - - - - - Learn more - - - -
    -
    -
    - {/* End Section Text */} - {/* Image */} -
    -
    -
    -
    - -
    -
    -
    - Image Description -
    -
    -
    -
    - Image Description -
    -
    -
    -
    -
    - {/* End Images */} -
    -
    -
    -
    - -
    -
    - {dark ? : } -
    -
    -
    -
    - {/* Decoration Circles */} -
    -
    - {/* End Decoration Circles */} -
    -
    -
    -
    -

    Like our creative works?

    -

    - Quisque posuere mollis ullamcorper. Ut eget metus lorem ipsum posuere eget at ex. Aenean consequat - vitae lorem in vehicula. -

    -
    -
    - - View all works - -
    -
    -
    -
    -
    -
    -
    - - ); -} diff --git a/src/app/(main)/slick-portfolio/page.tsx b/src/app/(main)/slick-portfolio/page.tsx deleted file mode 100644 index 41c4279..0000000 --- a/src/app/(main)/slick-portfolio/page.tsx +++ /dev/null @@ -1,76 +0,0 @@ -import Portfolio from "@/components/Portfolio"; - -import Image from "next/image"; -import Link from "next/link"; - -export const metadata = { - title: "Slick Portfolio || Cochise Oncology", - description: "Cochise Oncology", -}; -const dark = false; -export default function SlickPortfolioPage() { - return ( - <> -
    - {/* */} -
    - -
    - {/* */} - -
    -
    -
    -

    Portfolio

    - -

    - Explore captivating web design solutions. -

    -
    -
    -
    -
    -
    -
    - -
    -
    - -
    -
    -
    - {/* Decoration Circles */} -
    -
    - {/* End Decoration Circles */} -
    -
    -
    -
    -

    Like our creative works?

    -

    - Quisque posuere mollis ullamcorper. Ut eget metus lorem ipsum posuere eget at ex. Aenean consequat - vitae lorem in vehicula. -

    -
    -
    - - View all works - -
    -
    -
    -
    -
    -
    -
    - - ); -} diff --git a/src/app/(main)/slick-services/page.tsx b/src/app/(main)/slick-services/page.tsx deleted file mode 100644 index 8afcceb..0000000 --- a/src/app/(main)/slick-services/page.tsx +++ /dev/null @@ -1,191 +0,0 @@ -import Features from "@/components/Features"; -import Service from "@/components/Service"; - -import Image from "next/image"; -import Link from "next/link"; - -export const metadata = { - title: "Slick Services || Cochise Oncology", - description: "Cochise Oncology", -}; - -const dark = false; -export default function SlickServicesPage() { - return ( - <> -
    - {/* */} -
    - -
    - {/* */} - -
    -
    -
    -

    Our Services

    - -

    - Web design that leaves an impression. -

    -
    -
    -
    -
    -
    -
    -
    - {/* Left Column */} -
    -

    WHAT WE DO

    -

    We provide the best development solutions.

    -

    - The power of design help us to solve complex problems and cultivate business solutions. -

    -
    - - Request a quote - -
    -
    - {/* End Left Column */} - {/* Right Column */} - - {/* End Right Column */} -
    -
    -
    -
    -
    -
    -

    Why choose Resonance?

    -

    - Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et - dolore magna aliqua. -

    -
    -
    - {/* Features Grid */} - - {/* End Features Grid */} -
    -
    -
    -
    -
    -
    - {/* Images */} -
    -
    -
    - Image Description -
    -
    - Image Description -
    -
    - Image Description -
    -
    -
    - {/* End Images */} - {/* Text */} -
    -
    -

    How we work?

    - -

    Get the power of the professional services

    - -

    - Pellentesque ultrices purus sit amet velit eleifend, eu iaculis velit malesuada. Proin id mattis elit. - Nullam a nisi tellus. Mauris rhoncus diam in sem maximus, nec luctus justo imperdiet. Etiam fermentum - vehicula faucibus. -

    - -

    - Praesent ullamcorper urna id arcu molestie scelerisque. Sed imperdiet tristique mauris et faucibus. - Maecenas semper augue non fringilla placerat. Curabitur luctus erat sit amet ultricies aliquam. Donec - dictum convallis mauris et maximus. Nullam massa arcu, porta quis felis et, eleifend varius quam. -

    -
    -
    - {/* End Text */} -
    -
    -
    - -
    -
    -
    - {/* Decoration Circles */} -
    -
    - {/* End Decoration Circles */} -
    -
    -
    -
    -

    Like our creative works?

    -

    - Quisque posuere mollis ullamcorper. Ut eget metus lorem ipsum posuere eget at ex. Aenean consequat - vitae lorem in vehicula. -

    -
    -
    - - View all works - -
    -
    -
    -
    -
    -
    -
    - - ); -} diff --git a/src/app/(main)/testimonials/page.tsx b/src/app/(main)/testimonials/page.tsx index 2ef089b..b580993 100644 --- a/src/app/(main)/testimonials/page.tsx +++ b/src/app/(main)/testimonials/page.tsx @@ -1,13 +1,15 @@ import { BeforeFooterBlock } from "@/components/Blocks/BeforeFooter"; import { GoogleReviewsBlock } from "@/components/Blocks/GoogleReviews"; +import { GoogleReviewsSkeleton } from "@/components/Blocks/GoogleReviews/GoogleReviews"; import Image from "next/image"; +import { Suspense } from "react"; export const metadata = { title: "Testimonials - Cochise Oncology", description: "Testimonials - Cochise Oncology", }; -export default function SlickAboutPage() { +export default async function TestimonialsPage() { return ( <>
    @@ -26,7 +28,9 @@ export default function SlickAboutPage() {
    - + }> + +
    diff --git a/src/app/layout.tsx b/src/app/layout.tsx deleted file mode 100644 index b5d244b..0000000 --- a/src/app/layout.tsx +++ /dev/null @@ -1,54 +0,0 @@ -"use client"; -import { usePathname } from "next/navigation"; -import { useEffect } from "react"; -import { init_wow } from "@/utils/initWow"; -import { parallaxMouseMovement, parallaxScroll } from "@/utils/parallax"; -import { headerChangeOnScroll } from "@/utils/changeHeaderOnScroll"; -import "@/app/globals.css"; -import "swiper/css"; -import "jarallax/dist/jarallax.min.css"; -import "swiper/css/effect-fade"; -import "react-modal-video/css/modal-video.css"; -import "photoswipe/dist/photoswipe.css"; -import "tippy.js/dist/tippy.css"; -import "@public/assets/css/styles.css"; - -export default function RootLayout({ - children, -}: Readonly<{ - children: React.ReactNode; -}>) { - const path = usePathname(); - - useEffect(() => { - init_wow(); - parallaxMouseMovement(); - const mainNav = document.querySelector(".main-nav"); - if (mainNav?.classList.contains("transparent")) { - mainNav.classList.add("js-transparent"); - } else if (!mainNav?.classList?.contains("dark")) { - mainNav?.classList.add("js-no-transparent-white"); - } - - window.addEventListener("scroll", headerChangeOnScroll); - parallaxScroll(); - return () => { - window.removeEventListener("scroll", headerChangeOnScroll); - }; - }, [path]); - - useEffect(() => { - if (typeof window !== "undefined") { - // Import the script only on the client side - // @ts-ignore - import("bootstrap/dist/js/bootstrap.esm").then(() => { - // Module is imported, you can access any exported functionality if - }); - } - }, []); - return ( - - {children} - - ); -} diff --git a/src/app/not-found.tsx b/src/app/not-found.tsx deleted file mode 100644 index 280c92d..0000000 --- a/src/app/not-found.tsx +++ /dev/null @@ -1,72 +0,0 @@ -"use client"; -import Header from "@/components/Header"; -import { BeforeFooterBlock } from "@/components/Blocks/BeforeFooter"; -import { navMenuData } from "@/data/menu"; -import Footer from "@/components/Footer"; -import Link from "next/link"; - -export default function NotFound() { - return ( -
    -
    - -
    -
    -
    - <> - {/* End Navigation Panel */} -
    - {/* Home Section */} -
    -
    - {/* Home Section Content */} -
    -
    -
    -
    -
    -

    404

    -
    -
    -

    - The page you were looking for could not be found. -

    -
    -
    - - - Back To Home Page - -
    -
    -
    -
    -
    - {/* End Home Section Content */} -
    -
    - {/* End Home Section */} -
    - -
    -
    - -
    - {/*
    -
    - -
    */} -
    - {/*
    */} -
    -
    - ); -} diff --git a/src/collections/BlogTags.tsx b/src/collections/BlogTags.ts similarity index 100% rename from src/collections/BlogTags.tsx rename to src/collections/BlogTags.ts diff --git a/src/components/Blocks/Form/Country/index.scss b/src/components/Blocks/Form/Country/index.scss deleted file mode 100644 index 1f5f6ac..0000000 --- a/src/components/Blocks/Form/Country/index.scss +++ /dev/null @@ -1,123 +0,0 @@ -@use '../shared.scss'; - -.select { - position: relative; - margin-bottom: var(--base); -} - -.label { - margin-bottom: 10px; - display: block; -} - -.reactSelect { - display: flex; - - :global { - div.rs__control { - @include shared.formInput; - height: auto; - } - - .rs__input-container { - color: var(--color-black); - } - - .rs__value-container { - padding: 0; - > * { - margin-top: 0; - margin-bottom: 0; - padding-top: 0; - padding-bottom: 0; - } - } - - .rs__single-value { - color: var(--color-black); - } - - .rs__indicators { - position: absolute; - top: calc(var(--base) * 0.9); - right: calc(var(--base) * 0.9); - .arrow { - transform: rotate(90deg); - } - } - - .rs__indicator { - padding: 0px 4px; - cursor: pointer; - - svg path { - fill: var(--color-dark-gray); - } - - &:hover { - svg path { - fill: var(--color-dark-gray); - } - } - } - - .rs__indicator-separator { - display: none; - } - - .rs__menu { - color: var(--color-black); - background-color: var(--color-white); - z-index: 2; - border-radius: 0; - box-shadow: 0 4px 11px hsl(0deg 0% 0% / 10%); - } - - .rs__menu-list { - padding: calc(var(--base) / 4) 0; - } - - .rs__group-heading { - margin-bottom: calc(var(--base) / 2); - } - - .rs__option { - font-size: 1rem; - padding: calc(var(--base) / 2) var(--base); - - &--is-focused { - background-color: var(--color-light-gray); - color: var(--color-black); - } - - &--is-selected { - background-color: var(--color-light-gray); - color: var(--color-black); - } - } - - .rs__multi-value { - padding: 0; - background: var(--color-light-gray); - } - - .rs__multi-value__label { - max-width: 150px; - color: var(--color-black); - padding: calc(var(--base) / 8) calc(var(--base) / 4); - } - - .rs__multi-value__remove { - cursor: pointer; - - &:hover { - color: var(--color-black); - background: var(--color-light-gray); - } - } - - .rs__clear-indicator { - cursor: pointer; - } - } -} diff --git a/src/components/Blocks/Form/Country/index.tsx b/src/components/Blocks/Form/Country/index.tsx deleted file mode 100644 index 496e346..0000000 --- a/src/components/Blocks/Form/Country/index.tsx +++ /dev/null @@ -1,50 +0,0 @@ -import type { CountryField } from "@payloadcms/plugin-form-builder/types"; -import type { Control, FieldErrorsImpl, FieldValues } from "react-hook-form"; - -import React from "react"; -import { Controller } from "react-hook-form"; -import ReactSelect from "react-select"; - -import { Error } from "../Error"; -import { Width } from "../Width"; -import classes from "./index.scss"; -import { countryOptions } from "./options"; - -export const Country: React.FC< - { - control: Control; - errors: Partial< - FieldErrorsImpl<{ - [x: string]: any; - }> - >; - } & CountryField -> = ({ name, control, errors, label, required, width }) => { - return ( - -
    - - ( - onChange(val ? val.value : "")} - options={countryOptions} - value={countryOptions.find((c) => c.value === value)} - /> - )} - rules={{ required }} - /> - {required && errors[name] && } -
    -     - ); -}; diff --git a/src/components/Blocks/Form/Country/options.ts b/src/components/Blocks/Form/Country/options.ts deleted file mode 100644 index f952c1d..0000000 --- a/src/components/Blocks/Form/Country/options.ts +++ /dev/null @@ -1,982 +0,0 @@ -export const countryOptions = [ - { - label: 'Afghanistan', - value: 'AF', - }, - { - label: 'Åland Islands', - value: 'AX', - }, - { - label: 'Albania', - value: 'AL', - }, - { - label: 'Algeria', - value: 'DZ', - }, - { - label: 'American Samoa', - value: 'AS', - }, - { - label: 'Andorra', - value: 'AD', - }, - { - label: 'Angola', - value: 'AO', - }, - { - label: 'Anguilla', - value: 'AI', - }, - { - label: 'Antarctica', - value: 'AQ', - }, - { - label: 'Antigua and Barbuda', - value: 'AG', - }, - { - label: 'Argentina', - value: 'AR', - }, - { - label: 'Armenia', - value: 'AM', - }, - { - label: 'Aruba', - value: 'AW', - }, - { - label: 'Australia', - value: 'AU', - }, - { - label: 'Austria', - value: 'AT', - }, - { - label: 'Azerbaijan', - value: 'AZ', - }, - { - label: 'Bahamas', - value: 'BS', - }, - { - label: 'Bahrain', - value: 'BH', - }, - { - label: 'Bangladesh', - value: 'BD', - }, - { - label: 'Barbados', - value: 'BB', - }, - { - label: 'Belarus', - value: 'BY', - }, - { - label: 'Belgium', - value: 'BE', - }, - { - label: 'Belize', - value: 'BZ', - }, - { - label: 'Benin', - value: 'BJ', - }, - { - label: 'Bermuda', - value: 'BM', - }, - { - label: 'Bhutan', - value: 'BT', - }, - { - label: 'Bolivia', - value: 'BO', - }, - { - label: 'Bosnia and Herzegovina', - value: 'BA', - }, - { - label: 'Botswana', - value: 'BW', - }, - { - label: 'Bouvet Island', - value: 'BV', - }, - { - label: 'Brazil', - value: 'BR', - }, - { - label: 'British Indian Ocean Territory', - value: 'IO', - }, - { - label: 'Brunei Darussalam', - value: 'BN', - }, - { - label: 'Bulgaria', - value: 'BG', - }, - { - label: 'Burkina Faso', - value: 'BF', - }, - { - label: 'Burundi', - value: 'BI', - }, - { - label: 'Cambodia', - value: 'KH', - }, - { - label: 'Cameroon', - value: 'CM', - }, - { - label: 'Canada', - value: 'CA', - }, - { - label: 'Cape Verde', - value: 'CV', - }, - { - label: 'Cayman Islands', - value: 'KY', - }, - { - label: 'Central African Republic', - value: 'CF', - }, - { - label: 'Chad', - value: 'TD', - }, - { - label: 'Chile', - value: 'CL', - }, - { - label: 'China', - value: 'CN', - }, - { - label: 'Christmas Island', - value: 'CX', - }, - { - label: 'Cocos (Keeling) Islands', - value: 'CC', - }, - { - label: 'Colombia', - value: 'CO', - }, - { - label: 'Comoros', - value: 'KM', - }, - { - label: 'Congo', - value: 'CG', - }, - { - label: 'Congo, The Democratic Republic of the', - value: 'CD', - }, - { - label: 'Cook Islands', - value: 'CK', - }, - { - label: 'Costa Rica', - value: 'CR', - }, - { - label: "Cote D'Ivoire", - value: 'CI', - }, - { - label: 'Croatia', - value: 'HR', - }, - { - label: 'Cuba', - value: 'CU', - }, - { - label: 'Cyprus', - value: 'CY', - }, - { - label: 'Czech Republic', - value: 'CZ', - }, - { - label: 'Denmark', - value: 'DK', - }, - { - label: 'Djibouti', - value: 'DJ', - }, - { - label: 'Dominica', - value: 'DM', - }, - { - label: 'Dominican Republic', - value: 'DO', - }, - { - label: 'Ecuador', - value: 'EC', - }, - { - label: 'Egypt', - value: 'EG', - }, - { - label: 'El Salvador', - value: 'SV', - }, - { - label: 'Equatorial Guinea', - value: 'GQ', - }, - { - label: 'Eritrea', - value: 'ER', - }, - { - label: 'Estonia', - value: 'EE', - }, - { - label: 'Ethiopia', - value: 'ET', - }, - { - label: 'Falkland Islands (Malvinas)', - value: 'FK', - }, - { - label: 'Faroe Islands', - value: 'FO', - }, - { - label: 'Fiji', - value: 'FJ', - }, - { - label: 'Finland', - value: 'FI', - }, - { - label: 'France', - value: 'FR', - }, - { - label: 'French Guiana', - value: 'GF', - }, - { - label: 'French Polynesia', - value: 'PF', - }, - { - label: 'French Southern Territories', - value: 'TF', - }, - { - label: 'Gabon', - value: 'GA', - }, - { - label: 'Gambia', - value: 'GM', - }, - { - label: 'Georgia', - value: 'GE', - }, - { - label: 'Germany', - value: 'DE', - }, - { - label: 'Ghana', - value: 'GH', - }, - { - label: 'Gibraltar', - value: 'GI', - }, - { - label: 'Greece', - value: 'GR', - }, - { - label: 'Greenland', - value: 'GL', - }, - { - label: 'Grenada', - value: 'GD', - }, - { - label: 'Guadeloupe', - value: 'GP', - }, - { - label: 'Guam', - value: 'GU', - }, - { - label: 'Guatemala', - value: 'GT', - }, - { - label: 'Guernsey', - value: 'GG', - }, - { - label: 'Guinea', - value: 'GN', - }, - { - label: 'Guinea-Bissau', - value: 'GW', - }, - { - label: 'Guyana', - value: 'GY', - }, - { - label: 'Haiti', - value: 'HT', - }, - { - label: 'Heard Island and Mcdonald Islands', - value: 'HM', - }, - { - label: 'Holy See (Vatican City State)', - value: 'VA', - }, - { - label: 'Honduras', - value: 'HN', - }, - { - label: 'Hong Kong', - value: 'HK', - }, - { - label: 'Hungary', - value: 'HU', - }, - { - label: 'Iceland', - value: 'IS', - }, - { - label: 'India', - value: 'IN', - }, - { - label: 'Indonesia', - value: 'ID', - }, - { - label: 'Iran, Islamic Republic Of', - value: 'IR', - }, - { - label: 'Iraq', - value: 'IQ', - }, - { - label: 'Ireland', - value: 'IE', - }, - { - label: 'Isle of Man', - value: 'IM', - }, - { - label: 'Israel', - value: 'IL', - }, - { - label: 'Italy', - value: 'IT', - }, - { - label: 'Jamaica', - value: 'JM', - }, - { - label: 'Japan', - value: 'JP', - }, - { - label: 'Jersey', - value: 'JE', - }, - { - label: 'Jordan', - value: 'JO', - }, - { - label: 'Kazakhstan', - value: 'KZ', - }, - { - label: 'Kenya', - value: 'KE', - }, - { - label: 'Kiribati', - value: 'KI', - }, - { - label: "Democratic People's Republic of Korea", - value: 'KP', - }, - { - label: 'Korea, Republic of', - value: 'KR', - }, - { - label: 'Kosovo', - value: 'XK', - }, - { - label: 'Kuwait', - value: 'KW', - }, - { - label: 'Kyrgyzstan', - value: 'KG', - }, - { - label: "Lao People's Democratic Republic", - value: 'LA', - }, - { - label: 'Latvia', - value: 'LV', - }, - { - label: 'Lebanon', - value: 'LB', - }, - { - label: 'Lesotho', - value: 'LS', - }, - { - label: 'Liberia', - value: 'LR', - }, - { - label: 'Libyan Arab Jamahiriya', - value: 'LY', - }, - { - label: 'Liechtenstein', - value: 'LI', - }, - { - label: 'Lithuania', - value: 'LT', - }, - { - label: 'Luxembourg', - value: 'LU', - }, - { - label: 'Macao', - value: 'MO', - }, - { - label: 'Macedonia, The Former Yugoslav Republic of', - value: 'MK', - }, - { - label: 'Madagascar', - value: 'MG', - }, - { - label: 'Malawi', - value: 'MW', - }, - { - label: 'Malaysia', - value: 'MY', - }, - { - label: 'Maldives', - value: 'MV', - }, - { - label: 'Mali', - value: 'ML', - }, - { - label: 'Malta', - value: 'MT', - }, - { - label: 'Marshall Islands', - value: 'MH', - }, - { - label: 'Martinique', - value: 'MQ', - }, - { - label: 'Mauritania', - value: 'MR', - }, - { - label: 'Mauritius', - value: 'MU', - }, - { - label: 'Mayotte', - value: 'YT', - }, - { - label: 'Mexico', - value: 'MX', - }, - { - label: 'Micronesia, Federated States of', - value: 'FM', - }, - { - label: 'Moldova, Republic of', - value: 'MD', - }, - { - label: 'Monaco', - value: 'MC', - }, - { - label: 'Mongolia', - value: 'MN', - }, - { - label: 'Montenegro', - value: 'ME', - }, - { - label: 'Montserrat', - value: 'MS', - }, - { - label: 'Morocco', - value: 'MA', - }, - { - label: 'Mozambique', - value: 'MZ', - }, - { - label: 'Myanmar', - value: 'MM', - }, - { - label: 'Namibia', - value: 'NA', - }, - { - label: 'Nauru', - value: 'NR', - }, - { - label: 'Nepal', - value: 'NP', - }, - { - label: 'Netherlands', - value: 'NL', - }, - { - label: 'Netherlands Antilles', - value: 'AN', - }, - { - label: 'New Caledonia', - value: 'NC', - }, - { - label: 'New Zealand', - value: 'NZ', - }, - { - label: 'Nicaragua', - value: 'NI', - }, - { - label: 'Niger', - value: 'NE', - }, - { - label: 'Nigeria', - value: 'NG', - }, - { - label: 'Niue', - value: 'NU', - }, - { - label: 'Norfolk Island', - value: 'NF', - }, - { - label: 'Northern Mariana Islands', - value: 'MP', - }, - { - label: 'Norway', - value: 'NO', - }, - { - label: 'Oman', - value: 'OM', - }, - { - label: 'Pakistan', - value: 'PK', - }, - { - label: 'Palau', - value: 'PW', - }, - { - label: 'Palestinian Territory, Occupied', - value: 'PS', - }, - { - label: 'Panama', - value: 'PA', - }, - { - label: 'Papua New Guinea', - value: 'PG', - }, - { - label: 'Paraguay', - value: 'PY', - }, - { - label: 'Peru', - value: 'PE', - }, - { - label: 'Philippines', - value: 'PH', - }, - { - label: 'Pitcairn', - value: 'PN', - }, - { - label: 'Poland', - value: 'PL', - }, - { - label: 'Portugal', - value: 'PT', - }, - { - label: 'Puerto Rico', - value: 'PR', - }, - { - label: 'Qatar', - value: 'QA', - }, - { - label: 'Reunion', - value: 'RE', - }, - { - label: 'Romania', - value: 'RO', - }, - { - label: 'Russian Federation', - value: 'RU', - }, - { - label: 'Rwanda', - value: 'RW', - }, - { - label: 'Saint Helena', - value: 'SH', - }, - { - label: 'Saint Kitts and Nevis', - value: 'KN', - }, - { - label: 'Saint Lucia', - value: 'LC', - }, - { - label: 'Saint Pierre and Miquelon', - value: 'PM', - }, - { - label: 'Saint Vincent and the Grenadines', - value: 'VC', - }, - { - label: 'Samoa', - value: 'WS', - }, - { - label: 'San Marino', - value: 'SM', - }, - { - label: 'Sao Tome and Principe', - value: 'ST', - }, - { - label: 'Saudi Arabia', - value: 'SA', - }, - { - label: 'Senegal', - value: 'SN', - }, - { - label: 'Serbia', - value: 'RS', - }, - { - label: 'Seychelles', - value: 'SC', - }, - { - label: 'Sierra Leone', - value: 'SL', - }, - { - label: 'Singapore', - value: 'SG', - }, - { - label: 'Slovakia', - value: 'SK', - }, - { - label: 'Slovenia', - value: 'SI', - }, - { - label: 'Solomon Islands', - value: 'SB', - }, - { - label: 'Somalia', - value: 'SO', - }, - { - label: 'South Africa', - value: 'ZA', - }, - { - label: 'South Georgia and the South Sandwich Islands', - value: 'GS', - }, - { - label: 'Spain', - value: 'ES', - }, - { - label: 'Sri Lanka', - value: 'LK', - }, - { - label: 'Sudan', - value: 'SD', - }, - { - label: 'Suriname', - value: 'SR', - }, - { - label: 'Svalbard and Jan Mayen', - value: 'SJ', - }, - { - label: 'Swaziland', - value: 'SZ', - }, - { - label: 'Sweden', - value: 'SE', - }, - { - label: 'Switzerland', - value: 'CH', - }, - { - label: 'Syrian Arab Republic', - value: 'SY', - }, - { - label: 'Taiwan', - value: 'TW', - }, - { - label: 'Tajikistan', - value: 'TJ', - }, - { - label: 'Tanzania, United Republic of', - value: 'TZ', - }, - { - label: 'Thailand', - value: 'TH', - }, - { - label: 'Timor-Leste', - value: 'TL', - }, - { - label: 'Togo', - value: 'TG', - }, - { - label: 'Tokelau', - value: 'TK', - }, - { - label: 'Tonga', - value: 'TO', - }, - { - label: 'Trinidad and Tobago', - value: 'TT', - }, - { - label: 'Tunisia', - value: 'TN', - }, - { - label: 'Turkey', - value: 'TR', - }, - { - label: 'Turkmenistan', - value: 'TM', - }, - { - label: 'Turks and Caicos Islands', - value: 'TC', - }, - { - label: 'Tuvalu', - value: 'TV', - }, - { - label: 'Uganda', - value: 'UG', - }, - { - label: 'Ukraine', - value: 'UA', - }, - { - label: 'United Arab Emirates', - value: 'AE', - }, - { - label: 'United Kingdom', - value: 'GB', - }, - { - label: 'United States', - value: 'US', - }, - { - label: 'United States Minor Outlying Islands', - value: 'UM', - }, - { - label: 'Uruguay', - value: 'UY', - }, - { - label: 'Uzbekistan', - value: 'UZ', - }, - { - label: 'Vanuatu', - value: 'VU', - }, - { - label: 'Venezuela', - value: 'VE', - }, - { - label: 'Viet Nam', - value: 'VN', - }, - { - label: 'Virgin Islands, British', - value: 'VG', - }, - { - label: 'Virgin Islands, U.S.', - value: 'VI', - }, - { - label: 'Wallis and Futuna', - value: 'WF', - }, - { - label: 'Western Sahara', - value: 'EH', - }, - { - label: 'Yemen', - value: 'YE', - }, - { - label: 'Zambia', - value: 'ZM', - }, - { - label: 'Zimbabwe', - value: 'ZW', - }, -] diff --git a/src/components/Blocks/Form/Gutter/index.scss b/src/components/Blocks/Form/Gutter/index.scss deleted file mode 100644 index 065eb85..0000000 --- a/src/components/Blocks/Form/Gutter/index.scss +++ /dev/null @@ -1,7 +0,0 @@ -.gutterLeft { - padding-left: var(--gutter-h); -} - -.gutterRight { - padding-right: var(--gutter-h); -} diff --git a/src/components/Blocks/Form/Gutter/index.tsx b/src/components/Blocks/Form/Gutter/index.tsx deleted file mode 100644 index 1134310..0000000 --- a/src/components/Blocks/Form/Gutter/index.tsx +++ /dev/null @@ -1,24 +0,0 @@ -import React from "react"; - -import classes from "./index.scss"; - -type Props = { - children: React.ReactNode; - className?: string; - left?: boolean; - ref?: React.Ref; - right?: boolean; -}; - -export const Gutter: React.FC }> = (props) => { - const { children, className, left = true, right = true, ref } = props; - - return ( -
    - {children} -
    - ); -}; diff --git a/src/components/Blocks/Form/Message/index.scss b/src/components/Blocks/Form/Message/index.scss deleted file mode 100644 index a5b8d46..0000000 --- a/src/components/Blocks/Form/Message/index.scss +++ /dev/null @@ -1,9 +0,0 @@ -@use "../../css/queries.scss" as *; - -.message { - margin: var(--base) 0 var(--base) 0; - - @include mid-break { - margin: calc(var(--base) * 0.5) 0 calc(var(--base) * 0.5) 0; - } -} \ No newline at end of file diff --git a/src/components/Blocks/Form/Message/index.tsx b/src/components/Blocks/Form/Message/index.tsx deleted file mode 100644 index 9ba315b..0000000 --- a/src/components/Blocks/Form/Message/index.tsx +++ /dev/null @@ -1,15 +0,0 @@ -import type { MessageField } from "@payloadcms/plugin-form-builder/types"; - -import React from "react"; - -import RichText from "../RichText"; -import { Width } from "../Width"; -import classes from "./index.scss"; - -export const Message: React.FC = ({ message }) => { - return ( - - - - ); -}; diff --git a/src/components/Blocks/Form/Number/index.scss b/src/components/Blocks/Form/Number/index.scss deleted file mode 100644 index 090a41a..0000000 --- a/src/components/Blocks/Form/Number/index.scss +++ /dev/null @@ -1,15 +0,0 @@ -@use '../shared.scss'; - -.wrap { - position: relative; - margin-bottom: var(--base); -} - -.input { - @include shared.formInput; -} - -.label { - margin-bottom: 10px; - display: block; -} diff --git a/src/components/Blocks/Form/Number/index.tsx b/src/components/Blocks/Form/Number/index.tsx index 0987724..9f8b1c7 100644 --- a/src/components/Blocks/Form/Number/index.tsx +++ b/src/components/Blocks/Form/Number/index.tsx @@ -5,7 +5,6 @@ import React from "react"; import { Error } from "../Error"; import { Width } from "../Width"; -import classes from "./index.scss"; export const Number: React.FC< { @@ -19,11 +18,14 @@ export const Number: React.FC< > = ({ name, errors, label, register, required: requiredFromProps, width }) => { return ( -
    - - +
    + + {requiredFromProps && errors[name] && }
    diff --git a/src/components/Blocks/Form/State/index.scss b/src/components/Blocks/Form/State/index.scss deleted file mode 100644 index 1f5f6ac..0000000 --- a/src/components/Blocks/Form/State/index.scss +++ /dev/null @@ -1,123 +0,0 @@ -@use '../shared.scss'; - -.select { - position: relative; - margin-bottom: var(--base); -} - -.label { - margin-bottom: 10px; - display: block; -} - -.reactSelect { - display: flex; - - :global { - div.rs__control { - @include shared.formInput; - height: auto; - } - - .rs__input-container { - color: var(--color-black); - } - - .rs__value-container { - padding: 0; - > * { - margin-top: 0; - margin-bottom: 0; - padding-top: 0; - padding-bottom: 0; - } - } - - .rs__single-value { - color: var(--color-black); - } - - .rs__indicators { - position: absolute; - top: calc(var(--base) * 0.9); - right: calc(var(--base) * 0.9); - .arrow { - transform: rotate(90deg); - } - } - - .rs__indicator { - padding: 0px 4px; - cursor: pointer; - - svg path { - fill: var(--color-dark-gray); - } - - &:hover { - svg path { - fill: var(--color-dark-gray); - } - } - } - - .rs__indicator-separator { - display: none; - } - - .rs__menu { - color: var(--color-black); - background-color: var(--color-white); - z-index: 2; - border-radius: 0; - box-shadow: 0 4px 11px hsl(0deg 0% 0% / 10%); - } - - .rs__menu-list { - padding: calc(var(--base) / 4) 0; - } - - .rs__group-heading { - margin-bottom: calc(var(--base) / 2); - } - - .rs__option { - font-size: 1rem; - padding: calc(var(--base) / 2) var(--base); - - &--is-focused { - background-color: var(--color-light-gray); - color: var(--color-black); - } - - &--is-selected { - background-color: var(--color-light-gray); - color: var(--color-black); - } - } - - .rs__multi-value { - padding: 0; - background: var(--color-light-gray); - } - - .rs__multi-value__label { - max-width: 150px; - color: var(--color-black); - padding: calc(var(--base) / 8) calc(var(--base) / 4); - } - - .rs__multi-value__remove { - cursor: pointer; - - &:hover { - color: var(--color-black); - background: var(--color-light-gray); - } - } - - .rs__clear-indicator { - cursor: pointer; - } - } -} diff --git a/src/components/Blocks/Form/State/index.tsx b/src/components/Blocks/Form/State/index.tsx deleted file mode 100644 index a466fe9..0000000 --- a/src/components/Blocks/Form/State/index.tsx +++ /dev/null @@ -1,50 +0,0 @@ -import type { StateField } from "@payloadcms/plugin-form-builder/types"; -import type { Control, FieldErrorsImpl, FieldValues } from "react-hook-form"; - -import React from "react"; -import { Controller } from "react-hook-form"; -import ReactSelect from "react-select"; - -import { Error } from "../Error"; -import { Width } from "../Width"; -import classes from "./index.scss"; -import { stateOptions } from "./options"; - -export const State: React.FC< - { - control: Control; - errors: Partial< - FieldErrorsImpl<{ - [x: string]: any; - }> - >; - } & StateField -> = ({ name, control, errors, label, required, width }) => { - return ( - -
    - - ( - onChange(val ? val.value : "")} - options={stateOptions} - value={stateOptions.find((t) => t.value === value)} - /> - )} - rules={{ required }} - /> - {required && errors[name] && } -
    -     - ); -}; diff --git a/src/components/Blocks/Form/State/options.ts b/src/components/Blocks/Form/State/options.ts deleted file mode 100644 index 8dff991..0000000 --- a/src/components/Blocks/Form/State/options.ts +++ /dev/null @@ -1,52 +0,0 @@ -export const stateOptions = [ - { label: 'Alabama', value: 'AL' }, - { label: 'Alaska', value: 'AK' }, - { label: 'Arizona', value: 'AZ' }, - { label: 'Arkansas', value: 'AR' }, - { label: 'California', value: 'CA' }, - { label: 'Colorado', value: 'CO' }, - { label: 'Connecticut', value: 'CT' }, - { label: 'Delaware', value: 'DE' }, - { label: 'Florida', value: 'FL' }, - { label: 'Georgia', value: 'GA' }, - { label: 'Hawaii', value: 'HI' }, - { label: 'Idaho', value: 'ID' }, - { label: 'Illinois', value: 'IL' }, - { label: 'Indiana', value: 'IN' }, - { label: 'Iowa', value: 'IA' }, - { label: 'Kansas', value: 'KS' }, - { label: 'Kentucky', value: 'KY' }, - { label: 'Louisiana', value: 'LA' }, - { label: 'Maine', value: 'ME' }, - { label: 'Maryland', value: 'MD' }, - { label: 'Massachusetts', value: 'MA' }, - { label: 'Michigan', value: 'MI' }, - { label: 'Minnesota', value: 'MN' }, - { label: 'Mississippi', value: 'MS' }, - { label: 'Missouri', value: 'MO' }, - { label: 'Montana', value: 'MT' }, - { label: 'Nebraska', value: 'NE' }, - { label: 'Nevada', value: 'NV' }, - { label: 'New Hampshire', value: 'NH' }, - { label: 'New Jersey', value: 'NJ' }, - { label: 'New Mexico', value: 'NM' }, - { label: 'New York', value: 'NY' }, - { label: 'North Carolina', value: 'NC' }, - { label: 'North Dakota', value: 'ND' }, - { label: 'Ohio', value: 'OH' }, - { label: 'Oklahoma', value: 'OK' }, - { label: 'Oregon', value: 'OR' }, - { label: 'Pennsylvania', value: 'PA' }, - { label: 'Rhode Island', value: 'RI' }, - { label: 'South Carolina', value: 'SC' }, - { label: 'South Dakota', value: 'SD' }, - { label: 'Tennessee', value: 'TN' }, - { label: 'Texas', value: 'TX' }, - { label: 'Utah', value: 'UT' }, - { label: 'Vermont', value: 'VT' }, - { label: 'Virginia', value: 'VA' }, - { label: 'Washington', value: 'WA' }, - { label: 'West Virginia', value: 'WV' }, - { label: 'Wisconsin', value: 'WI' }, - { label: 'Wyoming', value: 'WY' }, -] diff --git a/src/components/Blocks/Form/VerticalPadding/index.scss b/src/components/Blocks/Form/VerticalPadding/index.scss deleted file mode 100644 index c919a28..0000000 --- a/src/components/Blocks/Form/VerticalPadding/index.scss +++ /dev/null @@ -1,23 +0,0 @@ -.top-large { - padding-top: var(--block-padding); -} - -.top-medium { - padding-top: calc(var(--block-padding) / 2); -} - -.top-small { - padding-top: calc(var(--block-padding) / 3); -} - -.bottom-large { - padding-bottom: var(--block-padding); -} - -.bottom-medium { - padding-bottom: calc(var(--block-padding) / 2); -} - -.bottom-small { - padding-bottom: calc(var(--block-padding) / 3); -} \ No newline at end of file diff --git a/src/components/Blocks/Form/VerticalPadding/index.tsx b/src/components/Blocks/Form/VerticalPadding/index.tsx deleted file mode 100644 index 98f1f7a..0000000 --- a/src/components/Blocks/Form/VerticalPadding/index.tsx +++ /dev/null @@ -1,20 +0,0 @@ -import React from "react"; - -import classes from "./index.scss"; - -export type VerticalPaddingOptions = "large" | "medium" | "none" | "small"; - -type Props = { - bottom?: VerticalPaddingOptions; - children: React.ReactNode; - className?: string; - top?: VerticalPaddingOptions; -}; - -export const VerticalPadding: React.FC = ({ bottom = "medium", children, className, top = "medium" }) => { - return ( -
    - {children} -
    - ); -}; diff --git a/src/components/Blocks/Form/Width/index.scss b/src/components/Blocks/Form/Width/index.scss deleted file mode 100644 index 9deda19..0000000 --- a/src/components/Blocks/Form/Width/index.scss +++ /dev/null @@ -1,10 +0,0 @@ -@use "../../css/queries.scss" as *; - -.width { - padding-left: calc(var(--base) * 0.5); - padding-right: calc(var(--base) * 0.5); - - @include mid-break { - width: 100% !important; - } -} diff --git a/src/components/Blocks/Form/Width/index.tsx b/src/components/Blocks/Form/Width/index.tsx index 093a1f4..2e5d319 100644 --- a/src/components/Blocks/Form/Width/index.tsx +++ b/src/components/Blocks/Form/Width/index.tsx @@ -1,14 +1,8 @@ import * as React from "react"; -import classes from "./index.scss"; - export const Width: React.FC<{ children: React.ReactNode; width?: number; }> = ({ children, width }) => { - return ( -
    - {children} -
    - ); + return
    {children}
    ; }; diff --git a/src/components/Blocks/Form/fields.tsx b/src/components/Blocks/Form/fields.tsx index fa660f7..9d8643e 100644 --- a/src/components/Blocks/Form/fields.tsx +++ b/src/components/Blocks/Form/fields.tsx @@ -1,21 +1,15 @@ -import { Checkbox } from './Checkbox' -import { Country } from './Country' -import { Email } from './Email' -import { Message } from './Message' -import { Number } from './Number' -import { Select } from './Select' -import { State } from './State' -import { Text } from './Text' -import { Textarea } from './Textarea' +import { Checkbox } from "./Checkbox"; +import { Email } from "./Email"; +import { Number } from "./Number"; +import { Select } from "./Select"; +import { Text } from "./Text"; +import { Textarea } from "./Textarea"; export const fields = { checkbox: Checkbox, - country: Country, email: Email, - message: Message, number: Number, select: Select, - state: State, text: Text, textarea: Textarea, -} +}; diff --git a/src/components/Blocks/GoogleReviews/GoogleReviews.tsx b/src/components/Blocks/GoogleReviews/GoogleReviews.tsx new file mode 100644 index 0000000..177d43c --- /dev/null +++ b/src/components/Blocks/GoogleReviews/GoogleReviews.tsx @@ -0,0 +1,188 @@ +"use client"; + +import { CardStarRating, CardStarRatingProps, CardStarRatingSkeleton } from "@/components/Ratings/CardStarRating"; +import StarRating from "@/components/Ratings/StarRating"; +import Image from "next/image"; +import { Navigation } from "swiper/modules"; +import { Swiper, SwiperSlide } from "swiper/react"; + +export interface GoogleReviewProps { + data: { + ratingValue: number; + totalRating: number; + data: CardStarRatingProps["data"][]; + }; +} + +export function GoogleReviews({ data }: GoogleReviewProps) { + return ( +
    +
    +
    +
    + Image Description +
    +
    + Image Description +
    + +
    +

    Reviews

    + +
    +

    {data.ratingValue}

    +
    + +
    +
    Over {data.totalRating} Reviews
    +
    + +
    + + {/* Group item */} + {data.data.map((rev, index) => ( + +
    + +
    +     + ))} +
    +
    +
    + Previous Slide + +
    +
    + Next Slide + +
    +
    +
    + {/* End Group item */} +     +
    +
    +
    + ); +} + +export function GoogleReviewsSkeleton() { + return ( +
    +
    +
    +
    + Image Description +
    +
    + Image Description +
    + +
    +

    Reviews

    + + + +
    +
    + ); +} + +function GoogleReviewsHeaderSkeleton() { + return ( +
    +
    +
    + ); +} + +function GoogleReviewsContentSkeleton() { + return ( +
    + + {/* Group item */} + + + + + + + + + + + + + +
    +
    +
    + Previous Slide + +
    +
    + Next Slide + +
    +
    +
    + {/* End Group item */} +     +
    + ); +} diff --git a/src/components/Blocks/GoogleReviews/index.tsx b/src/components/Blocks/GoogleReviews/index.tsx index 44ff184..750b0ff 100644 --- a/src/components/Blocks/GoogleReviews/index.tsx +++ b/src/components/Blocks/GoogleReviews/index.tsx @@ -1,130 +1,66 @@ -"use client"; +import { fetchGoogleReviews } from "@/services/payload/google-reviews"; +import { GoogleReviewProps, GoogleReviews } from "./GoogleReviews"; -import { CardStarRating, CardStarRatingProps } from "@/components/Ratings/CardStarRating"; -import StarRating from "@/components/Ratings/StarRating"; -import Image from "next/image"; -import { Navigation } from "swiper/modules"; -import { Swiper, SwiperSlide } from "swiper/react"; +// const data: CardStarRatingProps["data"][] = [ +// { +// star: 5, +// description: +// "Today i did my cat scan , and met Raymond, he radiates hope and good will, i then met Larry who showed me the hospitality suite, i was overwhelmed by thier kindness, every one i have met so far has been truly amazing.while at physical therapy the doc said i had made a wise", +// }, +// { +// star: 5, +// description: "Great and caring service. Completely satisfied.", +// }, +// { +// star: 5, +// description: "Sincere and caring attitude...very professional and inspires confidence.", +// }, +// { +// star: 5, +// description: +// "I've been going to cochise oncology for many years and everyone is always professional and take the time to explain everything", +// }, +// { +// star: 5, +// description: "One fine person\n Very concerning. Glad to see her", +// }, +// { +// star: 5, +// description: +// "Barbara was very professional and friendly. She shared all info with me and gave me a copy of my lab results.", +// }, +// { +// star: 5, +// description: +// "Barbara is great! She listens and ask questions on other issues outside her area just to be sure you’re well taken care of.", +// }, +// { +// star: 5, +// description: +// "Today, at Cochise Oncology, I had an appointment with Dr. Reid Culton. He explained in great detail from the medical chart of the blood work and listen to my concerns. Dr. Reid Culton also answered my questions in great detail. Thank you.", +// }, +// { +// star: 5, +// description: +// "I absolutely love the people that work at this place. From the front desk to radiation room. Everyone is loving and caring.", +// }, +// ]; -const data: CardStarRatingProps["data"][] = [ - { - star: 5, - description: - "Today i did my cat scan , and met Raymond, he radiates hope and good will, i then met Larry who showed me the hospitality suite, i was overwhelmed by thier kindness, every one i have met so far has been truly amazing.while at physical therapy the doc said i had made a wise", - }, - { - star: 5, - description: "Great and caring service. Completely satisfied.", - }, - { - star: 5, - description: "Sincere and caring attitude...very professional and inspires confidence.", - }, - { - star: 5, - description: - "I've been going to cochise oncology for many years and everyone is always professional and take the time to explain everything", - }, - { - star: 5, - description: "One fine person\n Very concerning. Glad to see her", - }, - { - star: 5, - description: - "Barbara was very professional and friendly. She shared all info with me and gave me a copy of my lab results.", - }, - { - star: 5, - description: - "Barbara is great! She listens and ask questions on other issues outside her area just to be sure you’re well taken care of.", - }, - { - star: 5, - description: - "Today, at Cochise Oncology, I had an appointment with Dr. Reid Culton. He explained in great detail from the medical chart of the blood work and listen to my concerns. Dr. Reid Culton also answered my questions in great detail. Thank you.", - }, - { - star: 5, - description: - "I absolutely love the people that work at this place. From the front desk to radiation room. Everyone is loving and caring.", - }, -]; +export async function GoogleReviewsBlock() { + const data = await fetchGoogleReviews(); + if (!data?.id) return <>; -export function GoogleReviewsBlock() { - return ( -
    -
    -
    -
    - Image Description -
    -
    - Image Description -
    + const dataReviews: GoogleReviewProps["data"] = { + data: + data.ratings?.map?.((r) => { + return { + star: r.ratingValue, + description: r.description, + }; + }) ?? [], + ratingValue: data.ratingValue, + totalRating: data.totalRating, + }; -
    -

    Reviews

    -
    -

    4.8

    -
    - -
    -
    Over 200 Reviews
    -
    -
    - - {/* Group item */} - {data.map((rev, index) => ( - -
    - -
    -     - ))} -
    -
    -
    - Previous Slide - -
    -
    - Next Slide - -
    -
    -
    - {/* End Group item */} -     -
    -
    -
    - ); + return ; } diff --git a/src/components/Blocks/css/app.scss b/src/components/Blocks/css/app.scss deleted file mode 100644 index 8c8fd6d..0000000 --- a/src/components/Blocks/css/app.scss +++ /dev/null @@ -1,129 +0,0 @@ -@use './queries.scss' as *; -@use './colors.scss' as *; -@use './type.scss' as *; - -:root { - --breakpoint-xs-width: #{$breakpoint-xs-width}; - --breakpoint-s-width: #{$breakpoint-s-width}; - --breakpoint-m-width: #{$breakpoint-m-width}; - --breakpoint-l-width: #{$breakpoint-l-width}; - --scrollbar-width: 17px; - - --base: 24px; - --font-body: system-ui; - --font-mono: 'Roboto Mono', monospace; - - --gutter-h: 180px; - --block-padding: 120px; - - --header-z-index: 100; - --modal-z-index: 90; - - @include large-break { - --gutter-h: 144px; - --block-padding: 96px; - } - - @include mid-break { - --gutter-h: 24px; - --block-padding: 60px; - } -} - -///////////////////////////// -// GLOBAL STYLES -///////////////////////////// - -* { - box-sizing: border-box; -} - -html { - @extend %body; - background: var(--color-white); - -webkit-font-smoothing: antialiased; -} - -html, -body, -#app { - height: 100%; -} - -body { - font-family: var(--font-body); - color: var(--color-black); - margin: 0; -} - -::selection { - background: var(--color-green); - color: var(--color-black); -} - -::-moz-selection { - background: var(--color-green); - color: var(--color-black); -} - -img { - max-width: 100%; - height: auto; - display: block; -} - -h1 { - @extend %h1; -} - -h2 { - @extend %h2; -} - -h3 { - @extend %h3; -} - -h4 { - @extend %h4; -} - -h5 { - @extend %h5; -} - -h6 { - @extend %h6; -} - -p { - margin: var(--base) 0; - - @include mid-break { - margin: calc(var(--base) * 0.75) 0; - } -} - -ul, -ol { - padding-left: var(--base); - margin: 0 0 var(--base); -} - -a { - color: currentColor; - - &:focus { - opacity: 0.8; - outline: none; - } - - &:active { - opacity: 0.7; - outline: none; - } -} - -svg { - vertical-align: middle; -} diff --git a/src/components/Blocks/css/colors.scss b/src/components/Blocks/css/colors.scss deleted file mode 100644 index 2a7b3af..0000000 --- a/src/components/Blocks/css/colors.scss +++ /dev/null @@ -1,10 +0,0 @@ -:root { - --color-red: rgb(255, 0, 0); - --color-green: rgb(178, 255, 214); - --color-white: rgb(255, 255, 255); - --color-dark-gray: rgb(51, 52, 52); - --color-mid-gray: rgb(196, 196, 196); - --color-gray: rgb(212, 212, 212); - --color-light-gray: rgb(244, 244, 244); - --color-black: rgb(0, 0, 0); -} diff --git a/src/components/Blocks/css/common.scss b/src/components/Blocks/css/common.scss deleted file mode 100644 index e66be01..0000000 --- a/src/components/Blocks/css/common.scss +++ /dev/null @@ -1,2 +0,0 @@ -@forward './queries.scss'; -@forward './type.scss'; diff --git a/src/components/Blocks/css/queries.scss b/src/components/Blocks/css/queries.scss deleted file mode 100644 index 921a46f..0000000 --- a/src/components/Blocks/css/queries.scss +++ /dev/null @@ -1,32 +0,0 @@ -$breakpoint-xs-width: 400px; -$breakpoint-s-width: 768px; -$breakpoint-m-width: 1024px; -$breakpoint-l-width: 1440px; - -//////////////////////////// -// MEDIA QUERIES -///////////////////////////// - -@mixin extra-small-break { - @media (max-width: #{$breakpoint-xs-width}) { - @content; - } -} - -@mixin small-break { - @media (max-width: #{$breakpoint-s-width}) { - @content; - } -} - -@mixin mid-break { - @media (max-width: #{$breakpoint-m-width}) { - @content; - } -} - -@mixin large-break { - @media (max-width: #{$breakpoint-l-width}) { - @content; - } -} diff --git a/src/components/Blocks/css/type.scss b/src/components/Blocks/css/type.scss deleted file mode 100644 index df525be..0000000 --- a/src/components/Blocks/css/type.scss +++ /dev/null @@ -1,167 +0,0 @@ -@use 'queries' as *; - -///////////////////////////// -// HEADINGS -///////////////////////////// - -%h1, -%h2, -%h3, -%h4, -%h5, -%h6 { - font-weight: 700; -} - -%h1 { - margin: 50px 0; - font-size: 84px; - line-height: 1; - - @include mid-break { - font-size: 70px; - } - - @include small-break { - margin: 24px 0; - font-size: 36px; - line-height: 42px; - } -} - -%h2 { - margin: 32px 0; - font-size: 56px; - line-height: 1; - - @include mid-break { - margin: 36px 0; - font-size: 48px; - } - - @include small-break { - margin: 24px 0; - font-size: 28px; - line-height: 32px; - } -} - -%h3 { - margin: 28px 0; - font-size: 48px; - line-height: 56px; - - @include mid-break { - font-size: 40px; - line-height: 48px; - } - - @include small-break { - margin: 24px 0; - font-size: 24px; - line-height: 30px; - } -} - -%h4 { - margin: 24px 0; - font-size: 40px; - line-height: 48px; - - @include mid-break { - font-size: 33px; - line-height: 36px; - } - - @include small-break { - margin: 20px 0; - font-size: 20px; - line-height: 24px; - } -} - -%h5 { - margin: 20px 0; - font-size: 32px; - line-height: 42px; - - @include mid-break { - font-size: 26px; - line-height: 32px; - } - - @include small-break { - margin: 16px 0; - font-size: 18px; - line-height: 24px; - } -} - -%h6 { - margin: 20px 0; - font-size: 24px; - line-height: 28px; - - @include mid-break { - font-size: 20px; - line-height: 30px; - } - - @include small-break { - margin: 16px 0; - font-size: 16px; - line-height: 22px; - } -} - -///////////////////////////// -// TYPE STYLES -///////////////////////////// - -%body { - font-size: 18px; - line-height: 32px; - - @include mid-break { - font-size: 15px; - line-height: 24px; - } - - @include small-break { - font-size: 13px; - line-height: 24px; - } -} - -%large-body { - font-size: 25px; - line-height: 32px; - - @include mid-break { - font-size: 22px; - line-height: 30px; - } - - @include small-break { - font-size: 17px; - line-height: 24px; - } -} - -%label { - font-size: 16px; - line-height: 24px; - letter-spacing: 3px; - text-transform: uppercase; - - @include mid-break { - font-size: 13px; - letter-spacing: 2.75px; - } - - @include small-break { - font-size: 12px; - line-height: 18px; - letter-spacing: 2.625px; - } -} diff --git a/src/components/Blogs/BlogDetail.tsx b/src/components/Blogs/BlogDetail.tsx index 164b54e..166ba0f 100644 --- a/src/components/Blogs/BlogDetail.tsx +++ b/src/components/Blogs/BlogDetail.tsx @@ -2,6 +2,7 @@ import { fetchBlogDetail } from "@/services/payload/blog"; import { RichText } from "@payloadcms/richtext-lexical/react"; import { headers } from "next/headers"; import Image from "next/image"; +import { notFound } from "next/navigation"; import { FaFacebook, FaLinkedin, FaTwitter } from "react-icons/fa"; export interface BlogDetailProps { @@ -19,7 +20,9 @@ export default async function BlogDetail({ slug }: BlogDetailProps) { twitter: `https://twitter.com/intent/tweet?url=${fullUrl}`, }; - if (!data) return <>; + if (!data) { + notFound(); + } return ( <> diff --git a/src/components/Hero.tsx b/src/components/Hero.tsx index 4a56327..a213c0f 100644 --- a/src/components/Hero.tsx +++ b/src/components/Hero.tsx @@ -2,7 +2,7 @@ import { useRef } from "react"; -export default function Hero6() { +export default function Hero() { const videoRef = useRef(null); return ( @@ -25,7 +25,7 @@ export default function Hero6() {

    Cochise Oncology

    Southern Arizona’s Only Complete Cancer Treatment Center in Sierra Vista.

    diff --git a/src/components/Pages/Page.tsx b/src/components/Pages/Page.tsx index 7f7b962..89e0cd2 100644 --- a/src/components/Pages/Page.tsx +++ b/src/components/Pages/Page.tsx @@ -1,7 +1,8 @@ +import { BeforeFooterBlock } from "@/components/Blocks/BeforeFooter"; import { RenderBlocks } from "@/components/Blocks/RenderBlocks"; +import BlogDetail from "@/components/Blogs/BlogDetail"; import { fetchPageBySlug } from "@/services/payload/page"; import Image from "next/image"; -import { redirect } from "next/navigation"; export interface PageProps { slug: string | undefined; @@ -11,7 +12,12 @@ export default async function Page({ slug }: PageProps) { const page = await fetchPageBySlug({ slug }); if (!page) { - redirect("/page/not-found"); + return ( + <> + ; + + + ); } return ( diff --git a/src/components/Ratings/CardStarRating.tsx b/src/components/Ratings/CardStarRating.tsx index 94c716a..45fe257 100644 --- a/src/components/Ratings/CardStarRating.tsx +++ b/src/components/Ratings/CardStarRating.tsx @@ -19,3 +19,15 @@ export function CardStarRating({ data }: CardStarRatingProps) {
    ); } + +export function CardStarRatingSkeleton() { + return ( +
    +
    +
    +
    +
    +
    +
    + ); +} diff --git a/src/components/Testimonials.tsx b/src/components/Testimonials.tsx index 488b7a8..cde9ddb 100644 --- a/src/components/Testimonials.tsx +++ b/src/components/Testimonials.tsx @@ -1,6 +1,6 @@ -"use client"; - +import { Suspense } from "react"; import { GoogleReviewsBlock } from "./Blocks/GoogleReviews"; +import { GoogleReviewsSkeleton } from "./Blocks/GoogleReviews/GoogleReviews"; export default function Testimonials() { // const isotopContainer = useRef(null); @@ -28,7 +28,9 @@ export default function Testimonials() { */} - + }> + + ); } diff --git a/src/globals/GoogleReviews.ts b/src/globals/GoogleReviews.ts new file mode 100644 index 0000000..f8d19c9 --- /dev/null +++ b/src/globals/GoogleReviews.ts @@ -0,0 +1,42 @@ +import type { GlobalConfig } from "payload"; + +export const GoogleReviews: GlobalConfig = { + slug: "google-reviews", + fields: [ + { + name: "ratingValue", + label: "Rating Value", + type: "number", + required: true, + defaultValue: 0, + }, + { + name: "totalRating", + type: "number", + required: true, + defaultValue: 0, + }, + { + label: "Ratings", + name: "ratings", + type: "array", + fields: [ + { + name: "ratingValue", + label: "Rating Value", + type: "number", + required: true, + defaultValue: 0, + }, + { + name: "description", + type: "textarea", + required: true, + }, + ], + }, + ], + admin: { + hideAPIURL: true, + }, +}; diff --git a/src/payload-types.ts b/src/payload-types.ts index 54ef629..1e03980 100644 --- a/src/payload-types.ts +++ b/src/payload-types.ts @@ -42,8 +42,12 @@ export interface Config { db: { defaultIDType: number; }; - globals: {}; - globalsSelect: {}; + globals: { + 'google-reviews': GoogleReview; + }; + globalsSelect: { + 'google-reviews': GoogleReviewsSelect | GoogleReviewsSelect; + }; locale: null; user: User & { collection: 'users'; @@ -893,6 +897,42 @@ export interface PayloadMigrationsSelect { updatedAt?: T; createdAt?: T; } +/** + * This interface was referenced by `Config`'s JSON-Schema + * via the `definition` "google-reviews". + */ +export interface GoogleReview { + id: number; + ratingValue: number; + totalRating: number; + ratings?: + | { + ratingValue: number; + description: string; + id?: string | null; + }[] + | null; + updatedAt?: string | null; + createdAt?: string | null; +} +/** + * This interface was referenced by `Config`'s JSON-Schema + * via the `definition` "google-reviews_select". + */ +export interface GoogleReviewsSelect { + ratingValue?: T; + totalRating?: T; + ratings?: + | T + | { + ratingValue?: T; + description?: T; + id?: T; + }; + updatedAt?: T; + createdAt?: T; + globalType?: T; +} /** * This interface was referenced by `Config`'s JSON-Schema * via the `definition` "auth". diff --git a/src/payload.config.ts b/src/payload.config.ts index aa3f29b..d4c41bf 100644 --- a/src/payload.config.ts +++ b/src/payload.config.ts @@ -24,6 +24,7 @@ import { lexicalEditor, LinkFeature, } from "@payloadcms/richtext-lexical"; +import { GoogleReviews } from "@/globals/GoogleReviews"; const filename = fileURLToPath(import.meta.url); const dirname = path.dirname(filename); @@ -50,6 +51,7 @@ export default buildConfig({ theme: "dark", }, collections: [Users, Media, Blogs, Pages, Teams, BlogCategories, BlogTags], + globals: [GoogleReviews], secret: process.env.PAYLOAD_SECRET || "", typescript: { outputFile: path.resolve(dirname, "payload-types.ts"), diff --git a/src/services/payload/google-reviews.ts b/src/services/payload/google-reviews.ts new file mode 100644 index 0000000..069637c --- /dev/null +++ b/src/services/payload/google-reviews.ts @@ -0,0 +1,8 @@ +import payloadConfig from "@/payload.config"; +import { getPayload } from "payload"; + +export async function fetchGoogleReviews() { + const payload = await getPayload({ config: payloadConfig }); + const dataQuery = await payload.findGlobal({ slug: "google-reviews" }); + return dataQuery; +}