-
-
-
-
+
+ {/* Centered Logo */}
+
+
+
+
+
+
+ Join Discord
+
+
+ {/* Search Bar */}
+ {/*
+
+
+
-
-
- );
-};
+
+ )
+}
+
+export default NavBar
diff --git a/src/components/profile/ApiSection.module.css b/src/components/profile/ApiSection.module.css
new file mode 100644
index 0000000..74cb9a8
--- /dev/null
+++ b/src/components/profile/ApiSection.module.css
@@ -0,0 +1,66 @@
+.title {
+ font-size: 24px;
+ font-weight: 600;
+ color: #242424;
+ padding: 24px 0px 10px;
+ margin: 0 24px;
+}
+
+.buttonParent {
+ display: flex;
+ flex-direction: row;
+ align-items: center;
+ gap: 12px;
+ width: calc(100% - 48px);
+ margin: 0 24px;
+}
+
+.button {
+ border-radius: 14px;
+ background-color: #f98c13;
+ height: 38px;
+ overflow: hidden;
+ display: flex;
+ flex-direction: row;
+ align-items: center;
+ justify-content: center;
+ padding: 8px 0px;
+ box-sizing: border-box;
+ max-width: 300px;
+ transition: all 0.2s ease;
+ cursor: pointer;
+}
+
+.checkoutButton {
+ background-color: #FF4463;
+ margin-left: auto;
+}
+
+.button.active {
+ background-color: #f98c13;
+}
+
+.button:hover {
+ transform: translateY(-1px);
+ box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
+}
+
+.text {
+ position: relative;
+ line-height: 22px;
+ font-weight: 600;
+ margin: 0 14px;
+ color: #fff;
+}
+
+@media (max-width: 768px) {
+ .buttonParent {
+ width: calc(100% - 48px);
+ margin: 0 24px;
+ flex-wrap: wrap;
+ }
+
+ .checkoutButton {
+ margin-left: 0;
+ }
+}
diff --git a/src/components/profile/ApiSection.tsx b/src/components/profile/ApiSection.tsx
new file mode 100644
index 0000000..5ebe208
--- /dev/null
+++ b/src/components/profile/ApiSection.tsx
@@ -0,0 +1,47 @@
+import { FC } from 'react';
+import { useRouter } from 'next/router';
+import styles from './ApiSection.module.css';
+
+export const ApiSection: FC = () => {
+ const router = useRouter();
+
+ const handleNavigateToSaas = () => {
+ router.push('/saas');
+ };
+
+ const handleNavigateToEliza = () => {
+ router.push('/eliza');
+ };
+
+ const handleNavigateToCheckout = () => {
+ router.push('/eliza'); // Points to eliza/index
+ };
+
+ return (
+
+ );
+};
+
+export default ApiSection;
diff --git a/src/components/profile/ProfileData.module.css b/src/components/profile/ProfileData.module.css
new file mode 100644
index 0000000..f31eb4c
--- /dev/null
+++ b/src/components/profile/ProfileData.module.css
@@ -0,0 +1,92 @@
+.container {
+ width: 100%;
+ display: flex;
+ justify-content: center;
+ padding: 14px 24px;
+ max-width: 800px;
+ margin: 0 auto;
+}
+
+.profileContainer {
+ display: flex;
+ align-items: center;
+ flex-direction: column;
+ gap: 16px;
+}
+
+.userInfo {
+ display: flex;
+ flex-direction: column;
+ gap: 4px;
+ justify-content: center;
+}
+
+.userName {
+ font-family: 'SF Compact Round', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
+ font-size: 28px;
+ font-weight: 600;
+ color: #fff;
+ margin: 0;
+}
+
+.userRole {
+ font-family: 'SF Compact Round', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
+ font-size: 18px;
+ font-weight: 600;
+ color: #7E7E7E;
+}
+
+.imageContainer {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ width: 120px;
+ height: 120px;
+}
+
+.profileImage {
+ border-radius: 50%;
+ object-fit: cover;
+ width: 100%;
+ height: 100%;
+}
+
+.signOutButton {
+ background-color: #9B8D7D;
+ color: white;
+ font-weight: 600;
+ padding: 8px 16px;
+ border-radius: 14px;
+ font-size: 14px;
+ border: none;
+ cursor: pointer;
+ transition: all 0.2s ease;
+ margin-left: auto;
+ height: 38px;
+ white-space: nowrap;
+}
+
+.signOutButton:hover {
+ background-color: #8a7f71;
+ transform: translateY(-1px);
+ box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
+}
+
+.signOutButton:active {
+ transform: translateY(0);
+ box-shadow: none;
+}
+
+@media (max-width: 768px) {
+ .container {
+ padding: 14px 16px 24px;
+ }
+
+ .userName {
+ font-size: 24px;
+ }
+
+ .userRole {
+ font-size: 16px;
+ }
+}
\ No newline at end of file
diff --git a/src/components/profile/ProfileData.tsx b/src/components/profile/ProfileData.tsx
new file mode 100644
index 0000000..14045ac
--- /dev/null
+++ b/src/components/profile/ProfileData.tsx
@@ -0,0 +1,46 @@
+import { FC } from "react";
+import { useSession, signOut } from "next-auth/react";
+import Image from "next/image";
+import styles from "./ProfileData.module.css";
+
+export const ProfileData: FC = () => {
+ const { data: session } = useSession();
+
+
+
+ // Helper function to determine the user role
+ const getUserRole = () => {
+ if (!session?.user?.connections) return "Partner";
+ if ("telegram" in session.user.connections) return "Telegram";
+ if ("discord" in session.user.connections) return "Discord";
+ return "Partner";
+ };
+
+ return (
+
+
+ {session?.user?.image && (
+
+
+
+ )}
+
+
+ {session?.user?.name || "Anonymous"}
+
+ {getUserRole()}
+
+
+
+ );
+};
+
+export default ProfileData;
diff --git a/src/components/ProfileHoldings.module.css b/src/components/profile/ProfileHoldings.module.css
similarity index 100%
rename from src/components/ProfileHoldings.module.css
rename to src/components/profile/ProfileHoldings.module.css
diff --git a/src/components/ProfileHoldings.tsx b/src/components/profile/ProfileHoldings.tsx
similarity index 100%
rename from src/components/ProfileHoldings.tsx
rename to src/components/profile/ProfileHoldings.tsx
diff --git a/src/components/profile/ProfileTotals.module.css b/src/components/profile/ProfileTotals.module.css
new file mode 100644
index 0000000..2f1e6c0
--- /dev/null
+++ b/src/components/profile/ProfileTotals.module.css
@@ -0,0 +1,108 @@
+.container {
+ width: 100%;
+ /* max-width: 800px; */
+ /* margin: 0 auto; */
+ padding: 24px;
+}
+
+.metricsGrid {
+ display: grid;
+ grid-template-columns: repeat(2, 1fr);
+ gap: 12px;
+}
+
+.metricCard {
+ background: #2D2D2D;;
+ backdrop-filter: blur(4px);
+ border-radius: 24px;
+ padding: 14px;
+ position: relative;
+ overflow: hidden;
+}
+
+.metricCard:first-child {
+ grid-column: 1 / -1;
+ background: #2D2D2D;;
+}
+
+.metricContent {
+ display: flex;
+ align-items: center;
+ gap: 12px;
+ position: relative;
+ z-index: 1;
+}
+
+.metricsAi {
+ color: #7E7E7E;
+ font-size: 14px;
+ font-family: 'SF Compact Round', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
+ font-weight: 500;
+ line-height: 18px;
+}
+
+.metricInfo {
+ display: flex;
+ flex-direction: column;
+ gap: 4px;
+}
+
+.value {
+ font-family: 'SF Compact Round', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
+ font-size: 22px;
+ font-weight: 600;
+}
+
+.trustScorevalue {
+ font-family: 'SF Compact Round', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
+ font-size: 38px;
+ font-weight: 600;
+}
+
+.label {
+ font-family: 'SF Compact Round', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
+ font-size: 16px;
+ font-weight: 600;
+ color: #FFFFFF
+}
+
+.progressBar {
+ position: relative;
+ margin-top: 8px;
+ /* Adds some space between the progress bar and the bottom of the card */
+ height: 12px;
+ /* Slightly thicker to make it stand out */
+ background: #FF4463;
+ /* Set to the specified color */
+ border-radius: 50px;
+ transition: width 0.3s ease;
+}
+
+.progressContainer {
+ position: relative;
+ margin-top: 8px;
+ /* Space between the progress bar and bottom */
+ height: 12px;
+ background: #8B2C45;
+ /* Darker version of #FF4463 */
+ border-radius: 50px;
+}
+
+@media (max-width: 768px) {
+ .container {
+ padding: 16px;
+ }
+
+ .metricsGrid {
+ grid-template-columns: 1fr;
+ }
+
+ .value {
+ font-size: 20px;
+ }
+
+ .metricsAi {
+ font-size: 13px;
+ }
+}
+
diff --git a/src/components/profile/ProfileTotals.tsx b/src/components/profile/ProfileTotals.tsx
new file mode 100644
index 0000000..7d60262
--- /dev/null
+++ b/src/components/profile/ProfileTotals.tsx
@@ -0,0 +1,191 @@
+import type { NextPage } from 'next';
+import { useCallback, useEffect, useState } from 'react';
+import { useWallet } from '@solana/wallet-adapter-react';
+import Image from 'next/image';
+import styles from './ProfileTotals.module.css';
+
+type View = 'profile' | 'holdings';
+
+interface ProfileTotalsProps {
+ onViewChange?: (view: View) => void;
+}
+
+interface MetricsData {
+ trustScore: number | null;
+ successRate: number | null;
+ transparency: number | null;
+ shillingScore: number | null;
+ recommendations: number | null;
+ rank: number | null;
+ totalPartners: number | null;
+ userHoldings: number | null;
+}
+
+const displayMetric = (value: number | null): string => {
+ return value !== null ? value.toString() : "-";
+};
+
+const formatDate = (date: Date): string => {
+ const months = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];
+ const month = months[date.getMonth()];
+ const day = date.getDate();
+ return `${month} ${day}`;
+};
+
+const getLastThirtyDaysRange = (): string => {
+ const end = new Date();
+ const start = new Date();
+ start.setDate(end.getDate() - 30);
+
+ return `${formatDate(start)} - ${formatDate(end)}`;
+};
+
+const ProfileTotals: NextPage
= ({ onViewChange = () => { } }) => {
+ const { publicKey } = useWallet();
+ const [activeView, setActiveView] = useState('profile');
+ const [metrics, setMetrics] = useState({
+ trustScore: null,
+ successRate: null,
+ transparency: null,
+ shillingScore: null,
+ recommendations: null,
+ rank: null,
+ totalPartners: null,
+ userHoldings: null
+ });
+ const [isLoading, setIsLoading] = useState(true);
+
+ useEffect(() => {
+ const fetchData = async () => {
+ if (!publicKey) return;
+
+ try {
+ setIsLoading(true);
+
+ const dashboardResponse = await fetch('/api/dashboard');
+ const dashboardData = await dashboardResponse.json();
+
+ const holdingsResponse = await fetch('/api/userHoldings');
+ const holdingsData = await holdingsResponse.json();
+
+ if (dashboardData.partners && dashboardData.trustScores) {
+ const userPartner = dashboardData.partners.find(
+ (p: any) => p.owner.toLowerCase() === publicKey.toString().toLowerCase()
+ );
+
+ const userRank = userPartner
+ ? dashboardData.partners.findIndex(
+ (p: any) => p.owner.toLowerCase() === publicKey.toString().toLowerCase()
+ ) + 1
+ : 0;
+
+ setMetrics(prev => ({
+ ...prev,
+ trustScore: dashboardData.trustScores[publicKey.toString()] || 0,
+ rank: userRank,
+ totalPartners: dashboardData.partners.length,
+ userHoldings: holdingsData.holdings || 0
+ }));
+ }
+ } catch (error) {
+ console.error('Error fetching data:', error);
+ } finally {
+ setIsLoading(false);
+ }
+ };
+
+ fetchData();
+ }, [publicKey]);
+
+ const handleViewChange = useCallback((view: View) => {
+ setActiveView(view);
+ onViewChange(view);
+ }, [onViewChange]);
+
+ const dateRange = getLastThirtyDaysRange();
+
+ const formatNumber = (num: number): string => {
+ if (num >= 1000000) {
+ return `${(num / 1000000).toFixed(0)}m+`;
+ }
+ return num.toString();
+ };
+
+ if (!isLoading) {
+ return Loading...
;
+ }
+
+ return (
+
+
+
+
+
+
+
+
+
Trust Score
+
Assigned from AI Marc
+
+
+ {/*
{metrics.trustScore}
*/}
+
+
+
+
+
+
+
+
+
+
{displayMetric(metrics.rank)}
+
Rank
+
+
+
+
+ {/*
+
+
+
+
{formatNumber(metrics.userHoldings)}
+
Tokens
+
+
+
*/}
+
+
+
+
+
+
{displayMetric(metrics.successRate)}
+
Success Rate
+
+
+
+
+
+
+
+
+
{displayMetric(metrics.shillingScore)}
+
Shills
+
+
+
+
+
+
+
+
+
{displayMetric(metrics.recommendations)}
+
Joined
+
+
+
+
+
-
Wallets
+
{wallet ? (
= ({ provider }) => {
const { data: session, status } = useSession();
-
+
useEffect(() => {
- console.log('Session updated:', {
+ console.log("Session updated:", {
session,
status,
provider,
- account: session?.user?.connections?.[provider.toLowerCase()]
+ account: session?.user?.connections?.[provider.toLowerCase()],
});
}, [session, status, provider]);
// Check if this provider is the active one
- const isThisProviderActive = !!session?.user?.connections?.[provider.toLowerCase()];
+ const isThisProviderActive =
+ !!session?.user?.connections?.[provider.toLowerCase()];
const handleClick = () => {
if (session) {
@@ -31,19 +32,17 @@ const SocialButton: FC
= ({ provider }) => {
};
return (
-
- {isThisProviderActive
- ? `Disconnect ${provider}`
- : `Connect with ${provider}`}
+ {isThisProviderActive ? `${provider}` : `Connect with ${provider}`}
{isThisProviderActive && session?.user?.name && (
-
- ({session.user.name})
-
+
({session.user.name})
)}
);
@@ -51,21 +50,18 @@ const SocialButton: FC = ({ provider }) => {
export const Socials: FC = () => {
// Commented out GitHub and Twitter, only using Discord for now
- const providers = ['Discord']; // ['GitHub', 'Discord', 'Twitter'];
+ const providers = ["Discord"]; // ['GitHub', 'Discord', 'Twitter'];
return (
-
Socials
+
{providers.map((provider) => (
-
+
))}
+ {highlighted &&
MOST POPULAR
}
+
{name}
+
{credits.toLocaleString()}
+
+ $
+ {price}
+
+
{description}
+
+ {features.map((feature, index) => (
+ -
+ ✓
+ {feature}
+
+ ))}
+
+
+
+
+
Make More Requests
+
Choose the request package that suits your needs
+
+
+ {creditPackages.map((pkg, index) => (
+
+ ))}
+
+
+
{name}
+
+ $
+ {price}
+ /month
+
+
{description}
+
{requestLimit}
+
+ {features.map((feature, index) => (
+ -
+ ✓
+ {feature}
+
+ ))}
+
+
+
+
+
Simple, Transparent Pricing
+
Choose the plan that's right for you
+
+
+ {pricingTiers.map((tier, index) => (
+
+ ))}
+
+
+
Need more?
+
+ Buy Credits
+
+
+
+
+
TOKEN
+
TYPE
+
PRICE
+
PERFORMANCE
+
DATE
+
+ {mockTransactions.map((transaction) => (
+
+
+
+ {transaction.type.toUpperCase()}
+
+
+ ${transaction.price.toFixed(8)}
+
+
+ {formatPerformance(transaction.performance)}
+
+
+ {formatDate(transaction.date)}
+
+
+ ))}
+
+
{title}
+
+ {value.toFixed(2)}
+
+
{description}
+
+
+
+ );
+};
+
+export default TrustScoreChart;
\ No newline at end of file
diff --git a/src/hooks/useDashboard.ts b/src/hooks/useDashboard.ts
new file mode 100644
index 0000000..536c02a
--- /dev/null
+++ b/src/hooks/useDashboard.ts
@@ -0,0 +1,55 @@
+import { useState, useEffect } from 'react';
+import { get } from '../utils/axios';
+
+const fetchHighestRankedUsers = async () => {
+ console.log("sdasdsdadasd=?????????");
+
+ try {
+ const response = await get('/user/highestRankedUsers');
+ return response.data;
+ } catch (error) {
+ console.error('Error fetching highest ranked users:', error);
+ throw error;
+ }
+};
+
+
+
+interface Partner {
+ trustScore: number;
+ avatarUrl?: string;
+ rank?:number
+ id?: string;
+ name?: string;
+}
+
+interface DashboardData {
+ partners: Partner[];
+}
+
+export const useDashboard = () => {
+ const [data, setData] = useState(null);
+ const [isLoading, setIsLoading] = useState(true);
+ const [error, setError] = useState(null);
+
+ useEffect(() => {
+ const fetchDashboard = async () => {
+ try {
+ const partners = await fetchHighestRankedUsers();
+
+
+ setData({partners});
+ } catch (err) {
+ setError(err instanceof Error ? err : new Error('Failed to fetch dashboard data'));
+ } finally {
+ setIsLoading(false);
+ }
+ };
+
+ fetchDashboard();
+ }, []);
+
+
+
+ return { data, isLoading, error };
+};
\ No newline at end of file
diff --git a/src/pages/_app.tsx b/src/pages/_app.tsx
index e9c7db0..4ab05e9 100644
--- a/src/pages/_app.tsx
+++ b/src/pages/_app.tsx
@@ -1,51 +1,56 @@
-import { AppProps } from 'next/app';
-import Head from 'next/head';
-import { FC } from 'react';
-import { SessionProvider } from 'next-auth/react'; // Import SessionProvider
-import { ContextProvider } from '../contexts/ContextProvider';
-import { AppBar } from '../components/nav-element/NavBar';
-import { ContentContainer } from '../components/ContentContainer';
-import { Footer } from '../components/Footer';
-import Notifications from '../components/Notification';
-import '../styles/profile.css'; // Adjust the path based on your project structure.
-require('@solana/wallet-adapter-react-ui/styles.css');
-require('../styles/globals.css');
+import { AppProps } from "next/app"
+import Head from "next/head"
+import Script from "next/script"
+import { FC } from "react"
+import { SessionProvider } from "next-auth/react"
+import { ContextProvider } from "../contexts/ContextProvider"
+import NavBar from "../components/nav-element/NavBar"
+import { ContentContainer } from "../components/ContentContainer"
+import Notifications from "../components/Notification"
+import "../styles/profile.css" // Adjust the path based on your project structure.
+require("@solana/wallet-adapter-react-ui/styles.css")
+require("../styles/globals.css")
-import { WalletAdapterNetwork } from '@solana/wallet-adapter-base';
+import { WalletAdapterNetwork } from "@solana/wallet-adapter-base"
import {
ConnectionProvider,
- WalletProvider
-} from '@solana/wallet-adapter-react';
+ WalletProvider,
+} from "@solana/wallet-adapter-react"
import {
PhantomWalletAdapter,
- SolflareWalletAdapter
-} from '@solana/wallet-adapter-wallets';
+ SolflareWalletAdapter,
+} from "@solana/wallet-adapter-wallets"
-const wallets = [
- new PhantomWalletAdapter(),
- new SolflareWalletAdapter()
-];
+const wallets = [new PhantomWalletAdapter(), new SolflareWalletAdapter()]
const App: FC = ({ Component, pageProps }) => {
- return (
- {/* Wrap everything in SessionProvider */}
-
- ai16z Partners Lounge
-
+ return (
+
+
+ ai16z Partners Lounge
+
-
-
-
-
- );
-};
+