From ee501b729db44b1d7d713fda26e1a83f1575cabd Mon Sep 17 00:00:00 2001 From: atharva20-coder Date: Mon, 17 Mar 2025 13:28:16 +0530 Subject: [PATCH 01/14] Added Dark theme --- src/app/(landingpage)/page.tsx | 109 +++++++++--------- .../(landingpage)/social/instagram/page.tsx | 10 +- .../_components/automation-summary-card.tsx | 44 +++---- .../_components/metrics/analytics-summary.tsx | 26 ++--- .../[slug]/_components/metrics/index.tsx | 35 +++--- .../_components/metrics/metrics-card.tsx | 28 ++--- .../[id]/_components/drawer-button.tsx | 41 ++++--- .../[slug]/automations/[id]/page.tsx | 8 +- .../dashboard/[slug]/automations/page.tsx | 2 +- .../dashboard/[slug]/billing/page.tsx | 64 +++++----- .../dashboard/[slug]/billing/payment-card.tsx | 26 ++--- .../_components/integration-card/index.tsx | 32 ++--- .../dashboard/[slug]/integrations/page.tsx | 8 +- .../_components/notification-item.tsx | 18 +-- .../dashboard/[slug]/notifications/page.tsx | 12 +- src/app/(protected)/dashboard/[slug]/page.tsx | 14 +-- .../delete-account/delete-modal.tsx | 14 +-- .../_components/delete-account/index.tsx | 6 +- .../settings/_components/openai-settings.tsx | 14 ++- .../dashboard/[slug]/settings/page.tsx | 20 ++-- src/app/(protected)/dashboard/loading.tsx | 44 +++---- src/app/globals.css | 2 +- src/app/layout.tsx | 4 +- src/components/global/FAQ/faq-section.tsx | 52 ++++++--- src/components/global/announcement-banner.tsx | 2 +- .../global/automation-list/index.tsx | 12 +- .../global/automations/post/index.tsx | 27 +++-- .../global/automations/post/node.tsx | 43 ++++--- .../global/automations/then/node.tsx | 32 ++--- .../global/automations/then/then-action.tsx | 16 +-- .../automations/trigger-button/index.tsx | 4 +- .../global/automations/trigger/active.tsx | 12 +- .../global/automations/trigger/index.tsx | 22 ++-- .../trigger/keyword-item-active.tsx | 4 +- .../automations/trigger/keyword-item.tsx | 4 +- .../global/automations/trigger/keywords.tsx | 10 +- .../global/bread-crumbs/automations/index.tsx | 16 +-- .../bread-crumbs/main-bread-crumb/index.tsx | 10 +- .../global/carouselTemplateForm/index.tsx | 6 +- .../global/clerk-auth-state/index.tsx | 6 +- .../global/cookie-consent/index.tsx | 8 +- .../global/create-automation/index.tsx | 2 +- .../global/double-gradient-card.tsx | 22 ++-- .../global/double-gradient-card/index.tsx | 18 +-- src/components/global/drawer/index.tsx | 14 +-- src/components/global/footer.tsx | 29 ++++- src/components/global/infobar/index.tsx | 16 +-- .../infobar/notification-item/index.tsx | 16 +-- .../global/infobar/notifications/index.tsx | 20 ++-- .../global/infobar/search/index.tsx | 6 +- src/components/global/landing-nav.tsx | 50 ++++---- .../global/payment-button/index.tsx | 8 +- src/components/global/popover/index.tsx | 2 +- src/components/global/sheet/index.tsx | 2 +- src/components/global/sidebar/index.tsx | 21 +++- src/components/global/sidebar/items.tsx | 4 +- src/components/global/sidebar/upgrade.tsx | 6 +- src/components/ui/chat-interface.tsx | 2 +- src/constants/automation.tsx | 8 +- src/contexts/theme-context.tsx | 48 ++++++++ src/icons/instagram-blue.tsx | 7 +- src/icons/warning.tsx | 7 +- tailwind.config.ts | 15 ++- 63 files changed, 656 insertions(+), 534 deletions(-) create mode 100644 src/contexts/theme-context.tsx diff --git a/src/app/(landingpage)/page.tsx b/src/app/(landingpage)/page.tsx index 784256e..1d47ab8 100644 --- a/src/app/(landingpage)/page.tsx +++ b/src/app/(landingpage)/page.tsx @@ -16,32 +16,21 @@ export default function LandingPage() { return ( -
+
{/* Hero Section */} -
+
- {/* Mobile Image */} -
- Instagram Story Interface -
-

AUCTORN

-

+

AUCTORN

+

SMART MOVES, VIRAL WINS: AUTOMATE & THRIVE

-

- Boost your sales and conversions on Instagram, WhatsApp, and Messenger with our automation tools. Whether you're launching a new campaign or scaling up your business, watch your success soar with our customizable solutions. +

+ Seamlessly automate your Instagram engagement, grow your audience, and convert followers into customers with intelligent workflows designed for creators, influencers, and businesses.

- + @@ -52,7 +41,18 @@ export default function LandingPage() {
- + {/* Mobile Image */} +
+ Instagram Story Interface +
+ {/* Right Column - Image with 3D Hover Effect */}

POWERFUL DASHBOARD

-

+

Manage your social presence with our intuitive dashboard

-

+

Take control of your social media strategy with our comprehensive dashboard. Monitor engagement, track performance, and make data-driven decisions to grow your online presence.

- + @@ -235,11 +235,12 @@ export default function LandingPage() {
- {/* Social Technologies Section */} + {/* + Social Technologies Section

- Social technologies + Social Technologies

Social technologies that help influencers and buisnesses grow, build community and monetize their content. @@ -255,9 +256,6 @@ export default function LandingPage() { Messenger - - WhatsApp - Threads @@ -265,33 +263,34 @@ export default function LandingPage() {

Automate your favourite apps with no code

+ */} {/* Product Launch Timeline Section */}
-

+

Automate Your Success

-

+

Transform your social media presence with intelligent automation that handles engagement, grows your audience, and drives conversions 24/7.

- Smart Scheduling: -

Set up automated responses and engagement patterns that work around the clock, ensuring you never miss an opportunity to connect.

+ Smart Scheduling: +

Set up automated responses and engagement patterns that work around the clock, ensuring you never miss an opportunity to connect.

- AI-Powered Engagement: -

Let our AI handle comments, DMs, and story mentions with personalized responses that feel authentic and drive meaningful conversations.

+ AI-Powered Engagement: +

Let our AI handle comments, DMs, and story mentions with personalized responses that feel authentic and drive meaningful conversations.

- Analytics & Growth: -

Track your performance metrics and audience growth in real-time, making data-driven decisions to optimize your social strategy.

+ Analytics & Growth: +

Track your performance metrics and audience growth in real-time, making data-driven decisions to optimize your social strategy.

- + @@ -332,8 +331,8 @@ export default function LandingPage() {

AUTOMATION SUITE

-

Your All-in-One Social Automation Hub

-

+

Your All-in-One Social Automation Hub

+

Transform your Instagram presence today with our powerful AI automation, while preparing for tomorrow with upcoming integrations for Threads, Facebook, WhatsApp, Newsletter, Telegram, X, and LinkedIn. Our intelligent platform helps you create engaging conversations, deliver 24/7 customer support, and scale your social media engagement effortlessly across all channels.

@@ -354,14 +353,14 @@ export default function LandingPage() { {/* Features Section */}
-

+

For an out-of-this-world success

-

+

Fuel your project with a simplified product launch plan. Then, dive into the specifics with templates from our Community.

-
+
Target Audience -

Target audience

-

Understand the needs of a promising customer base before launch.

+

Target audience

+

Understand the needs of a promising customer base before launch.

-
+
Social Media Planner -

Social media planner

-

Strengthen your messaging with a consistent posting schedule.

+

Social media planner

+

Strengthen your messaging with a consistent posting schedule.

-
+
Other Templates -

Other templates from the community

-

Endeavor in new directions with business insights from all angles.

+

Flow Builder

+

Endeavor in new directions with business insights from all angles.

@@ -403,8 +402,8 @@ export default function LandingPage() { {/* Lead Generation Section */}
-

- Use Chat Marketing to drive more sales on autopilot +

+ Power your messaging by automating replies on autopilot

@@ -415,7 +414,7 @@ export default function LandingPage() {
-

+

Supercharge your lead generation

Capture and nurture leads through automated conversations. Convert website visitors into customers with personalized engagement strategies.

@@ -439,7 +438,7 @@ export default function LandingPage() {
-

+

Increase conversion rates by up to 90%

Leverage AI-powered automation to optimize your marketing campaigns, boost engagement rates, and maximize your return on investment.

@@ -458,7 +457,7 @@ export default function LandingPage() {
-

+

Automatically respond to every message

Automatically engage with every story mention, comment, and DM. Turn social interactions into meaningful conversations that drive sales.

@@ -477,7 +476,7 @@ export default function LandingPage() {
-

+

Auctorn AI: A Smarter Way to Chat

Level up the experiences your followers already love with the new Auctorn AI. Create more engaging and personalized conversations.

diff --git a/src/app/(landingpage)/social/instagram/page.tsx b/src/app/(landingpage)/social/instagram/page.tsx index 431f3c4..b6844eb 100644 --- a/src/app/(landingpage)/social/instagram/page.tsx +++ b/src/app/(landingpage)/social/instagram/page.tsx @@ -222,7 +222,7 @@ const InstagramPage = () => {

Great! Please confirm your email address below so I can send you the coupon code 🔥

-

max@manychat.com

+

max@auctorn.com

Thanks! Please confirm your phone number 👇

@@ -403,7 +403,7 @@ const InstagramPage = () => { {activeSection === 'stories' && (

- Use Manychat as your personal assistant that sounds exactly like you! Automatically answer every reaction, story reply, and story mention, and keep your viewers begging for more. + Use Auctorn as your personal assistant that sounds exactly like you! Automatically answer every reaction, story reply, and story mention, and keep your viewers begging for more.

)} @@ -445,7 +445,7 @@ const InstagramPage = () => { {activeSection === 'live' && (

- Manychat delivers hot deals, coupon codes and more directly to your audience's DMs — all while you're live! Best of all, you don't have to do a thing, just go live and tell your viewers to type a word in the chat to get instant access to the info. + Auctorn delivers hot deals, coupon codes and more directly to your audience's DMs — all while you're live! Best of all, you don't have to do a thing, just go live and tell your viewers to type a word in the chat to get instant access to the info.

)} @@ -533,7 +533,7 @@ const InstagramPage = () => {

In case you're our lucky winner, we'd like to notify you via email. Please confirm your email address below 👇

-

nathan@manychat.com

+

nathan@Auctorn.com

Thank you so much! We'll be back soon with the results

@@ -565,7 +565,7 @@ const InstagramPage = () => {

Please enter your email address (I'll also leave a link here, but this is your back-up copy.) 👇

-

alex@manychat.com

+

alex@Auctorn.com

Thanks for that! ❤️ I'll send it right away. Hope you like it!

diff --git a/src/app/(protected)/dashboard/[slug]/_components/automation-summary-card.tsx b/src/app/(protected)/dashboard/[slug]/_components/automation-summary-card.tsx index 33d9166..ceed57a 100644 --- a/src/app/(protected)/dashboard/[slug]/_components/automation-summary-card.tsx +++ b/src/app/(protected)/dashboard/[slug]/_components/automation-summary-card.tsx @@ -33,9 +33,9 @@ const AutomationSummaryCard = () => { if (isLoading) { return ( - +
-
+
); @@ -95,17 +95,17 @@ const AutomationSummaryCard = () => { const formattedDate = new Date(createdAt).toLocaleDateString(); return ( - +
-

Automation & Posts

+

Automation & Posts

- - Automation - Posts + + Automation + Posts - @@ -119,33 +119,33 @@ const AutomationSummaryCard = () => { className="w-8 h-8" />
-

{title}

-

{description}

+

{title}

+

{description}

- + {status.charAt(0).toUpperCase() + status.slice(1)}
- + - {accountCount} Accounts - • - {formattedDate} + {accountCount} Accounts + • + {formattedDate}
-
+
-

{metrics.accountsEngaged}

-

Account Engaged

+

{metrics.accountsEngaged}

+

Account Engaged

-

{metrics.totalLikes}

-

Total Likes Given

+

{metrics.totalLikes}

+

Total Likes Given

-

{metrics.followersRange}

-

Followers Range

+

{metrics.followersRange}

+

Followers Range

diff --git a/src/app/(protected)/dashboard/[slug]/_components/metrics/analytics-summary.tsx b/src/app/(protected)/dashboard/[slug]/_components/metrics/analytics-summary.tsx index 481d619..5f33981 100644 --- a/src/app/(protected)/dashboard/[slug]/_components/metrics/analytics-summary.tsx +++ b/src/app/(protected)/dashboard/[slug]/_components/metrics/analytics-summary.tsx @@ -24,23 +24,23 @@ const MetricCard = ({ label, value, change, previousValue, isLoading = false }: if (isLoading) { return (
-
-
-
+
+
+
) } return (
- {label} + {label}
- {value} - + {value} + {isPositive ? '+' : '-'}{formattedChange}%
- {previousValue} from previous month + {previousValue} from previous month
) } @@ -125,9 +125,9 @@ const AnalyticsSummary = () => { }, [analytics?.data]) return ( -
+
-
+
{ isLoading={isLoading} />
-
+
{ isLoading={isLoading} />
-
+
{ isLoading={isLoading} />
-
+
{ isLoading={isLoading} />
-
+
{ if (isLoading) { return ( - +
-

Loading chart data...

+

Loading chart data...

 @@ -55,9 +55,9 @@ const Chart = ({ hasActivity = false }: Props) => { if (!analytics?.data?.chartData || analytics.data.chartData.length === 0) { return ( - + -

+

No activity data available yet.

@@ -67,7 +67,7 @@ const Chart = ({ hasActivity = false }: Props) => { return (
- + @@ -82,30 +82,33 @@ const Chart = ({ hasActivity = false }: Props) => { margin={{ top: 20, right: 10, left: 0, bottom: 10 }} > ( <>
{ }} /> {chartConfig[name as keyof typeof chartConfig]?.label || name} -
+
{value}
{index === 2 && ( -
+
Total
{item.payload.dmCount + @@ -141,7 +144,7 @@ const Chart = ({ hasActivity = false }: Props) => { maxBarSize={50} fill={chartConfig.dmCount.color} barSize={30} - background={{ fill: '#f1f5f9', radius: 6 }} + background={{ fill: 'currentColor', radius: 6, opacity: 0.05 }} minPointSize={5} // Small bump for zero values /> { maxBarSize={50} fill={chartConfig.commentCount.color} barSize={30} - background={{ fill: '#f1f5f9', radius: 6 }} + background={{ fill: 'currentColor', radius: 6, opacity: 0.05 }} minPointSize={5} // Small bump for zero values /> { maxBarSize={50} fill={chartConfig.commentReply.color} barSize={30} - background={{ fill: '#f1f5f9', radius: 6 }} + background={{ fill: 'currentColor', radius: 6, opacity: 0.05 }} minPointSize={5} // Small bump for zero values /> diff --git a/src/app/(protected)/dashboard/[slug]/_components/metrics/metrics-card.tsx b/src/app/(protected)/dashboard/[slug]/_components/metrics/metrics-card.tsx index 83b7e49..a279412 100644 --- a/src/app/(protected)/dashboard/[slug]/_components/metrics/metrics-card.tsx +++ b/src/app/(protected)/dashboard/[slug]/_components/metrics/metrics-card.tsx @@ -65,15 +65,15 @@ const MetricsCard = () => { ].map((item, i) => (
-

{item.title}

-

{item.subtitle}

+

{item.title}

+

{item.subtitle}

-
-
+
+
))} @@ -86,15 +86,15 @@ const MetricsCard = () => {
- {platform} + {platform}
- Coming Soon + Coming Soon
-
-
-
+
+
+
@@ -103,10 +103,10 @@ const MetricsCard = () => { return (
{/* Instagram Card - Dynamic Data */} -
+
- Instagram + Instagram
{[ @@ -115,8 +115,8 @@ const MetricsCard = () => { { label: 'Comment Replies', value: metrics.commentReply, change: metrics.commentReplyChange } ].map((item, i) => (
- {item.label} - {item.value} + {item.label} + {item.value}
{item.change >= 0 ? ( <> diff --git a/src/app/(protected)/dashboard/[slug]/automations/[id]/_components/drawer-button.tsx b/src/app/(protected)/dashboard/[slug]/automations/[id]/_components/drawer-button.tsx index fcfd493..f77fd5d 100644 --- a/src/app/(protected)/dashboard/[slug]/automations/[id]/_components/drawer-button.tsx +++ b/src/app/(protected)/dashboard/[slug]/automations/[id]/_components/drawer-button.tsx @@ -31,12 +31,12 @@ const DrawerButton = ({ id }: Props) => { return (
-

Carousel template created

+

Carousel template created

{template.elements.map((element: any, index: number) => ( -
+
{element.imageUrl && ( -
+
{element.title { />
)} -

{element.title}

- {element.subtitle &&

{element.subtitle}

} +

{element.title}

+ {element.subtitle &&

{element.subtitle}

} {element.buttons?.length > 0 && (
{element.buttons.map((button: any, btnIndex: number) => ( -
+
- {button.title} + {button.title}
))}
@@ -60,7 +60,7 @@ const DrawerButton = ({ id }: Props) => {
))}
-

This template will be used in your automation flow.

+

This template will be used in your automation flow.

); }; @@ -69,32 +69,32 @@ const DrawerButton = ({ id }: Props) => { <> setIsOpen(false)}>
-

Message Templates

+

Message Templates

-
+
toggleSection('generic')}> -

Carousel Template

- {expandedSections['generic'] ? : } +

Carousel Template

+ {expandedSections['generic'] ? : }
{expandedSections['generic'] && (
-

Create interactive carousel messages with multiple elements

+

Create interactive carousel messages with multiple elements

{!isPro ? ( -
+
Upgrade to PRO to use this feature
) : hasCarouselTemplate || optimisticTemplate ? ( @@ -111,14 +111,13 @@ const DrawerButton = ({ id }: Props) => { )}
- {/* Other template sections remain unchanged */} -
+
toggleSection('button')}> -

Button Template

- {expandedSections['button'] ? : } +

Button Template

+ {expandedSections['button'] ? : }
{expandedSections['button'] && ( -

Add interactive buttons to your messages

+

Add interactive buttons to your messages

)}
diff --git a/src/app/(protected)/dashboard/[slug]/automations/[id]/page.tsx b/src/app/(protected)/dashboard/[slug]/automations/[id]/page.tsx index b6724af..5d0634b 100644 --- a/src/app/(protected)/dashboard/[slug]/automations/[id]/page.tsx +++ b/src/app/(protected)/dashboard/[slug]/automations/[id]/page.tsx @@ -39,15 +39,15 @@ const Page = async ({ params }: Props) => { return ( -
+
-
-
+
+
- When... + When...
diff --git a/src/app/(protected)/dashboard/[slug]/automations/page.tsx b/src/app/(protected)/dashboard/[slug]/automations/page.tsx index 6800576..e88ce86 100644 --- a/src/app/(protected)/dashboard/[slug]/automations/page.tsx +++ b/src/app/(protected)/dashboard/[slug]/automations/page.tsx @@ -7,7 +7,7 @@ type Props = {} const Page = (props: Props) => { return ( -
+
diff --git a/src/app/(protected)/dashboard/[slug]/billing/page.tsx b/src/app/(protected)/dashboard/[slug]/billing/page.tsx index db72de7..6a6bd69 100644 --- a/src/app/(protected)/dashboard/[slug]/billing/page.tsx +++ b/src/app/(protected)/dashboard/[slug]/billing/page.tsx @@ -15,27 +15,27 @@ const Billing = () => { const slug = params.slug as string; return ( -
+
{/* Hero Section */}
-

+

Let us help you grow more.

-

+

We'll get you set up in minutes. And we'll be here as your business expands. Open a Business account online—no monthly commitments, no hidden fees.

-

- Talk to an account specialist to get started, 91-7000-523-270. +

+ Talk to an account specialist to get started, 91-7000-523-270.

{ {/* Connect Store Section */}
-

+

Get a subscribed to Auctorn and automate your success.

-

+

We're integrated with the most popular ecommerce platforms out there. Link your Business account today for hassle-free payments.

-

Contact us for UPI payments or any payment-related issues

-

OR

+

Contact us for UPI payments or any payment-related issues

+

OR

Mail to atharvajoshi2520@gmail.com @@ -80,7 +80,7 @@ const Billing = () => {
{/* Plans Section */} -
+

Subscribe up today.
Here's your plan: @@ -89,20 +89,20 @@ const Billing = () => {
{/* FREE Plan */} -
-
+
+
FREE -
Your current plan
+
Your current plan
-

Standard

-

Perfect for getting started with automation

+

Standard

+

Perfect for getting started with automation

- ₹0 - /month + ₹0 + /month
-

- ✓ 200 DMs and Comments +

+ ✓ 200 DMs and Comments

✓ Boost engagement with target responses @@ -117,13 +117,13 @@ const Billing = () => {

{/* PRO Plan */} -
-
PRO
-

Smart AI

-

For power users and agencies

+
+
PRO
+

Smart AI

+

For power users and agencies

- ₹799 - /month + ₹799 + /month

@@ -155,19 +155,19 @@ const Billing = () => { {/* Footer Section */}

-

+

Unlock the full potential of your Instagram presence

-

+

Automate your engagement, generate AI-powered responses, and watch your Instagram following grow. Experience the power of smart automation today.

{/* Feedback Section */}
-

We value your feedback! Help us improve our service.

+

We value your feedback! Help us improve our service.

diff --git a/src/app/(protected)/dashboard/[slug]/integrations/page.tsx b/src/app/(protected)/dashboard/[slug]/integrations/page.tsx index 7e1e2de..08913ca 100644 --- a/src/app/(protected)/dashboard/[slug]/integrations/page.tsx +++ b/src/app/(protected)/dashboard/[slug]/integrations/page.tsx @@ -12,11 +12,11 @@ type Props = {} const Page = (props: Props) => { return ( <> -
-

Where would you like to start?

-

Don't worry, you can connect other channels later.

+
+

Where would you like to start?

+

Don't worry, you can connect other channels later.

-
+
{INTEGRATION_CARDS.map((card, key) => ( {
-

+

{notification.content}

{!notification.isSeen && ( @@ -44,15 +44,15 @@ const NotificationItem = ({ notification }: Props) => { ) } disabled={isMarking} - className="relative self-start px-2 sm:px-3 py-1 text-[11px] font-medium bg-blue-500/10 hover:bg-blue-500/20 text-blue-600 rounded-full transition-all duration-200 flex items-center gap-2 whitespace-nowrap" + className="relative self-start px-2 sm:px-3 py-1 text-[11px] font-medium bg-blue-500/10 dark:bg-blue-400/10 hover:bg-blue-500/20 dark:hover:bg-blue-400/20 text-blue-600 dark:text-blue-400 rounded-full transition-all duration-200 flex items-center gap-2 whitespace-nowrap" > {isMarking ? ( ) : ( <> - - + + mark as read @@ -60,7 +60,7 @@ const NotificationItem = ({ notification }: Props) => { )}
-

+

{format( new Date(notification.createdAt), "MMM d, yyyy 'at' h:mm a" @@ -71,7 +71,7 @@ const NotificationItem = ({ notification }: Props) => {

-
+
); }; diff --git a/src/app/(protected)/dashboard/[slug]/notifications/page.tsx b/src/app/(protected)/dashboard/[slug]/notifications/page.tsx index e70a933..4eea2ba 100644 --- a/src/app/(protected)/dashboard/[slug]/notifications/page.tsx +++ b/src/app/(protected)/dashboard/[slug]/notifications/page.tsx @@ -26,17 +26,17 @@ export default function NotificationsPage() { }); return ( -
+
- + Your API key must start with 'sk-' or 'sk-proj-' followed by characters - + )} /> @@ -147,7 +149,7 @@ export function OpenAISettings() { @@ -157,7 +159,7 @@ export function OpenAISettings() { variant="destructive" onClick={handleDeleteKey} disabled={isLoading} - className="sm:w-auto" + className="sm:w-auto dark:bg-red-600 dark:hover:bg-red-700 dark:text-white" > Delete Key diff --git a/src/app/(protected)/dashboard/[slug]/settings/page.tsx b/src/app/(protected)/dashboard/[slug]/settings/page.tsx index dcb3d1a..0df06eb 100644 --- a/src/app/(protected)/dashboard/[slug]/settings/page.tsx +++ b/src/app/(protected)/dashboard/[slug]/settings/page.tsx @@ -10,28 +10,28 @@ type Props = {} const Page = (props: Props) => { return (
-
+
-
-

Settings

+
+

Settings

-

Subscription

-

Manage your account settings and preferences.

+

Subscription

+

Manage your account settings and preferences.

-
-
+
-

OpenAI Integration

-
+

OpenAI Integration

+
@@ -40,7 +40,7 @@ const Page = (props: Props) => {
-

Danger Zone

+

Danger Zone

diff --git a/src/app/(protected)/dashboard/loading.tsx b/src/app/(protected)/dashboard/loading.tsx index 9fe5e6c..7eecb8a 100644 --- a/src/app/(protected)/dashboard/loading.tsx +++ b/src/app/(protected)/dashboard/loading.tsx @@ -19,8 +19,8 @@ const Loading = (props: Props) => {
{[...Array(6)].map((_, i) => (
-
-
+
+
))}
@@ -40,13 +40,13 @@ const Loading = (props: Props) => {
-
-
+
+
-
-
+
+
@@ -54,13 +54,13 @@ const Loading = (props: Props) => {
{/* Analytics Cards */} {[...Array(3)].map((_, i) => ( -
+
-
-
+
+
-
-
+
+
))}
@@ -69,30 +69,30 @@ const Loading = (props: Props) => {
{/* Chart Areas */} {[...Array(2)].map((_, i) => ( -
+
-
-
+
+
-
+
))}
{/* Skeleton for Recent Activity */} -
+
-
-
+
+
{[...Array(4)].map((_, i) => (
-
+
-
-
+
+
-
+
))}
diff --git a/src/app/globals.css b/src/app/globals.css index fec61ce..b6c6618 100644 --- a/src/app/globals.css +++ b/src/app/globals.css @@ -144,7 +144,7 @@ --destructive-foreground: 0 0% 98%; --border: 240 5.9% 90%; --input: 240 5.9% 90%; - --ring: 240 10% 3.9%; + --ring: 240 5.9% 10%; --radius: 0.5rem; --chart-1: 12 76% 61%; --chart-2: 173 58% 39%; diff --git a/src/app/layout.tsx b/src/app/layout.tsx index c5d39e8..865da83 100644 --- a/src/app/layout.tsx +++ b/src/app/layout.tsx @@ -2,7 +2,7 @@ import type { Metadata } from "next"; import { Plus_Jakarta_Sans } from "next/font/google"; import "./globals.css"; import { ClerkProvider } from '@clerk/nextjs' -import { ThemeProvider } from "@/providers/theme-provider"; +import { ThemeProvider } from '@/contexts/theme-context'; import { Toaster } from "sonner"; import ReactQueryProvider from "@/providers/react-query-provider"; import ReduxProvider from "@/providers/redux-provider"; @@ -54,7 +54,7 @@ export const viewport = { export default function RootLayout({ children, }: { - children: React.ReactNode; + children: React.ReactNode }) { return ( diff --git a/src/components/global/FAQ/faq-section.tsx b/src/components/global/FAQ/faq-section.tsx index 4c9092e..81e33aa 100644 --- a/src/components/global/FAQ/faq-section.tsx +++ b/src/components/global/FAQ/faq-section.tsx @@ -16,35 +16,55 @@ export const FAQSection = () => { className="border-0 border-b border-gray-200 [&[data-state=open]]:border-b-0" > - What are the six steps of a product launch plan? + Is this against Instagram's terms of service? - - 1. List out the facts – Gather your team and agree upon logistics such as launch date, product type, key deliverables, and more.

- 2. Understand the big picture – Jot down overall objectives on your product launch strategy template.

- 3. Create internal awareness – Ensure your team is on the same page with launch details. Delegate action steps to prepare for the big day.

- 4. Generate external buzz – Design an outreach plan involving partners, the press, and other sources.

- 5. Build market awareness – Expand your presence in the market as your product gains momentum.

- 6. Respond to feedback – Evaluate key metrics and keep iterating. + + No, our platform works within Instagram's API guidelines. We don't use any unauthorized methods of automation that could put your account at risk. - What should a product launch include? + Do I need an Instagram Business accont? - -

Using product launch templates can help you keep all the specifics straight during this exciting time. A product launch plan example typically includes:

-

The product itself – Understand your audience, divide tasks among your team, and ensure your production pipeline and delivery processes run smoothly before the launch date.

-

The go-to-market strategy – Prep your sales team, design marketing activities, clarify your messaging, and hash it out with collaborators as you approach the big day.

+ + Yes, our platform requires an Instagram Business or Creator account to access the necessary API features for automation. - How do you introduce a product launch? + Will people know the response are automated? - - Clarifying your selling point is essential in introducing your product to the market. Bring your team together and jot down ideas on a new product launch template. Work toward a consistent message that will align every department and help you achieve your shared goals. + + Our AI powered responses are designed to mimic human-like responses, making it seem as if the responses are coming from a human. + + + + + + How much time will I save? + + + Most users report saving 15-20 hours per week on engagement tasks, allowing them to focus on creating quality content instead + + + + + + Can I customize the automated responses? + + + Absolutely! You have full control ovet all automated messages and can create different response templates for various scenerios. + + + + + + Is there any limits on the number of automated responses? + + + Different plans have different limits. Please check your plan details for more information. diff --git a/src/components/global/announcement-banner.tsx b/src/components/global/announcement-banner.tsx index dec1e12..8d00490 100644 --- a/src/components/global/announcement-banner.tsx +++ b/src/components/global/announcement-banner.tsx @@ -33,7 +33,7 @@ export const AnnouncementBanner = () => { if (!isVisible) return null; return ( -
+
)} diff --git a/src/components/global/automations/post/index.tsx b/src/components/global/automations/post/index.tsx index 2cda9cc..17c6e37 100644 --- a/src/components/global/automations/post/index.tsx +++ b/src/components/global/automations/post/index.tsx @@ -20,11 +20,11 @@ const PostButton = ({ id }: Props) => { return ( {data?.status === 200 && data?.data?.data?.length > 0 ? ( -
+
{data?.data?.data?.map((post: InstagramPostProps) => (
onSelectPost({ @@ -39,11 +39,17 @@ const PostButton = ({ id }: Props) => {
) : (
@@ -51,38 +57,37 @@ const PostButton = ({ id }: Props) => { fill src={post.media_url} alt={post.caption || "Instagram post"} - className="object-cover transition-all duration-200 group-hover:scale-105" + className="object-cover transition-transform duration-300 group-hover:scale-105" sizes="(max-width: 640px) 50vw, 33vw" priority onError={(e) => { - // Handle image load error by using a proxy or fallback const img = e.target as HTMLImageElement; if (img.src === post.media_url) { - // Try using a proxy service or direct CDN URL img.src = `/api/instagram-proxy?url=${encodeURIComponent(post.media_url)}`; } }} /> {post.media_type === "CAROUSEL_ALBUM" && ( - + )}
)} {posts.find((p) => p.postid === post.id) && ( -
+
)} +
))}
diff --git a/src/components/global/automations/post/node.tsx b/src/components/global/automations/post/node.tsx index 262172f..5e52cbd 100644 --- a/src/components/global/automations/post/node.tsx +++ b/src/components/global/automations/post/node.tsx @@ -15,42 +15,55 @@ const PostNode = ({ id }: Props) => { return ( data?.data && data.data.posts.length > 0 && ( -
+
- + - +
-
- -

If they comment on...

+
+ +

If they comment on...

-
-
- -

These posts

+
+
+ +

These posts

-
+
{data.data.posts.map((post) => (
{post.mediaType === "VIDEO" ? (
diff --git a/src/components/global/automations/then/node.tsx b/src/components/global/automations/then/node.tsx index d7b5633..08fa3fa 100644 --- a/src/components/global/automations/then/node.tsx +++ b/src/components/global/automations/then/node.tsx @@ -19,20 +19,20 @@ const ThenNode = ({ id }: Props) => { return !data?.data?.listener ? ( <> ) : ( -
+
- + - +
- Then... + Then...
-
+
{data.data.listener.listener === "MESSAGE" ? ( @@ -41,7 +41,7 @@ const ThenNode = ({ id }: Props) => { ) : ( )} -

+

{data.data.listener.listener === "MESSAGE" ? "Send the user a message." : data.data.listener.listener === "SMARTAI" @@ -53,14 +53,14 @@ const ThenNode = ({ id }: Props) => { {/* Display prompt and comment reply for all listener types */}

{data.data.listener.prompt}

{data.data.listener.commentReply && ( -
-

+

+

Reply: {data.data.listener.commentReply}

@@ -70,11 +70,11 @@ const ThenNode = ({ id }: Props) => { {/* Display carousel template if available */} {data.data.listener.listener === "CAROUSEL" && data.data.carouselTemplates && data.data.carouselTemplates.length > 0 && (
-

Template Preview:

+

Template Preview:

{data.data.carouselTemplates[0]?.elements.map((element: any, index: number) => ( -
+
{element.imageUrl && ( -
+
{element.title { />
)} -

{element.title}

+

{element.title}

{element.subtitle && ( -

{element.subtitle}

+

{element.subtitle}

)} {element.buttons?.length > 0 && (
@@ -94,7 +94,7 @@ const ThenNode = ({ id }: Props) => {
{ className={cn( "text-left p-4 rounded-xl flex flex-col gap-y-2 transition-all duration-200", Listener === listener.type - ? "bg-transparent text-black shadow-lg ring-1 ring-primary/30 ring-offset-1 ring-offset-white border border-primary/20" - : "bg-gray-50 hover:bg-gray-100", + ? "bg-transparent text-black dark:text-white shadow-lg ring-1 ring-primary/30 ring-offset-1 ring-offset-white dark:ring-offset-gray-800 border border-primary/20" + : "bg-gray-50 hover:bg-gray-100 dark:bg-gray-900 dark:hover:bg-gray-600", listener.type === "SMARTAI" && !isPro && "opacity-50 cursor-not-allowed", listener.type === "SMARTAI" && "border border-blue-200 shadow-[0_4px_20px_rgba(59,130,246,0.25)]", - listener.type === "CAROUSEL" && "border border-blue-200 shadow-[0_4px_20px_rgba(59,130,246,0.25)]" + listener.type === "CAROUSEL" && "border border-white" )} >
@@ -60,9 +60,9 @@ const ThenAction = ({ id }: Props) => { {Listener === "CAROUSEL" && hasCarouselTemplates && (
{automationData?.data?.carouselTemplates[0]?.elements.map((element: any, index: number) => ( -
+
{element.imageUrl && ( -
+
{element.title { )}

{element.title}

{element.subtitle && ( -

{element.subtitle}

+

{element.subtitle}

)} {element.buttons?.length > 0 && (
@@ -102,14 +102,14 @@ const ThenAction = ({ id }: Props) => { placeholder={Listener === "SMARTAI" ? "Add a prompt that your smart AI can use..." : "Add a message you want to send to your customers"} {...register("prompt")} className={cn( - "min-h-[100px] bg-gray-50 border-gray-200 focus:border-primary focus:ring-primary", + "min-h-[100px] bg-gray-50 dark:bg-gray-700 border-gray-200 dark:border-gray-600 focus:border-primary focus:ring-primary dark:text-white", Listener === "SMARTAI" && "border border-blue-200 shadow-[0_4px_20px_rgba(59,130,246,0.25)]" )} /> diff --git a/src/components/global/automations/trigger/keyword-item-active.tsx b/src/components/global/automations/trigger/keyword-item-active.tsx index e86afb9..9642b58 100644 --- a/src/components/global/automations/trigger/keyword-item-active.tsx +++ b/src/components/global/automations/trigger/keyword-item-active.tsx @@ -31,7 +31,7 @@ const KeywordItemActive = ({ automationId, word }: KeywordItemProps) => { return (
{

{currentValue}

)}
@@ -47,11 +47,11 @@ const AutomationsBreadCrumb = ({ id }: Props) => {
-

+

All changes auto-saved

-
+
diff --git a/src/components/global/bread-crumbs/main-bread-crumb/index.tsx b/src/components/global/bread-crumbs/main-bread-crumb/index.tsx index 2c4887d..2af11a7 100644 --- a/src/components/global/bread-crumbs/main-bread-crumb/index.tsx +++ b/src/components/global/bread-crumbs/main-bread-crumb/index.tsx @@ -14,23 +14,23 @@ const MainBreadCrumb = ({ page }: Props) => { return (
-
+
{PAGE_ICON[page.toUpperCase()] || }
-

+

{isDashboard ? 'Dashboard' : page.charAt(0).toUpperCase() + page.slice(1)}

- + Auctorn {!isDashboard && ( - + Dashboard @@ -38,7 +38,7 @@ const MainBreadCrumb = ({ page }: Props) => { {isDashboard ? 'Dashboard' : page.charAt(0).toUpperCase() + page.slice(1)} diff --git a/src/components/global/carouselTemplateForm/index.tsx b/src/components/global/carouselTemplateForm/index.tsx index 7f4beed..f781eca 100644 --- a/src/components/global/carouselTemplateForm/index.tsx +++ b/src/components/global/carouselTemplateForm/index.tsx @@ -141,8 +141,8 @@ export default function CarouselTemplateForm({ automationId, onSuccess }: Props) return (
-

Create Carousel Template

-
@@ -302,7 +302,7 @@ export default function CarouselTemplateForm({ automationId, onSuccess }: Props) diff --git a/src/components/global/create-automation/index.tsx b/src/components/global/create-automation/index.tsx index a0ef2e0..79b9f27 100644 --- a/src/components/global/create-automation/index.tsx +++ b/src/components/global/create-automation/index.tsx @@ -16,7 +16,7 @@ const CreateAutomation = (props: Props) => { return (
-

-

{subLabel}

- {description &&
{description}
} +

+

{subLabel}

+ {description &&
{description}
}

diff --git a/src/components/global/double-gradient-card/index.tsx b/src/components/global/double-gradient-card/index.tsx index 8df5394..8be7482 100644 --- a/src/components/global/double-gradient-card/index.tsx +++ b/src/components/global/double-gradient-card/index.tsx @@ -11,22 +11,22 @@ type Props = { const DoubleGradientCard = ({ description, label, subLabel, isPopular }: Props) => { return ( -
+
{isPopular && ( - POPULAR + POPULAR )} -

{label}

-

{subLabel}

+

{label}

+

{subLabel}

-

{description}

-
-
-
+
+
) } diff --git a/src/components/global/drawer/index.tsx b/src/components/global/drawer/index.tsx index 3048cb3..2a26790 100644 --- a/src/components/global/drawer/index.tsx +++ b/src/components/global/drawer/index.tsx @@ -22,22 +22,22 @@ const Drawer = ({ isOpen, onClose, children }: Props) => { >
e.stopPropagation()} > -
- {children} -
- +
+ {children} +
+
); diff --git a/src/components/global/footer.tsx b/src/components/global/footer.tsx index 0592c9d..3c5fe4f 100644 --- a/src/components/global/footer.tsx +++ b/src/components/global/footer.tsx @@ -1,9 +1,13 @@ -import Link from "next/link"; +'use client'; +import Link from "next/link"; +import { useTheme } from "@/contexts/theme-context"; export default function Footer() { + const { theme, toggleTheme } = useTheme(); + return ( -

Leverage AI-powered automation to optimize your marketing campaigns, boost engagement rates, and maximize your return on investment.

- + @@ -461,7 +461,7 @@ export default function LandingPage() { Automatically respond to every message

Automatically engage with every story mention, comment, and DM. Turn social interactions into meaningful conversations that drive sales.

- + @@ -480,7 +480,7 @@ export default function LandingPage() { Auctorn AI: A Smarter Way to Chat

Level up the experiences your followers already love with the new Auctorn AI. Create more engaging and personalized conversations.

- + diff --git a/src/app/(landingpage)/privacy_policy/page.tsx b/src/app/(landingpage)/privacy_policy/page.tsx index 7b27e81..474e87d 100644 --- a/src/app/(landingpage)/privacy_policy/page.tsx +++ b/src/app/(landingpage)/privacy_policy/page.tsx @@ -5,35 +5,35 @@ import LandingNav from "@/components/global/landing-nav"; export default function TOCPage() { return ( -
+
{/* Sidebar Navigation */} -
+
@@ -44,16 +44,16 @@ export default function TOCPage() {
{/* Header */}
-

EFFECTIVE DATE: FEBRUARY 8, 2024

-

PREVIOUS VERSION

-

+

EFFECTIVE DATE: FEBRUARY 8, 2024

+

PREVIOUS VERSION

+

Auctorn, inc. - Terms of Service

{/* Content */} -
-

+

+

These Terms of Service constitute a legally binding agreement between you and Auctorn, Inc. (together with its subsidiaries and affiliates, "Austorn, Inc.", "Auctorn", "we," "our" or "us") governing your use of our products, services, @@ -61,7 +61,7 @@ export default function TOCPage() { "Site" and collectively with the foregoing, the "Services").

-

+

YOU ACKNOWLEDGE AND AGREE THAT, BY CLICKING ON THE "I AGREE" OR SIMILAR BUTTON, REGISTERING FOR AN ACCOUNT, DOWNLOADING THE APP OR ANY APP UPGRADES, USING THE APP ON YOUR MOBILE DEVICE, VISITING THE SITE, ACCESSING @@ -69,62 +69,61 @@ export default function TOCPage() { FACILITATED BY THE SERVICES (ANY SUCH PARTICIPANT, A "CONVERSATION PARTICIPANT"), YOU ARE INDICATING THAT YOU HAVE READ, UNDERSTAND AND AGREE TO BE BOUND BY THESE TERMS OF SERVICE, WHETHER OR NOT YOU HAVE - REGISTERED VIA THE SITE OR THE APP. IF YOU DO NOT AGREE TO THESE TERMS OF - SERVICE, THEN YOU HAVE NO RIGHT TO ACCESS OR USE THE SERVICES. + REGISTERED VIA THE SITE OR THE APP.

-

Privacy Policy

+

Privacy Policy

-

1. Introduction

-

+

1. Introduction

+

At Auctorn, we respect your privacy. This Privacy Policy explains how we collect, use, and protect your personal information when you use our service. By using Auctorn, you agree to the terms described here.

-

2. Data We Collect

-

Auctorn collects minimal data, including:

-
    +

    2. Data We Collect

    +

    Auctorn collects minimal data, including:

    +
    • Instagram Profile Information: Username, profile picture, and public details.
    • Usage Data: Interaction data, device/browser data.
    • Third-Party Integrations: Information shared with third-party services like Instagram API.
    -

    3. How We Use Your Data

    -

    We use your data to:

    -
      +

      3. How We Use Your Data

      +

      We use your data to:

      +
      • Provide and improve Auctorn services.
      • Enhance performance and fix issues.
      • Communicate updates and support.
      -

      4. Data Sharing

      -

      Auctorn does not sell or trade your data, but we may share data with:

      -
        +

        4. Data Sharing

        +

        Auctorn does not sell or trade your data, but we may share data with:

        +
        • Service Providers: Third-party companies that help us run Auctorn.
        • Legal Obligations: If required by law.
        -

        5. Data Security

        -

        +

        5. Data Security

        +

        We use standard security measures to protect your data, but no method is completely secure. We strive to protect your information but cannot guarantee complete security.

        -

        6. Your Rights

        -

        You have the right to:

        -
          +

          6. Your Rights

          +

          You have the right to:

          +
          • Access and update your personal data.
          • Request the deletion of your data.
          • Opt-out of marketing communications.
          -

          7. Cookies and Tracking

          -

          +

          7. Cookies and Tracking

          +

          Auctorn uses cookies for a better user experience. You can manage cookies through your browser settings, but disabling them may affect functionality.

          -

          8. Contact Us

          -

          If you have questions or concerns about this Privacy Policy, contact us at:

          -

          Email: atharvajoshi2520@gmail.com

          -

          Developer Website: devatharvajoshi.vercel.app

          +

          8. Contact Us

          +

          If you have questions or concerns about this Privacy Policy, contact us at:

          +

          Email: atharvajoshi2520@gmail.com

          +

          Developer Website: devatharvajoshi.vercel.app

diff --git a/src/components/global/footer.tsx b/src/components/global/footer.tsx index 3c5fe4f..4902017 100644 --- a/src/components/global/footer.tsx +++ b/src/components/global/footer.tsx @@ -18,7 +18,7 @@ export default function Footer() {

Transform more conversations into sales, leads,
and conversions today

- + diff --git a/src/components/global/landing-nav.tsx b/src/components/global/landing-nav.tsx index 73792fa..b7fae63 100644 --- a/src/components/global/landing-nav.tsx +++ b/src/components/global/landing-nav.tsx @@ -2,11 +2,13 @@ import React, { useState } from "react"; import Link from "next/link"; import { Inter } from "next/font/google"; import Image from "next/image"; +import { useTheme } from "@/contexts/theme-context"; const inter = Inter({ subsets: ["latin"] }); const LandingNav = () => { const [isMenuOpen, setIsMenuOpen] = useState(false); + const { theme, toggleTheme } = useTheme(); const toggleMenu = () => { setIsMenuOpen(!isMenuOpen); @@ -56,39 +58,76 @@ const LandingNav = () => {
- {/* Hamburger Menu Button */} - + + + + + + + +
{/* CTA Buttons */} -
+
@@ -109,6 +148,41 @@ const LandingNav = () => { GET STARTED +
@@ -165,6 +239,7 @@ const LandingNav = () => { GET STARTED +
From 2731dec4c7377485c5e39bfdbfee9941260c58f0 Mon Sep 17 00:00:00 2001 From: atharva20-coder Date: Mon, 17 Mar 2025 19:32:04 +0530 Subject: [PATCH 03/14] Added Dark theme --- bun.lockb | Bin 340501 -> 340501 bytes package.json | 2 +- src/app/(landingpage)/page.tsx | 13 +- .../global/automations/post/index.tsx | 2 +- .../global/automations/then/then-action.tsx | 2 +- src/components/ui/avatarGrid.tsx | 221 ++++++++++++++++++ src/components/ui/geometricShape.tsx | 40 ++++ src/components/ui/sonner.tsx | 8 +- src/hooks/use-confirm.tsx | 10 +- 9 files changed, 274 insertions(+), 24 deletions(-) create mode 100644 src/components/ui/avatarGrid.tsx create mode 100644 src/components/ui/geometricShape.tsx diff --git a/bun.lockb b/bun.lockb index 414fe3ba774594367436b91151dd28e33fbdffc9..dca0617800639aa1c2810c7903956194c1f7ee65 100755 GIT binary patch delta 153 zcmV;K0A~M{^4a%Pe)A{+dZrfrRhaAc1m5u&Ur#u}*fn zlSIligZR3)___i0CqRC22uvY_2eVyYKw+VVe{!$;SoU>6E=bIhUkh~L{OlyW7p*cS zNpdWjYJI)z>%`z6NrPN(qfE$aHUIX(uGNPv;{mrV;{uOf0W^obK?AqFK?H-O0W`Nk H<^SF)Nd>F$jbBy0`ec0re+9n6!61HG-3qzXfA*4)H@GEDCvaCKP6Vkda;XZudg9 z4+vC5w$gG{uun~HGW0AHZK-W6z}hS~>!2#pzmR3|hb`j)w=LrWk6r;XhrK}qx4l6G VgQS

AUCTORN

-

+

SMART MOVES, VIRAL WINS: AUTOMATE & THRIVE

@@ -41,17 +41,6 @@ export default function LandingPage() {

- {/* Mobile Image */} -
- Instagram Story Interface -
{/* Right Column - Image with 3D Hover Effect */}
{ diff --git a/src/components/global/automations/then/then-action.tsx b/src/components/global/automations/then/then-action.tsx index da10dd9..91cfa93 100644 --- a/src/components/global/automations/then/then-action.tsx +++ b/src/components/global/automations/then/then-action.tsx @@ -112,7 +112,7 @@ const ThenAction = ({ id }: Props) => { className="bg-gray-50 dark:bg-gray-700 border-gray-200 dark:border-gray-600 focus:border-primary focus:ring-primary text-black dark:text-white" /> From 3a547fd331de25a73e33784559258c168e04c1ee Mon Sep 17 00:00:00 2001 From: atharva20-coder Date: Tue, 18 Mar 2025 15:53:59 +0530 Subject: [PATCH 04/14] Redesigned hero section --- public/images/placeholder.svg | 1 + src/app/(landingpage)/page.tsx | 448 +++++++++++++++++++++------ src/app/globals.css | 2 +- src/components/ui/avatarGrid.tsx | 221 ------------- src/components/ui/geometricShape.tsx | 40 --- tailwind.config.ts | 39 ++- 6 files changed, 384 insertions(+), 367 deletions(-) create mode 100644 public/images/placeholder.svg delete mode 100644 src/components/ui/avatarGrid.tsx delete mode 100644 src/components/ui/geometricShape.tsx diff --git a/public/images/placeholder.svg b/public/images/placeholder.svg new file mode 100644 index 0000000..e763910 --- /dev/null +++ b/public/images/placeholder.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/app/(landingpage)/page.tsx b/src/app/(landingpage)/page.tsx index b3cd2b3..f5501bf 100644 --- a/src/app/(landingpage)/page.tsx +++ b/src/app/(landingpage)/page.tsx @@ -1,4 +1,4 @@ -"use client" +"use client"; import Image from "next/image"; import Link from "next/link"; @@ -7,117 +7,282 @@ import { useScrollReveal } from "@/hooks/use-scroll-reveal"; import Footer from "@/components/global/footer"; import { FAQSection } from "@/components/global/FAQ/faq-section"; import { AnnouncementBanner } from "@/components/global/announcement-banner"; - +import { cn } from '@/lib/utils'; +import React, { useState, useEffect, useMemo } from 'react'; export default function LandingPage() { const heroRef = useScrollReveal(); const featuresRef = useScrollReveal(); const leadGenRef = useScrollReveal(); + const AVATAR_IMAGES = useMemo(() => [ + 'https://avatars.githubusercontent.com/u/6154722', //microsoft + 'https://avatars.githubusercontent.com/u/1500684', // avatar + 'https://avatars.githubusercontent.com/u/810438', // avatar + 'https://avatars.githubusercontent.com/u/6820?v=4', // avatar + 'https://avatars.githubusercontent.com/u/1714764', // avatar + 'https://avatars.githubusercontent.com/u/263385', // + 'https://avatars.githubusercontent.com/u/98681', + 'https://avatars.githubusercontent.com/u/13041', + 'https://avatars.githubusercontent.com/u/17126?v=4', + 'https://avatars.githubusercontent.com/u/61755?v=4' + ], []); + + const GEOMETRIC_PATTERNS = useMemo(() => [ + { type: 'circle', color: '#00BBEF' }, + { type: 'square', color: '#5E5EDD' }, + { type: 'dots', color: '#00BBEF' }, + { type: 'circle', color: '#FFDD00' }, + { type: 'lines', color: '#00BBEF' }, + { type: 'square', color: '#2B7CD7' }, + { type: 'dots', color: '#5E5EDD' }, + { type: 'circle', color: '#FFFFFF' }, + { type: 'lines', color: '#FFDD00' } + ], []); + + const TOTAL_CELLS = 16; + const GRID_POSITIONS = useMemo(() => + Array.from({ length: TOTAL_CELLS }, (_, i) => ({ + row: Math.floor(i / 4), + col: i % 4 + })), []); + + type GridItem = { + id: string; + type: 'avatar' | 'shape'; + imageUrl?: string; + shapeType?: 'circle' | 'square' | 'dots' | 'lines'; + color?: string; + row: number; + col: number; + visible: boolean; + }; + + const [gridItems, setGridItems] = useState([]); + + useEffect(() => { + const initialItems: GridItem[] = []; + + const avatarPositions = [...GRID_POSITIONS] + .sort(() => Math.random() - 0.5) + .slice(0, 7); + + avatarPositions.forEach((pos, index) => { + initialItems.push({ + id: `avatar-${index}`, + type: 'avatar', + imageUrl: AVATAR_IMAGES[index % AVATAR_IMAGES.length], + row: pos.row, + col: pos.col, + visible: true + }); + }); + + const usedPositions = new Set(avatarPositions.map(p => `${p.row}-${p.col}`)); + let shapeIndex = 0; + + GRID_POSITIONS.forEach(pos => { + const posKey = `${pos.row}-${pos.col}`; + if (!usedPositions.has(posKey)) { + const pattern = GEOMETRIC_PATTERNS[shapeIndex % GEOMETRIC_PATTERNS.length]; + initialItems.push({ + id: `shape-${shapeIndex}`, + type: 'shape', + shapeType: pattern.type as any, + color: pattern.color, + row: pos.row, + col: pos.col, + visible: true + }); + shapeIndex++; + } + }); + + setGridItems(initialItems); + }, [AVATAR_IMAGES, GEOMETRIC_PATTERNS, GRID_POSITIONS]); + + useEffect(() => { + const animateGrid = () => { + setGridItems(currentItems => { + const newItems = [...currentItems]; + const avatarIndices = newItems + .map((item, index) => item.type === 'avatar' ? index : -1) + .filter(index => index !== -1); + + const shapeIndices = newItems + .map((item, index) => item.type === 'shape' ? index : -1) + .filter(index => index !== -1); + + if (avatarIndices.length > 0 && shapeIndices.length > 0) { + const randomAvatarIdx = avatarIndices[Math.floor(Math.random() * avatarIndices.length)]; + const randomShapeIdx = shapeIndices[Math.floor(Math.random() * shapeIndices.length)]; + + const avatarPos = { row: newItems[randomAvatarIdx].row, col: newItems[randomAvatarIdx].col }; + newItems[randomAvatarIdx].row = newItems[randomShapeIdx].row; + newItems[randomAvatarIdx].col = newItems[randomShapeIdx].col; + newItems[randomShapeIdx].row = avatarPos.row; + newItems[randomShapeIdx].col = avatarPos.col; + + newItems[randomAvatarIdx].visible = false; + newItems[randomShapeIdx].visible = false; + + setTimeout(() => { + setGridItems(items => items.map((item, idx) => + idx === randomAvatarIdx || idx === randomShapeIdx + ? { ...item, visible: true } + : item + )); + }, 400); + } + + return newItems; + }); + }; + + const initialTimeout = setTimeout(() => { + animateGrid(); + const interval = setInterval(animateGrid, 3000); + return () => clearInterval(interval); + }, 1500); + + return () => clearTimeout(initialTimeout); + }, []); + + const GeometricShape = ({ + type, + color, + className, + animationDelay = '0s' + }: { + type: 'circle' | 'square' | 'dots' | 'lines'; + color: string; + className?: string; + animationDelay?: string; + }) => { + const baseClasses = cn( + 'opacity-0 transform animate-shape-appear', + { + 'rounded-full': type === 'circle', + 'dot-pattern': type === 'dots', + 'line-pattern': type === 'lines', + }, + className + ); + + const style = { + animationDelay, + backgroundColor: type === 'circle' || type === 'square' ? color : 'transparent', + color: type === 'dots' || type === 'lines' ? color : 'transparent', + border: type === 'lines' ? `2px dashed ${color}` : 'none', // Add border for lines + transition: 'transform 0.8s cubic-bezier(0.34, 1.56, 0.64, 1), opacity 0.8s ease-out' + }; + + return
; + }; + + return (
{/* Hero Section */} -
-
+
+

AUCTORN

- SMART MOVES, VIRAL WINS: AUTOMATE & THRIVE + SMART MOVES, VIRAL WINS: AUTOMATE & THRIVE

- Seamlessly automate your Instagram engagement, grow your audience, and convert followers into customers with intelligent workflows designed for creators, influencers, and businesses. + Seamlessly automate your Instagram engagement, grow your audience, and convert followers into customers with intelligent workflows designed for creators, influencers, and businesses.

- - - - - - - Try Auctorn For Free + + + + + - + Try Auctorn For Free + +
- {/* Right Column - Image with 3D Hover Effect */} -
{ - const bounds = e.currentTarget.getBoundingClientRect(); - const mouseX = e.clientX; - const mouseY = e.clientY; - const leftX = mouseX - bounds.x; - const topY = mouseY - bounds.y; - const center = { - x: leftX - bounds.width / 2, - y: topY - bounds.height / 2 - }; - const distance = Math.sqrt(center.x ** 2 + center.y ** 2); - - const imageEl = e.currentTarget.querySelector('.hover-image') as HTMLElement; - - if (imageEl) { - imageEl.style.transform = ` - rotate3d( - ${center.y / 100}, - ${-center.x / 100}, - 0, - ${Math.log(distance) * 2}deg - ) - `; - } - }} - onTouchMove={(e) => { - const touch = e.touches[0]; - const bounds = e.currentTarget.getBoundingClientRect(); - const touchX = touch.clientX; - const touchY = touch.clientY; - const leftX = touchX - bounds.x; - const topY = touchY - bounds.y; - const center = { - x: leftX - bounds.width / 2, - y: topY - bounds.height / 2 - }; - const distance = Math.sqrt(center.x ** 2 + center.y ** 2); - - const imageEl = e.currentTarget.querySelector('.hover-image') as HTMLElement; - - if (imageEl) { - imageEl.style.transform = ` - rotate3d( - ${center.y / 100}, - ${-center.x / 100}, - 0, - ${Math.log(distance) * 2}deg - ) - `; - } - }} - onMouseLeave={(e) => { - const imageEl = e.currentTarget.querySelector('.hover-image') as HTMLElement; - if (imageEl) { - imageEl.style.transform = ''; - } - }} - onTouchEnd={(e) => { - const imageEl = e.currentTarget.querySelector('.hover-image') as HTMLElement; - if (imageEl) { - imageEl.style.transform = ''; - } - }} - > -
- Instagram Post Illustration +
+ + + + +
+
+
+ {gridItems.map((item, index) => { + const itemStyle = { + gridRow: item.row + 1, + gridColumn: item.col + 1, + animationDelay: `${index * 0.1}s` + }; + + const itemClasses = cn( + 'avatar-item', + { + 'avatar-appear': item.visible, + 'avatar-disappear': !item.visible + } + ); + + if (item.type === 'avatar') { + return ( +
+ Contributor avatar +
+ ); + } else { + return ( + + ); + } + })} +
@@ -143,9 +308,9 @@ export default function LandingPage() { Try Dashboard - +
-
{ const bounds = e.currentTarget.getBoundingClientRect(); @@ -158,9 +323,9 @@ export default function LandingPage() { y: topY - bounds.height / 2 }; const distance = Math.sqrt(center.x ** 2 + center.y ** 2); - + const imageEl = e.currentTarget.querySelector('.hover-image') as HTMLElement; - + if (imageEl) { imageEl.style.transform = ` rotate3d( @@ -184,9 +349,9 @@ export default function LandingPage() { y: topY - bounds.height / 2 }; const distance = Math.sqrt(center.x ** 2 + center.y ** 2); - + const imageEl = e.currentTarget.querySelector('.hover-image') as HTMLElement; - + if (imageEl) { imageEl.style.transform = ` rotate3d( @@ -232,9 +397,9 @@ export default function LandingPage() { Social Technologies

- Social technologies that help influencers and buisnesses grow, build community and monetize their content. + Social technologies that help influencers and businesses grow, build community and monetize their content.

- +
Instagram @@ -491,8 +656,7 @@ export default function LandingPage() { {/* Testimonial Section */} - - {/* IG-Story Image Section + {/* IG-Story Image Section
@@ -511,12 +675,94 @@ export default function LandingPage() {
*/} - {/* FAQ Section */} {/* FOOTER Section */}
+ +
); -} \ No newline at end of file +} diff --git a/src/app/globals.css b/src/app/globals.css index b6c6618..4473a5b 100644 --- a/src/app/globals.css +++ b/src/app/globals.css @@ -302,4 +302,4 @@ .social-icon:hover img { transform: scale(1.1); -} \ No newline at end of file +} diff --git a/src/components/ui/avatarGrid.tsx b/src/components/ui/avatarGrid.tsx deleted file mode 100644 index f71baac..0000000 --- a/src/components/ui/avatarGrid.tsx +++ /dev/null @@ -1,221 +0,0 @@ - -import React, { useState, useEffect } from 'react'; -import GeometricShape from './geometricShape'; -import { cn } from '@/lib/utils'; -import Image from 'next/image'; - -// Sample avatar images for the grid -const AVATAR_IMAGES = [ - '/lovable-uploads/a8565011-9213-4b8f-a30a-76cb2f1a6bf1.png', // Using the uploaded image - 'https://avatars.githubusercontent.com/u/6154722', - 'https://avatars.githubusercontent.com/u/1500684', - 'https://avatars.githubusercontent.com/u/810438', - 'https://avatars.githubusercontent.com/u/6820?v=4', - 'https://avatars.githubusercontent.com/u/1714764', - 'https://avatars.githubusercontent.com/u/263385', - 'https://avatars.githubusercontent.com/u/98681', - 'https://avatars.githubusercontent.com/u/13041', - 'https://avatars.githubusercontent.com/u/17126?v=4', - 'https://avatars.githubusercontent.com/u/61755?v=4' -]; - -// Define the geometric shapes to use in the grid -const GEOMETRIC_PATTERNS = [ - { type: 'circle', color: '#00BBEF' }, // Cyan - { type: 'square', color: '#5E5EDD' }, // Purple - { type: 'dots', color: '#00BBEF' }, // Cyan dots - { type: 'circle', color: '#FFDD00' }, // Yellow - { type: 'lines', color: '#00BBEF' }, // Cyan lines - { type: 'square', color: '#2B7CD7' }, // Blue - { type: 'dots', color: '#5E5EDD' }, // Purple dots - { type: 'circle', color: '#FFFFFF' }, // White - { type: 'lines', color: '#FFDD00' } // Yellow lines -]; - -// Define the total number of cells in the grid (4x4) -const TOTAL_CELLS = 16; - -// Set up the initial grid positions -const GRID_POSITIONS = Array.from({ length: TOTAL_CELLS }, (_, i) => ({ - row: Math.floor(i / 4), - col: i % 4 -})); - -type GridItem = { - id: string; - type: 'avatar' | 'shape'; - row: number; - col: number; - visible: boolean; -} & ( - | { - type: 'avatar'; - imageUrl: string; - shapeType?: never; - color?: never; - } - | { - type: 'shape'; - imageUrl?: never; - shapeType: 'circle' | 'square' | 'dots' | 'lines'; - color: string; - } -); - -const AvatarGrid: React.FC = () => { - const [gridItems, setGridItems] = useState([]); - - // Initialize the grid with a mix of avatars and shapes - useEffect(() => { - const initialItems: GridItem[] = []; - - // Add some avatars at random positions - const avatarPositions = [...GRID_POSITIONS] - .sort(() => Math.random() - 0.5) - .slice(0, 7); // Use 7 avatar positions - - avatarPositions.forEach((pos, index) => { - initialItems.push({ - id: `avatar-${index}`, - type: 'avatar', - imageUrl: AVATAR_IMAGES[index % AVATAR_IMAGES.length], - row: pos.row, - col: pos.col, - visible: true - }); - }); - - // Fill remaining positions with shapes - const usedPositions = new Set(avatarPositions.map(p => `${p.row}-${p.col}`)); - let shapeIndex = 0; - - GRID_POSITIONS.forEach(pos => { - const posKey = `${pos.row}-${pos.col}`; - if (!usedPositions.has(posKey)) { - const pattern = GEOMETRIC_PATTERNS[shapeIndex % GEOMETRIC_PATTERNS.length]; - initialItems.push({ - id: `shape-${shapeIndex}`, - type: 'shape', - shapeType: pattern.type as any, - color: pattern.color, - row: pos.row, - col: pos.col, - visible: true - }); - shapeIndex++; - } - }); - - setGridItems(initialItems); - }, []); - - // Animate the grid every few seconds - useEffect(() => { - const animateGrid = () => { - // For simplicity, we'll just swap some avatars and shapes - setGridItems(currentItems => { - // Make a copy of current items - const newItems = [...currentItems]; - - // Choose a random avatar and shape - const avatarIndices = newItems - .map((item, index) => item.type === 'avatar' ? index : -1) - .filter(index => index !== -1); - - const shapeIndices = newItems - .map((item, index) => item.type === 'shape' ? index : -1) - .filter(index => index !== -1); - - if (avatarIndices.length > 0 && shapeIndices.length > 0) { - // Get random indices - const randomAvatarIdx = avatarIndices[Math.floor(Math.random() * avatarIndices.length)]; - const randomShapeIdx = shapeIndices[Math.floor(Math.random() * shapeIndices.length)]; - - // Swap positions - const avatarPos = { row: newItems[randomAvatarIdx].row, col: newItems[randomAvatarIdx].col }; - newItems[randomAvatarIdx].row = newItems[randomShapeIdx].row; - newItems[randomAvatarIdx].col = newItems[randomShapeIdx].col; - newItems[randomShapeIdx].row = avatarPos.row; - newItems[randomShapeIdx].col = avatarPos.col; - - // Set both to "disappear" temporarily - newItems[randomAvatarIdx].visible = false; - newItems[randomShapeIdx].visible = false; - - // After animation, make them visible again - setTimeout(() => { - setGridItems(items => items.map((item, idx) => - idx === randomAvatarIdx || idx === randomShapeIdx - ? { ...item, visible: true } - : item - )); - }, 400); - } - - return newItems; - }); - }; - - // Start with initial delay before first animation - const initialTimeout = setTimeout(() => { - animateGrid(); - - // Then set up interval for subsequent animations - const interval = setInterval(animateGrid, 3000); - return () => clearInterval(interval); - }, 1500); - - return () => clearTimeout(initialTimeout); - }, []); - - return ( -
- {gridItems.map((item, index) => { - const itemStyle = { - gridRow: item.row + 1, - gridColumn: item.col + 1, - animationDelay: `${index * 0.1}s` - }; - - const itemClasses = cn( - 'avatar-item', - { - 'avatar-appear': item.visible, - 'avatar-disappear': !item.visible - } - ); - - if (item.type === 'avatar') { - return ( -
- Contributor avatar -
- ); - } else { - return ( - - ); - } - })} -
- ); -}; - -export default AvatarGrid; \ No newline at end of file diff --git a/src/components/ui/geometricShape.tsx b/src/components/ui/geometricShape.tsx deleted file mode 100644 index 8f5536e..0000000 --- a/src/components/ui/geometricShape.tsx +++ /dev/null @@ -1,40 +0,0 @@ -import React from 'react'; -import { cn } from '@/lib/utils'; - -type ShapeType = 'circle' | 'square' | 'dots' | 'lines'; - -interface GeometricShapeProps { - type: ShapeType; - color: string; - className?: string; - animationDelay?: string; -} - -const GeometricShape: React.FC = ({ - type, - color, - className, - animationDelay = '0s' -}) => { - const baseClasses = cn( - 'opacity-0 transform', - 'animate-shape-appear', - { - 'rounded-full': type === 'circle', - 'dot-pattern': type === 'dots', - 'line-pattern': type === 'lines', - }, - className - ); - - const style = { - animationDelay, - backgroundColor: type === 'circle' || type === 'square' ? color : 'transparent', - color: type === 'dots' || type === 'lines' ? color : 'transparent', - transition: 'transform 0.8s cubic-bezier(0.34, 1.56, 0.64, 1), opacity 0.8s ease-out' - }; - - return
; -}; - -export default GeometricShape; \ No newline at end of file diff --git a/tailwind.config.ts b/tailwind.config.ts index 4aa5177..2ecf187 100644 --- a/tailwind.config.ts +++ b/tailwind.config.ts @@ -1,4 +1,4 @@ -import type { Config } from 'tailwindcss' +import type { Config } from 'tailwindcss'; const config: Config = { darkMode: 'class', @@ -102,13 +102,44 @@ const config: Config = { height: '0', }, }, + 'fade-in': { + '0%': { opacity: '0', transform: 'translateY(10px)' }, + '100%': { opacity: '1', transform: 'translateY(0)' }, + }, + 'fade-out': { + '0%': { opacity: '1', transform: 'translateY(0)' }, + '100%': { opacity: '0', transform: 'translateY(-10px)' }, + }, + 'float': { + '0%, 100%': { transform: 'translateY(0)' }, + '50%': { transform: 'translateY(-5px)' }, + }, + 'shape-appear': { + '0%': { opacity: '0', transform: 'scale(0.85) translateY(10px)' }, + '100%': { opacity: '1', transform: 'scale(1) translateY(0)' }, + }, + 'avatar-appear-smooth': { + '0%': { opacity: '0', transform: 'scale(0.85)' }, + '100%': { opacity: '1', transform: 'scale(1)' }, + }, + 'avatar-disappear-smooth': { + '0%': { opacity: '1', transform: 'scale(1)' }, + '100%': { opacity: '0', transform: 'scale(0.85)' }, + }, }, animation: { 'accordion-down': 'accordion-down 0.2s ease-out', 'accordion-up': 'accordion-up 0.2s ease-out', + 'fade-in': 'fade-in 0.5s ease-out forwards', + 'fade-out': 'fade-out 0.5s ease-out forwards', + 'float': 'float 6s ease-in-out infinite', + 'shape-appear': 'shape-appear 0.8s cubic-bezier(0.34, 1.56, 0.64, 1) forwards', + 'avatar-appear-smooth': 'avatar-appear-smooth 0.8s ease-out', + 'avatar-disappear-smooth': 'avatar-disappear-smooth 0.8s ease-out', }, }, }, - plugins: [], -} -export default config \ No newline at end of file + plugins: [require('tailwindcss-animate')], +}; + +export default config; From 0bf708d58c652560c25512b939bfc7079d4718fb Mon Sep 17 00:00:00 2001 From: atharva20-coder Date: Tue, 18 Mar 2025 17:10:39 +0530 Subject: [PATCH 05/14] Redesigned hero section --- src/app/(landingpage)/page.tsx | 2 +- .../(landingpage)/social/pricings/page.tsx | 111 +++++++ src/components/global/landing-nav.tsx | 285 ++++++++++++++---- src/components/ui/navigation-menu.tsx | 6 +- src/constants/pages.tsx | 4 +- 5 files changed, 349 insertions(+), 59 deletions(-) create mode 100644 src/app/(landingpage)/social/pricings/page.tsx diff --git a/src/app/(landingpage)/page.tsx b/src/app/(landingpage)/page.tsx index f5501bf..272b9b7 100644 --- a/src/app/(landingpage)/page.tsx +++ b/src/app/(landingpage)/page.tsx @@ -489,7 +489,7 @@ export default function LandingPage() {

Transform your Instagram presence today with our powerful AI automation, while preparing for tomorrow with upcoming integrations for Threads, Facebook, WhatsApp, Newsletter, Telegram, X, and LinkedIn. Our intelligent platform helps you create engaging conversations, deliver 24/7 customer support, and scale your social media engagement effortlessly across all channels.

- + diff --git a/src/app/(landingpage)/social/pricings/page.tsx b/src/app/(landingpage)/social/pricings/page.tsx new file mode 100644 index 0000000..1228bfd --- /dev/null +++ b/src/app/(landingpage)/social/pricings/page.tsx @@ -0,0 +1,111 @@ +"use client"; + +import { Sigmar } from 'next/font/google'; +import LandingNav from '@/components/global/landing-nav'; +import Footer from '@/components/global/footer'; +import { Button } from "@/components/ui/button"; +import { PLANS } from "@/constants/pages"; +import { CircleCheck } from "lucide-react"; +import { cn } from "@/lib/utils"; + +const sigmar = Sigmar({ weight: '400', subsets: ['latin'] }); + +export default function PricingPage() { + return ( + <> + +
+ {/* Hero Section */} +
+

+ Choose Your Plan +

+

+ Scale your Instagram presence with our powerful automation tools +

+
+ + {/* Pricing Cards */} +
+ {PLANS.map((plan, index) => ( +
+
+
+
+
+

+ {plan.name} +

+

{plan.description}

+
+ +
+
+ + {plan.price} + + /month +
+
+ +
+ {plan.features.map((feature) => ( +
+ + {feature} +
+ ))} +
+
+
+
+ ))} +
+ + {/* FAQ Section */} +
+

+ Frequently Asked Questions +

+
+
+

How does the free plan work?

+

Our free plan includes 200 DMs and Comments per month, perfect for getting started with automation. You can upgrade anytime as your needs grow.

+
+
+

Can I switch plans later?

+

Yes! You can upgrade or downgrade your plan at any time. Changes will be reflected in your next billing cycle.

+
+
+

What payment methods do you accept?

+

We accept all major credit cards and UPI payments. For specific payment queries, please contact our support team.

+
+
+
+ + {/* CTA Section */} +
+

+ Ready to grow your Instagram presence? +

+

+ Join thousands of creators who trust Auctorn for their Instagram automation needs +

+ +
+
+
+ + ); +} \ No newline at end of file diff --git a/src/components/global/landing-nav.tsx b/src/components/global/landing-nav.tsx index b7fae63..ff4f7af 100644 --- a/src/components/global/landing-nav.tsx +++ b/src/components/global/landing-nav.tsx @@ -3,6 +3,8 @@ import Link from "next/link"; import { Inter } from "next/font/google"; import Image from "next/image"; import { useTheme } from "@/contexts/theme-context"; +import { NavigationMenu, NavigationMenuContent, NavigationMenuItem, NavigationMenuLink, NavigationMenuList, NavigationMenuTrigger } from "@/components/ui/navigation-menu"; +import { Accordion, AccordionContent, AccordionItem, AccordionTrigger } from "@/components/ui/accordion"; const inter = Inter({ subsets: ["latin"] }); @@ -29,33 +31,131 @@ const LandingNav = () => { className="w-10 h-10 md:w-11 md:h-11 lg:w-12 lg:h-12" /> -
- - PRODUCT - - - - - SOLUTIONS - - - - - AGENCIES - - - - - PRICING - - - - - RESOURCES - - - -
+ + + + PRODUCT + +
+ +
+ Instagram +
+

Instagram Automation

+ Active +
+
+

Automated responses, comment management, and engagement tools - Updated daily with new features

+ + +
+ Facebook +
+

Facebook Automation

+ Coming Soon +
+
+

Page management, post scheduling, and audience engagement tools

+ + +
+ Newsletter +
+

Newsletter Automation

+ Coming Soon +
+
+

Email campaign management and subscriber engagement automation

+ + +
+ Messenger +
+

Messenger Automation

+ Coming Soon +
+
+

Chat automation, response templates, and customer support tools

+ + +
+ Google Sheets +
+

Google Sheets Automation

+ Coming Soon +
+
+

Data automation, reporting, and integration with other services

+ +
+ + + + + SOLUTIONS + +
+ +

For Enterprise

+

Large scale solutions for enterprise

+ + +

For Startups

+

Flexible solutions for growing businesses

+ + +

For Agencies

+

Specialized solutions for marketing agencies

+ +
+ + + + + AGENCIES + +
+ +

Partner Program

+

Join our partner network

+ + +

Agency Directory

+

Find certified agency partners

+ +
+ + + + + + PRICING + + + + + + + RESOURCES + +
+ +

How to guide

+

Learn how automations work in Auctorn

+ + +

Blogs

+

For growing businesses and increasing follower count

+ + +

Meet Developer

+

Get in touch with the developer

+ +
+ + + +
{/* Hamburger Menu */} @@ -191,32 +291,111 @@ const LandingNav = () => { className={`md:hidden absolute left-0 right-0 top-[72px] bg-white dark:bg-gray-900 border-b border-gray-200 dark:border-gray-800 shadow-lg transform transition-all duration-300 ease-in-out origin-top ${isMenuOpen ? 'opacity-100 scale-y-100' : 'opacity-0 scale-y-0'}`} >
-
- - PRODUCT - - - - - SOLUTIONS - - - - - AGENCIES - - - - - PRICING - - - - - RESOURCES - - - +
+ + + + PRODUCT + + +
+ +
+ Instagram +
+

Instagram Automation

+ Active +
+
+

Automated responses, comment management, and engagement tools - Updated daily with new features

+ + +
+ Facebook +
+

Facebook Automation

+ Coming Soon +
+
+

Page management, post scheduling, and audience engagement tools

+ + +
+ Newsletter +
+

Newsletter Automation

+ Coming Soon +
+
+

Email campaign management and subscriber engagement automation

+ + +
+ Messenger +
+

Messenger Automation

+ Coming Soon +
+
+

Chat automation, response templates, and customer support tools

+ + +
+ Google Sheets +
+

Google Sheets Automation

+ Coming Soon +
+
+

Data automation, reporting, and integration with other services

+ +
+ + + + + + SOLUTIONS + + +
+ For Enterprise + For Startups +
+ + + + + + AGENCIES + + +
+ Partner Program + Agency Directory +
+ + + + + + PRICING + + + + + + RESOURCES + + +
+ How to guide + Blogs + Meet Developer +
+ + +
diff --git a/src/components/ui/navigation-menu.tsx b/src/components/ui/navigation-menu.tsx index a5d4d27..3e11550 100644 --- a/src/components/ui/navigation-menu.tsx +++ b/src/components/ui/navigation-menu.tsx @@ -69,7 +69,7 @@ const NavigationMenuContent = React.forwardRef< , React.ComponentPropsWithoutRef >(({ className, ...props }, ref) => ( -
+
Date: Tue, 18 Mar 2025 17:25:38 +0530 Subject: [PATCH 06/14] Redesigned hero section --- src/app/(landingpage)/page.tsx | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/src/app/(landingpage)/page.tsx b/src/app/(landingpage)/page.tsx index 272b9b7..62f583f 100644 --- a/src/app/(landingpage)/page.tsx +++ b/src/app/(landingpage)/page.tsx @@ -189,15 +189,15 @@ export default function LandingPage() { {/* Hero Section */}
-
+

AUCTORN

-

+

SMART MOVES, VIRAL WINS: AUTOMATE & THRIVE

-

+

Seamlessly automate your Instagram engagement, grow your audience, and convert followers into customers with intelligent workflows designed for creators, influencers, and businesses.

- + From 954ff293a07071433128f9e1413bf8719bebb745 Mon Sep 17 00:00:00 2001 From: atharva20-coder Date: Tue, 18 Mar 2025 17:36:13 +0530 Subject: [PATCH 07/14] updated metadata --- src/app/(landingpage)/metadata.ts | 16 ++++++++-------- 1 file changed, 8 insertions(+), 8 deletions(-) diff --git a/src/app/(landingpage)/metadata.ts b/src/app/(landingpage)/metadata.ts index 1e0b5ea..0b61b65 100644 --- a/src/app/(landingpage)/metadata.ts +++ b/src/app/(landingpage)/metadata.ts @@ -1,25 +1,25 @@ import type { Metadata } from "next"; export const metadata: Metadata = { - title: "Swoopin - AI-Powered Social Media Marketing Automation Platform", - description: "Transform your social media presence with Swoopin's AI automation. Boost engagement, generate leads, and provide 24/7 customer support across Instagram, WhatsApp, and Messenger.", + title: "Auctorn - AI-Powered Social Media Marketing Automation Platform", + description: "Transform your social media presence with Auctorns's AI automation. Boost engagement, generate leads, and provide 24/7 customer support across Instagram, WhatsApp, and Messenger.", keywords: "social media automation, Instagram automation, WhatsApp marketing, Messenger bot, AI chatbot, lead generation, customer support automation, social media marketing tools", openGraph: { - title: "Swoopin - Revolutionize Your Social Media Marketing", + title: "Auctorn - Revolutionize Your Social Media Marketing", description: "Automate your social media interactions, boost engagement, and drive sales with AI-powered responses across Instagram, WhatsApp, and Messenger.", type: "website", - url: "https://swoopin.com", + url: "https://auctorn.com", images: [{ - url: "/public/header/robot avatar.svg", + url: "/header/avatar.png", width: 1200, height: 630, - alt: "Swoopin AI Social Media Automation" + alt: "Auctorn Social Media Automation Avatar" }] }, twitter: { card: "summary_large_image", - title: "Swoopin - Smart Social Media Automation", + title: "Auctorn - Smart Social Media Automation", description: "Leverage AI to automate your social media marketing. Generate leads, increase engagement, and provide instant customer support.", - images: ["/public/header/robot avatar.svg"] + images: ["/landingpage-images/Autcorn-logo.svg"] } }; \ No newline at end of file From 0e25f03310adcf8108ef70daf65bdeeb67ece02e Mon Sep 17 00:00:00 2001 From: atharva20-coder Date: Fri, 21 Mar 2025 13:12:31 +0530 Subject: [PATCH 08/14] added back payment cards --- .../dashboard/[slug]/billing/page.tsx | 211 +++--------------- 1 file changed, 35 insertions(+), 176 deletions(-) diff --git a/src/app/(protected)/dashboard/[slug]/billing/page.tsx b/src/app/(protected)/dashboard/[slug]/billing/page.tsx index 6a6bd69..3a54738 100644 --- a/src/app/(protected)/dashboard/[slug]/billing/page.tsx +++ b/src/app/(protected)/dashboard/[slug]/billing/page.tsx @@ -1,193 +1,52 @@ "use client"; import React from "react"; -import { Sigmar } from 'next/font/google'; +import PaymentCard from "./payment-card"; +import { useQueryUser } from "@/hooks/user-queries"; import { useUser } from "@clerk/nextjs"; +import { Sigmar } from 'next/font/google' import { useParams } from "next/navigation"; -import { Button } from "@/components/ui/button"; -import Image from "next/image"; -import { Instagram, CreditCard } from 'lucide-react'; + +type Props = {}; const sigmar = Sigmar({ weight: '400', subsets: ['latin'] }) -const Billing = () => { +const Billing = (props: Props) => { + const { data } = useQueryUser(); const { user } = useUser(); const params = useParams(); const slug = params.slug as string; return ( -
- {/* Hero Section */} -
-

- Let us help you grow more. -

-

- We'll get you set up in minutes. And we'll be here as your business expands. Open a Business account online—no monthly commitments, no hidden fees. -

-
- - -
-

- Talk to an account specialist to get started, 91-7000-523-270. -

-
- Subscription Page -
+
+
+

EXPLORE OUR BEST PRICING IN ALL OTHERS

+

Best plans specially curated for, {user?.firstName || 'You'}!

+

Powerful AI automation tools and social media management features to grow your business.

- - {/* Connect Store Section */} -
-

- Get a subscribed to Auctorn and automate your success. -

-

- We're integrated with the most popular ecommerce platforms out there. Link your Business account today for hassle-free payments. -

- -
- -

Contact us for UPI payments or any payment-related issues

-

OR

- - Mail to atharvajoshi2520@gmail.com - -
+
+ +
- - {/* Plans Section */} -
-
-

- Subscribe up today.
Here's your plan: -

-
- -
- {/* FREE Plan */} -
-
- FREE -
Your current plan
-
-

Standard

-

Perfect for getting started with automation

-
- ₹0 - /month -
-
-

- ✓ 200 DMs and Comments -

-

- ✓ Boost engagement with target responses -

-

- ✓ Automate comment replies -

-

- ✓ Turn followers into customers -

-
-
- - {/* PRO Plan */} -
-
PRO
-

Smart AI

-

For power users and agencies

-
- ₹799 - /month -
-
-

- ✓ Unlimited DMs and Comments -

-

- ✓ AI-powered response generation -

-

- ✓ Advanced analytics and insights -

-

- ✓ Priority customer support -

-

- ✓ Custom branding options -

-
- -
-
-
- - {/* Footer Section */} -
-

- Unlock the full potential of your Instagram presence -

-

- Automate your engagement, generate AI-powered responses, and watch your Instagram following grow. Experience the power of smart automation today. -

- - {/* Feedback Section */} -
-

We value your feedback! Help us improve our service.

- -
- - {/* Unsubscribe Button */} -
- -

Cancel your Pro subscription and return to the Free plan

-
- - {/* Footer Section */} +
); From 2206f624d624f045a79d86acf2818787bf1d935b Mon Sep 17 00:00:00 2001 From: atharva20-coder Date: Fri, 21 Mar 2025 13:18:31 +0530 Subject: [PATCH 09/14] added back payment cards --- .../dashboard/[slug]/billing/payment-card.tsx | 26 +++++++++---------- 1 file changed, 13 insertions(+), 13 deletions(-) diff --git a/src/app/(protected)/dashboard/[slug]/billing/payment-card.tsx b/src/app/(protected)/dashboard/[slug]/billing/payment-card.tsx index 8681393..cc8f7ed 100644 --- a/src/app/(protected)/dashboard/[slug]/billing/payment-card.tsx +++ b/src/app/(protected)/dashboard/[slug]/billing/payment-card.tsx @@ -17,24 +17,24 @@ const PaymentCard = ({ current, label, landing }: Props) => {
{landing ? ( -

+

{label === "PRO" && "Premium Plan"} {label === "FREE" && "Standard"}

) : ( -

+

{label === current ? "Your Current Plan" : current === "PRO" @@ -42,7 +42,7 @@ const PaymentCard = ({ current, label, landing }: Props) => { : "Upgrade"}

)} -

+

This is what your plan covers for automations and AI features

{label === "PRO" ? ( @@ -50,20 +50,20 @@ const PaymentCard = ({ current, label, landing }: Props) => { Smart AI ) : ( -

Standard

+

Standard

)} {label === "PRO" ? (

- $99 - /month + ₹799 + /month

) : ( -

Free

+

Free

)}
{PLANS[label === "PRO" ? 1 : 0].features.map((i) => ( -

+

{i}

@@ -76,7 +76,7 @@ const PaymentCard = ({ current, label, landing }: Props) => { "rounded-full py-6 text-lg font-semibold transition-all duration-300", label === "PRO" ? "bg-gradient-to-r from-indigo-500 text-white via-purple-500 to-pink-500 hover:opacity-90" - : "bg-gray-900 dark:bg-white dark:text-gray-900 text-white hover:bg-gray-800 dark:hover:bg-gray-100" + : "bg-gray-900 text-white hover:bg-gray-800" )} > {label === current @@ -89,7 +89,7 @@ const PaymentCard = ({ current, label, landing }: Props) => { - -
-
-
-
-
- or -
-
- -
-
-
- setEmail(e.target.value)} - placeholder="Enter your email" - variant="bordered" - isInvalid={!!error} - errorMessage={error} - className={`w-full bg-[#EBEBEB] text-black px-6 py-4 text-lg rounded-xl transition-all duration-200 border-2 ${error ? 'border-red-600 focus:border-red-600 focus:ring-red-300' : 'border-gray-300 hover:border-gray-400 focus:border-black focus:ring-black/20'} focus:ring-2 focus:ring-offset-0 !text-black`} - required - /> - {error && ( -

{error}

- )} - setPassword(e.target.value)} - placeholder="Enter your password" - variant="bordered" - isInvalid={!!error} - errorMessage={error} - className={`w-full bg-[#EBEBEB] text-black px-6 py-4 text-lg rounded-xl transition-all duration-200 border-2 ${error ? 'border-red-600 focus:border-red-600 focus:ring-red-300' : 'border-gray-300 hover:border-gray-400 focus:border-black focus:ring-black/20'} focus:ring-2 focus:ring-offset-0`} - required - minLength={8} - /> - {error && ( -

{error}

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

Currently email sign-in service is not available. Please login using Google instead.

-
-
-
-
-
- ); +const Page = (props: Props) => { + return ; }; -export default SignInPage; \ No newline at end of file +export default Page; \ No newline at end of file diff --git a/src/app/(auth)/sign-up/[[...sign-up]]/page.tsx b/src/app/(auth)/sign-up/[[...sign-up]]/page.tsx index 14f79ad..ba89cd8 100644 --- a/src/app/(auth)/sign-up/[[...sign-up]]/page.tsx +++ b/src/app/(auth)/sign-up/[[...sign-up]]/page.tsx @@ -1,232 +1,10 @@ -"use client" +import { SignUp } from "@clerk/nextjs"; +import React from "react"; -import { useState, useEffect } from "react"; -import { useSignUp } from "@clerk/nextjs"; -import { useRouter } from "next/navigation"; -import Image from "next/image"; -import { Input } from '@heroui/input' +type Props = {}; -const SignUpPage = () => { - const { isLoaded, signUp, setActive } = useSignUp(); - const router = useRouter(); - - const [email, setEmail] = useState(""); - const [password, setPassword] = useState(""); - const [error, setError] = useState(""); - const [verifying, setVerifying] = useState(false); - const [code, setCode] = useState(""); - const [isCompleting, setIsCompleting] = useState(false); - const [shouldShowContent, setShouldShowContent] = useState(false); - - useEffect(() => { - if (!isLoaded) return; - setShouldShowContent(true); - }, [isLoaded]); - - const handleEmailSignUp = async (e: React.FormEvent) => { - e.preventDefault(); - if (!isLoaded) return; - - try { - // Check if user exists in database - const response = await fetch('/api/check-user', { - method: 'POST', - headers: { - 'Content-Type': 'application/json', - }, - body: JSON.stringify({ email }), - }); - - const data = await response.json(); - - if (data.exists) { - setError('An account with this email already exists. Please sign in instead.'); - return; - } - - // Proceed with sign up if user doesn't exist - await signUp.create({ - emailAddress: email, - password, - }); - setVerifying(true); - } catch (err: any) { - setError(err.errors?.[0]?.message || 'An error occurred. Please try again.'); - } - }; - -{/** - const handleGoogleSignUp = async () => { - if (!isLoaded) return; - try { - await signUp.authenticateWithRedirect({ - strategy: "oauth_google", - redirectUrl: "/sign-in", - redirectUrlComplete: "/dashboard", - }); - } catch (err: any) { - setError(err.errors[0]?.message || "An error occurred during Google sign-up."); - } - }; - -*/} - - - const handleGoogleSignUp = async () => { - if (!isLoaded) return; - try { - await signUp.authenticateWithRedirect({ - strategy: "oauth_google", - redirectUrl: "/sign-up", - redirectUrlComplete: "/dashboard", - }); - } catch (err: any) { - setError(err.errors[0]?.message || "An error occurred during Google sign-in."); - } - }; - - const handleVerify = async (e: React.FormEvent) => { - e.preventDefault(); - if (!isLoaded) return; - setIsCompleting(true); - - try { - const completeSignUp = await signUp.attemptEmailAddressVerification({ - code, - }); - if (completeSignUp.status === "complete") { - await setActive({ session: completeSignUp.createdSessionId }); - router.replace("/dashboard"); - } else { - setIsCompleting(false); - setError("Verification failed. Please try again."); - } - } catch (err: any) { - setError(err.errors[0]?.message || "Verification failed. Please try again."); - setIsCompleting(false); - } - }; - - const handleResendCode = async () => { - if (!isLoaded) return; - try { - await signUp.prepareEmailAddressVerification({ strategy: "email_code" }); - } catch (err: any) { - setError("Failed to resend code. Please try again."); - } - }; - - if (!shouldShowContent || isCompleting) { - return ( -
-
-
- ); - } - - return ( -
- {!verifying ? ( -
- - -
-

Currently email sign-up service is not available. Please use Google sign-up instead.

-
-
- ) : verifying ? ( -
-

We sent a verification code to {email}

- setCode(e.target.value)} - label="Verification Code" - placeholder="Enter verification code" - variant="bordered" - isInvalid={!!error} - errorMessage={error} - className={`w-full bg-[#EBEBEB] text-black px-6 py-4 text-lg rounded-xl transition-all duration-200 ${error ? 'border-red-500 focus:border-red-500' : 'border-transparent focus:border-black'} focus:ring-0`} - required - /> - {error && ( -

{error}

- )} - {error && ( -

{error}

- )} - - -
- ) : ( -
-
-
- setEmail(e.target.value)} - placeholder="Enter your email" - variant="bordered" - isInvalid={!!error} - errorMessage={error} - className={`w-full bg-[#EBEBEB] text-black px-6 py-4 text-lg rounded-xl transition-all duration-200 border-2 ${error ? 'border-red-600 focus:border-red-600 focus:ring-red-300' : 'border-gray-300 hover:border-gray-400 focus:border-black focus:ring-black/20'} focus:ring-2 focus:ring-offset-0 !text-black`} - required - /> - {error && ( -

{error}

- )} - setPassword(e.target.value)} - placeholder="Enter your password" - variant="bordered" - isInvalid={!!error} - errorMessage={error} - className={`w-full bg-[#EBEBEB] text-black px-6 py-4 text-lg rounded-xl transition-all duration-200 border-2 ${error ? 'border-red-600 focus:border-red-600 focus:ring-red-300' : 'border-gray-300 hover:border-gray-400 focus:border-black focus:ring-black/20'} focus:ring-2 focus:ring-offset-0`} - required - minLength={8} - /> - {error && ( -

{error}

- )} -
- -
-
- )} - -
- ); +const Page = (props: Props) => { + return ; }; -export default SignUpPage; \ No newline at end of file +export default Page; \ No newline at end of file diff --git a/src/app/(protected)/dashboard/[slug]/billing/page.tsx b/src/app/(protected)/dashboard/[slug]/billing/page.tsx index 3a54738..6a6bd69 100644 --- a/src/app/(protected)/dashboard/[slug]/billing/page.tsx +++ b/src/app/(protected)/dashboard/[slug]/billing/page.tsx @@ -1,52 +1,193 @@ "use client"; import React from "react"; -import PaymentCard from "./payment-card"; -import { useQueryUser } from "@/hooks/user-queries"; +import { Sigmar } from 'next/font/google'; import { useUser } from "@clerk/nextjs"; -import { Sigmar } from 'next/font/google' import { useParams } from "next/navigation"; - -type Props = {}; +import { Button } from "@/components/ui/button"; +import Image from "next/image"; +import { Instagram, CreditCard } from 'lucide-react'; const sigmar = Sigmar({ weight: '400', subsets: ['latin'] }) -const Billing = (props: Props) => { - const { data } = useQueryUser(); +const Billing = () => { const { user } = useUser(); const params = useParams(); const slug = params.slug as string; return ( -
-
-

EXPLORE OUR BEST PRICING IN ALL OTHERS

-

Best plans specially curated for, {user?.firstName || 'You'}!

-

Powerful AI automation tools and social media management features to grow your business.

+
+ {/* Hero Section */} +
+

+ Let us help you grow more. +

+

+ We'll get you set up in minutes. And we'll be here as your business expands. Open a Business account online—no monthly commitments, no hidden fees. +

+
+ + +
+

+ Talk to an account specialist to get started, 91-7000-523-270. +

+
+ Subscription Page +
-
- - + + {/* Connect Store Section */} +
+

+ Get a subscribed to Auctorn and automate your success. +

+

+ We're integrated with the most popular ecommerce platforms out there. Link your Business account today for hassle-free payments. +

+ +
+ +

Contact us for UPI payments or any payment-related issues

+

OR

+ + Mail to atharvajoshi2520@gmail.com + +
-
- -

Contact us for UPI payments or any payment-related issues

-

OR

- - DM us on instagram - + + {/* Plans Section */} +
+
+

+ Subscribe up today.
Here's your plan: +

+
+ +
+ {/* FREE Plan */} +
+
+ FREE +
Your current plan
+
+

Standard

+

Perfect for getting started with automation

+
+ ₹0 + /month +
+
+

+ ✓ 200 DMs and Comments +

+

+ ✓ Boost engagement with target responses +

+

+ ✓ Automate comment replies +

+

+ ✓ Turn followers into customers +

+
+
+ + {/* PRO Plan */} +
+
PRO
+

Smart AI

+

For power users and agencies

+
+ ₹799 + /month +
+
+

+ ✓ Unlimited DMs and Comments +

+

+ ✓ AI-powered response generation +

+

+ ✓ Advanced analytics and insights +

+

+ ✓ Priority customer support +

+

+ ✓ Custom branding options +

+
+ +
+
+
+ + {/* Footer Section */} +
+

+ Unlock the full potential of your Instagram presence +

+

+ Automate your engagement, generate AI-powered responses, and watch your Instagram following grow. Experience the power of smart automation today. +

+ + {/* Feedback Section */} +
+

We value your feedback! Help us improve our service.

+ +
+ + {/* Unsubscribe Button */} +
+ +

Cancel your Pro subscription and return to the Free plan

+
+ + {/* Footer Section */}
); diff --git a/src/app/(protected)/dashboard/[slug]/billing/payment-card.tsx b/src/app/(protected)/dashboard/[slug]/billing/payment-card.tsx index b01d0bc..8681393 100644 --- a/src/app/(protected)/dashboard/[slug]/billing/payment-card.tsx +++ b/src/app/(protected)/dashboard/[slug]/billing/payment-card.tsx @@ -17,24 +17,24 @@ const PaymentCard = ({ current, label, landing }: Props) => {
{landing ? ( -

+

{label === "PRO" && "Premium Plan"} {label === "FREE" && "Standard"}

) : ( -

+

{label === current ? "Your Current Plan" : current === "PRO" @@ -42,7 +42,7 @@ const PaymentCard = ({ current, label, landing }: Props) => { : "Upgrade"}

)} -

+

This is what your plan covers for automations and AI features

{label === "PRO" ? ( @@ -50,20 +50,20 @@ const PaymentCard = ({ current, label, landing }: Props) => { Smart AI ) : ( -

Standard

+

Standard

)} {label === "PRO" ? (

- ₹999 - /month + $99 + /month

) : ( -

Free

+

Free

)}
{PLANS[label === "PRO" ? 1 : 0].features.map((i) => ( -

+

{i}

@@ -76,7 +76,7 @@ const PaymentCard = ({ current, label, landing }: Props) => { "rounded-full py-6 text-lg font-semibold transition-all duration-300", label === "PRO" ? "bg-gradient-to-r from-indigo-500 text-white via-purple-500 to-pink-500 hover:opacity-90" - : "bg-gray-900 text-white hover:bg-gray-800" + : "bg-gray-900 dark:bg-white dark:text-gray-900 text-white hover:bg-gray-800 dark:hover:bg-gray-100" )} > {label === current @@ -89,7 +89,7 @@ const PaymentCard = ({ current, label, landing }: Props) => { - -
-

- Talk to an account specialist to get started, 91-7000-523-270. -

-
- Subscription Page -
+
+
+

EXPLORE OUR BEST PRICING IN ALL OTHERS

+

Best plans specially curated for, {user?.firstName || 'You'}!

+

Powerful AI automation tools and social media management features to grow your business.

- - {/* Connect Store Section */} -
-

- Get a subscribed to Auctorn and automate your success. -

-

- We're integrated with the most popular ecommerce platforms out there. Link your Business account today for hassle-free payments. -

- -
- -

Contact us for UPI payments or any payment-related issues

-

OR

- - Mail to atharvajoshi2520@gmail.com - -
+
+ +
- - {/* Plans Section */} -
-
-

- Subscribe up today.
Here's your plan: -

-
- -
- {/* FREE Plan */} -
-
- FREE -
Your current plan
-
-

Standard

-

Perfect for getting started with automation

-
- ₹0 - /month -
-
-

- ✓ 200 DMs and Comments -

-

- ✓ Boost engagement with target responses -

-

- ✓ Automate comment replies -

-

- ✓ Turn followers into customers -

-
-
- - {/* PRO Plan */} -
-
PRO
-

Smart AI

-

For power users and agencies

-
- ₹799 - /month -
-
-

- ✓ Unlimited DMs and Comments -

-

- ✓ AI-powered response generation -

-

- ✓ Advanced analytics and insights -

-

- ✓ Priority customer support -

-

- ✓ Custom branding options -

-
- -
-
-
- - {/* Footer Section */} -
-

- Unlock the full potential of your Instagram presence -

-

- Automate your engagement, generate AI-powered responses, and watch your Instagram following grow. Experience the power of smart automation today. -

- - {/* Feedback Section */} -
-

We value your feedback! Help us improve our service.

- -
- - {/* Unsubscribe Button */} -
- -

Cancel your Pro subscription and return to the Free plan

-
- - {/* Footer Section */} +
+ +

Contact us for UPI payments or any payment-related issues

+

OR

+ + DM us on instagram +
); }; -export default Billing; \ No newline at end of file +export default Billing; From 899da3315af6e4efa8cf89b5de2b816d8e59dd29 Mon Sep 17 00:00:00 2001 From: Atharva Joshi <69634375+atharva20-coder@users.noreply.github.com> Date: Sat, 29 Mar 2025 12:51:49 +0530 Subject: [PATCH 13/14] Update payment-card.tsx --- src/app/(protected)/dashboard/[slug]/billing/payment-card.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/app/(protected)/dashboard/[slug]/billing/payment-card.tsx b/src/app/(protected)/dashboard/[slug]/billing/payment-card.tsx index 8681393..6252003 100644 --- a/src/app/(protected)/dashboard/[slug]/billing/payment-card.tsx +++ b/src/app/(protected)/dashboard/[slug]/billing/payment-card.tsx @@ -54,7 +54,7 @@ const PaymentCard = ({ current, label, landing }: Props) => { )} {label === "PRO" ? (

- $99 + ₹799 /month

) : ( @@ -105,4 +105,4 @@ const PaymentCard = ({ current, label, landing }: Props) => { ); }; -export default PaymentCard; \ No newline at end of file +export default PaymentCard; From 4eae8b87bcba776d541f3899ef81390003dad6d1 Mon Sep 17 00:00:00 2001 From: Atharva Joshi <69634375+atharva20-coder@users.noreply.github.com> Date: Sat, 29 Mar 2025 12:53:35 +0530 Subject: [PATCH 14/14] Update payment-card.tsx --- src/app/(protected)/dashboard/[slug]/billing/payment-card.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/app/(protected)/dashboard/[slug]/billing/payment-card.tsx b/src/app/(protected)/dashboard/[slug]/billing/payment-card.tsx index 6252003..85da59d 100644 --- a/src/app/(protected)/dashboard/[slug]/billing/payment-card.tsx +++ b/src/app/(protected)/dashboard/[slug]/billing/payment-card.tsx @@ -54,7 +54,7 @@ const PaymentCard = ({ current, label, landing }: Props) => { )} {label === "PRO" ? (

- ₹799 + ₹999 /month

) : (