@m3000/market 0.0.1 → 0.0.2

package/src/components/blocks/auction/AuctionContext.tsx

@@ -1,401 +0,0 @@
-"use client";
-
-import {
-  createContext,
-  useCallback,
-  useContext,
-  useMemo,
-  useState,
-} from "react";
-import type {
-  AuctionData,
-  AuctionFormatters,
-  AuctionTickConfig,
-  AuctionUserBid,
-  OperationState,
-  RankableBid,
-} from "@/types";
-import { getProjectedRankForPrice, getSuggestedBidPrices } from "@/utils";
-
-export interface AuctionContextValue {
-  auction: AuctionData;
-  isAuctionEnded: boolean;
-
-  bids: RankableBid[];
-  userBids: AuctionUserBid[];
-  maxTotalItems: number;
-
-  bidValue: bigint;
-  setBidValue: (value: bigint | ((prev: bigint) => bigint)) => void;
-
-  minBidValue: bigint;
-  reservePriceValue: bigint;
-  tickReferencePrice: bigint;
-  tickConfig: AuctionTickConfig | undefined;
-  tickSize: bigint;
-
-  placeBidOperation: OperationState;
-  topUpOperation: OperationState;
-
-  lockedBid: { bidId: bigint; priceValue: bigint } | null;
-
-  mergedForRank: RankableBid[];
-  getRankForBid: (bidId: string) => number | null;
-  getProjectedRank: (priceValue: bigint) => {
-    rank: number | null;
-    isWinning: boolean;
-  };
-  getSuggestedBids: () => bigint[];
-
-  showBidPreview: boolean;
-  setShowBidPreview: (show: boolean) => void;
-
-  isBiddingActive: boolean;
-  setIsBiddingActive: (active: boolean) => void;
-  startBidding: () => void;
-  cancelBidding: () => void;
-
-  setLockedBid: (bid: { bidId: bigint; priceValue: bigint } | null) => void;
-  handlePlaceBid: (price: string) => Promise<boolean>;
-  handleTopUp: (newPrice: string) => Promise<boolean>;
-  handleClaimEdition?: (bidId: string) => Promise<boolean>;
-  resetOperations: () => void;
-
-  formatPrice: (priceValue: bigint) => string;
-  formatTime: (date: Date) => string;
-  currencySymbol: string;
-  inputDecimals: number;
-}
-
-export const AuctionContext: React.Context<AuctionContextValue | null> =
-  createContext<AuctionContextValue | null>(null);
-
-export function useAuctionContext(): AuctionContextValue {
-  const ctx = useContext(AuctionContext);
-  if (!ctx) {
-    throw new Error(
-      "useAuctionContext must be used within an Auction provider",
-    );
-  }
-  return ctx;
-}
-
-export interface AuctionProviderProps {
-  auction: AuctionData;
-  bids: RankableBid[];
-  userBids: AuctionUserBid[];
-  onPlaceBid: (price: bigint, quantity: bigint) => Promise<boolean>;
-  onTopUpBid: (
-    bidId: bigint,
-    newPrice: bigint,
-    additionalValue: bigint,
-  ) => Promise<boolean>;
-  onClaimEdition?: (bidId: string) => Promise<boolean>;
-  formatters?: AuctionFormatters;
-  children: React.ReactNode;
-}
-
-export function AuctionProvider({
-  auction,
-  bids,
-  userBids,
-  onPlaceBid,
-  onTopUpBid,
-  onClaimEdition,
-  formatters,
-  children,
-}: AuctionProviderProps): React.ReactElement {
-  const defaultFormatPrice = (priceValue: bigint) => {
-    const val = Number(priceValue) / 1e18;
-    return val.toLocaleString("en-US", {
-      minimumFractionDigits: 3,
-      maximumFractionDigits: 3,
-    });
-  };
-  const defaultFormatTime = (date: Date) => {
-    const now = Date.now();
-    const diff = date.getTime() - now;
-    const isPast = diff < 0;
-    const absMs = Math.abs(diff);
-    const seconds = Math.floor(absMs / 1000);
-    const minutes = Math.floor(seconds / 60);
-    const hours = Math.floor(minutes / 60);
-    const days = Math.floor(hours / 24);
-
-    if (days > 0) return `${days}d ${hours % 24}h ${isPast ? "ago" : ""}`;
-    if (hours > 0) return `${hours}h ${minutes % 60}m ${isPast ? "ago" : ""}`;
-    if (minutes > 0)
-      return `${minutes}m ${seconds % 60}s ${isPast ? "ago" : ""}`;
-    return `${seconds}s ${isPast ? "ago" : ""}`;
-  };
-
-  const formatPrice = formatters?.formatPrice ?? defaultFormatPrice;
-  const formatTime = formatters?.formatTime ?? defaultFormatTime;
-  const currencySymbol = formatters?.currencySymbol ?? "USD";
-  const inputDecimals = formatters?.inputDecimals ?? 18;
-
-  const isAuctionEnded = auction.endsAt
-    ? Date.now() > auction.endsAt.getTime()
-    : false;
-
-  const reservePriceValue = auction.reservePrice;
-  const tickConfig = auction.tickConfig;
-
-  const activeBids = bids.filter((b) => {
-    const bid = userBids.find((ub) => ub.id === b.id);
-    return !bid || bid.status === "active";
-  });
-
-  const totalActiveQty = BigInt(activeBids.length);
-
-  const mergedForRank = useMemo(() => {
-    const cutoffIds = new Set(bids.map((b) => b.id));
-
-    const myActiveBids = userBids.filter(
-      (bid) => bid.status === "active" && !cutoffIds.has(bid.id),
-    );
-
-    const myBidsNotInCutoff: RankableBid[] = myActiveBids.map((bid) => ({
-      id: bid.id,
-      price: bid.price.toString(),
-      created_at: bid.createdAt.toISOString(),
-    }));
-
-    const merged: RankableBid[] = [...bids, ...myBidsNotInCutoff];
-
-    return merged.sort((a, b) => {
-      const pa = BigInt(a.price);
-      const pb = BigInt(b.price);
-      if (pa !== pb) return pb > pa ? 1 : -1;
-      return (
-        new Date(a.created_at).getTime() - new Date(b.created_at).getTime()
-      );
-    });
-  }, [bids, userBids]);
-
-  const minBidValue = useMemo(() => {
-    if (totalActiveQty >= BigInt(auction.maxTotalItems)) {
-      const winningBids = mergedForRank.slice(0, auction.maxTotalItems);
-
-      if (winningBids.length > 0) {
-        const lastWinning = winningBids[winningBids.length - 1];
-        const tickSize = tickConfig
-          ? BigInt(lastWinning.price) > tickConfig.threshold
-            ? tickConfig.largeTickSize
-            : tickConfig.smallTickSize
-          : BigInt(lastWinning.price);
-        return BigInt(lastWinning.price) + tickSize;
-      }
-    }
-    return reservePriceValue;
-  }, [
-    reservePriceValue,
-    totalActiveQty,
-    auction.maxTotalItems,
-    mergedForRank,
-    tickConfig,
-  ]);
-
-  const tickReferencePrice = minBidValue;
-
-  const tickSize = useMemo(() => {
-    if (!tickConfig) return minBidValue;
-    return BigInt(minBidValue) > tickConfig.threshold
-      ? tickConfig.largeTickSize
-      : tickConfig.smallTickSize;
-  }, [tickConfig, minBidValue]);
-
-  const getRankForBid = useCallback(
-    (bidId: string) => {
-      const idx = mergedForRank.findIndex((b) => b.id === bidId);
-      return idx >= 0 ? idx + 1 : null;
-    },
-    [mergedForRank],
-  );
-
-  const getProjectedRank = useCallback(
-    (priceValue: bigint) => {
-      return getProjectedRankForPrice(
-        priceValue,
-        mergedForRank,
-        auction.maxTotalItems,
-      );
-    },
-    [mergedForRank, auction.maxTotalItems],
-  );
-
-  const getSuggestedBids = useCallback(() => {
-    return getSuggestedBidPrices({
-      mergedForRank,
-      maxTotalItems: auction.maxTotalItems,
-      minBidValue,
-      reservePriceValue,
-      tickConfig,
-      tickSize,
-    });
-  }, [
-    mergedForRank,
-    auction.maxTotalItems,
-    minBidValue,
-    reservePriceValue,
-    tickConfig,
-    tickSize,
-  ]);
-
-  const [placeBidOperation, setPlaceBidOperation] = useState<OperationState>({
-    status: "idle",
-  });
-  const [topUpOperation, setTopUpOperation] = useState<OperationState>({
-    status: "idle",
-  });
-
-  const [lockedBid, setLockedBid] = useState<{
-    bidId: bigint;
-    priceValue: bigint;
-  } | null>(null);
-
-  const [showBidPreview, setShowBidPreview] = useState(false);
-
-  const [isBiddingActive, setIsBiddingActive] = useState(false);
-
-  const startBidding = useCallback(() => {
-    setIsBiddingActive(true);
-    setShowBidPreview(true);
-  }, []);
-
-  const cancelBidding = useCallback(() => {
-    setIsBiddingActive(false);
-    setShowBidPreview(false);
-    setLockedBid(null);
-  }, []);
-
-  const setLockedBidAndActivate = useCallback(
-    (bid: { bidId: bigint; priceValue: bigint } | null) => {
-      setLockedBid(bid);
-      if (bid !== null) {
-        setIsBiddingActive(true);
-        setShowBidPreview(true);
-      }
-    },
-    [],
-  );
-
-  const [bidValue, setBidValue] = useState<bigint>(minBidValue);
-
-  const resetOperations = useCallback(() => {
-    setPlaceBidOperation({ status: "idle" });
-    setTopUpOperation({ status: "idle" });
-  }, []);
-
-  const handlePlaceBid = useCallback(
-    async (price: string) => {
-      const priceValue = BigInt(price);
-      setPlaceBidOperation({ status: "pending" });
-
-      try {
-        const success = await onPlaceBid(priceValue, 1n);
-        if (success) {
-          setPlaceBidOperation({ status: "success" });
-          setShowBidPreview(false);
-          return true;
-        } else {
-          setPlaceBidOperation({
-            status: "error",
-            error: "Transaction failed",
-          });
-          return false;
-        }
-      } catch (err) {
-        setPlaceBidOperation({
-          status: "error",
-          error: err instanceof Error ? err.message : "Unknown error",
-        });
-        return false;
-      }
-    },
-    [onPlaceBid],
-  );
-
-  const handleTopUp = useCallback(
-    async (newPrice: string) => {
-      if (!lockedBid) return false;
-
-      const newPriceValue = BigInt(newPrice);
-      const additionalValue = newPriceValue - lockedBid.priceValue;
-
-      setTopUpOperation({ status: "pending" });
-
-      try {
-        const success = await onTopUpBid(
-          lockedBid.bidId,
-          newPriceValue,
-          additionalValue,
-        );
-        if (success) {
-          setTopUpOperation({ status: "success" });
-          setLockedBid(null);
-          return true;
-        } else {
-          setTopUpOperation({ status: "error", error: "Transaction failed" });
-          return false;
-        }
-      } catch (err) {
-        setTopUpOperation({
-          status: "error",
-          error: err instanceof Error ? err.message : "Unknown error",
-        });
-        return false;
-      }
-    },
-    [lockedBid, onTopUpBid],
-  );
-
-  const handleClaimEdition = useCallback(
-    async (bidId: string) => {
-      if (!onClaimEdition) return false;
-      return onClaimEdition(bidId);
-    },
-    [onClaimEdition],
-  );
-
-  const value: AuctionContextValue = {
-    auction,
-    isAuctionEnded,
-    bids,
-    userBids,
-    maxTotalItems: auction.maxTotalItems,
-    bidValue,
-    setBidValue,
-    minBidValue,
-    reservePriceValue,
-    tickReferencePrice,
-    tickConfig,
-    tickSize,
-    placeBidOperation,
-    topUpOperation,
-    lockedBid,
-    mergedForRank,
-    getRankForBid,
-    getProjectedRank,
-    getSuggestedBids,
-    showBidPreview,
-    setShowBidPreview,
-    isBiddingActive,
-    setIsBiddingActive,
-    startBidding,
-    cancelBidding,
-    setLockedBid: setLockedBidAndActivate,
-    handlePlaceBid,
-    handleTopUp,
-    handleClaimEdition,
-    resetOperations,
-    formatPrice,
-    formatTime,
-    currencySymbol,
-    inputDecimals,
-  };
-
-  return (
-    <AuctionContext.Provider value={value}>{children}</AuctionContext.Provider>
-  );
-}

