Skip to content

Commit 965b8c4

Browse files
akshay0611akshay0611
committed
feat(companies): Add company hosting page and organization promotion sections
- Create new company hosting page at `/companies/host` with hero, stats, features, FAQ, and CTA sections - Add HostingHero component showcasing event hosting benefits and value proposition - Add CompanyStats component displaying platform statistics and engagement metrics - Add HowItWorksSection component explaining the hosting process step-by-step - Add CompanyFeatures component highlighting key platform features for companies - Add CompanyFAQ component with frequently asked questions about hosting - Add CompanyCTA component with call-to-action for company registration - Add CompanyStatsBanner component to companies listing page showing platform reach - Add CompanyRegistrationCTA component to companies page encouraging company sign-ups - Add OrganizationsSection component to home page promoting company hosting opportunities - Update companies page description to emphasize career growth and industry connections - Integrate new sections into home page with dynamic loading and suspense boundaries - Update header and footer components for improved navigation and consistency
1 parent 872c131 commit 965b8c4

14 files changed

Lines changed: 1261 additions & 9 deletions

‎app/companies/host/page.tsx‎

Lines changed: 39 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,39 @@
1+
import Header from "@/components/header"
2+
import Footer from "@/components/footer"
3+
import { HostingHero } from "@/components/companies/HostingHero"
4+
import { CompanyStats } from "@/components/companies/CompanyStats"
5+
import { HowItWorksSection } from "@/components/companies/HowItWorksSection"
6+
import { CompanyFeatures } from "@/components/companies/CompanyFeatures"
7+
import { CompanyFAQ } from "@/components/companies/CompanyFAQ"
8+
import { CompanyCTA } from "@/components/companies/CompanyCTA"
9+
import type { Metadata } from "next"
10+
11+
export const metadata: Metadata = {
12+
title: "Host Tech Events & Hackathons | Codeunia for Companies",
13+
description: "Host verified events, hackathons, and workshops on Codeunia. Engage 3000+ developers with team collaboration, analytics, and professional event management tools.",
14+
keywords: "host tech events, developer hackathons, workshop hosting, event management platform, tech community engagement",
15+
openGraph: {
16+
title: "Host Tech Events & Hackathons | Codeunia for Companies",
17+
description: "Host verified events, hackathons, and workshops on Codeunia. Engage 3000+ developers with team collaboration, analytics, and professional event management tools.",
18+
type: "website",
19+
},
20+
}
21+
22+
export default function CompanyHostingPage() {
23+
return (
24+
<div className="flex flex-col overflow-hidden bg-gradient-to-br from-background via-background to-muted/10">
25+
<Header />
26+
27+
<main className="flex-1">
28+
<HostingHero />
29+
<CompanyStats />
30+
<HowItWorksSection />
31+
<CompanyFeatures />
32+
<CompanyFAQ />
33+
<CompanyCTA />
34+
</main>
35+
36+
<Footer />
37+
</div>
38+
)
39+
}

‎app/companies/page.tsx‎

