From c8b3cd79d11de179edf2c630625a2f2f36296db9 Mon Sep 17 00:00:00 2001 From: austinkelsay Date: Fri, 13 Sep 2024 11:57:38 -0500 Subject: [PATCH] Small styling fixes on interactive carousel and tempaltes, added correct buttons fixed up subscribe page a bit --- .../carousels/newTemplates/CourseTemplate.js | 4 +- .../newTemplates/DocumentTemplate.js | 4 +- .../carousels/newTemplates/VideoTemplate.js | 4 +- src/components/interactive-news-carousel.jsx | 41 ++++++++++- src/pages/subscribe.js | 68 +++++++++++++++---- 5 files changed, 99 insertions(+), 22 deletions(-) diff --git a/src/components/content/carousels/newTemplates/CourseTemplate.js b/src/components/content/carousels/newTemplates/CourseTemplate.js index 93cdcdb..d74ad76 100644 --- a/src/components/content/carousels/newTemplates/CourseTemplate.js +++ b/src/components/content/carousels/newTemplates/CourseTemplate.js @@ -49,8 +49,8 @@ export function CourseTemplate({ course }) { -
- +
+
{course.name || course.title}
diff --git a/src/components/content/carousels/newTemplates/DocumentTemplate.js b/src/components/content/carousels/newTemplates/DocumentTemplate.js index c96a186..5118864 100644 --- a/src/components/content/carousels/newTemplates/DocumentTemplate.js +++ b/src/components/content/carousels/newTemplates/DocumentTemplate.js @@ -41,8 +41,8 @@ export function DocumentTemplate({ document }) {
-
- +
+
{document.title}
diff --git a/src/components/content/carousels/newTemplates/VideoTemplate.js b/src/components/content/carousels/newTemplates/VideoTemplate.js index 6fb6e90..0b49713 100644 --- a/src/components/content/carousels/newTemplates/VideoTemplate.js +++ b/src/components/content/carousels/newTemplates/VideoTemplate.js @@ -41,8 +41,8 @@ export function VideoTemplate({ video }) {
-
- +
+
{video.title}
diff --git a/src/components/interactive-news-carousel.jsx b/src/components/interactive-news-carousel.jsx index a010048..691f5e2 100644 --- a/src/components/interactive-news-carousel.jsx +++ b/src/components/interactive-news-carousel.jsx @@ -2,7 +2,7 @@ import Image from "next/image" import { useState } from "react" import { useImageProxy } from "@/hooks/useImageProxy" import GenericButton from "@/components/buttons/GenericButton" - +import { useRouter } from "next/router" const promotions = [ { id: 1, @@ -57,6 +57,7 @@ const promotions = [ export function InteractivePromotionalCarousel() { const [selectedPromotion, setSelectedPromotion] = useState(promotions[0]) const { returnImageProxy } = useImageProxy(); + const router = useRouter(); return (
@@ -76,8 +77,42 @@ export function InteractivePromotionalCarousel() {

{selectedPromotion.description}

- } label="Learn More" className="py-2 font-semibold" size="small" outlined /> - } label="Subscribe" className="py-2 font-semibold" size="small" outlined /> + { + (() => { + switch (selectedPromotion.category) { + case "PLEBDEVS": + return ( + <> + router.push('/about')} severity="success" icon={} label="Learn More" className="py-2 font-semibold" size="small" outlined /> + router.push('/subscribe')} severity="warning" icon={} label="Subscribe" className="py-2 font-semibold" size="small" outlined /> + router.push('/content?tag=all')} severity="help" icon={} label="View all content" className="py-2 font-semibold" size="small" outlined /> + + ); + case "COURSES": + return ( + router.push('/content?tag=courses')} icon={} label="View All Courses" className="py-2 font-semibold" size="small" outlined /> + ); + case "WORKSHOPS": + return ( + router.push('/content?tag=workshops')} icon={} label="View All Workshops" className="py-2 font-semibold" size="small" outlined /> + ); + case "RESOURCES": + return ( + router.push('/content?tag=resources')} icon={} label="View All Resources" className="py-2 font-semibold" size="small" outlined /> + ); + case "COMMUNITY": + return ( + router.push('/feed?channel=global')} icon={} label="Open Community Feed" className="py-2 font-semibold" size="small" outlined /> + ); + case "LIGHTNING / NOSTR": + return ( + router.push('/subscribe')} severity="warning" icon={} label="Subscribe" className="py-2 font-semibold" size="small" outlined /> + ); + default: + return null; + } + })() + }
diff --git a/src/pages/subscribe.js b/src/pages/subscribe.js index 795c7b4..47d18e0 100644 --- a/src/pages/subscribe.js +++ b/src/pages/subscribe.js @@ -4,6 +4,7 @@ import { useRouter } from 'next/router'; import { useToast } from '@/hooks/useToast'; import axios from 'axios'; import { Card } from 'primereact/card'; +import { Message } from 'primereact/message'; import useWindowWidth from '@/hooks/useWindowWidth'; import { Menu } from "primereact/menu"; import GenericButton from '@/components/buttons/GenericButton'; @@ -21,6 +22,19 @@ const Subscribe = () => { const [subscriptionExpiredAt, setSubscriptionExpiredAt] = useState(null); const menu = useRef(null); + useEffect(() => { + if (session && session?.user) { + setSubscribed(session?.user.role.subscribed); + const subscribedAt = new Date(session?.user.role.lastPaymentAt); + const subscribedUntil = new Date(subscribedAt.getTime() + 31 * 24 * 60 * 60 * 1000); + setSubscribedUntil(subscribedUntil); + if (session?.user.role.subscriptionExpiredAt) { + const expiredAt = new Date(session?.user.role.subscriptionExpiredAt) + setSubscriptionExpiredAt(expiredAt); + } + } + }, [session, session?.user]); + const handleSubscriptionSuccess = async (paymentResponse) => { setIsProcessing(true); try { @@ -92,7 +106,7 @@ const Subscribe = () => { }, ]; - const subscriptionCardTitle = ( + const subscriptionCardTitleAndButton = (
Plebdevs Subscription {
); + const subscriptionCardTitle = ( +
+ Plebdevs Subscription +
+ ); + return (
{ @@ -110,20 +130,42 @@ const Subscribe = () => {

Subscription Management

) } - -

- The plebdevs subscription is a monthly subscription that unlocks all of the paid content, grants you access to the plebdevs 1:1 calendar for tutoring, support, and mentorship, and gives you an exclusive invite to the pleblab bitcoin hackerspace community. -

+ {session && session?.user ? ( + + {subscribed && ( +
+ +

Thank you for your support 🎉

+

Pay-as-you-go subscription will renew on {subscribedUntil.toLocaleDateString()}

+
+ )} + {(!subscribed && !subscriptionExpiredAt) && ( +
+ +
+ )} + {subscriptionExpiredAt && ( +
+ +
+ )} + + ) : ( + +

+ The plebdevs subscription is a monthly subscription that unlocks all of the paid content, grants you access to the plebdevs 1:1 calendar for tutoring, support, and mentorship, and gives you an exclusive invite to the pleblab bitcoin hackerspace community. +

-

- The plebdevs subscription is Lightning only and you can subscribe a month at a time with the pay as you go option or easily setup an auto recurring monthly subscription using Nostr Wallet Connect. -

+

+ The plebdevs subscription is Lightning only and you can subscribe a month at a time with the pay as you go option or easily setup an auto recurring monthly subscription using Nostr Wallet Connect. +

-
-

Login to start your subscription

- router.push('/auth/signin')} className='text-[#f8f8ff] w-fit' size="small" rounded icon="pi pi-user" /> -
- +
+

Login to start your subscription

+ router.push('/auth/signin')} className='text-[#f8f8ff] w-fit' size="small" rounded icon="pi pi-user" /> +
+ + )} {isProcessing ? (