rankrunners-dev/next-cochise
4
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Compare commits

base: rankrunners-dev:cab69a41e930d4e09b7281e0c173f5d94f4d360f
Branches Tags
rankrunners-dev:main
rankrunners-dev:dev
..
compare: rankrunners-dev:6fc4988506d20eae89dc4a72cf1c6f3302ef8910
Branches Tags
rankrunners-dev:main
rankrunners-dev:dev

9 Commits
cab69a41e9 ... 6fc4988506

Author SHA1 Message Date
RizqiSyahrendra
6fc4988506 fix: blogs and pages draft/publish 2025-03-05 05:38:02 +07:00
RizqiSyahrendra
807e78aa70 feat: blogs and pages set author 2025-03-05 00:13:49 +07:00
RizqiSyahrendra
fccd846349 Merge branch 'main' into dev 2025-03-04 21:15:40 +07:00
Val
9d9ce1737a fix: nav href 2025-03-04 20:52:31 +07:00
Val
11fe7eafda fix: nav 2025-03-04 20:49:12 +07:00
Val
62bfec7c87 feat: blockquote 2025-03-04 19:21:58 +07:00
Val
6e231f5485 fix: header 2025-03-04 18:59:25 +07:00
Val
01436f46b6 fix: social media hover 2025-03-04 17:54:21 +07:00
Val
efb92d0833 feat: explore more 2025-03-04 17:32:01 +07:00
13 changed files with 203 additions and 176 deletions
Show Stats Expand all files Collapse all files

4
public/assets/css/style.css
View File

@ -3908,8 +3908,8 @@ a.logo:hover {
display: none; display: none;
} }
.body-scrolled .social-nav { .social-nav:hover {
color: var(--color-dark-3); color: #00abad;
} }
/* Menu sub */ /* Menu sub */

4
src/app/(main)/layout.tsx
View File

