8 | {number}
9 |
10 | );
11 | };
12 |
13 | export default CircleNumber;
14 |
--------------------------------------------------------------------------------
/src/app/features/user/getOtp.ts:
--------------------------------------------------------------------------------
1 | // /auth/otp
2 |
3 | import { axios } from '@/lib/axios';
4 | import { useQuery } from '@tanstack/react-query';
5 | import { AxiosResponse } from 'axios';
6 |
7 | export const getOtp = async (): Promise
9 |
10 | Login Page
11 |
12 | {children}
13 |
14 | );
15 | };
16 |
17 | export default LoginLayout;
18 |
--------------------------------------------------------------------------------
/src/app/constants/Routes.ts:
--------------------------------------------------------------------------------
1 | export const Routes = {
2 | Home: '/',
3 | Welcome: '/welcome',
4 | Intro: '/intro',
5 | Categories: '/categories',
6 | Badges: '/badges',
7 | Connect: '/connect',
8 | ConnectOtp: '/connect/otp',
9 | ConnectSuccess: '/connect/otp/success',
10 | LinkX: 'https://twitter.com/Pairwisevote',
11 | LinkGithub: 'https://github.com/GeneralMagicio/pairwise-RPGF4',
12 | LinkParagraph: 'https://paragraph.xyz/@pairwise',
13 | };
14 |
--------------------------------------------------------------------------------
/src/app/login/components/ErrorBox.tsx:
--------------------------------------------------------------------------------
1 | import { ErrorBoxX } from 'public/images/icons/ErrorBoxX';
2 | import { FC } from 'react';
3 |
4 | interface Props {
5 | message: string;
6 | }
7 |
8 | export const ErrorBox: FC
11 |
13 | );
14 | };
15 |
--------------------------------------------------------------------------------
/public/images/icons/IconCancel.tsx:
--------------------------------------------------------------------------------
1 | const IconCancel = () => {
2 | return (
3 |
18 | );
19 | };
20 |
21 | export default IconCancel;
22 |
--------------------------------------------------------------------------------
/src/app/login/components/BackHeader.tsx:
--------------------------------------------------------------------------------
1 | import IconArrowLeft from 'public/images/icons/IconArrowLeft';
2 | import { FC } from 'react';
3 |
4 | interface Props {
5 | onClick: () => void;
6 | }
7 |
8 | export const BackHeader: FC
11 |
13 | );
14 | };
15 |
--------------------------------------------------------------------------------
/public/images/icons/IconCheck.tsx:
--------------------------------------------------------------------------------
1 | const IconCheck = ({ color = 'white', size = '24' }: IIconProps) => {
2 | return (
3 |
18 | );
19 | };
20 |
21 | export default IconCheck;
22 |
--------------------------------------------------------------------------------
/src/app/login/components/SuccessBox.tsx:
--------------------------------------------------------------------------------
1 | import { SuccessBoxIcon } from 'public/images/icons/SuccessBoxIcon';
2 | import { FC } from 'react';
3 |
4 | interface Props {
5 | message: string;
6 | }
7 |
8 | export const SuccessBox: FC
14 |
16 | );
17 | };
18 |
--------------------------------------------------------------------------------
/src/app/login/components/bouncing-dots/DotsLoader.tsx:
--------------------------------------------------------------------------------
1 | import React, { useEffect, useState } from 'react';
2 |
3 | export const DotsLoader = () => {
4 | const [dots, setDots] = useState
14 | {Array.from(Array(dots)).map((dot, index) => (
15 |
18 | );
19 | };
20 |
--------------------------------------------------------------------------------
/public/images/icons/IconArrowLeft.tsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 |
3 | const IconArrowLeft: React.FC = () => {
4 | return (
5 |
20 | );
21 | };
22 |
23 | export default IconArrowLeft;
24 |
--------------------------------------------------------------------------------
/src/app/connect/components/ConnectErrorBox.tsx:
--------------------------------------------------------------------------------
1 | import IconWarning from 'public/images/icons/IconWarning';
2 | import { FC } from 'react';
3 |
4 | interface Props {
5 | message: string;
6 | }
7 |
8 | export const ConnectErrorBox: FC.
16 | ))}
17 |
11 |
16 | );
17 | };
18 |
--------------------------------------------------------------------------------
/src/app/features/categories/getCategories.ts:
--------------------------------------------------------------------------------
1 | import { ICategory } from '@/app/categories/types';
2 | import { axios } from '@/lib/axios';
3 | import { useQuery } from '@tanstack/react-query';
4 | import { AxiosResponse } from 'axios';
5 |
6 | export const getCategories = async (): Promise
12 |
14 | {message}
15 |
6 |
7 |
8 | );
9 | };
10 |
11 | export const ButtonLoadingSpinner = () => {
12 | return (
13 |
14 | );
15 | };
16 |
17 | export default LoadingSpinner;
18 |
--------------------------------------------------------------------------------
/src/app/connect/layout.tsx:
--------------------------------------------------------------------------------
1 | 'use client';
2 |
3 | import React, { ReactNode } from 'react';
4 |
5 | import ConnectHeader from './components/ConnectHeader';
6 | import ConnectFooter from './components/ConnectFooter';
7 |
8 | const ConnectLayout = ({ children }: { children: ReactNode }) => {
9 | return (
10 |
11 |
15 | );
16 | };
17 |
18 | export default ConnectLayout;
19 |
--------------------------------------------------------------------------------
/src/app/reset/page.tsx:
--------------------------------------------------------------------------------
1 | 'use client';
2 |
3 | import { axios } from '@/lib/axios';
4 | import React from 'react';
5 | import Button from '../components/Button';
6 |
7 | const ResetPage = () => {
8 | const onReset = async () => {
9 | await axios.get('/flow/temp-reset-inclusions');
10 | };
11 | return (
12 | {children}
13 |
13 |
16 |
17 | );
18 | };
19 |
20 | export default ResetPage;
21 |
--------------------------------------------------------------------------------
/src/app/providers/PostHogProvider.tsx:
--------------------------------------------------------------------------------
1 | 'use client';
2 |
3 | import { ReactNode } from 'react';
4 | import posthog from 'posthog-js';
5 | import { PostHogProvider } from 'posthog-js/react';
6 |
7 | posthog.init(process.env.NEXT_PUBLIC_POST_HOG_API!, {
8 | api_host:
9 | process.env.NEXT_PUBLIC_POST_HOG_HOST || 'https://us.i.posthog.com',
10 | autocapture: false,
11 | });
12 |
13 | export default function PHProvider({ children }: { children: ReactNode }) {
14 | return
6 |
17 | );
18 | };
19 |
--------------------------------------------------------------------------------
/src/app/categories/layout.tsx:
--------------------------------------------------------------------------------
1 | 'use client';
2 |
3 | import React, { ReactNode } from 'react';
4 | import Header from '../components/Header'; // Adjust the path as necessary
5 | import { useParams } from 'next/navigation';
6 |
7 | const CategoriesLayout = ({ children }: { children: ReactNode }) => {
8 | const params = useParams();
9 |
10 | console.log('params', params);
11 |
12 | return (
13 | 13 | Account verified successfully 14 |
15 |Hodl! Logging in...
16 |
14 | {!params.categoryId &&
17 | );
18 | };
19 |
20 | export default CategoriesLayout;
21 |
--------------------------------------------------------------------------------
/src/app/connect/components/ConnectHeader.tsx:
--------------------------------------------------------------------------------
1 | 'use client';
2 |
3 | import Image from 'next/image';
4 | import ConnectButton from './ConnectButton';
5 |
6 | const ConnectHeader = () => {
7 | return (
8 |
10 |
18 |
10 |
18 | );
19 | };
20 |
21 | export default WelcomePage;
22 |
--------------------------------------------------------------------------------
/.gitignore:
--------------------------------------------------------------------------------
1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
2 |
3 | # dependencies
4 | /node_modules
5 | /.pnp
6 | .pnp.js
7 | .yarn/install-state.gz
8 |
9 | # testing
10 | /coverage
11 |
12 | # next.js
13 | /.next/
14 | /out/
15 |
16 | # production
17 | /build
18 |
19 | # misc
20 | .DS_Store
21 | *.pem
22 | MyNotes.md
23 |
24 | # debug
25 | npm-debug.log*
26 | yarn-debug.log*
27 | yarn-error.log*
28 |
29 | # local env files
30 | .env*.local
31 |
32 | # vercel
33 | .vercel
34 |
35 | # typescript
36 | *.tsbuildinfo
37 | next-env.d.ts
38 |
39 | .env*
40 |
--------------------------------------------------------------------------------
/next.config.mjs:
--------------------------------------------------------------------------------
1 | /** @type {import('next').NextConfig} */
2 | const nextConfig = {
3 | images: {
4 | remotePatterns: [
5 | {
6 | protocol: 'https',
7 | hostname: 'content.optimism.io',
8 | port: '',
9 | pathname: '/profile/v0/profile-image/10/**',
10 | },
11 | {
12 | protocol: 'https',
13 | hostname: 'i.imgur.com',
14 | port: '',
15 | pathname: '/**',
16 | },
17 | {
18 | protocol: 'https',
19 | hostname: 'storage.googleapis.com',
20 | port: '',
21 | pathname: '/**',
22 | },
23 | ],
24 | },
25 | };
26 |
27 | export default nextConfig;
28 |
--------------------------------------------------------------------------------
/public/images/icons/IconAlertCircle.tsx:
--------------------------------------------------------------------------------
1 | const IconAlertCircle = ({ color = '#404454' }: IIconProps) => {
2 | return (
3 |
18 | );
19 | };
20 |
21 | export default IconAlertCircle;
22 |
--------------------------------------------------------------------------------
/src/app/components/ProgressBar.tsx:
--------------------------------------------------------------------------------
1 | interface IProgressBarProps {
2 | progress: number; // progress should be a value between 0 to 100
3 | isMinGreater: boolean;
4 | }
5 |
6 | const ProgressBar: React.FCWelcome to Pairwise
17 |
14 |
18 |
19 | );
20 | };
21 |
22 | export default ProgressBar;
23 |
--------------------------------------------------------------------------------
/src/app/components/TopNavigation.tsx:
--------------------------------------------------------------------------------
1 | import Link from 'next/link';
2 | import IconArrowLeft from 'public/images/icons/IconArrowLeft';
3 |
4 | interface ITopNavigationProps {
5 | link?: string;
6 | text?: string;
7 | }
8 |
9 | const TopNavigation = ({ link = '/', text }: ITopNavigationProps) => {
10 | return (
11 |
12 |
19 | );
20 | };
21 |
22 | export default TopNavigation;
23 |
--------------------------------------------------------------------------------
/src/app/features/categories/getProjectsByCategoryId.ts:
--------------------------------------------------------------------------------
1 | import { IProject } from '@/app/categories/types';
2 | import { axios } from '@/lib/axios';
3 | import { useQuery } from '@tanstack/react-query';
4 | import { AxiosResponse } from 'axios';
5 |
6 | export const getProjectsByCategoryId = async (
7 | id: number,
8 | ): Promise
13 |
14 |
18 | {text}
17 |
6 |
16 | Your journey to direct the Superchain
19 |
21 | );
22 | };
23 |
--------------------------------------------------------------------------------
/src/app/features/categories/getCategoryById.ts:
--------------------------------------------------------------------------------
1 | import { CollectionProgressStatus, ICategory } from '@/app/categories/types';
2 | import { axios } from '@/lib/axios';
3 | import { useQuery } from '@tanstack/react-query';
4 | import { AxiosResponse } from 'axios';
5 |
6 | interface ICategoryResponse {
7 | collection: ICategory;
8 | progress: CollectionProgressStatus;
9 | }
10 |
11 | export const getCategoryById = async (
12 | id: number,
13 | ): Promise13 | Pairwise Passport Verified! 14 |
15 |
16 | Your journey to direct the Superchain
through RetroPGF
17 | begins.
18 |
19 | Hodl! Logging in...
20 |
19 |
24 | {`You must keep at least ${minimum} projects to proceed.`}
20 | 23 |
12 |
25 | );
26 | };
27 |
28 | export default WelcomeLayout;
29 |
--------------------------------------------------------------------------------
/src/app/features/categories/updateProjectInclusion.ts:
--------------------------------------------------------------------------------
1 | import { InclusionState } from '@/app/categories/types';
2 | import { axios } from '@/lib/axios';
3 | import { useMutation, useQueryClient } from '@tanstack/react-query';
4 |
5 | type ProjectInclusionData = {
6 | data: {
7 | state: InclusionState;
8 | id: number; //project id
9 | };
10 | };
11 |
12 | export const updateProjectInclusion = ({ data }: ProjectInclusionData) => {
13 | return axios.post('/flow/projects/set-inclusion', data);
14 | };
15 |
16 | export const useUpdateProjectInclusion = ({
17 | categoryId,
18 | }: {
19 | categoryId: number;
20 | }) => {
21 | const queryClient = useQueryClient();
22 |
23 | return useMutation({
24 | mutationFn: updateProjectInclusion,
25 | onSuccess: () => {
26 | queryClient.refetchQueries({
27 | queryKey: ['projects', categoryId],
28 | });
29 | },
30 | });
31 | };
32 |
--------------------------------------------------------------------------------
/src/app/intro/layout.tsx:
--------------------------------------------------------------------------------
1 | 'use client';
2 |
3 | import Button from '@/app/components/Button';
4 | import { useRouter } from 'next/navigation';
5 | import React, { ReactNode } from 'react';
6 | import { Routes } from '../constants/Routes';
7 |
8 | const IntroLayout = ({ children }: { children: ReactNode }) => {
9 | const router = useRouter();
10 | return (
11 |
13 | {children}
14 |
15 |
16 |
17 |
23 |
24 |
12 |
25 | );
26 | };
27 |
28 | export default IntroLayout;
29 |
--------------------------------------------------------------------------------
/public/images/icons/IconMove.tsx:
--------------------------------------------------------------------------------
1 | const IconMove = () => {
2 | return (
3 |
25 | );
26 | };
27 |
28 | export default IconMove;
29 |
--------------------------------------------------------------------------------
/public/images/icons/Edit2.tsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 |
3 | export const Edit2: React.FC = () => {
4 | return (
5 |
20 | );
21 | };
22 |
--------------------------------------------------------------------------------
/src/app/connect/otp/no-badge/page.tsx:
--------------------------------------------------------------------------------
1 | import Image from 'next/image';
2 |
3 | const ConnectNoBadgePage = () => {
4 | return (
5 |
13 | {children}
14 |
15 |
16 |
17 |
23 |
24 |
6 |
28 | );
29 | };
30 |
31 | export default ConnectNoBadgePage;
32 |
--------------------------------------------------------------------------------
/src/app/providers/TanstackProvider.tsx:
--------------------------------------------------------------------------------
1 | 'use client';
2 |
3 | import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
4 | import { ReactQueryDevtools } from '@tanstack/react-query-devtools';
5 | import { ReactNode, useEffect } from 'react';
6 |
7 | const TanstackProvider = ({ children }: { children: ReactNode }) => {
8 | const queryClient = new QueryClient();
9 |
10 | useEffect(() => {
11 | const handleFocus = () => {
12 | queryClient.invalidateQueries({ queryKey: ['badges'] });
13 | };
14 |
15 | window.addEventListener('focus', handleFocus);
16 |
17 | return () => {
18 | window.removeEventListener('focus', handleFocus);
19 | };
20 | }, []);
21 |
22 | return (
23 |
7 |
15 |
16 |
27 | 17 | No Badges Found! 18 |
19 |20 | Looks like you don’t have any badges to Collect Voting 21 | Power. 22 |
23 |24 | Try connecting with a different wallet instead? 25 |
26 |
6 |
22 | );
23 | };
24 |
25 | export default CategoryRewaredBanner;
26 |
--------------------------------------------------------------------------------
/src/app/categories/components/CategoryProjectItem.tsx:
--------------------------------------------------------------------------------
1 | import Image from 'next/image';
2 | import { IProject } from '../types';
3 |
4 | interface ICategoriesProjectItemProps {
5 | project: IProject;
6 | }
7 |
8 | const CategoryProjectItem = ({ project }: ICategoriesProjectItemProps) => {
9 | return (
10 |
7 |
21 |
8 |
15 |
16 |
19 |
20 | 9 | You've got a chance to claim OP! Click "Check 10 | Eligibility" to see if you're eligible. 11 | Don't forget to review your badge group and check 12 | which raffles you can enter. 13 |
14 |
11 |
30 | );
31 | };
32 |
33 | export default CategoryProjectItem;
34 |
--------------------------------------------------------------------------------
/src/app/category-ranking/components/CategoryPairwiseModal.tsx:
--------------------------------------------------------------------------------
1 | import Button from '@/app/components/Button';
2 | import Modal from '@/app/components/Modal';
3 | import React from 'react';
4 |
5 | interface Props {
6 | isOpen: boolean;
7 | close: () => void;
8 | handleSubmit: () => void;
9 | }
10 |
11 | export const CategoryPairwiseModal: React.FC
12 | {project.image ? (
13 |
29 |
22 |
26 | )}
27 | 23 | {project.name} 24 |
25 |{project.name}
28 |
19 |
34 | 20 | Category Voting 21 |
22 |23 | Congratulations! You've successfully voted in at least 24 | two categories. Now, it's time to vote for the 25 | categories that overall had more impact! 26 |
27 | 33 |
30 |
,
34 | modalNode,
35 | );
36 | };
37 |
38 | export default Modal;
39 |
--------------------------------------------------------------------------------
/src/lib/third-web/methods.ts:
--------------------------------------------------------------------------------
1 | import { Account, inAppWallet, smartWallet } from 'thirdweb/wallets';
2 | import { LAST_CONNECT_PERSONAL_WALLET_ID } from './constants';
3 | import { client, smartWalletConfig } from './provider';
4 |
5 | export const createEmailEoa = async (
6 | email: string,
7 | verificationCode: string,
8 | ) => {
9 | const wallet = inAppWallet();
10 | await wallet.connect({
11 | client,
12 | strategy: 'email',
13 | email,
14 | verificationCode,
15 | });
16 | localStorage.setItem(LAST_CONNECT_PERSONAL_WALLET_ID, wallet.id);
17 | return wallet;
18 | };
19 |
20 | export const createSocialEoa = async (strategy: 'google' | 'apple') => {
21 | const socialEOA = inAppWallet();
22 | await socialEOA.connect({
23 | client,
24 | strategy,
25 | });
26 | localStorage.setItem(LAST_CONNECT_PERSONAL_WALLET_ID, socialEOA.id);
27 | return socialEOA;
28 | };
29 |
30 | export const createSmartWalletFromEOA = async (eoa: Account) => {
31 | const wallet = smartWallet(smartWalletConfig);
32 | await wallet.connect({
33 | personalAccount: eoa,
34 | client,
35 | });
36 |
37 | return wallet;
38 | };
39 |
--------------------------------------------------------------------------------
/src/app/intro/page.tsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import CircleNumber from '../components/CircleNumber';
3 |
4 | const IntroPage = () => {
5 | return (
6 |
31 | {children}
32 |
33 |
7 |
29 | );
30 | };
31 |
32 | export default IntroPage;
33 |
--------------------------------------------------------------------------------
/public/images/icons/IconCopy.tsx:
--------------------------------------------------------------------------------
1 | const IconCopy = () => {
2 | return (
3 |
18 | );
19 | };
20 |
21 | export default IconCopy;
22 |
--------------------------------------------------------------------------------
/src/app/categories/components/CategoryRankingItem.tsx:
--------------------------------------------------------------------------------
1 | 'use client';
2 |
3 | import Image from 'next/image'; // Make sure to install 'next/image'
4 | import { ICategory } from '../types';
5 | import CategoryBadge from './CategoryBadge';
6 | import { truncate } from '@/app/helpers/text-helpers';
7 |
8 | interface ICategoryProps {
9 | category: ICategory;
10 | }
11 |
12 | const CategoryRankingItem = ({ category }: ICategoryProps) => {
13 | return (
14 | Easy as 1-2-3
8 |
9 |
28 |
10 |
15 | 12 | Select a category to start ranking projects 13 |
14 |
16 |
21 | 18 | Discover projects and filter through them easily 19 |
20 |
22 |
27 | 24 | Finally, rank them to submit your vote! 25 |
26 |
15 |
34 | );
35 | };
36 |
37 | export default CategoryRankingItem;
38 |
--------------------------------------------------------------------------------
/src/app/connect/components/ConnectSplashMessage.tsx:
--------------------------------------------------------------------------------
1 | import { isMobile } from 'react-device-detect';
2 | import { useEffect, useState } from 'react';
3 |
4 | const ConnectSplashMessage = () => {
5 | const [open, setOpen] = useState(false);
6 |
7 | useEffect(() => {
8 | setOpen(isMobile);
9 | }, []);
10 |
11 | return (
12 |
27 |
32 | {category.name}
28 |29 | {truncate(category.impactDescription, 55)} 30 |
31 |
13 | {open && (
14 |
34 | );
35 | };
36 |
37 | export default ConnectSplashMessage;
38 |
--------------------------------------------------------------------------------
/src/app/api/rephrase/route.ts:
--------------------------------------------------------------------------------
1 | import axios from 'axios';
2 | import { NextResponse } from 'next/server';
3 |
4 | export async function GET(request: Request) {
5 | const { searchParams } = new URL(request.url);
6 | const comment = searchParams.get('comment');
7 | try {
8 | const response = await axios.post(
9 | 'https://api.openai.com/v1/chat/completions',
10 | {
11 | model: 'gpt-4o-mini',
12 | messages: [
13 | {
14 | role: 'system',
15 | content:
16 | 'You will be provided with a statement, and your task is to rephrase it.',
17 | },
18 | {
19 | role: 'user',
20 | content: comment,
21 | },
22 | ],
23 | temperature: 1,
24 | max_tokens: 64,
25 | top_p: 1,
26 | },
27 | {
28 | headers: {
29 | 'Content-Type': 'application/json',
30 | Authorization: `Bearer ${process.env.OPENAI_API_KEY}`,
31 | },
32 | },
33 | );
34 |
35 | const rephrasedText = response.data.choices[0].message.content;
36 | return NextResponse.json({ rephrasedText });
37 | } catch (error) {
38 | console.error('Error rephrasing text:', error);
39 | return NextResponse.json({ error });
40 | }
41 | }
42 |
--------------------------------------------------------------------------------
/src/app/categories/types.ts:
--------------------------------------------------------------------------------
1 | export interface ICategory {
2 | id: number;
3 | name: string;
4 | poll_id: number;
5 | url: string;
6 | impactDescription: string;
7 | contributionDescription: null | string;
8 | RPGF4Id: null | number;
9 | parentId: null | number;
10 | image: string | null;
11 | metadataUrl: null | string;
12 | created_at: string;
13 | type: string;
14 | progress: CollectionProgressStatus;
15 | }
16 |
17 | export enum InclusionState {
18 | Included = 'included',
19 | Excluded = 'excluded',
20 | Pending = 'pending',
21 | }
22 |
23 | export interface IProject {
24 | id: number;
25 | name: string;
26 | poll_id: number;
27 | url: string;
28 | impactDescription: string;
29 | shortDescription: string | null;
30 | contributionDescription: string | null;
31 | RPGF4Id: string;
32 | parentId: number | null;
33 | image: string | null;
34 | metadataUrl: string | null;
35 | created_at: string;
36 | type: 'collection' | 'project';
37 | inclusionState: InclusionState;
38 | }
39 |
40 | export type CollectionProgressStatus =
41 | | 'Attested'
42 | | 'Finished'
43 | | 'WIP - Threshold'
44 | | 'WIP'
45 | | 'Filtered'
46 | | 'Filtering'
47 | | 'Pending';
48 |
--------------------------------------------------------------------------------
/public/images/icons/IconEye.tsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 |
3 | const IconEye = () => {
4 | return (
5 |
27 | );
28 | };
29 |
30 | export default IconEye;
31 |
--------------------------------------------------------------------------------
/src/app/components/ConnectDrawers.tsx:
--------------------------------------------------------------------------------
1 | 'use client';
2 |
3 | import React from 'react';
4 | import { useConnect } from '../providers/ConnectProvider';
5 | import CollectVotingPowerContent from './CollectVotingPowerContent';
6 | import ConnectWalletContent from './ConnectWalletContent';
7 | import Drawer from './Drawer';
8 |
9 | const ConnectDrawers = () => {
10 | const {
11 | handleConnect,
12 | isClaimDrawerOpen,
13 | setIsClaimDrawerOpen,
14 | isConnectDrawerOpen,
15 | setIsConnectDrawerOpen,
16 | } = useConnect();
17 | return (
18 |
15 |
32 | )}
33 |
16 |
31 |
17 |
30 | 18 | Go to the device with your OP account and 19 | connect it pseudonymously to this device 20 |
21 |
22 |
28 |
29 |
19 |
23 | setIsConnectDrawerOpen(false)}
26 | />
27 |
37 |
38 |
42 |
43 | );
44 | };
45 |
46 | export default ConnectDrawers;
47 |
--------------------------------------------------------------------------------
/src/app/components/TopRouteIndicator.tsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { Routes } from '@/app/constants/Routes';
3 | import Link from 'next/link';
4 | import IconArrowLeft from 'public/images/icons/IconArrowLeft';
5 | import IconCancel from 'public/images/icons/IconCancel';
6 | import { useParams } from 'next/navigation';
7 |
8 | interface ITopRouteIndicatorProps {
9 | name?: string;
10 | icon: 'cross' | 'arrow';
11 | }
12 |
13 | const iconMap = {
14 | cross:
28 |
33 | Need Help?
34 |
35 |
36 |
22 |
39 | );
40 | };
41 |
42 | export default TopRouteIndicator;
43 |
--------------------------------------------------------------------------------
/src/app/categories/components/CategoryToggleButton.tsx:
--------------------------------------------------------------------------------
1 | import CardIcon from 'public/images/icons/CardIcon';
2 | import ListIcon from 'public/images/icons/ListIcon';
3 | import React, { useState } from 'react';
4 | interface CategoryToggleButtonProps {
5 | toggleView: (isCardView: boolean) => void;
6 | }
7 |
8 | const CategoryToggleButton: React.FC
23 | {icon === 'arrow' ? (
24 |
28 | {iconMap[icon]}
29 |
30 | ) : (
31 | ''
32 | )}
33 |
38 | {name}
34 | 35 | {icon === 'cross' ? iconMap[icon] : ''} 36 | 37 |
23 |
35 |
36 | );
37 | };
38 |
39 | export default CategoryToggleButton;
40 |
--------------------------------------------------------------------------------
/src/app/connect/otp/success/page.tsx:
--------------------------------------------------------------------------------
1 | import { badgesImages } from '@/app/constants/BadgesData';
2 | import Image from 'next/image';
3 |
4 | const ConnectOTPSuccessPage = () => {
5 | return (
6 |
7 |
43 | );
44 | };
45 |
46 | export default ConnectOTPSuccessPage;
47 |
--------------------------------------------------------------------------------
/src/app/categories/components/CategoryCard.tsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { ICategoryProps } from './CategoryItem';
3 | import Image from 'next/image';
4 | import CategoryBadge from './CategoryBadge';
5 | import { truncate } from '@/app/helpers/text-helpers';
6 |
7 | const CategoryCard = ({ category, progress, imageNumber }: ICategoryProps) => {
8 | const imgNumber = imageNumber || (category.id % 5) + 1;
9 | const imgSrc = `/images/defaults/category/category-${imgNumber}.png`;
10 |
11 | return (
12 |
8 |
16 |
17 |
42 | 18 | You successfully collected your voting power 19 |
20 |
21 | {badgesImages.map((image, index) => (
22 |
37 | 0 ? '-ml-9' : 'ml-0'} rounded-full p-2`}
25 | >
26 |
35 | ))}
36 |
27 |
34 | 38 | Pseudonymously 39 |
40 | {/* zk-proof messaging removed */} 41 |
13 |
34 | );
35 | };
36 |
37 | export default CategoryCard;
38 |
--------------------------------------------------------------------------------
/src/app/category-ranking/done/page.tsx:
--------------------------------------------------------------------------------
1 | 'use client';
2 |
3 | import React from 'react';
4 | import Button from '@/app/components/Button';
5 | import { Routes } from '@/app/constants/Routes';
6 | import { useRouter } from 'next/navigation';
7 | import IconCheck from 'public/images/icons/IconCheck';
8 |
9 | const CategoryRankingDone = () => {
10 | const router = useRouter();
11 |
12 | return (
13 |
14 |
33 |
15 |
25 | 22 | {category.name} 23 |
24 |
26 |
{' '}
28 | {category.name}
29 |30 | {truncate(category.impactDescription, 50)} 31 |
32 |
14 |
36 | );
37 | };
38 |
39 | export default CategoryRankingDone;
40 |
--------------------------------------------------------------------------------
/src/app/categories/components/CategoryRankingBasicListItem.tsx:
--------------------------------------------------------------------------------
1 | 'use client';
2 |
3 | import { IProject } from '../types';
4 | import Image from 'next/image';
5 | import { truncate } from '@/app/helpers/text-helpers';
6 |
7 | interface ICategoryRankingBasicListItemProps {
8 | project: IProject;
9 | order: number;
10 | }
11 |
12 | const CategoryRankingBasicListItem = ({
13 | project,
14 | order,
15 | }: ICategoryRankingBasicListItemProps) => {
16 | return (
17 |
15 |
27 |
16 |
{' '}
18 | Hooray!!
19 |
20 | You have successfully submitted
your vote.
21 |
23 | Now you can go back and vote on another
24 | category.
25 |
28 |
34 |
35 |
18 |
42 | );
43 | };
44 |
45 | export default CategoryRankingBasicListItem;
46 |
--------------------------------------------------------------------------------
/src/app/features/categories/updateProjectVote.ts:
--------------------------------------------------------------------------------
1 | import { axios } from '@/lib/axios';
2 | import { useMutation, useQueryClient } from '@tanstack/react-query';
3 |
4 | type ProjectVoteData = {
5 | data: {
6 | project1Id: number;
7 | project2Id: number;
8 | pickedId: number | null;
9 | };
10 | };
11 |
12 | export const updateProjectVote = ({ data }: ProjectVoteData) => {
13 | return axios.post('flow/projects/vote', data);
14 | };
15 |
16 | export const updateProjectUndo = (cid: Number) => {
17 | return axios.post('flow/pairs/back', { collectionId: cid });
18 | };
19 |
20 | export const useUpdateProjectVote = ({
21 | categoryId,
22 | }: {
23 | categoryId: number;
24 | }) => {
25 | const queryClient = useQueryClient();
26 |
27 | return useMutation({
28 | mutationFn: updateProjectVote,
29 | onSuccess: ({ data }) => {
30 | console.log('OnSuccess', data);
31 | queryClient.refetchQueries({
32 | queryKey: ['pairwise-pairs', categoryId],
33 | });
34 | },
35 | });
36 | };
37 |
38 | export const useUpdateProjectUndo = ({
39 | categoryId,
40 | }: {
41 | categoryId: number;
42 | }) => {
43 | const queryClient = useQueryClient();
44 |
45 | return useMutation({
46 | mutationFn: updateProjectUndo,
47 | onSuccess: ({ data }) => {
48 | console.log('OnSuccess', data);
49 | queryClient.refetchQueries({
50 | queryKey: ['pairwise-pairs', categoryId],
51 | });
52 | },
53 | });
54 | };
55 |
--------------------------------------------------------------------------------
/src/app/categories/components/DrawerContent.tsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { IProject } from '../types';
3 |
4 | interface DrawerContentProps {
5 | project: IProject;
6 | }
7 | export const DrawerContent: React.FC
19 |
41 | #{order}
20 |
21 | {project.image ? (
22 |
40 |
31 |
35 | )}
36 | 32 | {project.name} 33 |
34 |37 | {truncate(project.name, 25)} 38 |
39 |
10 |
50 | );
51 | };
52 |
--------------------------------------------------------------------------------
/src/app/connect/components/ConnectOtpInput.tsx:
--------------------------------------------------------------------------------
1 | 'use client';
2 |
3 | import { cn } from '@/app/helpers/cn';
4 | import React, { FC } from 'react';
5 | import OTPInput from 'react-otp-input';
6 | import { ConnectErrorBox } from './ConnectErrorBox';
7 |
8 | export enum OtpState {
9 | InProgress,
10 | Ready,
11 | Invalid,
12 | Valid,
13 | }
14 | interface Props {
15 | onSubmit: () => void;
16 | otp: string;
17 | setOtp: (otp: string) => void;
18 | state: OtpState;
19 | setState: (state: OtpState) => void;
20 | setError: (error: string | false) => void;
21 | error?: string | false;
22 | }
23 |
24 | const OtpLength = 6;
25 |
26 | const ConnectOTPInput: FC
22 | 
28 |
29 |
30 |
35 |
36 | 31 | {project.name} 32 |
33 |{project.shortDescription}
34 |
37 |
42 |
43 | 38 | Impact statement 39 |
40 |{project.impactDescription}
41 |
44 |
49 | 45 | Contributions 46 |
47 |{project.contributionDescription}
48 |
33 | }
45 | shouldAutoFocus
46 | />
47 | {error &&
49 | );
50 | };
51 |
52 | export default ConnectOTPInput;
53 |
--------------------------------------------------------------------------------
/public/images/icons/IconParagraph.tsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 |
3 | const IconParagraph = () => {
4 | return (
5 |
17 | );
18 | };
19 |
20 | export default IconParagraph;
21 |
--------------------------------------------------------------------------------
/public/images/icons/WarningBoxIcon.tsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 |
3 | export const WarningBoxIcon: React.FC = () => {
4 | return (
5 |
24 | );
25 | };
26 |
--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
1 | This is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app).
2 |
3 | ## Getting Started
4 |
5 | First, run the development server:
6 |
7 | ```bash
8 | npm run dev
9 | # or
10 | yarn dev
11 | # or
12 | pnpm dev
13 | # or
14 | bun dev
15 | ```
16 |
17 | Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
18 |
19 | You can start editing the page by modifying `app/page.tsx`. The page auto-updates as you edit the file.
20 |
21 | This project uses [`next/font`](https://nextjs.org/docs/basic-features/font-optimization) to automatically optimize and load Inter, a custom Google Font.
22 |
23 | ## Learn More
24 |
25 | To learn more about Next.js, take a look at the following resources:
26 |
27 | - [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API.
28 | - [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial.
29 |
30 | You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js/) - your feedback and contributions are welcome!
31 |
32 | ## Deploy on Vercel
33 |
34 | The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js.
35 |
36 | Check out our [Next.js deployment documentation](https://nextjs.org/docs/deployment) for more details.
37 |
--------------------------------------------------------------------------------
/public/images/icons/IconWarning.tsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 |
3 | const IconWarning = () => {
4 | return (
5 |
24 | );
25 | };
26 |
27 | export default IconWarning;
28 |
--------------------------------------------------------------------------------
/src/utils/AuthGuard.tsx:
--------------------------------------------------------------------------------
1 | 'use client';
2 |
3 | import LoadingSpinner from '@/app/components/LoadingSpinner';
4 | import { useAuth } from '@/lib/third-web/AutoConnect';
5 | import { usePathname, useRouter } from 'next/navigation';
6 | import React, { PropsWithChildren, useEffect, useState } from 'react';
7 | import { useActiveWallet } from 'thirdweb/react';
8 |
9 | const PublicRoutes = [
10 | '/login',
11 | '/connect',
12 | '/connect/otp',
13 | '/connect/otp/success',
14 | '/connect/otp/no-badge',
15 | ];
16 |
17 | export const AuthGuard: React.FC
42 | {getBadgeImages().map((image, index) => (
43 |
58 | );
59 | };
60 |
--------------------------------------------------------------------------------
/public/images/icons/IconGithub.tsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 |
3 | const IconGithub = () => {
4 | return (
5 |
19 | );
20 | };
21 |
22 | export default IconGithub;
23 |
--------------------------------------------------------------------------------
/src/app/categories/components/CategoryRankingNotSelectedListItem.tsx:
--------------------------------------------------------------------------------
1 | 'use client';
2 |
3 | import { IProject } from '../types';
4 | import Image from 'next/image';
5 |
6 | import { truncate } from '@/app/helpers/text-helpers';
7 |
8 | interface ICategoryRankingNotSelectedListItemProps {
9 | project: IProject;
10 | handleAddFromNotSelected: (projectId: number) => void;
11 | }
12 |
13 | const CategoryRankingNotSelectedListItem = ({
14 | project,
15 | handleAddFromNotSelected,
16 | }: ICategoryRankingNotSelectedListItemProps) => {
17 | return (
18 | 0 ? (size > 25 ? '-ml-10' : '-ml-7') : 'ml-0'} rounded-full p-2`}
46 | >
47 |
56 | ))}
57 |
48 |
55 |
19 |
48 | );
49 | };
50 |
51 | export default CategoryRankingNotSelectedListItem;
52 |
--------------------------------------------------------------------------------
/src/app/categories/[categoryId]/filter-guide/page.tsx:
--------------------------------------------------------------------------------
1 | 'use client';
2 |
3 | import Button from '@/app/components/Button';
4 | import { Routes } from '@/app/constants/Routes';
5 | import Image from 'next/image';
6 | import { useParams, useRouter } from 'next/navigation';
7 | import { useEffect } from 'react';
8 |
9 | const FilterGuidePage = () => {
10 | const router = useRouter();
11 | const { categoryId } = useParams();
12 |
13 | useEffect(() => {
14 | window.scrollTo(0, 0);
15 | }, []);
16 |
17 | return (
18 |
20 |
41 |
21 | {project.image ? (
22 |
40 |
31 |
35 | )}
36 | 32 | {project.name} 33 |
34 |37 | {truncate(project.name, 30)} 38 |
39 | handleAddFromNotSelected(project.id)}
44 | >
45 | +
46 |
47 |
19 |
53 | );
54 | };
55 |
56 | export default FilterGuidePage;
57 |
--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "pairwise-rpgf4-frontend",
3 | "version": "0.1.0",
4 | "private": true,
5 | "scripts": {
6 | "dev": "next dev",
7 | "build": "next build",
8 | "start": "next start",
9 | "lint": "next lint",
10 | "eslint": "eslint . --ext .ts --ext .tsx",
11 | "eslint:fix": "eslint . --ext .ts --ext .tsx --fix",
12 | "format": "prettier --write ."
13 | },
14 | "dependencies": {
15 |
16 | "@ethereum-attestation-service/eas-sdk": "^2.1.4",
17 |
18 | "@tanstack/react-query": "^5.29.0",
19 | "@tanstack/react-query-devtools": "^5.29.0",
20 | "axios": "^1.6.8",
21 | "class-variance-authority": "^0.7.0",
22 | "clsx": "^2.1.0",
23 | "eslint-plugin-unused-imports": "^4.0.0",
24 | "framer-motion": "^11.1.7",
25 | "next": "14.1.4",
26 | "openai": "^4.52.7",
27 | "posthog-js": "^1.139.1",
28 | "react": "^18",
29 | "react-device-detect": "^2.2.3",
30 | "react-dom": "^18",
31 | "react-otp-input": "^3.1.1",
32 | "tailwind-merge": "^2.2.2",
33 | "thirdweb": "^5.3.1",
34 | "viem": "2.x",
35 | "wagmi": "^2.5.19"
36 | },
37 | "devDependencies": {
38 | "@next/eslint-plugin-next": "^14.1.4",
39 | "@types/node": "^20",
40 | "@types/react": "^18",
41 | "@types/react-dom": "^18",
42 | "@typescript-eslint/eslint-plugin": "^7.6.0",
43 | "autoprefixer": "^10.0.1",
44 | "eslint": "^8.57.0",
45 | "eslint-config-next": "14.1.4",
46 | "eslint-config-prettier": "^9.1.0",
47 | "eslint-plugin-prettier": "^5.1.3",
48 | "eslint-plugin-react": "^7.34.1",
49 | "postcss": "^8",
50 | "prettier": "^3.2.5",
51 | "prettier-plugin-tailwindcss": "^0.5.13",
52 | "tailwindcss": "^3.3.0",
53 | "typescript": "^5"
54 | }
55 | }
56 |
--------------------------------------------------------------------------------
/src/app/components/VoteSubmitted.tsx:
--------------------------------------------------------------------------------
1 | 'use client';
2 |
3 | import React from 'react';
4 | import Button from '@/app/components/Button';
5 | import { Routes } from '@/app/constants/Routes';
6 | import { useRouter } from 'next/navigation';
7 | import IconCheck from 'public/images/icons/IconCheck';
8 | import backgroundGif from 'public/images/confetti.gif'; // Import your GIF file
9 | interface IVoteType {
10 | categoryId?: number;
11 | }
12 | const VoteSubmitted = ({ categoryId }: IVoteType) => {
13 | const router = useRouter();
14 |
15 | return (
16 |
20 |
40 | Project filtering
21 |22 | Start by selecting projects you want to keep or dismiss from 23 | this category. 24 |
25 |
26 |
39 |
41 |
51 |
52 |
22 |
48 | );
49 | };
50 |
51 | export default VoteSubmitted;
52 |
--------------------------------------------------------------------------------
/src/app/categories/components/CategoryEditProjectItem.tsx:
--------------------------------------------------------------------------------
1 | import Image from 'next/image';
2 | import { IProject } from '../types';
3 | import IconTrash from 'public/images/icons/IconTrash';
4 |
5 | export enum SelectionState {
6 | SELECTED = 'selected',
7 | NOT_SELECTED = 'notSelected',
8 | }
9 |
10 | interface ICategoriesEditProjectItemProps {
11 | project: IProject;
12 | selectionState: SelectionState;
13 | handleEditProject: (projectId: number) => void;
14 | }
15 |
16 | const CategoryEditProjectItem = ({
17 | project,
18 | selectionState,
19 | handleEditProject,
20 | }: ICategoriesEditProjectItemProps) => {
21 | return (
22 |
23 |
31 |
24 |
{' '}
26 | Vote submitted
27 |28 | Wooo!!! Now you can go back and vote on another category 29 |
30 |
32 |
46 |
47 |
23 |
54 | );
55 | };
56 |
57 | export default CategoryEditProjectItem;
58 |
--------------------------------------------------------------------------------
/src/app/categories/components/CategoryBadge.tsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { CollectionProgressStatus } from '../types';
3 | import IconCheck from 'public/images/icons/IconCheck';
4 |
5 | const CategoryBadge = ({
6 | progress = 'Pending',
7 | }: {
8 | progress?: CollectionProgressStatus;
9 | }) => {
10 | switch (progress) {
11 | case 'Pending':
12 | return (
13 |
24 |
53 |
25 | {project.image ? (
26 |
42 |
35 |
39 | )}
40 | 36 | {project.name} 37 |
38 |{project.name}
41 | handleEditProject(project.id)}
45 | >
46 | {selectionState === SelectionState.SELECTED ? (
47 |
52 | +
50 | )}
51 |
14 | Not ranked
15 |
16 | );
17 | case 'Filtering':
18 | return (
19 |
20 | Filtering
21 |
22 | );
23 | case 'Filtered':
24 | return (
25 |
26 | Filtered
27 |
28 | );
29 | case 'WIP - Threshold':
30 | case 'WIP':
31 | case 'Finished':
32 | return (
33 |
34 | Ranking
35 |
36 | );
37 | case 'Attested':
38 | return (
39 |
40 |
43 | );
44 |
45 | default:
46 | return (
47 | Ranked
41 |
48 | Not ranked
49 |
50 | );
51 | }
52 | };
53 |
54 | export default CategoryBadge;
55 |
--------------------------------------------------------------------------------
/src/app/categories/[categoryId]/pairwise-ranking/done/page.tsx:
--------------------------------------------------------------------------------
1 | 'use client';
2 |
3 | import React from 'react';
4 | import Button from '@/app/components/Button';
5 | import { Routes } from '@/app/constants/Routes';
6 | import { useParams, useRouter } from 'next/navigation';
7 | import IconCheck from 'public/images/icons/IconCheck';
8 |
9 | const CategoryRankingDone = () => {
10 | const router = useRouter();
11 | const { categoryId } = useParams();
12 |
13 | return (
14 |
15 |
45 | );
46 | };
47 |
48 | export default CategoryRankingDone;
49 |
--------------------------------------------------------------------------------
/src/app/badges/page.tsx:
--------------------------------------------------------------------------------
1 | 'use client';
2 |
3 | import React from 'react';
4 | import TopNavigation from '../components/TopNavigation';
5 | import { Routes } from '../constants/Routes';
6 | import BadgeCard, { BadgeData, badgeTypeMapping } from './components/BadgeCard';
7 | import LoadingSpinner from '../components/LoadingSpinner';
8 | import { useGetBadges } from '../features/badges/getBadges';
9 | import { getBadgeAmount, getBadgeMedal } from '@/utils/badgeUtils';
10 |
11 | export type BadgeCardEntryType = [
12 | key: keyof typeof badgeTypeMapping,
13 | value: number,
14 | ];
15 |
16 | const BadgesPage = () => {
17 | const { data: badges, isLoading } = useGetBadges();
18 |
19 | if (isLoading) return
16 |
26 |
17 |
{' '}
19 | Vote submitted
20 |21 | You have voted in this category.If you change your mind,you 22 | can update your vote by selecting “Edit Vote” 23 | button below. 24 |
25 |
27 |
37 |
43 |
44 |
33 |
59 | );
60 | };
61 |
62 | export default BadgesPage;
63 |
--------------------------------------------------------------------------------
/src/app/features/badges/getBadges.ts:
--------------------------------------------------------------------------------
1 | import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query';
2 | import { axios } from '@/lib/axios';
3 | import { BadgeData } from '@/app/badges/components/BadgeCard';
4 | // Removed semaphore Identity
5 |
6 | const continueGuest = async () => {
7 | await axios.post('/user/continue-guest');
8 | };
9 |
10 | /**
11 | *
12 | * @returns badges stored in the Pairwise database for a given smart wallet addresss
13 | */
14 | export const useContinueGuest = () => {
15 | const queryClient = useQueryClient();
16 |
17 | return useMutation({
18 | mutationFn: continueGuest,
19 | onSuccess: () => {
20 | queryClient.refetchQueries({
21 | queryKey: ['badges'],
22 | });
23 | },
24 | });
25 | };
26 |
27 | const getBadges = async () => {
28 | const { data } = await axios.get
35 |
58 | Your Badges
36 |
37 | {badges ? (
38 | Object.entries(badgeCards(badges)).map(([el1, el2]) => {
39 | const [key, value] = [
40 | el1,
41 | el2,
42 | ] as BadgeCardEntryType;
43 | return (
44 |
57 | No badges found for You
55 | )} 56 |
24 |
51 | );
52 | };
53 |
54 | export default RankingDonePage;
55 |
--------------------------------------------------------------------------------
/src/app/login/components/SignInEmail2.tsx:
--------------------------------------------------------------------------------
1 | // signin.tsx
2 | import { FC } from 'react';
3 | import { ErrorBox } from './ErrorBox';
4 |
5 | interface SignInForm {
6 | email: string;
7 | onSubmit: () => void;
8 | setEmail: (email: string) => void;
9 | emailError: boolean;
10 | }
11 |
12 | export const isEmailValid = (email: string) => {
13 | const regex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
14 | return regex.test(email);
15 | };
16 |
17 | export const SignInEmail2: FC
25 |
38 |
26 |
37 | Ranking done!
27 |28 | Preview your project ranking and submit your vote 29 |
30 |
31 |
36 |
39 |
49 |
50 |
29 |
66 | );
67 | };
68 |
--------------------------------------------------------------------------------
/src/app/layout.tsx:
--------------------------------------------------------------------------------
1 | import { Inter } from 'next/font/google';
2 | import './globals.css';
3 | import TanstackProvider from './providers/TanstackProvider';
4 | import WagmiAppProvider from './providers/WagmiAppProvider';
5 | import PHProvider from './providers/PostHogProvider';
6 | import './globals.css';
7 | import './globals.css';
8 | import { Thirdweb5Provider } from '@/lib/third-web/provider';
9 | import { AuthGuard } from '@/utils/AuthGuard';
10 | import { ConnectProvider } from './providers/ConnectProvider';
11 | import ConnectDrawers from './components/ConnectDrawers';
12 | import Head from 'next/head';
13 |
14 | const inter = Inter({ subsets: ['latin'] });
15 |
16 | export default function RootLayout({
17 | children,
18 | }: Readonly<{
19 | children: React.ReactNode;
20 | }>) {
21 | return (
22 |
23 |
24 |
25 |
26 |
30 |
31 |
32 |
33 |
34 | 30 | Sign in with Email 31 |
32 | 51 | {emailError && ( 52 |
53 | {' '}
54 |
56 | )}
57 |
65 | {children}
41 |
18 |
23 |
24 |
42 | );
43 | };
44 |
45 | export default LogoutModal;
46 |
--------------------------------------------------------------------------------
/src/app/categories/components/Countdown.tsx:
--------------------------------------------------------------------------------
1 | // function getTimeDifference(): {
2 | // days: number;
3 | // hours: number;
4 | // mins: number;
5 | // secs: number;
6 | // } {
7 | // const now = new Date();
8 |
9 | // // Target date and time (July 16th at 20:00 CET)
10 | // const targetDate = new Date(
11 | // Date.UTC(
12 | // now.getFullYear(),
13 | // 6,
14 | // 17,
15 | // 13 /* 15:55 CET adjusted to UTC */,
16 | // 55,
17 | // 0,
18 | // ),
19 | // );
20 |
21 | // const diffMs = targetDate.getTime() - now.getTime();
22 |
23 | // const dayMs = 1000 * 60 * 60 * 24;
24 | // const hourMs = dayMs / 24;
25 | // const minMs = hourMs / 60;
26 |
27 | // const days = Math.floor(diffMs / dayMs);
28 | // const hours = Math.floor((diffMs % dayMs) / hourMs);
29 | // const mins = Math.floor((diffMs % hourMs) / minMs);
30 | // const secs = Math.floor((diffMs % minMs) / 1000);
31 |
32 | // return {
33 | // days: Math.max(days, 0),
34 | // hours: Math.max(hours, 0),
35 | // mins: Math.max(mins, 0),
36 | // secs: Math.max(secs, 0),
37 | // };
38 | // }
39 |
40 | // interface Time {
41 | // days: number;
42 | // hours: number;
43 | // mins: number;
44 | // secs: number;
45 | // }
46 |
47 | export const Countdown: React.FC = () => {
48 | // const [time, setTime] = useState