Commit 70ef1bf0 authored by Grant's avatar Grant
Browse files

update event info

parent 21e955b5

packages/client/src/components/App.tsx

+0 −1
Original line number Diff line number Diff line
@@ -101,7 +101,6 @@ const AppInner = () => { 
        <AuthErrors />



        <ProfileModal />

        {/* <WelcomeModal /> */}

        <ChatInfoDialog />

        <LoginModal />

        <Moderator />

packages/client/src/components/EventInfo/EventDatesHeader.tsx

+12 −0
Original line number Diff line number Diff line
@@ -16,6 +16,8 @@ export const EventDatesHeader = () => { 
  switch (state) {

    case "BEFORE":

      return <BeforeEvent start={start!} />;

    case "DURING":

      return <DuringEvent end={end!} />;

    case "AFTER":

      return <AfterEvent start={start!} end={end!} />;

  }
@@ -31,6 +33,16 @@ const BeforeEvent = ({ start }: { start: number }) => { 
  );

};



const DuringEvent = ({ end }: { end: number }) => {

  const { timeLeft } = useCountdown(end);



  return (

    <EventHeaderCard>

      Ends in <span className="font-semibold">{timeLeft}</span>

    </EventHeaderCard>

  );

};



const AfterEvent = ({ start, end }: { start: number; end: number }) => {

  return (

    <EventHeaderCard>

packages/client/src/components/EventInfo/EventInfo.tsx

+16 −5
Original line number Diff line number Diff line
@@ -46,10 +46,21 @@ export const EventInfoModal = () => { 
          <>

            <ModalHeader>Canvas 2026</ModalHeader>

            <ModalBody>

              {date.start && Date.now() < date.start ? (

                <>

                  <h1 className="text-3xl text-center font-bold">

                    {date.start ? <TimeUntil start={date.start} /> : "..."}

                  </h1>

                  <h2 className="text-2xl text-center">until Canvas 2026</h2>

                </>

              ) : (

                <>

                  <h1 className="text-3xl text-center font-bold">

                    {date.end ? <TimeUntil start={date.end} /> : "..."}

                  </h1>

                  <h2 className="text-2xl text-center">left for Canvas 2026</h2>

                </>

              )}

              <p>

                Canvas is a collaborative pixel canvas that runs every year for{" "}

                <Link href="https://fediverse.info/" target="_blank">
@@ -114,7 +125,7 @@ export const EventInfoModal = () => { 
              />

            </ModalBody>

            <ModalFooter>

              <Button onPress={onClose}>Show 2025's Canvas</Button>

              <Button onPress={onClose}>View the Canvas!</Button>

            </ModalFooter>

          </>

        )}

packages/client/src/components/Welcome/WelcomeModal.tsx

deleted100644 → 0
+0 −68
Original line number Diff line number Diff line 
import {

  Modal,

  ModalBody,

  ModalContent,

  ModalFooter,

  ModalHeader,

  useDisclosure,

} from "@heroui/react";

import { useEffect } from "react";



import { useDialog } from "../../contexts/DialogContext";

import { Button } from "../core/Button";



const WELCOME_MODAL_VERSION = "new";



/**

 * Welcome popup

 *

 * TODO: customization post-event (#46)

 *

 * @returns

 */

export const WelcomeModal = () => {

  const { state, dispatch } = useDialog();

  const { isOpen, onClose } = useDisclosure({

    isOpen: "WELCOME" in state.dialogs,

    onClose: () => dispatch({ action: "CLOSE_DIALOG", dialogId: "WELCOME" }),

  });



  useEffect(() => {

    if (localStorage.getItem("hide_welcome") !== WELCOME_MODAL_VERSION) {

      dispatch({ action: "OPEN_DIALOG", dialog: { id: "WELCOME" } });

    }

  }, [dispatch]);



  const handleClose = () => {

    localStorage.setItem("hide_welcome", WELCOME_MODAL_VERSION);

    onClose();

  };



  return (

    <Modal

      isOpen={isOpen}

      onClose={handleClose}

      isDismissable={false}

      placement="center"

    >

      <ModalContent className="canvas-overlay-card">

        {(onClose) => (

          <>

            <ModalHeader>Welcome</ModalHeader>

            <ModalBody>

              <h1 className="text-4xl text-center">Welcome to Canvas!</h1>

              <p>

                Canvas is a collaborative pixel placing event that uses

                Fediverse accounts.

              </p>

              <p>More information can be found in the top left.</p>

            </ModalBody>

            <ModalFooter>

              <Button onPress={onClose}>Close</Button>

            </ModalFooter>

          </>

        )}

      </ModalContent>

    </Modal>

  );

};