+
+ )
+}
diff --git a/components/events/countdown-header.tsx b/components/events/countdown-header.tsx
new file mode 100644
index 0000000..b9f0e66
--- /dev/null
+++ b/components/events/countdown-header.tsx
@@ -0,0 +1,18 @@
+"use client"
+
+import { useRef } from "react"
+import { motion, useScroll, useTransform } from "framer-motion"
+
+const CountDownTimerHeader = () => {
+ const divRef = useRef(null)
+ const { scrollYProgress } = useScroll({
+ target: divRef,
+ })
+ const opacity = useTransform(scrollYProgress, [0, 0.5, 1], [1, 0.4, 0])
+ return (
+ We are almost there...
+
+
+
+
+ );
+};
+
+const CountdownItem = ({ num, text }: { num: number; text: string }) => {
+ return (
+
+
+
+
+ );
+};
+
+export default ShiftingCountdown;
\ No newline at end of file
diff --git a/components/events/dev-pic-component.tsx b/components/events/dev-pic-component.tsx
new file mode 100644
index 0000000..57498d5
--- /dev/null
+++ b/components/events/dev-pic-component.tsx
@@ -0,0 +1,179 @@
+'use client'
+
+import React, { useId } from "react";
+import {
+ motion,
+ useScroll,
+ useTransform,
+ useSpring,
+ MotionValue,
+} from "framer-motion";
+import Image from "next/image";
+import Link from "next/link";
+import { Wrapper } from "./wrapper";
+import { SectionHeading } from "./section-heading";
+
+export const DevPicComponent = ({
+ products,
+}: {
+ products: {
+ title: string;
+ thumbnail: string;
+ }[];
+}) => {
+ let id = useId();
+
+ const firstRow = products.slice(0, 5);
+ const secondRow = products.slice(5, 10);
+ const thirdRow = products.slice(10, 15);
+ const ref = React.useRef(null);
+ const { scrollYProgress } = useScroll({
+ target: ref,
+ offset: ["start start", "end start"],
+ });
+
+ const springConfig = { stiffness: 300, damping: 30, bounce: 100 };
+
+ const translateX = useSpring(
+ useTransform(scrollYProgress, [0, 1], [0, 1000]),
+ springConfig
+ );
+ const translateXReverse = useSpring(
+ useTransform(scrollYProgress, [0, 1], [0, -1000]),
+ springConfig
+ );
+ const rotateX = useSpring(
+ useTransform(scrollYProgress, [0, 0.2], [15, 0]),
+ springConfig
+ );
+ const opacity = useSpring(
+ useTransform(scrollYProgress, [0, 0.2], [0.2, 1]),
+ springConfig
+ );
+ const rotateZ = useSpring(
+ useTransform(scrollYProgress, [0, 0.2], [20, 0]),
+ springConfig
+ );
+ const translateY = useSpring(
+ useTransform(scrollYProgress, [0, 0.2], [-700, 500]),
+ springConfig
+ );
+ return (
+
+
+
+
+ {num < 10 ? "0" + num : num}
+
+
+
+
+ {text}
+
+
+
+
+ {firstRow.map((product, indx) => (
+
+
+ {secondRow.map((product, indx) => (
+
+
+ {thirdRow.map((product, indx) => (
+
+
+
+ );
+};
+
+export const Header = () => {
+ return (
+ + CodeNight - From Our Previous CodeNight + Meeetups. +
++ The dynamic coding community fuels inspiration through collaborative + learning, teaching, lively debates, and late-night voice chats, creating + an electrifying environment that propels individuals to excel in their + coding journeys. +
+
+
+
+
+ + {product.title} +
++ Lets put a face on late night voice chats for wee hours and roasts +
++ The dynamic coding community fuels inspiration through collaborative learning, teaching, lively debates, and late-night voice chats, creating an electrifying environment that propels individuals to excel in their coding journeys. + + + + + + +
+-
+ {videos.map((video) => (
+
-
+ ++++ +
+ + {video.title} +
+{video.description}
+
+ ))}
+
+
+
+
+
+
+
+ {/*
+
+
+
+
+
+
+ 
+
+
+
+
+
+
+
+ 
+
+
+
+
+
+ 
+
+
+
+
+
+
+
+ 
+
+
+
+
+
+ 
+
+
+
+
+
+
+ {/*
+
+
+
+
+ Putting Faces
+
+
+
+ + Puting a face on late + night voice chats. +
++ A book and video course that teaches you how to design your own + icons from scratch. +
+
+
+
+
+
+
+
+ );
+}
diff --git a/components/events/register-popup.tsx b/components/events/register-popup.tsx
new file mode 100644
index 0000000..c7d2589
--- /dev/null
+++ b/components/events/register-popup.tsx
@@ -0,0 +1,498 @@
+"use client";
+import { Button } from "@/components/ui/button";
+import {
+ Dialog,
+ DialogContent,
+ DialogDescription,
+ DialogFooter,
+ DialogHeader,
+ DialogTitle,
+ DialogTrigger,
+} from "@/components/ui/dialog";
+import { Input } from "@/components/ui/input";
+import { Label } from "@/components/ui/label";
+import { SectionHeading } from "./section-heading";
+import { Textarea } from "../ui/textarea";
+import * as React from "react";
+
+import { zodResolver } from "@hookform/resolvers/zod";
+
+import {
+ Select,
+ SelectContent,
+ SelectGroup,
+ SelectItem,
+ SelectLabel,
+ SelectTrigger,
+ SelectValue,
+} from "@/components/ui/select";
+import { z } from "zod";
+import { useForm } from "react-hook-form";
+import { toast } from "../ui/use-toast";
+import {
+ Form,
+ FormControl,
+ FormDescription,
+ FormField,
+ FormItem,
+ FormLabel,
+ FormMessage,
+} from "@/components/ui/form";
+import { Loader } from "lucide-react";
+import { registerDevs } from "@/actions/meetup";
+const GENDER_ENUMS = ["male", "female"];
+const FASTING_ENUMS = ["yes", "no"];
+const PHONE_REGEX = new RegExp(
+ /^([+]?[\s0-9]+)?(\d{3}|[(]?[0-9]+[)])?([-]?[\s]?[0-9])+$/
+);
+const RegisterSchema = z.object({
+ email: z
+ .string({
+ required_error: "Please select an email to display.",
+ })
+ .email(),
+ firstName: z.string().min(2, {
+ message: "First name must be more than 2 character.",
+ }),
+ lastName: z.string().min(2, {
+ message: "Last name must be more than 2 character.",
+ }),
+ gender: z.string({
+ required_error: "Please select a gender.",
+ }),
+ fasting: z.string({
+ required_error: "Please select an options for fasting.",
+ }),
+ status: z.string({
+ required_error: "Please select an options for your status.",
+ }),
+ other: z.string({
+ required_error: "Please select an options for your profession.",
+ }),
+
+ profession: z.string().optional(),
+ // other: z.string({
+ // required_error: "Please select an options for your profession.",
+ // }),
+
+ comment: z.string().min(2, {
+ message: "The comment should be more than 2 characters",
+ }),
+ phone: z.string().regex(PHONE_REGEX, {
+ message: "Invalid phone number",
+ }),
+
+});
+export function Register() {
+ const [pending, startTransition] = React.useTransition();
+ const [otherProfession, setOtherProfession] = React.useState(false);
+ const form = useForm
+
+
+ Orgaanizers
+
+ + The Beautifull individuals behind. +
++ W’re a dynamic group of individuals who are passionate about what we + do. +
+-
+ {people.map((person) => (
+
-
+
+
+ {person.name} +
+{person.role}
+-
+
- + + X + + + +
- + + LinkedIn + + + +
+ ))}
+
+
+
+ {day.date}
+
+ ),
+ }}
+ />
+
+ ))}
+
+ )}
+ + +
++ {day.summary} +
+ + ) +} + +function TimeSlots({ day, className }: { day: Day; className?: string }) { + return ( +-
+ {day.timeSlots.map((timeSlot, timeSlotIndex) => (
+
-
+ {timeSlotIndex > 0 && (
+
+ )}
+
+ {timeSlot.name} +
+ {timeSlot.description && ( ++ {timeSlot.description} +
+ )} ++ {' '} + -{' '} + {' '} + PST +
+
+ ))}
+
+ {schedule.map((day) => (
+
+
+ ))}
+
+ )
+}
+
+export function Schedule() {
+ return (
+
+
+ + The schedule where all the magic happens with amazing perks and networking events +
++ The worst people in our industry giving the best talks you’ve ever + seen. Nothing will be recorded and every attendee has to sign an NDA + to watch the talks. +
+
+
+
+
+ + + + + {children} + +
+ ) +} diff --git a/components/events/speakers.tsx b/components/events/speakers.tsx new file mode 100644 index 0000000..d46c832 --- /dev/null +++ b/components/events/speakers.tsx @@ -0,0 +1,292 @@ +"use client"; + +import { useEffect, useId, useState } from "react"; +import Image from "next/image"; +import { Tab } from "@headlessui/react"; +import clsx from "clsx"; + +import { Wrapper } from "./wrapper"; +import { DiamondIcon } from "./icons/diamond"; + +import { SectionHeading } from "./section-heading"; + +const days = [ + { + name: "Morning", + date: "April 14", + dateTime: "2022-04-04", + speakers: [ + { + name: "Thoe T3", + role: "Full time OSS & Youtube", + image: "https://media.licdn.com/dms/image/C4E03AQFLmpgLbJlfEw/profile-displayphoto-shrink_800_800/0/1595719913998?e=2147483647&v=beta&t=3E98YHVAzIg17LHqpYU3MJJ70sWr6NDKzj9kEdji2ng", + }, + { + name: "The Rustaceans", + role: "Full time father & wife", + image: "https://yt3.googleusercontent.com/ytc/AIdro_lJ1PfKn5Fj0Fg1cgdkF7RTSCELyz_MbTiNuXVe=s900-c-k-c0x00ffffff-no-rj", + }, + { + name: "Dianne Guilianelli", + role: "Creator of RSC", + image: "https://2018.jsconf.is/334be4f4b98a948a0ce4dcdad0774aa5.jpg", + }, + { + name: "Rich Harris", + role: "Svelte Man", + image: "https://pbs.twimg.com/profile_images/557940120184041473/bFyXy8Pu_400x400.jpeg", + }, + { + name: "Erhart Cockrin", + role: "Product Lead at Cyberdyne Systems", + image: "https://pbs.twimg.com/profile_images/557940120184041473/bFyXy8Pu_400x400.jpeg", + + }, + { + name: "Parker Johnson", + role: "UI Designer at MomCorp", + image: "https://pbs.twimg.com/profile_images/557940120184041473/bFyXy8Pu_400x400.jpeg", + + }, + ], + }, + { + name: "Afternoons", + date: "April 14", + dateTime: "2022-04-05", + speakers: [ + { + name: "Damaris Kimura", + role: "Senior Engineer at OCP", + image: "https://pbs.twimg.com/profile_images/557940120184041473/bFyXy8Pu_400x400.jpeg", + + }, + { + name: "Ibrahim Frasch", + role: "Programmer at Umbrella Corp", + image: "https://pbs.twimg.com/profile_images/557940120184041473/bFyXy8Pu_400x400.jpeg", + + }, + { + name: "Cathlene Burrage", + role: "Frontend Developer at Buy n Large", + image: "https://pbs.twimg.com/profile_images/557940120184041473/bFyXy8Pu_400x400.jpeg", + + }, + { + name: "Rinaldo Beynon", + role: "Data Scientist at Rekall", + image: "https://pbs.twimg.com/profile_images/557940120184041473/bFyXy8Pu_400x400.jpeg", + + }, + { + name: "Waylon Hyden", + role: "DevOps at RDA Corporation", + image: "https://pbs.twimg.com/profile_images/557940120184041473/bFyXy8Pu_400x400.jpeg", + + }, + { + name: "Giordano Sagucio", + role: "Game Developer at Soylent Corp", + image: "https://pbs.twimg.com/profile_images/557940120184041473/bFyXy8Pu_400x400.jpeg", + }, + ], + }, +// { +// name: "Interviews", +// date: "April 6", +// dateTime: "2022-04-06", +// speakers: [ +// { +// name: "Andrew Greene", +// role: "Frontend Developer at Ultratech", +// image: andrewGreeneImage, +// }, +// { +// name: "Heather Terry", +// role: "Backend Developer at Xanatos Enterprises", +// image: heatherTerryImage, +// }, +// { +// name: "Piers Wilkins", +// role: "Full stack Developer at BiffCo", +// image: piersWilkinsImage, +// }, +// { +// name: "Gordon Sanderson", +// role: "Mobile Developer at Cobra Industries", +// image: gordonSandersonImage, +// }, +// { +// name: "Kimberly Parsons", +// role: "Game Developer at Tyrell Corporation", +// image: kimberlyParsonsImage, +// }, +// { +// name: "Richard Astley", +// role: "CEO at Roll Out", +// image: richardAstley, +// }, +// ], +// }, +]; + +function ImageClipPaths({ + id, + ...props +}: React.ComponentPropsWithoutRef<"svg"> & { id: string }) { + return ( + + ); +} + +export function Speakers() { + let id = useId(); + let [tabOrientation, setTabOrientation] = useState("horizontal"); + + useEffect(() => { + let lgMediaQuery = window.matchMedia("(min-width: 1024px)"); + + function onMediaQueryChange({ matches }: { matches: boolean }) { + setTabOrientation(matches ? "vertical" : "horizontal"); + } + + onMediaQueryChange(lgMediaQuery); + lgMediaQuery.addEventListener("change", onMediaQueryChange); + + return () => { + lgMediaQuery.removeEventListener("change", onMediaQueryChange); + }; + }, []); + + return ( +
+
+ + Speakers +
++ Learn from the experts on the cutting-edge of deception at the most + sinister companies. +
+
+
+
+ {({ selectedIndex }) => (
+ <>
+ {days.map((day, dayIndex) => (
+
+
+
+
+ ))}
+
+ )}
+
+
+
+
+
+ {day.name}
+
+
+
+
+
+ ))}
+
+
+
+
+
+ + {speaker.name} +
++ {speaker.role} +
+
+
+
+
+
+
+
+ + Gold Level Sponsors. +
++ +
+
+
+
+
+
+
+
+ Sponsors 01
+
+
+
+ + Guillermo Rauch – + CEO - Vercel and LinkedIn +
++ I’ve been designing icons professionally for over a decade and + have worked with dozens of the biggest brands to create custom + sets for their products. I’m an accomplished conference speaker, + and have been teaching icon design workshops every month for the + last three years. I’ve worked with designers of all skill levels + and honed my way of teaching to really click for anyone who has + the itch to start designing their own icons. +
+
+
+
+
+ )
+ }
+
\ No newline at end of file
diff --git a/components/events/upcoming-events.tsx b/components/events/upcoming-events.tsx
new file mode 100644
index 0000000..4ab716c
--- /dev/null
+++ b/components/events/upcoming-events.tsx
@@ -0,0 +1,109 @@
+import { BackgroundImage } from "./bg-image";
+import { Button } from "@/components/ui/button";
+import { Wrapper } from "./wrapper";
+import { SectionHeading } from "./section-heading";
+import { Register } from "./register-popup";
+import Link from "next/link";
+
+export function UpcomingEvent() {
+ return (
+
+
+
+
+
+
+ Community
+
+
+
+ CodeNight - Trusted by the
+
+
+
+ CodeNight - Trusted by the
community with Love.
+
+ + A true coding phenomenon that commands respect and awe the community. +
+-
+ {stats.map((stat) => (
+
- {stat.name} +
- {stat.value} +
+
+ ))}
+
+
+ Upcominng Events
+
+
+ );
+}
diff --git a/components/events/wrapper.tsx b/components/events/wrapper.tsx
new file mode 100644
index 0000000..ea48384
--- /dev/null
+++ b/components/events/wrapper.tsx
@@ -0,0 +1,16 @@
+import clsx from 'clsx'
+
+const styles = {
+ xs: 'mx-auto px-4 sm:px-6 md:max-w-2xl md:px-4 lg:px-2',
+ sm: 'mx-auto px-4 sm:px-6 md:max-w-2xl md:px-4 lg:max-w-4xl lg:px-12',
+ md: 'mx-auto px-4 sm:px-6 md:max-w-2xl md:px-4 lg:max-w-5xl lg:px-8',
+ lg: 'mx-auto px-4 sm:px-6 md:max-w-2xl md:px-4 lg:max-w-7xl lg:px-8',
+}
+
+export function Wrapper({
+ size = 'sm',
+ className,
+ ...props
+}: React.ComponentPropsWithoutRef<'div'> & { size?: keyof typeof styles }) {
+ return
+}
diff --git a/components/nav/Nav.tsx b/components/nav/Nav.tsx
index 13e7c1e..04c1725 100644
--- a/components/nav/Nav.tsx
+++ b/components/nav/Nav.tsx
@@ -1,3 +1,4 @@
+// @ts-nocheeck
"use client";
import Link from "next/link";
import { useEffect, useState } from "react";
@@ -10,6 +11,7 @@ import MobileNavItem from "@/components/nav/MobileNavItem";
import { NavigationMenuData } from "@/data";
import { useParams, usePathname } from "next/navigation";
import { cn } from "@/lib/utils";
+import NavItem from "./NavItem";
const Nav = () => {
const [toggle, setToggle] = useState(false);
@@ -84,7 +86,7 @@ const Nav = () => {
return (
+
+ + CodeNight - Codenight Dev 2 In + Person Meetup. +
+
+
+ {/* + The next generation of web users are tech-savvy and suspicious. + They know how to use dev tools, they can detect a phishing scam + from a mile away, and they certainly aren’t accepting any checks + from Western Union. +
++ At CodeNight Dev 2 Meetup you’ll learn about the latest dark + patterns being developed to trick even the smartest visitors, and + you’ll learn how to deploy them without ever being detected. +
+-
+ {[
+ ["Speakers", "18"],
+ ["People Attending", "200"],
+ ["Venue", "ALX"],
+ ["Location", "Addis Ababa"],
+ ["Date", "Apr 14 , 2024"],
+ ].map(([name, value]) => (
+
- {name} +
- + {value} + +
+
+ ))}
+
+
+
+
+
+ 
+
+
+
+
+
+
+
+
+
+
+
+
+
+ 
+
+
+
+
+
+
+
+
+
+
+
+
+
+ 
+
+
+
+
+ + {body} +
+ ) +}) +FormMessage.displayName = "FormMessage" + +export { + useFormField, + Form, + FormItem, + FormLabel, + FormControl, + FormDescription, + FormMessage, + FormField, +} diff --git a/components/ui/input.tsx b/components/ui/input.tsx new file mode 100644 index 0000000..677d05f --- /dev/null +++ b/components/ui/input.tsx @@ -0,0 +1,25 @@ +import * as React from "react" + +import { cn } from "@/lib/utils" + +export interface InputProps + extends React.InputHTMLAttributes
+ {title && {title} }
+ {description && (
+ {description}
+ )}
+
+ {action}
+
-
-
-
-
- - Coming Soon -
-- Stay tuned for more updates -
-
-
-
-
- - Welcome to Codenight Events -
-
-
- - Join us as we bring together passionate individuals from across the - tech landscape to explore cutting-edge technologies. -
- - Explore Upcoming Events - -
-
- - About Codenight Events -
-- At Codenight Events, we believe in - the power of community, curiosity, and collaboration. Our gatherings are - more than just tech meetups they are vibrant hubs of excitement, where - like-minded individuals come together to share stories, reconnect with - old friends, and make new ones. -
-
-
- - Past Meetups -
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- {/* Add more meetup images here */}
-
-
-
-
-
-
- Total Attendees
-500+
-
-
- Total Speakers
-50+
-
-
- Hours of Content
-100+
-
-
- - Highlighted Session -
-
-
-
-
- Get-Together
-- We all learned that the challenges we face are mostly similar, and - networking is an essential approach to overcoming these - challenges.We had fun sharing stories, meeting old friends and new - ones, and challenging our ideas. -
- - Learn More - -
-
- - Subscribe to Our Newsletter -
-- Be the first to know by signing up for our email list. -
-
-
-
-
-
-
- - Up coming events -
-
-
-
-
- Dev Meetup V2
-- Last year, we hosted an amaizzing dev meetup that left us all - buzzing with excitement. we had alot of fun and we learned a lot - from each other. Even we put faces to the usernames and the voices - to the names. -
- - Learn More - --