Merge pull request #42 from MkSaaSHQ/affonso

feat: support Affonso affiliate

env.example

@@ -129,3 +129,9 @@ NEXT_PUBLIC_DATAFAST_ANALYTICS_DOMAIN=""
 # -----------------------------------------------------------------------------
 NEXT_PUBLIC_DISCORD_WIDGET_SERVER_ID=""
 NEXT_PUBLIC_DISCORD_WIDGET_CHANNEL_ID=""
+
+# -----------------------------------------------------------------------------
+# Affiliate (Affonso)
+# https://mksaas.com/docs/affiliate
+# -----------------------------------------------------------------------------
+NEXT_PUBLIC_AFFILIATE_AFFONSO_ID=""

src/app/[locale]/(marketing)/(home)/page.tsx

@@ -12,7 +12,6 @@ import StatsSection from '@/components/blocks/stats/stats';
 import TestimonialsSection from '@/components/blocks/testimonials/testimonials';
 import { NewsletterCard } from '@/components/newsletter/newsletter-card';
 import DiscordWidget from '@/components/shared/discord-widget';
-import { websiteConfig } from '@/config/website';
 import { constructMetadata } from '@/lib/metadata';
 import { getUrlWithLocale } from '@/lib/urls/urls';
 import type { Metadata } from 'next';
@@ -75,7 +74,7 @@ export default async function HomePage(props: HomePageProps) {
 
         <NewsletterCard />
 
-        {websiteConfig.features.enableDiscordWidget && <DiscordWidget />}
+        <DiscordWidget />
       </div>
     </>
   );

src/components/affiliate/affonso.tsx

@@ -0,0 +1,33 @@
+'use client';
+
+import { websiteConfig } from '@/config/website';
+import Script from 'next/script';
+
+/**
+ * Affonso Affiliate
+ *
+ * https://affonso.com
+ */
+export function AffonsoAffiliate() {
+  if (process.env.NODE_ENV !== 'production') {
+    return null;
+  }
+
+  if (!websiteConfig.features.enableAffonsoAffiliate) {
+    return null;
+  }
+
+  const affiliateId = process.env.NEXT_PUBLIC_AFFILIATE_AFFONSO_ID as string;
+  if (!affiliateId) {
+    return null;
+  }
+
+  return (
+    <Script
+      src="https://affonso.io/js/pixel.min.js"
+      strategy="afterInteractive"
+      data-affonso={affiliateId}
+      data-cookie_duration="30"
+    />
+  );
+}

src/components/auth/register-form.tsx

@@ -13,6 +13,7 @@ import {
   FormMessage,
 } from '@/components/ui/form';
 import { Input } from '@/components/ui/input';
+import { websiteConfig } from '@/config/website';
 import { authClient } from '@/lib/auth-client';
 import { getUrlWithLocaleInCallbackUrl } from '@/lib/urls/urls';
 import { DEFAULT_LOGIN_REDIRECT, Routes } from '@/routes';
