From eabafe763692dfcb2ba127fa9f7c05bfaa378036 Mon Sep 17 00:00:00 2001 From: Desktop Date: Fri, 14 Nov 2025 03:12:58 +0500 Subject: [PATCH] Update Resources.tsx --- frontend/src/marketing/pages/Resources.tsx | 820 +++++++++++++++++---- 1 file changed, 682 insertions(+), 138 deletions(-) diff --git a/frontend/src/marketing/pages/Resources.tsx b/frontend/src/marketing/pages/Resources.tsx index a99761b9..92e57dbc 100644 --- a/frontend/src/marketing/pages/Resources.tsx +++ b/frontend/src/marketing/pages/Resources.tsx @@ -1,161 +1,705 @@ -import React from "react"; -import SectionHeading from "../components/SectionHeading"; -import CTASection from "../components/CTASection"; - -const articles = [ - { - title: "AI + SEO: Building topical authority at scale", - description: - "How Igny8 customers map thousands of keywords into authoritative clusters that rank faster.", - date: "October 2025", - }, - { - title: "Automating the content supply chain", - description: - "A playbook for connecting keyword research, briefs, writing, and imagery without human bottlenecks.", - date: "September 2025", - }, - { - title: "Measuring AI-generated content quality", - description: - "Frameworks for tracking performance, editorial standards, and compliance across large AI programs.", - date: "August 2025", - }, -]; - -const webinars = [ - { - title: "Building an automation-first content ops team", - description: "Live strategy session with Igny8 specialists and customer panel.", - date: "November 21, 2025", - }, - { - title: "From keywords to conversions: dashboards that prove ROI", - description: "Hands-on walkthrough of Igny8 dashboards and reporting exports.", - date: "On-demand replay", - }, -]; +import React, { useState } from "react"; +import { Link } from "react-router-dom"; +import { + RocketLaunchIcon, + ChatBubbleLeftRightIcon, + ArrowRightIcon, + ArrowDownTrayIcon, + PlayIcon, + CalculatorIcon, + BookOpenIcon, + SparklesIcon, + ChartBarIcon, + BoltIcon, + PhotoIcon, + DocumentTextIcon, + WrenchScrewdriverIcon, + ArrowTrendingUpIcon, + ClockIcon, +} from "@heroicons/react/24/outline"; const Resources: React.FC = () => { + const [selectedCategory, setSelectedCategory] = useState("Articles"); + const [webinarTab, setWebinarTab] = useState<"upcoming" | "ondemand">("upcoming"); + + const renderCta = (cta: { label: string; href: string }, className: string) => { + const isExternal = cta.href.startsWith("http"); + + if (isExternal) { + return ( + + {cta.label} + + ); + } + + return ( + + {cta.label} + + ); + }; + + const categories = [ + "Articles", + "Playbooks", + "Webinars", + "Templates", + "Tools", + "Case Studies", + "Product Updates", + ]; + + const articles = [ + { + title: "AI SEO: Building topical authority at scale", + description: "Short intro about mapping thousands of keywords at speed.", + category: "Articles", + }, + { + title: "Automating the content supply chain", + description: "How to orchestrate keyword research, briefs, writing, imagery, and publishing.", + category: "Articles", + }, + { + title: "Measuring AI generated content quality", + description: "Frameworks for accuracy, consistency, and editorial control across all outputs.", + category: "Articles", + }, + { + title: "SERP-guided content planning for growth", + description: "How context aware scoring improves prioritization and publishing velocity.", + category: "Articles", + }, + { + title: "Scaling briefs with AI editorial logic", + description: "A system for generating consistent, on brand briefs with automatic depth.", + category: "Articles", + }, + { + title: "Upgrading workflows with cluster automation", + description: "Practical steps to enable automation across the entire research to publish pipeline.", + category: "Articles", + }, + ]; + + const playbooks = [ + { + title: "AI SEO Acceleration Playbook", + description: "A complete framework for lifting organic traffic by expanding cluster depth and publishing volume.", + icon: ChartBarIcon, + color: "from-[#0693e3] to-[#0472b8]", + }, + { + title: "Automated Content Supply Chain Blueprint", + description: "A step by step path for unifying research, briefs, writing, imagery, and publishing.", + icon: BoltIcon, + color: "from-[#0bbf87] to-[#08966b]", + }, + { + title: "Editorial Standards for AI Content", + description: "Guidelines for tone, structure, consistency, and narrative control at scale.", + icon: DocumentTextIcon, + color: "from-[#ff7a00] to-[#cc5f00]", + }, + { + title: "Topic Authority Framework", + description: "A methodology for building dominance across entire keyword clusters.", + icon: SparklesIcon, + color: "from-[#5d4ae3] to-[#3a2f94]", + }, + ]; + + const upcomingWebinars = [ + { + title: "Building an automation first content ops team", + description: "Live strategy session with IGNY8 specialists.", + date: "November 21, 2025", + }, + { + title: "From keywords to conversions: dashboards that prove ROI", + description: "A full walkthrough of reporting and insights.", + date: "December 5, 2025", + }, + ]; + + const onDemandWebinars = [ + { + title: "Automating cluster research", + description: "Learn how to automate keyword clustering at scale.", + }, + { + title: "Editorial control and AI tone systems", + description: "Master brand voice and tone management in AI content.", + }, + ]; + + const templates = [ + { + title: "AI Brief Template", + description: "Structured format for generating consistent content briefs.", + icon: DocumentTextIcon, + color: "from-[#0693e3] to-[#0472b8]", + }, + { + title: "Cluster Outline Template", + description: "Long form outline template aligned with IGNY8 Writer standards.", + icon: ArrowDownTrayIcon, + color: "from-[#0bbf87] to-[#08966b]", + }, + { + title: "Image Prompt Template", + description: "A ready to use structure for generating high quality image prompts.", + icon: PhotoIcon, + color: "from-[#ff7a00] to-[#cc5f00]", + }, + { + title: "Editorial Style Guide Template", + description: "A flexible guide for managing tone and brand voice.", + icon: BookOpenIcon, + color: "from-[#5d4ae3] to-[#3a2f94]", + }, + ]; + + const tools = [ + { + title: "Content Velocity Calculator", + description: "Estimate the volume of content needed to achieve specific traffic goals.", + icon: CalculatorIcon, + color: "from-[#0693e3] to-[#0472b8]", + }, + { + title: "Keyword Opportunity Score", + description: "A utility to evaluate keyword value based on difficulty, volume, and intent.", + icon: ArrowTrendingUpIcon, + color: "from-[#0bbf87] to-[#08966b]", + }, + { + title: "Automation ROI Calculator", + description: "Measure the productivity gains achievable through workflow automation.", + icon: ChartBarIcon, + color: "from-[#5d4ae3] to-[#3a2f94]", + }, + ]; + + const caseStudies = [ + { + title: "Publisher increases content velocity by 3x", + description: "Short note on how IGNY8 unified research and writing workflows.", + }, + { + title: "Agency cuts production time by 48 percent", + description: "Insight into how automation reduced cycles from research to publish.", + }, + { + title: "Marketing team consolidates 4 tools into one", + description: "Story on reducing platform complexity while scaling content output.", + }, + ]; + return ( -
-
- +
+ {/* HERO SECTION */} +
+
+ +
+ + Resources + +

+ Insights, playbooks, and tools for AI led growth teams. +

+

+ Stay ahead with strategic content, templates, and live sessions that help you scale output, unify your workflows, and maximize automation impact. +

+
+ {renderCta( + { label: "Browse articles", href: "#articles" }, + "inline-flex items-center justify-center rounded-xl bg-gradient-to-r from-[#0693e3] to-[#0472b8] text-white px-8 py-4 text-base font-semibold hover:shadow-lg hover:-translate-y-0.5 transition shadow-md" + )} + {renderCta( + { label: "Join newsletter", href: "#newsletter" }, + "inline-flex items-center justify-center rounded-xl border-2 border-slate-300 bg-white text-slate-700 px-8 py-4 text-base font-semibold hover:border-[#0693e3] hover:text-[#0693e3] transition" + )} +
+
-
- {articles.map((article, idx) => { - const colors = [ - { border: "border-[#0693e3]/40", gradient: "from-[#0693e3]/10 to-white" }, - { border: "border-[#0bbf87]/40", gradient: "from-[#0bbf87]/10 to-white" }, - { border: "border-[#ff7a00]/40", gradient: "from-[#ff7a00]/10 to-white" }, - ]; - const colorScheme = colors[idx % colors.length]; - return ( -
- - {article.date} - -

{article.title}

-

{article.description}

-
- Article cover placeholder (800×600) → /marketing/images/resource-hero.png -
-
- ); - })} -
- -
-
- {webinars.map((webinar, idx) => { - const colors = [ - { border: "border-[#0693e3]/40", gradient: "from-[#0693e3]/10 to-white" }, - { border: "border-[#0bbf87]/40", gradient: "from-[#0bbf87]/10 to-white" }, - ]; - const colorScheme = colors[idx % colors.length]; - return ( -
+
+ Featured Resource +
+
+
+
+

+ AI SEO: Building topical authority at scale +

+

+ A deep dive into how AI systems accelerate research, map thousands of keywords into authoritative clusters, and streamline content production for rapid growth. +

+ - - {webinar.date} - -

{webinar.title}

-

{webinar.description}

- -
+ Read full guide + + +
+
+ Featured resource image placeholder +
+
+
+
+ + {/* RESOURCE CATEGORY FILTERS */} +
+
+
+ {categories.map((category) => ( + + ))} +
+
+
+ + {/* ARTICLES GRID */} +
+
+

+ Latest Articles +

+
+
+ {articles.map((article, index) => { + const colors = [ + "from-[#0693e3]/10 to-white", + "from-[#0bbf87]/10 to-white", + "from-[#ff7a00]/10 to-white", + "from-[#5d4ae3]/10 to-white", + "from-[#0693e3]/10 to-white", + "from-[#0bbf87]/10 to-white", + ]; + const borders = [ + "border-[#0693e3]/30", + "border-[#0bbf87]/30", + "border-[#ff7a00]/30", + "border-[#5d4ae3]/30", + "border-[#0693e3]/30", + "border-[#0bbf87]/30", + ]; + return ( + ); })}
+
-
-
- -
    -
  • - - Help Center → `/help` -
    • -
  • - - Documentation → `/help#docs` -
    • -
  • - - API Reference → `/partners#api` -
    • -
+ {/* PLAYBOOKS SECTION */} +
+
+
+

+ Playbooks and Strategic Guides +

+
+
+ {playbooks.map((playbook, index) => { + const Icon = playbook.icon; + return ( + + ); + })} +
-
-

- - Join the Igny8 newsletter -

-

- Monthly insights on AI, SEO, and automation. No fluff—just tactical guidance and event invites. -

-
- +
+ + {/* WEBINARS AND REPLAYS */} +
+
+
+

+ Live Sessions and On demand Replays +

+
+ + {/* Tabs */} +
- + +
+ + {/* Content */} +
+ {webinarTab === "upcoming" ? ( + <> + {upcomingWebinars.map((webinar, index) => { + const colors = [ + "from-[#0693e3]/10 to-white", + "from-[#0bbf87]/10 to-white", + ]; + const borders = [ + "border-[#0693e3]/30", + "border-[#0bbf87]/30", + ]; + return ( +
+
+ + {webinar.date} +
+

{webinar.title}

+

{webinar.description}

+ +
+ ); + })} + + ) : ( + <> + {onDemandWebinars.map((webinar, index) => { + const colors = [ + "from-[#5d4ae3]/10 to-white", + "from-[#ff7a00]/10 to-white", + ]; + const borders = [ + "border-[#5d4ae3]/30", + "border-[#ff7a00]/30", + ]; + return ( +
+
+ + Replay +
+

{webinar.title}

+

{webinar.description}

+ +
+ ); + })} + + )} +
+
- + {/* TEMPLATE LIBRARY */} +
+
+
+

+ Templates for Fast Execution +

+
+
+ {templates.map((template, index) => { + const Icon = template.icon; + return ( +
+
+ +
+

{template.title}

+

{template.description}

+ + + Download template + + +
+ ); + })} +
+
+
+ + {/* TOOLS AND CALCULATORS */} +
+
+
+

+ Tools to Support Your Growth Pipeline +

+
+
+ {tools.map((tool, index) => { + const Icon = tool.icon; + return ( +
+
+ +
+

{tool.title}

+

{tool.description}

+ +
+ ); + })} +
+
+
+ + {/* CASE STUDIES PREVIEW */} +
+
+
+

+ How Teams Scale Output With IGNY8 +

+
+
+ {caseStudies.map((study, index) => { + const colors = [ + "from-[#0693e3]/10 to-white", + "from-[#0bbf87]/10 to-white", + "from-[#5d4ae3]/10 to-white", + ]; + const borders = [ + "border-[#0693e3]/30", + "border-[#0bbf87]/30", + "border-[#5d4ae3]/30", + ]; + return ( +
+

{study.title}

+

{study.description}

+ + Read case study + + +
+ ); + })} +
+
+ + View all case studies + + +
+
+
+ + {/* HELP CENTER PREVIEW */} +
+
+
+ {/* Left Column */} +
+

+ Help Center +

+

+ Get instant answers and product walkthroughs. +

+
    + {[ + { label: "Quickstart guide", href: "/help#getting-started" }, + { label: "Documentation", href: "/help" }, + { label: "API Reference", href: "/partners#api" }, + { label: "Troubleshooting", href: "/help#faq" }, + ].map((link, index) => { + const dotColors = [ + "bg-[#0693e3]", + "bg-[#0bbf87]", + "bg-[#ff7a00]", + "bg-[#5d4ae3]", + ]; + return ( +
  • + + + {link.label} + +
    • + ); + })} +
+
+ + {/* Right Column - Newsletter Signup */} +
+
+
+ +
+

+ Newsletter Signup +

+
+

+ Monthly insights on AI, SEO, automation, and workflows. +

+
+ + +
+
+
+
+
+ + {/* FINAL CTA */} +
+ {/* Radial glow */} +
+ +
+

+ Want deeper access? Join our monthly live strategy lab. +

+

+ Reserve your seat to learn how teams automate their full growth pipeline. +

+
+ + + Reserve seat + + + + Browse articles + +
+
+
); }; export default Resources; -