From 40d5a9ef8333c4639817ce131871c1e017183df5 Mon Sep 17 00:00:00 2001 From: 0xtekgrinder <0xtekgrinder@protonmail.com> Date: Sun, 27 Oct 2024 11:42:16 +0100 Subject: [PATCH 1/4] chore: add docker-compose with tx-indexer --- .gitmodules | 3 +++ docker-compose.yml | 19 +++++++++++++ frontend/Dockerfile | 66 +++++++++++++++++++++++++++++++++++++++++++++ tx-indexer | 1 + 4 files changed, 89 insertions(+) create mode 100644 .gitmodules create mode 100644 docker-compose.yml create mode 100644 frontend/Dockerfile create mode 160000 tx-indexer diff --git a/.gitmodules b/.gitmodules new file mode 100644 index 0000000..e81fc87 --- /dev/null +++ b/.gitmodules @@ -0,0 +1,3 @@ +[submodule "frontend/tx-indexer"] + path = tx-indexer + url = https://github.com/gnolang/tx-indexer diff --git a/docker-compose.yml b/docker-compose.yml new file mode 100644 index 0000000..c12ba87 --- /dev/null +++ b/docker-compose.yml @@ -0,0 +1,19 @@ +services: + frontend: + build: frontend + restart: always + ports: + - "80:80" + environment: + - REACT_APP_TX_INDEXER_URL=tx-indexer:8546 + tx-indexer: + build: tx-indexer + restart: always + ports: + - "8546:8546" + entrypoint: ["/usr/local/bin/indexer", "start", "--remote", "https://rpc.test4.gno.land", "--db-path", "indexer-db"] + volumes: + - ./indexer-db:/indexer-db + +volumes: + indexer-db: \ No newline at end of file diff --git a/frontend/Dockerfile b/frontend/Dockerfile new file mode 100644 index 0000000..4800dcc --- /dev/null +++ b/frontend/Dockerfile @@ -0,0 +1,66 @@ +FROM node:20-alpine AS base + + + +### Dependencies ### +FROM base AS deps +RUN apk add --no-cache libc6-compat git + + + +# Setup pnpm environment +ENV PNPM_HOME="/pnpm" +ENV PATH="$PNPM_HOME:$PATH" +RUN corepack enable +RUN corepack prepare pnpm@latest --activate + +WORKDIR /app + +COPY package.json pnpm-lock.yaml ./ +RUN pnpm install --frozen-lockfile --prefer-frozen-lockfile + +# Builder +FROM base AS builder + +RUN corepack enable +RUN corepack prepare pnpm@latest --activate + +WORKDIR /app + +COPY --from=deps /app/node_modules ./node_modules +COPY . . +RUN pnpm build + + +### Production image runner ### +FROM base AS runner + +# Set NODE_ENV to production +ENV NODE_ENV production + +# Disable Next.js telemetry +# Learn more here: https://nextjs.org/telemetry +ENV NEXT_TELEMETRY_DISABLED 1 + +# Set correct permissions for nextjs user and don't run as root +RUN addgroup nodejs +RUN adduser -SDH nextjs +RUN mkdir .next +RUN chown nextjs:nodejs .next + +# Automatically leverage output traces to reduce image size +# https://nextjs.org/docs/advanced-features/output-file-tracing +COPY --from=builder --chown=nextjs:nodejs /app/.next/standalone ./ +COPY --from=builder --chown=nextjs:nodejs /app/.next/static ./.next/static +COPY --from=builder --chown=nextjs:nodejs /app/public ./public + +USER nextjs + +# Exposed port (for orchestrators and dynamic reverse proxies) +EXPOSE 3000 +ENV PORT 3000 +ENV HOSTNAME "0.0.0.0" +HEALTHCHECK --interval=30s --timeout=30s --start-period=5s --retries=3 CMD [ "wget", "-q0", "http://localhost:3000/health" ] + +# Run the nextjs app +CMD ["node", "server.js"] \ No newline at end of file diff --git a/tx-indexer b/tx-indexer new file mode 160000 index 0000000..83ec06d --- /dev/null +++ b/tx-indexer @@ -0,0 +1 @@ +Subproject commit 83ec06d12846e088510c9abd2b411b3f27d15d21 From eb34319f547aaa2a7eed0f01ca97bf881a112875 Mon Sep 17 00:00:00 2001 From: 0xtekgrinder <0xtekgrinder@protonmail.com> Date: Sun, 27 Oct 2024 11:44:56 +0100 Subject: [PATCH 2/4] chore: correct frontend ports --- docker-compose.yml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docker-compose.yml b/docker-compose.yml index c12ba87..99c2e7a 100644 --- a/docker-compose.yml +++ b/docker-compose.yml @@ -3,7 +3,7 @@ services: build: frontend restart: always ports: - - "80:80" + - "80:3000" environment: - REACT_APP_TX_INDEXER_URL=tx-indexer:8546 tx-indexer: From 0d5928e0142434fd99e02b5a9889bd80df57ac7c Mon Sep 17 00:00:00 2001 From: 0xtekgrinder <0xtekgrinder@protonmail.com> Date: Sun, 27 Oct 2024 12:03:54 +0100 Subject: [PATCH 3/4] feat: build from docker compose --- .gitignore | 1 + docker-compose.yml | 12 ++++++------ frontend/.dockerignore | 2 ++ frontend/src/components/AdenaWallet.tsx | 6 +++--- frontend/src/components/DepositModal.tsx | 2 +- frontend/src/components/PoolGrid.tsx | 7 +++---- frontend/src/components/WithdrawModal.tsx | 2 +- 7 files changed, 17 insertions(+), 15 deletions(-) create mode 100644 .gitignore create mode 100644 frontend/.dockerignore diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..c71cfd7 --- /dev/null +++ b/.gitignore @@ -0,0 +1 @@ +indexer-db \ No newline at end of file diff --git a/docker-compose.yml b/docker-compose.yml index 99c2e7a..250ca82 100644 --- a/docker-compose.yml +++ b/docker-compose.yml @@ -1,11 +1,11 @@ services: frontend: - build: frontend - restart: always - ports: - - "80:3000" - environment: - - REACT_APP_TX_INDEXER_URL=tx-indexer:8546 + build: frontend + restart: always + ports: + - "80:3000" + environment: + - REACT_APP_TX_INDEXER_URL=tx-indexer:8546 tx-indexer: build: tx-indexer restart: always diff --git a/frontend/.dockerignore b/frontend/.dockerignore new file mode 100644 index 0000000..db5ddae --- /dev/null +++ b/frontend/.dockerignore @@ -0,0 +1,2 @@ +.next +node_modules \ No newline at end of file diff --git a/frontend/src/components/AdenaWallet.tsx b/frontend/src/components/AdenaWallet.tsx index cc4a1f0..c0a8738 100644 --- a/frontend/src/components/AdenaWallet.tsx +++ b/frontend/src/components/AdenaWallet.tsx @@ -11,15 +11,15 @@ const AdenaWallet = () => { const integrateWallet = async () => { // Look for the adena object - if (!window.adena) { + if (!(window as any).adena) { // eslint-disable-line // Open adena.app in a new tab if the adena object is not found window.open("https://adena.app/", "_blank"); } else { // Add connection - const connection = await adena.AddEstablish("GnoALM"); + const connection = await (window as any).adena.AddEstablish("GnoALM"); // eslint-disable-line console.log("connection, ", JSON.stringify(connection)) - const account = await adena.GetAccount() + const account = await (window as any).adena.GetAccount() // eslint-disable-line console.log("account, ", JSON.stringify(account)) setAccount(account.data.address) } diff --git a/frontend/src/components/DepositModal.tsx b/frontend/src/components/DepositModal.tsx index cbb19d2..6afc5f7 100644 --- a/frontend/src/components/DepositModal.tsx +++ b/frontend/src/components/DepositModal.tsx @@ -12,7 +12,7 @@ import { Input, } from '@chakra-ui/react'; -const DepositModal: React.FC<{ isOpen: boolean; onOpen: () => void; onClose: () => void }> = ({ isOpen, onOpen, onClose }) => { +const DepositModal: React.FC<{ isOpen: boolean; onClose: () => void }> = ({ isOpen, onClose }) => { const [mode, setMode] = useState<'single' | 'double'>('single'); const [singleInput, setSingleInput] = useState(''); const [doubleInput1, setDoubleInput1] = useState(''); diff --git a/frontend/src/components/PoolGrid.tsx b/frontend/src/components/PoolGrid.tsx index 75dd68f..03691f4 100644 --- a/frontend/src/components/PoolGrid.tsx +++ b/frontend/src/components/PoolGrid.tsx @@ -4,12 +4,11 @@ import { SimpleGrid, Box, useDisclosure } from '@chakra-ui/react'; import PoolCard from './PoolCard'; import { useState } from 'react'; import { Pool } from '../types/pool'; -import { on } from 'events'; import DepositModal from './DepositModal'; import WithdrawModal from './WithdrawModal'; const PoolGrid: React.FC= () => { - const [pools, setPools] = useState([ + const [pools] = useState([ { token0: 'ETH', token1: 'USDC', @@ -49,8 +48,8 @@ const PoolGrid: React.FC= () => { return ( <> - - + + {pools.map((pool) => ( diff --git a/frontend/src/components/WithdrawModal.tsx b/frontend/src/components/WithdrawModal.tsx index 51edc59..872688a 100644 --- a/frontend/src/components/WithdrawModal.tsx +++ b/frontend/src/components/WithdrawModal.tsx @@ -11,7 +11,7 @@ import { Input, } from '@chakra-ui/react'; -const WithdrawModal: React.FC<{ isOpen: boolean; onOpen: () => void; onClose: () => void }> = ({ isOpen, onOpen, onClose }) => { +const WithdrawModal: React.FC<{ isOpen: boolean; onClose: () => void }> = ({ isOpen, onClose }) => { const [input1, setInput1] = useState(''); const [input2, setInput2] = useState(''); From 1a60f8f7251302fcda6dc362402f748638f64497 Mon Sep 17 00:00:00 2001 From: 0xtekgrinder <0xtekgrinder@protonmail.com> Date: Sun, 27 Oct 2024 12:13:51 +0100 Subject: [PATCH 4/4] feat: get new vaults handled by autoswap --- frontend/package.json | 1 + frontend/pnpm-lock.yaml | 3 +++ frontend/src/config/constants.ts | 1 + frontend/src/types/pool.ts | 1 + frontend/src/utils/pools.ts | 29 +++++++++++++++++++++++++++++ 5 files changed, 35 insertions(+) create mode 100644 frontend/src/config/constants.ts create mode 100644 frontend/src/utils/pools.ts diff --git a/frontend/package.json b/frontend/package.json index 87182e2..773fadb 100644 --- a/frontend/package.json +++ b/frontend/package.json @@ -15,6 +15,7 @@ "@chakra-ui/theme-tools": "^2.2.6", "@emotion/react": "^11.13.3", "@emotion/styled": "^11.13.0", + "axios": "^1.7.7", "framer-motion": "^11.11.8", "next": "14.2.15", "react": "^18", diff --git a/frontend/pnpm-lock.yaml b/frontend/pnpm-lock.yaml index 2c712f8..fd3d8f5 100644 --- a/frontend/pnpm-lock.yaml +++ b/frontend/pnpm-lock.yaml @@ -23,6 +23,9 @@ dependencies: '@emotion/styled': specifier: ^11.13.0 version: 11.13.0(@emotion/react@11.13.3)(@types/react@18.3.11)(react@18.3.1) + axios: + specifier: ^1.7.7 + version: 1.7.7 framer-motion: specifier: ^11.11.8 version: 11.11.8(react-dom@18.3.1)(react@18.3.1) diff --git a/frontend/src/config/constants.ts b/frontend/src/config/constants.ts new file mode 100644 index 0000000..bb2467f --- /dev/null +++ b/frontend/src/config/constants.ts @@ -0,0 +1 @@ +export const txIndexerUrl = process.env.REACT_APP_TX_INDEXER_URL || 'http://localhost:3100'; \ No newline at end of file diff --git a/frontend/src/types/pool.ts b/frontend/src/types/pool.ts index 8b37a7d..eb45207 100644 --- a/frontend/src/types/pool.ts +++ b/frontend/src/types/pool.ts @@ -8,5 +8,6 @@ type Pool = { TVL: number; APY: number; balance: number; + tokenId: string; } export type { Pool }; \ No newline at end of file diff --git a/frontend/src/utils/pools.ts b/frontend/src/utils/pools.ts new file mode 100644 index 0000000..3bc5929 --- /dev/null +++ b/frontend/src/utils/pools.ts @@ -0,0 +1,29 @@ +import { txIndexerUrl } from "@/config/constants"; +import { Pool } from "@/types/pool"; +import axios from "axios"; + +export async function getPools(): Promise { + const data = await axios.post(txIndexerUrl + '/graphql/query', { + data: { + "query": "# Get all the transactions that contain the specified Events on them.\nquery getEvents {\n getTransactions(\n where: {\n \n # Filtering by block height will speed up your queries, because it is the main internal index.\n block_height :{\n gt:100000\n }\n \n # Only show transactions that succeeded.\n success: {eq: true}, \n response: {\n events: {\n \n # This filter is checking that all transactions will contains a GnoEvent that \n # is GNOSWAP type calling SetPoolCreationFee function.\n GnoEvent: {\n type: { eq:\"NewVault\" }\n }\n }\n }\n }\n ) {\n response {\n events {\n ... on GnoEvent {\n type\n func\n attrs {\n key\n value\n }\n }\n }\n }\n }\n}", + "operationName": "getEvents" + } + }) + + const pools = data.data.response.events.map((event: any) => { + const pool: Pool = { + tokenId: event.attrs[0].value, + token0: event.attrs[1].value, + token1: event.attrs[2].value, + fee: parseFloat(event.attrs[3].value), + lowerTick: parseInt(event.attrs[4].value), + upperTick: parseInt(event.attrs[5].value), + currentTick: 0, // TODO get current tick + TVL: 0, // TODO get TVL + APY: 0, // TODO get APY + balance: 0 // TODO get balance + } + return pool; + }); + return pools; +}