package/src/components/blocks/auction/AuctionInfo.tsx

@@ -1,36 +0,0 @@
-"use client";
-
-import { Text } from "@/components/primitives";
-import { useAuctionContext } from "./AuctionContext";
-import { AuctionStatusTag } from "./AuctionStatusTag";
-
-export interface AuctionInfoProps {
-  className?: string;
-}
-
-export function AuctionInfo({
-  className,
-}: AuctionInfoProps): React.ReactElement {
-  const { auction, isAuctionEnded, maxTotalItems } = useAuctionContext();
-
-  const editionsLabel =
-    maxTotalItems === 1 ? "1 item" : `${maxTotalItems} items`;
-
-  return (
-    <div className={className}>
-      <div className="flex flex-wrap items-center gap-2">
-        <AuctionStatusTag
-          opensAt={auction.opensAt}
-          endsAt={auction.endsAt}
-          background="transparent"
-        />
-      </div>
-      {!isAuctionEnded ? (
-        <Text size="2" color="tertiary" className="mt-2">
-          Bid on one of {editionsLabel}. Top {maxTotalItems} bidders win and pay
-          the lowest winning bid.
-        </Text>
-      ) : null}
-    </div>
-  );
-}

package/src/components/blocks/auction/AuctionLayout.tsx

@@ -1,200 +0,0 @@
-"use client";
-
-import type { ReactNode } from "react";
-import { Button } from "@/components/primitives";
-import { cn } from "@/lib";
-import { useAuctionContext } from "./AuctionContext";
-
-export interface AuctionLayoutProps {
-  children: ReactNode;
-  className?: string;
-  height?: string | number;
-}
-
-export function AuctionLayout({
-  children,
-  className,
-  height = "calc(100vh - 4rem)",
-}: AuctionLayoutProps): React.ReactElement {
-  const heightStyle = typeof height === "number" ? `${height}px` : height;
-  const { isBiddingActive } = useAuctionContext();
-
-  return (
-    <div
-      className={cn(
-        "relative grid overflow-hidden grid-rows-[minmax(0,1fr)_minmax(0,1fr)]",
-        isBiddingActive && "grid-rows-1",
-        "lg:grid-cols-2 lg:grid-rows-1",
-        className,
-      )}
-      style={{ height: heightStyle }}
-    >
-      {children}
-    </div>
-  );
-}
-
-export interface AuctionDetailsProps {
-  children: ReactNode;
-  className?: string;
-}
-
-export function AuctionDetails({
-  children,
-  className,
-}: AuctionDetailsProps): React.ReactElement {
-  const { isBiddingActive } = useAuctionContext();
-
-  return (
-    <div
-      className={cn(
-        "relative flex h-full min-h-0 flex-col overflow-hidden",
-        "border-border",
-        "lg:border-r",
-        isBiddingActive && "overflow-hidden",
-        className,
-      )}
-    >
-      {children}
-    </div>
-  );
-}
-
-export interface AuctionDetailsHeaderProps {
-  children: ReactNode;
-  className?: string;
-}
-
-export function AuctionDetailsHeader({
-  children,
-  className,
-}: AuctionDetailsHeaderProps): React.ReactElement {
-  const { isBiddingActive } = useAuctionContext();
-
-  return (
-    <div
-      className={cn(
-        "flex min-h-0 grow flex-col p-6",
-        isBiddingActive &&
-          [
-            "max-lg:overflow-hidden",
-            "max-lg:[&>*:nth-child(n+3):not(:last-child)]:hidden",
-            "max-lg:[&>*:last-child]:pointer-events-none",
-            "max-lg:[&>*:last-child]:absolute",
-            "max-lg:[&>*:last-child]:inset-x-6",
-            "max-lg:[&>*:last-child]:bottom-6",
-            "max-lg:[&>*:last-child]:top-28",
-            "max-lg:[&>*:last-child]:min-h-0",
-            "max-lg:[&>*:last-child]:overflow-hidden",
-          ].join(" "),
-        className,
-      )}
-    >
-      {children}
-    </div>
-  );
-}
-
-export interface AuctionDetailsBodyProps {
-  children: ReactNode;
-  className?: string;
-}
-
-export function AuctionDetailsBody({
-  children,
-  className,
-}: AuctionDetailsBodyProps): React.ReactElement {
-  return (
-    <div
-      className={cn(
-        "hidden p-6 lg:block lg:min-h-0 lg:flex-1 lg:overflow-y-auto",
-        className,
-      )}
-    >
-      {children}
-    </div>
-  );
-}
-
-export interface AuctionDetailsFooterProps {
-  children: ReactNode;
-  className?: string;
-}
-
-export function AuctionDetailsFooter({
-  children,
-  className,
-}: AuctionDetailsFooterProps): React.ReactElement {
-  return (
-    <div
-      className={cn("mt-auto shrink-0 border-t border-border p-6", className)}
-    >
-      {children}
-    </div>
-  );
-}
-
-export interface AuctionRankingsContainerProps {
-  children: ReactNode;
-  className?: string;
-}
-
-export function AuctionRankingsContainer({
-  children,
-  className,
-}: AuctionRankingsContainerProps): React.ReactElement {
-  const { isBiddingActive } = useAuctionContext();
-
-  return (
-    <div
-      className={cn(
-        "grid h-full min-h-0 grid-rows-[minmax(0,1fr)_auto]",
-        isBiddingActive &&
-          "max-lg:absolute max-lg:inset-x-0 max-lg:bottom-0 max-lg:top-0 max-lg:z-20 max-lg:overflow-hidden max-lg:rounded-t-[1.75rem] max-lg:border-t max-lg:border-border max-lg:bg-background/95 max-lg:shadow-2xl max-lg:backdrop-blur-sm",
-        className,
-      )}
-    >
-      {children}
-    </div>
-  );
-}
-
-export interface AuctionBiddingPanelProps {
-  children: ReactNode;
-  className?: string;
-}
-
-export function AuctionBiddingPanel({
-  children,
-  className,
-}: AuctionBiddingPanelProps): React.ReactElement {
-  const { isBiddingActive, startBidding, isAuctionEnded, setShowBidPreview } =
-    useAuctionContext();
-
-  const handleStartBidding = () => {
-    startBidding();
-    setShowBidPreview(true);
-  };
-
-  return (
-    <div
-      className={cn(
-        "row-start-2 rounded-t-[1.75rem] border-t border-border bg-background p-6 lg:rounded-xl",
-        className,
-      )}
-    >
-      {!isBiddingActive ? (
-        <Button
-          className="w-full"
-          size="lg"
-          disabled={isAuctionEnded}
-          onClick={handleStartBidding}
-        >
-          {isAuctionEnded ? "Auction Ended" : "Start Bidding"}
-        </Button>
-      ) : (
-        children
-      )}
-    </div>
-  );
-}