diff --git a/package.json b/package.json index 8826748..d09ba0e 100644 --- a/package.json +++ b/package.json @@ -8,10 +8,10 @@ "generate:types": "cross-env PAYLOAD_CONFIG_PATH=src/payload.config.ts payload generate:types", "build:payload": "cross-env PAYLOAD_CONFIG_PATH=src/payload.config.ts payload build", "build:server": "tsc --project tsconfig.server.json", - "build:next": "cross-env PAYLOAD_CONFIG_PATH=dist/payload.config.js NEXT_BUILD=true node dist/server.js", + "build:next": "cross-env PAYLOAD_CONFIG_PATH=dist/payload.config.js NEXT_BUILD=true node dist/server.js", "build": "cross-env NODE_ENV=production pnpm build:payload && pnpm build:server && pnpm copyfiles && pnpm build:next", "start": "copyfiles -u dist/next.config.js /app && cross-env PAYLOAD_CONFIG_PATH=dist/payload.config.js NODE_ENV=production node dist/server.js", - "copyfiles": "copyfiles -u 1 \"src/**/*.{html,css,scss,ttf,woff,woff2,eot,svg,jpg,png}\" dist/ && copyfiles next.config.js dist/ ", + "copyfiles": "copyfiles -u 1 \"src/**/*.{html,css,scss,ttf,woff,woff2,eot,svg,jpg,png}\" dist/ && copyfiles next.config.js dist/ ", "lint": "next lint" }, "resolutions": { @@ -52,6 +52,7 @@ "lucide-react": "^0.363.0", "next": "14.1.4", "payload": "^2.11.2", + "pigeon-maps": "^0.21.4", "react": "^18", "react-dom": "^18", "react-hook-form": "^7.51.2", @@ -64,6 +65,7 @@ "zustand": "^4.5.2" }, "devDependencies": { + "@types/leaflet": "^1.9.8", "@types/node": "^20", "@types/react": "^18", "@types/react-dom": "^18", diff --git "a/public/DALL\302\267E 2024-03-31 15.32.04 - Create a wide horizontal image suitable for a hero background on a healthcare website. The scene should depict a welcoming medical environment with a .webp:Zone.Identifier" "b/public/DALL\302\267E 2024-03-31 15.32.04 - Create a wide horizontal image suitable for a hero background on a healthcare website. The scene should depict a welcoming medical environment with a .webp:Zone.Identifier" new file mode 100644 index 0000000..a08c312 --- /dev/null +++ "b/public/DALL\302\267E 2024-03-31 15.32.04 - Create a wide horizontal image suitable for a hero background on a healthcare website. The scene should depict a welcoming medical environment with a .webp:Zone.Identifier" @@ -0,0 +1,3 @@ +[ZoneTransfer] +ZoneId=3 +HostUrl=https://chat.openai.com/ diff --git a/public/hero.webp b/public/hero.webp new file mode 100644 index 0000000..43187d3 Binary files /dev/null and b/public/hero.webp differ diff --git a/src/app/consult/page.tsx b/src/app/consult/page.tsx new file mode 100644 index 0000000..0ecc1d6 --- /dev/null +++ b/src/app/consult/page.tsx @@ -0,0 +1,62 @@ +"use client" + +import MapContainer from "@/components/MapContainer" +import MaxWidthWrapper from "@/components/MaxWidthWrapper" +import { Button, buttonVariants } from "@/components/ui/button" +import { cn } from "@/lib/utils" +import Image from "next/image" +import Link from "next/link" + +const Page = () => { + return ( + <> + +
+ thank you for your order +
+ +
+
+

+ Let us guide you to your + Perfect Health Partner +

+ +

+ Find your ideal health ally with us, where personalized care meets expertise. Start your journey to wellness today with a consultation that understands you. +

+ +
+ + Get Started + + + + Learn More + +
+
+
+
+ {/* */} + + {/* */} + + ) +} + +export default Page \ No newline at end of file diff --git a/src/app/globals.css b/src/app/globals.css index 8c64ad3..7b46733 100644 --- a/src/app/globals.css +++ b/src/app/globals.css @@ -103,3 +103,31 @@ .wallet-adapter-button-trigger { @apply !px-3 text-gray-700 h-10 hover:!bg-accent inline-flex items-center justify-center whitespace-nowrap rounded-md text-base font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50; } + +.hero { + @apply min-h-full bg-cover; + background: linear-gradient( + 0deg, + rgba(113, 205, 248, 0.3), + rgba(9, 121, 248, 0.3) + ), + url(https://picsum.photos/id/1043/800/600); +} + +.leaflet-container { + width: 100%; + height: 100vh; + } + +.leaflet-bottom, +.leaflet-control, +.leaflet-pane, +.leaflet-top { + z-index: 0 !important; +} + +.map-ui { + top: 40%; + left: 50%; + transform: translateX(-50%); +} \ No newline at end of file diff --git a/src/app/layout.tsx b/src/app/layout.tsx index 15cc005..6cefc70 100644 --- a/src/app/layout.tsx +++ b/src/app/layout.tsx @@ -13,30 +13,37 @@ const inter = Inter({ subsets: ["latin"] }); export const metadata = constructMetadata export default function RootLayout({ - children, + children, }: { - children: React.ReactNode; + children: React.ReactNode; }) { - return ( - - - -
- - -
{children}
-
- -
+ return ( + + + + + + +
+ + +
{children}
+
+ +
- - - - - ); + + + + + ); } diff --git a/src/components/Footer.tsx b/src/components/Footer.tsx index f7e0af5..0459f33 100644 --- a/src/components/Footer.tsx +++ b/src/components/Footer.tsx @@ -36,7 +36,7 @@ const Footer = () => {

- Become a seller + Join us

If you'd like to sell high-quality diff --git a/src/components/MapContainer.tsx b/src/components/MapContainer.tsx new file mode 100644 index 0000000..bdaea23 --- /dev/null +++ b/src/components/MapContainer.tsx @@ -0,0 +1,35 @@ +import React, { useState } from 'react'; +import { Map, Marker } from 'pigeon-maps'; +import COORDS from '@/config'; +import { Button } from './ui/button'; + +export function MapContainer() { + const [showPrompt, setShowPrompt] = useState(true); + + const hidePrompt = () => { + setShowPrompt(false); + }; + + return ( +

+ {showPrompt && ( + <> +
+

Find your nearest clinic

+ +
+
+ + )} +
+ + {COORDS.map((coordinate, index) => ( + + ))} + +
+
+ ); +} + +export default MapContainer; diff --git a/src/components/NavItems.tsx b/src/components/NavItems.tsx index 11353aa..4ee5b52 100644 --- a/src/components/NavItems.tsx +++ b/src/components/NavItems.tsx @@ -4,54 +4,67 @@ import { PRODUCT_CATEGORIES } from "@/config"; import { useEffect, useRef, useState } from "react"; import NavItem from "./NavItem"; import { useOnClickOutside } from "@/hooks/use-on-click-outside"; +import { buttonVariants } from "./ui/button"; +import Link from "next/link"; const NavItems = () => { - const [activeIndex, setActiveIndex] = useState(null); - - useEffect(() => { - const handleKeyDown = (e: KeyboardEvent) => { - if (e.key === "Escape") { - setActiveIndex(null); - } - }; - - document.addEventListener("keydown", handleKeyDown); - - return () => { - document.removeEventListener("keydown", handleKeyDown); - }; - }, []); - - const isAnyOpen = activeIndex !== null; - - const navRef = useRef(null); - - useOnClickOutside(navRef, () => setActiveIndex(null)); - - return ( -
- {PRODUCT_CATEGORIES.map((category, i) => { - const handleOpen = () => { - if (activeIndex === i) { - setActiveIndex(null); - } else { - setActiveIndex(i); - } - }; - - const isOpen = i === activeIndex; - return ( - - ); - })} -
- ); + const [activeIndex, setActiveIndex] = useState(null); + + useEffect(() => { + const handleKeyDown = (e: KeyboardEvent) => { + if (e.key === "Escape") { + setActiveIndex(null); + } + }; + + document.addEventListener("keydown", handleKeyDown); + + return () => { + document.removeEventListener("keydown", handleKeyDown); + }; + }, []); + + const isAnyOpen = activeIndex !== null; + + const navRef = useRef(null); + + useOnClickOutside(navRef, () => setActiveIndex(null)); + + return ( +
+ {PRODUCT_CATEGORIES.map((category, i) => { + const handleOpen = () => { + if (activeIndex === i) { + setActiveIndex(null); + } else { + setActiveIndex(i); + } + }; + + const isOpen = i === activeIndex; + return ( + + ); + })} +
+
+ + Consult us + +
+
+
+ ); }; export default NavItems; diff --git a/src/components/Navbar.tsx b/src/components/Navbar.tsx index 8e22ae0..3167bff 100644 --- a/src/components/Navbar.tsx +++ b/src/components/Navbar.tsx @@ -15,7 +15,7 @@ const Navbar = async () => { const { user } = await getServerSideUser(nextCookies) return ( -
+
diff --git a/src/config/index.ts b/src/config/index.ts index d513514..bc010b2 100644 --- a/src/config/index.ts +++ b/src/config/index.ts @@ -43,4 +43,60 @@ export const PRODUCT_CATEGORIES = [ } ] -export const SOL_FEE = 0.001 as number \ No newline at end of file +export const SOL_FEE = 0.001 as number + +const COORDS = [ + [3.1390, 101.6869], // Kuala Lumpur City Center + [3.1578, 101.7123], // Petaling Jaya + [3.0469, 101.7061], // Subang Jaya + [3.0812, 101.5844], // Shah Alam + [3.0738, 101.5183], // Klang + [3.2007, 101.6166], // Kepong + [3.1343, 101.6728], // Ampang + [3.0833, 101.6500], // Cheras + [3.1478, 101.6940], // Bukit Bintang, KL + [3.1653, 101.7100], // Damansara + [3.0803, 101.5831], // Setia Alam + [3.2101, 101.6348], // Batu Caves + [2.7297, 101.9381], // Kuala Selangor + [3.2346, 101.4376], // Rawang + [3.2572, 101.7304], // Genting Highlands + [3.0193, 101.5426], // Kajang + [2.9923, 101.7909], // Sekinchan + [3.0878, 101.5328], // Puchong + [3.0243, 101.7757], // Banting + [3.2232, 101.3169], // Selayang + [3.1597, 101.7004], // Mont Kiara, KL + [3.1665, 101.7307], // Hartamas, KL + [3.1509, 101.6156], // Sentul, KL + [3.1292, 101.6840], // Wangsa Maju, KL + [3.1479, 101.6671], // Setapak, KL + [3.0650, 101.4843], // Klang South + [3.0601, 101.4697], // Kota Kemuning + [3.0819, 101.5584], // Bandar Utama + [3.1129, 101.6398], // Titiwangsa, KL + [3.2095, 101.6587], // Gombak + [3.0607, 101.5183], // Bandar Sunway + [3.1099, 101.6632], // Keramat, KL + [3.1915, 101.7404], // Batu 9 Cheras + [3.0319, 101.5794], // Cyberjaya + [3.0273, 101.4972], // Putrajaya + [3.1654, 101.6116], // Segambut, KL + [3.1244, 101.6799], // Melawati, KL + [3.0822, 101.7467], // Hulu Langat + [3.2107, 101.7480], // Ulu Klang + [3.0195, 101.7051], // Seri Kembangan + [3.0636, 101.6950], // Balakong + [3.1393, 101.6862], // KLCC, KL + [3.1577, 101.7118], // Kelana Jaya + [3.1124, 101.6399], // Sri Hartamas, KL + [3.0456, 101.4608], // Pandan Indah + [3.2096, 101.6354], // Wangsa Melawati + [3.1320, 101.6726], // Pandan Jaya + [3.1653, 101.7101], // Sri Damansara + [3.0810, 101.5307], // USJ, Subang Jaya + [3.0936, 101.7281], // Bangi + ]; + +export default COORDS + \ No newline at end of file diff --git a/yarn.lock b/yarn.lock index dc03bae..9659f12 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3983,6 +3983,11 @@ "@types/qs" "*" "@types/serve-static" "*" +"@types/geojson@*": + version "7946.0.14" + resolved "https://registry.yarnpkg.com/@types/geojson/-/geojson-7946.0.14.tgz#319b63ad6df705ee2a65a73ef042c8271e696613" + integrity sha512-WCfD5Ht3ZesJUsONdhvm84dmzWOiOzOAqOncN0++w0lBw1o8OuDNJF2McvvCef/yBqb/HYRahp1BYtODFQ8bRg== + "@types/glob@^7.1.3": version "7.2.0" resolved "https://registry.yarnpkg.com/@types/glob/-/glob-7.2.0.tgz#bc1b5bf3aa92f25bd5dd39f35c57361bdce5b2eb" @@ -4030,6 +4035,13 @@ resolved "https://registry.npmjs.org/@types/json5/-/json5-0.0.29.tgz" integrity sha512-dRLjCWHYg4oaA77cxO64oO+7JwCwnIzkZPdrrC71jQmQtlhM556pwKo5bUzqvZndkVbeFLIIi+9TC40JNF5hNQ== +"@types/leaflet@^1.9.8": + version "1.9.8" + resolved "https://registry.yarnpkg.com/@types/leaflet/-/leaflet-1.9.8.tgz#32162a8eaf305c63267e99470b9603b5883e63e8" + integrity sha512-EXdsL4EhoUtGm2GC2ZYtXn+Fzc6pluVgagvo2VC1RHWToLGlTRwVYoDpqS/7QXa01rmDyBjJk3Catpf60VMkwg== + dependencies: + "@types/geojson" "*" + "@types/lodash@^4.14.136", "@types/lodash@^4.14.182": version "4.17.0" resolved "https://registry.yarnpkg.com/@types/lodash/-/lodash-4.17.0.tgz#d774355e41f372d5350a4d0714abb48194a489c3" @@ -10332,6 +10344,11 @@ pify@^2.3.0: resolved "https://registry.npmjs.org/pify/-/pify-2.3.0.tgz" integrity sha512-udgsAY+fTnvv7kI7aaxbqwWNb0AHiB0qBO89PZKPkoTmGOgdbrHDKD+0B2X4uTfJ/FT1R09r9gTsjUjNJotuog== +pigeon-maps@^0.21.4: + version "0.21.4" + resolved "https://registry.yarnpkg.com/pigeon-maps/-/pigeon-maps-0.21.4.tgz#a79b1658fef49c11b697c51231b0437511b992b0" + integrity sha512-PqxEMNfnpx6MqubH4WWD+dMS2EE2g/S+Y+nGa6kyZxe7OAqJsfmd3FInzoK4nOfYhlh15+g2GD4VHmivAYlnIg== + pino-abstract-transport@^1.0.0: version "1.1.0" resolved "https://registry.yarnpkg.com/pino-abstract-transport/-/pino-abstract-transport-1.1.0.tgz#083d98f966262164504afb989bccd05f665937a8"