@@ -97,6 +98,13 @@ export const RegisterForm = ({
           // sign up success, user information stored in ctx.data
           // console.log("register, success:", ctx.data);
           setSuccess(t('checkEmail'));
+
+          // add affonso affiliate
+          // https://affonso.io/app/affiliate-program/connect
+          if (websiteConfig.features.enableAffonsoAffiliate) {
+            console.log('register, affonso affiliate:', values.email);
+            window.Affonso.signup(values.email);
+          }
         },
         onError: (ctx) => {
           // sign up fail, display the error message

src/components/dashboard/dashboard-sidebar.tsx

@@ -13,7 +13,6 @@ import {
   useSidebar,
 } from '@/components/ui/sidebar';
 import { getSidebarLinks } from '@/config/sidebar-config';
-import { websiteConfig } from '@/config/website';
 import { LocaleLink } from '@/i18n/navigation';
 import { authClient } from '@/lib/auth-client';
 import { Routes } from '@/routes';
@@ -77,9 +76,7 @@ export function DashboardSidebar({
         {!isPending && mounted && (
           <>
             {/* show upgrade card if user is not a member, and sidebar is not collapsed */}
-            {currentUser &&
-              state !== 'collapsed' &&
-              websiteConfig.features.enableUpgradeCard && <UpgradeCard />}
+            {currentUser && state !== 'collapsed' && <UpgradeCard />}
 
             {/* show user profile if user is logged in */}
             {currentUser && <SidebarUser user={currentUser} />}

src/components/dashboard/upgrade-card.tsx

@@ -8,6 +8,7 @@ import {
   CardHeader,
   CardTitle,
 } from '@/components/ui/card';
+import { websiteConfig } from '@/config/website';
 import { usePayment } from '@/hooks/use-payment';
 import { LocaleLink } from '@/i18n/navigation';
 import { Routes } from '@/routes';
@@ -16,6 +17,10 @@ import { useTranslations } from 'next-intl';
 import { useEffect, useState } from 'react';
 
 export function UpgradeCard() {
+  if (!websiteConfig.features.enableUpgradeCard) {
+    return null;
+  }
+
   const t = useTranslations('Dashboard.upgrade');
   const [mounted, setMounted] = useState(false);
   const { isLoading, currentPlan, subscription } = usePayment();

src/components/pricing/create-checkout-button.tsx

@@ -2,6 +2,7 @@
 
 import { createCheckoutAction } from '@/actions/create-checkout-session';
 import { Button } from '@/components/ui/button';
+import { websiteConfig } from '@/config/website';
 import { Loader2Icon } from 'lucide-react';
 import { useTranslations } from 'next-intl';
 import { useState } from 'react';
@@ -50,12 +51,35 @@ export function CheckoutButton({
     try {
       setIsLoading(true);
 
+      const mergedMetadata = metadata ? { ...metadata } : {};
+
+      // add affonso_referral to metadata if enabled affonso affiliate
+      if (websiteConfig.features.enableAffonsoAffiliate) {
+        const affonsoReferral =
+          typeof document !== 'undefined'
+            ? (() => {
+                const match = document.cookie.match(
+                  /(?:^|; )affonso_referral=([^;]*)/
+                );
+                return match ? decodeURIComponent(match[1]) : null;
+              })()
+            : null;
+        if (affonsoReferral) {
+          console.log(
+            'create checkout button, affonsoReferral:',
+            affonsoReferral
+          );
+          mergedMetadata.affonso_referral = affonsoReferral;
+        }
+      }
+
       // Create checkout session using server action
       const result = await createCheckoutAction({
         userId,
         planId,
         priceId,
-        metadata,
+        metadata:
+          Object.keys(mergedMetadata).length > 0 ? mergedMetadata : undefined,
       });
 
       // Redirect to checkout page

src/components/shared/discord-widget.tsx

@@ -1,6 +1,7 @@
 'use client';
 
 import { DiscordIcon } from '@/components/icons/discord';
+import { websiteConfig } from '@/config/website';
 import { useMediaQuery } from '@/hooks/use-media-query';
 import WidgetBot from '@widgetbot/react-embed';
 import { useEffect, useRef, useState } from 'react';
@@ -11,6 +12,10 @@ import { useEffect, useRef, useState } from 'react';
  * https://docs.widgetbot.io/embed/react-embed/
  */
 export default function DiscordWidget() {
+  if (!websiteConfig.features.enableDiscordWidget) {
+    return null;
+  }
+
   const serverId = process.env.NEXT_PUBLIC_DISCORD_WIDGET_SERVER_ID as string;
   const channelId = process.env.NEXT_PUBLIC_DISCORD_WIDGET_CHANNEL_ID as string;
   if (!serverId || !channelId) {

src/config/website.tsx

@@ -35,6 +35,7 @@ export const websiteConfig: WebsiteConfig = {
   features: {
     enableDiscordWidget: true,
     enableUpgradeCard: true,
+    enableAffonsoAffiliate: false,
   },
   routes: {
     defaultLoginRedirect: '/dashboard',

src/types/index.d.ts

@@ -67,6 +67,7 @@ export interface SocialConfig {
 export interface FeaturesConfig {
   enableDiscordWidget?: boolean;      // Whether to enable the discord widget
   enableUpgradeCard?: boolean;        // Whether to enable the upgrade card in the sidebar
+  enableAffonsoAffiliate?: boolean;   // Whether to enable affonso affiliate
 }
 
 /**