Skip to content

Commit

Permalink
Implement /profile, /create-profile page route (#1401)
Browse files Browse the repository at this point in the history
* feat: add marketing pages

* chore: strip layout and Header

This commit is to be reverted, stripping happens for faster compilations
on dev server

* feat: add GuilPassInvite

* feat: add GuildPassInvite

* feat: add threejs

* chore: fine tune carousel

* feat: add CarouselDotButton

* chore: rename hook

* fix: update CarouselDotButton type

* chore: remove margin bottom from canvas

* chore: ignore unknown error

* chore: add tooltip provider to layout

* chore: attempt to merge picker and checkout card

* fix: correctly update the picked pass

* chore: finish picker view

* chore: add bold to chosen pass

* feat: rename modals, add start profile

* chore: resize icon, add input inside label

* chore: add manual control over progression

* chore: spacing fix

* chore: adjust StartProfile spacing

* chore(css): adjust to design

* chore: change button to ghost

* fix: disallow empty changes on toggle button

* chore: change avatar bg

* feat: add keyboard navigation

* chore: update to external changes

* upgrade package-lock

* fix: change banner color in dark mode

* cleanup: remove unused atom

* cleanup(Carousel): remove `* as React` imports for consistency

* fix: adjust card sizes

* feat: add purcase success effect

* chore: remove focus from button

* chore: remove hover effect on selected pass

* fix: make text selectable

* fix: remove shadon, update Layout

* chore: fix invalid tailwind class

* chore: add missed cn call to Layout

* chore: add basic logic to driver

* chore: disable autoplay on dot button click

* feat: add driver logic

* chore: rename data to chainData

* fix: spread prev value too

* fix(ChoosePass): disable autoplay & start from the 2nd slide

* fix: rename type

* feat: add emoji images

* revert: add layout and header back

* chore: remove accidental line terminator

* wip: prepare components for animations

* feat: add farcaster button

* chore: reposition driver buttons

* feat: add destructive to button and required to label

* feat: add container to StartProfile (#1411)

* feat: add container to StartProfile

* feat: add avatar to form

* feat: add avatar upload and error message

* feat: add confetti effect on create profile

* feat: add sfx to confetti

* feat: add farcaster autofill, fix submit by avatar

* docs: rename credits file

* feat: redirect on profile creation

* chore: replace route instead push

* fix: address farcaster linking

* chore: update zod message

* fix: make avatar size properly image, disable

* fix: align code to suggestions

* feat: reset onboarding if not signed in

* chore: rename handle to username

* chore: replace local profile types

* refactor: move profileSchema into validations

* chore: remove walletselectormodal popup

* fix(turbopack): avoid server relative imports

* fix: add absolute path to confetti sfx

* fix: align carousel dots to center

* UI(Benefits): sizing & whitespace refinements

* fix(ConnectFarcasterButton): icon alignment

* chore: fix types and farcaster image

* refactor: use backend schemas

* feat: add models to `/create-profile` scenes (#1441)

* feat: add models to scene

* refactor: use backend schemas

* chore: compress guild pass models

* Implement `/profile` presentation and container (#1403)

* feat: add chart and start profile page

* chore: build up profile main section

* chore: adjust css to design

* chore: add mobile view

* feat: add contribution card

* chore: position xp radial chart correctly

* feat: improve contribution card view

* chore: add RecentActivity

* chore: replace xp by badge

* chore: move PageContainer into Layout

* chore: add customizability to Layout components

* test: update stories

* chore: remove lucide-react dep

* feat: add bg to circle xp bar

* feat: try filling user data

* chore: remove providers and account

* chore: fine tune CircularProgressBar

* feat: try adding compoundVariants to Toggle

* feat: add LevelPolygon

* chore: add back profile fetching

* chore: finish toggle color config

* fix: address toggle type errors

* Revert "fix: address toggle type errors"

This reverts commit e82fbc8.

* Revert "chore: finish toggle color config"

This reverts commit 913e436.

* feat: improve toggle variants

* chore: adjust spacing and remove placeholder desc

* feat: add LevelBadge

* feat: start editprofile

* refactor(css): redo profile summary

* refactor(css): improve contribution cards

* Revert "chore: remove providers and account"

This reverts commit 2c28453.

* feat: add OperatedGuildCard

* chore: add EditProfile

* feat: finish EditProfile presentation

* chore: adjust spacing in EditProfile

* fix: spread props

* feat: add delete profile view

* feat: add EditContributions

* refactor: remove cartesian grid from ActivityChart

* refactor: reduce spacing on CheckMark

* feat(LayoutFooter): accept children

* fix: remove shadow from LevelBadge

* fix(css): adjust styles

* fix(css): add padding to OperatedGuildCard

* fix(css): adjust styles to design

* chore: move profile to csr only temporarily

* UI(EditContributions): smaller button

* UI(EditProfile): adjust borders

* UI(Dialog): default footer styles

* cleanup: move const out of render function

* remove rechart & Experience section

* UI: make borders muted

* OperatedGuildCard components

* chore: remove xp metagame related components

* implement contribution container (#1430)

* feat: add useContribution

* feat: update contribution card

* chore: add EditContribution

* feat: add select contribution

* feat: add edit contribution

* chore: try adding EditContributionCard container

* feat: add image to select items

* chore: align select item padding with input

* chore: start adding swr smaller fetches

* feat: add delete update and create contribution

* feat: add create new contribution

* feat: cover contribution CRUD

* chore: remove revalidation from swr fetches

* feat: add delete loader and validation

* refactor: select placeholder fix, remove comments

* refactor: remove useAllUserRoles.tsx

* chore: use GuildLabel on ContributionCardView

* UI(OperatedGuildCard): light mode

* Implement `EditProfile` container (#1427)

* feat: add delete profile hook

* feat: add profile editing

* fix: update Header import

* chore: remove sfx from confetti

* fix: update jotai type

* chore: add comment to assertion

* chore: add ts path alias for @app dir

* refactor: apply write-check

* feat: remove profile atom and add swr hooks

* feat: add ssr to page

* feat: add profile owner guard

* feat: add ssr with swr fallback

* feat: add ssr with swr fallback for guild and role

* chore: add note why use constant api url

* chore: resolve schema errors in profile update

* refactor: revalidate on profile deletion

* UI(Avatar): smaller more count text

* add FeaturedIcon to OperatedGuildCard

* chore: break profile name and remove caretdown

* fix(CardWithGuildLabel): label in light mode

* chore: add card behind edit profile

* feat: add not found page

* feat: add color picker

* refactor: redirect to error and fetch per guild

* add optimistic update for edit contributions and profile (#1438)

* refactor: redirect to error and fetch per guild

* feat: add optimistic update to contributions

* feat: finish update contribution and polish

* feat: add optimistic update to profile

* chore: rename revalidateContribution and fix type error

* feat: memoize profile guard

* static banner style base

* UI: layout & responsivity impros

* SectionTitle component & md size on mobile

* UI(OperatedGuildCard): responsivity impros

* chore: add bg to CardWithGuildLabel

* UI(ContributionCard): responsivity impros

* update to new types package & change profileId to userId

* UI(EditProfile): subtle border for images too

* update to new types package

* feat: working color theming

* fix(ProfileColorPicker): dynamic icon color

* UI(EditProfile): inside scroll in modal

* refactor(EditProfile): batch components

* feat: background image

* fix: address client side error and remove type assertions

* feat: add referred users

* chore: switch to dev backend, cache activities

* cleanup chart colors

* refactor: use backend schemas

* fix: broken banner styles

---------

Co-authored-by: BrickheadJohnny <[email protected]>
Co-authored-by: valid <[email protected]>

* chore: remove old activity endpoint

* chore: extract OperatedGuildCard

* Remake `/create-profile` driver with referrer (#1445)

* feat: add referred users to claim pass

* fix: prevent render loop

* chore: try adding wizard form with history

* feat: add auth wall

* feat: add onboarding flow restrictions

* chore: remove subscription logic

* chore: clean up comments and unused file

* chore: remove unused comments in ClaimPass

* chore: add margin top to form description

* chore: remove unused variables

* fix: omit referredUserId from schema

* chore: exclude subscription features

* chore: improve auth wall page design

* chore: add short profile intro

* Revert "chore: exclude subscription features" (#1446)

This reverts commit 56e64e8.

* UI impros, use layout from create-guild

* chore: add select component back

* chore: remove auth guard paragraph

* chore: add todo to profile creation

* fix(css): move card compound layout into create-profile

* Revert "chore: remove auth guard paragraph"

This reverts commit 8fd993d.

* chore: adjust spacing on auth guard

* feat: add username validation onBlur

* fix: add default referrer to submit

* fix: avoid error retry for invite link

* fix: prevent invalid user submit

* refactor: rename chain to createProfile

* fix: put router call into useEffect

* feat: sustain invite link on AuthWall

* fix: add Suspense to searchParams calls

* Revert "fix: add Suspense to searchParams calls"

This reverts commit 2fc759b.

* chore: move suspense out to layout

---------

Co-authored-by: valid <[email protected]>

* feat: add empty cards for contribution (#1447)

* CardWithGuildLabel: handle light colors

* refactor: extract ProfileHero component

* UI: make hero section the same in light mode as in dark mode

* fix: prevent NaN on contribution card

* fix(ProfileHero): referredUsers fallback

* automatic banner height with css, smaller edit btn on mobile, whitespace impros, simplifications

* feat: implement account modal for profile (#1429)

* feat: implement account modal for profile

* chore: center align CheckMark

* chore: replace account name placeholder

* separate NetworkIndicator component and add to profile popover too

* UI(AccountModal): profile section refinements

* chore: remove xp and payment feature

---------

Co-authored-by: valid <[email protected]>

* chore: update useDeleteProfile redirect

* chore: remove subscription logic

* chore: truncate and fallback account usernames

* fix: load empty card on 0 len, slice contribution

* ProfileColorBanner: remove legacy comment

* add join profile action card (#1451)

* feat: add join profile action card

* feat: add mountain icon and restrict card popup

* chore: prevent pointer event overlay

* chore: add activity log with filter (#1450)

* chore: add activity log with filter

* feat: add more actions, remove unused code

* chore: add refer profile and guild fallback

* chore: add spacing above RecentActivity

* chore: update outdated footer text

* chore: add key to activity skeleton

* chore: add color support for guild activity

* fix: remove accidental catch chain

* UI(create-guild): impros, use layout from create-guild (lost changes during merge)

* fix(GuildLabel): color in dark mode for guilds without theme color

* feat: add fallback image and name to profile

* refactor: move related activity files to RecentActivity folder

* UI(RecentActivity): refinements

* feat(RecentActivity): handle no actions / less than 20 actions cases

* feat(RecentActivity): add fallback when wallet is not connected

* fix: prevent falsy userId when updating profile

* fix(RecentActivity): >= 20 condition

* RecentActivity: filter actions

* RecentActivity: remove last month filter

* RecentActivity: show reward badges

* fix(RoleBadge): deleted state instead of infinite loading state

* remove duplicated guild badges (temporarily comment out)

* fix(BadgeSkeleton): layout shift

* RecentActivity: SendReward to GetReward

* chore: rename ActionLabel to ProfileActionLabel & add comment about it

* remove duplicated ACTION enum, add profile icons (for personal activity log)

* filter types to match the scope of the current design

* chore: round down numbers if possible in contribution

* chore: remove farcaster follower view from hero

* chore: add line clamp to edit contribution

* chore: remove GuildPass from ClaimPass

* fix: prevent hydration error and AuthWall flicker

* feat: add relevant metadata to page

* chore: clarify profile title metadata

* chore: clarify profile footer paragraph

* fix: avoid JoinProfileAction flash popup

* chore: add priority to profileBackgroundUrl

* chore: prevent flash on Account

* refactor: rename createprofile function

* chore: revalidate user on createProfile

* chore: back to prod backend

* update to new types package

* feat(StartProfile): set default color by profile pic automatically

* feat(CardWithGuildLabel): add hover title to view full name

* chore: rename claim-pass to prompt-referrer

* chore: revalidate user on edit profile

* fix: allow mixed cased username, filter lego route better

* fix(ActivityCard): text color for guilds without color

* feat: RewardBadges

* feat: reset form on EditContribution Add

* chore: add referred users to swr cache

* chore: put revalidate tag on referred users

* fix: revalidate user on profile delete, enlongate loading on start profile

* chore: add loading state to delete profile button

* fix(css): add overflow hidden to Account card skeleton

* chore: add referred users type

* chore: revalidate contributions, cleanup start profile route
when a profile was deleted, the contribution cache remained and caused bugs on the new profile

* Add farcaster follower and relevant follower integration to `/profile` (#1455)

* chore: try adding farcaster integration

* feat: refine ProfileHero

* chore: put revalidate tag on fc profile

* refactor: move logic to ProfileSocialCounters component

* refactor: SocialCountTile

* refactor: rename variables and add docs, fallback if referred is not defined

* refactor: farcaster hooks

* UI: remove divider on small screens

* adjust referredUsers condition

---------

Co-authored-by: valid <[email protected]>

* fix(RewardBadge): reward types with primitive colorSchemes

* UI(AccountModal): margin refinement & use correct Button component

* fix(ProfileBackgroundImageUploader): error toast

* feat(ProfileBackgroundUploader): add tooltip

* fix: replace next image with regular img

* fix: remove size param

* chore: replace next image with image on editprofile

* fix: add types to neynar responses, DisplayableUser

* chore: add error message for relevant followers

* chore: add "Only " just below 18 percent

* extract EditProfilePicture to separate component

* feat(EditProfilePicture): upload feedback, error handling

* feat(EditProfile): handle saving while still uploading images
& simplification

* cleanup: delete profile loading logic

* chore: add object cover to avatar on StartProfile

* copy(PromptReferrer): remove description & adjust helper text

* copy(useDeleteProfile): add "redirecting to..." description

* feat: add farcaster autofill on editprofile, move delete profile (#1466)

* feat: add farcaster autofill on editprofile, move delete profile

* extract to separate EditProfileDropdown component

* UI improvements

* remove modal inside scroll and relevant styling

* add back delete loading state

---------

Co-authored-by: valid <[email protected]>

* feat: set auto background color by farcaster image too

* refactor: EditProfilePicture on StartProfile too

* cleanup: remove custom error handling that's already abstracted in usePinata

* UI fix(create-profile): banner radial fade

* feat(StartProfile): handle saving while still uploading image

* cleanup: remove console log

* UI(CreateProfileSkeleton): decrease height

* UI(create-profile): size lg inputs & buttons

* fix(create-profile): correct card width on mobile for every step

* fix(create-profile): correct card width for "sign in" step too

* chore: use ui AvatarFallback

* chore: add unique tags onto profile ssr requests

* fix: remove quotes from fc relevant followers, size AvatarGroup image

* move farcaster avatars to pinata (#1469)

* feat: move farcaster avatars to pinata on profile update

* chore: restrict submit when uploading image

* feat: upload farcaster image to IPFS in EditProfile

* feat(EditProfilePicture): show spinner if progress is not available

* refactor: extract image uploader

* refactor: exclude not required fields

* chore: rename uploader

* cleanup(StartProfile): remove unnecessary loading condition
isUploadingShown already handles it, avoiding confusion about why the button might be disabled

---------

Co-authored-by: valid <[email protected]>

* chore: hide AccountModal on profile visit

* Add contribution collection to `/profile`, improve card (#1454)

* feat: add collection and checkmark

* chore: add extended collection

* fix: add line clamp to edit contribution select

* feat: add point image to contribution

* fix: show cards if no point is received

* feat: add points text and leaderboard ranking

* chore: copy static folder to public

* chore: render contribution card if no collection is present

* feat: add nft to collection

* feat: add pins

* refactor: cleanup collection

* fix: remove checkmark, allow longer label

* feat: add tooltip to collection

* fix: prevent wrap on points text

* chore: remove NFT from tooltip

* chore: remove src/static dir duplication

* chore: polish borders

* chore: add border to AvatarGroup

* chore: truncate relevant followers and balance text

* fix: dont revalidate all profile and contribution

* feat: add guildmate skeleton

* fix: revalidate profile properly on username update

* fix: only send dirty values from profile update + a11y

* chore: adjust social counter max width

* Revert "chore: adjust social counter max width"

This reverts commit 053dd7a.

* chore: ease social counter inner max width

* fix: prevent double file explorer popup on bg upload

* refactor: remove userId filter on RecentActivity

* fix: farcaster others pluralize + more space

* fix: farcaster others pluralize + more space

* chore: reapply userid filter to RecentActivity

* feat: add "Just now" if event is 0 minutes ago

* add xp metagame to profile (#1473)

* feat: add progress bar and polygon

* feat: implement xp ranking, leveling logic

* chore: remove console.log

* feat: add xp to activity card, refactor xp system

* feat: add xp to activity card, refactor xp system

* fix: cache experiences count on server

* feat: add xp to Account and AccountModal

* fix(a11y): add dialog description to modal

* UI(ActivityCard): move XP to the right in gold

* feat: add activity chart

* feat: add tooltip to chart

* UI(ProfileHero): avatar level indicator refinements

* feat: style tooltip and group xp entries

* chore: adjust barchart size

* fix: size experience card with badge

* refactor: resize RewardBadge

* refactor: add progress ui component

* fix: assign rank properly on profile

* chore: floor levels for simplicity

* chore: revalidate experiences every 20 min

* fix: Experience & Top contributions title colors in light mode

* UI: whitespace refinement

* chore: add fallback to activity chart

* UI(experiences): impros/fixes

* fix: reorder useEffect calls, adjust startTime

* UI: account modal & progress refinements

* cleanup(LevelBadge): duplicated text style

* copy(ActivityChart): fallback fix

* ActivityChart batching / fallback rendering impro

---------

Co-authored-by: valid <[email protected]>

* fix: start counting avatar from 1

---------

Co-authored-by: BrickheadJohnny <[email protected]>
Co-authored-by: valid <[email protected]>
  • Loading branch information
3 people authored Sep 12, 2024
1 parent 0913140 commit e544c39
Show file tree
Hide file tree
Showing 125 changed files with 6,988 additions and 1,428 deletions.
2,917 changes: 1,669 additions & 1,248 deletions package-lock.json

Large diffs are not rendered by default.

11 changes: 10 additions & 1 deletion package.json
Original file line number Diff line number Diff line change
Expand Up @@ -31,7 +31,7 @@
"@emotion/styled": "^11.11.0",
"@fuels/connectors": "^0.5.0",
"@fuels/react": "^0.20.0",
"@guildxyz/types": "^1.10.2",
"@guildxyz/types": "^1.10.10",
"@hcaptcha/react-hcaptcha": "^1.4.4",
"@hookform/resolvers": "^3.3.4",
"@lexical/code": "^0.12.0",
Expand All @@ -42,6 +42,7 @@
"@lexical/rich-text": "^0.12.0",
"@lexical/selection": "^0.12.0",
"@lexical/utils": "^0.12.0",
"@neynar/nodejs-sdk": "^1.51.0",
"@nouns/assets": "^0.4.2",
"@phosphor-icons/react": "^2.1.7",
"@radix-ui/react-accordion": "^1.2.0",
Expand All @@ -53,6 +54,7 @@
"@radix-ui/react-focus-scope": "^1.1.0",
"@radix-ui/react-label": "^2.1.0",
"@radix-ui/react-popover": "^1.1.1",
"@radix-ui/react-progress": "^1.1.0",
"@radix-ui/react-radio-group": "^1.2.0",
"@radix-ui/react-select": "^2.1.1",
"@radix-ui/react-separator": "^1.1.0",
Expand All @@ -61,11 +63,14 @@
"@radix-ui/react-toggle": "^1.1.0",
"@radix-ui/react-toggle-group": "^1.1.0",
"@radix-ui/react-tooltip": "^1.1.2",
"@react-three/drei": "^9.108.4",
"@react-three/fiber": "^8.16.8",
"@snyk/protect": "latest",
"@t3-oss/env-nextjs": "^0.10.1",
"@tanstack/react-query": "^5.26.3",
"@tanstack/react-table": "^8.13.2",
"@tanstack/react-virtual": "^3.5.0",
"@types/three": "^0.166.0",
"@vercel/kv": "^1.0.1",
"@vercel/speed-insights": "^1.0.12",
"@visx/curve": "^3.3.0",
Expand All @@ -79,6 +84,8 @@
"clsx": "^2.1.1",
"color": "^4.2.3",
"colorthief": "^2.3.2",
"embla-carousel-autoplay": "^8.1.6",
"embla-carousel-react": "^8.1.6",
"events": "^3.3.0",
"framer-motion": "^7.10.3",
"fuels": "^0.89.1",
Expand All @@ -96,6 +103,7 @@
"qrcode.react": "^3.1.0",
"randombytes": "^2.1.0",
"react": "^18.2.0",
"react-canvas-confetti": "^2.0.7",
"react-device-detect": "^2.2.2",
"react-dom": "^18.2.0",
"react-dropzone": "^14.2.3",
Expand All @@ -111,6 +119,7 @@
"swr": "^2.2.4",
"tailwind-merge": "^2.3.0",
"tailwindcss-animate": "^1.0.7",
"three": "^0.166.1",
"usehooks-ts": "^3.1.0",
"uuidv7": "^0.6.3",
"viem": "^2.21.1",
Expand Down
Binary file added public/apple_emojis/bust-in-silhouette.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added public/apple_emojis/compass.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added public/apple_emojis/people-with-bunny-ears.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added public/apple_emojis/sparkles.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added public/apple_emojis/speech-balloon.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added public/apple_emojis/star.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added public/apple_emojis/technologist.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added public/apple_emojis/unlocked.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added public/models/basic_guild_pass-transformed.glb
Binary file not shown.
Binary file added public/models/gold_guild_pass-transformed.glb
Binary file not shown.
1 change: 1 addition & 0 deletions public/sfx/CREDITS.md
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
"./confetti-party-popper.mp3" : Attribution 4.0 International (CC BY 4.0) - Vilkas Sound
Binary file added public/sfx/confetti-party-popper.mp3
Binary file not shown.
Original file line number Diff line number Diff line change
@@ -0,0 +1,31 @@
"use client"

import { useSetAtom } from "jotai"
import { useRouter } from "next/navigation"
import { ChoosePass } from "../_components/ChoosePass"
import { createProfileDataAtom } from "../atoms"

const Page = () => {
const router = useRouter()
const setData = useSetAtom(createProfileDataAtom)

return (
<ChoosePass
data={{}}
dispatchAction={({ action, data }) => {
if (action === "next") {
if (!data?.chosenSubscription) {
throw new Error("Tried to resolve choose pass without value")
}
setData((prev) => ({ ...prev, ...data }))
router.push("purchase-pass")
}
if (action === "previous") {
router.back()
}
}}
/>
)
}

export default Page
Original file line number Diff line number Diff line change
@@ -0,0 +1,27 @@
"use client"

import { useWeb3ConnectionManager } from "@/components/Web3ConnectionManager/hooks/useWeb3ConnectionManager"
import { useRouter, useSearchParams } from "next/navigation"
import { PropsWithChildren, useEffect } from "react"
import { useIsClient } from "usehooks-ts"
import { CreateProfileSkeleton } from "./CreateProfileSkeleton"

export const AuthWall = ({ children }: PropsWithChildren) => {
const { isWeb3Connected } = useWeb3ConnectionManager()
const isClient = useIsClient()
const router = useRouter()
const searchParams = useSearchParams()

useEffect(() => {
if (isWeb3Connected === false)
router.replace(
["/create-profile", searchParams].filter(Boolean).map(String).join("?")
)
}, [isWeb3Connected, router.replace, searchParams])

if (!isWeb3Connected || !isClient) {
return <CreateProfileSkeleton />
}

return children
}
Original file line number Diff line number Diff line change
@@ -0,0 +1,52 @@
/*
Auto-generated by: https://github.com/pmndrs/gltfjsx
Command: npx [email protected] basic_guild_pass.glb --transform --types
Files: basic_guild_pass.glb [10.27MB] > /home/senkora/projects/guild.xyz/public/models/basic_guild_pass-transformed.glb [551.1KB] (95%)
*/

import { useGLTF } from "@react-three/drei"
import * as THREE from "three"
import { GLTF } from "three-stdlib"

type GLTFResult = GLTF & {
nodes: {
Curve: THREE.Mesh
Curve001: THREE.Mesh
Curve003: THREE.Mesh
}
materials: {
SVGMat: THREE.MeshStandardMaterial
"Material.001": THREE.MeshStandardMaterial
"Material.002": THREE.MeshStandardMaterial
}
// animations: GLTFAction[]
}

export function Model(props: JSX.IntrinsicElements["group"]) {
const { nodes, materials } = useGLTF(
"/models/basic_guild_pass-transformed.glb"
) as GLTFResult
return (
<group {...props} dispose={null}>
<mesh
geometry={nodes.Curve.geometry}
material={materials.SVGMat}
scale={6.649}
/>
<mesh
geometry={nodes.Curve001.geometry}
material={materials["Material.001"]}
position={[-1.598, 0.015, 0.781]}
scale={6.86}
/>
<mesh
geometry={nodes.Curve003.geometry}
material={materials["Material.002"]}
position={[-0.597, 0.018, 0.315]}
scale={6.104}
/>
</group>
)
}

useGLTF.preload("/models/basic_guild_pass-transformed.glb")
Original file line number Diff line number Diff line change
@@ -0,0 +1,52 @@
import { Card } from "@/components/ui/Card"
import { cn } from "@/lib/utils"
import Image from "next/image"
import { BENEFITS } from "../constants"

export const Benefits = () => {
return (
<>
<h2 className="text-center font-extrabold text-muted-foreground leading-none tracking-tighter">
Benefits
</h2>
<p className="pb-5 text-center text-muted-foreground text-sm">
All passes provide the same benefits
</p>
<div className="grid grid-cols-1 gap-3 lg:grid-cols-2">
{BENEFITS.map(({ title, description, isAvailable, image }) => (
<Card
className={cn(
"flex items-center gap-4 border-2 border-transparent p-5",
{
"relative border-border border-dotted bg-transparent shadow-none":
!isAvailable,
}
)}
key={title}
>
{isAvailable || (
<div className="absolute top-2 right-1 w-24 translate-x-1/3 rotate-45 select-none bg-card py-1 text-center font-semibold text-xs">
Soon
</div>
)}
<div
className={cn(
"flex aspect-square min-w-12 items-center justify-center rounded-xl bg-card-secondary",
{ "bg-muted": !isAvailable }
)}
>
<Image src={image} alt="" width={28} height={28} />
</div>
<div className="space-y-0.5">
<h3 className="font-semibold">{title}</h3>
<p className="text-muted-foreground">{description}</p>
</div>
</Card>
))}
</div>
<p className="pt-10 text-center text-muted-foreground text-sm">
Prices are subject to change in the future
</p>
</>
)
}
Original file line number Diff line number Diff line change
@@ -0,0 +1,123 @@
"use client"

import { Button } from "@/components/ui/Button"
import {
Carousel,
CarouselApi,
CarouselContent,
CarouselDotButton,
CarouselItem,
useCarouselDotButton,
} from "@/components/ui/Carousel"
import { Separator } from "@/components/ui/Separator"
import { ToggleGroup, ToggleGroupItem } from "@radix-ui/react-toggle-group"
import { useEffect, useState } from "react"
import { SUBSCRIPTIONS } from "../constants"
import { CreateProfileStep } from "../types"
import { Benefits } from "./Benefits"
import { GuildPassScene } from "./GuildPassScene"

export const ChoosePass: CreateProfileStep = ({ dispatchAction }) => {
const [api, setApi] = useState<CarouselApi>()
const [subscriptionIndex, setSubscriptionIndex] = useState<number>()
const { selectedIndex, scrollSnaps, onCarouselDotButtonClick } =
useCarouselDotButton(api)
useEffect(() => {
if (subscriptionIndex === undefined) return
dispatchAction({
action: "next",
data: {
chosenSubscription: SUBSCRIPTIONS[subscriptionIndex],
},
})
}, [subscriptionIndex, dispatchAction])

return (
<div className="max-w-screen-lg">
<h1 className="mt-8 mb-4 h-10 text-center font-bold font-display text-2xl leading-none tracking-tight ">
Choose your pass
</h1>
<Carousel
className={"cursor-pointer active:cursor-grabbing lg:hidden"}
setApi={setApi}
opts={{
startIndex: 1,
}}
>
<CarouselContent>
{SUBSCRIPTIONS.map(({ title, description, pricing }, i) => (
<CarouselItem className="select-none" key={title}>
<article className="flex h-full flex-col items-center pb-6 text-center">
<div className="mb-2 h-48 w-full">
<GuildPassScene sceneVariant={title} />
</div>
<div className="px-4">
<h2 className="font-extrabold text-lg">{title}</h2>
<strong className="font-extrabold text-lg text-orange-500">
{pricing}
</strong>
<p className="max-w-xs text-balance pt-2 text-muted-foreground text-sm">
{description}
</p>
<Button
colorScheme="primary"
className="mt-6 w-full"
onClick={() => setSubscriptionIndex(i)}
>
Purchase
</Button>
</div>
</article>
</CarouselItem>
))}
</CarouselContent>
</Carousel>
<div className="mb-4 flex justify-center space-x-3 lg:hidden">
{scrollSnaps.map((_, i) => (
<CarouselDotButton
key={i}
onClick={() => onCarouselDotButtonClick(i)}
isActive={i === selectedIndex}
/>
))}
</div>

<ToggleGroup type="single" className="relative hidden items-end lg:flex">
{SUBSCRIPTIONS.map(({ title, description, pricing }, i) => (
<ToggleGroupItem
value={title}
onClick={() => setSubscriptionIndex(i)}
className={
"relative w-full select-none from-accent outline-none hover:bg-gradient-to-t focus-visible:bg-gradient-to-t focus-visible:ring-4 focus-visible:ring-ring"
}
key={title}
>
<article className="flex flex-col items-center pb-6 text-center">
<div className="mb-2 h-48">
<GuildPassScene sceneVariant={title} />
</div>
<div className="px-8">
<h2 className="font-extrabold text-lg">{title}</h2>
<strong className="font-extrabold text-lg text-orange-500">
{pricing}
</strong>
<p className="max-w-xs text-balance pt-2 text-muted-foreground text-sm">
{description}
</p>
</div>
{i < SUBSCRIPTIONS.length - 1 && (
<Separator
orientation="vertical"
className="absolute right-0 block bg-[none] bg-gradient-to-t from-border to-60%"
/>
)}
</article>
</ToggleGroupItem>
))}
</ToggleGroup>
<div className="space-y-2 border-border border-t bg-background p-8">
<Benefits />
</div>
</div>
)
}
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
import { Skeleton } from "@/components/ui/Skeleton"

export const CreateProfileSkeleton = () => {
return <Skeleton className="h-[300px] w-full" />
}
Loading

0 comments on commit e544c39

Please sign in to comment.