From 989a3c3c7f02ddea9372e2e1834b7cf8e7f588a2 Mon Sep 17 00:00:00 2001 From: Aazim Anish Date: Sat, 19 Oct 2024 22:50:51 +0530 Subject: [PATCH] =?UTF-8?q?feat:=20=F0=9F=99=89event=20&&=20community=20da?= =?UTF-8?q?shboard?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- packages/nextjs/app/communityDash/page.tsx | 140 ++++++++ packages/nextjs/app/eventDash/page.tsx | 158 +++++++++ packages/nextjs/app/page.tsx | 12 +- .../components/ui/canvas-reveal-effect.tsx | 308 ++++++++++++++++++ .../nextjs/components/ui/card-spotlight.tsx | 74 +++++ packages/nextjs/components/ui/dialog.tsx | 122 +++++++ packages/nextjs/components/ui/glare-card.tsx | 133 ++++++++ packages/nextjs/package.json | 4 + yarn.lock | 247 +++++++++++++- 9 files changed, 1195 insertions(+), 3 deletions(-) create mode 100644 packages/nextjs/components/ui/canvas-reveal-effect.tsx create mode 100644 packages/nextjs/components/ui/card-spotlight.tsx create mode 100644 packages/nextjs/components/ui/dialog.tsx create mode 100644 packages/nextjs/components/ui/glare-card.tsx diff --git a/packages/nextjs/app/communityDash/page.tsx b/packages/nextjs/app/communityDash/page.tsx index e69de29..dd400ea 100644 --- a/packages/nextjs/app/communityDash/page.tsx +++ b/packages/nextjs/app/communityDash/page.tsx @@ -0,0 +1,140 @@ +"use client"; + +import { CardSpotlight } from "../../components/ui/card-spotlight"; +import { Button } from "../../components/ui/button"; +import { + Dialog, + DialogContent, + DialogDescription, + DialogFooter, + DialogHeader, + DialogTitle, + DialogTrigger, +} from "../../components/ui/dialog"; +import { Label } from "../../components/ui/label"; +import { ReactNode } from "react"; +import { GlareCard } from "../../components/ui/glare-card"; + +interface CommunityCardProps { + communityName: string; + description: string; +} + +interface CommunityDetailsDialogProps { + communityName: string; + description: string; +} + +interface EventCardProps { + eventName: string; + description: string; +} + +export default function CommunityDashboard(): ReactNode { + return ( +
+

Community Dashboard

+
+ + {/* Add more CommunityCard components as needed */} +
+
+ ); +} + +function CommunityCard({ communityName, description }: CommunityCardProps): ReactNode { + return ( + +
+
+

{communityName}

+

{description}

+
+
+ + +
+
+ + ); +} + +function CommunityDetailsDialog({ communityName, description }: CommunityDetailsDialogProps): ReactNode { + return ( + + + + + + + {communityName} + {description} + +
+
+
+ +

@{communityName.toLowerCase().replace(/\s/g, '')}

+
+
+ +

linkedin.com/company/{communityName.toLowerCase().replace(/\s/g, '-')}

+
+
+ +

@{communityName.toLowerCase().replace(/\s/g, '_')}

+
+
+ +

0x1234...5678

+
+
+
+ + + + + + ); +} + +function EventsDialog({ communityName }: { communityName: string }): ReactNode { + return ( + + + + + + + Events by {communityName} + Upcoming and past events + +
+
+ + + {/* Add more EventCard components as needed */} +
+
+ + + ); +} + +function EventCard({ eventName, description }: EventCardProps): ReactNode { + return ( + +

{eventName}

+

{description}

+ + ); +} diff --git a/packages/nextjs/app/eventDash/page.tsx b/packages/nextjs/app/eventDash/page.tsx index e69de29..2b92627 100644 --- a/packages/nextjs/app/eventDash/page.tsx +++ b/packages/nextjs/app/eventDash/page.tsx @@ -0,0 +1,158 @@ +"use client"; + +import { CardSpotlight } from "../../components/ui/card-spotlight"; +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 { ReactNode } from "react"; + +interface EventCardProps { + eventName: string; + description: string; + communityName: string; +} + +interface EventDetailsDialogProps { + eventName: string; + communityName: string; +} + +interface BountyDetailsDialogProps { + eventName: string; +} + +export default function EventDashboard(): ReactNode { + return ( +
+

Event Dashboard

+
+ + {/* Add more EventCard components as needed */} +
+
+ ); +} + +function EventCard({ eventName, description, communityName }: EventCardProps): ReactNode { + return ( + +
+
+

{eventName}

+

{description}

+

by {communityName}

+
+
+ + +
+
+ + ); +} + +function EventDetailsDialog({ eventName, communityName }: EventDetailsDialogProps): ReactNode { + return ( + + + + + + + {eventName} + by {communityName} + +
+
+
+ +

Detailed event description goes here.

+
+
+ +

Start: 2024-06-01 10:00 AM
End: 2024-06-03 5:00 PM

+
+
+ +

San Francisco Convention Center

+
+
+ +

0x1234...5678

+
+
+ +

0.5 ETH

+
+
+ +

1000 attendees

+
+
+ +

+ 0xabcd...efgh (10 ETH)
+ 0x9876...5432 (5 ETH) +

+
+
+
+ + + + + + ); +} + +function BountyDetailsDialog({ eventName }: BountyDetailsDialogProps): ReactNode { + return ( + + + + + + + Bounty for {eventName} + View and contribute to event bounties + +
+
+
+ +

Best DeFi Project

+
+
+ +

Create an innovative DeFi project during the hackathon.

+
+
+ +

5 ETH

+
+
+ + +
+
+
+ + + + + + ); +} diff --git a/packages/nextjs/app/page.tsx b/packages/nextjs/app/page.tsx index 0abe7af..bcf90f1 100644 --- a/packages/nextjs/app/page.tsx +++ b/packages/nextjs/app/page.tsx @@ -59,8 +59,16 @@ export function Home() { Profile - - + + diff --git a/packages/nextjs/components/ui/canvas-reveal-effect.tsx b/packages/nextjs/components/ui/canvas-reveal-effect.tsx new file mode 100644 index 0000000..86c5dae --- /dev/null +++ b/packages/nextjs/components/ui/canvas-reveal-effect.tsx @@ -0,0 +1,308 @@ +"use client"; +import { cn } from "../../lib/utils"; +import { Canvas, useFrame, useThree } from "@react-three/fiber"; +import React, { useMemo, useRef } from "react"; +import * as THREE from "three"; + +export const CanvasRevealEffect = ({ + animationSpeed = 0.4, + opacities = [0.3, 0.3, 0.3, 0.5, 0.5, 0.5, 0.8, 0.8, 0.8, 1], + colors = [[0, 255, 255]], + containerClassName, + dotSize, + showGradient = true, +}: { + /** + * 0.1 - slower + * 1.0 - faster + */ + animationSpeed?: number; + opacities?: number[]; + colors?: number[][]; + containerClassName?: string; + dotSize?: number; + showGradient?: boolean; +}) => { + return ( +
+
+ +
+ {showGradient && ( +
+ )} +
+ ); +}; + +interface DotMatrixProps { + colors?: number[][]; + opacities?: number[]; + totalSize?: number; + dotSize?: number; + shader?: string; + center?: ("x" | "y")[]; +} + +const DotMatrix: React.FC = ({ + colors = [[0, 0, 0]], + opacities = [0.04, 0.04, 0.04, 0.04, 0.04, 0.08, 0.08, 0.08, 0.08, 0.14], + totalSize = 4, + dotSize = 2, + shader = "", + center = ["x", "y"], +}) => { + const uniforms = React.useMemo(() => { + let colorsArray = [ + colors[0], + colors[0], + colors[0], + colors[0], + colors[0], + colors[0], + ]; + if (colors.length === 2) { + colorsArray = [ + colors[0], + colors[0], + colors[0], + colors[1], + colors[1], + colors[1], + ]; + } else if (colors.length === 3) { + colorsArray = [ + colors[0], + colors[0], + colors[1], + colors[1], + colors[2], + colors[2], + ]; + } + + return { + u_colors: { + value: colorsArray.map((color) => [ + color[0] / 255, + color[1] / 255, + color[2] / 255, + ]), + type: "uniform3fv", + }, + u_opacities: { + value: opacities, + type: "uniform1fv", + }, + u_total_size: { + value: totalSize, + type: "uniform1f", + }, + u_dot_size: { + value: dotSize, + type: "uniform1f", + }, + }; + }, [colors, opacities, totalSize, dotSize]); + + return ( + + ); +}; + +type Uniforms = { + [key: string]: { + value: number[] | number[][] | number; + type: string; + }; +}; +const ShaderMaterial = ({ + source, + uniforms, + maxFps = 60, +}: { + source: string; + hovered?: boolean; + maxFps?: number; + uniforms: Uniforms; +}) => { + const { size } = useThree(); + const ref = useRef(); + let lastFrameTime = 0; + + useFrame(({ clock }) => { + if (!ref.current) return; + const timestamp = clock.getElapsedTime(); + if (timestamp - lastFrameTime < 1 / maxFps) { + return; + } + lastFrameTime = timestamp; + + const material: any = ref.current.material; + const timeLocation = material.uniforms.u_time; + timeLocation.value = timestamp; + }); + + const getUniforms = () => { + const preparedUniforms: any = {}; + + for (const uniformName in uniforms) { + const uniform: any = uniforms[uniformName]; + + switch (uniform.type) { + case "uniform1f": + preparedUniforms[uniformName] = { value: uniform.value, type: "1f" }; + break; + case "uniform3f": + preparedUniforms[uniformName] = { + value: new THREE.Vector3().fromArray(uniform.value), + type: "3f", + }; + break; + case "uniform1fv": + preparedUniforms[uniformName] = { value: uniform.value, type: "1fv" }; + break; + case "uniform3fv": + preparedUniforms[uniformName] = { + value: uniform.value.map((v: number[]) => + new THREE.Vector3().fromArray(v) + ), + type: "3fv", + }; + break; + case "uniform2f": + preparedUniforms[uniformName] = { + value: new THREE.Vector2().fromArray(uniform.value), + type: "2f", + }; + break; + default: + console.error(`Invalid uniform type for '${uniformName}'.`); + break; + } + } + + preparedUniforms["u_time"] = { value: 0, type: "1f" }; + preparedUniforms["u_resolution"] = { + value: new THREE.Vector2(size.width * 2, size.height * 2), + }; // Initialize u_resolution + return preparedUniforms; + }; + + // Shader material + const material = useMemo(() => { + const materialObject = new THREE.ShaderMaterial({ + vertexShader: ` + precision mediump float; + in vec2 coordinates; + uniform vec2 u_resolution; + out vec2 fragCoord; + void main(){ + float x = position.x; + float y = position.y; + gl_Position = vec4(x, y, 0.0, 1.0); + fragCoord = (position.xy + vec2(1.0)) * 0.5 * u_resolution; + fragCoord.y = u_resolution.y - fragCoord.y; + } + `, + fragmentShader: source, + uniforms: getUniforms(), + glslVersion: THREE.GLSL3, + blending: THREE.CustomBlending, + blendSrc: THREE.SrcAlphaFactor, + blendDst: THREE.OneFactor, + }); + + return materialObject; + }, [size.width, size.height, source]); + + return ( + + + + + ); +}; + +const Shader: React.FC = ({ source, uniforms, maxFps = 60 }) => { + return ( + + + + ); +}; +interface ShaderProps { + source: string; + uniforms: { + [key: string]: { + value: number[] | number[][] | number; + type: string; + }; + }; + maxFps?: number; +} diff --git a/packages/nextjs/components/ui/card-spotlight.tsx b/packages/nextjs/components/ui/card-spotlight.tsx new file mode 100644 index 0000000..9082491 --- /dev/null +++ b/packages/nextjs/components/ui/card-spotlight.tsx @@ -0,0 +1,74 @@ +"use client"; + +import { useMotionValue, motion, useMotionTemplate } from "framer-motion"; +import React, { MouseEvent as ReactMouseEvent, useState } from "react"; +import { CanvasRevealEffect } from "./canvas-reveal-effect"; +import { cn } from "../../lib/utils"; + +export const CardSpotlight = ({ + children, + radius = 350, + color = "#262626", + className, + ...props +}: { + radius?: number; + color?: string; + children: React.ReactNode; +} & React.HTMLAttributes) => { + const mouseX = useMotionValue(0); + const mouseY = useMotionValue(0); + function handleMouseMove({ + currentTarget, + clientX, + clientY, + }: ReactMouseEvent) { + let { left, top } = currentTarget.getBoundingClientRect(); + + mouseX.set(clientX - left); + mouseY.set(clientY - top); + } + + const [isHovering, setIsHovering] = useState(false); + const handleMouseEnter = () => setIsHovering(true); + const handleMouseLeave = () => setIsHovering(false); + return ( +
+ + {isHovering && ( + + )} + + {children} +
+ ); +}; diff --git a/packages/nextjs/components/ui/dialog.tsx b/packages/nextjs/components/ui/dialog.tsx new file mode 100644 index 0000000..d754e81 --- /dev/null +++ b/packages/nextjs/components/ui/dialog.tsx @@ -0,0 +1,122 @@ +"use client" + +import * as React from "react" +import * as DialogPrimitive from "@radix-ui/react-dialog" +import { Cross2Icon } from "@radix-ui/react-icons" + +import { cn } from "../../lib/utils" + +const Dialog = DialogPrimitive.Root + +const DialogTrigger = DialogPrimitive.Trigger + +const DialogPortal = DialogPrimitive.Portal + +const DialogClose = DialogPrimitive.Close + +const DialogOverlay = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, ...props }, ref) => ( + +)) +DialogOverlay.displayName = DialogPrimitive.Overlay.displayName + +const DialogContent = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, children, ...props }, ref) => ( + + + + {children} + + + Close + + + +)) +DialogContent.displayName = DialogPrimitive.Content.displayName + +const DialogHeader = ({ + className, + ...props +}: React.HTMLAttributes) => ( +
+) +DialogHeader.displayName = "DialogHeader" + +const DialogFooter = ({ + className, + ...props +}: React.HTMLAttributes) => ( +
+) +DialogFooter.displayName = "DialogFooter" + +const DialogTitle = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, ...props }, ref) => ( + +)) +DialogTitle.displayName = DialogPrimitive.Title.displayName + +const DialogDescription = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, ...props }, ref) => ( + +)) +DialogDescription.displayName = DialogPrimitive.Description.displayName + +export { + Dialog, + DialogPortal, + DialogOverlay, + DialogTrigger, + DialogClose, + DialogContent, + DialogHeader, + DialogFooter, + DialogTitle, + DialogDescription, +} diff --git a/packages/nextjs/components/ui/glare-card.tsx b/packages/nextjs/components/ui/glare-card.tsx new file mode 100644 index 0000000..87a4f14 --- /dev/null +++ b/packages/nextjs/components/ui/glare-card.tsx @@ -0,0 +1,133 @@ +import { cn } from "../../lib/utils"; +import { useRef } from "react"; + +export const GlareCard = ({ + children, + className, +}: { + children: React.ReactNode; + className?: string; +}) => { + const isPointerInside = useRef(false); + const refElement = useRef(null); + const state = useRef({ + glare: { + x: 50, + y: 50, + }, + background: { + x: 50, + y: 50, + }, + rotate: { + x: 0, + y: 0, + }, + }); + const containerStyle = { + "--m-x": "50%", + "--m-y": "50%", + "--r-x": "0deg", + "--r-y": "0deg", + "--bg-x": "50%", + "--bg-y": "50%", + "--duration": "300ms", + "--foil-size": "100%", + "--opacity": "0", + "--radius": "48px", + "--easing": "ease", + "--transition": "var(--duration) var(--easing)", + } as any; + + const backgroundStyle = { + "--step": "5%", + "--foil-svg": `url("data:image/svg+xml,%3Csvg width='26' height='26' viewBox='0 0 26 26' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M2.99994 3.419C2.99994 3.419 21.6142 7.43646 22.7921 12.153C23.97 16.8695 3.41838 23.0306 3.41838 23.0306' stroke='white' stroke-width='5' stroke-miterlimit='3.86874' stroke-linecap='round' style='mix-blend-mode:darken'/%3E%3C/svg%3E")`, + "--pattern": "var(--foil-svg) center/100% no-repeat", + "--rainbow": + "repeating-linear-gradient( 0deg,rgb(255,119,115) calc(var(--step) * 1),rgba(255,237,95,1) calc(var(--step) * 2),rgba(168,255,95,1) calc(var(--step) * 3),rgba(131,255,247,1) calc(var(--step) * 4),rgba(120,148,255,1) calc(var(--step) * 5),rgb(216,117,255) calc(var(--step) * 6),rgb(255,119,115) calc(var(--step) * 7) ) 0% var(--bg-y)/200% 700% no-repeat", + "--diagonal": + "repeating-linear-gradient( 128deg,#0e152e 0%,hsl(180,10%,60%) 3.8%,hsl(180,10%,60%) 4.5%,hsl(180,10%,60%) 5.2%,#0e152e 10%,#0e152e 12% ) var(--bg-x) var(--bg-y)/300% no-repeat", + "--shade": + "radial-gradient( farthest-corner circle at var(--m-x) var(--m-y),rgba(255,255,255,0.1) 12%,rgba(255,255,255,0.15) 20%,rgba(255,255,255,0.25) 120% ) var(--bg-x) var(--bg-y)/300% no-repeat", + backgroundBlendMode: "hue, hue, hue, overlay", + }; + + const updateStyles = () => { + if (refElement.current) { + console.log(state.current); + const { background, rotate, glare } = state.current; + refElement.current?.style.setProperty("--m-x", `${glare.x}%`); + refElement.current?.style.setProperty("--m-y", `${glare.y}%`); + refElement.current?.style.setProperty("--r-x", `${rotate.x}deg`); + refElement.current?.style.setProperty("--r-y", `${rotate.y}deg`); + refElement.current?.style.setProperty("--bg-x", `${background.x}%`); + refElement.current?.style.setProperty("--bg-y", `${background.y}%`); + } + }; + return ( +
{ + const rotateFactor = 0.4; + const rect = event.currentTarget.getBoundingClientRect(); + const position = { + x: event.clientX - rect.left, + y: event.clientY - rect.top, + }; + const percentage = { + x: (100 / rect.width) * position.x, + y: (100 / rect.height) * position.y, + }; + const delta = { + x: percentage.x - 50, + y: percentage.y - 50, + }; + + const { background, rotate, glare } = state.current; + background.x = 50 + percentage.x / 4 - 12.5; + background.y = 50 + percentage.y / 3 - 16.67; + rotate.x = -(delta.x / 3.5); + rotate.y = delta.y / 2; + rotate.x *= rotateFactor; + rotate.y *= rotateFactor; + glare.x = percentage.x; + glare.y = percentage.y; + + updateStyles(); + }} + onPointerEnter={() => { + isPointerInside.current = true; + if (refElement.current) { + setTimeout(() => { + if (isPointerInside.current) { + refElement.current?.style.setProperty("--duration", "0s"); + } + }, 300); + } + }} + onPointerLeave={() => { + isPointerInside.current = false; + if (refElement.current) { + refElement.current.style.removeProperty("--duration"); + refElement.current?.style.setProperty("--r-x", `0deg`); + refElement.current?.style.setProperty("--r-y", `0deg`); + } + }} + > +
+
+
+ {children} +
+
+
+
+
+
+ ); +}; diff --git a/packages/nextjs/package.json b/packages/nextjs/package.json index efe6569..759aea5 100644 --- a/packages/nextjs/package.json +++ b/packages/nextjs/package.json @@ -15,12 +15,14 @@ }, "dependencies": { "@heroicons/react": "^2.1.5", + "@radix-ui/react-dialog": "^1.1.2", "@radix-ui/react-icons": "^1.3.0", "@radix-ui/react-label": "^2.1.0", "@radix-ui/react-popover": "^1.1.2", "@radix-ui/react-select": "^2.1.2", "@radix-ui/react-slot": "^1.1.0", "@rainbow-me/rainbowkit": "2.1.6", + "@react-three/fiber": "^8.17.10", "@tabler/icons-react": "^3.19.0", "@tanstack/react-query": "^5.59.15", "@types/react-icons": "^3.0.0", @@ -46,6 +48,7 @@ "simplex-noise": "^4.0.3", "tailwind-merge": "^2.5.4", "tailwindcss-animate": "^1.0.7", + "three": "^0.169.0", "usehooks-ts": "^3.1.0", "viem": "2.21.7", "wagmi": "2.12.11", @@ -55,6 +58,7 @@ "@trivago/prettier-plugin-sort-imports": "^4.1.1", "@types/node": "^18.19.50", "@types/react": "^18.3.5", + "@types/three": "^0.169.0", "@typescript-eslint/eslint-plugin": "^5.39.0", "abitype": "1.0.6", "autoprefixer": "^10.4.20", diff --git a/yarn.lock b/yarn.lock index 3aa79fb..8d9732f 100644 --- a/yarn.lock +++ b/yarn.lock @@ -144,6 +144,15 @@ __metadata: languageName: node linkType: hard +"@babel/runtime@npm:^7.17.8": + version: 7.25.7 + resolution: "@babel/runtime@npm:7.25.7" + dependencies: + regenerator-runtime: ^0.14.0 + checksum: 1d6133ed1cf1de1533cfe84a4a8f94525271a0d93f6af4f2cdae14884ec3c8a7148664ddf7fd2a14f82cc4485904a1761821a55875ad241c8b4034e95e7134b2 + languageName: node + linkType: hard + "@babel/runtime@npm:^7.19.4": version: 7.24.5 resolution: "@babel/runtime@npm:7.24.5" @@ -2054,6 +2063,38 @@ __metadata: languageName: node linkType: hard +"@radix-ui/react-dialog@npm:^1.1.2": + version: 1.1.2 + resolution: "@radix-ui/react-dialog@npm:1.1.2" + dependencies: + "@radix-ui/primitive": 1.1.0 + "@radix-ui/react-compose-refs": 1.1.0 + "@radix-ui/react-context": 1.1.1 + "@radix-ui/react-dismissable-layer": 1.1.1 + "@radix-ui/react-focus-guards": 1.1.1 + "@radix-ui/react-focus-scope": 1.1.0 + "@radix-ui/react-id": 1.1.0 + "@radix-ui/react-portal": 1.1.2 + "@radix-ui/react-presence": 1.1.1 + "@radix-ui/react-primitive": 2.0.0 + "@radix-ui/react-slot": 1.1.0 + "@radix-ui/react-use-controllable-state": 1.1.0 + aria-hidden: ^1.1.1 + react-remove-scroll: 2.6.0 + peerDependencies: + "@types/react": "*" + "@types/react-dom": "*" + react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc + react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc + peerDependenciesMeta: + "@types/react": + optional: true + "@types/react-dom": + optional: true + checksum: abf379c021fabad01a4e5d4e0253a73d7cc9aa4947fb63fbdaf9f56d1a7ee82c61a028f09953a1c734ae4f52733f4dcbd2b404e7eada13fc4f74f690aa65395b + languageName: node + linkType: hard + "@radix-ui/react-direction@npm:1.1.0": version: 1.1.0 resolution: "@radix-ui/react-direction@npm:1.1.0" @@ -2508,6 +2549,48 @@ __metadata: languageName: node linkType: hard +"@react-three/fiber@npm:^8.17.10": + version: 8.17.10 + resolution: "@react-three/fiber@npm:8.17.10" + dependencies: + "@babel/runtime": ^7.17.8 + "@types/debounce": ^1.2.1 + "@types/react-reconciler": ^0.26.7 + "@types/webxr": "*" + base64-js: ^1.5.1 + buffer: ^6.0.3 + debounce: ^1.2.1 + its-fine: ^1.0.6 + react-reconciler: ^0.27.0 + scheduler: ^0.21.0 + suspend-react: ^0.1.3 + zustand: ^3.7.1 + peerDependencies: + expo: ">=43.0" + expo-asset: ">=8.4" + expo-file-system: ">=11.0" + expo-gl: ">=11.0" + react: ">=18.0" + react-dom: ">=18.0" + react-native: ">=0.64" + three: ">=0.133" + peerDependenciesMeta: + expo: + optional: true + expo-asset: + optional: true + expo-file-system: + optional: true + expo-gl: + optional: true + react-dom: + optional: true + react-native: + optional: true + checksum: 353c921f95c904883412cacefd8043cd864cb34e748b3195419064bb6577b14ec6d5f5e1f087b52a198a555b3f29e9a9196e32e8b25f8e6f14ec1e80211d81ae + languageName: node + linkType: hard + "@rollup/pluginutils@npm:^4.0.0": version: 4.2.1 resolution: "@rollup/pluginutils@npm:4.2.1" @@ -2709,18 +2792,21 @@ __metadata: resolution: "@se-2/nextjs@workspace:packages/nextjs" dependencies: "@heroicons/react": ^2.1.5 + "@radix-ui/react-dialog": ^1.1.2 "@radix-ui/react-icons": ^1.3.0 "@radix-ui/react-label": ^2.1.0 "@radix-ui/react-popover": ^1.1.2 "@radix-ui/react-select": ^2.1.2 "@radix-ui/react-slot": ^1.1.0 "@rainbow-me/rainbowkit": 2.1.6 + "@react-three/fiber": ^8.17.10 "@tabler/icons-react": ^3.19.0 "@tanstack/react-query": ^5.59.15 "@trivago/prettier-plugin-sort-imports": ^4.1.1 "@types/node": ^18.19.50 "@types/react": ^18.3.5 "@types/react-icons": ^3.0.0 + "@types/three": ^0.169.0 "@typescript-eslint/eslint-plugin": ^5.39.0 "@uniswap/sdk-core": ^5.8.2 "@uniswap/v2-sdk": ^4.6.1 @@ -2753,6 +2839,7 @@ __metadata: tailwind-merge: ^2.5.4 tailwindcss: ^3.4.14 tailwindcss-animate: ^1.0.7 + three: ^0.169.0 type-fest: ^4.26.1 typescript: 5.5.3 usehooks-ts: ^3.1.0 @@ -3156,6 +3243,13 @@ __metadata: languageName: node linkType: hard +"@tweenjs/tween.js@npm:~23.1.3": + version: 23.1.3 + resolution: "@tweenjs/tween.js@npm:23.1.3" + checksum: 2f8a908b275bb6729bde4b863c277bf7411d2e0302ceb0455369479077b89eaf8380cd9206b91ff574416418a95c6f06db4e1ddea732a286d0db0ba8e7c093d3 + languageName: node + linkType: hard + "@typechain/ethers-v5@npm:^11.1.2": version: 11.1.2 resolution: "@typechain/ethers-v5@npm:11.1.2" @@ -3234,6 +3328,13 @@ __metadata: languageName: node linkType: hard +"@types/debounce@npm:^1.2.1": + version: 1.2.4 + resolution: "@types/debounce@npm:1.2.4" + checksum: decef3eee65d681556d50f7fac346f1b33134f6b21f806d41326f9dfb362fa66b0282ff0640ae6791b690694c9dc3dad4e146e909e707e6f96650f3aa325b9da + languageName: node + linkType: hard + "@types/debug@npm:^4.1.7": version: 4.1.9 resolution: "@types/debug@npm:4.1.9" @@ -3397,6 +3498,34 @@ __metadata: languageName: node linkType: hard +"@types/react-reconciler@npm:^0.26.7": + version: 0.26.7 + resolution: "@types/react-reconciler@npm:0.26.7" + dependencies: + "@types/react": "*" + checksum: 4122d2b08580f775d0aeae9bd10b68248f894096ed14c0ebbc143ef712e21b159e89d0c628bd95dd3329947fc1ee94a0cb1d2d32b32b1d5d225e70030e91e58f + languageName: node + linkType: hard + +"@types/react-reconciler@npm:^0.28.0": + version: 0.28.8 + resolution: "@types/react-reconciler@npm:0.28.8" + dependencies: + "@types/react": "*" + checksum: 14565638bb34443212738f4dd2e3c9ebccfb5b42e3e94e50feef58dc661a0da3a4eab0d0191d9668e400b9f1dff6cb13fe23b5d1b00f4b13574071d9073c9229 + languageName: node + linkType: hard + +"@types/react@npm:*": + version: 18.3.11 + resolution: "@types/react@npm:18.3.11" + dependencies: + "@types/prop-types": "*" + csstype: ^3.0.2 + checksum: 6cbf36673b64e758dd61b16c24139d015f58530e0d476777de26ba83f24b55e142fbf64e3b8f6b3c7b05ed9ba548551b2a62d9ffb0f95743d0a368646a619163 + languageName: node + linkType: hard + "@types/react@npm:^18.3.5": version: 18.3.5 resolution: "@types/react@npm:18.3.5" @@ -3432,6 +3561,27 @@ __metadata: languageName: node linkType: hard +"@types/stats.js@npm:*": + version: 0.17.3 + resolution: "@types/stats.js@npm:0.17.3" + checksum: 4f84a012f630532877f62959b6335d3fa081ccaac15ce3f1f916741db265bda22b9c927d7efc9cc3389ffd60919a370673cb0b4e7221d580c571031e94b689fd + languageName: node + linkType: hard + +"@types/three@npm:^0.169.0": + version: 0.169.0 + resolution: "@types/three@npm:0.169.0" + dependencies: + "@tweenjs/tween.js": ~23.1.3 + "@types/stats.js": "*" + "@types/webxr": "*" + "@webgpu/types": "*" + fflate: ~0.8.2 + meshoptimizer: ~0.18.1 + checksum: faaa5bbcead150b5627e2e00bb0e63d98c2a8f8d8951f729f889f430a98534c568d73520f43263391157f216a765806c16e2ca05b688506bffb7f8cf417be042 + languageName: node + linkType: hard + "@types/trusted-types@npm:^2.0.2": version: 2.0.4 resolution: "@types/trusted-types@npm:2.0.4" @@ -3446,6 +3596,13 @@ __metadata: languageName: node linkType: hard +"@types/webxr@npm:*": + version: 0.5.20 + resolution: "@types/webxr@npm:0.5.20" + checksum: 8085c291ca8a8adfe03245725384234e62d61cc0f5f7b9985c2a0ba2b2a794cac538861c4904d8fcd28e3e381f0a4ecc5d4514d143dbf3fc0cf3193dc1cc7a54 + languageName: node + linkType: hard + "@typescript-eslint/eslint-plugin@npm:^5.39.0": version: 5.62.0 resolution: "@typescript-eslint/eslint-plugin@npm:5.62.0" @@ -4396,6 +4553,13 @@ __metadata: languageName: node linkType: hard +"@webgpu/types@npm:*": + version: 0.1.49 + resolution: "@webgpu/types@npm:0.1.49" + checksum: aa74b3194eb653955baa63d352e7cafbc7422ad7a7b5cb58fad724761cfe1d96c603b7d2bd0258829496ad4d3d52e156fa5a33f9da6649593e570106d4171c95 + languageName: node + linkType: hard + "abbrev@npm:1, abbrev@npm:^1.0.0": version: 1.1.1 resolution: "abbrev@npm:1.1.1" @@ -5081,7 +5245,7 @@ __metadata: languageName: node linkType: hard -"base64-js@npm:^1.3.1": +"base64-js@npm:^1.3.1, base64-js@npm:^1.5.1": version: 1.5.1 resolution: "base64-js@npm:1.5.1" checksum: 669632eb3745404c2f822a18fc3a0122d2f9a7a13f7fb8b5823ee19d1d2ff9ee5b52c53367176ea4ad093c332fd5ab4bd0ebae5a8e27917a4105a4cfc86b1005 @@ -6077,6 +6241,13 @@ __metadata: languageName: node linkType: hard +"debounce@npm:^1.2.1": + version: 1.2.1 + resolution: "debounce@npm:1.2.1" + checksum: 682a89506d9e54fb109526f4da255c5546102fbb8e3ae75eef3b04effaf5d4853756aee97475cd4650641869794e44f410eeb20ace2b18ea592287ab2038519e + languageName: node + linkType: hard + "debug@npm:4, debug@npm:4.3.4, debug@npm:^4.1.0, debug@npm:^4.1.1, debug@npm:^4.3.1, debug@npm:^4.3.2, debug@npm:^4.3.3, debug@npm:^4.3.4, debug@npm:~4.3.1, debug@npm:~4.3.2": version: 4.3.4 resolution: "debug@npm:4.3.4" @@ -7749,6 +7920,13 @@ __metadata: languageName: node linkType: hard +"fflate@npm:~0.8.2": + version: 0.8.2 + resolution: "fflate@npm:0.8.2" + checksum: 29470337b85d3831826758e78f370e15cda3169c5cd4477c9b5eea2402261a74b2975bae816afabe1c15d21d98591e0d30a574f7103aa117bff60756fa3035d4 + languageName: node + linkType: hard + "file-entry-cache@npm:^6.0.1": version: 6.0.1 resolution: "file-entry-cache@npm:6.0.1" @@ -9435,6 +9613,17 @@ __metadata: languageName: node linkType: hard +"its-fine@npm:^1.0.6": + version: 1.2.5 + resolution: "its-fine@npm:1.2.5" + dependencies: + "@types/react-reconciler": ^0.28.0 + peerDependencies: + react: ">=18.0" + checksum: b801f101a618f0659566d1793efd2498719463a3f1a93c063c0745524fbfae1abc5e0bafdb4fd4d7d4382ac845755e86197f3c7cb5d0c07b56d380acb9b7c6d4 + languageName: node + linkType: hard + "jackspeak@npm:^2.3.5": version: 2.3.5 resolution: "jackspeak@npm:2.3.5" @@ -10113,6 +10302,13 @@ __metadata: languageName: node linkType: hard +"meshoptimizer@npm:~0.18.1": + version: 0.18.1 + resolution: "meshoptimizer@npm:0.18.1" + checksum: 101dbed8abd4cf167cdb7a0bc13db90dd0743332c689e43b18cc5254d238f0766750752432401fa63dc7e9e32399ef68daacf48f0d89db1484042c1761c7362d + languageName: node + linkType: hard + "micro-ftch@npm:^0.3.1": version: 0.3.1 resolution: "micro-ftch@npm:0.3.1" @@ -12010,6 +12206,18 @@ __metadata: languageName: node linkType: hard +"react-reconciler@npm:^0.27.0": + version: 0.27.0 + resolution: "react-reconciler@npm:0.27.0" + dependencies: + loose-envify: ^1.1.0 + scheduler: ^0.21.0 + peerDependencies: + react: ^18.0.0 + checksum: c2ae111f150c2a46970182df12ea8254719fdfec5e26574711b1838fc37863c63671460a351570fd359c088d891e7bb0ff89023c2f7c1582393b57dd517b92c2 + languageName: node + linkType: hard + "react-remove-scroll-bar@npm:^2.3.4": version: 2.3.4 resolution: "react-remove-scroll-bar@npm:2.3.4" @@ -12551,6 +12759,15 @@ __metadata: languageName: node linkType: hard +"scheduler@npm:^0.21.0": + version: 0.21.0 + resolution: "scheduler@npm:0.21.0" + dependencies: + loose-envify: ^1.1.0 + checksum: 4f8285076041ed2c81acdd1faa987f1655fdbd30554bc667c1ea64743fc74fb3a04ca7d27454b3d678735df5a230137a3b84756061b43dc5796e80701b66d124 + languageName: node + linkType: hard + "scheduler@npm:^0.23.2": version: 0.23.2 resolution: "scheduler@npm:0.23.2" @@ -13334,6 +13551,15 @@ __metadata: languageName: node linkType: hard +"suspend-react@npm:^0.1.3": + version: 0.1.3 + resolution: "suspend-react@npm:0.1.3" + peerDependencies: + react: ">=17.0" + checksum: 280de571d33ffe825bb28fab25e81272b396c3295d91f50ac48b6a3777830035fa40909015dfaef17e34b9ad4ce15fcb4d73cc59530d4bc82490471322f7dbbe + languageName: node + linkType: hard + "table-layout@npm:^1.0.2": version: 1.0.2 resolution: "table-layout@npm:1.0.2" @@ -13478,6 +13704,13 @@ __metadata: languageName: node linkType: hard +"three@npm:^0.169.0": + version: 0.169.0 + resolution: "three@npm:0.169.0" + checksum: 714b68911a26523858edf10e6ed33e41901edaba734b6acd3aa3542746e45570295fa8750723b06bcb9d223013dba920e946e02a018ee136c86da927c04441c3 + languageName: node + linkType: hard + "time-span@npm:4.0.0": version: 4.0.0 resolution: "time-span@npm:4.0.0" @@ -15027,6 +15260,18 @@ __metadata: languageName: node linkType: hard +"zustand@npm:^3.7.1": + version: 3.7.2 + resolution: "zustand@npm:3.7.2" + peerDependencies: + react: ">=16.8" + peerDependenciesMeta: + react: + optional: true + checksum: 18f025b1b666a311121d3855303ff58e6a21fd107920ca474307e86984c13338d6c4cfa5cdf13382a9e0f76821f2554a12d4d200a98a66b58637e729f149797b + languageName: node + linkType: hard + "zustand@npm:^5.0.0": version: 5.0.0 resolution: "zustand@npm:5.0.0"