@ -33,9 +33,7 @@ export default function MainLayout({
<body className="appear-animate body"> <body className="appear-animate body">
<div className="theme-slick"> <div className="theme-slick">
<div className="page" id="top"> <div className="page" id="top">
<nav className="main-nav dark transparent stick-fixed wow-menubar wch-unset"> <Header links={navMenuData} />
<Header links={navMenuData} />
</nav>
<main id="main">{children}</main> <main id="main">{children}</main>
<Footer /> <Footer />
</div> </div>

35
src/collections/Blogs.ts
View File

@ -1,10 +1,16 @@
import formatSlug from "@/utils/payload/formatSlug"; import formatSlug from "@/utils/payload/formatSlug";
import setAuthor from "@/utils/payload/setAuthor";
import { lexicalEditor } from "@payloadcms/richtext-lexical"; import { lexicalEditor } from "@payloadcms/richtext-lexical";
import type { CollectionConfig } from "payload"; import type { CollectionConfig } from "payload";
export const Blogs: CollectionConfig = { export const Blogs: CollectionConfig = {
slug: "blogs", slug: "blogs",
labels: { plural: "Posts", singular: "Post" }, labels: { plural: "Posts", singular: "Post" },
versions: {
drafts: {
validate: true,
},
},
fields: [ fields: [
{ {
name: "title", name: "title",
@ -65,32 +71,27 @@ export const Blogs: CollectionConfig = {
}, },
], ],
}, },
{
name: "is_published",
label: "Published",
type: "checkbox",
defaultValue: true,
admin: {
position: "sidebar",
},
},
{ {
name: "createdBy", name: "createdBy",
type: "relationship", type: "relationship",
relationTo: "users", relationTo: "users",
hidden: true, hooks: {
// hooks: { beforeChange: [setAuthor],
// beforeChange: [setAuthor], },
// }, admin: {
hidden: true,
},
}, },
{ {
name: "updatedBy", name: "updatedBy",
type: "relationship", type: "relationship",
relationTo: "users", relationTo: "users",
hidden: true, hooks: {
// hooks: { beforeChange: [setAuthor],
// beforeChange: [setAuthor], },
// }, admin: {
hidden: true,
},
}, },
], ],
admin: { admin: {

31
src/collections/Pages.ts
View File

@ -8,10 +8,16 @@ import { HorizontalImageContentBlock } from "@/blocks/HorizontalImageContent";
import { ImageSliderBlock } from "@/blocks/ImageSlider"; import { ImageSliderBlock } from "@/blocks/ImageSlider";
import { OurTeamBlock } from "@/blocks/OurTeam"; import { OurTeamBlock } from "@/blocks/OurTeam";
import formatSlug from "@/utils/payload/formatSlug"; import formatSlug from "@/utils/payload/formatSlug";
import setAuthor from "@/utils/payload/setAuthor";
import { CollectionConfig } from "payload"; import { CollectionConfig } from "payload";
export const Pages: CollectionConfig = { export const Pages: CollectionConfig = {
slug: "pages", slug: "pages",
versions: {
drafts: {
validate: true,
},
},
fields: [ fields: [
{ {
name: "title", name: "title",
@ -29,9 +35,6 @@ export const Pages: CollectionConfig = {
name: "slug", name: "slug",
label: "Page Slug", label: "Page Slug",
type: "text", type: "text",
admin: {
position: "sidebar",
},
hooks: { hooks: {
beforeValidate: [formatSlug("title")], beforeValidate: [formatSlug("title")],
}, },
@ -75,6 +78,28 @@ export const Pages: CollectionConfig = {
}, },
], ],
}, },
{
name: "createdBy",
type: "relationship",
relationTo: "users",
hooks: {
beforeChange: [setAuthor],
},
admin: {
hidden: true,
},
},
{
name: "updatedBy",
type: "relationship",
relationTo: "users",
hooks: {
beforeChange: [setAuthor],
},
admin: {
hidden: true,
},
},
], ],
admin: { admin: {
hideAPIURL: true, hideAPIURL: true,

20
src/components/Blogs/Blog.tsx
View File

@ -15,24 +15,12 @@ export default async function Blog() {
<div className="row mb-60 mb-sm-40"> <div className="row mb-60 mb-sm-40">
<div className="col-lg-8 offset-lg-2 text-center mb-md-30"> <div className="col-lg-8 offset-lg-2 text-center mb-md-30">
<h2 className="section-caption-slick mb-30 mb-sm-20">Our Blog</h2> <h2 className="section-caption-slick mb-30 mb-sm-20">Our Blog</h2>
<h3 className="section-title mb-30">Check the latest news about our company in our blog.</h3> <h3 className="section-title-large mb-30">Knowledge and Support for Your Cancer Journey</h3>
<p className="section-descr mb-0"> <p className="mb-0">
There are three kinds of web developer specialization front-end developer, back-end developer, and Cancer treatment involves a team of specialists providing personalized, comprehensive care. Staying
full-stack developer. informed and engaged empowers you to choose the best approach. Remember, you’re not alone in this journey.
</p> </p>
</div> </div>
<div className="col-lg-2 d-flex align-items-end">
<div className="local-scroll text-center text-lg-end w-100">
<Link href={`/slick-blog-dark`} className="link-hover-anim" data-link-animate="y">
<span className="link-strong link-strong-unhovered">
Our blog <i className="mi-arrow-right size-24" aria-hidden="true"></i>
</span>
<span className="link-strong link-strong-hovered" aria-hidden="true">
Our blog <i className="mi-arrow-right size-24" aria-hidden="true"></i>
</span>
</Link>
</div>
</div>
</div> </div>
{/* Blog Posts Grid */} {/* Blog Posts Grid */}
<div className="row mt-n30"> <div className="row mt-n30">

5
src/components/Blogs/BlogDetail.tsx
View File

@ -4,6 +4,7 @@ import { RichText } from "@payloadcms/richtext-lexical/react";
import { headers } from "next/headers"; import { headers } from "next/headers";
import Image from "next/image"; import Image from "next/image";
import { notFound } from "next/navigation"; import { notFound } from "next/navigation";
import Blog from "./Blog";
export interface BlogDetailProps { export interface BlogDetailProps {
slug: string | undefined; slug: string | undefined;
@ -48,10 +49,14 @@ export default async function BlogDetail({ slug }: BlogDetailProps) {
{/* End Post */} {/* End Post */}
</div> </div>
{/* End Content */} {/* End Content */}
<hr style={{ width: "100%", border: "1px solid #aaa" }} />
</div> </div>
</div> </div>
</section> </section>
{/* End Section */} {/* End Section */}
<div className="mb-5">
<Blog />
</div>
</> </>
); );
} }

119
src/components/Header.tsx
View File

@ -5,66 +5,79 @@ import { navMenuData } from "@/data/menu";
import { toggleMobileMenu } from "@/utils/toggleMobileMenu"; import { toggleMobileMenu } from "@/utils/toggleMobileMenu";
import Image from "next/image"; import Image from "next/image";
import Link from "next/link"; import Link from "next/link";
import { FaFacebook, FaLinkedin, FaTwitter } from "react-icons/fa"; import { FaFacebook, FaLinkedin, FaPhone } from "react-icons/fa";
const shareIcons: Record<string, any> = { const shareIcons: Record<string, any> = {
facebook: <FaFacebook className="social-nav text-2xl lg:text-gray-300" />, phone: {
linkedin: <FaLinkedin className="social-nav text-2xl lg:text-gray-300" />, link: "tel:+15208036644",
twitter: <FaTwitter className="social-nav text-2xl lg:text-gray-300" />, dom: (
<span className="social-nav flex gap-3 text-2xl lg:text-[#00898b]">
<FaPhone />
<b className="text-sm">(520) 803-6644</b>
</span>
),
},
facebook: {
link: "https://www.facebook.com/p/Cochise-Oncology-61556262839823",
dom: <FaFacebook className="social-nav text-2xl lg:text-[#00898b]" />,
},
linkedin: {
link: "https://linkedin.com/company/cochise-oncology",
dom: <FaLinkedin className="social-nav text-2xl lg:text-[#00898b]" />,
},
}; };
export default function Header({ links }: { links: typeof navMenuData }) { export default function Header({ links }: { links: typeof navMenuData }) {
return ( return (
<div className="main-nav-sub full-wrapper"> <nav className="main-nav dark stick-fixed wow-menubar wch-unset relative">
{/* Logo (* Add your text or image to the link tag. Use SVG or PNG image format. <div className="main-nav-sub full-wrapper">
{/* Logo (* Add your text or image to the link tag. Use SVG or PNG image format.
If you use a PNG logo image, the image resolution must be equal 200% of the visible logo If you use a PNG logo image, the image resolution must be equal 200% of the visible logo
image size for support of retina screens. See details in the template documentation. *) */} image size for support of retina screens. See details in the template documentation. *) */}
<div className="nav-logo-wrap local-scroll"> <div className="nav-logo-wrap local-scroll">
<Link href={`/`} className="logo"> <Link href={`/`} className="logo">
<Image <Image
src="/assets/images/demo-slick/logo-dark.webp" src="/assets/images/demo-slick/logo-dark.webp"
alt="Your Company Logo" alt="Your Company Logo"
width={105} width={105}
height={34} height={34}
className="light-mode-logo" className="light-mode-logo"
/> />
<Image <Image
src="/assets/images/demo-slick/logo-dark.webp" src="/assets/images/demo-slick/logo-dark.webp"
alt="Your Company Logo" alt="Your Company Logo"
width={405} width={405}
height={34} height={34}
className="dark-mode-logo" className="dark-mode-logo"
/> />
</Link> </Link>
</div>
{/* Mobile Menu Button */}
<div onClick={toggleMobileMenu} className="mobile-nav" role="button" tabIndex={0}>
<i className="mobile-nav-icon" />
<span className="visually-hidden">Menu</span>
</div>
{/* Main Menu */}
<div className="inner-nav desktop-nav">
<ul className="clearlist local-scroll">
{/* Item With Sub */}
<HeaderNav links={links} />
{/* End Item With Sub */}
</ul>
<ul className="items-end clearlist">
{Object.keys(shareIcons).map((k, idx) => {
return (
<li key={idx} className="!p-0 !m-0">
<a className="cursor-pointer" href={shareIcons[k].link} target="_blank">
{shareIcons[k].dom}
</a>
</li>
);
})}
</ul>
</div>
{/* End Main Menu */}
</div> </div>
{/* Mobile Menu Button */} </nav>
<div onClick={toggleMobileMenu} className="mobile-nav" role="button" tabIndex={0}>
<i className="mobile-nav-icon" />
<span className="visually-hidden">Menu</span>
</div>
{/* Main Menu */}
<div className="inner-nav desktop-nav">
<ul className="clearlist local-scroll">
{/* Item With Sub */}
<HeaderNav links={links} />
{/* End Item With Sub */}
</ul>
<ul className="items-end clearlist">
{/* Languages */}
{/* <LanguageSelect /> */}
{/* End Languages */}
<li></li>
</ul>
</div>
<div className="flex mt-4 gap-3">
{Object.keys(shareIcons).map((k, idx) => {
return (
<a key={idx} className="cursor-pointer" href={"/"} target="_blank">
{shareIcons[k]}
</a>
);
})}
</div>
{/* End Main Menu */}
</div>
); );
} }

6
src/components/HeaderNav.tsx
View File

@ -56,7 +56,7 @@ export default function HeaderNav({ links, animateY = false }: { links: typeof n
{Array.isArray(link?.child) && ( {Array.isArray(link?.child) && (
<> <>
<Link href={link?.href ?? "#"} className="mn-has-sub"> <Link href={link?.href ?? "#"} className="mn-has-sub flex justify-between">
{link.text} <i className="mi-chevron-down" onClick={() => toggleDropdown([link.text])} /> {link.text} <i className="mi-chevron-down" onClick={() => toggleDropdown([link.text])} />
</Link> </Link>
@ -70,8 +70,8 @@ export default function HeaderNav({ links, animateY = false }: { links: typeof n
)} )}
{Array.isArray(subLink?.child) && ( {Array.isArray(subLink?.child) && (
<> <>
<Link href={subLink?.href ?? "#"} className="mn-has-sub"> <Link href={subLink?.href ?? "#"} className="mn-has-sub !flex !justify-between">
{subLink.text} <span>{subLink.text}</span>
<i className="mi-chevron-down" onClick={() => toggleDropdown([link.text, subLink.text])} /> <i className="mi-chevron-down" onClick={() => toggleDropdown([link.text, subLink.text])} />
</Link> </Link>

100
src/components/Homepage.tsx
View File

@ -57,55 +57,61 @@ export default function homepage({ dark = false }) {
</Link> </Link>
</div> </div>
</section> </section>
<section className="w-full py-10 flex flex-col items-center"> <section className="py-5 w-full flex flex-col">
<div className="w-11/12 md:w-3/4 lg:w-2/3 bg-white p-6 md:p-8 rounded-lg shadow-lg"> <div className="relative flex justify-center">
<p className="italic text-gray-700"> <div className="w-full md:w-1/2 self-center mt-[-70px] mb-50 flex justify-center">
I was diagnosed with cancer up in Tucson. The doctor was said to be best oncologist in the state. Problem <div className="bg-white h-full flex flex-col lg:flex-row flex-wrap justify-center p-4 lg:p-8 gap-3 rounded-xl shadow-xl">
was I needed radiation for 45 days not counting weekends and holidays. <blockquote
</p> className="self-center border-teal-500 pl-4 italic text-gray-800"
<p className="italic text-gray-700 mt-4"> style={{ borderLeft: "4px solid #eee" }}
I had to tell her that that was not doable. I couldn't commute daily and I couldn't rent. I told her that I >
could get treatment of some sort in Sierra Vista. She told me that normally she would fight me, but only 2 I was diagnosed with cancer up in Tucson. The doctor was said to be best oncologist in the state.
Clinics in the state had this latest and greatest radiation hardware. Hers and Cochise Oncology in Sierra Problem was I needed radiation for 45 days not counting weekends and holidays.
Vista. <br />
</p> <br />
<p className="italic text-gray-700 mt-4"> I had to tell her that that was not doable. I couldn&apos;t commute daily and I couldn&apos;t rent. I
I had to tell her that that was not doable. I couldn't commute daily and I couldn't rent. I told her that I told her that I could get treatment of some sort in Sierra Vista. She told me that normally she would
could get treatment of some sort in Sierra Vista. She told me that normally she would fight me, but only 2 fight me, but only 2 Clinics in the state had this latest and greatest radiation hardware. Hers and
Clinics in the state had this latest and greatest radiation hardware. Hers and Cochise Oncology in Sierra Cochise Oncology in Sierra Vista.
Vista. <br />
</p> <br />
<p className="italic text-gray-700 mt-4">Do yourself a favor and see Dr. Vedula.</p> At Cochise Oncology I was introduced to Dr. Vedula. What a good man and what a great doctor. Check out
<p className="font-bold text-indigo-600 mt-4">- a Cochise Oncology patient</p> his credentials. I am now cancer free for 9 months. It was still 45 days of treatment but no side
<p className="text-sm text-gray-500 text-center mt-4">*Individual Results May Vary</p> effects. Plus, I would go home every day after undergoing treatment. I forget, maybe 15 minutes of
</div> treatment.
</section> <br />
<section className="py-5 w-full items-center"> <br />
<div className="max-w-7xl mx-auto p-6 text-center"> Do yourself a favor and see Dr. Vedula.
<h2>Testimonials</h2> <br></br>
<div className="text-left text-gray-700 space-y-4"> <b>-a Cochise Oncology patient</b>
<p className="italic"> </blockquote>
I was diagnosed with cancer up in Tucson. The doctor was said to be the best oncologist in the state. </div>
Problem was I needed radiation for 45 days not counting weekends and holidays.
</p>
<p className="italic">
I had to tell her that that was not doable. I couldn't commute daily and I couldn't rent. I told her that
I could get treatment of some sort in Sierra Vista. She told me that normally she would fight me, but only
2 clinics in the state had this latest and greatest radiation hardware. Hers and Cochise Oncology in
Sierra Vista.
</p>
<p className="italic">
At Cochise Oncology I was introduced to Dr. Vedula. What a good man and what a great doctor. Check out his
credentials. I am now cancer free for 9 months. It was still 45 days of treatment but no side effects.
Plus, I would go home every day after undergoing treatment. I forget, maybe 15 minutes of treatment.
</p>
<p>Do yourself a favor and see Dr. Vedula.</p>
<p className="font-bold text-gray-900">- a Cochise Oncology patient</p>
</div> </div>
<p className="text-sm text-gray-500 mt-4">*Individual Results May Vary</p>
</div> </div>
</section> <h1 className="w-full text-center !font-light">Testimonials</h1>
<section className="py-5 w-full items-center"> <blockquote
className="w-full md:w-8/12 self-center border-teal-500 pl-4 italic text-gray-800"
style={{ borderLeft: "4px solid #eee" }}
>
I was diagnosed with cancer up in Tucson. The doctor was said to be best oncologist in the state. Problem was
I needed radiation for 45 days not counting weekends and holidays.
<br />
<br />
I had to tell her that that was not doable. I couldn&apos;t commute daily and I couldn&apos;t rent. I told her
that I could get treatment of some sort in Sierra Vista. She told me that normally she would fight me, but
only 2 Clinics in the state had this latest and greatest radiation hardware. Hers and Cochise Oncology in
Sierra Vista.
<br />
<br />
At Cochise Oncology I was introduced to Dr. Vedula. What a good man and what a great doctor. Check out his
credentials. I am now cancer free for 9 months. It was still 45 days of treatment but no side effects. Plus, I
would go home every day after undergoing treatment. I forget, maybe 15 minutes of treatment.
<br />
<br />
Do yourself a favor and see Dr. Vedula.
<br></br>
<b>-a Cochise Oncology patient</b>
</blockquote>
<Testimonials /> <Testimonials />
</section> </section>
<section className="page-section bg-scroll light-content bg-[url(/assets/images/demo-modern/section-bg-3.jpeg)] bg-cover"> <section className="page-section bg-scroll light-content bg-[url(/assets/images/demo-modern/section-bg-3.jpeg)] bg-cover">

10
src/payload-types.ts
View File

@ -146,11 +146,11 @@ export interface Blog {
description?: string | null; description?: string | null;
canonical_url?: string | null; canonical_url?: string | null;
}; };
is_published?: boolean | null;
createdBy?: (number | null) | User; createdBy?: (number | null) | User;
updatedBy?: (number | null) | User; updatedBy?: (number | null) | User;
updatedAt: string; updatedAt: string;
createdAt: string; createdAt: string;
_status?: ('draft' | 'published') | null;
} }
/** /**
* This interface was referenced by `Config`'s JSON-Schema * This interface was referenced by `Config`'s JSON-Schema
@ -306,8 +306,11 @@ export interface Page {
description?: string | null; description?: string | null;
cannonical_url?: string | null; cannonical_url?: string | null;
}; };
createdBy?: (number | null) | User;
updatedBy?: (number | null) | User;
updatedAt: string; updatedAt: string;
createdAt: string; createdAt: string;
_status?: ('draft' | 'published') | null;
} }
/** /**
* This interface was referenced by `Config`'s JSON-Schema * This interface was referenced by `Config`'s JSON-Schema
@ -644,11 +647,11 @@ export interface BlogsSelect<T extends boolean = true> {
description?: T; description?: T;
canonical_url?: T; canonical_url?: T;
}; };
is_published?: T;
createdBy?: T; createdBy?: T;
updatedBy?: T; updatedBy?: T;
updatedAt?: T; updatedAt?: T;
createdAt?: T; createdAt?: T;
_status?: T;
} }
/** /**
* This interface was referenced by `Config`'s JSON-Schema * This interface was referenced by `Config`'s JSON-Schema
@ -747,8 +750,11 @@ export interface PagesSelect<T extends boolean = true> {
description?: T; description?: T;
cannonical_url?: T; cannonical_url?: T;
}; };
createdBy?: T;
updatedBy?: T;
updatedAt?: T; updatedAt?: T;
createdAt?: T; createdAt?: T;
_status?: T;
} }
/** /**
* This interface was referenced by `Config`'s JSON-Schema * This interface was referenced by `Config`'s JSON-Schema

24
src/services/payload/blog.ts
View File

@ -10,24 +10,11 @@ export async function fetchBlog(page: number | undefined, search: string = "") {
pagination: true, pagination: true,
limit: 6, limit: 6,
where: !search where: !search
? { ? undefined
is_published: {
equals: true,
},
}
: { : {
and: [ title: {
{ contains: search,
is_published: { },
equals: true,
},
},
{
title: {
contains: search,
},
},
],
}, },
}); });
@ -51,9 +38,6 @@ export async function fetchBlogDetail(slug: string | undefined) {
collection: "blogs", collection: "blogs",
where: { where: {
slug: { equals: slug }, slug: { equals: slug },
is_published: {
equals: true,
},
}, },
limit: 1, limit: 1,
pagination: false, pagination: false,

2
src/utils/changeHeaderOnScroll.ts
View File

@ -2,11 +2,9 @@ export const headerChangeOnScroll = () => {
const mainNav = document.querySelector(".main-nav"); const mainNav = document.querySelector(".main-nav");
const lightAfterScroll = document.querySelector(".light-after-scroll"); const lightAfterScroll = document.querySelector(".light-after-scroll");
if (window.scrollY > 0) { if (window.scrollY > 0) {
mainNav?.classList.remove("transparent");
mainNav?.classList.add("body-scrolled"); mainNav?.classList.add("body-scrolled");
if (lightAfterScroll) lightAfterScroll.classList.remove("dark"); if (lightAfterScroll) lightAfterScroll.classList.remove("dark");
} else if (window.scrollY === 0) { } else if (window.scrollY === 0) {
mainNav?.classList.add("transparent");
mainNav?.classList.remove("body-scrolled"); mainNav?.classList.remove("body-scrolled");
if (lightAfterScroll) lightAfterScroll.classList.add("dark"); if (lightAfterScroll) lightAfterScroll.classList.add("dark");
} }

19
src/utils/payload/setAuthor.ts
View File

@ -1,14 +1,17 @@
import { FieldHook } from "payload"; import { FieldHook } from "payload";
const setAuthor: FieldHook = ({ req, operation, data, value }) => { const setAuthor: FieldHook = ({ value, req, data, field, operation }) => {
// if (req.user && !!data) { if (req.user && !!data) {
// if (operation === "create") { if (operation === "create") {
// data.createdBy = req.user.id; return req.user.id;
// } } else {
// data.updatedBy = req.user.id; if (field.name === "updatedBy") {
// } return req.user.id;
}
}
}
return data; return value;
}; };
export default setAuthor; export default setAuthor;