Lines changed: 9 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,8 @@ import { motion } from "framer-motion"
88
import Header from "@/components/header"
99
import Footer from "@/components/footer"
1010
import { CompanyCard } from "@/components/companies/CompanyCard"
11+
import { CompanyStatsBanner } from "@/components/companies/CompanyStatsBanner"
12+
import { CompanyRegistrationCTA } from "@/components/companies/CompanyRegistrationCTA"
1113
import { Company } from "@/types/company"
1214
import { cn } from "@/lib/utils"
1315
import {
@@ -189,12 +191,15 @@ export default function CompaniesPage() {
189191
transition={{ duration: 0.5, delay: 0.3 }}
190192
className="text-xl md:text-2xl text-muted-foreground max-w-3xl mx-auto leading-relaxed"
191193
>
192-
Explore verified companies hosting amazing events, workshops, and hackathons for the developer community.
194+
Discover verified companies hosting events, hackathons, and workshops. Connect with industry leaders, participate in tech challenges, and grow your career.
193195
</motion.p>
194196
</div>
195197
</motion.div>
196198
</section>
197199

200+
{/* Stats Banner */}
201+
<CompanyStatsBanner totalCompanies={total} />
202+
198203
{/* Search and Filters */}
199204
<section className="py-8 bg-gradient-to-b from-muted/30 to-background relative border-b border-primary/10">
200205
<div className="container px-4 mx-auto">
@@ -383,6 +388,9 @@ export default function CompaniesPage() {
383388
</div>
384389
</section>
385390

391+
{/* Company Registration CTA */}
392+
<CompanyRegistrationCTA />
393+
386394
<Footer />
387395
</div>
388396
)

‎app/page.tsx‎

Lines changed: 22 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -72,6 +72,21 @@ const SponsorsSection = dynamic(() => import("@/components/home/SponsorsSection"
7272
ssr: false
7373
});
7474

75+
// New: OrganizationsSection for company hosting
76+
const OrganizationsSection = dynamic(() => import("@/components/home/OrganizationsSection").then(mod => ({ default: mod.OrganizationsSection })), {
77+
loading: () => (
78+
<div className="py-20">
79+
<div className="container px-4 mx-auto">
80+
<div className="animate-pulse">
81+
<div className="h-8 bg-gray-200 rounded w-1/3 mx-auto mb-4"></div>
82+
<div className="h-4 bg-gray-200 rounded w-1/2 mx-auto"></div>
83+
</div>
84+
</div>
85+
</div>
86+
),
87+
ssr: false
88+
});
89+
7590
const Footer = dynamic(() => import("@/components/footer"), {
7691
loading: () => (
7792
<footer className="border-t border-border/40 bg-gradient-to-b from-background/95 via-background to-background/95">
@@ -90,7 +105,7 @@ export default function Home() {
90105
return (
91106
<>
92107
<main className="flex min-h-screen flex-col items-center justify-between">
93-
<Header/>
108+
<Header />
94109
<div className="w-full max-w-[2000px]">
95110
<Suspense fallback={<div className="min-h-[600px] flex items-center justify-center"><div className="animate-pulse text-primary">Loading...</div></div>}>
96111
<HeroSection2 />
@@ -100,6 +115,11 @@ export default function Home() {
100115
<FeaturesSection />
101116
</Suspense>
102117

118+
{/* New: Organizations Section for company hosting */}
119+
<Suspense fallback={<div className="py-20"><div className="container px-4 mx-auto"><div className="animate-pulse"><div className="h-8 bg-gray-200 rounded w-1/3 mx-auto mb-4"></div><div className="h-4 bg-gray-200 rounded w-1/2 mx-auto"></div></div></div></div>}>
120+
<OrganizationsSection />
121+
</Suspense>
122+
103123
<Suspense fallback={<div className="py-16"><div className="container px-4 mx-auto"><div className="animate-pulse"><div className="h-8 bg-gray-200 rounded w-1/3 mx-auto mb-4"></div><div className="h-4 bg-gray-200 rounded w-1/2 mx-auto"></div></div></div></div>}>
104124
<CommunitySpotlight />
105125
</Suspense>
@@ -113,7 +133,7 @@ export default function Home() {
113133
<LatestContentPreview />
114134
</Suspense>
115135
</div>
116-
<Footer/>
136+
<Footer />
117137
</main>
118138
</>
119139
)

‎components/companies/CompanyCTA.tsx‎

Lines changed: 126 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,126 @@
1+
"use client"
2+
3+
import { motion } from "framer-motion"
4+
import { Button } from "@/components/ui/button"
5+
import { ArrowRight, Mail } from "lucide-react"
6+
import Link from "next/link"
7+
import { SparklesCore } from "@/components/ui/sparkles"
8+
9+
export function CompanyCTA() {
10+
return (
11+
<section className="py-20 md:py-24 relative overflow-hidden bg-gradient-to-br from-primary/10 via-purple-500/10 to-background dark:from-primary/20 dark:via-purple-500/20 dark:to-background">
12+
<div className="absolute inset-0">
13+
<div className="absolute top-10 left-10 w-32 h-32 bg-primary/20 dark:bg-primary/30 rounded-full blur-xl animate-float"></div>
14+
<div
15+
className="absolute bottom-10 right-10 w-48 h-48 bg-purple-500/20 dark:bg-purple-500/30 rounded-full blur-xl animate-float"
16+
style={{ animationDelay: "3s" }}
17+
></div>
18+
</div>
19+
20+
{/* Sparkles effect */}
21+
<div className="absolute inset-0 h-full w-full">
22+
<SparklesCore
23+
id="company-cta-sparkles"
24+
background="transparent"
25+
minSize={0.6}
26+
maxSize={1.4}
27+
particleDensity={100}
28+
className="w-full h-full"
29+
particleColor="#6366f1"
30+
/>
31+
</div>
32+
33+
<motion.div
34+
initial={{ opacity: 0, y: 20 }}
35+
whileInView={{ opacity: 1, y: 0 }}
36+
transition={{ duration: 0.5 }}
37+
viewport={{ once: true }}
38+
className="container px-4 mx-auto text-center relative z-10"
39+
>
40+
<div className="max-w-3xl mx-auto space-y-8 p-8 md:p-10 rounded-3xl bg-background/50 dark:bg-background/80 backdrop-blur-md border border-primary/10 dark:border-primary/20 shadow-xl">
41+
<div className="flex flex-col items-center justify-center gap-4">
42+
<button className="bg-slate-800 no-underline group cursor-default relative shadow-2xl shadow-zinc-900 rounded-full p-px text-sm font-semibold leading-6 text-white inline-block">
43+
<span className="absolute inset-0 overflow-hidden rounded-full">
44+
<span className="absolute inset-0 rounded-full bg-[image:radial-gradient(75%_100%_at_50%_0%,rgba(56,189,248,0.6)_0%,rgba(56,189,248,0)_75%)] opacity-0 transition-opacity duration-500 group-hover:opacity-100" />
45+
</span>
46+
<div className="relative flex space-x-2 items-center z-10 rounded-full bg-zinc-950 py-0.5 px-4 ring-1 ring-white/10">
47+
<span>Ready to Get Started?</span>
48+
</div>
49+
<span className="absolute -bottom-0 left-[1.125rem] h-px w-[calc(100%-2.25rem)] bg-gradient-to-r from-emerald-400/0 via-emerald-400/90 to-emerald-400/0 transition-opacity duration-500 group-hover:opacity-40" />
50+
</button>
51+
</div>
52+
53+
<motion.h2
54+
initial={{ opacity: 0, y: 20 }}
55+
whileInView={{ opacity: 1, y: 0 }}
56+
transition={{ duration: 0.5, delay: 0.2 }}
57+
viewport={{ once: true }}
58+
className="text-4xl md:text-5xl lg:text-6xl font-bold tracking-tight leading-tight"
59+
>
60+
Ready to Engage the{" "}
61+
<motion.span
62+
className="gradient-text inline-block"
63+
animate={{
64+
backgroundPosition: ["0% 50%", "100% 50%", "0% 50%"],
65+
}}
66+
transition={{
67+
duration: 4,
68+
repeat: Infinity,
69+
ease: "linear",
70+
}}
71+
style={{
72+
background:
73+
"linear-gradient(90deg, #6366f1, #8b5cf6, #06b6d4, #6366f1)",
74+
backgroundSize: "300% 100%",
75+
WebkitBackgroundClip: "text",
76+
WebkitTextFillColor: "transparent",
77+
}}
78+
>
79+
Developer Community?
80+
</motion.span>
81+
</motion.h2>
82+
83+
<p className="text-lg md:text-xl text-muted-foreground dark:text-muted-foreground/90 leading-relaxed">
84+
Join 50+ verified companies hosting impactful events on Codeunia. Start engaging with 3000+ developers today.
85+
</p>
86+
87+
<div className="flex flex-col sm:flex-row gap-4 justify-center">
88+
<Button
89+
size="lg"
90+
className="bg-gradient-to-r from-primary to-purple-600 hover:from-primary/90 hover:to-purple-600/90 text-white px-8 py-6 text-lg font-semibold shadow-lg hover:shadow-xl transition-all duration-300 hover:scale-105"
91+
asChild
92+
>
93+
<Link href="/companies/register" className="flex items-center gap-2">
94+
Register Your Company
95+
<ArrowRight className="w-5 h-5" />
96+
</Link>
97+
</Button>
98+
99+
<Button
100+
size="lg"
101+
variant="outline"
102+
className="px-8 py-6 text-lg font-semibold hover:scale-105 transition-transform duration-300"
103+
asChild
104+
>
105+
<Link href="/contact" className="flex items-center gap-2">
106+
<Mail className="w-5 h-5" />
107+
Contact Us
108+
</Link>
109+
</Button>
110+
</div>
111+
112+
<p className="text-sm text-muted-foreground">
113+
Questions? Check out our{" "}
114+
<Link href="/companies/faq" className="text-primary hover:underline">
115+
FAQ
116+
</Link>{" "}
117+
or{" "}
118+
<Link href="/contact" className="text-primary hover:underline">
119+
contact our team
120+
</Link>
121+
</p>
122+
</div>
123+
</motion.div>
124+
</section>
125+
)
126+
}

‎components/companies/CompanyFAQ.tsx‎

Lines changed: 110 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,110 @@
1+
"use client"
2+
3+
import { motion } from "framer-motion"
4+
import {
5+
Accordion,
6+
AccordionContent,
7+
AccordionItem,
8+
AccordionTrigger,
9+
} from "@/components/ui/accordion"
10+
11+
const faqs = [
12+
{
13+
question: "How long does verification take?",
14+
answer: "Most applications are reviewed within 24-48 hours. You'll receive an email notification once your company is verified and ready to start hosting events.",
15+
},
16+
{
17+
question: "What documents are required for verification?",
18+
answer: "You'll need to provide business registration documents, your company website URL, and an official company email domain. All documents are securely stored and virus-scanned.",
19+
},
20+
{
21+
question: "Can I invite team members to help manage events?",
22+
answer: "Yes! You can invite unlimited team members with role-based permissions. Assign roles like Owner, Admin, Editor, or Viewer to control what each team member can do.",
23+
},
24+
{
25+
question: "Is there a cost to host events on Codeunia?",
26+
answer: "Currently, hosting events on Codeunia is completely free for all verified companies. We may introduce premium features in the future, but the core platform will remain free.",
27+
},
28+
{
29+
question: "What types of events can I host?",
30+
answer: "You can host workshops, hackathons, webinars, conferences, networking events, and any tech-related gatherings. Both online and in-person events are supported.",
31+
},
32+
{
33+
question: "Can I edit events after publishing?",
34+
answer: "Yes, admins and editors can update event details anytime. Changes are reflected immediately, and registered participants are notified of significant updates.",
35+
},
36+
{
37+
question: "How do I track event performance?",
38+
answer: "Your dashboard provides real-time analytics including views, registrations, attendance, and engagement metrics. You can also export detailed reports as CSV files.",
39+
},
40+
{
41+
question: "What happens if my company is rejected?",
42+
answer: "If your application is rejected, you'll receive an email with the specific reason. You can address the issues and resubmit your application for review.",
43+
},
44+
]
45+
46+
export function CompanyFAQ() {
47+
return (
48+
<section className="py-20 relative overflow-hidden">
49+
<div className="absolute inset-0 bg-gradient-to-br from-transparent via-primary/5 to-transparent"></div>
50+
51+
<div className="container px-4 mx-auto relative z-10">
52+
<motion.div
53+
className="text-center space-y-6 mb-12"
54+
initial={{ opacity: 0, y: 20 }}
55+
whileInView={{ opacity: 1, y: 0 }}
56+
transition={{ duration: 0.6 }}
57+
viewport={{ once: true }}
58+
>
59+
<div className="flex flex-col items-center justify-center gap-4">
60+
<button className="bg-slate-800 no-underline group relative shadow-2xl shadow-zinc-900 rounded-full p-px text-sm font-semibold leading-6 text-white inline-block cursor-default">
61+
<span className="absolute inset-0 overflow-hidden rounded-full">
62+
<span className="absolute inset-0 rounded-full bg-[image:radial-gradient(75%_100%_at_50%_0%,rgba(56,189,248,0.6)_0%,rgba(56,189,248,0)_75%)] opacity-0 transition-opacity duration-500 group-hover:opacity-100" />
63+
</span>
64+
<div className="relative flex space-x-2 items-center z-10 rounded-full bg-zinc-950 py-0.5 px-4 ring-1 ring-white/10">
65+
<span>FAQ</span>
66+
</div>
67+
<span className="absolute -bottom-0 left-[1.125rem] h-px w-[calc(100%-2.25rem)] bg-gradient-to-r from-emerald-400/0 via-emerald-400/90 to-emerald-400/0 transition-opacity duration-500 group-hover:opacity-40" />
68+
</button>
69+
</div>
70+
71+
<h2 className="text-3xl md:text-4xl lg:text-5xl font-bold">
72+
Frequently Asked{" "}
73+
<span className="bg-gradient-to-r from-primary to-purple-500 bg-clip-text text-transparent">
74+
Questions
75+
</span>
76+
</h2>
77+
78+
<p className="text-xl text-muted-foreground max-w-2xl mx-auto">
79+
Everything you need to know about hosting events on Codeunia
80+
</p>
81+
</motion.div>
82+
83+
<motion.div
84+
className="max-w-3xl mx-auto"
85+
initial={{ opacity: 0, y: 20 }}
86+
whileInView={{ opacity: 1, y: 0 }}
87+
transition={{ duration: 0.6, delay: 0.2 }}
88+
viewport={{ once: true }}
89+
>
90+
<Accordion type="single" collapsible className="w-full space-y-4">
91+
{faqs.map((faq, index) => (
92+
<AccordionItem
93+
key={index}
94+
value={`item-${index}`}
95+
className="border border-primary/10 rounded-lg px-6 bg-background/50 backdrop-blur-sm hover:border-primary/20 transition-colors"
96+
>
97+
<AccordionTrigger className="text-left hover:no-underline py-4">
98+
<span className="font-semibold text-lg">{faq.question}</span>
99+
</AccordionTrigger>
100+
<AccordionContent className="text-muted-foreground pb-4">
101+
{faq.answer}
102+
</AccordionContent>
103+
</AccordionItem>
104+
))}
105+
</Accordion>
106+
</motion.div>
107+
</div>
108+
</section>
109+
)
110+
}

0 commit comments

Comments
 (0)