generated from scaffold-eth/scaffold-eth
-
Notifications
You must be signed in to change notification settings - Fork 51
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #2093 from jk-labs-inc/staging
patch PR 2 of week ending 8/20/24
- Loading branch information
Showing
20 changed files
with
393 additions
and
85 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
|
|
@@ -27,6 +27,6 @@ | |
| "dependencies": {}, | ||
| "devDependencies": { | ||
| "husky": "9.1.4", | ||
| "turbo": "2.0.12" | ||
| "turbo": "2.0.13" | ||
| } | ||
| } | ||
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
23 changes: 23 additions & 0 deletions
23
packages/react-app-revamp/components/UI/GradientText/index.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,23 @@ | ||
| import React, { FC } from "react"; | ||
|
|
||
| interface GradientTextProps { | ||
| text: string; | ||
| isStrikethrough: boolean; | ||
| } | ||
|
|
||
| const GradientText: FC<GradientTextProps> = ({ text, isStrikethrough }) => { | ||
| return ( | ||
| <div className="relative inline-block"> | ||
| <span className="text-[24px] md:text-[31px] font-sabo inline-block"> | ||
| {isStrikethrough && ( | ||
| <span className="absolute inset-0 flex items-center overflow-hidden"> | ||
| <span className="w-full h-0.5 bg-gradient-purple"></span> | ||
| </span> | ||
| )} | ||
| <span className="relative z-10 bg-gradient-purple text-transparent bg-clip-text inline-block">{text}</span> | ||
| </span> | ||
| </div> | ||
| ); | ||
| }; | ||
|
|
||
| export default GradientText; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
64 changes: 64 additions & 0 deletions
64
...-app-revamp/components/_pages/Contest/components/CancelContest/components/Modal/index.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,64 @@ | ||
| import { Dialog, DialogBackdrop, DialogPanel } from "@headlessui/react"; | ||
| import Image from "next/image"; | ||
| import { FC } from "react"; | ||
|
|
||
| interface CancelContestModalProps { | ||
| isCloseContestModalOpen: boolean; | ||
| setIsCloseContestModalOpen: (isOpen: boolean) => void; | ||
| cancelContestHandler: () => void; | ||
| } | ||
|
|
||
| const CancelContestModal: FC<CancelContestModalProps> = ({ | ||
| isCloseContestModalOpen, | ||
| setIsCloseContestModalOpen, | ||
| cancelContestHandler, | ||
| }) => { | ||
| return ( | ||
| <Dialog open={isCloseContestModalOpen} onClose={setIsCloseContestModalOpen} className="relative z-10"> | ||
| <DialogBackdrop | ||
| transition | ||
| className="fixed inset-0 bg-neutral-8 bg-opacity-40 transition-opacity data-[closed]:opacity-0 data-[enter]:duration-300 data-[leave]:duration-200 data-[enter]:ease-out data-[leave]:ease-in" | ||
| /> | ||
|
|
||
| <div className="fixed inset-0 z-10 w-screen overflow-y-auto"> | ||
| <div className="flex min-h-full items-end justify-center text-center sm:items-center sm:p-0"> | ||
| <DialogPanel | ||
| transition | ||
| className="relative mb-14 md:mb-0 transform overflow-hidden rounded-t-[40px] border-t border-neutral-9 md:border-none md:rounded-[10px] bg-true-black text-left shadow-xl transition-all data-[closed]:translate-y-4 data-[closed]:opacity-0 data-[enter]:duration-300 data-[leave]:duration-200 data-[enter]:ease-out data-[leave]:ease-in sm:my-8 sm:w-full sm:max-w-lg sm:p-6 data-[closed]:sm:translate-y-0 data-[closed]:sm:scale-95" | ||
| > | ||
| <div className="flex flex-col gap-8 py-6 md:py-16 pl-8 md:pl-32 pr-4 md:pr-16"> | ||
| <div className="flex justify-between items-center"> | ||
| <p className="text-[24px] text-neutral-11 font-bold">cancel contest?? 😬</p> | ||
| <Image | ||
| src="/modal/modal_close.svg" | ||
| width={39} | ||
| height={33} | ||
| alt="close" | ||
| className="hidden md:block cursor-pointer" | ||
| onClick={() => setIsCloseContestModalOpen(false)} | ||
| /> | ||
| </div> | ||
| <div className="flex flex-col gap-4 text-neutral-11 text-[16px]"> | ||
| <p>if you proceed, you will cancel this contest.</p> | ||
| <p className="font-bold">🚨 players will not be able to keep playing.</p> | ||
| <p> | ||
| 🚨 the contest and entries <i>will</i> remain visible on our site. | ||
| </p> | ||
| <p>🚨 you can withdraw any funds on the rewards page.</p> | ||
| <p>are you really, really, really sure you want to proceed?</p> | ||
| </div> | ||
| <button | ||
| className="mt-4 bg-negative-11 rounded-[40px] w-80 h-10 text-center text-true-black text-[16px] font-bold hover:opacity-80 transition-opacity duration-300 ease-in-out" | ||
| onClick={cancelContestHandler} | ||
| > | ||
| cancel contest 😈 | ||
| </button> | ||
| </div> | ||
| </DialogPanel> | ||
| </div> | ||
| </div> | ||
| </Dialog> | ||
| ); | ||
| }; | ||
|
|
||
| export default CancelContestModal; |
57 changes: 57 additions & 0 deletions
57
packages/react-app-revamp/components/_pages/Contest/components/CancelContest/index.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,57 @@ | ||
| import { chains, config } from "@config/wagmi"; | ||
| import { extractPathSegments } from "@helpers/extractPath"; | ||
| import { TrashIcon } from "@heroicons/react/24/outline"; | ||
| import { useContestStore } from "@hooks/useContest/store"; | ||
| import { useContestState } from "@hooks/useContestState"; | ||
| import { ContestStateEnum, useContestStateStore } from "@hooks/useContestState/store"; | ||
| import { switchChain } from "@wagmi/core"; | ||
| import { usePathname } from "next/navigation"; | ||
| import { useState } from "react"; | ||
| import { useAccount } from "wagmi"; | ||
| import CancelContestModal from "./components/Modal"; | ||
|
|
||
| const CancelContest = () => { | ||
| const pathname = usePathname(); | ||
| const { chainName } = extractPathSegments(pathname); | ||
| const contestChainId = chains.find(chain => chain.name.toLowerCase() === chainName.toLowerCase())?.id; | ||
| const { address, chainId } = useAccount(); | ||
| const isUserOnCorrectChain = contestChainId === chainId; | ||
| const { contestAuthorEthereumAddress } = useContestStore(state => state); | ||
| const { cancelContest, isLoading, isConfirmed } = useContestState(); | ||
| const { contestState } = useContestStateStore(state => state); | ||
| const [isCloseContestModalOpen, setIsCloseContestModalOpen] = useState(false); | ||
| const isAuthor = address === contestAuthorEthereumAddress; | ||
| const isNotCanceled = contestState !== ContestStateEnum.Canceled; | ||
| const shouldRender = isAuthor && isNotCanceled && (!isConfirmed || isLoading); | ||
|
|
||
| if (!shouldRender) return null; | ||
|
|
||
| const handleOpenModal = () => setIsCloseContestModalOpen(true); | ||
|
|
||
| const handleCancelContest = async () => { | ||
| if (!contestChainId) return; | ||
|
|
||
| if (!isUserOnCorrectChain) { | ||
| await switchChain(config, { chainId: contestChainId }); | ||
| } | ||
|
|
||
| cancelContest(); | ||
| setIsCloseContestModalOpen(false); | ||
| }; | ||
|
|
||
| return ( | ||
| <> | ||
| <button disabled={isLoading} onClick={handleOpenModal}> | ||
| <TrashIcon className="w-6 h-6 text-negative-11 hover:text-negative-10 transition-colors duration-300 ease-in-out" /> | ||
| </button> | ||
|
|
||
| <CancelContestModal | ||
| isCloseContestModalOpen={isCloseContestModalOpen} | ||
| setIsCloseContestModalOpen={setIsCloseContestModalOpen} | ||
| cancelContestHandler={handleCancelContest} | ||
| /> | ||
| </> | ||
| ); | ||
| }; | ||
|
|
||
| export default CancelContest; |
24 changes: 24 additions & 0 deletions
24
packages/react-app-revamp/components/_pages/Contest/components/ContestName/index.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,24 @@ | ||
| import GradientText from "@components/UI/GradientText"; | ||
| import { ContestStateEnum, useContestStateStore } from "@hooks/useContestState/store"; | ||
| import { FC } from "react"; | ||
| import CancelContest from "../CancelContest"; | ||
|
|
||
| interface ContestNameProps { | ||
| contestName: string; | ||
| address: string; | ||
| chainName: string; | ||
| } | ||
|
|
||
| const ContestName: FC<ContestNameProps> = ({ contestName, address, chainName }) => { | ||
| const { contestState } = useContestStateStore(state => state); | ||
| const isContestCanceled = contestState === ContestStateEnum.Canceled; | ||
|
|
||
| return ( | ||
| <div className="flex items-center justify-between"> | ||
| <GradientText text={contestName} isStrikethrough={isContestCanceled} /> | ||
| <CancelContest /> | ||
| </div> | ||
| ); | ||
| }; | ||
|
|
||
| export default ContestName; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
11 changes: 10 additions & 1 deletion
11
packages/react-app-revamp/components/_pages/Contest/components/StickyCards/index.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.