Merge branch 'main' into ECO-2243

cfg/cspell-config.json

@@ -18,7 +18,9 @@
     "/project-words.txt",
     "**/package.json",
     "**/pnpm-lock.yaml",
-    "../src/typescript/sdk/src/emoji_data/symbol-emojis.json"
+    "../src/typescript/sdk/src/emoji_data/symbol-emojis.json",
+    "../src/typescript/sdk/tests/unit/event-parser/json/bonding-curve-states.json",
+    "../src/typescript/sdk/tests/unit/event-parser/event-models.test.ts"
   ],
   "overrides": [
     {

cfg/pre-commit-config.yaml

@@ -126,8 +126,10 @@ repos:
     args:
     - '--autofix'
     exclude: |
-      (?x)
-      ^src/typescript/frontend/public/locales/.*\.json$
+      (?x)^(
+      src/typescript/frontend/public/locales/.*\.json|
+      src/typescript/sdk/tests/unit/event-parser/json/.*\.json
+      )$
     id: 'pretty-format-json'
   - id: 'trailing-whitespace'
   repo: 'https://github.com/pre-commit/pre-commit-hooks'

package.json

@@ -3,6 +3,7 @@
   "scripts": {
     "dev": "pnpm --prefix src/typescript run dev",
     "down": "pnpm --prefix src/typescript run down",
+    "e2e:testnet": "pnpm --prefix src/typescript run e2e:testnet",
     "format": "pnpm --prefix src/typescript run format",
     "lint": "pnpm --prefix src/typescript run lint",
     "lint:fix": "pnpm --prefix src/typescript run lint:fix",
@@ -12,6 +13,7 @@
     "test": "pnpm --prefix src/typescript run test",
     "test:debug": "pnpm --prefix src/typescript run test:debug",
     "test:verbose": "pnpm --prefix src/typescript run test:verbose",
+    "unit-test": "pnpm --prefix src/typescript run unit-test",
     "up": "pnpm --prefix src/typescript run up"
   }
 }

src/cloud-formation/deploy-main.yaml

@@ -1,6 +1,6 @@
 ---
 parameters:
-  BrokerImageVersion: '0.8.0'
+  BrokerImageVersion: '0.9.0'
   DeployAlb: 'true'
   DeployAlbDnsRecord: 'true'
   DeployBastionHost: 'true'
@@ -22,7 +22,7 @@ parameters:
   EnableWafRulesWebSocket: 'false'
   Environment: 'main'
   Network: 'testnet'
-  ProcessorImageVersion: '0.7.0'
+  ProcessorImageVersion: '0.8.0'
 tags: null
 template-file-path: 'src/cloud-formation/indexer.cfn.yaml'
 ...

src/docker/compose.yaml

@@ -81,11 +81,11 @@ services:
     image: 'econialabs/emojicoin-dot-fun-indexer-processor'
     container_name: 'processor'
     healthcheck:
-      test: 'curl -f http://localhost:${PROCESSOR_WS_PORT}/ || exit 1'
-      interval: '2m'
+      test: 'curl -sf http://localhost:${PROCESSOR_WS_PORT} || exit 1'
+      interval: '60s'
       timeout: '5s'
-      retries: '1'
-      start_period: '15s'
+      retries: '2'
+      start_period: '60s'
       start_interval: '2s'
     restart: 'unless-stopped'
     stop_signal: 'SIGKILL'

src/typescript/ci.env

@@ -1,4 +1,5 @@
 NEXT_PUBLIC_APTOS_NETWORK="local"
+NEXT_PUBLIC_BROKER_URL="ws://localhost:3009"
 NEXT_PUBLIC_MODULE_ADDRESS="0xf000d910b99722d201c6cf88eb7d1112b43475b9765b118f289b5d65d919000d"
 NEXT_PUBLIC_REWARDS_MODULE_ADDRESS="0xf000d910b99722d201c6cf88eb7d1112b43475b9765b118f289b5d65d919000d"
 NEXT_PUBLIC_INTEGRATOR_ADDRESS="0xf000d910b99722d201c6cf88eb7d1112b43475b9765b118f289b5d65d919000d"

src/typescript/frontend/.eslintrc.js

@@ -1,7 +1,7 @@
 module.exports = {
   env: {
     browser: true,
-    es2021: true,
+    es2024: true,
     jest: true,
     node: true,
   },
@@ -17,22 +17,42 @@ module.exports = {
     JSX: true,
     React: true,
   },
+  ignorePatterns: [
+    "dist/**",
+    "node_modules/**",
+    ".eslintrc.js",
+    "config-overrides.js",
+    "playwright.config.ts",
+    "postcss.config.js",
+    "tailwind.config.js",
+    "example.spec.ts",
+  ],
   parser: "@typescript-eslint/parser",
   parserOptions: {
+    tsconfigRootDir: __dirname,
     ecmaFeatures: {
       jsx: true,
     },
-    ecmaVersion: 13,
+    ecmaVersion: "latest",
     sourceType: "module",
+    project: ["tsconfig.json"],
+    warnOnUnsupportedTypeScriptVersion: false,
   },
-  plugins: ["@typescript-eslint", "import"],
+  plugins: ["@typescript-eslint", "import", "prettier"],
   rules: {
+    "prettier/prettier": ["error"],
     "import/no-cycle": [
       "error",
       {
         ignoreExternal: true,
       },
     ],
+    "@typescript-eslint/lines-between-class-members": [
+      "error",
+      "always",
+      { exceptAfterSingleLine: true },
+    ],
+    "@typescript-eslint/no-throw-literal": "error",
     "@typescript-eslint/no-explicit-any": "warn",
     "@typescript-eslint/ban-types": [
       "error",

src/typescript/frontend/package.json

@@ -51,13 +51,11 @@
     "semver": "^7.6.2",
     "server-only": "^0.0.1",
     "sharp": "^0.33.4",
-    "socket.io-client": "^4.7.5",
     "styled-components": "^6.1.11",
     "styled-system": "^5.1.5",
     "stylis": "^4.3.2",
     "tailwind-merge": "^2.4.0",
     "use-scramble": "^2.2.15",
-    "yup": "^1.4.0",
     "zustand": "^4.5.4"
   },
   "devDependencies": {
@@ -73,6 +71,8 @@
     "autoprefixer": "^10.4.19",
     "eslint": "^8.57.0",
     "eslint-config-next": "^14.2.4",
+    "eslint-config-prettier": "^9.1.0",
+    "eslint-plugin-prettier": "^5.2.1",
     "postcss": "^8.4.39",
     "prettier": "^3.3.2",
     "tailwindcss": "^3.4.4",

src/typescript/frontend/src/app/home/page.tsx

@@ -22,7 +22,6 @@ export default async function Home({ searchParams }: HomePageParams) {
   });
 
   const geoblocked = await isUserGeoblocked(headers().get("x-real-ip"));
-
   return (
     <HomePageComponent
       featured={featured}

src/typescript/frontend/src/app/pools/api/route.ts

@@ -6,7 +6,9 @@ import { handleEmptySearchBytes, safeParsePageWithDefault } from "lib/routes/hom
 import { stringifyJSON } from "utils";
 import { fetchUserLiquidityPools } from "@sdk/indexer-v2/queries/app/pools";
 import { MARKETS_PER_PAGE } from "lib/queries/sorting/const";
+import { REVALIDATION_TIME } from "lib/server-env";
 
+export const revalidate = REVALIDATION_TIME;
 export const dynamic = "force-dynamic";
 
 export async function GET(request: Request) {
@@ -18,7 +20,7 @@ export async function GET(request: Request) {
   const searchEmojis = q ? symbolBytesToEmojis(q).emojis.map((e) => e.emoji) : undefined;
 
   if (orderBy !== "asc" && orderBy !== "desc") {
-    throw "Invalid params";
+    throw new Error("Invalid params");
   }
 
   // The liquidity `provider`, aka the account to search for in the user liquidity pools.

src/typescript/frontend/src/components/emoji-picker/EmojiPickerWithInput.tsx

@@ -85,6 +85,7 @@ export const EmojiPickerWithInput = ({
   const setPickerInvisible = useEmojiPicker((s) => s.setPickerInvisible);
   const nativePicker = useEmojiPicker((s) => s.nativePicker);
   const insertEmojiTextInput = useEmojiPicker((s) => s.insertEmojiTextInput);
+  const setEmojis = useEmojiPicker((s) => s.setEmojis);
   const removeEmojiTextInput = useEmojiPicker((s) => s.removeEmojiTextInput);
   const textAreaRef = useEmojiPicker((s) => s.textAreaRef);
 
@@ -143,7 +144,7 @@ export const EmojiPickerWithInput = ({
     [removeEmojiTextInput, textAreaRef]
   );
 
-  const onKeyDownHandler = async (e: React.KeyboardEvent<HTMLTextAreaElement>) => {
+  const onKeyUpHandler = async (e: React.KeyboardEvent<HTMLTextAreaElement>) => {
     const target = e.target as HTMLTextAreaElement;
     if (!target) return;
     // I use this so much while developing that I need to account for it.
@@ -153,10 +154,10 @@ export const EmojiPickerWithInput = ({
       e.stopPropagation();
       window.location.reload();
     }
-    if (getEmojisInString(e.key).length) {
+    if (getEmojisInString(e.currentTarget.value).length) {
       e.preventDefault();
       e.stopPropagation();
-      insertEmojiTextInput(e.key);
+      setEmojis(getEmojisInString(e.currentTarget.value));
     } else if (e.key === "Enter") {
       e.preventDefault();
       await handleSubmission(emojis.join(""));
@@ -217,7 +218,7 @@ export const EmojiPickerWithInput = ({
                   onPaste={handlePaste}
                   onCut={handleCut}
                   inputMode={nativePicker ? "text" : "none"}
-                  onKeyDown={onKeyDownHandler}
+                  onKeyUp={onKeyUpHandler}
                   onFocus={(e) => {
                     // Stop the focus from bubbling up to the `Flex` component above. We only want to focus
                     // this specific text area without triggering a focus on the `Flex` component.

src/typescript/frontend/src/components/pages/emojicoin/ClientEmojicoinPage.tsx

@@ -13,7 +13,7 @@ import { useReliableSubscribe } from "@hooks/use-reliable-subscribe";
 import { type BrokerEvent } from "@/broker/types";
 import { marketToLatestBars } from "@/store/event/candlestick-bars";
 
-const EVENT_TYPES: Array<BrokerEvent> = ["Chat", "PeriodicState", "Swap"];
+const EVENT_TYPES: BrokerEvent[] = ["Chat", "PeriodicState", "Swap"];
 
 const ClientEmojicoinPage = (props: EmojicoinProps) => {
   const { isTablet, isMobile } = useMatchBreakpoints();

src/typescript/frontend/src/components/pages/emojicoin/components/trade-emojicoin/LiquidityButton.tsx

@@ -7,9 +7,14 @@ import { isInBondingCurve } from "utils/bonding-curve";
 import { AnimatedProgressBar } from "./AnimatedProgressBar";
 import Link from "next/link";
 import { ROUTES } from "router/routes";
+import { useCanTradeMarket } from "lib/hooks/queries/use-grace-period";
+import { Text } from "components/text";
+import { useMatchBreakpoints } from "@hooks/index";
 
 export const LiquidityButton = (props: GridProps) => {
+  const { isDesktop } = useMatchBreakpoints();
   const { t } = translationFunction();
+  const { canTrade, displayTimeLeft } = useCanTradeMarket(props.data.symbol);
 
   return (
     <>
@@ -26,10 +31,22 @@ export const LiquidityButton = (props: GridProps) => {
             </Link>
           </Flex>
         </StyledContentHeader>
-      ) : (
+      ) : canTrade ? (
         <StyledContentHeader className="!p-0">
           <AnimatedProgressBar geoblocked={props.geoblocked} data={props.data} />
         </StyledContentHeader>
+      ) : (
+        <StyledContentHeader>
+          <Flex width="100%" justifyContent="left">
+            <Text
+              textScale={isDesktop ? "pixelHeading3" : "pixelHeading4"}
+              color="lightGray"
+              textTransform="uppercase"
+            >
+              Grace period ends in {displayTimeLeft}
+            </Text>
+          </Flex>
+        </StyledContentHeader>
       )}
     </>
   );

src/typescript/frontend/src/components/pages/emojicoin/components/trade-emojicoin/SwapButton.tsx

@@ -12,6 +12,13 @@ import { useAnimationControls } from "framer-motion";
 import { RewardsAnimation } from "./RewardsAnimation";
 import { toast } from "react-toastify";
 import { CongratulationsToast } from "./CongratulationsToast";
+import { useCanTradeMarket } from "lib/hooks/queries/use-grace-period";
+import Popup from "components/popup";
+
+const GRACE_PERIOD_MESSAGE =
+  "This market is in its grace period. During the grace period of a market, only the market " +
+  "creator can trade. The grace period ends 5 minutes after the market registration or after the first " +
+  "trade, whichever comes first.";
 
 export const SwapButton = ({
   inputAmount,
@@ -20,17 +27,20 @@ export const SwapButton = ({
   setSubmit,
   disabled,
   geoblocked,
+  symbol,
 }: {
   inputAmount: bigint | number | string;
   isSell: boolean;
   marketAddress: AccountAddressString;
   setSubmit: Dispatch<SetStateAction<(() => Promise<void>) | null>>;
   disabled?: boolean;
   geoblocked: boolean;
+  symbol: string;
 }) => {
   const { t } = translationFunction();
   const { aptos, account, submit } = useAptos();
   const controls = useAnimationControls();
+  const { canTrade } = useCanTradeMarket(symbol);
 
   const handleClick = useCallback(async () => {
     if (!account) {
@@ -50,7 +60,7 @@ export const SwapButton = ({
     const res = await submit(builderLambda);
     if (res && res.response && isUserTransactionResponse(res.response)) {
       const rewardsEvent = res.response.events.find(
-        (e) => e.type === STRUCT_STRINGS.LotteryWinnerEvent
+        (e) => e.type === STRUCT_STRINGS.EmojicoinDotFunRewards
       );
       if (rewardsEvent) {
         controls.start("celebration");
@@ -80,10 +90,22 @@ export const SwapButton = ({
   return (
     <>
       <ButtonWithConnectWalletFallback geoblocked={geoblocked}>
-        <Button disabled={disabled} onClick={handleClick} scale="lg">
-          {t("Swap")}
-        </Button>
-        <RewardsAnimation controls={controls} />
+        {canTrade ? (
+          <>
+            <Button disabled={disabled} onClick={handleClick} scale="lg">
+              {t("Swap")}
+            </Button>
+            <RewardsAnimation controls={controls} />
+          </>
+        ) : (
+          <Popup className="max-w-[300px]" content={t(GRACE_PERIOD_MESSAGE)}>
+            <div>
+              <Button disabled={true} onClick={handleClick} scale="lg">
+                {t("Swap")}
+              </Button>
+            </div>
+          </Popup>
+        )}
       </ButtonWithConnectWalletFallback>
     </>
   );

src/typescript/frontend/src/components/pages/emojicoin/components/trade-emojicoin/SwapComponent.tsx

@@ -323,6 +323,7 @@ export default function SwapComponent({
             // the user is connected.
             disabled={!sufficientBalance && !isLoading && !!account}
             geoblocked={geoblocked}
+            symbol={emojicoin}
           />
         </Row>
       </Column>

src/typescript/frontend/src/components/pages/emojicoin/types.ts

@@ -12,7 +12,7 @@ type DataProps = MarketMetadataModel & {
   swaps: Array<DatabaseModels["swap_events"]>;
   chats: Array<DatabaseModels["chat_events"]>;
   state: DatabaseModels["market_state"];
-  marketView: Types.MarketView;
+  marketView: Types["MarketView"];
 };
 
 export interface EmojicoinProps {