From bb91f30d43216782d93d850289b57c73b3f25d95 Mon Sep 17 00:00:00 2001 From: chiscookeke11 Date: Sat, 31 May 2025 18:04:02 +0100 Subject: [PATCH 01/10] WIP --- app/page.tsx | 9 +++- components/UserNav.tsx | 50 ++++++++++++++++++ components/UserStats.tsx | 45 ++++++++++++++++ components/analytics/AnalyticsOverview.tsx | 16 ++++++ public/blue-tick.svg | 3 ++ public/logo.svg | 61 ++++++++++++++++++++++ public/user-icon.svg | 9 ++++ 7 files changed, 192 insertions(+), 1 deletion(-) create mode 100644 components/UserNav.tsx create mode 100644 components/UserStats.tsx create mode 100644 components/analytics/AnalyticsOverview.tsx create mode 100644 public/blue-tick.svg create mode 100644 public/logo.svg create mode 100644 public/user-icon.svg diff --git a/app/page.tsx b/app/page.tsx index 304f01b..4255f19 100644 --- a/app/page.tsx +++ b/app/page.tsx @@ -1,5 +1,12 @@ +import AnalyticsOverview from "@/components/analytics/AnalyticsOverview"; import { redirect } from "next/navigation"; export default function Home() { - redirect("/onboard"); + // redirect("/onboard"); + + return ( + <> + + + ) } diff --git a/components/UserNav.tsx b/components/UserNav.tsx new file mode 100644 index 0000000..e5b539e --- /dev/null +++ b/components/UserNav.tsx @@ -0,0 +1,50 @@ +import Image from "next/image" +import Link from "next/link" +import { BiChevronDown } from "react-icons/bi" + + + + + + +export default function UserNav() { + + + + + + + return ( + + ) +} \ No newline at end of file diff --git a/components/UserStats.tsx b/components/UserStats.tsx new file mode 100644 index 0000000..bf54f06 --- /dev/null +++ b/components/UserStats.tsx @@ -0,0 +1,45 @@ +import Image from "next/image"; +import { BsTwitterX } from "react-icons/bs"; +import { FaEllipsis } from "react-icons/fa6"; + + + + + + +export default function UserStats() { + return( +
+ +
+ +
+ +
+ user profile image +
+ + +
+ +
+ +
+

Coiton

+ +
+ + +
+
+ +
+ +
+ + +
+ +
+ ) +} \ No newline at end of file diff --git a/components/analytics/AnalyticsOverview.tsx b/components/analytics/AnalyticsOverview.tsx new file mode 100644 index 0000000..2fce61e --- /dev/null +++ b/components/analytics/AnalyticsOverview.tsx @@ -0,0 +1,16 @@ +import UserNav from "../UserNav"; +import UserStats from "../UserStats"; + + + + + + +export default function AnalyticsOverview() { + return ( + <> + + + + ) +} \ No newline at end of file diff --git a/public/blue-tick.svg b/public/blue-tick.svg new file mode 100644 index 0000000..bcc5ef2 --- /dev/null +++ b/public/blue-tick.svg @@ -0,0 +1,3 @@ + + + diff --git a/public/logo.svg b/public/logo.svg new file mode 100644 index 0000000..73db835 --- /dev/null +++ b/public/logo.svg @@ -0,0 +1,61 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/public/user-icon.svg b/public/user-icon.svg new file mode 100644 index 0000000..5560b4e --- /dev/null +++ b/public/user-icon.svg @@ -0,0 +1,9 @@ + + + + + + + + + From b1f6c25c7ca0cbb75e66b38962eb16c09db3215f Mon Sep 17 00:00:00 2001 From: chiscookeke11 Date: Sat, 31 May 2025 18:44:09 +0100 Subject: [PATCH 02/10] updates --- components/UserStats.tsx | 71 +++++++++++++++++----- components/analytics/AnalyticsOverview.tsx | 41 ++++++++++++- utils/interface.ts | 9 +++ 3 files changed, 104 insertions(+), 17 deletions(-) create mode 100644 utils/interface.ts diff --git a/components/UserStats.tsx b/components/UserStats.tsx index bf54f06..0083a12 100644 --- a/components/UserStats.tsx +++ b/components/UserStats.tsx @@ -1,41 +1,80 @@ +import { SocialLinks } from "@/utils/interface"; import Image from "next/image"; +import Link from "next/link"; import { BsTwitterX } from "react-icons/bs"; import { FaEllipsis } from "react-icons/fa6"; +import { PiPlus } from "react-icons/pi"; +interface UserStatsProps { + projectTags: string[]; + projectDescription: string; + socialLinks: SocialLinks[] +} -export default function UserStats() { - return( + + +export default function UserStats({ projectTags, projectDescription, socialLinks }: UserStatsProps) { + return (
-
- user profile image -
+
+ user profile image +
-
+
-
+
-
-

Coiton

+
+

Coiton

-
- - -
-
+
+ + +
+
-
+
+ {projectTags.map((tag, index) => ( + {tag} + ))} +
+ +

{projectDescription}

+ +
+ {socialLinks.map((link, index) => ( + + ))} + +
+ +
+ + +
+ + + +
+
+

+
+ +
+ +
-
+
diff --git a/components/analytics/AnalyticsOverview.tsx b/components/analytics/AnalyticsOverview.tsx index 2fce61e..479fdea 100644 --- a/components/analytics/AnalyticsOverview.tsx +++ b/components/analytics/AnalyticsOverview.tsx @@ -1,5 +1,8 @@ +import { BsDiscord, BsGlobe, BsTelegram, BsTwitterX } from "react-icons/bs"; import UserNav from "../UserNav"; import UserStats from "../UserStats"; +import { ReactNode } from "react"; +import { SocialLinks } from "@/utils/interface"; @@ -7,10 +10,46 @@ import UserStats from "../UserStats"; export default function AnalyticsOverview() { + + + const projectTags: string[] = [ "DAO", "NFT", "NFT marketplace"] + + const projectDescription: string = "Need a marketplace for your infrastructure? This is the perfect..." + + const socialLinks: SocialLinks[] = [ + { + link: "", + icon: , + }, + { + link: "", + icon: , + }, + { + link: "", + icon: , + }, + { + link: "", + icon: + } + + + + +] + + + + return ( <> - + ) } \ No newline at end of file diff --git a/utils/interface.ts b/utils/interface.ts new file mode 100644 index 0000000..541dac5 --- /dev/null +++ b/utils/interface.ts @@ -0,0 +1,9 @@ +import { ReactNode } from "react"; + + + + +export interface SocialLinks { + link: string, + icon: ReactNode, +} \ No newline at end of file From 693c4c7bd8cf3c90ab7065a3a963a96f02b4119b Mon Sep 17 00:00:00 2001 From: chiscookeke11 Date: Sat, 31 May 2025 19:03:21 +0100 Subject: [PATCH 03/10] fix --- components/UserStats.tsx | 15 +++++++++++---- 1 file changed, 11 insertions(+), 4 deletions(-) diff --git a/components/UserStats.tsx b/components/UserStats.tsx index 0083a12..44e28f1 100644 --- a/components/UserStats.tsx +++ b/components/UserStats.tsx @@ -61,13 +61,20 @@ export default function UserStats({ projectTags, projectDescription, socialLinks -
+
-
-
-

+
+
+ Followers +

8,674

+
+ +
+
+ Token +

TGE Upcoming

From c228d4dcd397376bef3e0c0e20db079691187425 Mon Sep 17 00:00:00 2001 From: chiscookeke11 Date: Sat, 31 May 2025 19:37:08 +0100 Subject: [PATCH 04/10] update --- components/analytics/AnalyticsOverview.tsx | 31 ++++----- components/analytics/AnalyticsSection.tsx | 74 ++++++++++++++++++++++ components/{ => analytics}/UserNav.tsx | 0 components/{ => analytics}/UserStats.tsx | 32 +++++----- public/{user-icon.svg => home-icon.svg} | 0 5 files changed, 106 insertions(+), 31 deletions(-) create mode 100644 components/analytics/AnalyticsSection.tsx rename components/{ => analytics}/UserNav.tsx (100%) rename components/{ => analytics}/UserStats.tsx (66%) rename public/{user-icon.svg => home-icon.svg} (100%) diff --git a/components/analytics/AnalyticsOverview.tsx b/components/analytics/AnalyticsOverview.tsx index 479fdea..b60be5c 100644 --- a/components/analytics/AnalyticsOverview.tsx +++ b/components/analytics/AnalyticsOverview.tsx @@ -1,8 +1,8 @@ import { BsDiscord, BsGlobe, BsTelegram, BsTwitterX } from "react-icons/bs"; -import UserNav from "../UserNav"; -import UserStats from "../UserStats"; -import { ReactNode } from "react"; +import UserNav from "./UserNav"; +import UserStats from "./UserStats"; import { SocialLinks } from "@/utils/interface"; +import AnalyticsSection from "./AnalyticsSection"; @@ -12,44 +12,45 @@ import { SocialLinks } from "@/utils/interface"; export default function AnalyticsOverview() { - const projectTags: string[] = [ "DAO", "NFT", "NFT marketplace"] + const projectTags: string[] = ["DAO", "NFT", "NFT marketplace"] const projectDescription: string = "Need a marketplace for your infrastructure? This is the perfect..." const socialLinks: SocialLinks[] = [ { link: "", - icon: , + icon: , }, { link: "", - icon: , + icon: , }, { link: "", - icon: , + icon: , }, { link: "", - icon: + icon: } -] + ] return ( <> - - + + + ) } \ No newline at end of file diff --git a/components/analytics/AnalyticsSection.tsx b/components/analytics/AnalyticsSection.tsx new file mode 100644 index 0000000..3eb18f3 --- /dev/null +++ b/components/analytics/AnalyticsSection.tsx @@ -0,0 +1,74 @@ +"use client" + +import { useState } from "react" + + + + + + + +export default function AnalyticsSection() { + + + const [displayedSection, setDisplayedSection] = useState("Home") + + + + + return ( +
+ +
+ + + + + + + +
+ + + + + + + +
+ ) +} \ No newline at end of file diff --git a/components/UserNav.tsx b/components/analytics/UserNav.tsx similarity index 100% rename from components/UserNav.tsx rename to components/analytics/UserNav.tsx diff --git a/components/UserStats.tsx b/components/analytics/UserStats.tsx similarity index 66% rename from components/UserStats.tsx rename to components/analytics/UserStats.tsx index 44e28f1..5751045 100644 --- a/components/UserStats.tsx +++ b/components/analytics/UserStats.tsx @@ -25,7 +25,7 @@ export default function UserStats({ projectTags, projectDescription, socialLinks
-
+
user profile image
@@ -52,9 +52,9 @@ export default function UserStats({ projectTags, projectDescription, socialLinks

{projectDescription}

- {socialLinks.map((link, index) => ( - - ))} + {socialLinks.map((link, index) => ( + + ))}
@@ -63,21 +63,21 @@ export default function UserStats({ projectTags, projectDescription, socialLinks
- + -
-
- Followers -

8,674

-
+
+
+ Followers +

8,674

+
-
-
- Token -

TGE Upcoming

-
+
+
+ Token +

TGE Upcoming

+
-
+
diff --git a/public/user-icon.svg b/public/home-icon.svg similarity index 100% rename from public/user-icon.svg rename to public/home-icon.svg From 992e72735f50f40c0563fff05317bac9654cff35 Mon Sep 17 00:00:00 2001 From: chiscookeke11 Date: Sat, 31 May 2025 19:58:59 +0100 Subject: [PATCH 05/10] update --- components/analytics/AnalyticsDisplay.tsx | 12 ++ components/analytics/AnalyticsSection.tsx | 136 +++++++++++----------- components/analytics/HomeSection.tsx | 15 +++ components/analytics/ItemCard.tsx | 27 +++++ public/item-image.svg | 9 ++ 5 files changed, 128 insertions(+), 71 deletions(-) create mode 100644 components/analytics/AnalyticsDisplay.tsx create mode 100644 components/analytics/HomeSection.tsx create mode 100644 components/analytics/ItemCard.tsx create mode 100644 public/item-image.svg diff --git a/components/analytics/AnalyticsDisplay.tsx b/components/analytics/AnalyticsDisplay.tsx new file mode 100644 index 0000000..57bb527 --- /dev/null +++ b/components/analytics/AnalyticsDisplay.tsx @@ -0,0 +1,12 @@ +import ItemCard from "./ItemCard"; + + + + +export default function AnalyticsDisplay() { + return ( +
+ +
+ ) +} \ No newline at end of file diff --git a/components/analytics/AnalyticsSection.tsx b/components/analytics/AnalyticsSection.tsx index 3eb18f3..38fb26d 100644 --- a/components/analytics/AnalyticsSection.tsx +++ b/components/analytics/AnalyticsSection.tsx @@ -1,74 +1,68 @@ -"use client" - -import { useState } from "react" - - - - - +"use client"; +import { useState } from "react"; +import HomeSection from "./HomeSection"; +import AnalyticsDisplay from "./AnalyticsDisplay"; export default function AnalyticsSection() { - - - const [displayedSection, setDisplayedSection] = useState("Home") - - - - - return ( -
- -
- - - - - - - -
- - - - - - - -
- ) -} \ No newline at end of file + const [displayedSection, setDisplayedSection] = useState("Home"); + + const renderDisplayedSection = () => { + switch (displayedSection) { + case "Home": + return ; + case "Analytics": + return ; + default: + return null; + } + }; + + return ( +
+ {/* Nav buttons */} +
+ + + +
+ + {/* Section content */} +
{renderDisplayedSection()}
+
+ ); +} diff --git a/components/analytics/HomeSection.tsx b/components/analytics/HomeSection.tsx new file mode 100644 index 0000000..1afac7e --- /dev/null +++ b/components/analytics/HomeSection.tsx @@ -0,0 +1,15 @@ + + + + + + + + +export default function HomeSection () { + return ( +
+ Home +
+ ) +} \ No newline at end of file diff --git a/components/analytics/ItemCard.tsx b/components/analytics/ItemCard.tsx new file mode 100644 index 0000000..c7341b4 --- /dev/null +++ b/components/analytics/ItemCard.tsx @@ -0,0 +1,27 @@ +import Image from "next/image"; + + + + + +export default function ItemCard() { + return ( +
+
+
+ item image +
+ + + + Live + +
+
+ + +
+ +
+ ) +} \ No newline at end of file diff --git a/public/item-image.svg b/public/item-image.svg new file mode 100644 index 0000000..63664ba --- /dev/null +++ b/public/item-image.svg @@ -0,0 +1,9 @@ + + + + + + + + + From c072cbdac7fdfb56d9e7c8070db35ebdd4167554 Mon Sep 17 00:00:00 2001 From: chiscookeke11 Date: Sat, 31 May 2025 20:04:32 +0100 Subject: [PATCH 06/10] update --- components/analytics/ItemCard.tsx | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/components/analytics/ItemCard.tsx b/components/analytics/ItemCard.tsx index c7341b4..ff0d274 100644 --- a/components/analytics/ItemCard.tsx +++ b/components/analytics/ItemCard.tsx @@ -12,6 +12,12 @@ export default function ItemCard() { item image
+
+

date here

+

to date heere

+ +
+ Live From 147a21fa56b664146833a993830d9a04522a471e Mon Sep 17 00:00:00 2001 From: chiscookeke11 Date: Sun, 1 Jun 2025 01:35:00 +0100 Subject: [PATCH 07/10] update --- app/Analytics-Details/page.tsx | 53 +++++++++++ .../analytics-overview/page.tsx | 21 +++-- app/page.tsx | 10 +-- components/analytics/AnalyticsDisplay.tsx | 14 ++- components/analytics/AnalyticsSection.tsx | 15 +++- components/analytics/ItemCard.tsx | 40 ++++++--- components/analytics/UserNav.tsx | 2 +- components/analytics/UserStats.tsx | 8 +- components/analytics/data.ts | 88 +++++++++++++++++++ package-lock.json | 11 +++ package.json | 1 + public/layer3-icon.svg | 9 ++ public/user-icon.svg | 9 ++ utils/DateFormatter.tsx | 9 ++ utils/interface.ts | 12 +++ 15 files changed, 262 insertions(+), 40 deletions(-) create mode 100644 app/Analytics-Details/page.tsx rename components/analytics/AnalyticsOverview.tsx => app/analytics-overview/page.tsx (70%) create mode 100644 components/analytics/data.ts create mode 100644 public/layer3-icon.svg create mode 100644 public/user-icon.svg create mode 100644 utils/DateFormatter.tsx diff --git a/app/Analytics-Details/page.tsx b/app/Analytics-Details/page.tsx new file mode 100644 index 0000000..f964628 --- /dev/null +++ b/app/Analytics-Details/page.tsx @@ -0,0 +1,53 @@ +import UserNav from "@/components/analytics/UserNav"; +import UserStats from "@/components/analytics/UserStats"; +import { SocialLinks } from "@/utils/interface"; +import { BsDiscord, BsGlobe, BsTelegram, BsTwitterX } from "react-icons/bs"; + + + + + +export default function Page() { + + + const projectTags: string[] = ["DAO", "NFT", "NFT marketplace"] + + const projectDescription: string = "Need a marketplace for your infrastructure? This is the perfect..." + + const socialLinks: SocialLinks[] = [ + { + link: "", + icon: , + }, + { + link: "", + icon: , + }, + { + link: "", + icon: , + }, + { + link: "", + icon: + } + ] + + + + return ( +
+ + +
+ +

DAO Voter

+ +
+
+ ) +} \ No newline at end of file diff --git a/components/analytics/AnalyticsOverview.tsx b/app/analytics-overview/page.tsx similarity index 70% rename from components/analytics/AnalyticsOverview.tsx rename to app/analytics-overview/page.tsx index b60be5c..ec1d2fb 100644 --- a/components/analytics/AnalyticsOverview.tsx +++ b/app/analytics-overview/page.tsx @@ -1,15 +1,17 @@ -import { BsDiscord, BsGlobe, BsTelegram, BsTwitterX } from "react-icons/bs"; -import UserNav from "./UserNav"; -import UserStats from "./UserStats"; +import AnalyticsSection from "@/components/analytics/AnalyticsSection"; +import { cardData } from "@/components/analytics/data"; +import UserNav from "@/components/analytics/UserNav"; +import UserStats from "@/components/analytics/UserStats"; import { SocialLinks } from "@/utils/interface"; -import AnalyticsSection from "./AnalyticsSection"; +import { BsDiscord, BsGlobe, BsTelegram, BsTwitterX } from "react-icons/bs"; + -export default function AnalyticsOverview() { +export default function Page() { const projectTags: string[] = ["DAO", "NFT", "NFT marketplace"] @@ -33,24 +35,25 @@ export default function AnalyticsOverview() { link: "", icon: } + ] + - ] return ( - <> +
- - + +
) } \ No newline at end of file diff --git a/app/page.tsx b/app/page.tsx index 4255f19..4e72a0b 100644 --- a/app/page.tsx +++ b/app/page.tsx @@ -1,12 +1,4 @@ -import AnalyticsOverview from "@/components/analytics/AnalyticsOverview"; import { redirect } from "next/navigation"; - export default function Home() { - // redirect("/onboard"); - - return ( - <> - - - ) + redirect("/onboard"); } diff --git a/components/analytics/AnalyticsDisplay.tsx b/components/analytics/AnalyticsDisplay.tsx index 57bb527..e8a044c 100644 --- a/components/analytics/AnalyticsDisplay.tsx +++ b/components/analytics/AnalyticsDisplay.tsx @@ -1,12 +1,18 @@ +import { CardProps } from "@/utils/interface"; import ItemCard from "./ItemCard"; +interface AnalyticsDisplayProps{ + data: CardProps[] +} - -export default function AnalyticsDisplay() { +export default function AnalyticsDisplay({data}: AnalyticsDisplayProps) { return ( -
- +
+ {data.map((card, index) => ( + + ))} +
) } \ No newline at end of file diff --git a/components/analytics/AnalyticsSection.tsx b/components/analytics/AnalyticsSection.tsx index 38fb26d..e56362c 100644 --- a/components/analytics/AnalyticsSection.tsx +++ b/components/analytics/AnalyticsSection.tsx @@ -3,16 +3,27 @@ import { useState } from "react"; import HomeSection from "./HomeSection"; import AnalyticsDisplay from "./AnalyticsDisplay"; +import { CardProps } from "@/utils/interface"; -export default function AnalyticsSection() { + + + +interface AnalyticsSectionProps { + data: CardProps[] +} + + +export default function AnalyticsSection({data}: AnalyticsSectionProps) { const [displayedSection, setDisplayedSection] = useState("Home"); + + const renderDisplayedSection = () => { switch (displayedSection) { case "Home": return ; case "Analytics": - return ; + return ; default: return null; } diff --git a/components/analytics/ItemCard.tsx b/components/analytics/ItemCard.tsx index ff0d274..ca449b6 100644 --- a/components/analytics/ItemCard.tsx +++ b/components/analytics/ItemCard.tsx @@ -1,29 +1,47 @@ +import { formatDate } from "@/utils/DateFormatter"; +import { CardProps } from "@/utils/interface"; import Image from "next/image"; +import { BiUser } from "react-icons/bi"; +import { BsDot } from "react-icons/bs"; -export default function ItemCard() { + +interface ItemcardProp { + data: CardProps +} + +export default function ItemCard({ data }: ItemcardProp) { return ( -
+
-
- item image -
+
+
+ item image + {data.participantCount} + + +
+ icon {data.badgeText} +

{data.title}

+
+
+
-

date here

-

to date heere

+

{formatDate(data.startTime)}

+

to {formatDate(data.endTime)}

- - Live - + + {data.isLive ? "Live" : "Completed"} +
-
+
diff --git a/components/analytics/UserNav.tsx b/components/analytics/UserNav.tsx index e5b539e..0842344 100644 --- a/components/analytics/UserNav.tsx +++ b/components/analytics/UserNav.tsx @@ -15,7 +15,7 @@ export default function UserNav() { return ( -
); } diff --git a/components/analytics/ItemCard.tsx b/components/analytics/ItemCard.tsx index ca449b6..b58816d 100644 --- a/components/analytics/ItemCard.tsx +++ b/components/analytics/ItemCard.tsx @@ -20,19 +20,19 @@ export default function ItemCard({ data }: ItemcardProp) {
item image - {data.participantCount} + {data.participantCount}
icon {data.badgeText} -

{data.title}

+

{data.title}

-

{formatDate(data.startTime)}

-

to {formatDate(data.endTime)}

+

{formatDate(data.startTime)}

+

to {formatDate(data.endTime)}

diff --git a/components/analytics/UserNav.tsx b/components/analytics/UserNav.tsx index 0842344..3358f48 100644 --- a/components/analytics/UserNav.tsx +++ b/components/analytics/UserNav.tsx @@ -15,21 +15,21 @@ export default function UserNav() { return ( -