Compare commits
1 Commits
main
...
dynamic-ro
| Author | SHA1 | Date | |
|---|---|---|---|
|
8e2e16e286 |
@ -1,4 +0,0 @@
|
||||
node_modules
|
||||
.next
|
||||
.git
|
||||
.github
|
||||
22
.env.example
22
.env.example
@ -1,16 +1,16 @@
|
||||
## Mandatory Environment Variables
|
||||
NEXT_PUBLIC_NETWORK=mainnet
|
||||
NEXT_PUBLIC_WALLET_CONNECT_ID=0x0x0x0x0x0x0x0x0x0x0x0x0x0x0x0x0x0x0x0x
|
||||
|
||||
### Optional Environment Variables
|
||||
NEXT_PUBLIC_OSMOSIS_RPC=https://rpc-osmosis.blockapsis.com
|
||||
NEXT_PUBLIC_OSMOSIS_REST=https://lcd-osmosis.blockapsis.com
|
||||
NEXT_PUBLIC_OSMOSIS_TEST_RPC=https://rpc.devnet.osmosis.zone
|
||||
NEXT_PUBLIC_OSMOSIS_TEST_REST=https://lcd.devnet.osmosis.zone
|
||||
NEXT_PUBLIC_NEUTRON_TEST_RPC=https://rpc-palvus.pion-1.ntrn.tech
|
||||
NEXT_PUBLIC_NEUTRON_TEST_REST=https://rest-palvus.pion-1.ntrn.tech
|
||||
NEXT_PUBLIC_OSMOSIS_RPC=https://osmosis-node.marsprotocol.io/GGSFGSFGFG34/osmosis-rpc-front/
|
||||
NEXT_PUBLIC_OSMOSIS_REST=https://osmosis-node.marsprotocol.io/GGSFGSFGFG34/osmosis-lcd-front/
|
||||
NEXT_PUBLIC_OSMOSIS_TEST_RPC=https://rpc.devnet.osmosis.zone/
|
||||
NEXT_PUBLIC_OSMOSIS_TEST_REST=https://lcd.devnet.osmosis.zone/
|
||||
NEXT_PUBLIC_NEUTRON_TEST_RPC=https://rpc-palvus.pion-1.ntrn.tech/
|
||||
NEXT_PUBLIC_NEUTRON_TEST_REST=https://rest-palvus.pion-1.ntrn.tech/
|
||||
|
||||
### Enable the following environment variables if you have access to the charting library
|
||||
NEXT_PUBLIC_WALLET_CONNECT_ID=d93fdffb159bae5ec87d8fee4cdbb045
|
||||
CHARTING_LIBRARY_USERNAME=git_username
|
||||
CHARTING_LIBRARY_ACCESS_TOKEN=access_token
|
||||
CHARTING_LIBRARY_REPOSITORY=github.com/tradingview/charting_library/
|
||||
CHARTING_LIBRARY_REPOSITORY=github.com/tradingview/charting_library/
|
||||
|
||||
NEXT_PUBLIC_PYTH_API=https://mars.rpc.p2p.world/api
|
||||
|
||||
|
||||
26
.github/workflows/code-coverage.yaml
vendored
Normal file
26
.github/workflows/code-coverage.yaml
vendored
Normal file
@ -0,0 +1,26 @@
|
||||
name: Jest Coverage Diff
|
||||
|
||||
on: pull_request
|
||||
|
||||
jobs:
|
||||
coverage-check:
|
||||
if: github.actor != 'dependabot[bot]'
|
||||
name: Code Coverage Diff Check
|
||||
runs-on: ubuntu-latest
|
||||
|
||||
steps:
|
||||
- uses: actions/checkout@v3
|
||||
- name: Use Node.js
|
||||
uses: actions/setup-node@v3
|
||||
with:
|
||||
node-version: '20.x'
|
||||
cache: yarn
|
||||
- name: Install dependencies
|
||||
run: yarn
|
||||
- name: Test Coverage
|
||||
id: testCoverage
|
||||
uses: anuraag016/Jest-Coverage-Diff@V1.4
|
||||
with:
|
||||
fullCoverageDiff: false
|
||||
runCommand: "yarn jest --coverage --collectCoverage=true --coverageDirectory='./' --coverageReporters='json-summary' --forceExit --detectOpenHandles"
|
||||
delta: 0.1
|
||||
25
.github/workflows/docker-image.yml
vendored
25
.github/workflows/docker-image.yml
vendored
@ -1,25 +0,0 @@
|
||||
name: Docker Image CI
|
||||
|
||||
on:
|
||||
push:
|
||||
branches:
|
||||
- 'main'
|
||||
|
||||
jobs:
|
||||
docker:
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
- name: Set up QEMU
|
||||
uses: docker/setup-qemu-action@v3
|
||||
- name: Set up Docker Buildx
|
||||
uses: docker/setup-buildx-action@v3
|
||||
- name: Login to Docker Hub
|
||||
uses: docker/login-action@v3
|
||||
with:
|
||||
username: ${{ secrets.DOCKERHUB_USERNAME }}
|
||||
password: ${{ secrets.DOCKERHUB_TOKEN }}
|
||||
- name: Build and push
|
||||
uses: docker/build-push-action@v5
|
||||
with:
|
||||
push: true
|
||||
tags: marsprotocol/interface:latest, marsprotocol/interface:v2-${{ github.run_number }}
|
||||
19
.github/workflows/test.yaml
vendored
Normal file
19
.github/workflows/test.yaml
vendored
Normal file
@ -0,0 +1,19 @@
|
||||
name: Unit Tests
|
||||
|
||||
on: pull_request
|
||||
|
||||
jobs:
|
||||
test:
|
||||
runs-on: ubuntu-latest
|
||||
|
||||
steps:
|
||||
- uses: actions/checkout@v3
|
||||
- name: Use Node.js
|
||||
uses: actions/setup-node@v3
|
||||
with:
|
||||
node-version: '20.x'
|
||||
cache: yarn
|
||||
- name: Install dependencies
|
||||
run: yarn
|
||||
- name: Run tests
|
||||
run: yarn test --coverage false
|
||||
8
.gitignore
vendored
8
.gitignore
vendored
@ -19,10 +19,8 @@ coverage-summary.json
|
||||
# misc
|
||||
.DS_Store
|
||||
*.pem
|
||||
src/utils/charting_library/
|
||||
src/utils/datafeeds/
|
||||
/public/charting_library/
|
||||
/public/datafeeds/
|
||||
charting_library/
|
||||
datafeeds/
|
||||
|
||||
# debug
|
||||
npm-debug.log*
|
||||
@ -44,6 +42,8 @@ next-env.d.ts
|
||||
.env.local
|
||||
.env.local.testnet
|
||||
.env.local.mainnet
|
||||
.env.production
|
||||
.env
|
||||
|
||||
# IDE
|
||||
.idea
|
||||
4
.husky/pre-commit
Executable file
4
.husky/pre-commit
Executable file
@ -0,0 +1,4 @@
|
||||
#!/usr/bin/env sh
|
||||
. "$(dirname "$0")/_/husky.sh"
|
||||
|
||||
npx lint-staged
|
||||
76
Dockerfile
76
Dockerfile
@ -1,41 +1,59 @@
|
||||
FROM node:20-alpine as builder
|
||||
FROM node:18-alpine AS base
|
||||
|
||||
# Install dependencies only when needed
|
||||
FROM base AS deps
|
||||
# Check https://github.com/nodejs/docker-node/tree/b4117f9333da4138b03a546ec926ef50a31506c3#nodealpine to understand why libc6-compat might be needed.
|
||||
RUN apk add --no-cache libc6-compat
|
||||
WORKDIR /app
|
||||
|
||||
COPY package.json yarn.lock ./
|
||||
RUN yarn install
|
||||
COPY . .
|
||||
RUN apk --update add patch
|
||||
RUN patch next.config.js next-config.patch
|
||||
# Install dependencies based on the preferred package manager
|
||||
COPY package.json yarn.lock* package-lock.json* pnpm-lock.yaml* ./
|
||||
RUN \
|
||||
if [ -f yarn.lock ]; then yarn --frozen-lockfile; \
|
||||
elif [ -f package-lock.json ]; then npm ci; \
|
||||
elif [ -f pnpm-lock.yaml ]; then yarn global add pnpm && pnpm i --frozen-lockfile; \
|
||||
else echo "Lockfile not found." && exit 1; \
|
||||
fi
|
||||
|
||||
ENV NEXT_PUBLIC_NETWORK=mainnet
|
||||
ENV NEXT_PUBLIC_OSMOSIS_RPC=APP_NEXT_OSMOSIS_RPC
|
||||
ENV NEXT_PUBLIC_OSMOSIS_REST=APP_NEXT_OSMOSIS_REST
|
||||
ENV NEXT_PUBLIC_WALLET_CONNECT_ID=APP_NEXT_WALLET_CONNECT_ID
|
||||
ENV NODE_ENV=production
|
||||
|
||||
# Rebuild the source code only when needed
|
||||
FROM base AS builder
|
||||
WORKDIR /app
|
||||
COPY --from=deps /app/node_modules ./node_modules
|
||||
COPY . .
|
||||
|
||||
# Next.js collects completely anonymous telemetry data about general usage.
|
||||
# Learn more here: https://nextjs.org/telemetry
|
||||
# Uncomment the following line in case you want to disable telemetry during the build.
|
||||
# ENV NEXT_TELEMETRY_DISABLED 1
|
||||
|
||||
RUN yarn build
|
||||
|
||||
FROM node:20-alpine as runner
|
||||
# If using npm comment out above and use below instead
|
||||
# RUN npm run build
|
||||
|
||||
# Production image, copy all the files and run next
|
||||
FROM base AS runner
|
||||
WORKDIR /app
|
||||
|
||||
COPY --from=builder /app/package.json .
|
||||
COPY --from=builder /app/yarn.lock .
|
||||
COPY --from=builder /app/next.config.js .
|
||||
COPY --from=builder /app/public ./public
|
||||
COPY --from=builder /app/.next/standalone ./
|
||||
COPY --from=builder /app/.next/static ./.next/static
|
||||
COPY entrypoint.sh .
|
||||
ENV NODE_ENV production
|
||||
# Uncomment the following line in case you want to disable telemetry during runtime.
|
||||
# ENV NEXT_TELEMETRY_DISABLED 1
|
||||
|
||||
RUN apk add --no-cache --upgrade bash
|
||||
RUN ["chmod", "+x", "./entrypoint.sh"]
|
||||
ENTRYPOINT ["./entrypoint.sh"]
|
||||
RUN addgroup --system --gid 1001 nodejs
|
||||
RUN adduser --system --uid 1001 nextjs
|
||||
|
||||
COPY --from=builder /app/public ./public
|
||||
|
||||
# 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
|
||||
|
||||
USER nextjs
|
||||
|
||||
EXPOSE 3000
|
||||
CMD ["node", "server.js"]
|
||||
|
||||
# Labels
|
||||
# https://github.com/opencontainers/image-spec/blob/main/annotations.md
|
||||
LABEL org.opencontainers.image.title="mars-fe"
|
||||
LABEL org.opencontainers.image.description="Mars Protocol Outpost Frontend"
|
||||
LABEL org.opencontainers.image.authors="info@mars.foundation"
|
||||
LABEL org.opencontainers.image.source=https://github.com/mars-protocol/mars-v2-frontend
|
||||
ENV PORT 3000
|
||||
|
||||
CMD ["node", "server.js"]
|
||||
461
LICENSE
461
LICENSE
@ -1,461 +0,0 @@
|
||||
MARS PROTOCOL WEB APPLICATION LICENSE AGREEMENT
|
||||
Version 1, 24 January 2023
|
||||
|
||||
This Mars Protocol Web Application License Agreement (this “Agreement”)is
|
||||
a legally binding agreement with Delphi Labs Ltd., a British Virgin Islands
|
||||
company limited by shares (“Licensor”) pertaining to all software and
|
||||
technologies contained in this repository (whether in source code,
|
||||
object code or other form).
|
||||
|
||||
YOU ARE NOT PERMITTED TO USE THIS SOFTWARE EXCEPT FOR PURPOSES OF FACILITATING
|
||||
USE OF DEPLOYED INSTANCES OF THE PROTOCOL THAT ARE ENDORSED BY THE MARTIAN
|
||||
COUNCIL, UPON THE TERMS AND CONDITIONS SET FORTH BELOW.
|
||||
|
||||
YOU ARE NOT PERMITTED TO USE THIS SOFTWARE IN CONNECTION WITH FORKS OF
|
||||
THE PROTOCOL NOT ENDORSED BY THE MARTIAN COUNCIL, OR IN CONNECTION WITH
|
||||
OTHER PROTOCOLS.
|
||||
|
||||
1. RESERVATION OF PROPRIETARY RIGHTS.
|
||||
Except to the extent provided in Section 2:
|
||||
|
||||
a. all intellectual property (including all trade secrets, source
|
||||
code, designs and protocols) relating to the Web Application has
|
||||
been published or made available for informational purposes only
|
||||
(e.g., to enable users of the Web Application to conduct their
|
||||
own due diligence into the security and other risks thereof);
|
||||
|
||||
b. no license, right of reproduction or distribution or other right
|
||||
with respect to the Web Application or any other intellectual
|
||||
property is granted or implied; andc.all moral, intellectual
|
||||
property and other rights relating to the Web Application and
|
||||
other intellectual property are hereby reserved by Licensor
|
||||
(and the other contributors to such intellectual property or
|
||||
holders of such rights, as applicable).
|
||||
|
||||
2. LIMITED LICENSE.
|
||||
Upon the terms and subject to the conditions set forth in this Agreement
|
||||
(including the conditions set forth in Section 3), Licensor hereby grants
|
||||
a non-transferable, personal, non-sub-licensable, global, royalty-free,
|
||||
revocable license in Licensor’s intellectual property rights relating to
|
||||
the Web Application:
|
||||
|
||||
a. to each Authorized Site Operator, to run the Web Application for
|
||||
use by each Authorized User solely in connection with the Endorsed
|
||||
Smart Contracts (and not for any of the purposes described in
|
||||
ection 3);
|
||||
|
||||
b. to each Authorized User, to use the Web Application run by an
|
||||
Authorized Site Operatorsolely in connection with the Endorsed
|
||||
Smart Contracts (and not for any of the purposes described in
|
||||
Section 3); and
|
||||
|
||||
The following capitalized terms have the definitions that are ascribed
|
||||
to them below:
|
||||
|
||||
Defined Terms Relating to Relevant Persons
|
||||
|
||||
“Authorized Site Operator” means a person who makes the un-modified
|
||||
Web Application available to persons in good faith on commercially
|
||||
reasonable terms for purposes of facilitating their use of the
|
||||
Endorsed Smart Contracts for their intended purposes and complies
|
||||
with the conditions set forth in Section 3.
|
||||
|
||||
“Authorized User” means a person who uses the un-modified Web
|
||||
Application in good faith for purposes of using the Endorsed Smart
|
||||
Contracts for their intended purposes and complies with the conditions
|
||||
set forth in Section 3.
|
||||
|
||||
“Web Application” means the software at
|
||||
<https://github.com/mars-protocol/webapp>, as it may be updated from
|
||||
time to time by Licensor.
|
||||
|
||||
Defined Terms Relating to Mars Hub & Martian Council
|
||||
|
||||
“$MARS” means the native token unit of Mars Hub the bonding, staking
|
||||
or delegation of which determines which Mars Hub Core Nodes have the
|
||||
ability to propose and validate new blocks on the Mars Hub blockchain.
|
||||
|
||||
“Mars Hub” means, at each time, the canonical blockchain and virtual
|
||||
machine environment of the Mars Hub ‘mainnet’, as recognized by at
|
||||
least a majority of the Mars Core Nodes then being operated in good
|
||||
faith in the ordinary course of the network.
|
||||
|
||||
“Mars Hub Core” means the reference implementation of the Mars
|
||||
blockchain hub protocol currently stored at
|
||||
<https://github.com/mars-protocol/hub> or any successor thereto
|
||||
expressly determined by the Martian Council to constitute the
|
||||
reference implementation for Mars blockchain hub protocol.
|
||||
|
||||
“Mars Hub Core Nodes” means, at each time, the internet-connected
|
||||
computers then running unaltered and correctly configured instances
|
||||
of the most up-to-date production release of Mars Hub Core.
|
||||
|
||||
“Martian Council” means at each time, all persons holding $MARS that
|
||||
is staked with or delegated or bonded to Mars Hub Core Nodes in the
|
||||
active validator set for Mars Hub at such time and has the power to
|
||||
vote such $MARS tokens on governance proposals in accordance with
|
||||
the Mars Protocol.
|
||||
|
||||
Defined Terms Relating to Mars Protocol & Smart Contracts
|
||||
|
||||
“Endorsed Smart Contracts” means the Mainnet Smart Contracts and the
|
||||
Testnet Smart Contracts.
|
||||
|
||||
“Mainnet Smart Contracts” means all runtime object code that satisfies
|
||||
all of the following conditions precedent: (a) an instance of such code
|
||||
is deployed to a production-grade, commercial-grade “mainnet”
|
||||
blockchain-based network environment; (b) such code constitutes a part
|
||||
of the Mars Protocol; and (c) such instance of such code has been
|
||||
approved by the Martian Council to be governed by the Martian Council
|
||||
through Mars Hub on such blockchain-based network environment.
|
||||
|
||||
“Mars Protocol” means the software code at <https://github.com/mars-protocol>
|
||||
or any successor thereto expressly determined by the Martian Council to
|
||||
constitute or form a part of the “Mars Protocol”.
|
||||
|
||||
“Testnet Smart Contracts” means all runtime object code that satisfies
|
||||
all of the following conditions precedent: (a) an instance of such code
|
||||
is deployed to a nonproduction-grade, non-commercial-grade “testnet”
|
||||
blockchain-based network environment solely for testing purposes;
|
||||
(b) such code constitutes a part of the Mars Protocol; and (c) such
|
||||
deployment is in reasonable anticipation of, or follows, approval by
|
||||
the Martian Council of Mainnet Smart Contracts for the corresponding
|
||||
“mainnet” blockchain network environment.
|
||||
|
||||
3. CONDITIONS/PROHIBITED USES.
|
||||
Notwithstanding Section 2, it is a condition precedent and condition
|
||||
subsequent of the licenses granted hereunder that the Web Application must
|
||||
not be used in connection with or in furtherance of:
|
||||
|
||||
a. developing, making available, running or operating the Web
|
||||
Application for use by any person in connection with any smart
|
||||
contracts other than the Endorsed Smart Contracts;
|
||||
|
||||
b. any device, plan, scheme or artifice to defraud, or otherwise
|
||||
materially mislead, any person;
|
||||
|
||||
c. any fraud, deceit, material misrepresentation or other crime, tort
|
||||
or illegal conduct againstany person or device, plan, scheme or
|
||||
artifice for accomplishing the foregoing;
|
||||
|
||||
d. any violation, breach or failure to comply with any term or
|
||||
condition of this Agreement(including any inaccuracy in a
|
||||
epresentation of set forth in Section 4) or any other terms of
|
||||
service, privacy policy, trading policy or other contract
|
||||
governing the use of the Web Application or any Endorsed Smart
|
||||
Contract;
|
||||
|
||||
e. any fork, copy, derivative or alternative instance of any Endorsed
|
||||
Smart Contract;
|
||||
|
||||
f. any smart contract, platform or service that competes in any
|
||||
material respect with any Endorsed Smart Contract;
|
||||
|
||||
g. any device, plan, scheme or artifice to obtain any unfair
|
||||
competitive advantage over Licensor or other persons with an
|
||||
economic or beneficial interest in the Mainnet Smart Contracts;
|
||||
|
||||
h. any device, plan, scheme or artifice to interfere with, damage,
|
||||
impair or subvert the intended functioning of any Endorsed Smart
|
||||
Contract,including in connection with any “sybil attack”,
|
||||
“reentrancy attack”, “DoS attack,” “eclipse attack,” “consensus
|
||||
attack,” “reentrancy attack,” “griefing attack”, “economic
|
||||
incentive attack” or theft, conversion or
|
||||
misappropriation of tokens or other similar action;
|
||||
|
||||
i. any “front-running,” “wash trading,” “pump and dump trading,”
|
||||
“ramping,” “cornering” or other illegal, fraudulent, deceptive
|
||||
or manipulative trading activities ;
|
||||
|
||||
j. any device, plan, scheme or artifice to unfairly or deceptively
|
||||
influence the market price of any token; or
|
||||
|
||||
k. modifying or making derivative works based on the Web Application.
|
||||
|
||||
4. REPRESENTATIONS OF LICENSEES.
|
||||
Each person making use of or relying on any license granted under Section 2
|
||||
(each, a “Licensee”) hereby represents and warrants to Licensor that the
|
||||
following statements and information are accurate and complete at all times
|
||||
that such person makes use of or relies on the license.
|
||||
|
||||
a. Status. If Licensee is an individual, Licensee is of legal age in
|
||||
the jurisdiction in which Licensee resides (and in any event is
|
||||
older than thirteen years of age) and is of sound mind. If
|
||||
Licensee is a business entity, Licensee is duly organized, validly
|
||||
existing and in good standing under the laws of the jurisdiction
|
||||
in which it is organized and has all requisite power and authority
|
||||
for a business entity of its type to carry on its business as now
|
||||
conducted.
|
||||
|
||||
b. Power and Authority. Licensee has all requisite capacity, power and
|
||||
authority to accept this Agreement and to carry out and perform its
|
||||
obligations under this Agreement. This Agreement constitutes a
|
||||
legal, valid and binding obligation of Licensee, enforceable
|
||||
against Licensee.
|
||||
|
||||
c. No Conflict; Compliance with Law. Licensee agreeing to this
|
||||
Agreement and using the Web Application does not constitute, and
|
||||
would not reasonably be expected to result in (with or without
|
||||
notice, lapse of time, or both), a breach, default, contravention
|
||||
or violation of any law applicable to Licensee, or contract or
|
||||
agreement to which Licensee is a party or by which Licensee is
|
||||
bound.
|
||||
|
||||
d. Absence of Sanctions. Licensee is not, (and, if Licensee is an
|
||||
entity, Licensee is not owned or controlled by any other person
|
||||
who is), and is not acting on behalf of any other person who is,
|
||||
identified on any list of prohibited parties under any law or by
|
||||
any nation or government, state or other political subdivision
|
||||
thereof, any entity exercising legislative, judicial or
|
||||
administrative functions of or pertaining to government such as
|
||||
the lists maintained by the United Nations Security Council, the
|
||||
United Kingdom, the British Virgin Islands, the United States
|
||||
(including the U.S. Treasury Department’s Specially Designated
|
||||
Nationals list and Foreign Sanctions Evaders list), the European
|
||||
Union (EU) or its member states, and the government of a Licensee
|
||||
home country. Licensee is not, (and, if Licensee is an entity,
|
||||
Licensee is not owned or controlled by any other person who is),
|
||||
and is not acting on behalf of any other person who is, located,
|
||||
ordinarily resident, organized, established, or domiciled in Cuba,
|
||||
Iran, North Korea, Sudan, Syria, the Crimea region (including
|
||||
Sevastopol) or any other country or jurisdiction against which the
|
||||
United Nations, the United Kingdom, the British Virgin Islands or
|
||||
the United States maintains economic sanctions or an arms embargo.
|
||||
The tokens or other funds a Licensee use to participate in the Web
|
||||
Application are not derived from, and do not otherwise represent
|
||||
the proceeds of, any activities done in violation or contravention
|
||||
of any law.
|
||||
|
||||
e. No Claim, Loan, Ownership Interest or Investment Purpose. Licensee
|
||||
understands and agrees that the Licensee’s use of the Web
|
||||
Application does not: (i) represent or constitute a loan or a
|
||||
contribution of capital to, or other investment in Licensor or any
|
||||
business or venture; (ii) provide Licensee with any ownership
|
||||
interest, equity, security, or right to or interest in the assets,
|
||||
rights, properties, revenues or profits of, or voting rights
|
||||
whatsoever in, Licensor or any other business or venture; or (iii)
|
||||
create or imply or entitle Licensee to the benefits of any
|
||||
fiduciary or other agency relationship between Licensor or any of
|
||||
its directors, officers, employees, agents or affiliates, on the
|
||||
on hand, and Licensee, on the other hand. Licensee is not entering
|
||||
into this Agreement or using the Web Application for the purpose
|
||||
of making an investment with respect to Licensor or its securities,
|
||||
but solely wishes to use the Web Application for their
|
||||
intended purposes. Licensee understands and agrees that Licensor
|
||||
will not accept or take custody over any tokens or money or other
|
||||
assets of Licensee and has no responsibility or control over the
|
||||
foregoing.
|
||||
|
||||
f. Non-Reliance. Licensee is knowledgeable, experienced and
|
||||
sophisticated in using and evaluating blockchain and related
|
||||
technologies and assets, including all technologies referenced
|
||||
herein. Licensee has conducted its own thorough independent
|
||||
investigation and analysis of the Web Application and the other
|
||||
matters contemplated by this Agreement, and has not relied upon
|
||||
any information, statement, omission, representation or warranty,
|
||||
express or implied, written or oral, made by or on behalf of
|
||||
Licensor in connection therewith.
|
||||
|
||||
5. RISKS, DISCLAIMERS AND LIMITATIONS OF LIABILITY.
|
||||
THE WEB APPLICATION IS PROVIDED "AS IS" AND “AS-AVAILABLE,” AND ANY
|
||||
EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED
|
||||
WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE, ARE
|
||||
HEREBY DISCLAIMED. IN NO EVENT SHALL LICENSOR OR ANY OTHER CONTRIBUTOR TO
|
||||
THE WEB APPLICATION BE LIABLE FOR ANY DAMAGES, INCLUDING ANY DIRECT,
|
||||
INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES ARISING
|
||||
IN ANY WAY OUT OF THE USE OF THIS SOFTWARE OR INTELLECTUAL PROPERTY
|
||||
(INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR
|
||||
SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION),
|
||||
HOWEVER CAUSED OR CLAIMED (WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
|
||||
(INCLUDING NEGLIGENCE OR OTHERWISE)), EVEN IF SUCH DAMAGES WERE REASONABLY
|
||||
FORESEEABLE OR THE COPYRIGHT HOLDERS AND CONTRIBUTORS WERE ADVISED OF THE
|
||||
POSSIBILITY OF SUCH DAMAGE.
|
||||
|
||||
6. GENERAL PROVISIONS
|
||||
|
||||
a. Governing Law. This Agreement shall be governed by and construed
|
||||
under the internal laws of the British Virgin Islands, regardless
|
||||
of the laws that might otherwise govern under applicable
|
||||
principles of conflicts of laws.
|
||||
|
||||
b. Dispute Resolution. Licensee (i) hereby irrevocably and
|
||||
unconditionally submits to the jurisdiction of the relevant courts
|
||||
of the British Virgin Islands for the purpose of any dispute,
|
||||
suit, action or other proceeding arising out of or based upon this
|
||||
Agreement or the matters contemplated by this Agreement
|
||||
(“Disputes”), (ii) agrees not to commence any suit, action or
|
||||
other proceeding arising in connection with or based upon this
|
||||
Agreement or the matters contemplated by this Agreement except
|
||||
before the relevant courts of the British Virgin Islands, and
|
||||
(iii) hereby waives, and agrees not to assert, by way of motion,
|
||||
as a defense, or otherwise, in any such suit, action or
|
||||
proceeding, any claim that it is not subject personally to the
|
||||
jurisdiction of the above-named courts, that its property is
|
||||
exempt or immune from attachment or execution, that the suit,
|
||||
action or proceeding is brought in an inconvenient forum, that the
|
||||
venue of the suit, action or proceeding is improper or that this
|
||||
Agreement or the subject matter hereof or thereof may not be
|
||||
enforced in or by such court.
|
||||
|
||||
Each party will bear its own costs in respect of any Disputes.
|
||||
|
||||
Notwithstanding the foregoing, at the Licensor’s sole option and
|
||||
commencing within a reasonable period from the date of
|
||||
notification to the other party of such Dispute, any Dispute may
|
||||
be resolved by confidential, binding arbitration to be seated in
|
||||
the British Virgin Islands and conducted in the English language
|
||||
by a single arbitrator pursuant to the rules of the International
|
||||
Chamber of Commerce (the “Rules”). The arbitrator shall be
|
||||
appointed in accordance with the procedures set out in the Rules.
|
||||
The award or decision of the arbitrator shall be final and binding
|
||||
upon the parties and the parties expressly waive any right under
|
||||
the laws of any jurisdiction to appeal or otherwise challenge the
|
||||
award, ruling or decision of the arbitrator. The judgment of any
|
||||
award or decision may be entered in any court having competent
|
||||
jurisdiction to the extent necessary. If the Licensor elects to
|
||||
have a Dispute resolved by arbitration pursuant to this provision,
|
||||
no party hereto shall (or shall permit its representatives to)
|
||||
commence, continue or pursue any Dispute in any court.
|
||||
|
||||
Notwithstanding anything to the contrary set forth in this
|
||||
Agreement, the Licensor shall at all times be entitled to obtain
|
||||
an injunction or injunctions to prevent breaches of this Agreement
|
||||
and to enforce specifically the terms and provisions thereof, this
|
||||
being in addition to any other remedy to which the Licensor is
|
||||
entitled at law or in equity, and the parties hereto hereby waive
|
||||
the requirement of any undertaking in damages or posting of a bond
|
||||
in connection with such injunctive relief or specific performance.
|
||||
|
||||
EACH PARTY HEREBY WAIVES ITS RIGHTS TO A JURY TRIAL OF ANY CLAIM
|
||||
OR CAUSE OF ACTION BASED UPON OR ARISING OUT OF THIS AGREEMENT OR
|
||||
THE SUBJECT MATTER HEREOF. THE SCOPE OF THIS WAIVER IS INTENDED TO
|
||||
BE ALL-ENCOMPASSING OF ANY AND ALL DISPUTES THAT MAY BE FILED IN
|
||||
ANY COURT AND THAT RELATE TO THE SUBJECT MATTER OF ANY OF THE
|
||||
TRANSACTIONS CONTEMPLATED BY THIS AGREEMENT, INCLUDING, WITHOUT
|
||||
LIMITATION, CONTRACT CLAIMS, TORT CLAIMS (INCLUDING NEGLIGENCE),
|
||||
BREACH OF DUTY CLAIMS, AND ALL OTHER COMMON LAW AND STATUTORY
|
||||
CLAIMS. THIS SECTION HAS BEEN FULLY DISCUSSED BY EACH OF THE
|
||||
PARTIES HERETO AND THESE PROVISIONS WILL NOT BE SUBJECT TO ANY
|
||||
EXCEPTIONS. EACH PARTY HERETO HEREBY FURTHER WARRANTS AND
|
||||
REPRESENTS THAT SUCH PARTY HAS REVIEWED THIS WAIVER WITH ITS LEGAL
|
||||
COUNSEL, AND THAT SUCH PARTY KNOWINGLY AND VOLUNTARILY WAIVES ITS
|
||||
JURY TRIAL RIGHTS FOLLOWING CONSULTATION WITH LEGAL COUNSEL.
|
||||
|
||||
c. Class Action Waiver. No Class Actions Permitted. All Licensees
|
||||
hereby agree that any arbitration or other permitted action with
|
||||
respect to any Dispute shall be conducted in their individual
|
||||
capacities only and not as a class action or other representative
|
||||
action, and the Licensees expressly waive their right to file a
|
||||
class action or seek relief on a class basis. LICENSEES SHALL
|
||||
BRING CLAIMS AGAINST LICENSOR ONLY IN THEIR INDIVIDUAL CAPACITY,
|
||||
AND NOT AS A PLAINTIFF OR CLASS MEMBER IN ANY PURPORTED CLASS OR
|
||||
REPRESENTATIVE PROCEEDING.
|
||||
|
||||
Agreements if Class Action Waiver Unenforceable. If any court or
|
||||
arbitrator makes a final, binding and non-appealable determination
|
||||
that the class action waiver set forth herein is void or
|
||||
unenforceable for any reason or that a Dispute can proceed on a
|
||||
class basis, then the arbitration provision set forth above shall
|
||||
be deemed null and void with respect to any Dispute that would
|
||||
thus be required to be resolved by arbitration on a class basis,
|
||||
and the parties shall be deemed to have not agreed to arbitrate
|
||||
such Dispute. In the event that, as a result of the application of
|
||||
the immediately preceding sentence or otherwise, any Dispute is
|
||||
not subject to arbitration, the parties hereby agree to submit to
|
||||
the personal and exclusive jurisdiction of and venue in the
|
||||
federal and state courts located in the British Virgin Islands and
|
||||
to accept service of process by mail with respect to such Dispute,
|
||||
and hereby waive any and all jurisdictional and venue defenses
|
||||
otherwise available with respect to such Dispute.
|
||||
|
||||
d. Amendment; Waiver. This Agreement may be amended and provisions
|
||||
may be waived (either generally or in a particular instance and
|
||||
either retroactively or prospectively), only with the written
|
||||
consent of the Licensor.
|
||||
|
||||
e. Severability. Any term or provision of this Agreement that is
|
||||
found invalid or unenforceable in any situation in any
|
||||
jurisdiction shall not affect the validity or enforceability of
|
||||
the remaining terms and provisions hereof or the validity or
|
||||
enforceability of the offending term or provision in any other
|
||||
situation or in any other jurisdiction. If a final judgment of a
|
||||
court of competent jurisdiction declares that any term or
|
||||
provision hereof is invalid or unenforceable, the parties hereto
|
||||
agree that the court making such determination shall have the
|
||||
power to limit such term or provision, to delete specific words
|
||||
or phrases, or to replace any invalid or unenforceable term or
|
||||
provision with a term or provision that is valid and enforceable
|
||||
and that comes closest to expressing the intention of the invalid
|
||||
or unenforceable term or provision, and this Agreement shall be
|
||||
enforceable as so modified. In the event such court does not
|
||||
exercise the power granted to it in the prior sentence, the
|
||||
parties hereto agree to replace such invalid or unenforceable term
|
||||
or provision with a valid and enforceable term or provision that
|
||||
will achieve, to the extent possible, the economic, business and
|
||||
other purposes of such invalid or unenforceable term or provision.
|
||||
|
||||
f. Entire Agreement. This Agreement constitutes the entire agreement
|
||||
and understanding of the parties with respect to the subject matter
|
||||
hereof and supersede any and all prior negotiations,
|
||||
correspondence, warrants, agreements, understandings duties or
|
||||
obligations between or involving the parties with respect to the
|
||||
subject matter hereof.
|
||||
|
||||
g. Delays or Omissions. No delay or omission to exercise any right,
|
||||
power, or remedy accruing to any party under this Agreement, upon
|
||||
any breach or default of any other party under this Agreement,
|
||||
shall impair any such right, power, or remedy of such
|
||||
non-breaching or non-defaulting party, nor shall it be construed
|
||||
to be a waiver of or acquiescence to any such breach or default,
|
||||
or to any similar breach or default thereafter occurring, nor
|
||||
shall any waiver of any single breach or default be deemed a
|
||||
waiver of any other breach or default theretofore or thereafter
|
||||
occurring. Any waiver, permit, consent or approval of any kind or
|
||||
character on the part of any party of any breach or default under
|
||||
this Agreement, or any waiver on the part of any party of any
|
||||
provisions or conditions of this Agreement, must be in writing and
|
||||
shall be effective only to the extent specifically set forth in
|
||||
such writing. All remedies, whether under this Agreement or by law
|
||||
or otherwise afforded to any party, shall be cumulative and not
|
||||
alternative.
|
||||
|
||||
h. Successors and Assigns. The terms and conditions of this Agreement
|
||||
shall inure to the benefit of and be binding upon the respective
|
||||
successors and assigns of the parties hereto. This Agreement shall
|
||||
not have third-party beneficiaries, other than the Martian Council.
|
||||
|
||||
i. Rules of Construction. Gender; Etc. For purposes of this
|
||||
Agreement, whenever the context requires: the singular number
|
||||
shall include the plural, and vice versa; the masculine gender
|
||||
shall include the feminine and neuter genders; the feminine gender
|
||||
shall include the masculine and neuter genders; and the neuter
|
||||
gender shall include the masculine and feminine genders.
|
||||
|
||||
Ambiguities. The Parties hereto agree that any rule of
|
||||
construction to the effect that ambiguities are to be resolved
|
||||
against the drafting Party shall not be applied in the
|
||||
construction or interpretation of this Agreement.
|
||||
|
||||
No Limitation. As used in this Agreement, the words “include,”
|
||||
“including,” “such as” and variations thereof, shall not be deemed
|
||||
to be terms of limitation, but rather shall be deemed to be
|
||||
followed by the words “without limitation.” The word “or” shall
|
||||
mean the non-exclusive “or”. References. Except as otherwise
|
||||
indicated, all references in this Agreement to “Sections,”
|
||||
“Schedules” and “Exhibits” are intended to refer to Sections of
|
||||
this Agreement and Schedules and Exhibits to this Agreement.
|
||||
|
||||
Hereof. The terms “hereof,” “herein,” “hereunder,” “hereby” and
|
||||
“herewith” and words of similar import will, unless otherwise
|
||||
stated, be construed to refer to this Agreement as a whole and not
|
||||
to any particular provision of this Agreement.
|
||||
|
||||
Captions/Headings. The captions, headings and similar labels
|
||||
contained in this Agreement are for convenience of reference only,
|
||||
shall not be deemed to be a part of this Agreement and shall not
|
||||
be referred to in connection with the construction or
|
||||
interpretation of this Agreement.
|
||||
|
||||
Person. The term “person” refers to any natural born or legal
|
||||
person, entity, governmental body or incorporated or
|
||||
unincorporated association, partnership or joint venture.
|
||||
84
README.md
84
README.md
@ -1,76 +1,32 @@
|
||||
# Mars Protocol v2 Outpost Frontend
|
||||
This is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app).
|
||||
|
||||
|
||||
## Getting Started
|
||||
|
||||
## 1. Web App
|
||||
First, install the dependencies:
|
||||
|
||||
This project is a [NextJS](https://nextjs.org/). React application.
|
||||
```
|
||||
yarn install
|
||||
```
|
||||
|
||||
The project utilises [React hooks](https://reactjs.org/docs/hooks-intro.html), functional components, [Zustand](https://github.com/pmndrs/zustand) for state management, and [useSWR](https://swr.vercel.app/) for general data fetching and management.
|
||||
|
||||
Styles are handled with [Tailwind](https://tailwindcss.com/).
|
||||
|
||||
Typescript is added and utilised (but optional if you want to create .jsx or .tsx files).
|
||||
|
||||
## 2. Deployment
|
||||
|
||||
Start web server
|
||||
Then, run the development server:
|
||||
|
||||
```bash
|
||||
yarn && yarn dev
|
||||
yarn dev
|
||||
```
|
||||
|
||||
### 2.1 Custom node endpoints using Docker
|
||||
Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
|
||||
|
||||
We allow the use of environment variables to be passed to the Docker container to specify custom endpoints for the app. The variables are:
|
||||
## Trading charts
|
||||
|
||||
| Variable | Description | Default |
|
||||
| ----------------- | ------------------------------------- | ---------------------------------------- |
|
||||
| URL_OSMOSIS_REST | The Osmosis node REST endpoint to use | https://lcd-osmosis.blockapsis.com |
|
||||
| URL_OSMOSIS_RPC | The Osmosis node RPC endpoint to use | https://rpc-osmosis.blockapsis.com |
|
||||
| WALLET_CONNECT_ID | Your projects WalletConnect v2 ID | 0x0x0x0x0x0x0x0x0x0x0x0x0x0x0x0x0x0x0x0x |
|
||||
The trade charts are sourced with the TradingView [charting_library](https://www.tradingview.com/charting-library-docs/). In order to enable the charts, request has to be requested from TradingView. This allows the charting_library package to be pulled-in during the application build process. For this, it is recommended to do the following:
|
||||
|
||||
**Sample Docker run command**
|
||||
1. Request access to the TradingView repository
|
||||
2. Create a private fork
|
||||
3. Generate a Personal Access Token from Github
|
||||
4. Add the following to the environment variables:
|
||||
a. CHARTING_LIBRARY_USERNAME -> the username of the account with access
|
||||
b. CHARTING_LIBRARY_ACCESS_TOKEN -> the access token
|
||||
c. CHARTING_LIBRARY_REPOSITORY -> the URI of the Github repository
|
||||
5. Build the application by executing the `install_charting_library.sh` script prior.
|
||||
|
||||
This command will start the container in interactive mode with port 3000 bound to localhost and print logs to stdout.
|
||||
|
||||
```sh
|
||||
docker run -it -p 3000:3000 \
|
||||
-e URL_OSMOSIS_REST=https://lcd-osmosis.blockapsis.com \
|
||||
-e URL_OSMOSIS_RPC=https://rpc-osmosis.blockapsis.com \
|
||||
-e WALLET_CONNECT_ID=0x0x0x0x0x0x0x0x0x0x0x0x0x0x0x0x0x0x0x0x marsprotocol/interface:latest
|
||||
```
|
||||
|
||||
### 2.2 Custom node endpoints using non-Docker deployments
|
||||
|
||||
Copy `.env.example` to `.env` and modify the values to suit your needs.
|
||||
|
||||
#### 2.2.1 TradingView library
|
||||
|
||||
The Outpost UI has a [TradingView](https://www.tradingview.com/) implementation, to display charts for the listed assets.
|
||||
|
||||
**TradingView only works on non-docker deployments (e.g. via [vercel](https://vercel.com)). As the docker image already has a fallback installed and can not be updated on `docker run`**
|
||||
|
||||
If you are running the UI on a node based server, add the following environment variables to install TradingView.
|
||||
|
||||
```
|
||||
CHARTING_LIBRARY_USERNAME=YOUR_GIT_USERNAME
|
||||
CHARTING_LIBRARY_ACCESS_TOKEN=YOUR_TRADING_VIEW_ACCESS_TOKEN
|
||||
CHARTING_LIBRARY_REPOSITORY=github.com/tradingview/charting_library/
|
||||
```
|
||||
|
||||
_NOTE: You'll also need to have an active TradingView license to obtain those credentials_
|
||||
|
||||
## 4. Development practices
|
||||
|
||||
### 4.1 Data orchestration
|
||||
|
||||
Data is handled with a combination of container components, useSWR and a caching mechanism. API hooks are responsible for syncing the application state.
|
||||
|
||||
## 5. Contributing
|
||||
|
||||
We welcome and encourage contributions! Please create a pull request with as much information about the work you did and what your motivation/intention was.
|
||||
|
||||
## 6. License
|
||||
|
||||
Contents of this repository are open source under the [Mars Protocol Web Application License Agreement](./LICENSE).
|
||||
For development on localhost, run `yarn install-charting-library`. Ensure that you have a `.env.local` file defined with the variables mentioned above.
|
||||
|
||||
@ -1,29 +0,0 @@
|
||||
#!/bin/bash
|
||||
# no verbose
|
||||
set +x
|
||||
nextFolder='/app/.next'
|
||||
# create the config file from environment variables
|
||||
envFilename='override.conf'
|
||||
echo "APP_NEXT_OSMOSIS_RPC=$URL_OSMOSIS_RPC" >> $envFilename
|
||||
echo "APP_NEXT_OSMOSIS_REST=$URL_OSMOSIS_REST" >> $envFilename
|
||||
echo "APP_NEXT_WALLET_CONNECT_ID=$WALLET_CONNECT_ID" >> $envFilename
|
||||
|
||||
function apply_path {
|
||||
# read all config file
|
||||
while read line; do
|
||||
# no comment or not empty
|
||||
if [ "${line:0:1}" == "#" ] || [ "${line}" == "" ]; then
|
||||
continue
|
||||
fi
|
||||
|
||||
# split
|
||||
configName="$(cut -d'=' -f1 <<<"$line")"
|
||||
configValue="$(cut -d'=' -f2 <<<"$line")"
|
||||
|
||||
# replace all config values in built app with the ones defined in override
|
||||
find $nextFolder \( -type d -name .git -prune \) -o -type f -print0 | xargs -0 sed -i "s#$configName#$configValue#g"
|
||||
|
||||
done < $envFilename
|
||||
}
|
||||
apply_path
|
||||
exec "$@"
|
||||
@ -2,22 +2,6 @@ require('dotenv').config()
|
||||
const shell = require('shelljs')
|
||||
const path = require('path')
|
||||
|
||||
if (
|
||||
!process.env.CHARTING_LIBRARY_USERNAME ||
|
||||
!process.env.CHARTING_LIBRARY_ACCESS_TOKEN ||
|
||||
!process.env.CHARTING_LIBRARY_REPOSITORY
|
||||
) {
|
||||
console.log(
|
||||
'Charting library credentials are missing. Skipping the install of the charting library.',
|
||||
'\n\n',
|
||||
'To install the charting library, please provide the following environment variables:',
|
||||
'\n',
|
||||
'CHARTING_LIBRARY_USERNAME, CHARTING_LIBRARY_ACCESS_TOKEN, CHARTING_LIBRARY_REPOSITORY',
|
||||
)
|
||||
shell.exec(`sh ` + path.join(__dirname, 'install_dummy_charting_library.sh'))
|
||||
return
|
||||
}
|
||||
|
||||
shell.exec(
|
||||
`CHARTING_LIBRARY_USERNAME=${process.env.CHARTING_LIBRARY_USERNAME} ` +
|
||||
`CHARTING_LIBRARY_ACCESS_TOKEN=${process.env.CHARTING_LIBRARY_ACCESS_TOKEN} ` +
|
||||
|
||||
@ -14,8 +14,8 @@ remove_if_directory_exists "$LATEST_HASH"
|
||||
|
||||
git clone -q --depth 1 -b "$BRANCH" $REPOSITORY "$LATEST_HASH"
|
||||
|
||||
remove_if_directory_exists "public/charting_library"
|
||||
remove_if_directory_exists "public/datafeeds"
|
||||
remove_if_directory_exists "public/static/charting_library"
|
||||
remove_if_directory_exists "public/static/datafeeds"
|
||||
remove_if_directory_exists "src/utils/charting_library"
|
||||
remove_if_directory_exists "src/utils/datafeeds"
|
||||
|
||||
|
||||
@ -1,15 +0,0 @@
|
||||
#!/bin/sh
|
||||
|
||||
remove_if_directory_exists() {
|
||||
if [ -d "$1" ]; then rm -Rf "$1"; fi
|
||||
}
|
||||
|
||||
remove_if_directory_exists "public/charting_library"
|
||||
remove_if_directory_exists "public/datafeeds"
|
||||
remove_if_directory_exists "src/utils/charting_library"
|
||||
remove_if_directory_exists "src/utils/datafeeds"
|
||||
|
||||
cp -r src/dummy/charting_library public/
|
||||
cp -r src/dummy/charting_library src/utils/
|
||||
cp -r src/dummy/datafeeds public/
|
||||
cp -r src/dummy/datafeeds src/utils/
|
||||
@ -1,12 +0,0 @@
|
||||
diff --git a/next.config.js b/next.config.js
|
||||
index 4a208ebb..9c716638 100644
|
||||
--- a/next.config.js
|
||||
+++ b/next.config.js
|
||||
@@ -1,6 +1,7 @@
|
||||
/** @type {import('next').NextConfig} */
|
||||
|
||||
const nextConfig = {
|
||||
+ output: 'standalone',
|
||||
reactStrictMode: true,
|
||||
images: {
|
||||
domains: [
|
||||
@ -69,4 +69,18 @@ const nextConfig = {
|
||||
},
|
||||
}
|
||||
|
||||
const sentryWebpackPluginOptions = {
|
||||
// Additional config options for the Sentry Webpack plugin. Keep in mind that
|
||||
// the following options are set automatically, and overriding them is not
|
||||
// recommended:
|
||||
// release, url, org, project, authToken, configFile, stripPrefix,
|
||||
// urlPrefix, include, ignore
|
||||
|
||||
silent: true, // Suppresses all logs
|
||||
// For all available options, see:
|
||||
// https://github.com/getsentry/sentry-webpack-plugin#options.
|
||||
}
|
||||
|
||||
// Make sure adding Sentry options is the last code to run before exporting, to
|
||||
// ensure that your source maps include changes from all other Webpack plugins
|
||||
module.exports = nextConfig
|
||||
|
||||
70
package.json
70
package.json
@ -1,17 +1,17 @@
|
||||
{
|
||||
"name": "mars-v2-frontend",
|
||||
"version": "2.2.4",
|
||||
"homepage": "./",
|
||||
"private": false,
|
||||
"license": "SEE LICENSE IN LICENSE FILE",
|
||||
"version": "2.2.0",
|
||||
"private": true,
|
||||
"scripts": {
|
||||
"build": "yarn install-charting-library && next build",
|
||||
"build": "yarn validate-env && next build",
|
||||
"dev": "next dev",
|
||||
"lint": "eslint ./src/ && yarn prettier-check",
|
||||
"format": "eslint ./src/ --fix && prettier --write ./src/ ",
|
||||
"prettier-check": "prettier --ignore-path .gitignore --check ./src/",
|
||||
"start": "next start",
|
||||
"install-charting-library": "dotenv -e .env.local node install_charting_library.js"
|
||||
"validate-env": "node ./validate-env",
|
||||
"install-charting-library": "dotenv -e .env.local node install_charting_library.js",
|
||||
"prepare": "husky install"
|
||||
},
|
||||
"lint-staged": {
|
||||
"*.ts*": [
|
||||
@ -21,62 +21,60 @@
|
||||
},
|
||||
"dependencies": {
|
||||
"@cosmjs/cosmwasm-stargate": "^0.32.2",
|
||||
"@delphi-labs/shuttle-react": "^3.19.1",
|
||||
"@keplr-wallet/cosmos": "^0.12.67",
|
||||
"@delphi-labs/shuttle-react": "^3.10.0",
|
||||
"@keplr-wallet/cosmos": "^0.12.42",
|
||||
"@sentry/nextjs": "^7.94.1",
|
||||
"@splinetool/react-spline": "^2.2.6",
|
||||
"@splinetool/runtime": "^1.0.52",
|
||||
"@splinetool/runtime": "^0.9.521",
|
||||
"@tailwindcss/container-queries": "^0.1.1",
|
||||
"@tanstack/react-table": "^8.11.8",
|
||||
"@tanstack/react-table": "^8.10.6",
|
||||
"@tippyjs/react": "^4.2.6",
|
||||
"bignumber.js": "^9.1.2",
|
||||
"classnames": "^2.5.1",
|
||||
"classnames": "^2.3.2",
|
||||
"debounce-promise": "^3.1.2",
|
||||
"ibc-domains-sdk": "^1.1.0",
|
||||
"lodash.debounce": "^4.0.8",
|
||||
"lodash.throttle": "^4.1.1",
|
||||
"moment": "^2.30.1",
|
||||
"next": "^14.1.0",
|
||||
"moment": "^2.29.4",
|
||||
"next": "^13.5.4",
|
||||
"react": "^18.2.0",
|
||||
"react-device-detect": "^2.2.3",
|
||||
"react-dom": "^18.2.0",
|
||||
"react-draggable": "^4.4.6",
|
||||
"react-helmet-async": "^2.0.4",
|
||||
"react-helmet-async": "^2.0.3",
|
||||
"react-qr-code": "^2.0.12",
|
||||
"react-router-dom": "^6.22.0",
|
||||
"react-router-dom": "^6.21.3",
|
||||
"react-spring": "^9.7.3",
|
||||
"react-toastify": "^10.0.4",
|
||||
"react-toastify": "^9.1.3",
|
||||
"react-use-clipboard": "^1.0.9",
|
||||
"recharts": "^2.12.0",
|
||||
"recharts": "^2.10.1",
|
||||
"sharp": "^0.33.2",
|
||||
"swr": "^2.2.4",
|
||||
"tailwind-scrollbar-hide": "^1.1.7",
|
||||
"zustand": "^4.5.0"
|
||||
"zustand": "^4.4.7"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@svgr/webpack": "^8.1.0",
|
||||
"@types/debounce-promise": "^3.1.9",
|
||||
"@types/lodash.debounce": "^4.0.9",
|
||||
"@types/lodash.throttle": "^4.1.9",
|
||||
"@types/node": "^20.11.17",
|
||||
"@types/react": "18.2.55",
|
||||
"@types/react-dom": "18.2.19",
|
||||
"@types/lodash.throttle": "^4.1.8",
|
||||
"@types/node": "^20.10.6",
|
||||
"@types/react": "18.2.41",
|
||||
"@types/react-dom": "18.2.15",
|
||||
"@types/react-helmet": "^6.1.11",
|
||||
"autoprefixer": "^10.4.17",
|
||||
"dotenv": "^16.4.3",
|
||||
"autoprefixer": "^10.4.16",
|
||||
"dotenv": "^16.3.1",
|
||||
"dotenv-cli": "^7.3.0",
|
||||
"eslint": "^8.56.0",
|
||||
"eslint-config-next": "^14.1.0",
|
||||
"eslint-plugin-import": "^2.29.1",
|
||||
"husky": "^9.0.10",
|
||||
"eslint-config-next": "^14.0.4",
|
||||
"eslint-plugin-import": "^2.29.0",
|
||||
"husky": "^8.0.3",
|
||||
"identity-obj-proxy": "^3.0.0",
|
||||
"lint-staged": "^15.2.2",
|
||||
"prettier": "^3.2.5",
|
||||
"prettier-plugin-tailwindcss": "^0.5.11",
|
||||
"lint-staged": "^15.2.0",
|
||||
"prettier": "^3.2.4",
|
||||
"prettier-plugin-tailwindcss": "^0.5.6",
|
||||
"shelljs": "^0.8.5",
|
||||
"tailwindcss": "^3.4.1",
|
||||
"typescript": "5.3.3"
|
||||
},
|
||||
"engines": {
|
||||
"npm": "please-use-yarn",
|
||||
"yarn": ">= 1.19.1"
|
||||
"tailwindcss": "^3.3.3",
|
||||
"typescript": "5.2.2"
|
||||
}
|
||||
}
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
<svg version="1.1" viewBox="0 0 800 800" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<svg width="800" height="800" viewBox="0 0 800 800" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M278.2 77L630.637 686L748 482.977L513.1 77H278.2V77Z" fill="#F34C2D" />
|
||||
<path d="M278.2 494.6L400.087 686H643.6L521.887 494.6H278.2V494.6Z" fill="#BE312D" />
|
||||
<path d="M173.8 268.4L52 477.2L173.887 686L417.4 268.4H173.8Z" fill="#F34C2D" />
|
||||
|
||||
|
Before Width: | Height: | Size: 355 B After Width: | Height: | Size: 366 B |
@ -1,4 +1,4 @@
|
||||
<svg version="1.1" viewBox="0 0 501 501" xmlns="http://www.w3.org/2000/svg">
|
||||
<svg width="501" height="501" viewBox="0 0 501 501" xmlns="http://www.w3.org/2000/svg">
|
||||
<path
|
||||
d="M250.75 500.75C388.82 500.75 500.75 388.82 500.75 250.75C500.75 112.679 388.82 0.75 250.75 0.75C112.679 0.75 0.75 112.679 0.75 250.75C0.75 388.82 112.679 500.75 250.75 500.75Z"
|
||||
fill="#FFFFFF"
|
||||
|
||||
|
Before Width: | Height: | Size: 1.0 KiB After Width: | Height: | Size: 1.1 KiB |
@ -1,4 +1,4 @@
|
||||
<svg version="1.1" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
|
||||
<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
|
||||
<path
|
||||
d="M12 24C18.6499 24 24 18.6499 24 12C24 5.3501 18.6499 0 12 0C5.3501 0 0 5.3501 0 12C0 18.6499 5.3501 24 12 24Z"
|
||||
fill="#2775CA"
|
||||
|
||||
|
Before Width: | Height: | Size: 3.2 KiB After Width: | Height: | Size: 3.1 KiB |
@ -1,4 +1,4 @@
|
||||
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 600 600">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="600" height="600" fill="none" viewBox="0 0 600 600">
|
||||
<path
|
||||
fill="url(#paint0_linear)"
|
||||
d="M148.497 169.135C150.981 166.013 153.613 163.009 156.245 160.005C156.363 159.856 156.63 159.826 156.748 159.677C156.985 159.38 157.37 159.201 157.606 158.903L157.843 158.606C159.678 156.91 161.63 155.064 163.881 153.456C171.845 147.41 180.11 142.817 188.825 139.795C216.778 129.981 247.894 136.029 272.295 159.065C306.366 191.002 303.315 242.451 276.117 276.647C241.748 327.625 182.684 398.748 264.463 462.46C279.167 473.916 290.075 483.361 336.392 496.746C306.1 502.326 278.012 500.59 246.748 492.605C224.634 480.123 189.866 453.397 178.037 417.3C160.159 362.562 209.513 280.732 233.365 249.216C266.113 205.599 213.124 158.382 174.112 211.095C153.72 238.566 118.044 316.303 130.442 373.965C137.691 406.664 147.353 430.499 185.663 463.241C178.559 459.049 171.66 454.294 164.968 448.974C75.957 366.06 86.2838 237.859 148.497 169.135Z"
|
||||
|
||||
|
Before Width: | Height: | Size: 2.3 KiB After Width: | Height: | Size: 2.3 KiB |
@ -1,114 +1,29 @@
|
||||
<svg version="1.1" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
|
||||
<path
|
||||
d="M12.985,0.812C13.949,0.812 14.279,0.928 14.929,1.155C15.091,1.211 15.273,1.275 15.49,1.345C19.947,2.795 23.25,7.071 23.25,12.005C23.25,12.829 23.133,13.721 22.963,14.506C22.196,17.622 20.213,20.269 17.543,21.804C16.213,22.568 14.67,23.131 13.068,23.239C12.8,23.257 11.93,23.249 11.339,23.243C11.126,23.241 10.95,23.239 10.85,23.239C5.061,22.419 0.75,18.142 0.75,12.005C0.75,10.447 1.047,8.887 1.653,7.454C2.282,5.968 3.362,4.699 4.486,3.6C5.476,2.634 6.7,2.1 7.906,1.574C8.081,1.498 8.255,1.422 8.428,1.345C9.05,1.068 9.469,1.008 9.996,0.932C10.214,0.9 10.45,0.866 10.727,0.812C11.214,0.719 11.726,0.75 12.234,0.781C12.486,0.797 12.738,0.812 12.985,0.812Z"
|
||||
style="fill: url(#_Linear1); fill-rule: nonzero"
|
||||
/>
|
||||
<path
|
||||
d="M12.985,0.812C13.949,0.812 14.279,0.928 14.929,1.155C15.091,1.211 15.273,1.275 15.49,1.345C19.947,2.795 23.25,7.071 23.25,12.005C23.25,12.829 23.133,13.721 22.963,14.506C22.196,17.622 20.213,20.269 17.543,21.804C16.213,22.568 14.67,23.131 13.068,23.239C12.8,23.257 11.93,23.249 11.339,23.243C11.126,23.241 10.95,23.239 10.85,23.239C5.061,22.419 0.75,18.142 0.75,12.005C0.75,10.447 1.047,8.887 1.653,7.454C2.282,5.968 3.362,4.699 4.486,3.6C5.476,2.634 6.7,2.1 7.906,1.574C8.081,1.498 8.255,1.422 8.428,1.345C9.05,1.068 9.469,1.008 9.996,0.932C10.214,0.9 10.45,0.866 10.727,0.812C11.214,0.719 11.726,0.75 12.234,0.781C12.486,0.797 12.738,0.812 12.985,0.812Z"
|
||||
style="fill: none; fill-rule: nonzero; stroke: white; stroke-width: 1px"
|
||||
/>
|
||||
<path
|
||||
d="M11.999,0.166L15.656,0.746L18.955,2.426L21.573,5.044L23.254,8.342L23.834,11.999L23.254,15.656L21.573,18.955L18.955,21.573L15.656,23.254L11.999,23.834L8.343,23.254L5.044,21.573L2.426,18.955L0.746,15.656L0.166,11.999L0.746,8.343L2.426,5.044L5.044,2.426L8.343,0.746L11.999,0.166ZM8.549,1.381L5.436,2.966L2.967,5.436L1.381,8.549L0.834,11.999L1.381,15.45L2.967,18.562L5.436,21.032L8.549,22.619L11.999,23.166L15.45,22.619L18.562,21.032L21.032,18.562L22.619,15.45L23.166,11.999L22.619,8.549L21.032,5.436L18.562,2.966L15.45,1.381L11.999,0.834L8.549,1.381Z"
|
||||
style="fill: white"
|
||||
/>
|
||||
<path
|
||||
d="M11.915,3.928C11.993,3.881 12.094,3.907 12.141,3.985L14.738,8.343C14.785,8.421 14.759,8.523 14.681,8.569C14.603,8.616 14.501,8.59 14.455,8.512L11.857,4.154C11.811,4.076 11.836,3.975 11.915,3.928Z"
|
||||
style="fill: white"
|
||||
/>
|
||||
<path
|
||||
d="M11.999,3.904L17.36,4.484L17.325,4.812L11.999,4.236L6.674,4.812L6.639,4.484L11.999,3.904Z"
|
||||
style="fill: white"
|
||||
/>
|
||||
<path
|
||||
d="M9.237,8.426C9.237,8.334 9.311,8.261 9.402,8.261L14.596,8.261C14.687,8.261 14.761,8.334 14.761,8.426C14.761,8.517 14.687,8.591 14.596,8.591L9.402,8.591C9.311,8.591 9.237,8.517 9.237,8.426Z"
|
||||
style="fill: white"
|
||||
/>
|
||||
<path
|
||||
d="M12.083,3.928C12.161,3.975 12.187,4.076 12.14,4.154L9.544,8.512C9.497,8.59 9.396,8.616 9.318,8.569C9.24,8.523 9.214,8.421 9.261,8.343L11.857,3.985C11.903,3.907 12.004,3.881 12.083,3.928Z"
|
||||
style="fill: white"
|
||||
/>
|
||||
<path
|
||||
d="M8.392,0.803L11.999,3.853L15.606,0.803L17.49,4.573L17.195,4.721L15.499,1.326L11.999,4.285L8.499,1.326L6.804,4.721L6.509,4.573L8.392,0.803Z"
|
||||
style="fill: white"
|
||||
/>
|
||||
<path
|
||||
d="M5.143,2.563C5.217,2.509 5.32,2.525 5.374,2.599L11.999,11.719L18.625,2.599C18.679,2.525 18.782,2.509 18.856,2.563C18.929,2.616 18.946,2.719 18.892,2.793L12.133,12.097C12.102,12.14 12.052,12.165 11.999,12.165C11.947,12.165 11.897,12.14 11.866,12.097L5.107,2.793C5.053,2.719 5.07,2.616 5.143,2.563Z"
|
||||
style="fill: white"
|
||||
/>
|
||||
<path
|
||||
d="M9.525,8.314C9.565,8.358 9.578,8.42 9.56,8.476L7.992,13.303L12.081,16.274L16.727,18.266C16.811,18.302 16.85,18.399 16.814,18.482C16.778,18.566 16.681,18.605 16.597,18.569L11.934,16.57C11.923,16.565 11.912,16.559 11.902,16.552L7.701,13.499C7.643,13.457 7.619,13.383 7.641,13.315L9.156,8.651L4.493,9.709C4.404,9.729 4.315,9.674 4.295,9.585C4.275,9.496 4.331,9.408 4.42,9.387L9.367,8.265C9.424,8.251 9.485,8.27 9.525,8.314Z"
|
||||
style="fill: white"
|
||||
/>
|
||||
<path
|
||||
d="M4.347,9.426C4.416,9.366 4.52,9.373 4.58,9.442L7.922,13.259C7.982,13.328 7.975,13.432 7.907,13.492C7.838,13.552 7.734,13.545 7.674,13.477L4.332,9.659C4.272,9.591 4.279,9.486 4.347,9.426Z"
|
||||
style="fill: white"
|
||||
/>
|
||||
<path
|
||||
d="M6.931,4.439L4.635,9.553L4.661,9.616L4.603,9.652L3.534,14.751L7.435,18.284L12.078,20.948L15.442,22.696L16.535,18.244L21.105,18.581L20.481,14.837L20.807,14.783L21.499,18.941L16.789,18.593L15.662,23.182L11.917,21.236L7.24,18.553L3.238,14.928L0.234,11.971L4.25,9.483L2.464,5.109L6.931,4.439ZM4.215,9.893L0.765,12.03L3.254,14.48L4.215,9.893ZM4.463,9.131L6.382,4.855L2.928,5.373L4.463,9.131Z"
|
||||
style="fill: white"
|
||||
/>
|
||||
<path
|
||||
d="M7.814,13.202C7.904,13.211 7.971,13.291 7.963,13.382L7.502,18.433C7.494,18.524 7.414,18.591 7.323,18.583C7.232,18.574 7.165,18.494 7.174,18.403L7.634,13.352C7.642,13.261 7.723,13.194 7.814,13.202Z"
|
||||
style="fill: white"
|
||||
/>
|
||||
<path
|
||||
d="M12.151,16.353C12.187,16.436 12.148,16.533 12.065,16.569L7.403,18.569C7.319,18.604 7.222,18.566 7.186,18.482C7.15,18.398 7.189,18.301 7.273,18.265L11.935,16.266C12.018,16.23 12.115,16.269 12.151,16.353Z"
|
||||
style="fill: white"
|
||||
/>
|
||||
<path
|
||||
d="M2.893,18.581L3.517,14.837L3.191,14.783L2.499,18.941L7.211,18.594L8.336,23.182L12.075,21.24L11.923,20.947L8.556,22.696L7.465,18.244L2.893,18.581Z"
|
||||
style="fill: white"
|
||||
/>
|
||||
<path
|
||||
d="M12.097,11.865C12.14,11.896 12.165,11.946 12.165,11.998L12.165,23.5C12.165,23.591 12.091,23.665 12,23.665C11.909,23.665 11.835,23.591 11.835,23.5L11.835,12.226L1.115,15.709C1.029,15.737 0.936,15.69 0.908,15.603C0.879,15.517 0.927,15.423 1.013,15.395L11.949,11.842C11.999,11.825 12.054,11.834 12.097,11.865Z"
|
||||
style="fill: white"
|
||||
/>
|
||||
<path
|
||||
d="M17.212,4.547C17.248,4.499 17.308,4.475 17.368,4.484L21.327,5.078C21.377,5.085 21.421,5.115 21.446,5.159C21.471,5.203 21.474,5.256 21.455,5.303L19.749,9.483L23.587,11.861C23.63,11.887 23.658,11.932 23.664,11.982C23.669,12.033 23.652,12.083 23.616,12.118L20.762,14.926L20.756,14.932L20.755,14.932C20.755,14.933 20.754,14.934 20.753,14.934L16.773,18.541C16.727,18.583 16.661,18.595 16.602,18.572C16.544,18.55 16.504,18.496 16.498,18.434L16.039,13.4L14.44,8.478C14.421,8.421 14.435,8.359 14.475,8.315C14.515,8.272 14.575,8.253 14.633,8.266L19.258,9.315L17.193,4.715C17.168,4.659 17.175,4.595 17.212,4.547ZM19.237,9.649L14.843,8.652L16.269,13.04L19.237,9.649ZM16.372,13.422L16.797,18.074L20.464,14.751L19.45,9.907L16.372,13.422ZM19.784,9.893L20.744,14.48L23.234,12.03L19.784,9.893ZM19.536,9.13L21.07,5.373L17.617,4.855L19.536,9.13Z"
|
||||
style="fill: white"
|
||||
/>
|
||||
<path
|
||||
d="M11.842,11.947C11.87,11.861 11.963,11.813 12.05,11.842L22.987,15.395C23.074,15.423 23.121,15.517 23.093,15.603C23.065,15.69 22.972,15.737 22.885,15.709L11.948,12.155C11.861,12.127 11.814,12.034 11.842,11.947Z"
|
||||
style="fill: white"
|
||||
/>
|
||||
<path
|
||||
d="M16.335,13.27C16.389,13.343 16.372,13.447 16.298,13.5L12.096,16.552C12.022,16.606 11.919,16.59 11.866,16.516C11.812,16.442 11.828,16.339 11.902,16.285L16.104,13.233C16.178,13.18 16.281,13.196 16.335,13.27Z"
|
||||
style="fill: white"
|
||||
/>
|
||||
<path
|
||||
d="M16.58,18.276C16.653,18.234 16.746,18.254 16.796,18.322L18.892,21.208C18.945,21.282 18.929,21.385 18.855,21.439C18.782,21.492 18.678,21.476 18.625,21.402L16.616,18.636L12.081,21.237C12.002,21.282 11.901,21.255 11.856,21.176C11.81,21.097 11.838,20.996 11.917,20.951L16.58,18.276Z"
|
||||
style="fill: white"
|
||||
/>
|
||||
<path
|
||||
d="M11.999,0.335C12.09,0.335 12.164,0.409 12.164,0.5L12.164,4.068C12.164,4.159 12.09,4.233 11.999,4.233C11.908,4.233 11.834,4.159 11.834,4.068L11.834,0.5C11.834,0.409 11.908,0.335 11.999,0.335Z"
|
||||
style="fill: white"
|
||||
/>
|
||||
<path
|
||||
d="M23.093,8.396C23.121,8.483 23.073,8.576 22.987,8.604L19.594,9.706C19.507,9.735 19.414,9.687 19.386,9.601C19.358,9.514 19.405,9.421 19.492,9.393L22.885,8.29C22.971,8.262 23.064,8.309 23.093,8.396Z"
|
||||
style="fill: white"
|
||||
/>
|
||||
<path
|
||||
d="M7.435,18.286C7.509,18.34 7.525,18.443 7.471,18.516L5.374,21.402C5.32,21.476 5.217,21.492 5.143,21.439C5.069,21.385 5.053,21.282 5.107,21.208L7.204,18.322C7.258,18.249 7.361,18.232 7.435,18.286Z"
|
||||
style="fill: white"
|
||||
/>
|
||||
<path
|
||||
d="M0.908,8.396C0.936,8.309 1.029,8.262 1.115,8.29L4.508,9.393C4.595,9.421 4.642,9.514 4.614,9.601C4.586,9.687 4.493,9.735 4.406,9.706L1.013,8.604C0.927,8.576 0.879,8.483 0.908,8.396Z"
|
||||
style="fill: white"
|
||||
/>
|
||||
<defs>
|
||||
<linearGradient
|
||||
id="_Linear1"
|
||||
x1="0"
|
||||
y1="0"
|
||||
x2="1"
|
||||
y2="0"
|
||||
gradientUnits="userSpaceOnUse"
|
||||
gradientTransform="matrix(-14.8673,-14.7971,14.7971,-14.8673,20.4244,16.9042)"
|
||||
>
|
||||
<stop offset="0" style="stop-color: rgb(239, 65, 54); stop-opacity: 1" />
|
||||
<stop offset="0.01" style="stop-color: rgb(239, 65, 54); stop-opacity: 1" />
|
||||
<stop offset="0.32" style="stop-color: rgb(223, 81, 83); stop-opacity: 1" />
|
||||
<stop offset="1" style="stop-color: rgb(172, 11, 27); stop-opacity: 1" />
|
||||
</linearGradient>
|
||||
</defs>
|
||||
<svg width="100%" height="100%" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip-rule:evenodd;">
|
||||
<path d="M12.985,0.812C13.949,0.812 14.279,0.928 14.929,1.155C15.091,1.211 15.273,1.275 15.49,1.345C19.947,2.795 23.25,7.071 23.25,12.005C23.25,12.829 23.133,13.721 22.963,14.506C22.196,17.622 20.213,20.269 17.543,21.804C16.213,22.568 14.67,23.131 13.068,23.239C12.8,23.257 11.93,23.249 11.339,23.243C11.126,23.241 10.95,23.239 10.85,23.239C5.061,22.419 0.75,18.142 0.75,12.005C0.75,10.447 1.047,8.887 1.653,7.454C2.282,5.968 3.362,4.699 4.486,3.6C5.476,2.634 6.7,2.1 7.906,1.574C8.081,1.498 8.255,1.422 8.428,1.345C9.05,1.068 9.469,1.008 9.996,0.932C10.214,0.9 10.45,0.866 10.727,0.812C11.214,0.719 11.726,0.75 12.234,0.781C12.486,0.797 12.738,0.812 12.985,0.812Z" style="fill:url(#_Linear1);fill-rule:nonzero;"/>
|
||||
<path d="M12.985,0.812C13.949,0.812 14.279,0.928 14.929,1.155C15.091,1.211 15.273,1.275 15.49,1.345C19.947,2.795 23.25,7.071 23.25,12.005C23.25,12.829 23.133,13.721 22.963,14.506C22.196,17.622 20.213,20.269 17.543,21.804C16.213,22.568 14.67,23.131 13.068,23.239C12.8,23.257 11.93,23.249 11.339,23.243C11.126,23.241 10.95,23.239 10.85,23.239C5.061,22.419 0.75,18.142 0.75,12.005C0.75,10.447 1.047,8.887 1.653,7.454C2.282,5.968 3.362,4.699 4.486,3.6C5.476,2.634 6.7,2.1 7.906,1.574C8.081,1.498 8.255,1.422 8.428,1.345C9.05,1.068 9.469,1.008 9.996,0.932C10.214,0.9 10.45,0.866 10.727,0.812C11.214,0.719 11.726,0.75 12.234,0.781C12.486,0.797 12.738,0.812 12.985,0.812Z" style="fill:none;fill-rule:nonzero;stroke:white;stroke-width:1px;"/>
|
||||
<path d="M11.999,0.166L15.656,0.746L18.955,2.426L21.573,5.044L23.254,8.342L23.834,11.999L23.254,15.656L21.573,18.955L18.955,21.573L15.656,23.254L11.999,23.834L8.343,23.254L5.044,21.573L2.426,18.955L0.746,15.656L0.166,11.999L0.746,8.343L2.426,5.044L5.044,2.426L8.343,0.746L11.999,0.166ZM8.549,1.381L5.436,2.966L2.967,5.436L1.381,8.549L0.834,11.999L1.381,15.45L2.967,18.562L5.436,21.032L8.549,22.619L11.999,23.166L15.45,22.619L18.562,21.032L21.032,18.562L22.619,15.45L23.166,11.999L22.619,8.549L21.032,5.436L18.562,2.966L15.45,1.381L11.999,0.834L8.549,1.381Z" style="fill:white;"/>
|
||||
<path d="M11.915,3.928C11.993,3.881 12.094,3.907 12.141,3.985L14.738,8.343C14.785,8.421 14.759,8.523 14.681,8.569C14.603,8.616 14.501,8.59 14.455,8.512L11.857,4.154C11.811,4.076 11.836,3.975 11.915,3.928Z" style="fill:white;"/>
|
||||
<path d="M11.999,3.904L17.36,4.484L17.325,4.812L11.999,4.236L6.674,4.812L6.639,4.484L11.999,3.904Z" style="fill:white;"/>
|
||||
<path d="M9.237,8.426C9.237,8.334 9.311,8.261 9.402,8.261L14.596,8.261C14.687,8.261 14.761,8.334 14.761,8.426C14.761,8.517 14.687,8.591 14.596,8.591L9.402,8.591C9.311,8.591 9.237,8.517 9.237,8.426Z" style="fill:white;"/>
|
||||
<path d="M12.083,3.928C12.161,3.975 12.187,4.076 12.14,4.154L9.544,8.512C9.497,8.59 9.396,8.616 9.318,8.569C9.24,8.523 9.214,8.421 9.261,8.343L11.857,3.985C11.903,3.907 12.004,3.881 12.083,3.928Z" style="fill:white;"/>
|
||||
<path d="M8.392,0.803L11.999,3.853L15.606,0.803L17.49,4.573L17.195,4.721L15.499,1.326L11.999,4.285L8.499,1.326L6.804,4.721L6.509,4.573L8.392,0.803Z" style="fill:white;"/>
|
||||
<path d="M5.143,2.563C5.217,2.509 5.32,2.525 5.374,2.599L11.999,11.719L18.625,2.599C18.679,2.525 18.782,2.509 18.856,2.563C18.929,2.616 18.946,2.719 18.892,2.793L12.133,12.097C12.102,12.14 12.052,12.165 11.999,12.165C11.947,12.165 11.897,12.14 11.866,12.097L5.107,2.793C5.053,2.719 5.07,2.616 5.143,2.563Z" style="fill:white;"/>
|
||||
<path d="M9.525,8.314C9.565,8.358 9.578,8.42 9.56,8.476L7.992,13.303L12.081,16.274L16.727,18.266C16.811,18.302 16.85,18.399 16.814,18.482C16.778,18.566 16.681,18.605 16.597,18.569L11.934,16.57C11.923,16.565 11.912,16.559 11.902,16.552L7.701,13.499C7.643,13.457 7.619,13.383 7.641,13.315L9.156,8.651L4.493,9.709C4.404,9.729 4.315,9.674 4.295,9.585C4.275,9.496 4.331,9.408 4.42,9.387L9.367,8.265C9.424,8.251 9.485,8.27 9.525,8.314Z" style="fill:white;"/>
|
||||
<path d="M4.347,9.426C4.416,9.366 4.52,9.373 4.58,9.442L7.922,13.259C7.982,13.328 7.975,13.432 7.907,13.492C7.838,13.552 7.734,13.545 7.674,13.477L4.332,9.659C4.272,9.591 4.279,9.486 4.347,9.426Z" style="fill:white;"/>
|
||||
<path d="M6.931,4.439L4.635,9.553L4.661,9.616L4.603,9.652L3.534,14.751L7.435,18.284L12.078,20.948L15.442,22.696L16.535,18.244L21.105,18.581L20.481,14.837L20.807,14.783L21.499,18.941L16.789,18.593L15.662,23.182L11.917,21.236L7.24,18.553L3.238,14.928L0.234,11.971L4.25,9.483L2.464,5.109L6.931,4.439ZM4.215,9.893L0.765,12.03L3.254,14.48L4.215,9.893ZM4.463,9.131L6.382,4.855L2.928,5.373L4.463,9.131Z" style="fill:white;"/>
|
||||
<path d="M7.814,13.202C7.904,13.211 7.971,13.291 7.963,13.382L7.502,18.433C7.494,18.524 7.414,18.591 7.323,18.583C7.232,18.574 7.165,18.494 7.174,18.403L7.634,13.352C7.642,13.261 7.723,13.194 7.814,13.202Z" style="fill:white;"/>
|
||||
<path d="M12.151,16.353C12.187,16.436 12.148,16.533 12.065,16.569L7.403,18.569C7.319,18.604 7.222,18.566 7.186,18.482C7.15,18.398 7.189,18.301 7.273,18.265L11.935,16.266C12.018,16.23 12.115,16.269 12.151,16.353Z" style="fill:white;"/>
|
||||
<path d="M2.893,18.581L3.517,14.837L3.191,14.783L2.499,18.941L7.211,18.594L8.336,23.182L12.075,21.24L11.923,20.947L8.556,22.696L7.465,18.244L2.893,18.581Z" style="fill:white;"/>
|
||||
<path d="M12.097,11.865C12.14,11.896 12.165,11.946 12.165,11.998L12.165,23.5C12.165,23.591 12.091,23.665 12,23.665C11.909,23.665 11.835,23.591 11.835,23.5L11.835,12.226L1.115,15.709C1.029,15.737 0.936,15.69 0.908,15.603C0.879,15.517 0.927,15.423 1.013,15.395L11.949,11.842C11.999,11.825 12.054,11.834 12.097,11.865Z" style="fill:white;"/>
|
||||
<path d="M17.212,4.547C17.248,4.499 17.308,4.475 17.368,4.484L21.327,5.078C21.377,5.085 21.421,5.115 21.446,5.159C21.471,5.203 21.474,5.256 21.455,5.303L19.749,9.483L23.587,11.861C23.63,11.887 23.658,11.932 23.664,11.982C23.669,12.033 23.652,12.083 23.616,12.118L20.762,14.926L20.756,14.932L20.755,14.932C20.755,14.933 20.754,14.934 20.753,14.934L16.773,18.541C16.727,18.583 16.661,18.595 16.602,18.572C16.544,18.55 16.504,18.496 16.498,18.434L16.039,13.4L14.44,8.478C14.421,8.421 14.435,8.359 14.475,8.315C14.515,8.272 14.575,8.253 14.633,8.266L19.258,9.315L17.193,4.715C17.168,4.659 17.175,4.595 17.212,4.547ZM19.237,9.649L14.843,8.652L16.269,13.04L19.237,9.649ZM16.372,13.422L16.797,18.074L20.464,14.751L19.45,9.907L16.372,13.422ZM19.784,9.893L20.744,14.48L23.234,12.03L19.784,9.893ZM19.536,9.13L21.07,5.373L17.617,4.855L19.536,9.13Z" style="fill:white;"/>
|
||||
<path d="M11.842,11.947C11.87,11.861 11.963,11.813 12.05,11.842L22.987,15.395C23.074,15.423 23.121,15.517 23.093,15.603C23.065,15.69 22.972,15.737 22.885,15.709L11.948,12.155C11.861,12.127 11.814,12.034 11.842,11.947Z" style="fill:white;"/>
|
||||
<path d="M16.335,13.27C16.389,13.343 16.372,13.447 16.298,13.5L12.096,16.552C12.022,16.606 11.919,16.59 11.866,16.516C11.812,16.442 11.828,16.339 11.902,16.285L16.104,13.233C16.178,13.18 16.281,13.196 16.335,13.27Z" style="fill:white;"/>
|
||||
<path d="M16.58,18.276C16.653,18.234 16.746,18.254 16.796,18.322L18.892,21.208C18.945,21.282 18.929,21.385 18.855,21.439C18.782,21.492 18.678,21.476 18.625,21.402L16.616,18.636L12.081,21.237C12.002,21.282 11.901,21.255 11.856,21.176C11.81,21.097 11.838,20.996 11.917,20.951L16.58,18.276Z" style="fill:white;"/>
|
||||
<path d="M11.999,0.335C12.09,0.335 12.164,0.409 12.164,0.5L12.164,4.068C12.164,4.159 12.09,4.233 11.999,4.233C11.908,4.233 11.834,4.159 11.834,4.068L11.834,0.5C11.834,0.409 11.908,0.335 11.999,0.335Z" style="fill:white;"/>
|
||||
<path d="M23.093,8.396C23.121,8.483 23.073,8.576 22.987,8.604L19.594,9.706C19.507,9.735 19.414,9.687 19.386,9.601C19.358,9.514 19.405,9.421 19.492,9.393L22.885,8.29C22.971,8.262 23.064,8.309 23.093,8.396Z" style="fill:white;"/>
|
||||
<path d="M7.435,18.286C7.509,18.34 7.525,18.443 7.471,18.516L5.374,21.402C5.32,21.476 5.217,21.492 5.143,21.439C5.069,21.385 5.053,21.282 5.107,21.208L7.204,18.322C7.258,18.249 7.361,18.232 7.435,18.286Z" style="fill:white;"/>
|
||||
<path d="M0.908,8.396C0.936,8.309 1.029,8.262 1.115,8.29L4.508,9.393C4.595,9.421 4.642,9.514 4.614,9.601C4.586,9.687 4.493,9.735 4.406,9.706L1.013,8.604C0.927,8.576 0.879,8.483 0.908,8.396Z" style="fill:white;"/>
|
||||
<defs>
|
||||
<linearGradient id="_Linear1" x1="0" y1="0" x2="1" y2="0" gradientUnits="userSpaceOnUse" gradientTransform="matrix(-14.8673,-14.7971,14.7971,-14.8673,20.4244,16.9042)"><stop offset="0" style="stop-color:rgb(239,65,54);stop-opacity:1"/><stop offset="0.01" style="stop-color:rgb(239,65,54);stop-opacity:1"/><stop offset="0.32" style="stop-color:rgb(223,81,83);stop-opacity:1"/><stop offset="1" style="stop-color:rgb(172,11,27);stop-opacity:1"/></linearGradient>
|
||||
</defs>
|
||||
</svg>
|
||||
|
||||
|
Before Width: | Height: | Size: 8.7 KiB After Width: | Height: | Size: 8.6 KiB |
@ -1,41 +0,0 @@
|
||||
<svg viewBox="0 0 200 200" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<mask
|
||||
id="mask0_1016_8"
|
||||
style="mask-type: alpha"
|
||||
maskUnits="userSpaceOnUse"
|
||||
x="0"
|
||||
y="0"
|
||||
width="200"
|
||||
height="200"
|
||||
>
|
||||
<circle cx="100" cy="100" r="100" fill="#D9D9D9" />
|
||||
</mask>
|
||||
<g mask="url(#mask0_1016_8)">
|
||||
<path d="M200 0H0V200H200V0Z" fill="url(#paint0_radial_1016_8)" />
|
||||
<path
|
||||
fill-rule="evenodd"
|
||||
clip-rule="evenodd"
|
||||
d="M17 100C17 54.1604 54.1604 17 100 17C145.84 17 183 54.1604 183 100C183 145.84 145.84 183 100 183C54.1604 183 17 145.84 17 100ZM35.9934 70.1292C35.7605 69.0522 34.2896 68.8451 33.8321 69.8475C29.6396 79.0329 27.3034 89.2436 27.3034 100C27.3034 110.756 29.6395 120.967 33.8321 130.152C34.2896 131.155 35.7646 130.946 36.0113 129.872C36.7592 126.616 37.8122 123.265 39.1296 119.865C46.1201 101.826 58.4843 85.6661 72.0752 72.0752C77.7197 66.4307 83.5473 61.3328 89.398 56.8477C90.0458 56.3511 89.9903 55.355 89.2818 54.9498C84.8395 52.4091 80.5176 50.328 76.4118 48.7369C69.6362 46.1112 63.6826 44.9107 58.8762 45.0133C54.1054 45.1152 50.7932 46.4757 48.6345 48.6344C46.23 51.0389 44.8034 54.9033 45.0307 60.5995C45.2441 65.9507 46.9226 72.4804 50.1278 79.7726C50.5169 80.6578 50.3294 81.6944 49.6393 82.3716L45.0105 87.3236C43.9702 88.3445 42.2606 88.1407 41.6138 86.8345C39.236 82.0323 37.0957 75.2258 35.9934 70.1292ZM69.8476 33.832C68.8452 34.2896 69.0539 35.7646 70.1279 36.0113C73.3837 36.7591 76.7352 37.8122 80.1348 39.1296C95.2954 45.0046 112.35 56.5003 127.925 72.0752C132.56 76.7098 137.571 85.0812 139.074 94.9299C139.238 96.0021 140.672 96.3736 141.265 95.4651C145.577 88.8521 148.942 82.402 151.263 76.4117C153.889 69.6362 155.089 63.6826 154.987 58.8761C154.885 54.1054 153.524 50.7932 151.366 48.6344C148.907 46.1759 144.657 44.6798 138.75 44.9907C133.226 45.2815 127.994 46.6016 120.702 49.9344C119.733 50.3773 118.597 50.2673 117.745 49.6276L112.297 45.4006C111.335 44.6781 111.397 43.2145 112.428 42.5945C118.524 38.9293 123.663 36.6594 128.563 35.7699C129.744 35.5554 130.094 33.7945 128.993 33.3153C120.111 29.448 110.306 27.3034 100 27.3034C89.2437 27.3034 79.033 29.6395 69.8476 33.832ZM120.617 120.661C131.639 109.325 132.032 90.7538 120.639 79.3608C116.409 75.131 112.092 71.2466 107.765 67.7333C103.229 64.0492 96.7712 64.0493 92.2349 67.7333C87.9021 71.2521 83.5841 75.1376 79.3608 79.3608C68.5831 90.1385 68.3317 107.296 77.8289 118.936C88.3068 131.778 108.966 132.271 120.617 120.661ZM104.999 139.012C103.917 139.162 103.531 140.608 104.445 141.206C111.09 145.547 117.571 148.931 123.588 151.263C130.364 153.889 136.318 155.089 141.124 154.987C145.895 154.885 149.207 153.524 151.366 151.366C153.77 148.961 155.197 145.097 154.969 139.401C154.758 134.088 153.117 127.729 149.959 120.517C149.521 119.517 149.664 118.353 150.352 117.506L155.226 111.506C155.948 110.618 157.319 110.673 157.903 111.656C161.275 117.325 163.21 124.157 164.129 129.394C164.326 130.52 165.886 130.784 166.354 129.742C170.429 120.663 172.697 110.596 172.697 100C172.697 89.2437 170.36 79.0331 166.168 69.8477C165.71 68.8453 164.235 69.054 163.989 70.128C163.241 73.3838 162.188 76.7352 160.871 80.1347C154.995 95.2954 143.5 112.35 127.925 127.925C121.9 133.95 113.488 137.837 104.999 139.012ZM130.152 166.168C131.155 165.71 130.946 164.235 129.872 163.989C126.616 163.241 123.265 162.188 119.865 160.87C104.705 154.995 87.6501 143.5 72.0752 127.925C67.2172 123.067 62.3556 114.804 60.909 105.103C60.7487 104.028 59.3109 103.652 58.7174 104.563C54.4133 111.166 51.055 117.606 48.7369 123.588C46.1113 130.364 44.9107 136.317 45.0134 141.124C45.1153 145.895 46.4757 149.207 48.6345 151.366C51.0118 153.743 54.8134 155.163 60.4045 154.977C65.6245 154.802 71.9888 153.219 79.1074 150.161C80.0901 149.739 81.2281 149.874 82.0681 150.536L87.2306 154.604C88.1576 155.335 88.0866 156.759 87.0628 157.346C81.4234 160.58 75.1058 162.779 70.1222 163.969C69.0505 164.225 68.8452 165.71 69.8477 166.168C79.033 170.36 89.2437 172.697 100 172.697C110.756 172.697 120.967 170.36 130.152 166.168Z"
|
||||
fill="white"
|
||||
/>
|
||||
<path
|
||||
d="M96.8811 80.4348C96.9279 80.3934 96.9716 80.3529 97.0177 80.3108C98.8427 78.6433 101.651 78.6734 103.44 80.3821C103.478 80.4186 103.514 80.4531 103.553 80.4891C104.165 81.058 109.693 86.2109 112.922 89.7439C116.226 93.7887 116.944 99.7632 114.716 104.672C108.586 118.18 91.6728 118.309 85.3654 104.906C83.0057 99.8927 83.755 93.7116 87.2225 89.6184C89.839 86.6809 96.1575 81.0748 96.8811 80.4348Z"
|
||||
fill="white"
|
||||
/>
|
||||
</g>
|
||||
<defs>
|
||||
<radialGradient
|
||||
id="paint0_radial_1016_8"
|
||||
cx="0"
|
||||
cy="0"
|
||||
r="1"
|
||||
gradientUnits="userSpaceOnUse"
|
||||
gradientTransform="translate(200 -4.5) rotate(134.363) scale(286.042 191.372)"
|
||||
>
|
||||
<stop stop-color="#5278FF" />
|
||||
<stop offset="0.361196" stop-color="#BE7CFF" />
|
||||
<stop offset="0.756992" stop-color="#E69EFE" />
|
||||
<stop offset="1" stop-color="#F7D4F5" />
|
||||
</radialGradient>
|
||||
</defs>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 4.9 KiB |
@ -1,340 +1,340 @@
|
||||
<svg version="1.1" fill="none" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
|
||||
<svg fill='none' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'>
|
||||
<path
|
||||
d="M22.8084 4.42014C22.5667 3.50503 21.7897 2.58992 20.3912 1.57122C19.2689 0.759705 18.0775 0.293518 17.1279 0.293518C16.9379 0.293518 16.7653 0.310784 16.5926 0.345317C16.1609 0.431648 15.7811 0.742439 15.5394 1.20863C15.2458 1.76114 15.1768 2.50359 15.3667 2.95251C15.4358 3.09064 15.5221 3.2633 15.6257 3.4187C14.7106 3.97122 14.1926 4.12661 14.1235 4.14388C16.5063 4.93812 18.4919 6.59568 19.735 8.75395L19.7523 8.54676C19.8041 7.97697 19.9768 7.32086 20.2185 6.64748C20.4602 6.71654 20.702 6.75107 20.9437 6.75107C21.5825 6.75107 22.135 6.49208 22.4804 6.02589C22.8257 5.55971 22.9638 4.93812 22.8084 4.42014Z"
|
||||
fill="#5E12A0"
|
||||
d='M22.8084 4.42014C22.5667 3.50503 21.7897 2.58992 20.3912 1.57122C19.2689 0.759705 18.0775 0.293518 17.1279 0.293518C16.9379 0.293518 16.7653 0.310784 16.5926 0.345317C16.1609 0.431648 15.7811 0.742439 15.5394 1.20863C15.2458 1.76114 15.1768 2.50359 15.3667 2.95251C15.4358 3.09064 15.5221 3.2633 15.6257 3.4187C14.7106 3.97122 14.1926 4.12661 14.1235 4.14388C16.5063 4.93812 18.4919 6.59568 19.735 8.75395L19.7523 8.54676C19.8041 7.97697 19.9768 7.32086 20.2185 6.64748C20.4602 6.71654 20.702 6.75107 20.9437 6.75107C21.5825 6.75107 22.135 6.49208 22.4804 6.02589C22.8257 5.55971 22.9638 4.93812 22.8084 4.42014Z'
|
||||
fill='#5E12A0'
|
||||
></path>
|
||||
<path
|
||||
d="M20.3225 6.14679C21.8937 6.57844 22.5326 5.36981 22.3254 4.5583C22.1009 3.74679 21.3757 2.91801 20.098 1.98564C18.8203 1.05326 17.5254 0.673409 16.6966 0.846071C15.8678 1.01873 15.6261 2.27916 15.8333 2.76262C15.9196 2.95255 16.1096 3.2288 16.3685 3.5396C16.0405 3.76406 15.7297 3.93672 15.4707 4.09211C17.0592 4.80003 18.4405 5.90506 19.4765 7.28636C19.5973 6.82017 19.77 6.40578 19.9254 6.04319C20.0462 6.06046 20.1844 6.09499 20.3225 6.14679Z"
|
||||
fill="url(#paint0_radial_8766_48743)"
|
||||
d='M20.3225 6.14679C21.8937 6.57844 22.5326 5.36981 22.3254 4.5583C22.1009 3.74679 21.3757 2.91801 20.098 1.98564C18.8203 1.05326 17.5254 0.673409 16.6966 0.846071C15.8678 1.01873 15.6261 2.27916 15.8333 2.76262C15.9196 2.95255 16.1096 3.2288 16.3685 3.5396C16.0405 3.76406 15.7297 3.93672 15.4707 4.09211C17.0592 4.80003 18.4405 5.90506 19.4765 7.28636C19.5973 6.82017 19.77 6.40578 19.9254 6.04319C20.0462 6.06046 20.1844 6.09499 20.3225 6.14679Z'
|
||||
fill='url(#paint0_radial_8766_48743)'
|
||||
></path>
|
||||
<path
|
||||
d="M11.3266 23.0676C16.6572 23.0676 20.9784 18.7464 20.9784 13.4158C20.9784 8.08525 16.6572 3.76404 11.3266 3.76404C5.99601 3.76404 1.6748 8.08525 1.6748 13.4158C1.6748 18.7464 5.99601 23.0676 11.3266 23.0676Z"
|
||||
fill="url(#paint1_radial_8766_48743)"
|
||||
d='M11.3266 23.0676C16.6572 23.0676 20.9784 18.7464 20.9784 13.4158C20.9784 8.08525 16.6572 3.76404 11.3266 3.76404C5.99601 3.76404 1.6748 8.08525 1.6748 13.4158C1.6748 18.7464 5.99601 23.0676 11.3266 23.0676Z'
|
||||
fill='url(#paint1_radial_8766_48743)'
|
||||
></path>
|
||||
<path
|
||||
d="M21.5307 3.76403C20.2185 2.38274 19.1134 2.02015 17.784 1.72662C16.748 1.4849 17.0242 0.897845 18.2847 1.01871C17.6804 0.811514 17.1106 0.759716 16.6962 0.846047C15.8674 1.01871 15.6257 2.27914 15.8329 2.76259C15.9192 2.95252 16.1091 3.22878 16.3681 3.53957C15.9019 3.85036 15.5048 4.07482 15.1768 4.24749C15.3322 4.31655 15.5221 4.40288 15.7465 4.52375C16.3336 4.83454 16.9724 5.35252 16.9724 5.35252C16.0055 4.52375 16.2127 4.14389 17.5422 3.21151C17.9566 2.91799 18.7163 2.95252 19.4242 3.31511C20.1322 3.6777 20.9609 4.59281 20.9609 4.59281L20.1667 6.11223C20.2185 6.1295 20.2703 6.14677 20.3221 6.16403C20.8228 6.30216 21.2199 6.26763 21.5307 6.14677C21.8933 5.92231 22.8429 5.16259 21.5307 3.76403Z"
|
||||
fill="#A98698"
|
||||
fill-opacity="0.6"
|
||||
d='M21.5307 3.76403C20.2185 2.38274 19.1134 2.02015 17.784 1.72662C16.748 1.4849 17.0242 0.897845 18.2847 1.01871C17.6804 0.811514 17.1106 0.759716 16.6962 0.846047C15.8674 1.01871 15.6257 2.27914 15.8329 2.76259C15.9192 2.95252 16.1091 3.22878 16.3681 3.53957C15.9019 3.85036 15.5048 4.07482 15.1768 4.24749C15.3322 4.31655 15.5221 4.40288 15.7465 4.52375C16.3336 4.83454 16.9724 5.35252 16.9724 5.35252C16.0055 4.52375 16.2127 4.14389 17.5422 3.21151C17.9566 2.91799 18.7163 2.95252 19.4242 3.31511C20.1322 3.6777 20.9609 4.59281 20.9609 4.59281L20.1667 6.11223C20.2185 6.1295 20.2703 6.14677 20.3221 6.16403C20.8228 6.30216 21.2199 6.26763 21.5307 6.14677C21.8933 5.92231 22.8429 5.16259 21.5307 3.76403Z'
|
||||
fill='#A98698'
|
||||
fill-opacity='0.6'
|
||||
></path>
|
||||
<path
|
||||
d="M17.7671 2.55539C18.1124 2.69352 18.5613 2.93525 19.1138 3.29784C19.7699 3.72949 20.3397 4.21295 20.7023 4.5928C20.098 5.38705 19.7009 6.47482 19.4592 7.23453C19.58 7.40719 19.7181 7.57985 19.839 7.75252C19.9599 7.32086 20.1671 6.68201 20.4433 6.04316C20.5124 6.06043 20.5987 6.06043 20.6851 6.06043C20.8922 6.06043 21.134 6.0259 21.3239 5.8705C21.462 5.7669 21.6174 5.57698 21.6002 5.23165C21.6002 4.90359 21.3412 4.48921 20.8059 3.98849C20.4261 3.6259 19.9081 3.22878 19.3901 2.86619C17.9052 1.88201 16.8692 1.60575 16.403 2.07194C16.0922 2.38273 16.1268 2.76259 16.2304 3.03885C15.6779 3.40144 15.2117 3.66043 14.9009 3.83309C15.1081 3.90216 15.298 3.98849 15.5052 4.07482C16.0577 3.78129 16.852 3.28057 17.7671 2.55539ZM21.0304 5.02446C21.0822 5.11079 21.0994 5.19712 21.0994 5.24892C21.0994 5.40431 21.0476 5.45611 21.0131 5.49065C20.944 5.54244 20.8059 5.57698 20.6851 5.57698C20.7886 5.36978 20.9095 5.19712 21.0304 5.02446ZM16.7656 2.4518C16.8174 2.4 16.9556 2.36547 17.18 2.4C17.0074 2.53813 16.8347 2.65899 16.662 2.77985C16.6448 2.65899 16.662 2.53813 16.7656 2.4518Z"
|
||||
fill="#5E12A0"
|
||||
d='M17.7671 2.55539C18.1124 2.69352 18.5613 2.93525 19.1138 3.29784C19.7699 3.72949 20.3397 4.21295 20.7023 4.5928C20.098 5.38705 19.7009 6.47482 19.4592 7.23453C19.58 7.40719 19.7181 7.57985 19.839 7.75252C19.9599 7.32086 20.1671 6.68201 20.4433 6.04316C20.5124 6.06043 20.5987 6.06043 20.6851 6.06043C20.8922 6.06043 21.134 6.0259 21.3239 5.8705C21.462 5.7669 21.6174 5.57698 21.6002 5.23165C21.6002 4.90359 21.3412 4.48921 20.8059 3.98849C20.4261 3.6259 19.9081 3.22878 19.3901 2.86619C17.9052 1.88201 16.8692 1.60575 16.403 2.07194C16.0922 2.38273 16.1268 2.76259 16.2304 3.03885C15.6779 3.40144 15.2117 3.66043 14.9009 3.83309C15.1081 3.90216 15.298 3.98849 15.5052 4.07482C16.0577 3.78129 16.852 3.28057 17.7671 2.55539ZM21.0304 5.02446C21.0822 5.11079 21.0994 5.19712 21.0994 5.24892C21.0994 5.40431 21.0476 5.45611 21.0131 5.49065C20.944 5.54244 20.8059 5.57698 20.6851 5.57698C20.7886 5.36978 20.9095 5.19712 21.0304 5.02446ZM16.7656 2.4518C16.8174 2.4 16.9556 2.36547 17.18 2.4C17.0074 2.53813 16.8347 2.65899 16.662 2.77985C16.6448 2.65899 16.662 2.53813 16.7656 2.4518Z'
|
||||
fill='#5E12A0'
|
||||
></path>
|
||||
<path
|
||||
d="M11.3266 3.19427C5.68052 3.19427 1.10498 7.76981 1.10498 13.4159C1.10498 19.0619 5.68052 23.6374 11.3266 23.6374C16.9726 23.6374 21.5481 19.0619 21.5481 13.4159C21.5481 7.76981 16.9553 3.19427 11.3266 3.19427ZM11.3266 23.0677C5.99131 23.0677 1.67476 18.7511 1.67476 13.4159C1.67476 8.08061 5.99131 3.76406 11.3266 3.76406C16.6618 3.76406 20.9784 8.08061 20.9784 13.4159C20.9784 18.7511 16.6445 23.0677 11.3266 23.0677Z"
|
||||
fill="#5E12A0"
|
||||
d='M11.3266 3.19427C5.68052 3.19427 1.10498 7.76981 1.10498 13.4159C1.10498 19.0619 5.68052 23.6374 11.3266 23.6374C16.9726 23.6374 21.5481 19.0619 21.5481 13.4159C21.5481 7.76981 16.9553 3.19427 11.3266 3.19427ZM11.3266 23.0677C5.99131 23.0677 1.67476 18.7511 1.67476 13.4159C1.67476 8.08061 5.99131 3.76406 11.3266 3.76406C16.6618 3.76406 20.9784 8.08061 20.9784 13.4159C20.9784 18.7511 16.6445 23.0677 11.3266 23.0677Z'
|
||||
fill='#5E12A0'
|
||||
></path>
|
||||
<path
|
||||
d="M11.3266 23.0676C16.6572 23.0676 20.9784 18.7464 20.9784 13.4158C20.9784 8.08525 16.6572 3.76404 11.3266 3.76404C5.99601 3.76404 1.6748 8.08525 1.6748 13.4158C1.6748 18.7464 5.99601 23.0676 11.3266 23.0676Z"
|
||||
fill="url(#paint2_linear_8766_48743)"
|
||||
d='M11.3266 23.0676C16.6572 23.0676 20.9784 18.7464 20.9784 13.4158C20.9784 8.08525 16.6572 3.76404 11.3266 3.76404C5.99601 3.76404 1.6748 8.08525 1.6748 13.4158C1.6748 18.7464 5.99601 23.0676 11.3266 23.0676Z'
|
||||
fill='url(#paint2_linear_8766_48743)'
|
||||
></path>
|
||||
<path
|
||||
d="M11.2577 21.8935C5.99153 21.0475 2.41743 16.0921 3.28074 10.8259C3.6606 8.49494 4.8347 6.50933 6.49225 5.07623C4.07499 6.47479 2.2793 8.90933 1.79585 11.8791C0.949806 17.1453 4.52391 22.1007 9.77283 22.9467C12.7081 23.4302 15.5397 22.5151 17.6289 20.7194C15.7815 21.7899 13.5369 22.2561 11.2577 21.8935Z"
|
||||
fill="#A98698"
|
||||
fill-opacity="0.6"
|
||||
d='M11.2577 21.8935C5.99153 21.0475 2.41743 16.0921 3.28074 10.8259C3.6606 8.49494 4.8347 6.50933 6.49225 5.07623C4.07499 6.47479 2.2793 8.90933 1.79585 11.8791C0.949806 17.1453 4.52391 22.1007 9.77283 22.9467C12.7081 23.4302 15.5397 22.5151 17.6289 20.7194C15.7815 21.7899 13.5369 22.2561 11.2577 21.8935Z'
|
||||
fill='#A98698'
|
||||
fill-opacity='0.6'
|
||||
></path>
|
||||
<path
|
||||
d="M12.8631 3.90216C10.4285 3.50504 8.06307 4.05756 6.12926 5.28346C6.09473 5.31799 6.0602 5.35252 6.0602 5.35252C6.80264 4.9036 7.89041 4.50648 7.89041 4.50648C5.09329 6.1295 4.22998 7.97698 4.22998 7.97698C5.31775 5.87051 8.51199 4.38562 11.0156 4.28202C13.5192 4.17842 15.1595 4.92087 17.1624 6.52662C19.1652 8.14964 20.3739 11.4648 20.253 14.0892C20.1494 16.7137 18.7681 18.8374 18.7681 18.8374C19.7177 17.6115 20.2875 16.7137 20.6501 15.7986C20.7192 15.5223 20.7883 15.246 20.8228 14.9525C21.6861 9.7036 18.1293 4.74821 12.8631 3.90216Z"
|
||||
fill="url(#paint3_linear_8766_48743)"
|
||||
d='M12.8631 3.90216C10.4285 3.50504 8.06307 4.05756 6.12926 5.28346C6.09473 5.31799 6.0602 5.35252 6.0602 5.35252C6.80264 4.9036 7.89041 4.50648 7.89041 4.50648C5.09329 6.1295 4.22998 7.97698 4.22998 7.97698C5.31775 5.87051 8.51199 4.38562 11.0156 4.28202C13.5192 4.17842 15.1595 4.92087 17.1624 6.52662C19.1652 8.14964 20.3739 11.4648 20.253 14.0892C20.1494 16.7137 18.7681 18.8374 18.7681 18.8374C19.7177 17.6115 20.2875 16.7137 20.6501 15.7986C20.7192 15.5223 20.7883 15.246 20.8228 14.9525C21.6861 9.7036 18.1293 4.74821 12.8631 3.90216Z'
|
||||
fill='url(#paint3_linear_8766_48743)'
|
||||
></path>
|
||||
<path
|
||||
d="M20.4951 13.3295C20.4951 18.3885 16.3857 22.4978 11.3267 22.4978C6.26773 22.4978 2.14111 18.3885 2.14111 13.3295H20.4951Z"
|
||||
fill="url(#paint4_linear_8766_48743)"
|
||||
d='M20.4951 13.3295C20.4951 18.3885 16.3857 22.4978 11.3267 22.4978C6.26773 22.4978 2.14111 18.3885 2.14111 13.3295H20.4951Z'
|
||||
fill='url(#paint4_linear_8766_48743)'
|
||||
></path>
|
||||
<path
|
||||
d="M19.7696 13.3295C19.7696 18.2676 15.8675 22.3079 10.9639 22.4978H11.3265C16.3855 22.4978 20.4948 18.3885 20.4948 13.3295H19.7696Z"
|
||||
fill="url(#paint5_linear_8766_48743)"
|
||||
d='M19.7696 13.3295C19.7696 18.2676 15.8675 22.3079 10.9639 22.4978H11.3265C16.3855 22.4978 20.4948 18.3885 20.4948 13.3295H19.7696Z'
|
||||
fill='url(#paint5_linear_8766_48743)'
|
||||
></path>
|
||||
<path
|
||||
d="M3.43608 13.3295H2.14111C2.14111 18.3885 6.25047 22.4978 11.3095 22.4978C11.5339 22.4978 11.7411 22.4978 11.9483 22.4805C7.20011 22.1352 3.43608 18.164 3.43608 13.3295Z"
|
||||
fill="url(#paint6_linear_8766_48743)"
|
||||
d='M3.43608 13.3295H2.14111C2.14111 18.3885 6.25047 22.4978 11.3095 22.4978C11.5339 22.4978 11.7411 22.4978 11.9483 22.4805C7.20011 22.1352 3.43608 18.164 3.43608 13.3295Z'
|
||||
fill='url(#paint6_linear_8766_48743)'
|
||||
></path>
|
||||
<path
|
||||
d="M20.4778 13.4158C20.4778 12.3626 18.6476 11.7583 16.2131 11.5511C14.4519 11.413 12.6735 11.5856 10.6361 12.2072C8.87493 12.7252 7.28644 12.6389 6.1296 12.5007C3.55694 12.2072 2.14111 12.1727 2.14111 13.4158C2.14111 15.2115 5.80155 17.4561 11.2922 16.6792C14.072 16.282 15.5051 15.4705 17.1454 14.918C18.9238 14.331 20.4778 14.3482 20.4778 13.4158Z"
|
||||
fill="url(#paint7_linear_8766_48743)"
|
||||
d='M20.4778 13.4158C20.4778 12.3626 18.6476 11.7583 16.2131 11.5511C14.4519 11.413 12.6735 11.5856 10.6361 12.2072C8.87493 12.7252 7.28644 12.6389 6.1296 12.5007C3.55694 12.2072 2.14111 12.1727 2.14111 13.4158C2.14111 15.2115 5.80155 17.4561 11.2922 16.6792C14.072 16.282 15.5051 15.4705 17.1454 14.918C18.9238 14.331 20.4778 14.3482 20.4778 13.4158Z'
|
||||
fill='url(#paint7_linear_8766_48743)'
|
||||
></path>
|
||||
<path
|
||||
d="M14.3308 9.06476C15.1891 9.06476 15.8848 8.36911 15.8848 7.5108C15.8848 6.6525 15.1891 5.95685 14.3308 5.95685C13.4725 5.95685 12.7769 6.6525 12.7769 7.5108C12.7769 8.36911 13.4725 9.06476 14.3308 9.06476Z"
|
||||
fill="white"
|
||||
d='M14.3308 9.06476C15.1891 9.06476 15.8848 8.36911 15.8848 7.5108C15.8848 6.6525 15.1891 5.95685 14.3308 5.95685C13.4725 5.95685 12.7769 6.6525 12.7769 7.5108C12.7769 8.36911 13.4725 9.06476 14.3308 9.06476Z'
|
||||
fill='white'
|
||||
></path>
|
||||
<path
|
||||
d="M16.869 10.2216C17.2314 10.2216 17.5251 9.9279 17.5251 9.56548C17.5251 9.20306 17.2314 8.90936 16.869 8.90936C16.5066 8.90936 16.2129 9.20306 16.2129 9.56548C16.2129 9.9279 16.5066 10.2216 16.869 10.2216Z"
|
||||
fill="white"
|
||||
d='M16.869 10.2216C17.2314 10.2216 17.5251 9.9279 17.5251 9.56548C17.5251 9.20306 17.2314 8.90936 16.869 8.90936C16.5066 8.90936 16.2129 9.20306 16.2129 9.56548C16.2129 9.9279 16.5066 10.2216 16.869 10.2216Z'
|
||||
fill='white'
|
||||
></path>
|
||||
<path
|
||||
d="M19.2175 6.2676H19.1829C19.0793 6.25034 19.0103 6.14674 19.0275 6.02588C19.1829 5.23163 19.8391 4.47192 19.8736 4.43739C19.9427 4.35106 20.0808 4.35106 20.1498 4.42012C20.2362 4.48919 20.2362 4.62732 20.1671 4.69638C20.1498 4.71365 19.5455 5.42156 19.4074 6.11221C19.3901 6.2158 19.3038 6.2676 19.2175 6.2676Z"
|
||||
fill="url(#paint8_linear_8766_48743)"
|
||||
d='M19.2175 6.2676H19.1829C19.0793 6.25034 19.0103 6.14674 19.0275 6.02588C19.1829 5.23163 19.8391 4.47192 19.8736 4.43739C19.9427 4.35106 20.0808 4.35106 20.1498 4.42012C20.2362 4.48919 20.2362 4.62732 20.1671 4.69638C20.1498 4.71365 19.5455 5.42156 19.4074 6.11221C19.3901 6.2158 19.3038 6.2676 19.2175 6.2676Z'
|
||||
fill='url(#paint8_linear_8766_48743)'
|
||||
></path>
|
||||
<path
|
||||
d="M10.6876 20.6158C10.9545 20.6158 11.171 20.3993 11.171 20.1324C11.171 19.8654 10.9545 19.6489 10.6876 19.6489C10.4206 19.6489 10.2041 19.8654 10.2041 20.1324C10.2041 20.3993 10.4206 20.6158 10.6876 20.6158Z"
|
||||
fill="white"
|
||||
fill-opacity="0.2"
|
||||
d='M10.6876 20.6158C10.9545 20.6158 11.171 20.3993 11.171 20.1324C11.171 19.8654 10.9545 19.6489 10.6876 19.6489C10.4206 19.6489 10.2041 19.8654 10.2041 20.1324C10.2041 20.3993 10.4206 20.6158 10.6876 20.6158Z'
|
||||
fill='white'
|
||||
fill-opacity='0.2'
|
||||
></path>
|
||||
<path
|
||||
d="M10.4117 20.4432C10.2218 20.2532 10.2218 19.9425 10.4117 19.7525C10.4462 19.718 10.4808 19.7007 10.5153 19.6662C10.4462 19.6835 10.3944 19.718 10.3426 19.7698C10.1527 19.9597 10.1527 20.2705 10.3426 20.4604C10.498 20.6158 10.7398 20.6504 10.9297 20.5468C10.757 20.6158 10.5498 20.5813 10.4117 20.4432Z"
|
||||
fill="url(#paint9_linear_8766_48743)"
|
||||
d='M10.4117 20.4432C10.2218 20.2532 10.2218 19.9425 10.4117 19.7525C10.4462 19.718 10.4808 19.7007 10.5153 19.6662C10.4462 19.6835 10.3944 19.718 10.3426 19.7698C10.1527 19.9597 10.1527 20.2705 10.3426 20.4604C10.498 20.6158 10.7398 20.6504 10.9297 20.5468C10.757 20.6158 10.5498 20.5813 10.4117 20.4432Z'
|
||||
fill='url(#paint9_linear_8766_48743)'
|
||||
></path>
|
||||
<path
|
||||
d="M10.8604 19.9942C10.9176 19.9942 10.964 19.9478 10.964 19.8906C10.964 19.8335 10.9176 19.787 10.8604 19.787C10.8033 19.787 10.7568 19.8335 10.7568 19.8906C10.7568 19.9478 10.8033 19.9942 10.8604 19.9942Z"
|
||||
fill="white"
|
||||
fill-opacity="0.3"
|
||||
d='M10.8604 19.9942C10.9176 19.9942 10.964 19.9478 10.964 19.8906C10.964 19.8335 10.9176 19.787 10.8604 19.787C10.8033 19.787 10.7568 19.8335 10.7568 19.8906C10.7568 19.9478 10.8033 19.9942 10.8604 19.9942Z'
|
||||
fill='white'
|
||||
fill-opacity='0.3'
|
||||
></path>
|
||||
<path
|
||||
d="M13.2086 20.3741C13.4755 20.3741 13.692 20.1576 13.692 19.8906C13.692 19.6237 13.4755 19.4072 13.2086 19.4072C12.9416 19.4072 12.7251 19.6237 12.7251 19.8906C12.7251 20.1576 12.9416 20.3741 13.2086 20.3741Z"
|
||||
fill="white"
|
||||
fill-opacity="0.2"
|
||||
d='M13.2086 20.3741C13.4755 20.3741 13.692 20.1576 13.692 19.8906C13.692 19.6237 13.4755 19.4072 13.2086 19.4072C12.9416 19.4072 12.7251 19.6237 12.7251 19.8906C12.7251 20.1576 12.9416 20.3741 13.2086 20.3741Z'
|
||||
fill='white'
|
||||
fill-opacity='0.2'
|
||||
></path>
|
||||
<path
|
||||
d="M12.9322 20.2014C12.7423 20.0115 12.7423 19.7007 12.9322 19.5108C12.9667 19.4762 13.0013 19.459 13.0358 19.4244C12.9667 19.4417 12.9149 19.4762 12.8631 19.528C12.6732 19.718 12.6732 20.0288 12.8631 20.2187C13.0185 20.3741 13.2603 20.4086 13.4502 20.305C13.2775 20.3741 13.0703 20.3395 12.9322 20.2014Z"
|
||||
fill="url(#paint10_linear_8766_48743)"
|
||||
d='M12.9322 20.2014C12.7423 20.0115 12.7423 19.7007 12.9322 19.5108C12.9667 19.4762 13.0013 19.459 13.0358 19.4244C12.9667 19.4417 12.9149 19.4762 12.8631 19.528C12.6732 19.718 12.6732 20.0288 12.8631 20.2187C13.0185 20.3741 13.2603 20.4086 13.4502 20.305C13.2775 20.3741 13.0703 20.3395 12.9322 20.2014Z'
|
||||
fill='url(#paint10_linear_8766_48743)'
|
||||
></path>
|
||||
<path
|
||||
d="M13.3814 19.7525C13.4386 19.7525 13.485 19.7061 13.485 19.6489C13.485 19.5918 13.4386 19.5453 13.3814 19.5453C13.3243 19.5453 13.2778 19.5918 13.2778 19.6489C13.2778 19.7061 13.3243 19.7525 13.3814 19.7525Z"
|
||||
fill="white"
|
||||
fill-opacity="0.3"
|
||||
d='M13.3814 19.7525C13.4386 19.7525 13.485 19.7061 13.485 19.6489C13.485 19.5918 13.4386 19.5453 13.3814 19.5453C13.3243 19.5453 13.2778 19.5918 13.2778 19.6489C13.2778 19.7061 13.3243 19.7525 13.3814 19.7525Z'
|
||||
fill='white'
|
||||
fill-opacity='0.3'
|
||||
></path>
|
||||
<path
|
||||
d="M11.9656 21.4964C12.1659 21.4964 12.3282 21.3341 12.3282 21.1338C12.3282 20.9335 12.1659 20.7712 11.9656 20.7712C11.7653 20.7712 11.603 20.9335 11.603 21.1338C11.603 21.3341 11.7653 21.4964 11.9656 21.4964Z"
|
||||
fill="white"
|
||||
fill-opacity="0.2"
|
||||
d='M11.9656 21.4964C12.1659 21.4964 12.3282 21.3341 12.3282 21.1338C12.3282 20.9335 12.1659 20.7712 11.9656 20.7712C11.7653 20.7712 11.603 20.9335 11.603 21.1338C11.603 21.3341 11.7653 21.4964 11.9656 21.4964Z'
|
||||
fill='white'
|
||||
fill-opacity='0.2'
|
||||
></path>
|
||||
<path
|
||||
d="M11.7584 21.3583C11.6203 21.2202 11.6203 20.9784 11.7584 20.8403C11.7757 20.823 11.8102 20.8058 11.8275 20.7885C11.7757 20.8058 11.7412 20.8403 11.7066 20.8748C11.5685 21.013 11.5685 21.2547 11.7066 21.3928C11.8275 21.5137 12.0002 21.531 12.1555 21.4446C12.0174 21.4964 11.862 21.4619 11.7584 21.3583Z"
|
||||
fill="url(#paint11_linear_8766_48743)"
|
||||
d='M11.7584 21.3583C11.6203 21.2202 11.6203 20.9784 11.7584 20.8403C11.7757 20.823 11.8102 20.8058 11.8275 20.7885C11.7757 20.8058 11.7412 20.8403 11.7066 20.8748C11.5685 21.013 11.5685 21.2547 11.7066 21.3928C11.8275 21.5137 12.0002 21.531 12.1555 21.4446C12.0174 21.4964 11.862 21.4619 11.7584 21.3583Z'
|
||||
fill='url(#paint11_linear_8766_48743)'
|
||||
></path>
|
||||
<path
|
||||
d="M12.0862 21.0129C12.1243 21.0129 12.1552 20.982 12.1552 20.9439C12.1552 20.9057 12.1243 20.8748 12.0862 20.8748C12.048 20.8748 12.0171 20.9057 12.0171 20.9439C12.0171 20.982 12.048 21.0129 12.0862 21.0129Z"
|
||||
fill="white"
|
||||
fill-opacity="0.3"
|
||||
d='M12.0862 21.0129C12.1243 21.0129 12.1552 20.982 12.1552 20.9439C12.1552 20.9057 12.1243 20.8748 12.0862 20.8748C12.048 20.8748 12.0171 20.9057 12.0171 20.9439C12.0171 20.982 12.048 21.0129 12.0862 21.0129Z'
|
||||
fill='white'
|
||||
fill-opacity='0.3'
|
||||
></path>
|
||||
<path
|
||||
d="M14.1927 21.2374C14.393 21.2374 14.5553 21.0751 14.5553 20.8748C14.5553 20.6745 14.393 20.5122 14.1927 20.5122C13.9924 20.5122 13.8301 20.6745 13.8301 20.8748C13.8301 21.0751 13.9924 21.2374 14.1927 21.2374Z"
|
||||
fill="white"
|
||||
fill-opacity="0.2"
|
||||
d='M14.1927 21.2374C14.393 21.2374 14.5553 21.0751 14.5553 20.8748C14.5553 20.6745 14.393 20.5122 14.1927 20.5122C13.9924 20.5122 13.8301 20.6745 13.8301 20.8748C13.8301 21.0751 13.9924 21.2374 14.1927 21.2374Z'
|
||||
fill='white'
|
||||
fill-opacity='0.2'
|
||||
></path>
|
||||
<path
|
||||
d="M13.9855 21.0993C13.8473 20.9611 13.8473 20.7194 13.9855 20.5813C14.0027 20.564 14.0373 20.5467 14.0545 20.5295C14.0027 20.5467 13.9682 20.5813 13.9337 20.6158C13.7955 20.7539 13.7955 20.9957 13.9337 21.1338C14.0545 21.2547 14.2272 21.2719 14.3826 21.1856C14.2445 21.2374 14.0891 21.2029 13.9855 21.0993Z"
|
||||
fill="url(#paint12_linear_8766_48743)"
|
||||
d='M13.9855 21.0993C13.8473 20.9611 13.8473 20.7194 13.9855 20.5813C14.0027 20.564 14.0373 20.5467 14.0545 20.5295C14.0027 20.5467 13.9682 20.5813 13.9337 20.6158C13.7955 20.7539 13.7955 20.9957 13.9337 21.1338C14.0545 21.2547 14.2272 21.2719 14.3826 21.1856C14.2445 21.2374 14.0891 21.2029 13.9855 21.0993Z'
|
||||
fill='url(#paint12_linear_8766_48743)'
|
||||
></path>
|
||||
<path
|
||||
d="M14.3137 20.754C14.3519 20.754 14.3828 20.7231 14.3828 20.6849C14.3828 20.6468 14.3519 20.6158 14.3137 20.6158C14.2755 20.6158 14.2446 20.6468 14.2446 20.6849C14.2446 20.7231 14.2755 20.754 14.3137 20.754Z"
|
||||
fill="white"
|
||||
fill-opacity="0.3"
|
||||
d='M14.3137 20.754C14.3519 20.754 14.3828 20.7231 14.3828 20.6849C14.3828 20.6468 14.3519 20.6158 14.3137 20.6158C14.2755 20.6158 14.2446 20.6468 14.2446 20.6849C14.2446 20.7231 14.2755 20.754 14.3137 20.754Z'
|
||||
fill='white'
|
||||
fill-opacity='0.3'
|
||||
></path>
|
||||
<path
|
||||
d="M8.63311 20.4432C9.07185 20.4432 9.42736 20.0877 9.42736 19.6489C9.42736 19.2104 9.07185 18.8547 8.63311 18.8547C8.19455 18.8547 7.83887 19.2104 7.83887 19.6489C7.83887 20.0877 8.19455 20.4432 8.63311 20.4432Z"
|
||||
fill="white"
|
||||
fill-opacity="0.2"
|
||||
d='M8.63311 20.4432C9.07185 20.4432 9.42736 20.0877 9.42736 19.6489C9.42736 19.2104 9.07185 18.8547 8.63311 18.8547C8.19455 18.8547 7.83887 19.2104 7.83887 19.6489C7.83887 20.0877 8.19455 20.4432 8.63311 20.4432Z'
|
||||
fill='white'
|
||||
fill-opacity='0.2'
|
||||
></path>
|
||||
<path
|
||||
d="M8.18435 20.1497C7.87356 19.8389 7.87356 19.3381 8.18435 19.0274C8.23615 18.9756 8.28794 18.941 8.35701 18.9065C8.25341 18.941 8.16708 19.0101 8.08075 19.0792C7.76996 19.3899 7.76996 19.8907 8.08075 20.2015C8.33974 20.4605 8.73687 20.5122 9.04766 20.3223C8.75413 20.4432 8.40881 20.3914 8.18435 20.1497Z"
|
||||
fill="url(#paint13_linear_8766_48743)"
|
||||
d='M8.18435 20.1497C7.87356 19.8389 7.87356 19.3381 8.18435 19.0274C8.23615 18.9756 8.28794 18.941 8.35701 18.9065C8.25341 18.941 8.16708 19.0101 8.08075 19.0792C7.76996 19.3899 7.76996 19.8907 8.08075 20.2015C8.33974 20.4605 8.73687 20.5122 9.04766 20.3223C8.75413 20.4432 8.40881 20.3914 8.18435 20.1497Z'
|
||||
fill='url(#paint13_linear_8766_48743)'
|
||||
></path>
|
||||
<path
|
||||
d="M8.90948 19.4072C9.00479 19.4072 9.08214 19.3299 9.08214 19.2346C9.08214 19.1392 9.00479 19.0619 8.90948 19.0619C8.81417 19.0619 8.73682 19.1392 8.73682 19.2346C8.73682 19.3299 8.81417 19.4072 8.90948 19.4072Z"
|
||||
fill="white"
|
||||
fill-opacity="0.3"
|
||||
d='M8.90948 19.4072C9.00479 19.4072 9.08214 19.3299 9.08214 19.2346C9.08214 19.1392 9.00479 19.0619 8.90948 19.0619C8.81417 19.0619 8.73682 19.1392 8.73682 19.2346C8.73682 19.3299 8.81417 19.4072 8.90948 19.4072Z'
|
||||
fill='white'
|
||||
fill-opacity='0.3'
|
||||
></path>
|
||||
<path
|
||||
d="M15.7293 18.4921C16.168 18.4921 16.5235 18.1366 16.5235 17.6979C16.5235 17.2593 16.168 16.9036 15.7293 16.9036C15.2907 16.9036 14.9351 17.2593 14.9351 17.6979C14.9351 18.1366 15.2907 18.4921 15.7293 18.4921Z"
|
||||
fill="white"
|
||||
fill-opacity="0.2"
|
||||
d='M15.7293 18.4921C16.168 18.4921 16.5235 18.1366 16.5235 17.6979C16.5235 17.2593 16.168 16.9036 15.7293 16.9036C15.2907 16.9036 14.9351 17.2593 14.9351 17.6979C14.9351 18.1366 15.2907 18.4921 15.7293 18.4921Z'
|
||||
fill='white'
|
||||
fill-opacity='0.2'
|
||||
></path>
|
||||
<path
|
||||
d="M15.2634 18.1985C14.9527 17.8878 14.9527 17.387 15.2634 17.0762C15.3152 17.0244 15.367 16.9899 15.4361 16.9554C15.3325 16.9899 15.2462 17.059 15.1599 17.128C14.8491 17.4388 14.8491 17.9396 15.1599 18.2503C15.4188 18.5093 15.816 18.5611 16.1268 18.3712C15.8332 18.4921 15.5052 18.4403 15.2634 18.1985Z"
|
||||
fill="url(#paint14_linear_8766_48743)"
|
||||
d='M15.2634 18.1985C14.9527 17.8878 14.9527 17.387 15.2634 17.0762C15.3152 17.0244 15.367 16.9899 15.4361 16.9554C15.3325 16.9899 15.2462 17.059 15.1599 17.128C14.8491 17.4388 14.8491 17.9396 15.1599 18.2503C15.4188 18.5093 15.816 18.5611 16.1268 18.3712C15.8332 18.4921 15.5052 18.4403 15.2634 18.1985Z'
|
||||
fill='url(#paint14_linear_8766_48743)'
|
||||
></path>
|
||||
<path
|
||||
d="M16.0057 17.4561C16.101 17.4561 16.1783 17.3788 16.1783 17.2834C16.1783 17.1881 16.101 17.1108 16.0057 17.1108C15.9104 17.1108 15.833 17.1881 15.833 17.2834C15.833 17.3788 15.9104 17.4561 16.0057 17.4561Z"
|
||||
fill="white"
|
||||
fill-opacity="0.3"
|
||||
d='M16.0057 17.4561C16.101 17.4561 16.1783 17.3788 16.1783 17.2834C16.1783 17.1881 16.101 17.1108 16.0057 17.1108C15.9104 17.1108 15.833 17.1881 15.833 17.2834C15.833 17.3788 15.9104 17.4561 16.0057 17.4561Z'
|
||||
fill='white'
|
||||
fill-opacity='0.3'
|
||||
></path>
|
||||
<defs>
|
||||
<radialGradient
|
||||
cx="0"
|
||||
cy="0"
|
||||
gradientTransform="translate(22.0104 3.47051) scale(7.71702 7.71702)"
|
||||
gradientUnits="userSpaceOnUse"
|
||||
id="paint0_radial_8766_48743"
|
||||
r="1"
|
||||
cx='0'
|
||||
cy='0'
|
||||
gradientTransform='translate(22.0104 3.47051) scale(7.71702 7.71702)'
|
||||
gradientUnits='userSpaceOnUse'
|
||||
id='paint0_radial_8766_48743'
|
||||
r='1'
|
||||
>
|
||||
<stop stop-color="#FFEAFF" stop-opacity="0.6"></stop>
|
||||
<stop offset="0.68" stop-color="#A087C9"></stop>
|
||||
<stop offset="1" stop-color="#10002F"></stop>
|
||||
<stop stop-color='#FFEAFF' stop-opacity='0.6'></stop>
|
||||
<stop offset='0.68' stop-color='#A087C9'></stop>
|
||||
<stop offset='1' stop-color='#10002F'></stop>
|
||||
</radialGradient>
|
||||
<radialGradient
|
||||
cx="0"
|
||||
cy="0"
|
||||
gradientTransform="translate(17.7169 6.76169) scale(18.8808)"
|
||||
gradientUnits="userSpaceOnUse"
|
||||
id="paint1_radial_8766_48743"
|
||||
r="1"
|
||||
cx='0'
|
||||
cy='0'
|
||||
gradientTransform='translate(17.7169 6.76169) scale(18.8808)'
|
||||
gradientUnits='userSpaceOnUse'
|
||||
id='paint1_radial_8766_48743'
|
||||
r='1'
|
||||
>
|
||||
<stop stop-color="#FFEAFF" stop-opacity="0.6"></stop>
|
||||
<stop offset="0.68" stop-color="#A087C9"></stop>
|
||||
<stop offset="1" stop-color="#10002F"></stop>
|
||||
<stop stop-color='#FFEAFF' stop-opacity='0.6'></stop>
|
||||
<stop offset='0.68' stop-color='#A087C9'></stop>
|
||||
<stop offset='1' stop-color='#10002F'></stop>
|
||||
</radialGradient>
|
||||
<linearGradient
|
||||
gradientUnits="userSpaceOnUse"
|
||||
id="paint2_linear_8766_48743"
|
||||
x1="9.77838"
|
||||
x2="12.8655"
|
||||
y1="22.9307"
|
||||
y2="3.8849"
|
||||
gradientUnits='userSpaceOnUse'
|
||||
id='paint2_linear_8766_48743'
|
||||
x1='9.77838'
|
||||
x2='12.8655'
|
||||
y1='22.9307'
|
||||
y2='3.8849'
|
||||
>
|
||||
<stop stop-color="#81FFFF" stop-opacity="0.6"></stop>
|
||||
<stop offset="0.62" stop-color="white" stop-opacity="0"></stop>
|
||||
<stop offset="1" stop-color="white" stop-opacity="0"></stop>
|
||||
<stop stop-color='#81FFFF' stop-opacity='0.6'></stop>
|
||||
<stop offset='0.62' stop-color='white' stop-opacity='0'></stop>
|
||||
<stop offset='1' stop-color='white' stop-opacity='0'></stop>
|
||||
</linearGradient>
|
||||
<linearGradient
|
||||
gradientUnits="userSpaceOnUse"
|
||||
id="paint3_linear_8766_48743"
|
||||
x1="18.1284"
|
||||
x2="10.1473"
|
||||
y1="6.861"
|
||||
y2="14.1839"
|
||||
gradientUnits='userSpaceOnUse'
|
||||
id='paint3_linear_8766_48743'
|
||||
x1='18.1284'
|
||||
x2='10.1473'
|
||||
y1='6.861'
|
||||
y2='14.1839'
|
||||
>
|
||||
<stop stop-color="white" stop-opacity="0.6"></stop>
|
||||
<stop offset="0.29" stop-color="white" stop-opacity="0.6"></stop>
|
||||
<stop offset="0.78" stop-color="white" stop-opacity="0"></stop>
|
||||
<stop offset="1" stop-color="white" stop-opacity="0"></stop>
|
||||
<stop stop-color='white' stop-opacity='0.6'></stop>
|
||||
<stop offset='0.29' stop-color='white' stop-opacity='0.6'></stop>
|
||||
<stop offset='0.78' stop-color='white' stop-opacity='0'></stop>
|
||||
<stop offset='1' stop-color='white' stop-opacity='0'></stop>
|
||||
</linearGradient>
|
||||
<linearGradient
|
||||
gradientUnits="userSpaceOnUse"
|
||||
id="paint4_linear_8766_48743"
|
||||
x1="2.14889"
|
||||
x2="20.4906"
|
||||
y1="17.9083"
|
||||
y2="17.9083"
|
||||
gradientUnits='userSpaceOnUse'
|
||||
id='paint4_linear_8766_48743'
|
||||
x1='2.14889'
|
||||
x2='20.4906'
|
||||
y1='17.9083'
|
||||
y2='17.9083'
|
||||
>
|
||||
<stop stop-color="#0002E9"></stop>
|
||||
<stop offset="1" stop-color="#FF00C7"></stop>
|
||||
<stop stop-color='#0002E9'></stop>
|
||||
<stop offset='1' stop-color='#FF00C7'></stop>
|
||||
</linearGradient>
|
||||
<linearGradient
|
||||
gradientUnits="userSpaceOnUse"
|
||||
id="paint5_linear_8766_48743"
|
||||
x1="21.3586"
|
||||
x2="11.3753"
|
||||
y1="14.134"
|
||||
y2="23.5688"
|
||||
gradientUnits='userSpaceOnUse'
|
||||
id='paint5_linear_8766_48743'
|
||||
x1='21.3586'
|
||||
x2='11.3753'
|
||||
y1='14.134'
|
||||
y2='23.5688'
|
||||
>
|
||||
<stop stop-color="white" stop-opacity="0.6"></stop>
|
||||
<stop offset="0.29" stop-color="white" stop-opacity="0.6"></stop>
|
||||
<stop offset="0.78" stop-color="white" stop-opacity="0"></stop>
|
||||
<stop offset="1" stop-color="white" stop-opacity="0"></stop>
|
||||
<stop stop-color='white' stop-opacity='0.6'></stop>
|
||||
<stop offset='0.29' stop-color='white' stop-opacity='0.6'></stop>
|
||||
<stop offset='0.78' stop-color='white' stop-opacity='0'></stop>
|
||||
<stop offset='1' stop-color='white' stop-opacity='0'></stop>
|
||||
</linearGradient>
|
||||
<linearGradient
|
||||
gradientUnits="userSpaceOnUse"
|
||||
id="paint6_linear_8766_48743"
|
||||
x1="2.14889"
|
||||
x2="11.9616"
|
||||
y1="17.9083"
|
||||
y2="17.9083"
|
||||
gradientUnits='userSpaceOnUse'
|
||||
id='paint6_linear_8766_48743'
|
||||
x1='2.14889'
|
||||
x2='11.9616'
|
||||
y1='17.9083'
|
||||
y2='17.9083'
|
||||
>
|
||||
<stop stop-color="#000292" stop-opacity="0.7"></stop>
|
||||
<stop offset="1" stop-color="#7D00C7" stop-opacity="0.7"></stop>
|
||||
<stop stop-color='#000292' stop-opacity='0.7'></stop>
|
||||
<stop offset='1' stop-color='#7D00C7' stop-opacity='0.7'></stop>
|
||||
</linearGradient>
|
||||
<linearGradient
|
||||
gradientUnits="userSpaceOnUse"
|
||||
id="paint7_linear_8766_48743"
|
||||
x1="2.1612"
|
||||
x2="20.4784"
|
||||
y1="14.1775"
|
||||
y2="14.1775"
|
||||
gradientUnits='userSpaceOnUse'
|
||||
id='paint7_linear_8766_48743'
|
||||
x1='2.1612'
|
||||
x2='20.4784'
|
||||
y1='14.1775'
|
||||
y2='14.1775'
|
||||
>
|
||||
<stop stop-color="#000292"></stop>
|
||||
<stop offset="1" stop-color="#BE00C7"></stop>
|
||||
<stop stop-color='#000292'></stop>
|
||||
<stop offset='1' stop-color='#BE00C7'></stop>
|
||||
</linearGradient>
|
||||
<linearGradient
|
||||
gradientUnits="userSpaceOnUse"
|
||||
id="paint8_linear_8766_48743"
|
||||
x1="20.1778"
|
||||
x2="18.8614"
|
||||
y1="4.3533"
|
||||
y2="6.49258"
|
||||
gradientUnits='userSpaceOnUse'
|
||||
id='paint8_linear_8766_48743'
|
||||
x1='20.1778'
|
||||
x2='18.8614'
|
||||
y1='4.3533'
|
||||
y2='6.49258'
|
||||
>
|
||||
<stop stop-color="white" stop-opacity="0.6"></stop>
|
||||
<stop offset="0.29" stop-color="white" stop-opacity="0.6"></stop>
|
||||
<stop offset="0.78" stop-color="white" stop-opacity="0"></stop>
|
||||
<stop offset="1" stop-color="white" stop-opacity="0"></stop>
|
||||
<stop stop-color='white' stop-opacity='0.6'></stop>
|
||||
<stop offset='0.29' stop-color='white' stop-opacity='0.6'></stop>
|
||||
<stop offset='0.78' stop-color='white' stop-opacity='0'></stop>
|
||||
<stop offset='1' stop-color='white' stop-opacity='0'></stop>
|
||||
</linearGradient>
|
||||
<linearGradient
|
||||
gradientUnits="userSpaceOnUse"
|
||||
id="paint9_linear_8766_48743"
|
||||
x1="10.1997"
|
||||
x2="10.9302"
|
||||
y1="20.1472"
|
||||
y2="20.1472"
|
||||
gradientUnits='userSpaceOnUse'
|
||||
id='paint9_linear_8766_48743'
|
||||
x1='10.1997'
|
||||
x2='10.9302'
|
||||
y1='20.1472'
|
||||
y2='20.1472'
|
||||
>
|
||||
<stop stop-color="white" stop-opacity="0.6"></stop>
|
||||
<stop offset="0.29" stop-color="white" stop-opacity="0.6"></stop>
|
||||
<stop offset="0.78" stop-color="white" stop-opacity="0"></stop>
|
||||
<stop offset="1" stop-color="white" stop-opacity="0"></stop>
|
||||
<stop stop-color='white' stop-opacity='0.6'></stop>
|
||||
<stop offset='0.29' stop-color='white' stop-opacity='0.6'></stop>
|
||||
<stop offset='0.78' stop-color='white' stop-opacity='0'></stop>
|
||||
<stop offset='1' stop-color='white' stop-opacity='0'></stop>
|
||||
</linearGradient>
|
||||
<linearGradient
|
||||
gradientUnits="userSpaceOnUse"
|
||||
id="paint10_linear_8766_48743"
|
||||
x1="12.7185"
|
||||
x2="13.449"
|
||||
y1="19.9022"
|
||||
y2="19.9022"
|
||||
gradientUnits='userSpaceOnUse'
|
||||
id='paint10_linear_8766_48743'
|
||||
x1='12.7185'
|
||||
x2='13.449'
|
||||
y1='19.9022'
|
||||
y2='19.9022'
|
||||
>
|
||||
<stop stop-color="white" stop-opacity="0.6"></stop>
|
||||
<stop offset="0.29" stop-color="white" stop-opacity="0.6"></stop>
|
||||
<stop offset="0.78" stop-color="white" stop-opacity="0"></stop>
|
||||
<stop offset="1" stop-color="white" stop-opacity="0"></stop>
|
||||
<stop stop-color='white' stop-opacity='0.6'></stop>
|
||||
<stop offset='0.29' stop-color='white' stop-opacity='0.6'></stop>
|
||||
<stop offset='0.78' stop-color='white' stop-opacity='0'></stop>
|
||||
<stop offset='1' stop-color='white' stop-opacity='0'></stop>
|
||||
</linearGradient>
|
||||
<linearGradient
|
||||
gradientUnits="userSpaceOnUse"
|
||||
id="paint11_linear_8766_48743"
|
||||
x1="11.6008"
|
||||
x2="12.1492"
|
||||
y1="21.138"
|
||||
y2="21.138"
|
||||
gradientUnits='userSpaceOnUse'
|
||||
id='paint11_linear_8766_48743'
|
||||
x1='11.6008'
|
||||
x2='12.1492'
|
||||
y1='21.138'
|
||||
y2='21.138'
|
||||
>
|
||||
<stop stop-color="white" stop-opacity="0.6"></stop>
|
||||
<stop offset="0.29" stop-color="white" stop-opacity="0.6"></stop>
|
||||
<stop offset="0.78" stop-color="white" stop-opacity="0"></stop>
|
||||
<stop offset="1" stop-color="white" stop-opacity="0"></stop>
|
||||
<stop stop-color='white' stop-opacity='0.6'></stop>
|
||||
<stop offset='0.29' stop-color='white' stop-opacity='0.6'></stop>
|
||||
<stop offset='0.78' stop-color='white' stop-opacity='0'></stop>
|
||||
<stop offset='1' stop-color='white' stop-opacity='0'></stop>
|
||||
</linearGradient>
|
||||
<linearGradient
|
||||
gradientUnits="userSpaceOnUse"
|
||||
id="paint12_linear_8766_48743"
|
||||
x1="13.8204"
|
||||
x2="14.3688"
|
||||
y1="20.8783"
|
||||
y2="20.8783"
|
||||
gradientUnits='userSpaceOnUse'
|
||||
id='paint12_linear_8766_48743'
|
||||
x1='13.8204'
|
||||
x2='14.3688'
|
||||
y1='20.8783'
|
||||
y2='20.8783'
|
||||
>
|
||||
<stop stop-color="white" stop-opacity="0.6"></stop>
|
||||
<stop offset="0.29" stop-color="white" stop-opacity="0.6"></stop>
|
||||
<stop offset="0.78" stop-color="white" stop-opacity="0"></stop>
|
||||
<stop offset="1" stop-color="white" stop-opacity="0"></stop>
|
||||
<stop stop-color='white' stop-opacity='0.6'></stop>
|
||||
<stop offset='0.29' stop-color='white' stop-opacity='0.6'></stop>
|
||||
<stop offset='0.78' stop-color='white' stop-opacity='0'></stop>
|
||||
<stop offset='1' stop-color='white' stop-opacity='0'></stop>
|
||||
</linearGradient>
|
||||
<linearGradient
|
||||
gradientUnits="userSpaceOnUse"
|
||||
id="paint13_linear_8766_48743"
|
||||
x1="7.83973"
|
||||
x2="9.03272"
|
||||
y1="19.6691"
|
||||
y2="19.6691"
|
||||
gradientUnits='userSpaceOnUse'
|
||||
id='paint13_linear_8766_48743'
|
||||
x1='7.83973'
|
||||
x2='9.03272'
|
||||
y1='19.6691'
|
||||
y2='19.6691'
|
||||
>
|
||||
<stop stop-color="white" stop-opacity="0.6"></stop>
|
||||
<stop offset="0.29" stop-color="white" stop-opacity="0.6"></stop>
|
||||
<stop offset="0.78" stop-color="white" stop-opacity="0"></stop>
|
||||
<stop offset="1" stop-color="white" stop-opacity="0"></stop>
|
||||
<stop stop-color='white' stop-opacity='0.6'></stop>
|
||||
<stop offset='0.29' stop-color='white' stop-opacity='0.6'></stop>
|
||||
<stop offset='0.78' stop-color='white' stop-opacity='0'></stop>
|
||||
<stop offset='1' stop-color='white' stop-opacity='0'></stop>
|
||||
</linearGradient>
|
||||
<linearGradient
|
||||
gradientUnits="userSpaceOnUse"
|
||||
id="paint14_linear_8766_48743"
|
||||
x1="14.9254"
|
||||
x2="16.1184"
|
||||
y1="17.7175"
|
||||
y2="17.7175"
|
||||
gradientUnits='userSpaceOnUse'
|
||||
id='paint14_linear_8766_48743'
|
||||
x1='14.9254'
|
||||
x2='16.1184'
|
||||
y1='17.7175'
|
||||
y2='17.7175'
|
||||
>
|
||||
<stop stop-color="white" stop-opacity="0.6"></stop>
|
||||
<stop offset="0.29" stop-color="white" stop-opacity="0.6"></stop>
|
||||
<stop offset="0.78" stop-color="white" stop-opacity="0"></stop>
|
||||
<stop offset="1" stop-color="white" stop-opacity="0"></stop>
|
||||
<stop stop-color='white' stop-opacity='0.6'></stop>
|
||||
<stop offset='0.29' stop-color='white' stop-opacity='0.6'></stop>
|
||||
<stop offset='0.78' stop-color='white' stop-opacity='0'></stop>
|
||||
<stop offset='1' stop-color='white' stop-opacity='0'></stop>
|
||||
</linearGradient>
|
||||
</defs>
|
||||
</svg>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 18 KiB After Width: | Height: | Size: 18 KiB |
@ -1,36 +0,0 @@
|
||||
<svg viewBox="0 0 240 240" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<rect width="240" height="240" rx="120" fill="#E50571" />
|
||||
<path d="M149.107 60.9396L63.3276 181.702H89.6637L175.888 60.9396H149.107Z" fill="white" />
|
||||
<path
|
||||
d="M92.4053 60.9396L117.644 96.5239L104.476 115.934L65.5205 60.9396H92.4053Z"
|
||||
fill="url(#paint0_linear_6269_3439)"
|
||||
/>
|
||||
<path
|
||||
d="M151.664 181.712L123.682 142.354L136.851 123.483L178 181.712H151.664Z"
|
||||
fill="url(#paint1_linear_6269_3439)"
|
||||
/>
|
||||
<defs>
|
||||
<linearGradient
|
||||
id="paint0_linear_6269_3439"
|
||||
x1="86.3698"
|
||||
y1="68.4878"
|
||||
x2="121.753"
|
||||
y2="111.957"
|
||||
gradientUnits="userSpaceOnUse"
|
||||
>
|
||||
<stop stop-color="white" />
|
||||
<stop offset="1" stop-color="white" stop-opacity="0.75" />
|
||||
</linearGradient>
|
||||
<linearGradient
|
||||
id="paint1_linear_6269_3439"
|
||||
x1="157.7"
|
||||
y1="172.547"
|
||||
x2="114.305"
|
||||
y2="113.014"
|
||||
gradientUnits="userSpaceOnUse"
|
||||
>
|
||||
<stop stop-color="white" stop-opacity="0.68" />
|
||||
<stop offset="1" stop-color="white" stop-opacity="0.1" />
|
||||
</linearGradient>
|
||||
</defs>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 1.1 KiB |
@ -1,25 +1,9 @@
|
||||
<svg version="1.1" viewBox="0 0 500 500" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<mask
|
||||
id="mask0_207_398"
|
||||
style="mask-type: alpha"
|
||||
maskUnits="userSpaceOnUse"
|
||||
x="0"
|
||||
y="0"
|
||||
width="500"
|
||||
height="500"
|
||||
>
|
||||
<path
|
||||
d="M250 500C388.071 500 500 388.071 500 250C500 111.929 388.071 0 250 0C111.929 0 0 111.929 0 250C0 388.071 111.929 500 250 500Z"
|
||||
fill="#D9D9D9"
|
||||
/>
|
||||
</mask>
|
||||
<g mask="url(#mask0_207_398)">
|
||||
<path d="M500 0H0V500H500V0Z" fill="#E50571" />
|
||||
<path
|
||||
fill-rule="evenodd"
|
||||
clip-rule="evenodd"
|
||||
d="M355.922 116.063C373.552 128.87 383.346 140.375 386.393 151.879C388.352 158.391 386.611 166.206 382.259 172.067C377.904 177.927 370.941 181.183 362.887 181.183C359.841 181.183 356.57 180.717 353.526 179.849C354.448 177.382 355.467 174.831 356.572 172.28C357.443 172.497 358.533 172.497 359.62 172.497C362.23 172.497 365.278 172.062 367.674 170.109C369.413 168.807 371.374 166.419 371.157 162.077C371.157 157.953 367.891 152.743 361.144 146.448C356.357 141.89 349.826 136.897 343.298 132.339C324.578 119.966 311.52 116.493 305.643 122.354C301.726 126.261 302.161 131.037 303.467 134.51C300.741 136.294 298.183 137.878 295.841 139.276C290.198 130.82 289.907 120.621 294.763 111.505C297.809 105.644 302.598 101.737 308.039 100.651C310.215 100.217 312.391 100 314.787 100C326.757 100 341.774 105.861 355.922 116.063ZM294.241 147.657C301.204 143.967 311.302 137.548 322.837 128.432C327.191 130.168 332.85 133.207 339.815 137.766C348.085 143.192 355.267 149.27 359.839 154.046C352.233 164.014 347.23 177.66 344.183 187.208C360.687 208.796 370.502 235.743 370.502 264.972C370.502 335.952 312.826 393.476 241.657 393.476C170.485 393.476 112.808 335.952 112.808 264.972C112.808 193.99 170.485 136.467 241.657 136.467C260.344 136.467 278.128 140.458 294.185 147.634L294.241 147.657ZM241.657 386.313C174.402 386.313 119.99 332.046 119.99 264.972C119.99 197.898 174.402 143.63 241.657 143.63C308.909 143.63 363.322 197.898 363.322 264.972C363.322 332.046 308.691 386.313 241.657 386.313ZM364.844 162.294C364.844 161.643 364.626 160.558 363.974 159.473C362.45 161.643 360.926 163.814 359.62 166.419C361.144 166.419 362.885 165.985 363.754 165.333C364.191 164.899 364.844 164.248 364.844 162.294ZM315.439 126.478C312.609 126.044 310.867 126.478 310.215 127.129C308.909 128.215 308.691 129.734 308.909 131.253C311.085 129.734 313.261 128.215 315.439 126.478ZM303.248 241.528C333.937 244.13 357.224 250.639 357.224 263.88C357.224 327.48 305.424 379.143 241.654 379.143C178.472 379.143 126.827 328.43 125.878 265.639C125.869 265.415 125.864 265.193 125.864 264.97C125.864 264.861 125.865 264.752 125.867 264.643C125.865 264.389 125.865 264.135 125.865 263.88H125.895C126.724 249.363 144.485 249.863 176.141 253.465C190.724 255.202 210.748 256.287 232.948 249.776C258.63 241.961 281.048 239.789 303.248 241.528ZM235.454 258.165L235.413 258.178C211.591 265.165 190.228 263.959 175.129 262.163C158.617 260.285 147.335 259.463 140.246 260.615C136.818 261.174 135.589 262.026 135.234 262.367L135.223 262.378C135.114 262.478 134.621 262.928 134.621 264.97C134.621 267.6 136.016 271.543 140.491 276.233C144.895 280.85 151.75 285.583 161.037 289.563C179.564 297.507 206.757 302.015 239.989 297.326C264.652 293.811 279.954 287.83 294.907 281.987C300.563 279.776 306.167 277.585 312.211 275.554L312.237 275.546L312.263 275.537C318.22 273.576 323.933 272.139 328.974 270.926C329.88 270.707 330.759 270.498 331.607 270.296L331.676 270.278L331.696 270.274C335.654 269.33 338.978 268.537 341.872 267.661C345.498 266.561 347.309 265.641 348.139 264.98C348.18 264.946 348.217 264.915 348.248 264.889C348.194 264.054 347.263 260.978 338.357 257.378C329.937 253.976 317.504 251.526 302.535 250.254C281.474 248.611 260.161 250.648 235.496 258.152L235.454 258.165ZM279.526 210.272C290.346 210.272 299.113 201.525 299.113 190.735C299.113 179.946 290.346 171.199 279.526 171.199C268.709 171.199 259.937 179.946 259.937 190.735C259.937 201.525 268.709 210.272 279.526 210.272ZM319.791 216.574C319.791 221.13 316.087 224.824 311.52 224.824C306.952 224.824 303.25 221.13 303.25 216.574C303.25 212.02 306.952 208.326 311.52 208.326C316.087 208.326 319.791 212.02 319.791 216.574Z"
|
||||
fill="white"
|
||||
/>
|
||||
</g>
|
||||
<svg width="500" height="500" viewBox="0 0 500 500" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<mask id="mask0_207_398" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="0" y="0" width="500" height="500">
|
||||
<path d="M250 500C388.071 500 500 388.071 500 250C500 111.929 388.071 0 250 0C111.929 0 0 111.929 0 250C0 388.071 111.929 500 250 500Z" fill="#D9D9D9"/>
|
||||
</mask>
|
||||
<g mask="url(#mask0_207_398)">
|
||||
<path d="M500 0H0V500H500V0Z" fill="#E50571"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M355.922 116.063C373.552 128.87 383.346 140.375 386.393 151.879C388.352 158.391 386.611 166.206 382.259 172.067C377.904 177.927 370.941 181.183 362.887 181.183C359.841 181.183 356.57 180.717 353.526 179.849C354.448 177.382 355.467 174.831 356.572 172.28C357.443 172.497 358.533 172.497 359.62 172.497C362.23 172.497 365.278 172.062 367.674 170.109C369.413 168.807 371.374 166.419 371.157 162.077C371.157 157.953 367.891 152.743 361.144 146.448C356.357 141.89 349.826 136.897 343.298 132.339C324.578 119.966 311.52 116.493 305.643 122.354C301.726 126.261 302.161 131.037 303.467 134.51C300.741 136.294 298.183 137.878 295.841 139.276C290.198 130.82 289.907 120.621 294.763 111.505C297.809 105.644 302.598 101.737 308.039 100.651C310.215 100.217 312.391 100 314.787 100C326.757 100 341.774 105.861 355.922 116.063ZM294.241 147.657C301.204 143.967 311.302 137.548 322.837 128.432C327.191 130.168 332.85 133.207 339.815 137.766C348.085 143.192 355.267 149.27 359.839 154.046C352.233 164.014 347.23 177.66 344.183 187.208C360.687 208.796 370.502 235.743 370.502 264.972C370.502 335.952 312.826 393.476 241.657 393.476C170.485 393.476 112.808 335.952 112.808 264.972C112.808 193.99 170.485 136.467 241.657 136.467C260.344 136.467 278.128 140.458 294.185 147.634L294.241 147.657ZM241.657 386.313C174.402 386.313 119.99 332.046 119.99 264.972C119.99 197.898 174.402 143.63 241.657 143.63C308.909 143.63 363.322 197.898 363.322 264.972C363.322 332.046 308.691 386.313 241.657 386.313ZM364.844 162.294C364.844 161.643 364.626 160.558 363.974 159.473C362.45 161.643 360.926 163.814 359.62 166.419C361.144 166.419 362.885 165.985 363.754 165.333C364.191 164.899 364.844 164.248 364.844 162.294ZM315.439 126.478C312.609 126.044 310.867 126.478 310.215 127.129C308.909 128.215 308.691 129.734 308.909 131.253C311.085 129.734 313.261 128.215 315.439 126.478ZM303.248 241.528C333.937 244.13 357.224 250.639 357.224 263.88C357.224 327.48 305.424 379.143 241.654 379.143C178.472 379.143 126.827 328.43 125.878 265.639C125.869 265.415 125.864 265.193 125.864 264.97C125.864 264.861 125.865 264.752 125.867 264.643C125.865 264.389 125.865 264.135 125.865 263.88H125.895C126.724 249.363 144.485 249.863 176.141 253.465C190.724 255.202 210.748 256.287 232.948 249.776C258.63 241.961 281.048 239.789 303.248 241.528ZM235.454 258.165L235.413 258.178C211.591 265.165 190.228 263.959 175.129 262.163C158.617 260.285 147.335 259.463 140.246 260.615C136.818 261.174 135.589 262.026 135.234 262.367L135.223 262.378C135.114 262.478 134.621 262.928 134.621 264.97C134.621 267.6 136.016 271.543 140.491 276.233C144.895 280.85 151.75 285.583 161.037 289.563C179.564 297.507 206.757 302.015 239.989 297.326C264.652 293.811 279.954 287.83 294.907 281.987C300.563 279.776 306.167 277.585 312.211 275.554L312.237 275.546L312.263 275.537C318.22 273.576 323.933 272.139 328.974 270.926C329.88 270.707 330.759 270.498 331.607 270.296L331.676 270.278L331.696 270.274C335.654 269.33 338.978 268.537 341.872 267.661C345.498 266.561 347.309 265.641 348.139 264.98C348.18 264.946 348.217 264.915 348.248 264.889C348.194 264.054 347.263 260.978 338.357 257.378C329.937 253.976 317.504 251.526 302.535 250.254C281.474 248.611 260.161 250.648 235.496 258.152L235.454 258.165ZM279.526 210.272C290.346 210.272 299.113 201.525 299.113 190.735C299.113 179.946 290.346 171.199 279.526 171.199C268.709 171.199 259.937 179.946 259.937 190.735C259.937 201.525 268.709 210.272 279.526 210.272ZM319.791 216.574C319.791 221.13 316.087 224.824 311.52 224.824C306.952 224.824 303.25 221.13 303.25 216.574C303.25 212.02 306.952 208.326 311.52 208.326C316.087 208.326 319.791 212.02 319.791 216.574Z" fill="white"/>
|
||||
</g>
|
||||
</svg>
|
||||
|
||||
|
Before Width: | Height: | Size: 4.2 KiB After Width: | Height: | Size: 4.1 KiB |
@ -1,4 +1,13 @@
|
||||
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 120 120">
|
||||
<svg
|
||||
version="1.1"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:xlink="http://www.w3.org/1999/xlink"
|
||||
x="0px"
|
||||
y="0px"
|
||||
viewBox="0 0 120 120"
|
||||
style="enable-background: new 0 0 120 120"
|
||||
xml:space="preserve"
|
||||
>
|
||||
<path fill="#2775CA" d="M60,120c33.2,0,60-26.8,60-60S93.2,0,60,0S0,26.8,0,60S26.8,120,60,120z" />
|
||||
<path
|
||||
fill="#FFFFFF"
|
||||
|
||||
|
Before Width: | Height: | Size: 1.2 KiB After Width: | Height: | Size: 1.4 KiB |
@ -1,4 +1,4 @@
|
||||
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 339.43 295.27">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 339.43 295.27">
|
||||
<path
|
||||
d="M62.15,1.45l-61.89,130a2.52,2.52,0,0,0,.54,2.94L167.95,294.56a2.55,2.55,0,0,0,3.53,0L338.63,134.4a2.52,2.52,0,0,0,.54-2.94l-61.89-130A2.5,2.5,0,0,0,275,0H64.45a2.5,2.5,0,0,0-2.3,1.45h0Z"
|
||||
fill="#50af95"
|
||||
|
||||
|
Before Width: | Height: | Size: 809 B After Width: | Height: | Size: 795 B |
@ -1,6 +1,5 @@
|
||||
import { cacheFn, positionsCache } from 'api/cache'
|
||||
import { getCreditManagerQueryClient } from 'api/cosmwasm-client'
|
||||
import getPrices from 'api/prices/getPrices'
|
||||
import getDepositedVaults from 'api/vaults/getDepositedVaults'
|
||||
import { BNCoin } from 'types/classes/BNCoin'
|
||||
import { Positions } from 'types/generated/mars-credit-manager/MarsCreditManager.types'
|
||||
@ -20,8 +19,6 @@ export default async function getAccount(
|
||||
`${chainConfig.id}/account/${accountId}`,
|
||||
)
|
||||
|
||||
const prices = await getPrices(chainConfig)
|
||||
|
||||
const accountKind = await creditManagerQueryClient.accountKind({ accountId: accountId })
|
||||
|
||||
const depositedVaults = await getDepositedVaults(accountId, chainConfig, accountPosition)
|
||||
@ -33,7 +30,7 @@ export default async function getAccount(
|
||||
lends: accountPosition.lends.map((lend) => new BNCoin(lend)),
|
||||
deposits: accountPosition.deposits.map((deposit) => new BNCoin(deposit)),
|
||||
vaults: depositedVaults,
|
||||
perps: resolvePerpsPositions(accountPosition.perps, prices),
|
||||
perps: resolvePerpsPositions(accountPosition.perps),
|
||||
kind: accountKind,
|
||||
}
|
||||
}
|
||||
|
||||
@ -1,20 +1,26 @@
|
||||
import { CosmWasmClient } from '@cosmjs/cosmwasm-stargate'
|
||||
|
||||
import { ICNSQueryClient } from 'types/classes/ICNSClient.client'
|
||||
import { MarsAccountNftQueryClient } from 'types/generated/mars-account-nft/MarsAccountNft.client'
|
||||
import { MarsCreditManagerQueryClient } from 'types/generated/mars-credit-manager/MarsCreditManager.client'
|
||||
import { MarsIncentivesQueryClient } from 'types/generated/mars-incentives/MarsIncentives.client'
|
||||
import { MarsMockVaultQueryClient } from 'types/generated/mars-mock-vault/MarsMockVault.client'
|
||||
import { MarsOracleOsmosisQueryClient } from 'types/generated/mars-oracle-osmosis/MarsOracleOsmosis.client'
|
||||
import { MarsParamsQueryClient } from 'types/generated/mars-params/MarsParams.client'
|
||||
import { MarsPerpsQueryClient } from 'types/generated/mars-perps/MarsPerps.client'
|
||||
import { MarsRedBankQueryClient } from 'types/generated/mars-red-bank/MarsRedBank.client'
|
||||
import { MarsSwapperOsmosisQueryClient } from 'types/generated/mars-swapper-osmosis/MarsSwapperOsmosis.client'
|
||||
|
||||
let _cosmWasmClient: Map<string, CosmWasmClient> = new Map()
|
||||
let _accountNftQueryClient: Map<string, MarsAccountNftQueryClient> = new Map()
|
||||
let _creditManagerQueryClient: Map<string, MarsCreditManagerQueryClient> = new Map()
|
||||
let _oracleQueryClient: Map<string, MarsOracleOsmosisQueryClient> = new Map()
|
||||
let _redBankQueryClient: Map<string, MarsRedBankQueryClient> = new Map()
|
||||
let _paramsQueryClient: Map<string, MarsParamsQueryClient> = new Map()
|
||||
let _incentivesQueryClient: Map<string, MarsIncentivesQueryClient> = new Map()
|
||||
let _swapperOsmosisClient: Map<string, MarsSwapperOsmosisQueryClient> = new Map()
|
||||
let _perpsClient: Map<string, MarsPerpsQueryClient> = new Map()
|
||||
let _ICNSQueryClient: Map<string, ICNSQueryClient> = new Map()
|
||||
|
||||
const getClient = async (rpc: string) => {
|
||||
try {
|
||||
@ -29,6 +35,23 @@ const getClient = async (rpc: string) => {
|
||||
}
|
||||
}
|
||||
|
||||
const getAccountNftQueryClient = async (chainConfig: ChainConfig) => {
|
||||
try {
|
||||
const contract = chainConfig.contracts.accountNft
|
||||
const rpc = chainConfig.endpoints.rpc
|
||||
const key = rpc + contract
|
||||
|
||||
if (!_accountNftQueryClient.get(key)) {
|
||||
const client = await getClient(rpc)
|
||||
_accountNftQueryClient.set(key, new MarsAccountNftQueryClient(client, contract))
|
||||
}
|
||||
|
||||
return _accountNftQueryClient.get(key)!
|
||||
} catch (error) {
|
||||
throw error
|
||||
}
|
||||
}
|
||||
|
||||
const getCreditManagerQueryClient = async (chainConfig: ChainConfig) => {
|
||||
try {
|
||||
const contract = chainConfig.contracts.creditManager
|
||||
@ -80,6 +103,23 @@ const getOracleQueryClient = async (chainConfig: ChainConfig) => {
|
||||
}
|
||||
}
|
||||
|
||||
const getRedBankQueryClient = async (chainConfig: ChainConfig) => {
|
||||
try {
|
||||
const contract = chainConfig.contracts.redBank
|
||||
const rpc = chainConfig.endpoints.rpc
|
||||
const key = rpc + contract
|
||||
|
||||
if (!_redBankQueryClient.get(key)) {
|
||||
const client = await getClient(rpc)
|
||||
_redBankQueryClient.set(key, new MarsRedBankQueryClient(client, contract))
|
||||
}
|
||||
|
||||
return _redBankQueryClient.get(key)!
|
||||
} catch (error) {
|
||||
throw error
|
||||
}
|
||||
}
|
||||
|
||||
const getVaultQueryClient = async (chainConfig: ChainConfig, address: string) => {
|
||||
try {
|
||||
const client = await getClient(chainConfig.endpoints.rpc)
|
||||
@ -137,12 +177,31 @@ const getPerpsQueryClient = async (chainConfig: ChainConfig) => {
|
||||
}
|
||||
}
|
||||
|
||||
const getICNSQueryClient = async (chainConfig: ChainConfig) => {
|
||||
try {
|
||||
const contract = chainConfig.contracts.params
|
||||
const rpc = chainConfig.endpoints.rpc
|
||||
const key = rpc + contract
|
||||
if (!_ICNSQueryClient.get(key)) {
|
||||
const client = await getClient(rpc)
|
||||
_ICNSQueryClient.set(key, new ICNSQueryClient(client))
|
||||
}
|
||||
|
||||
return _ICNSQueryClient.get(key)!
|
||||
} catch (error) {
|
||||
throw error
|
||||
}
|
||||
}
|
||||
|
||||
export {
|
||||
getAccountNftQueryClient,
|
||||
getClient,
|
||||
getCreditManagerQueryClient,
|
||||
getICNSQueryClient,
|
||||
getIncentivesQueryClient,
|
||||
getOracleQueryClient,
|
||||
getParamsQueryClient,
|
||||
getRedBankQueryClient,
|
||||
getSwapperQueryClient,
|
||||
getVaultQueryClient,
|
||||
getPerpsQueryClient,
|
||||
|
||||
41
src/api/incentives/calculateAssetIncentivesApy.ts
Normal file
41
src/api/incentives/calculateAssetIncentivesApy.ts
Normal file
@ -0,0 +1,41 @@
|
||||
import getTotalActiveEmissionValue from 'api/incentives/getTotalActiveEmissionValue'
|
||||
import getMarket from 'api/markets/getMarket'
|
||||
import getUnderlyingLiquidityAmount from 'api/markets/getMarketUnderlyingLiquidityAmount'
|
||||
import getPrice from 'api/prices/getPrice'
|
||||
import { byDenom } from 'utils/array'
|
||||
import { SECONDS_IN_A_YEAR } from 'utils/constants'
|
||||
import { BN } from 'utils/helpers'
|
||||
|
||||
export default async function calculateAssetIncentivesApy(
|
||||
chainConfig: ChainConfig,
|
||||
denom: string,
|
||||
): Promise<BigNumber | null> {
|
||||
try {
|
||||
const [totalActiveEmissionValue, market] = await Promise.all([
|
||||
getTotalActiveEmissionValue(chainConfig, denom),
|
||||
getMarket(chainConfig, denom),
|
||||
])
|
||||
|
||||
if (!totalActiveEmissionValue) return null
|
||||
|
||||
const [marketLiquidityAmount, assetPrice] = await Promise.all([
|
||||
getUnderlyingLiquidityAmount(chainConfig, market),
|
||||
getPrice(chainConfig, denom),
|
||||
])
|
||||
|
||||
const assetDecimals = (chainConfig.assets.find(byDenom(denom)) as Asset).decimals
|
||||
|
||||
const marketLiquidityValue = BN(marketLiquidityAmount)
|
||||
.shiftedBy(-assetDecimals)
|
||||
.multipliedBy(assetPrice)
|
||||
|
||||
const marketReturns = BN(market.apy.deposit).multipliedBy(marketLiquidityValue)
|
||||
const annualEmission = totalActiveEmissionValue.multipliedBy(SECONDS_IN_A_YEAR)
|
||||
|
||||
const totalAnnualReturnsValue = annualEmission.plus(marketReturns)
|
||||
return totalAnnualReturnsValue.dividedBy(marketLiquidityValue).multipliedBy(100)
|
||||
} catch (ex) {
|
||||
console.error(ex)
|
||||
return null
|
||||
}
|
||||
}
|
||||
42
src/api/incentives/getTotalActiveEmissionValue.ts
Normal file
42
src/api/incentives/getTotalActiveEmissionValue.ts
Normal file
@ -0,0 +1,42 @@
|
||||
import { cacheFn, emissionsCache } from 'api/cache'
|
||||
import { getIncentivesQueryClient } from 'api/cosmwasm-client'
|
||||
import getPrice from 'api/prices/getPrice'
|
||||
import { BN_ZERO } from 'constants/math'
|
||||
import { byDenom } from 'utils/array'
|
||||
import { BN } from 'utils/helpers'
|
||||
|
||||
export default async function getTotalActiveEmissionValue(
|
||||
chainConfig: ChainConfig,
|
||||
denom: string,
|
||||
): Promise<BigNumber | null> {
|
||||
try {
|
||||
const client = await getIncentivesQueryClient(chainConfig)
|
||||
const activeEmissions = await cacheFn(
|
||||
() =>
|
||||
client.activeEmissions({
|
||||
collateralDenom: denom,
|
||||
}),
|
||||
emissionsCache,
|
||||
`emission/${denom}`,
|
||||
60,
|
||||
)
|
||||
|
||||
if (activeEmissions.length === 0) {
|
||||
throw 'Asset has no active incentive emission.'
|
||||
}
|
||||
|
||||
const prices = await Promise.all(
|
||||
activeEmissions.map((activeEmission) => getPrice(chainConfig, activeEmission.denom)),
|
||||
)
|
||||
|
||||
return activeEmissions.reduce((accumulation, current, index) => {
|
||||
const price = prices[index]
|
||||
const decimals = chainConfig.assets.find(byDenom(current.denom))?.decimals as number
|
||||
const emissionValue = BN(current.emission_rate).shiftedBy(-decimals).multipliedBy(price)
|
||||
|
||||
return accumulation.plus(emissionValue)
|
||||
}, BN_ZERO)
|
||||
} catch (ex) {
|
||||
return null
|
||||
}
|
||||
}
|
||||
33
src/api/incentives/getUnclaimedRewards.ts
Normal file
33
src/api/incentives/getUnclaimedRewards.ts
Normal file
@ -0,0 +1,33 @@
|
||||
import { cacheFn, unclaimedRewardsCache } from 'api/cache'
|
||||
import { getIncentivesQueryClient } from 'api/cosmwasm-client'
|
||||
import { BNCoin } from 'types/classes/BNCoin'
|
||||
import iterateContractQuery from 'utils/iterateContractQuery'
|
||||
|
||||
export default async function getUnclaimedRewards(
|
||||
chainConfig: ChainConfig,
|
||||
accountId: string,
|
||||
): Promise<BNCoin[]> {
|
||||
try {
|
||||
const client = await getIncentivesQueryClient(chainConfig)
|
||||
const unclaimedRewards = await cacheFn(
|
||||
() =>
|
||||
iterateContractQuery(() =>
|
||||
client.userUnclaimedRewards({
|
||||
user: chainConfig.contracts.creditManager,
|
||||
accountId,
|
||||
}),
|
||||
),
|
||||
unclaimedRewardsCache,
|
||||
`incentives/${accountId}`,
|
||||
60,
|
||||
)
|
||||
|
||||
if (unclaimedRewards.length === 0) return []
|
||||
|
||||
return await Promise.all(
|
||||
unclaimedRewards.map((reward) => new BNCoin({ denom: reward.denom, amount: reward.amount })),
|
||||
)
|
||||
} catch (ex) {
|
||||
return []
|
||||
}
|
||||
}
|
||||
24
src/api/markets/getMarket.ts
Normal file
24
src/api/markets/getMarket.ts
Normal file
@ -0,0 +1,24 @@
|
||||
import { cacheFn, marketCache } from 'api/cache'
|
||||
import { getParamsQueryClient, getRedBankQueryClient } from 'api/cosmwasm-client'
|
||||
import { resolveMarketResponse } from 'utils/resolvers'
|
||||
|
||||
export default async function getMarket(chainConfig: ChainConfig, denom: string): Promise<Market> {
|
||||
return cacheFn(() => fetchMarket(chainConfig, denom), marketCache, denom, 60)
|
||||
}
|
||||
|
||||
async function fetchMarket(chainConfig: ChainConfig, denom: string) {
|
||||
try {
|
||||
const redBankClient = await getRedBankQueryClient(chainConfig)
|
||||
const paramsClient = await getParamsQueryClient(chainConfig)
|
||||
|
||||
const [market, assetParams, assetCap] = await Promise.all([
|
||||
redBankClient.market({ denom }),
|
||||
paramsClient.assetParams({ denom }),
|
||||
paramsClient.totalDeposit({ denom }),
|
||||
])
|
||||
|
||||
return resolveMarketResponse(market, assetParams, assetCap)
|
||||
} catch (ex) {
|
||||
throw ex
|
||||
}
|
||||
}
|
||||
35
src/api/markets/getMarketBorrowings.ts
Normal file
35
src/api/markets/getMarketBorrowings.ts
Normal file
@ -0,0 +1,35 @@
|
||||
import getMarketLiquidities from 'api/markets/getMarketLiquidities'
|
||||
import getMarkets from 'api/markets/getMarkets'
|
||||
import getPrices from 'api/prices/getPrices'
|
||||
import { BN } from 'utils/helpers'
|
||||
|
||||
export default async function getMarketBorrowings(
|
||||
chainConfig: ChainConfig,
|
||||
): Promise<BorrowAsset[]> {
|
||||
const liquidities = await getMarketLiquidities(chainConfig)
|
||||
const borrowEnabledMarkets = (await getMarkets(chainConfig)).filter(
|
||||
(market: Market) => market.borrowEnabled,
|
||||
)
|
||||
const prices = await getPrices(chainConfig)
|
||||
|
||||
const borrow: BorrowAsset[] = borrowEnabledMarkets.map((market) => {
|
||||
const price = prices.find((coin) => coin.denom === market.denom)?.amount ?? '1'
|
||||
const amount = liquidities.find((coin) => coin.denom === market.denom)?.amount ?? '0'
|
||||
const asset = chainConfig.assets.find((asset) => asset.denom === market.denom)!
|
||||
|
||||
return {
|
||||
...asset,
|
||||
borrowRate: market.apy.borrow ?? 0,
|
||||
liquidity: {
|
||||
amount: BN(amount),
|
||||
value: BN(amount).multipliedBy(price),
|
||||
},
|
||||
}
|
||||
})
|
||||
|
||||
if (borrow) {
|
||||
return borrow
|
||||
}
|
||||
|
||||
return new Promise((_, reject) => reject('No data'))
|
||||
}
|
||||
31
src/api/markets/getMarketDebts.ts
Normal file
31
src/api/markets/getMarketDebts.ts
Normal file
@ -0,0 +1,31 @@
|
||||
import { cacheFn, underlyingDebtCache } from 'api/cache'
|
||||
import { getRedBankQueryClient } from 'api/cosmwasm-client'
|
||||
import getMarkets from 'api/markets/getMarkets'
|
||||
import { BNCoin } from 'types/classes/BNCoin'
|
||||
|
||||
export default async function getMarketDebts(chainConfig: ChainConfig): Promise<BNCoin[]> {
|
||||
try {
|
||||
const markets: Market[] = await getMarkets(chainConfig)
|
||||
const redBankQueryClient = await getRedBankQueryClient(chainConfig)
|
||||
|
||||
const debtQueries = markets.map((asset) =>
|
||||
cacheFn(
|
||||
() =>
|
||||
redBankQueryClient.underlyingDebtAmount({
|
||||
denom: asset.denom,
|
||||
amountScaled: asset.debtTotalScaled,
|
||||
}),
|
||||
underlyingDebtCache,
|
||||
`marketDebts/${asset.denom}/amount/${asset.debtTotalScaled}`,
|
||||
60,
|
||||
),
|
||||
)
|
||||
const debtsResults = await Promise.all(debtQueries)
|
||||
|
||||
return debtsResults.map<BNCoin>(
|
||||
(debt, index) => new BNCoin({ denom: markets[index].denom, amount: debt }),
|
||||
)
|
||||
} catch (ex) {
|
||||
throw ex
|
||||
}
|
||||
}
|
||||
23
src/api/markets/getMarketDeposits.ts
Normal file
23
src/api/markets/getMarketDeposits.ts
Normal file
@ -0,0 +1,23 @@
|
||||
import getMarkets from 'api/markets/getMarkets'
|
||||
import getUnderlyingLiquidityAmount from 'api/markets/getMarketUnderlyingLiquidityAmount'
|
||||
import { BNCoin } from 'types/classes/BNCoin'
|
||||
|
||||
export default async function getMarketDeposits(chainConfig: ChainConfig): Promise<BNCoin[]> {
|
||||
try {
|
||||
const markets: Market[] = await getMarkets(chainConfig)
|
||||
const depositQueries = markets.map((market) =>
|
||||
getUnderlyingLiquidityAmount(chainConfig, market),
|
||||
)
|
||||
const depositsResults = await Promise.all(depositQueries)
|
||||
|
||||
return depositsResults.map<BNCoin>(
|
||||
(deposit, index) =>
|
||||
new BNCoin({
|
||||
denom: markets[index].denom,
|
||||
amount: deposit,
|
||||
}),
|
||||
)
|
||||
} catch (ex) {
|
||||
throw ex
|
||||
}
|
||||
}
|
||||
30
src/api/markets/getMarketLiquidities.ts
Normal file
30
src/api/markets/getMarketLiquidities.ts
Normal file
@ -0,0 +1,30 @@
|
||||
import getMarketDebts from 'api/markets/getMarketDebts'
|
||||
import getMarketDeposits from 'api/markets/getMarketDeposits'
|
||||
import { BNCoin } from 'types/classes/BNCoin'
|
||||
|
||||
export default async function getMarketLiquidities(chainConfig: ChainConfig): Promise<BNCoin[]> {
|
||||
const deposits = await getMarketDeposits(chainConfig)
|
||||
const debts = await getMarketDebts(chainConfig)
|
||||
|
||||
const liquidity: BNCoin[] = deposits.map((deposit) => {
|
||||
const debt = debts.find((debt) => debt.denom === deposit.denom)
|
||||
|
||||
if (debt) {
|
||||
return new BNCoin({
|
||||
denom: deposit.denom,
|
||||
amount: deposit.amount.minus(debt.amount).toString(),
|
||||
})
|
||||
}
|
||||
|
||||
return new BNCoin({
|
||||
denom: deposit.denom,
|
||||
amount: '0',
|
||||
})
|
||||
})
|
||||
|
||||
if (liquidity) {
|
||||
return liquidity
|
||||
}
|
||||
|
||||
return new Promise((_, reject) => reject('No data'))
|
||||
}
|
||||
26
src/api/markets/getMarketUnderlyingLiquidityAmount.ts
Normal file
26
src/api/markets/getMarketUnderlyingLiquidityAmount.ts
Normal file
@ -0,0 +1,26 @@
|
||||
import { cacheFn, underlyingLiquidityAmountCache } from 'api/cache'
|
||||
import { getRedBankQueryClient } from 'api/cosmwasm-client'
|
||||
|
||||
export default async function getUnderlyingLiquidityAmount(
|
||||
chainConfig: ChainConfig,
|
||||
market: Market,
|
||||
): Promise<string> {
|
||||
return cacheFn(
|
||||
() => fetchUnderlyingLiquidityAmount(chainConfig, market),
|
||||
underlyingLiquidityAmountCache,
|
||||
`underlyingLiquidity/${market.denom}/amount/${market.collateralTotalScaled}`,
|
||||
60,
|
||||
)
|
||||
}
|
||||
|
||||
async function fetchUnderlyingLiquidityAmount(chainConfig: ChainConfig, market: Market) {
|
||||
try {
|
||||
const client = await getRedBankQueryClient(chainConfig)
|
||||
return await client.underlyingLiquidityAmount({
|
||||
denom: market.denom,
|
||||
amountScaled: market.collateralTotalScaled,
|
||||
})
|
||||
} catch (ex) {
|
||||
throw ex
|
||||
}
|
||||
}
|
||||
59
src/api/markets/getMarkets.ts
Normal file
59
src/api/markets/getMarkets.ts
Normal file
@ -0,0 +1,59 @@
|
||||
import { allParamsCache, cacheFn, marketsCache, totalDepositCache } from 'api/cache'
|
||||
import { getParamsQueryClient, getRedBankQueryClient } from 'api/cosmwasm-client'
|
||||
import {
|
||||
AssetParamsBaseForAddr as AssetParams,
|
||||
TotalDepositResponse,
|
||||
} from 'types/generated/mars-params/MarsParams.types'
|
||||
import { Market as RedBankMarket } from 'types/generated/mars-red-bank/MarsRedBank.types'
|
||||
import { byDenom } from 'utils/array'
|
||||
import iterateContractQuery from 'utils/iterateContractQuery'
|
||||
import { resolveMarketResponse } from 'utils/resolvers'
|
||||
|
||||
export default async function getMarkets(chainConfig: ChainConfig): Promise<Market[]> {
|
||||
try {
|
||||
const redBankClient = await getRedBankQueryClient(chainConfig)
|
||||
const paramsClient = await getParamsQueryClient(chainConfig)
|
||||
|
||||
const marketAssets = chainConfig.assets.filter((asset) => asset.isMarket)
|
||||
|
||||
const capQueries = marketAssets
|
||||
.filter((asset) => asset.isMarket)
|
||||
.map((asset) =>
|
||||
cacheFn(
|
||||
() => paramsClient.totalDeposit({ denom: asset.denom }),
|
||||
totalDepositCache,
|
||||
`chains/${chainConfig.id}/enabledMarkets/${asset.denom}`,
|
||||
60,
|
||||
),
|
||||
)
|
||||
|
||||
const caps = await Promise.all(capQueries)
|
||||
|
||||
const [markets, assetParams, assetCaps] = await Promise.all([
|
||||
cacheFn(
|
||||
() => iterateContractQuery(redBankClient.markets),
|
||||
marketsCache,
|
||||
`chains/${chainConfig.id}/markets`,
|
||||
60,
|
||||
),
|
||||
cacheFn(
|
||||
async () => await iterateContractQuery(paramsClient.allAssetParams),
|
||||
allParamsCache,
|
||||
`chains/${chainConfig.id}/params`,
|
||||
60,
|
||||
),
|
||||
Promise.all(capQueries),
|
||||
])
|
||||
|
||||
return marketAssets.map((asset) =>
|
||||
resolveMarketResponse(
|
||||
markets.find(byDenom(asset.denom)) as RedBankMarket,
|
||||
assetParams.find(byDenom(asset.denom)) as AssetParams,
|
||||
assetCaps.find(byDenom(asset.denom)) as TotalDepositResponse,
|
||||
),
|
||||
)
|
||||
} catch (ex) {
|
||||
console.log(ex)
|
||||
throw ex
|
||||
}
|
||||
}
|
||||
31
src/api/vaults/getVaultAprs.ts
Normal file
31
src/api/vaults/getVaultAprs.ts
Normal file
@ -0,0 +1,31 @@
|
||||
import { aprsCache, aprsCacheResponse, cacheFn } from 'api/cache'
|
||||
|
||||
export default async function getAprs(chainConfig: ChainConfig) {
|
||||
if (!chainConfig.farm) return []
|
||||
try {
|
||||
const response = await cacheFn(
|
||||
() => fetch(chainConfig.endpoints.aprs.vaults),
|
||||
aprsCacheResponse,
|
||||
`${chainConfig.id}/aprsResponse`,
|
||||
60,
|
||||
)
|
||||
|
||||
if (response.ok) {
|
||||
const data: AprResponse = await cacheFn(
|
||||
() => response.json(),
|
||||
aprsCache,
|
||||
`${chainConfig.id}/aprs`,
|
||||
60,
|
||||
)
|
||||
|
||||
return data.vaults.map((aprData) => {
|
||||
const finalApr = aprData.apr.projected_apr * 100
|
||||
return { address: aprData.address, apr: finalApr } as Apr
|
||||
})
|
||||
}
|
||||
|
||||
return []
|
||||
} catch {
|
||||
return []
|
||||
}
|
||||
}
|
||||
@ -1,20 +1,24 @@
|
||||
import getAssetParams from 'api/params/getAssetParams'
|
||||
import getAprs from 'api/vaults/getVaultAprs'
|
||||
import { getVaultConfigs } from 'api/vaults/getVaultConfigs'
|
||||
import { getVaultUtilizations } from 'api/vaults/getVaultUtilizations'
|
||||
import { BN } from 'utils/helpers'
|
||||
import { convertAprToApy } from 'utils/parsers'
|
||||
import { resolveHLSStrategies } from 'utils/resolvers'
|
||||
|
||||
export default async function getVaults(chainConfig: ChainConfig): Promise<Vault[]> {
|
||||
const assetParams = await getAssetParams(chainConfig)
|
||||
const vaultConfigs = await getVaultConfigs(chainConfig)
|
||||
const $vaultUtilizations = getVaultUtilizations(chainConfig, vaultConfigs)
|
||||
const $aprs = getAprs(chainConfig)
|
||||
const vaultMetaDatas = chainConfig.vaults
|
||||
const HLSAssets = assetParams.filter((asset) => asset.credit_manager.hls)
|
||||
const hlsStrategies = resolveHLSStrategies('vault', HLSAssets)
|
||||
|
||||
const vaults: Vault[] = []
|
||||
await $vaultUtilizations.then((vaultUtilizations) => {
|
||||
await Promise.all([$vaultUtilizations, $aprs]).then(([vaultUtilizations, aprs]) => {
|
||||
return vaultConfigs.map((vaultConfig) => {
|
||||
const apr = aprs.find((apr) => apr.address === vaultConfig.addr)
|
||||
const vaultMetaData = vaultMetaDatas.find(
|
||||
(vaultMetaData) => vaultMetaData.address === vaultConfig.addr,
|
||||
)
|
||||
@ -32,6 +36,8 @@ export default async function getVaults(chainConfig: ChainConfig): Promise<Vault
|
||||
)?.utilization.amount || 0,
|
||||
),
|
||||
},
|
||||
apy: apr ? convertAprToApy(apr.apr, 365) : null,
|
||||
apr: apr ? apr.apr : null,
|
||||
ltv: {
|
||||
max: Number(vaultConfig.max_loan_to_value),
|
||||
liq: Number(vaultConfig.liquidation_threshold),
|
||||
|
||||
15
src/api/wallets/getICNS.ts
Normal file
15
src/api/wallets/getICNS.ts
Normal file
@ -0,0 +1,15 @@
|
||||
import { getICNSQueryClient } from 'api/cosmwasm-client'
|
||||
import { ChainInfoID } from 'types/enums/wallet'
|
||||
|
||||
export default async function getICNS(
|
||||
chainConfig: ChainConfig,
|
||||
address?: string,
|
||||
): Promise<ICNSResult | undefined> {
|
||||
if (!address || chainConfig.id !== ChainInfoID.Osmosis1) return
|
||||
try {
|
||||
const icnsQueryClient = await getICNSQueryClient(chainConfig)
|
||||
return icnsQueryClient.primaryName({ address })
|
||||
} catch (ex) {
|
||||
throw ex
|
||||
}
|
||||
}
|
||||
15
src/api/wallets/getWalletBalances.ts
Normal file
15
src/api/wallets/getWalletBalances.ts
Normal file
@ -0,0 +1,15 @@
|
||||
export default async function getWalletBalances(
|
||||
chainConfig: ChainConfig,
|
||||
address: string,
|
||||
): Promise<Coin[]> {
|
||||
const uri = '/cosmos/bank/v1beta1/balances/'
|
||||
|
||||
const response = await fetch(`${chainConfig.endpoints.rest}${uri}${address}`)
|
||||
|
||||
if (response.ok) {
|
||||
const data = await response.json()
|
||||
return data.balances
|
||||
}
|
||||
|
||||
return new Promise((_, reject) => reject('No data'))
|
||||
}
|
||||
@ -1,9 +1,9 @@
|
||||
import { useCallback, useMemo, useState } from 'react'
|
||||
|
||||
import AssetsSelect from 'components/Modals/AssetsSelect'
|
||||
import SearchBar from 'components/common/SearchBar'
|
||||
import Text from 'components/common/Text'
|
||||
import AssetsSelect from 'components/Modals/AssetsSelect'
|
||||
import useMarkets from 'hooks/markets/useMarkets'
|
||||
import useMarketBorrowings from 'hooks/markets/useMarketBorrowings'
|
||||
import useStore from 'store'
|
||||
|
||||
interface Props {
|
||||
@ -14,16 +14,16 @@ interface Props {
|
||||
|
||||
export default function AddVaultAssetsModalContent(props: Props) {
|
||||
const [searchString, setSearchString] = useState<string>('')
|
||||
const markets = useMarkets()
|
||||
const { data: borrowAssets } = useMarketBorrowings()
|
||||
|
||||
const filteredMarkets: Market[] = useMemo(() => {
|
||||
return markets.filter(
|
||||
(market) =>
|
||||
market.asset.name.toLowerCase().includes(searchString.toLowerCase()) ||
|
||||
market.asset.denom.toLowerCase().includes(searchString.toLowerCase()) ||
|
||||
market.asset.symbol.toLowerCase().includes(searchString.toLowerCase()),
|
||||
const filteredBorrowAssets: BorrowAsset[] = useMemo(() => {
|
||||
return borrowAssets.filter(
|
||||
(asset) =>
|
||||
asset.name.toLowerCase().includes(searchString.toLowerCase()) ||
|
||||
asset.denom.toLowerCase().includes(searchString.toLowerCase()) ||
|
||||
asset.symbol.toLowerCase().includes(searchString.toLowerCase()),
|
||||
)
|
||||
}, [markets, searchString])
|
||||
}, [borrowAssets, searchString])
|
||||
|
||||
function onChangeSearchString(value: string) {
|
||||
setSearchString(value)
|
||||
@ -31,21 +31,21 @@ export default function AddVaultAssetsModalContent(props: Props) {
|
||||
|
||||
const [poolAssets, stableAssets] = useMemo(
|
||||
() =>
|
||||
filteredMarkets.reduce(
|
||||
(acc, market) => {
|
||||
filteredBorrowAssets.reduce(
|
||||
(acc, asset) => {
|
||||
if (
|
||||
market.asset.denom === props.vault.denoms.primary ||
|
||||
market.asset.denom === props.vault.denoms.secondary
|
||||
asset.denom === props.vault.denoms.primary ||
|
||||
asset.denom === props.vault.denoms.secondary
|
||||
) {
|
||||
acc[0].push(market.asset)
|
||||
} else if (market.asset.isStable) {
|
||||
acc[1].push(market.asset)
|
||||
acc[0].push(asset)
|
||||
} else if (asset.isStable) {
|
||||
acc[1].push(asset)
|
||||
}
|
||||
return acc
|
||||
},
|
||||
[[], []] as [Asset[], Asset[]],
|
||||
[[], []] as [BorrowAsset[], BorrowAsset[]],
|
||||
),
|
||||
[filteredMarkets, props.vault.denoms.primary, props.vault.denoms.secondary],
|
||||
[filteredBorrowAssets, props.vault.denoms.primary, props.vault.denoms.secondary],
|
||||
)
|
||||
|
||||
const selectedDenoms = useStore((s) => s.addVaultBorrowingsModal?.selectedDenoms)
|
||||
|
||||
@ -1,7 +1,7 @@
|
||||
import { useCallback, useState } from 'react'
|
||||
|
||||
import Modal from 'components/Modals/Modal'
|
||||
import AccountSummaryInModal from 'components/account/AccountSummary/AccountSummaryInModal'
|
||||
import CurrentAccountSummary from 'components/account/CurrentAccountSummary'
|
||||
import Button from 'components/common/Button'
|
||||
import Card from 'components/common/Card'
|
||||
import Divider from 'components/common/Divider'
|
||||
@ -10,7 +10,6 @@ import Text from 'components/common/Text'
|
||||
import TokenInputWithSlider from 'components/common/TokenInput/TokenInputWithSlider'
|
||||
import AssetImage from 'components/common/assets/AssetImage'
|
||||
import { BN_ZERO } from 'constants/math'
|
||||
import useCurrentAccount from 'hooks/accounts/useCurrentAccount'
|
||||
import { BNCoin } from 'types/classes/BNCoin'
|
||||
import { byDenom } from 'utils/array'
|
||||
import { BN } from 'utils/helpers'
|
||||
@ -24,7 +23,6 @@ interface Props {
|
||||
onClose: () => void
|
||||
onChange: (value: BigNumber) => void
|
||||
onAction: (value: BigNumber, isMax: boolean) => void
|
||||
onDebounce: () => void
|
||||
}
|
||||
|
||||
export default function AssetAmountSelectActionModal(props: Props) {
|
||||
@ -37,11 +35,10 @@ export default function AssetAmountSelectActionModal(props: Props) {
|
||||
onClose,
|
||||
onChange,
|
||||
onAction,
|
||||
onDebounce,
|
||||
} = props
|
||||
const [amount, setAmount] = useState(BN_ZERO)
|
||||
const maxAmount = BN(coinBalances.find(byDenom(asset.denom))?.amount ?? 0)
|
||||
const account = useCurrentAccount()
|
||||
|
||||
const handleAmountChange = useCallback(
|
||||
(value: BigNumber) => {
|
||||
setAmount(value)
|
||||
@ -54,7 +51,6 @@ export default function AssetAmountSelectActionModal(props: Props) {
|
||||
onAction(amount, amount.isEqualTo(maxAmount))
|
||||
}, [amount, maxAmount, onAction])
|
||||
|
||||
if (!account) return
|
||||
return (
|
||||
<Modal
|
||||
onClose={onClose}
|
||||
@ -76,7 +72,6 @@ export default function AssetAmountSelectActionModal(props: Props) {
|
||||
<TokenInputWithSlider
|
||||
asset={asset}
|
||||
onChange={handleAmountChange}
|
||||
onDebounce={onDebounce}
|
||||
amount={amount}
|
||||
max={maxAmount}
|
||||
hasSelect
|
||||
@ -92,7 +87,7 @@ export default function AssetAmountSelectActionModal(props: Props) {
|
||||
rightIcon={<ArrowRight />}
|
||||
/>
|
||||
</Card>
|
||||
<AccountSummaryInModal account={account} />
|
||||
<CurrentAccountSummary />
|
||||
</div>
|
||||
</Modal>
|
||||
)
|
||||
|
||||
@ -1,16 +1,15 @@
|
||||
import { RowSelectionState } from '@tanstack/react-table'
|
||||
import { useEffect, useMemo, useState } from 'react'
|
||||
|
||||
import Table from 'components/common/Table'
|
||||
import useAssetSelectColumns from 'components/Modals/AssetsSelect/Columns/useAssetSelectColumns'
|
||||
import Table from 'components/common/Table'
|
||||
import useGetCoinValue from 'hooks/assets/useGetCoinValue'
|
||||
import useMarkets from 'hooks/markets/useMarkets'
|
||||
import useMarketAssets from 'hooks/markets/useMarketAssets'
|
||||
import useStore from 'store'
|
||||
import { BNCoin } from 'types/classes/BNCoin'
|
||||
import { byDenom } from 'utils/array'
|
||||
import { BN } from 'utils/helpers'
|
||||
|
||||
// TODO: Pass the market data directly here instead of the assets
|
||||
interface Props {
|
||||
assets: Asset[]
|
||||
onChangeSelected: (selected: string[]) => void
|
||||
@ -21,11 +20,12 @@ interface Props {
|
||||
export default function AssetsSelect(props: Props) {
|
||||
const { assets, onChangeSelected, selectedDenoms, isBorrow } = props
|
||||
const columns = useAssetSelectColumns(isBorrow)
|
||||
const markets = useMarkets()
|
||||
const { data: markets } = useMarketAssets()
|
||||
const getCoinValue = useGetCoinValue()
|
||||
|
||||
const defaultSelected = useMemo(() => {
|
||||
return assets.reduce(
|
||||
const selectableAssets = assets
|
||||
return selectableAssets.reduce(
|
||||
(acc, asset, index) => {
|
||||
if (selectedDenoms?.includes(asset.denom)) {
|
||||
acc[index] = true
|
||||
@ -48,7 +48,7 @@ export default function AssetsSelect(props: Props) {
|
||||
asset,
|
||||
balance: balancesForAsset?.amount ?? '0',
|
||||
value,
|
||||
market: markets.find((market) => market.asset.denom === asset.denom),
|
||||
market: markets.find((market) => market.denom === asset.denom),
|
||||
}
|
||||
})
|
||||
}, [balances, assets, markets, getCoinValue])
|
||||
|
||||
@ -1,8 +1,8 @@
|
||||
import BigNumber from 'bignumber.js'
|
||||
import { useCallback, useEffect, useMemo, useState } from 'react'
|
||||
|
||||
import Modal from 'components/Modals/Modal'
|
||||
import AccountSummaryInModal from 'components/account/AccountSummary/AccountSummaryInModal'
|
||||
import AccountSummary from 'components/account/AccountSummary'
|
||||
import AssetImage from 'components/common/assets/AssetImage'
|
||||
import Button from 'components/common/Button'
|
||||
import Card from 'components/common/Card'
|
||||
import DisplayCurrency from 'components/common/DisplayCurrency'
|
||||
@ -13,10 +13,10 @@ import Switch from 'components/common/Switch'
|
||||
import Text from 'components/common/Text'
|
||||
import TitleAndSubCell from 'components/common/TitleAndSubCell'
|
||||
import TokenInputWithSlider from 'components/common/TokenInput/TokenInputWithSlider'
|
||||
import AssetImage from 'components/common/assets/AssetImage'
|
||||
import Modal from 'components/Modals/Modal'
|
||||
import { BN_ZERO } from 'constants/math'
|
||||
import useCurrentAccount from 'hooks/accounts/useCurrentAccount'
|
||||
import useMarkets from 'hooks/markets/useMarkets'
|
||||
import useMarketAssets from 'hooks/markets/useMarketAssets'
|
||||
import useAutoLend from 'hooks/useAutoLend'
|
||||
import useHealthComputer from 'hooks/useHealthComputer'
|
||||
import useToggle from 'hooks/useToggle'
|
||||
@ -91,8 +91,7 @@ function BorrowModal(props: Props) {
|
||||
const isAutoLendEnabled = autoLendEnabledAccountIds.includes(account.id)
|
||||
const { computeMaxBorrowAmount } = useHealthComputer(account)
|
||||
const totalDebt = BN(getDebtAmount(modal))
|
||||
const accountDebt = account.debts.find(byDenom(asset.denom))?.amount ?? BN_ZERO
|
||||
const markets = useMarkets()
|
||||
const { data: marketAssets } = useMarketAssets()
|
||||
|
||||
const [depositBalance, lendBalance] = useMemo(
|
||||
() => [
|
||||
@ -102,34 +101,34 @@ function BorrowModal(props: Props) {
|
||||
[account, asset.denom],
|
||||
)
|
||||
|
||||
const accountDebtWithInterest = useMemo(
|
||||
() => getDebtAmountWithInterest(accountDebt, apy),
|
||||
[accountDebt, apy],
|
||||
const totalDebtRepayAmount = useMemo(
|
||||
() => getDebtAmountWithInterest(totalDebt, apy),
|
||||
[totalDebt, apy],
|
||||
)
|
||||
|
||||
const overpayExeedsCap = useMemo(() => {
|
||||
const marketAsset = markets.find((market) => market.asset.denom === asset.denom)
|
||||
const marketAsset = marketAssets.find(byDenom(asset.denom))
|
||||
if (!marketAsset) return
|
||||
const overpayAmount = accountDebtWithInterest.minus(accountDebt)
|
||||
const overpayAmount = totalDebtRepayAmount.minus(totalDebt)
|
||||
const marketCapAfterOverpay = marketAsset.cap.used.plus(overpayAmount)
|
||||
|
||||
return marketAsset.cap.max.isLessThanOrEqualTo(marketCapAfterOverpay)
|
||||
}, [markets, asset.denom, accountDebt, accountDebtWithInterest])
|
||||
}, [marketAssets, asset.denom, totalDebt, totalDebtRepayAmount])
|
||||
|
||||
const maxRepayAmount = useMemo(() => {
|
||||
const maxBalance = repayFromWallet
|
||||
? BN(walletBalances.find(byDenom(asset.denom))?.amount ?? 0)
|
||||
: depositBalance.plus(lendBalance)
|
||||
return isRepay
|
||||
? BigNumber.min(maxBalance, overpayExeedsCap ? accountDebt : accountDebtWithInterest)
|
||||
? BigNumber.min(maxBalance, overpayExeedsCap ? totalDebt : totalDebtRepayAmount)
|
||||
: BN_ZERO
|
||||
}, [
|
||||
depositBalance,
|
||||
lendBalance,
|
||||
isRepay,
|
||||
accountDebtWithInterest,
|
||||
totalDebtRepayAmount,
|
||||
overpayExeedsCap,
|
||||
accountDebt,
|
||||
totalDebt,
|
||||
walletBalances,
|
||||
asset.denom,
|
||||
repayFromWallet,
|
||||
@ -149,7 +148,7 @@ function BorrowModal(props: Props) {
|
||||
repay({
|
||||
accountId: account.id,
|
||||
coin: BNCoin.fromDenomAndBigNumber(asset.denom, amount),
|
||||
accountBalance: amount.isEqualTo(accountDebtWithInterest),
|
||||
accountBalance: amount.isEqualTo(totalDebtRepayAmount),
|
||||
lend: repayFromWallet ? BNCoin.fromDenomAndBigNumber(asset.denom, BN_ZERO) : lend,
|
||||
fromWallet: repayFromWallet,
|
||||
})
|
||||
@ -172,45 +171,23 @@ function BorrowModal(props: Props) {
|
||||
|
||||
const handleChange = useCallback(
|
||||
(newAmount: BigNumber) => {
|
||||
const coin = BNCoin.fromDenomAndBigNumber(asset.denom, newAmount)
|
||||
if (!amount.isEqualTo(newAmount)) setAmount(newAmount)
|
||||
},
|
||||
[amount, setAmount],
|
||||
)
|
||||
|
||||
const onDebounce = useCallback(() => {
|
||||
if (isRepay) {
|
||||
const repayCoin = BNCoin.fromDenomAndBigNumber(
|
||||
asset.denom,
|
||||
amount.isGreaterThan(accountDebt) ? accountDebt : amount,
|
||||
)
|
||||
if (!isRepay) return
|
||||
const repayCoin = coin.amount.isGreaterThan(totalDebt)
|
||||
? BNCoin.fromDenomAndBigNumber(asset.denom, totalDebt)
|
||||
: coin
|
||||
simulateRepay(repayCoin, repayFromWallet)
|
||||
} else {
|
||||
const borrowCoin = BNCoin.fromDenomAndBigNumber(
|
||||
asset.denom,
|
||||
amount.isGreaterThan(max) ? max : amount,
|
||||
)
|
||||
const target = borrowToWallet ? 'wallet' : isAutoLendEnabled ? 'lend' : 'deposit'
|
||||
simulateBorrow(target, borrowCoin)
|
||||
}
|
||||
}, [
|
||||
amount,
|
||||
accountDebt,
|
||||
isRepay,
|
||||
repayFromWallet,
|
||||
max,
|
||||
asset,
|
||||
borrowToWallet,
|
||||
isAutoLendEnabled,
|
||||
simulateBorrow,
|
||||
simulateRepay,
|
||||
])
|
||||
},
|
||||
[amount, asset.denom, isRepay, simulateRepay, totalDebt, repayFromWallet],
|
||||
)
|
||||
|
||||
const maxBorrow = useMemo(() => {
|
||||
const maxBorrowAmount = isRepay
|
||||
? BN_ZERO
|
||||
: computeMaxBorrowAmount(asset.denom, borrowToWallet ? 'wallet' : 'deposit')
|
||||
|
||||
return BigNumber.min(maxBorrowAmount, modal.marketData?.liquidity || 0)
|
||||
return BigNumber.min(maxBorrowAmount, modal.marketData?.liquidity?.amount || 0)
|
||||
}, [asset.denom, borrowToWallet, computeMaxBorrowAmount, isRepay, modal.marketData])
|
||||
|
||||
useEffect(() => {
|
||||
@ -231,6 +208,13 @@ function BorrowModal(props: Props) {
|
||||
setAmount(max)
|
||||
}, [amount, max, handleChange])
|
||||
|
||||
useEffect(() => {
|
||||
if (isRepay) return
|
||||
const coin = BNCoin.fromDenomAndBigNumber(asset.denom, amount.isGreaterThan(max) ? max : amount)
|
||||
const target = borrowToWallet ? 'wallet' : isAutoLendEnabled ? 'lend' : 'deposit'
|
||||
simulateBorrow(target, coin)
|
||||
}, [isRepay, borrowToWallet, isAutoLendEnabled, simulateBorrow, asset, amount, max])
|
||||
|
||||
if (!modal || !asset) return null
|
||||
return (
|
||||
<Modal
|
||||
@ -272,7 +256,7 @@ function BorrowModal(props: Props) {
|
||||
/>
|
||||
</div>
|
||||
<Text size='xs' className='text-white/50' tag='span'>
|
||||
Total Borrowed
|
||||
Borrowed
|
||||
</Text>
|
||||
</div>
|
||||
</>
|
||||
@ -282,7 +266,7 @@ function BorrowModal(props: Props) {
|
||||
<div className='flex gap-2'>
|
||||
<FormattedNumber
|
||||
className='text-xs'
|
||||
amount={modal.marketData?.liquidity.toNumber() ?? 0}
|
||||
amount={modal.marketData?.liquidity?.amount.toNumber() ?? 0}
|
||||
options={{ decimals: asset.decimals, abbreviated: true, suffix: ` ${asset.symbol}` }}
|
||||
animate
|
||||
/>
|
||||
@ -290,7 +274,7 @@ function BorrowModal(props: Props) {
|
||||
className='text-xs'
|
||||
coin={BNCoin.fromDenomAndBigNumber(
|
||||
asset.denom,
|
||||
modal.marketData?.liquidity ?? BN_ZERO,
|
||||
modal.marketData?.liquidity?.amount ?? BN_ZERO,
|
||||
)}
|
||||
parentheses
|
||||
/>
|
||||
@ -309,7 +293,6 @@ function BorrowModal(props: Props) {
|
||||
<TokenInputWithSlider
|
||||
asset={asset}
|
||||
onChange={handleChange}
|
||||
onDebounce={onDebounce}
|
||||
amount={amount}
|
||||
max={max}
|
||||
disabled={max.isZero()}
|
||||
@ -364,7 +347,7 @@ function BorrowModal(props: Props) {
|
||||
rightIcon={<ArrowRight />}
|
||||
/>
|
||||
</Card>
|
||||
<AccountSummaryInModal account={account} />
|
||||
<AccountSummary account={account} />
|
||||
</div>
|
||||
</Modal>
|
||||
)
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
import BigNumber from 'bignumber.js'
|
||||
import { useCallback, useState } from 'react'
|
||||
import { useEffect, useState } from 'react'
|
||||
|
||||
import Button from 'components/common/Button'
|
||||
import Divider from 'components/common/Divider'
|
||||
@ -51,8 +51,9 @@ export default function WithdrawFromAccount(props: Props) {
|
||||
const accountLent = account.lends.find(byDenom(currentAsset.denom))?.amount ?? BN_ZERO
|
||||
const shouldReclaim = amount.isGreaterThan(accountDeposit) && !accountLent.isZero()
|
||||
const isReclaimingMaxAmount = accountLent.isLessThanOrEqualTo(amount.minus(accountDeposit))
|
||||
|
||||
const reclaimAmount = isReclaimingMaxAmount ? amount : amount.minus(accountDeposit)
|
||||
const reclaimAmount = isReclaimingMaxAmount
|
||||
? amount
|
||||
: accountLent.minus(amount).minus(accountDeposit)
|
||||
|
||||
function onChangeAmount(val: BigNumber) {
|
||||
setAmount(val)
|
||||
@ -86,10 +87,17 @@ export default function WithdrawFromAccount(props: Props) {
|
||||
useStore.setState({ fundAndWithdrawModal: null })
|
||||
}
|
||||
|
||||
const onDebounce = useCallback(() => {
|
||||
useEffect(() => {
|
||||
const coin = BNCoin.fromDenomAndBigNumber(currentAsset.denom, withdrawAmount.plus(debtAmount))
|
||||
simulateWithdraw(withdrawWithBorrowing, coin)
|
||||
}, [withdrawWithBorrowing, currentAsset.denom, debtAmount, simulateWithdraw, withdrawAmount])
|
||||
}, [
|
||||
amount,
|
||||
withdrawWithBorrowing,
|
||||
currentAsset.denom,
|
||||
debtAmount,
|
||||
simulateWithdraw,
|
||||
withdrawAmount,
|
||||
])
|
||||
|
||||
return (
|
||||
<>
|
||||
@ -97,7 +105,6 @@ export default function WithdrawFromAccount(props: Props) {
|
||||
<TokenInputWithSlider
|
||||
asset={currentAsset}
|
||||
onChange={onChangeAmount}
|
||||
onDebounce={onDebounce}
|
||||
onChangeAsset={(asset) => {
|
||||
setAmount(BN_ZERO)
|
||||
setWithdrawWithBorrowing(false)
|
||||
|
||||
@ -2,13 +2,13 @@ import React, { useMemo } from 'react'
|
||||
|
||||
import Button from 'components/common/Button'
|
||||
import { ArrowRight } from 'components/common/Icons'
|
||||
import TokenInputWithSlider from 'components/common/TokenInput/TokenInputWithSlider'
|
||||
import LeverageSummary from 'components/Modals/HLS/Deposit/LeverageSummary'
|
||||
import TokenInputWithSlider from 'components/common/TokenInput/TokenInputWithSlider'
|
||||
import { getLeveragedApy } from 'utils/math'
|
||||
|
||||
interface Props {
|
||||
amount: BigNumber
|
||||
borrowMarket: Market
|
||||
asset: BorrowAsset
|
||||
max: BigNumber
|
||||
onChangeAmount: (amount: BigNumber) => void
|
||||
onClickBtn: () => void
|
||||
@ -21,15 +21,15 @@ interface Props {
|
||||
|
||||
export default function Leverage(props: Props) {
|
||||
const apy = useMemo(() => {
|
||||
if (!props.borrowMarket.apy.borrow) return 0
|
||||
return getLeveragedApy(props.baseApy, props.borrowMarket.apy.borrow, props.leverage)
|
||||
}, [props.baseApy, props.borrowMarket.apy.borrow, props.leverage])
|
||||
if (!props.asset.borrowRate) return 0
|
||||
return getLeveragedApy(props.baseApy, props.asset.borrowRate, props.leverage)
|
||||
}, [props.asset.borrowRate, props.baseApy, props.leverage])
|
||||
|
||||
return (
|
||||
<div id='item-1' className='flex-col gap-6 flex justify-between h-full p-4'>
|
||||
<TokenInputWithSlider
|
||||
amount={props.amount}
|
||||
asset={props.borrowMarket.asset}
|
||||
asset={props.asset}
|
||||
max={props.max}
|
||||
onChange={props.onChangeAmount}
|
||||
maxText='Max borrow'
|
||||
@ -40,11 +40,7 @@ export default function Leverage(props: Props) {
|
||||
warningMessages={props.warningMessages}
|
||||
/>
|
||||
<div className='flex flex-col gap-6'>
|
||||
<LeverageSummary
|
||||
asset={props.borrowMarket.asset}
|
||||
positionValue={props.positionValue}
|
||||
apy={apy}
|
||||
/>
|
||||
<LeverageSummary asset={props.asset} positionValue={props.positionValue} apy={apy} />
|
||||
<Button onClick={props.onClickBtn} text='Continue' rightIcon={<ArrowRight />} />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -1,7 +1,7 @@
|
||||
import React, { useMemo } from 'react'
|
||||
|
||||
import SummaryItems from 'components/common/SummaryItems'
|
||||
import useMarket from 'hooks/markets/useMarket'
|
||||
import useBorrowAsset from 'hooks/useBorrowAsset'
|
||||
|
||||
interface Props {
|
||||
asset: Asset
|
||||
@ -10,7 +10,7 @@ interface Props {
|
||||
}
|
||||
|
||||
export default function LeverageSummary(props: Props) {
|
||||
const market = useMarket(props.asset.denom)
|
||||
const borrowAsset = useBorrowAsset(props.asset.denom)
|
||||
|
||||
const items: SummaryItem[] = useMemo(() => {
|
||||
return [
|
||||
@ -21,7 +21,7 @@ export default function LeverageSummary(props: Props) {
|
||||
},
|
||||
{
|
||||
title: `Borrow APR ${props.asset.symbol}`,
|
||||
amount: market?.apy.borrow || 0,
|
||||
amount: borrowAsset?.borrowRate || 0,
|
||||
options: { suffix: '%', minDecimals: 2, maxDecimals: 2 },
|
||||
},
|
||||
{
|
||||
@ -30,7 +30,7 @@ export default function LeverageSummary(props: Props) {
|
||||
options: { prefix: '$' },
|
||||
},
|
||||
]
|
||||
}, [market?.apy.borrow, props.apy, props.asset.symbol, props.positionValue])
|
||||
}, [borrowAsset?.borrowRate, props.apy, props.asset.symbol, props.positionValue])
|
||||
|
||||
return <SummaryItems items={items} />
|
||||
}
|
||||
|
||||
@ -1,4 +1,5 @@
|
||||
import classNames from 'classnames'
|
||||
import React from 'react'
|
||||
|
||||
import DisplayCurrency from 'components/common/DisplayCurrency'
|
||||
import { ExclamationMarkTriangle } from 'components/common/Icons'
|
||||
@ -39,10 +40,8 @@ export function CollateralSubTitle(props: CollateralSubTitleProps) {
|
||||
if (!props.isOpen && props.amount.isZero()) {
|
||||
return (
|
||||
<div className='flex gap-2'>
|
||||
<div className='w-6'>
|
||||
<ExclamationMarkTriangle className='text-warning' />
|
||||
</div>
|
||||
<Text className='mt-1 text-warning' size='xs' tag='span'>
|
||||
<ExclamationMarkTriangle width={24} className='text-warning' />
|
||||
<Text className='text-warning mt-1' size='xs' tag='span'>
|
||||
You have not provided any collateral.
|
||||
</Text>
|
||||
</div>
|
||||
@ -112,10 +111,8 @@ export function SelectAccountSubTitle(props: SelectAccountSubTitleProps) {
|
||||
if (!props.selectedAccountId && props.isSummaryOpen) {
|
||||
return (
|
||||
<div className='flex gap-2'>
|
||||
<div className='w-6'>
|
||||
<ExclamationMarkTriangle className='text-warning' />
|
||||
</div>
|
||||
<Text className='mt-1 text-warning' size='xs' tag='span'>
|
||||
<ExclamationMarkTriangle width={24} className='text-warning' />
|
||||
<Text className='text-warning mt-1' size='xs' tag='span'>
|
||||
You need to {props.type} an account
|
||||
</Text>
|
||||
</div>
|
||||
|
||||
@ -4,12 +4,13 @@ import Button from 'components/common/Button'
|
||||
import { ArrowRight } from 'components/common/Icons'
|
||||
import AssetSummary from 'components/Modals/HLS/Deposit/Summary/AssetSummary'
|
||||
import YourPosition from 'components/Modals/HLS/Deposit/Summary/YourPosition'
|
||||
import useBorrowAsset from 'hooks/useBorrowAsset'
|
||||
import { BNCoin } from 'types/classes/BNCoin'
|
||||
|
||||
interface Props {
|
||||
apy: number
|
||||
borrowAmount: BigNumber
|
||||
borrowMarket: Market
|
||||
borrowAsset: Asset
|
||||
collateralAsset: Asset
|
||||
depositAmount: BigNumber
|
||||
leverage: number
|
||||
@ -19,14 +20,18 @@ interface Props {
|
||||
}
|
||||
|
||||
export default function Summary(props: Props) {
|
||||
const borrowAsset = useBorrowAsset(props.borrowAsset.denom)
|
||||
|
||||
if (!borrowAsset) return null
|
||||
|
||||
return (
|
||||
<div id='item-3' className='p-4 flex flex-col gap-4'>
|
||||
<AssetSummary asset={props.collateralAsset} amount={props.depositAmount} />
|
||||
<AssetSummary asset={props.borrowMarket.asset} amount={props.borrowAmount} isBorrow />
|
||||
<AssetSummary asset={borrowAsset} amount={props.borrowAmount} isBorrow />
|
||||
<YourPosition
|
||||
positionValue={BNCoin.fromDenomAndBigNumber('usd', props.positionValue)}
|
||||
baseApy={props.apy || 0}
|
||||
borrowRate={props.borrowMarket.apy.borrow || 0}
|
||||
borrowRate={borrowAsset.borrowRate || 0}
|
||||
leverage={props.leverage}
|
||||
/>
|
||||
<Button
|
||||
|
||||
@ -13,7 +13,7 @@ import useStore from 'store'
|
||||
import { isAccountEmpty } from 'utils/accounts'
|
||||
|
||||
interface Props {
|
||||
borrowMarket: Market
|
||||
borrowAsset: BorrowAsset
|
||||
collateralAsset: Asset
|
||||
vaultAddress: string | null
|
||||
strategy?: HLSStrategy
|
||||
@ -42,7 +42,7 @@ export default function Controller(props: Props) {
|
||||
walletCollateralAsset={walletCollateralAsset}
|
||||
vault={vault}
|
||||
collateralAsset={props.collateralAsset}
|
||||
borrowMarket={props.borrowMarket}
|
||||
borrowAsset={props.borrowAsset}
|
||||
emptyHlsAccounts={emptyHlsAccounts}
|
||||
hlsAccounts={hlsAccounts}
|
||||
isOpen={isOpen}
|
||||
@ -57,7 +57,7 @@ export default function Controller(props: Props) {
|
||||
<StakingContent
|
||||
walletCollateralAsset={walletCollateralAsset}
|
||||
collateralAsset={props.collateralAsset}
|
||||
borrowMarket={props.borrowMarket}
|
||||
borrowAsset={props.borrowAsset}
|
||||
emptyHlsAccounts={emptyHlsAccounts}
|
||||
hlsAccounts={hlsAccounts}
|
||||
isOpen={isOpen}
|
||||
@ -73,7 +73,7 @@ export default function Controller(props: Props) {
|
||||
}
|
||||
|
||||
interface ContentProps {
|
||||
borrowMarket: Market
|
||||
borrowAsset: BorrowAsset
|
||||
collateralAsset: Asset
|
||||
emptyHlsAccounts: Account[]
|
||||
hlsAccounts: Account[]
|
||||
@ -102,14 +102,14 @@ function Vault(props: VaultContentProps) {
|
||||
} = useVaultController({
|
||||
vault: props.vault,
|
||||
collateralAsset: props.collateralAsset,
|
||||
borrowMarket: props.borrowMarket,
|
||||
borrowAsset: props.borrowAsset,
|
||||
selectedAccount: props.selectedAccount,
|
||||
})
|
||||
|
||||
const items = useAccordionItems({
|
||||
apy: props.vault.apy || 0,
|
||||
borrowAmount,
|
||||
borrowMarket: props.borrowMarket,
|
||||
borrowAsset: props.borrowAsset,
|
||||
collateralAsset: props.collateralAsset,
|
||||
depositAmount,
|
||||
emptyHlsAccounts: props.emptyHlsAccounts,
|
||||
@ -148,13 +148,13 @@ function StakingContent(props: StakingContentProps) {
|
||||
execute,
|
||||
} = useStakingController({
|
||||
collateralAsset: props.collateralAsset,
|
||||
borrowMarket: props.borrowMarket,
|
||||
borrowAsset: props.borrowAsset,
|
||||
selectedAccount: props.selectedAccount,
|
||||
})
|
||||
|
||||
const items = useAccordionItems({
|
||||
borrowAmount,
|
||||
borrowMarket: props.borrowMarket,
|
||||
borrowAsset: props.borrowAsset,
|
||||
collateralAsset: props.collateralAsset,
|
||||
depositAmount,
|
||||
emptyHlsAccounts: props.emptyHlsAccounts,
|
||||
|
||||
@ -26,7 +26,7 @@ import {
|
||||
interface Props {
|
||||
apy: number
|
||||
borrowAmount: BigNumber
|
||||
borrowMarket: Market
|
||||
borrowAsset: BorrowAsset
|
||||
collateralAsset: Asset
|
||||
depositAmount: BigNumber
|
||||
emptyHlsAccounts: Account[]
|
||||
@ -56,24 +56,18 @@ export default function useAccordionItems(props: Props) {
|
||||
}, [props.strategy])
|
||||
|
||||
const borrowLiquidity = useMemo(
|
||||
() => props.borrowMarket.liquidity || BN_ZERO,
|
||||
[props.borrowMarket.liquidity],
|
||||
() => props.borrowAsset.liquidity?.amount || BN_ZERO,
|
||||
[props.borrowAsset.liquidity?.amount],
|
||||
)
|
||||
|
||||
const additionalDepositFromSwap = useMemo(() => {
|
||||
const value = getCoinValue(
|
||||
BNCoin.fromDenomAndBigNumber(props.borrowMarket.asset.denom, props.borrowAmount),
|
||||
BNCoin.fromDenomAndBigNumber(props.borrowAsset.denom, props.borrowAmount),
|
||||
prices,
|
||||
assets,
|
||||
)
|
||||
return getCoinAmount(props.collateralAsset.denom, value, prices, assets)
|
||||
}, [
|
||||
assets,
|
||||
prices,
|
||||
props.borrowAmount,
|
||||
props.borrowMarket.asset.denom,
|
||||
props.collateralAsset.denom,
|
||||
])
|
||||
}, [assets, prices, props.borrowAmount, props.borrowAsset.denom, props.collateralAsset.denom])
|
||||
|
||||
const collateralWarningMessages = useMemo(() => {
|
||||
const messages: string[] = []
|
||||
@ -102,23 +96,16 @@ export default function useAccordionItems(props: Props) {
|
||||
|
||||
if (props.borrowAmount.isGreaterThan(props.maxBorrowAmount)) {
|
||||
messages.push(
|
||||
getHealthFactorMessage(
|
||||
props.borrowMarket.asset.denom,
|
||||
props.maxBorrowAmount,
|
||||
'borrow',
|
||||
assets,
|
||||
),
|
||||
getHealthFactorMessage(props.borrowAsset.denom, props.maxBorrowAmount, 'borrow', assets),
|
||||
)
|
||||
}
|
||||
|
||||
if (props.borrowAmount.isGreaterThan(borrowLiquidity)) {
|
||||
messages.push(getLiquidityMessage(props.borrowMarket.asset.denom, borrowLiquidity, assets))
|
||||
messages.push(getLiquidityMessage(props.borrowAsset.denom, borrowLiquidity, assets))
|
||||
}
|
||||
|
||||
if (additionalDepositFromSwap.plus(props.depositAmount).isGreaterThan(props.maxBorrowAmount)) {
|
||||
messages.push(
|
||||
getDepositCapMessage(props.borrowMarket.asset.denom, depositCapLeft, 'borrow', assets),
|
||||
)
|
||||
messages.push(getDepositCapMessage(props.borrowAsset.denom, depositCapLeft, 'borrow', assets))
|
||||
}
|
||||
|
||||
return messages
|
||||
@ -128,7 +115,7 @@ export default function useAccordionItems(props: Props) {
|
||||
borrowLiquidity,
|
||||
depositCapLeft,
|
||||
props.borrowAmount,
|
||||
props.borrowMarket.asset.denom,
|
||||
props.borrowAsset.denom,
|
||||
props.depositAmount,
|
||||
props.maxBorrowAmount,
|
||||
])
|
||||
@ -173,7 +160,7 @@ export default function useAccordionItems(props: Props) {
|
||||
<Leverage
|
||||
leverage={props.leverage}
|
||||
amount={props.borrowAmount}
|
||||
borrowMarket={props.borrowMarket}
|
||||
asset={props.borrowAsset}
|
||||
onChangeAmount={props.onChangeDebt}
|
||||
onClickBtn={() => props.toggleIsOpen(2)}
|
||||
max={props.maxBorrowAmount}
|
||||
@ -241,7 +228,7 @@ export default function useAccordionItems(props: Props) {
|
||||
leverage={props.leverage}
|
||||
positionValue={props.positionValue}
|
||||
collateralAsset={props.collateralAsset}
|
||||
borrowMarket={props.borrowMarket}
|
||||
borrowAsset={props.borrowAsset}
|
||||
apy={props.apy}
|
||||
onClickBtn={props.execute}
|
||||
disabled={
|
||||
|
||||
@ -10,17 +10,17 @@ import { SWAP_FEE_BUFFER } from 'utils/constants'
|
||||
import { BN } from 'utils/helpers'
|
||||
|
||||
interface Props {
|
||||
borrowMarket: Market
|
||||
borrowAsset: Asset
|
||||
collateralAsset: Asset
|
||||
selectedAccount: Account
|
||||
}
|
||||
|
||||
export default function useStakingController(props: Props) {
|
||||
const { collateralAsset, borrowMarket, selectedAccount } = props
|
||||
const { collateralAsset, borrowAsset, selectedAccount } = props
|
||||
const addToStakingStrategy = useStore((s) => s.addToStakingStrategy)
|
||||
|
||||
const { data: swapValueLoss } = useSwapValueLoss(
|
||||
props.borrowMarket.asset.denom,
|
||||
props.borrowAsset.denom,
|
||||
props.collateralAsset.denom,
|
||||
)
|
||||
const {
|
||||
@ -33,39 +33,34 @@ export default function useStakingController(props: Props) {
|
||||
actions,
|
||||
} = useDepositHlsVault({
|
||||
collateralDenom: collateralAsset.denom,
|
||||
borrowDenom: borrowMarket.asset.denom,
|
||||
borrowDenom: borrowAsset.denom,
|
||||
})
|
||||
|
||||
const { updatedAccount, addDeposits } = useUpdatedAccount(selectedAccount)
|
||||
const { computeMaxBorrowAmount } = useHealthComputer(updatedAccount)
|
||||
|
||||
const maxBorrowAmount = useMemo(() => {
|
||||
return computeMaxBorrowAmount(props.borrowMarket.asset.denom, {
|
||||
return computeMaxBorrowAmount(props.borrowAsset.denom, {
|
||||
swap: {
|
||||
denom_out: props.collateralAsset.denom,
|
||||
slippage: BN(swapValueLoss).plus(SWAP_FEE_BUFFER).toString(),
|
||||
},
|
||||
})
|
||||
}, [
|
||||
computeMaxBorrowAmount,
|
||||
props.borrowMarket.asset.denom,
|
||||
props.collateralAsset.denom,
|
||||
swapValueLoss,
|
||||
])
|
||||
}, [computeMaxBorrowAmount, props.borrowAsset.denom, props.collateralAsset.denom, swapValueLoss])
|
||||
|
||||
const execute = useCallback(() => {
|
||||
useStore.setState({ hlsModal: null })
|
||||
addToStakingStrategy({
|
||||
actions,
|
||||
accountId: selectedAccount.id,
|
||||
borrowCoin: BNCoin.fromDenomAndBigNumber(borrowMarket.asset.denom, borrowAmount),
|
||||
borrowCoin: BNCoin.fromDenomAndBigNumber(borrowAsset.denom, borrowAmount),
|
||||
depositCoin: BNCoin.fromDenomAndBigNumber(collateralAsset.denom, depositAmount),
|
||||
})
|
||||
}, [
|
||||
actions,
|
||||
addToStakingStrategy,
|
||||
borrowAmount,
|
||||
borrowMarket.asset.denom,
|
||||
borrowAsset.denom,
|
||||
collateralAsset.denom,
|
||||
depositAmount,
|
||||
selectedAccount.id,
|
||||
|
||||
@ -8,14 +8,14 @@ import useStore from 'store'
|
||||
import { BNCoin } from 'types/classes/BNCoin'
|
||||
|
||||
interface Props {
|
||||
borrowMarket: Market
|
||||
borrowAsset: Asset
|
||||
collateralAsset: Asset
|
||||
selectedAccount: Account
|
||||
vault: Vault
|
||||
}
|
||||
|
||||
export default function useVaultController(props: Props) {
|
||||
const { vault, collateralAsset, borrowMarket, selectedAccount } = props
|
||||
const { vault, collateralAsset, borrowAsset, selectedAccount } = props
|
||||
|
||||
const depositIntoVault = useStore((s) => s.depositIntoVault)
|
||||
|
||||
@ -28,14 +28,14 @@ export default function useVaultController(props: Props) {
|
||||
positionValue,
|
||||
} = useDepositHlsVault({
|
||||
collateralDenom: collateralAsset.denom,
|
||||
borrowDenom: borrowMarket.asset.denom,
|
||||
borrowDenom: borrowAsset.denom,
|
||||
})
|
||||
|
||||
const { actions } = useDepositVault({
|
||||
vault,
|
||||
reclaims: [],
|
||||
deposits: [BNCoin.fromDenomAndBigNumber(collateralAsset.denom, depositAmount)],
|
||||
borrowings: [BNCoin.fromDenomAndBigNumber(borrowMarket.asset.denom, borrowAmount)],
|
||||
borrowings: [BNCoin.fromDenomAndBigNumber(borrowAsset.denom, borrowAmount)],
|
||||
kind: 'high_levered_strategy',
|
||||
})
|
||||
|
||||
@ -43,17 +43,17 @@ export default function useVaultController(props: Props) {
|
||||
const { computeMaxBorrowAmount } = useHealthComputer(updatedAccount)
|
||||
|
||||
const maxBorrowAmount = useMemo(() => {
|
||||
return computeMaxBorrowAmount(props.borrowMarket.asset.denom, {
|
||||
return computeMaxBorrowAmount(props.borrowAsset.denom, {
|
||||
vault: { address: props.vault?.address },
|
||||
}).plus(borrowAmount)
|
||||
}, [borrowAmount, computeMaxBorrowAmount, props.borrowMarket.asset.denom, props.vault?.address])
|
||||
}, [borrowAmount, computeMaxBorrowAmount, props.borrowAsset.denom, props.vault?.address])
|
||||
|
||||
const execute = useCallback(() => {
|
||||
depositIntoVault({
|
||||
accountId: selectedAccount.id,
|
||||
actions,
|
||||
deposits: [BNCoin.fromDenomAndBigNumber(collateralAsset.denom, depositAmount)],
|
||||
borrowings: [BNCoin.fromDenomAndBigNumber(borrowMarket.asset.denom, borrowAmount)],
|
||||
borrowings: [BNCoin.fromDenomAndBigNumber(borrowAsset.denom, borrowAmount)],
|
||||
isCreate: true,
|
||||
kind: 'high_levered_strategy',
|
||||
})
|
||||
@ -63,7 +63,7 @@ export default function useVaultController(props: Props) {
|
||||
borrowAmount,
|
||||
depositAmount,
|
||||
depositIntoVault,
|
||||
borrowMarket.asset.denom,
|
||||
borrowAsset.denom,
|
||||
collateralAsset.denom,
|
||||
selectedAccount.id,
|
||||
])
|
||||
@ -75,12 +75,12 @@ export default function useVaultController(props: Props) {
|
||||
simulateVaultDeposit(
|
||||
vault.address,
|
||||
[BNCoin.fromDenomAndBigNumber(collateralAsset.denom, amount)],
|
||||
[BNCoin.fromDenomAndBigNumber(borrowMarket.asset.denom, borrowAmount)],
|
||||
[BNCoin.fromDenomAndBigNumber(borrowAsset.denom, borrowAmount)],
|
||||
)
|
||||
},
|
||||
[
|
||||
borrowAmount,
|
||||
borrowMarket,
|
||||
borrowAsset,
|
||||
collateralAsset,
|
||||
vault.address,
|
||||
setDepositAmount,
|
||||
@ -95,11 +95,11 @@ export default function useVaultController(props: Props) {
|
||||
simulateVaultDeposit(
|
||||
vault.address,
|
||||
[BNCoin.fromDenomAndBigNumber(collateralAsset.denom, depositAmount)],
|
||||
[BNCoin.fromDenomAndBigNumber(borrowMarket.asset.denom, amount)],
|
||||
[BNCoin.fromDenomAndBigNumber(borrowAsset.denom, amount)],
|
||||
)
|
||||
},
|
||||
[
|
||||
borrowMarket,
|
||||
borrowAsset,
|
||||
collateralAsset,
|
||||
depositAmount,
|
||||
vault.address,
|
||||
|
||||
@ -1,8 +1,8 @@
|
||||
import React, { useCallback, useMemo, useState } from 'react'
|
||||
|
||||
import Button from 'components/common/Button'
|
||||
import TokenInputWithSlider from 'components/common/TokenInput/TokenInputWithSlider'
|
||||
import LeverageSummary from 'components/Modals/HLS/Deposit/LeverageSummary'
|
||||
import TokenInputWithSlider from 'components/common/TokenInput/TokenInputWithSlider'
|
||||
import { DEFAULT_SETTINGS } from 'constants/defaultSettings'
|
||||
import { LocalStorageKeys } from 'constants/localStorageKeys'
|
||||
import { BN_ZERO } from 'constants/math'
|
||||
@ -23,7 +23,7 @@ import { getDepositCapMessage, getHealthFactorMessage, getLiquidityMessage } fro
|
||||
interface Props {
|
||||
account: HLSAccountWithStrategy
|
||||
action: HlsStakingManageAction
|
||||
borrowMarket: Market
|
||||
borrowAsset: BorrowAsset
|
||||
collateralAsset: Asset
|
||||
}
|
||||
|
||||
@ -42,24 +42,19 @@ export default function ChangeLeverage(props: Props) {
|
||||
const changeHlsStakingLeverage = useStore((s) => s.changeHlsStakingLeverage)
|
||||
const { computeMaxBorrowAmount } = useHealthComputer(props.account)
|
||||
const previousDebt: BigNumber = useMemo(
|
||||
() => props.account.debts.find(byDenom(props.borrowMarket.asset.denom))?.amount || BN_ZERO,
|
||||
[props.account.debts, props.borrowMarket.asset.denom],
|
||||
() => props.account.debts.find(byDenom(props.borrowAsset.denom))?.amount || BN_ZERO,
|
||||
[props.account.debts, props.borrowAsset.denom],
|
||||
)
|
||||
|
||||
const [currentDebt, setAmount] = useState(previousDebt)
|
||||
const maxBorrowAmount = useMemo(() => {
|
||||
return computeMaxBorrowAmount(props.borrowMarket.asset.denom, {
|
||||
return computeMaxBorrowAmount(props.borrowAsset.denom, {
|
||||
swap: {
|
||||
denom_out: props.collateralAsset.denom,
|
||||
slippage: SWAP_FEE_BUFFER.toString(),
|
||||
},
|
||||
}).plus(previousDebt)
|
||||
}, [
|
||||
computeMaxBorrowAmount,
|
||||
previousDebt,
|
||||
props.borrowMarket.asset.denom,
|
||||
props.collateralAsset.denom,
|
||||
])
|
||||
}, [computeMaxBorrowAmount, previousDebt, props.borrowAsset.denom, props.collateralAsset.denom])
|
||||
|
||||
const onChangeAmount = useCallback(
|
||||
(currentDebt: BigNumber) => {
|
||||
@ -67,22 +62,19 @@ export default function ChangeLeverage(props: Props) {
|
||||
if (currentDebt.isLessThan(previousDebt)) {
|
||||
simulateHlsStakingWithdraw(
|
||||
props.collateralAsset.denom,
|
||||
props.borrowMarket.asset.denom,
|
||||
props.borrowAsset.denom,
|
||||
previousDebt.minus(currentDebt),
|
||||
)
|
||||
} else {
|
||||
simulateHlsStakingDeposit(
|
||||
BNCoin.fromDenomAndBigNumber(props.collateralAsset.denom, BN_ZERO),
|
||||
BNCoin.fromDenomAndBigNumber(
|
||||
props.borrowMarket.asset.denom,
|
||||
currentDebt.minus(previousDebt),
|
||||
),
|
||||
BNCoin.fromDenomAndBigNumber(props.borrowAsset.denom, currentDebt.minus(previousDebt)),
|
||||
)
|
||||
}
|
||||
},
|
||||
[
|
||||
previousDebt,
|
||||
props.borrowMarket.asset.denom,
|
||||
props.borrowAsset.denom,
|
||||
props.collateralAsset.denom,
|
||||
simulateHlsStakingDeposit,
|
||||
simulateHlsStakingWithdraw,
|
||||
@ -106,7 +98,7 @@ export default function ChangeLeverage(props: Props) {
|
||||
previousDebt,
|
||||
currentDebt,
|
||||
props.collateralAsset.denom,
|
||||
props.borrowMarket.asset.denom,
|
||||
props.borrowAsset.denom,
|
||||
slippage,
|
||||
prices,
|
||||
assets,
|
||||
@ -116,7 +108,7 @@ export default function ChangeLeverage(props: Props) {
|
||||
currentDebt,
|
||||
previousDebt,
|
||||
props.collateralAsset.denom,
|
||||
props.borrowMarket.asset.denom,
|
||||
props.borrowAsset.denom,
|
||||
props.account.id,
|
||||
slippage,
|
||||
prices,
|
||||
@ -135,22 +127,22 @@ export default function ChangeLeverage(props: Props) {
|
||||
)
|
||||
|
||||
const apy = useMemo(() => {
|
||||
if (!props.borrowMarket.apy.borrow || !props.account.strategy.apy) return 0
|
||||
return getLeveragedApy(props.account.strategy.apy, props.borrowMarket.apy.borrow, leverage)
|
||||
}, [leverage, props.account.strategy.apy, props.borrowMarket.apy.borrow])
|
||||
if (!props.borrowAsset.borrowRate || !props.account.strategy.apy) return 0
|
||||
return getLeveragedApy(props.account.strategy.apy, props.borrowAsset.borrowRate, leverage)
|
||||
}, [leverage, props.account.strategy.apy, props.borrowAsset.borrowRate])
|
||||
|
||||
const warningMessages = useMemo(() => {
|
||||
const messages: string[] = []
|
||||
|
||||
const borrowLiquidity = props.borrowMarket.liquidity || BN_ZERO
|
||||
const borrowLiquidity = props.borrowAsset.liquidity?.amount || BN_ZERO
|
||||
|
||||
if (borrowLiquidity.isLessThan(currentDebt.minus(previousDebt))) {
|
||||
messages.push(getLiquidityMessage(props.borrowMarket.asset.denom, borrowLiquidity, assets))
|
||||
messages.push(getLiquidityMessage(props.borrowAsset.denom, borrowLiquidity, assets))
|
||||
}
|
||||
|
||||
if (maxBorrowAmount.isLessThan(currentDebt)) {
|
||||
messages.push(
|
||||
getHealthFactorMessage(props.borrowMarket.asset.denom, maxBorrowAmount, 'borrow', assets),
|
||||
getHealthFactorMessage(props.borrowAsset.denom, maxBorrowAmount, 'borrow', assets),
|
||||
)
|
||||
}
|
||||
|
||||
@ -168,8 +160,8 @@ export default function ChangeLeverage(props: Props) {
|
||||
depositCapLeft,
|
||||
maxBorrowAmount,
|
||||
previousDebt,
|
||||
props.borrowMarket.asset.denom,
|
||||
props.borrowMarket.liquidity,
|
||||
props.borrowAsset.denom,
|
||||
props.borrowAsset.liquidity?.amount,
|
||||
props.collateralAsset.denom,
|
||||
])
|
||||
|
||||
@ -177,7 +169,7 @@ export default function ChangeLeverage(props: Props) {
|
||||
<>
|
||||
<TokenInputWithSlider
|
||||
amount={currentDebt}
|
||||
asset={props.borrowMarket.asset}
|
||||
asset={props.borrowAsset}
|
||||
max={maxBorrowAmount}
|
||||
onChange={onChangeAmount}
|
||||
maxText='Max borrow'
|
||||
@ -188,7 +180,7 @@ export default function ChangeLeverage(props: Props) {
|
||||
warningMessages={warningMessages}
|
||||
/>
|
||||
<div className='flex flex-col gap-6'>
|
||||
<LeverageSummary asset={props.borrowMarket.asset} positionValue={positionValue} apy={apy} />
|
||||
<LeverageSummary asset={props.borrowAsset} positionValue={positionValue} apy={apy} />
|
||||
<Button
|
||||
onClick={handleOnClick}
|
||||
text='Confirm'
|
||||
|
||||
@ -10,7 +10,7 @@ import TokenInputWithSlider from 'components/common/TokenInput/TokenInputWithSli
|
||||
import { BN_ZERO } from 'constants/math'
|
||||
import useAllAssets from 'hooks/assets/useAllAssets'
|
||||
import useDepositActions from 'hooks/hls/useDepositActions'
|
||||
import useMarket from 'hooks/markets/useMarket'
|
||||
import useBorrowAsset from 'hooks/useBorrowAsset'
|
||||
import useCurrentWalletBalance from 'hooks/useCurrentWalletBalance'
|
||||
import useHealthComputer from 'hooks/useHealthComputer'
|
||||
import usePrices from 'hooks/usePrices'
|
||||
@ -32,7 +32,7 @@ import {
|
||||
interface Props {
|
||||
account: HLSAccountWithStrategy
|
||||
action: HlsStakingManageAction
|
||||
borrowMarket: Market
|
||||
borrowAsset: BorrowAsset
|
||||
collateralAsset: Asset
|
||||
}
|
||||
|
||||
@ -48,7 +48,7 @@ export default function Deposit(props: Props) {
|
||||
useCurrentWalletBalance(props.collateralAsset.denom)?.amount || '0',
|
||||
)
|
||||
const addToStakingStrategy = useStore((s) => s.addToStakingStrategy)
|
||||
const borrowRate = useMarket(props.borrowMarket.asset.denom)?.apy.borrow || 0
|
||||
const borrowRate = useBorrowAsset(props.borrowAsset.denom)?.borrowRate || 0
|
||||
|
||||
const currentLeverage = useMemo(
|
||||
() => calculateAccountLeverage(props.account, prices, assets).toNumber(),
|
||||
@ -72,10 +72,10 @@ export default function Deposit(props: Props) {
|
||||
const borrowCoin = useMemo(
|
||||
() =>
|
||||
BNCoin.fromDenomAndBigNumber(
|
||||
props.borrowMarket.asset.denom,
|
||||
addedDebts.find(byDenom(props.borrowMarket.asset.denom))?.amount || BN_ZERO,
|
||||
props.borrowAsset.denom,
|
||||
addedDebts.find(byDenom(props.borrowAsset.denom))?.amount || BN_ZERO,
|
||||
),
|
||||
[addedDebts, props.borrowMarket.asset.denom],
|
||||
[addedDebts, props.borrowAsset.denom],
|
||||
)
|
||||
|
||||
const warningMessages = useMemo(() => {
|
||||
@ -105,22 +105,22 @@ export default function Deposit(props: Props) {
|
||||
])
|
||||
|
||||
const maxBorrowAmount = useMemo(
|
||||
() => computeMaxBorrowAmount(props.borrowMarket.asset.denom, 'deposit'),
|
||||
[computeMaxBorrowAmount, props.borrowMarket.asset.denom],
|
||||
() => computeMaxBorrowAmount(props.borrowAsset.denom, 'deposit'),
|
||||
[computeMaxBorrowAmount, props.borrowAsset.denom],
|
||||
)
|
||||
|
||||
const borrowWarningMessages = useMemo(() => {
|
||||
let messages: string[] = []
|
||||
if (borrowCoin.amount.isGreaterThan(maxBorrowAmount)) {
|
||||
messages.push(
|
||||
getHealthFactorMessage(props.borrowMarket.asset.denom, maxBorrowAmount, 'borrow', assets),
|
||||
getHealthFactorMessage(props.borrowAsset.denom, maxBorrowAmount, 'borrow', assets),
|
||||
)
|
||||
}
|
||||
|
||||
const borrowLiquidity = props.borrowMarket.liquidity || BN_ZERO
|
||||
const borrowLiquidity = props.borrowAsset.liquidity?.amount || BN_ZERO
|
||||
|
||||
if (borrowCoin.amount.isGreaterThan(borrowLiquidity)) {
|
||||
messages.push(getLiquidityMessage(props.borrowMarket.asset.denom, borrowLiquidity, assets))
|
||||
messages.push(getLiquidityMessage(props.borrowAsset.denom, borrowLiquidity, assets))
|
||||
}
|
||||
|
||||
return messages
|
||||
@ -128,15 +128,15 @@ export default function Deposit(props: Props) {
|
||||
assets,
|
||||
borrowCoin.amount,
|
||||
maxBorrowAmount,
|
||||
props.borrowMarket.asset.denom,
|
||||
props.borrowMarket.liquidity,
|
||||
props.borrowAsset.denom,
|
||||
props.borrowAsset.liquidity?.amount,
|
||||
])
|
||||
|
||||
const actions = useDepositActions({ depositCoin, borrowCoin })
|
||||
|
||||
const currentDebt: BigNumber = useMemo(
|
||||
() => props.account.debts.find(byDenom(props.borrowMarket.asset.denom))?.amount || BN_ZERO,
|
||||
[props.account.debts, props.borrowMarket.asset.denom],
|
||||
() => props.account.debts.find(byDenom(props.borrowAsset.denom))?.amount || BN_ZERO,
|
||||
[props.account.debts, props.borrowAsset.denom],
|
||||
)
|
||||
|
||||
const handleDeposit = useCallback(() => {
|
||||
@ -160,19 +160,19 @@ export default function Deposit(props: Props) {
|
||||
assets,
|
||||
)
|
||||
const borrowValue = BN(currentLeverage - 1).times(depositValue)
|
||||
additionalDebt = getCoinAmount(props.borrowMarket.asset.denom, borrowValue, prices, assets)
|
||||
additionalDebt = getCoinAmount(props.borrowAsset.denom, borrowValue, prices, assets)
|
||||
}
|
||||
|
||||
simulateHlsStakingDeposit(
|
||||
BNCoin.fromDenomAndBigNumber(props.collateralAsset.denom, amount),
|
||||
BNCoin.fromDenomAndBigNumber(props.borrowMarket.asset.denom, additionalDebt),
|
||||
BNCoin.fromDenomAndBigNumber(props.borrowAsset.denom, additionalDebt),
|
||||
)
|
||||
},
|
||||
[
|
||||
currentLeverage,
|
||||
keepLeverage,
|
||||
prices,
|
||||
props.borrowMarket.asset.denom,
|
||||
props.borrowAsset.denom,
|
||||
props.collateralAsset.denom,
|
||||
simulateHlsStakingDeposit,
|
||||
assets,
|
||||
@ -197,18 +197,18 @@ export default function Deposit(props: Props) {
|
||||
amount: borrowCoin.amount.toNumber(),
|
||||
warningMessages: borrowWarningMessages,
|
||||
options: {
|
||||
suffix: ` ${props.borrowMarket.asset.symbol}`,
|
||||
suffix: ` ${props.borrowAsset.symbol}`,
|
||||
abbreviated: true,
|
||||
decimals: props.borrowMarket.asset.decimals,
|
||||
decimals: props.borrowAsset.decimals,
|
||||
},
|
||||
},
|
||||
{
|
||||
title: 'New Debt Amount',
|
||||
amount: currentDebt.plus(borrowCoin.amount).toNumber(),
|
||||
options: {
|
||||
suffix: ` ${props.borrowMarket.asset.symbol}`,
|
||||
suffix: ` ${props.borrowAsset.symbol}`,
|
||||
abbreviated: true,
|
||||
decimals: props.borrowMarket.asset.decimals,
|
||||
decimals: props.borrowAsset.decimals,
|
||||
},
|
||||
},
|
||||
]
|
||||
@ -220,8 +220,8 @@ export default function Deposit(props: Props) {
|
||||
borrowWarningMessages,
|
||||
currentDebt,
|
||||
keepLeverage,
|
||||
props.borrowMarket.asset.decimals,
|
||||
props.borrowMarket.asset.symbol,
|
||||
props.borrowAsset.decimals,
|
||||
props.borrowAsset.symbol,
|
||||
],
|
||||
)
|
||||
|
||||
|
||||
@ -16,25 +16,25 @@ import { getNoBalanceInWalletMessage } from 'utils/messages'
|
||||
interface Props {
|
||||
account: Account
|
||||
action: HlsStakingManageAction
|
||||
borrowMarket: Market
|
||||
borrowAsset: Asset
|
||||
collateralAsset: Asset
|
||||
}
|
||||
|
||||
export default function Repay(props: Props) {
|
||||
const { removeDebts, removedDebts } = useUpdatedAccount(props.account)
|
||||
const borrowAssetAmountInWallet = BN(
|
||||
useCurrentWalletBalance(props.borrowMarket.asset.denom)?.amount || '0',
|
||||
useCurrentWalletBalance(props.borrowAsset.denom)?.amount || '0',
|
||||
)
|
||||
const repay = useStore((s) => s.repay)
|
||||
|
||||
const currentDebt: BigNumber = useMemo(
|
||||
() => props.account.debts.find(byDenom(props.borrowMarket.asset.denom))?.amount || BN_ZERO,
|
||||
[props.account.debts, props.borrowMarket.asset.denom],
|
||||
() => props.account.debts.find(byDenom(props.borrowAsset.denom))?.amount || BN_ZERO,
|
||||
[props.account.debts, props.borrowAsset.denom],
|
||||
)
|
||||
|
||||
const repayAmount: BigNumber = useMemo(
|
||||
() => removedDebts.find(byDenom(props.borrowMarket.asset.denom))?.amount || BN_ZERO,
|
||||
[removedDebts, props.borrowMarket.asset.denom],
|
||||
() => removedDebts.find(byDenom(props.borrowAsset.denom))?.amount || BN_ZERO,
|
||||
[removedDebts, props.borrowAsset.denom],
|
||||
)
|
||||
|
||||
const maxRepayAmount = useMemo(
|
||||
@ -48,51 +48,51 @@ export default function Repay(props: Props) {
|
||||
title: 'Total Debt Repayable',
|
||||
amount: currentDebt.toNumber(),
|
||||
options: {
|
||||
suffix: ` ${props.borrowMarket.asset.symbol}`,
|
||||
suffix: ` ${props.borrowAsset.symbol}`,
|
||||
abbreviated: true,
|
||||
decimals: props.borrowMarket.asset.decimals,
|
||||
decimals: props.borrowAsset.decimals,
|
||||
},
|
||||
},
|
||||
{
|
||||
title: 'New Debt Amount',
|
||||
amount: currentDebt.minus(repayAmount).toNumber(),
|
||||
options: {
|
||||
suffix: ` ${props.borrowMarket.asset.symbol}`,
|
||||
suffix: ` ${props.borrowAsset.symbol}`,
|
||||
abbreviated: true,
|
||||
decimals: props.borrowMarket.asset.decimals,
|
||||
decimals: props.borrowAsset.decimals,
|
||||
},
|
||||
},
|
||||
],
|
||||
[currentDebt, props.borrowMarket.asset.decimals, props.borrowMarket.asset.symbol, repayAmount],
|
||||
[currentDebt, props.borrowAsset.decimals, props.borrowAsset.symbol, repayAmount],
|
||||
)
|
||||
|
||||
const handleRepay = useCallback(() => {
|
||||
useStore.setState({ hlsManageModal: null })
|
||||
repay({
|
||||
accountId: props.account.id,
|
||||
coin: BNCoin.fromDenomAndBigNumber(props.borrowMarket.asset.denom, repayAmount),
|
||||
coin: BNCoin.fromDenomAndBigNumber(props.borrowAsset.denom, repayAmount),
|
||||
fromWallet: true,
|
||||
})
|
||||
}, [props.account.id, props.borrowMarket.asset.denom, repay, repayAmount])
|
||||
}, [props.account.id, props.borrowAsset.denom, repay, repayAmount])
|
||||
|
||||
const handleOnChange = useCallback(
|
||||
(amount: BigNumber) =>
|
||||
removeDebts([BNCoin.fromDenomAndBigNumber(props.borrowMarket.asset.denom, amount)]),
|
||||
[props.borrowMarket.asset.denom, removeDebts],
|
||||
removeDebts([BNCoin.fromDenomAndBigNumber(props.borrowAsset.denom, amount)]),
|
||||
[props.borrowAsset.denom, removeDebts],
|
||||
)
|
||||
|
||||
const warningMessages = useMemo(() => {
|
||||
if (borrowAssetAmountInWallet.isZero()) {
|
||||
return [getNoBalanceInWalletMessage(props.borrowMarket.asset.symbol)]
|
||||
return [getNoBalanceInWalletMessage(props.borrowAsset.symbol)]
|
||||
}
|
||||
return []
|
||||
}, [borrowAssetAmountInWallet, props.borrowMarket.asset.symbol])
|
||||
}, [borrowAssetAmountInWallet, props.borrowAsset.symbol])
|
||||
|
||||
return (
|
||||
<>
|
||||
<TokenInputWithSlider
|
||||
amount={repayAmount}
|
||||
asset={props.borrowMarket.asset}
|
||||
asset={props.borrowAsset}
|
||||
max={maxRepayAmount}
|
||||
onChange={handleOnChange}
|
||||
maxText='In Wallet'
|
||||
|
||||
@ -14,6 +14,7 @@ import { getHealthFactorMessage } from 'utils/messages'
|
||||
interface Props {
|
||||
account: Account
|
||||
action: HlsStakingManageAction
|
||||
borrowAsset: Asset
|
||||
collateralAsset: Asset
|
||||
}
|
||||
|
||||
|
||||
@ -8,23 +8,23 @@ import Withdraw from 'components/Modals/HLS/Manage/Withdraw'
|
||||
import ModalContentWithSummary from 'components/Modals/ModalContentWithSummary'
|
||||
import useAccount from 'hooks/accounts/useAccount'
|
||||
import useAsset from 'hooks/assets/useAsset'
|
||||
import useMarket from 'hooks/markets/useMarket'
|
||||
import useBorrowAsset from 'hooks/useBorrowAsset'
|
||||
import useStore from 'store'
|
||||
|
||||
export default function HlsManageModalController() {
|
||||
const modal = useStore((s) => s.hlsManageModal)
|
||||
const { data: account } = useAccount(modal?.accountId)
|
||||
const collateralAsset = useAsset(modal?.staking.strategy.denoms.deposit || '')
|
||||
const market = useMarket(modal?.staking.strategy.denoms.borrow || '')
|
||||
const borrowAsset = useBorrowAsset(modal?.staking.strategy.denoms.borrow || '')
|
||||
|
||||
if (!modal || !collateralAsset || !market || !account) return null
|
||||
if (!modal || !collateralAsset || !borrowAsset || !account) return null
|
||||
|
||||
return (
|
||||
<HlsModal
|
||||
account={{ ...account, strategy: modal.staking.strategy } as HLSAccountWithStrategy}
|
||||
action={modal.staking.action}
|
||||
collateralAsset={collateralAsset}
|
||||
borrowMarket={market}
|
||||
borrowAsset={borrowAsset}
|
||||
/>
|
||||
)
|
||||
}
|
||||
@ -32,11 +32,12 @@ export default function HlsManageModalController() {
|
||||
interface Props {
|
||||
account: HLSAccountWithStrategy
|
||||
action: HlsStakingManageAction
|
||||
borrowMarket: Market
|
||||
borrowAsset: BorrowAsset
|
||||
collateralAsset: Asset
|
||||
}
|
||||
|
||||
function HlsModal(props: Props) {
|
||||
const updatedAccount = useStore((s) => s.updatedAccount)
|
||||
function handleClose() {
|
||||
useStore.setState({ hlsManageModal: null })
|
||||
}
|
||||
@ -64,7 +65,7 @@ function HlsModal(props: Props) {
|
||||
<Header
|
||||
action={props.action}
|
||||
primaryAsset={props.collateralAsset}
|
||||
secondaryAsset={props.borrowMarket.asset}
|
||||
secondaryAsset={props.borrowAsset}
|
||||
/>
|
||||
}
|
||||
onClose={handleClose}
|
||||
|
||||
@ -1,10 +1,10 @@
|
||||
import React from 'react'
|
||||
|
||||
import Modal from 'components/Modals/Modal'
|
||||
import Content from 'components/Modals/HLS/Deposit'
|
||||
import Header from 'components/Modals/HLS/Header'
|
||||
import Modal from 'components/Modals/Modal'
|
||||
import useAsset from 'hooks/assets/useAsset'
|
||||
import useMarket from 'hooks/markets/useMarket'
|
||||
import useBorrowAsset from 'hooks/useBorrowAsset'
|
||||
import useStore from 'store'
|
||||
|
||||
export default function HlsModalController() {
|
||||
@ -14,7 +14,7 @@ export default function HlsModalController() {
|
||||
modal?.vault?.denoms.primary || modal?.strategy?.denoms.deposit || '',
|
||||
)
|
||||
|
||||
const secondaryAsset = useMarket(modal?.strategy?.denoms.borrow || '')
|
||||
const secondaryAsset = useBorrowAsset(modal?.strategy?.denoms.borrow || '')
|
||||
|
||||
if (!primaryAsset || !secondaryAsset) return null
|
||||
|
||||
@ -41,7 +41,7 @@ export default function HlsModalController() {
|
||||
|
||||
interface Props {
|
||||
primaryAsset: Asset
|
||||
secondaryAsset: Market
|
||||
secondaryAsset: BorrowAsset
|
||||
strategy?: HLSStrategy
|
||||
vaultAddress: string | null
|
||||
}
|
||||
@ -53,9 +53,7 @@ function HlsModal(props: Props) {
|
||||
|
||||
return (
|
||||
<Modal
|
||||
header={
|
||||
<Header primaryAsset={props.primaryAsset} secondaryAsset={props.secondaryAsset.asset} />
|
||||
}
|
||||
header={<Header primaryAsset={props.primaryAsset} secondaryAsset={props.secondaryAsset} />}
|
||||
headerClassName='gradient-header pl-2 pr-2.5 py-3 border-b-white/5 border-b'
|
||||
contentClassName='flex flex-col p-6'
|
||||
modalClassName='max-w-modal-md'
|
||||
@ -63,7 +61,7 @@ function HlsModal(props: Props) {
|
||||
>
|
||||
<Content
|
||||
collateralAsset={props.primaryAsset}
|
||||
borrowMarket={props.secondaryAsset}
|
||||
borrowAsset={props.secondaryAsset}
|
||||
vaultAddress={props.vaultAddress}
|
||||
strategy={props.strategy}
|
||||
/>
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
import { useCallback, useState } from 'react'
|
||||
import { useCallback } from 'react'
|
||||
|
||||
import AssetAmountSelectActionModal from 'components/Modals/AssetAmountSelectActionModal'
|
||||
import DetailsHeader from 'components/Modals/LendAndReclaim/DetailsHeader'
|
||||
@ -27,7 +27,6 @@ function LendAndReclaimModal({ currentAccount, config }: Props) {
|
||||
const reclaim = useStore((s) => s.reclaim)
|
||||
const { close } = useLendAndReclaimModal()
|
||||
const { simulateLending } = useUpdatedAccount(currentAccount)
|
||||
const [coin, setCoin] = useState<BNCoin>()
|
||||
|
||||
const { data, action } = config
|
||||
const { asset } = data
|
||||
@ -38,16 +37,12 @@ function LendAndReclaimModal({ currentAccount, config }: Props) {
|
||||
|
||||
const handleAmountChange = useCallback(
|
||||
(value: BigNumber) => {
|
||||
setCoin(BNCoin.fromDenomAndBigNumber(asset.denom, value))
|
||||
const coin = BNCoin.fromDenomAndBigNumber(asset.denom, value)
|
||||
simulateLending(isLendAction, coin)
|
||||
},
|
||||
[asset.denom],
|
||||
[asset.denom, isLendAction, simulateLending],
|
||||
)
|
||||
|
||||
const onDebounce = useCallback(() => {
|
||||
if (!coin) return
|
||||
simulateLending(isLendAction, coin)
|
||||
}, [coin, isLendAction, simulateLending])
|
||||
|
||||
const handleAction = useCallback(
|
||||
(value: BigNumber, isMax: boolean) => {
|
||||
const coin = BNCoin.fromDenomAndBigNumber(asset.denom, value)
|
||||
@ -75,7 +70,6 @@ function LendAndReclaimModal({ currentAccount, config }: Props) {
|
||||
onClose={close}
|
||||
onAction={handleAction}
|
||||
onChange={handleAmountChange}
|
||||
onDebounce={onDebounce}
|
||||
/>
|
||||
)
|
||||
}
|
||||
|
||||
@ -1,10 +1,11 @@
|
||||
import classNames from 'classnames'
|
||||
import React from 'react'
|
||||
|
||||
import AccountSummary from 'components/account/AccountSummary'
|
||||
import Card from 'components/common/Card'
|
||||
import { CircularProgress } from 'components/common/CircularProgress'
|
||||
import Modal, { ModalProps } from 'components/Modals/Modal'
|
||||
import AccountSummaryInModal from 'components/account/AccountSummary/AccountSummaryInModal'
|
||||
import useStore from 'store'
|
||||
|
||||
interface Props extends ModalProps {
|
||||
isHls?: boolean
|
||||
@ -35,6 +36,7 @@ function modalContent(content: React.ReactNode, isContentCard?: boolean, account
|
||||
}
|
||||
|
||||
export default function ModalContentWithSummary(props: Props) {
|
||||
const updatedAccount = useStore((s) => s.updatedAccount)
|
||||
return (
|
||||
<Modal
|
||||
{...props}
|
||||
@ -46,7 +48,9 @@ export default function ModalContentWithSummary(props: Props) {
|
||||
>
|
||||
{props.subHeader && props.subHeader}
|
||||
{modalContent(props.content, props.isContentCard, props.account)}
|
||||
{props.account && <AccountSummaryInModal account={props.account} isHls={props.isHls} />}
|
||||
{props.account && (
|
||||
<AccountSummary account={updatedAccount || props.account} isHls={props.isHls} />
|
||||
)}
|
||||
</Modal>
|
||||
)
|
||||
}
|
||||
|
||||
@ -12,7 +12,7 @@ import TokenInput from 'components/common/TokenInput'
|
||||
import { BN_ZERO } from 'constants/math'
|
||||
import { ORACLE_DENOM } from 'constants/oracle'
|
||||
import useAllAssets from 'hooks/assets/useAllAssets'
|
||||
import useMarkets from 'hooks/markets/useMarkets'
|
||||
import useMarketAssets from 'hooks/markets/useMarketAssets'
|
||||
import useHealthComputer from 'hooks/useHealthComputer'
|
||||
import usePrices from 'hooks/usePrices'
|
||||
import useStore from 'store'
|
||||
@ -39,7 +39,7 @@ export interface VaultBorrowingsProps {
|
||||
export default function VaultBorrowings(props: VaultBorrowingsProps) {
|
||||
const assets = useAllAssets()
|
||||
const { borrowings, onChangeBorrowings } = props
|
||||
const markets = useMarkets()
|
||||
const { data: marketAssets } = useMarketAssets()
|
||||
const { data: prices } = usePrices()
|
||||
const vaultModal = useStore((s) => s.vaultModal)
|
||||
const depositIntoVault = useStore((s) => s.depositIntoVault)
|
||||
@ -227,8 +227,7 @@ export default function VaultBorrowings(props: VaultBorrowingsProps) {
|
||||
</div>
|
||||
{props.borrowings.map((coin) => {
|
||||
const asset = assets.find(byDenom(coin.denom))
|
||||
const borrowRate = markets?.find((market) => market.asset.denom === coin.denom)?.apy
|
||||
.borrow
|
||||
const borrowRate = marketAssets?.find((market) => market.denom === coin.denom)?.apy.borrow
|
||||
|
||||
if (!asset || !borrowRate)
|
||||
return <React.Fragment key={`borrow-rate-${coin.denom}`}></React.Fragment>
|
||||
|
||||
@ -1,11 +1,11 @@
|
||||
import { useCallback, useMemo, useState } from 'react'
|
||||
|
||||
import Accordion from 'components/common/Accordion'
|
||||
import AccountSummary from 'components/account/AccountSummary'
|
||||
import VaultBorrowings from 'components/Modals/Vault/VaultBorrowings'
|
||||
import VaultBorrowingsSubTitle from 'components/Modals/Vault/VaultBorrowingsSubTitle'
|
||||
import VaultDeposit from 'components/Modals/Vault/VaultDeposits'
|
||||
import VaultDepositSubTitle from 'components/Modals/Vault/VaultDepositsSubTitle'
|
||||
import AccountSummaryInModal from 'components/account/AccountSummary/AccountSummaryInModal'
|
||||
import Accordion from 'components/common/Accordion'
|
||||
import Text from 'components/common/Text'
|
||||
import { BN_ZERO } from 'constants/math'
|
||||
import useAllAssets from 'hooks/assets/useAllAssets'
|
||||
@ -177,7 +177,8 @@ export default function VaultModalContent(props: Props) {
|
||||
},
|
||||
]}
|
||||
/>
|
||||
<AccountSummaryInModal account={props.account} />
|
||||
|
||||
<AccountSummary account={props.account} />
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
@ -8,12 +8,11 @@ import { TextLink } from 'components/common/TextLink'
|
||||
import { generateToastContent } from 'components/common/Toaster'
|
||||
import useTransactions from 'hooks/localStorage/useTransactions'
|
||||
import useStore from 'store'
|
||||
import useChainConfig from 'hooks/useChainConfig'
|
||||
|
||||
export default function RecentTransactions() {
|
||||
const address = useStore((s) => s.address)
|
||||
const [transactions, setTransactions] = useTransactions()
|
||||
const chainConfig = useChainConfig()
|
||||
const chainConfig = useStore((s) => s.chainConfig)
|
||||
const recentTransactions = transactions.recent
|
||||
.filter((tx) => tx.address === address)
|
||||
.sort((a, b) => (a.timestamp > b.timestamp ? -1 : 1))
|
||||
|
||||
@ -17,7 +17,6 @@ import useStore from 'store'
|
||||
import { byDenom } from 'utils/array'
|
||||
import { defaultFee } from 'utils/constants'
|
||||
import { BN } from 'utils/helpers'
|
||||
import useChainConfig from 'hooks/useChainConfig'
|
||||
|
||||
function Bridge({ name, url, image }: Bridge) {
|
||||
return (
|
||||
@ -36,7 +35,7 @@ function Bridge({ name, url, image }: Bridge) {
|
||||
}
|
||||
|
||||
export default function WalletBridges() {
|
||||
const chainConfig = useChainConfig()
|
||||
const chainConfig = useStore((s) => s.chainConfig)
|
||||
|
||||
const address = useStore((s) => s.address)
|
||||
const currentWallet = useCurrentWallet()
|
||||
|
||||
@ -28,7 +28,7 @@ export default function WalletConnectButton(props: Props) {
|
||||
return (
|
||||
<Button
|
||||
variant={props.variant ?? 'solid'}
|
||||
color={props.color ?? 'secondary'}
|
||||
color={props.color ?? 'tertiary'}
|
||||
size={props.size ?? 'sm'}
|
||||
disabled={props.disabled}
|
||||
onClick={handleClick}
|
||||
|
||||
@ -17,7 +17,7 @@ import { FC } from 'react'
|
||||
|
||||
import chains from 'configs/chains'
|
||||
import { WALLETS } from 'constants/wallets'
|
||||
import { WalletID } from 'types/enums/wallet'
|
||||
import { ChainInfoID, WalletID } from 'types/enums/wallet'
|
||||
|
||||
type Props = {
|
||||
children?: React.ReactNode
|
||||
@ -37,6 +37,23 @@ function mapChainConfigToChainInfo(chainConfig: ChainConfig): ChainInfo {
|
||||
features: ['ibc-transfer', 'ibc-go'],
|
||||
}
|
||||
|
||||
switch (chainConfig.id) {
|
||||
case ChainInfoID.Osmosis1:
|
||||
chainInfo.rpc = process.env.NEXT_PUBLIC_OSMOSIS_RPC ?? chainInfo.rpc
|
||||
chainInfo.rest = process.env.NEXT_PUBLIC_OSMOSIS_REST ?? chainInfo.rpc
|
||||
break
|
||||
|
||||
case ChainInfoID.OsmosisDevnet:
|
||||
chainInfo.rpc = process.env.NEXT_PUBLIC_OSMOSIS_TEST_RPC ?? chainInfo.rpc
|
||||
chainInfo.rest = process.env.NEXT_PUBLIC_OSMOSIS_TEST_REST ?? chainInfo.rpc
|
||||
break
|
||||
|
||||
case ChainInfoID.Pion1:
|
||||
chainInfo.rpc = process.env.NEXT_PUBLIC_NEUTRON_TEST_RPC ?? chainInfo.rpc
|
||||
chainInfo.rest = process.env.NEXT_PUBLIC_NEUTRON_TEST_REST ?? chainInfo.rpc
|
||||
break
|
||||
}
|
||||
|
||||
return chainInfo
|
||||
}
|
||||
|
||||
|
||||
@ -18,7 +18,6 @@ import chains from 'configs/chains'
|
||||
import { BN_ZERO } from 'constants/math'
|
||||
import useBaseAsset from 'hooks/assets/useBasetAsset'
|
||||
import useMarketEnabledAssets from 'hooks/assets/useMarketEnabledAssets'
|
||||
import useChainConfig from 'hooks/useChainConfig'
|
||||
import useCurrentWallet from 'hooks/useCurrentWallet'
|
||||
import useICNSDomain from 'hooks/useICNSDomain'
|
||||
import useToggle from 'hooks/useToggle'
|
||||
@ -41,7 +40,7 @@ export default function WalletConnectedButton() {
|
||||
const userDomain = useStore((s) => s.userDomain)
|
||||
const focusComponent = useStore((s) => s.focusComponent)
|
||||
const network = useStore((s) => s.client?.connectedWallet.network)
|
||||
const chainConfig = useChainConfig()
|
||||
const chainConfig = useStore((s) => s.chainConfig)
|
||||
const baseAsset = useBaseAsset()
|
||||
const { data: walletBalances, isLoading } = useWalletBalances(address)
|
||||
const { data: icnsData, isLoading: isLoadingICNS } = useICNSDomain(address)
|
||||
@ -90,7 +89,7 @@ export default function WalletConnectedButton() {
|
||||
})
|
||||
}
|
||||
|
||||
navigate(getRoute(getPage(pathname), new URLSearchParams()))
|
||||
navigate(getRoute(getPage(pathname), searchParams))
|
||||
}
|
||||
|
||||
useEffect(() => {
|
||||
@ -144,7 +143,7 @@ export default function WalletConnectedButton() {
|
||||
<Button
|
||||
variant='solid'
|
||||
leftIcon={<Wallet />}
|
||||
color='secondary'
|
||||
color='tertiary'
|
||||
onClick={() => {
|
||||
setShowDetails(!showDetails)
|
||||
}}
|
||||
|
||||
@ -26,16 +26,8 @@ const mapErrorMessages = (providerId: string, errorMessage: string, name: string
|
||||
}
|
||||
|
||||
export default function WalletConnecting(props: Props) {
|
||||
const {
|
||||
connect,
|
||||
mobileConnect,
|
||||
simulate,
|
||||
sign,
|
||||
broadcast,
|
||||
mobileProviders,
|
||||
extensionProviders,
|
||||
disconnect,
|
||||
} = useShuttle()
|
||||
const { connect, mobileConnect, simulate, sign, broadcast, mobileProviders, extensionProviders } =
|
||||
useShuttle()
|
||||
const providers = useMemo(
|
||||
() => [...mobileProviders, ...extensionProviders],
|
||||
[mobileProviders, extensionProviders],
|
||||
@ -93,9 +85,6 @@ export default function WalletConnecting(props: Props) {
|
||||
}}
|
||||
/>
|
||||
),
|
||||
onClose: () => {
|
||||
disconnect({ chainId: chainConfig.id })
|
||||
},
|
||||
},
|
||||
})
|
||||
}
|
||||
@ -103,17 +92,7 @@ export default function WalletConnecting(props: Props) {
|
||||
}
|
||||
if (!isConnecting) handleConnectAsync()
|
||||
},
|
||||
[
|
||||
isConnecting,
|
||||
client,
|
||||
setIsConnecting,
|
||||
connect,
|
||||
chainConfig,
|
||||
broadcast,
|
||||
sign,
|
||||
simulate,
|
||||
disconnect,
|
||||
],
|
||||
[isConnecting, client, setIsConnecting, connect, chainConfig, broadcast, sign, simulate],
|
||||
)
|
||||
|
||||
const handleMobileConnect = useCallback(
|
||||
@ -126,9 +105,6 @@ export default function WalletConnecting(props: Props) {
|
||||
userDomain: undefined,
|
||||
focusComponent: {
|
||||
component: <WalletSelect />,
|
||||
onClose: () => {
|
||||
disconnect({ chainId: chainConfig.id })
|
||||
},
|
||||
},
|
||||
})
|
||||
return
|
||||
@ -168,9 +144,6 @@ export default function WalletConnecting(props: Props) {
|
||||
}}
|
||||
/>
|
||||
),
|
||||
onClose: () => {
|
||||
disconnect({ chainId: chainConfig.id })
|
||||
},
|
||||
},
|
||||
})
|
||||
}
|
||||
@ -188,7 +161,6 @@ export default function WalletConnecting(props: Props) {
|
||||
broadcast,
|
||||
sign,
|
||||
simulate,
|
||||
disconnect,
|
||||
],
|
||||
)
|
||||
|
||||
@ -200,9 +172,6 @@ export default function WalletConnecting(props: Props) {
|
||||
userDomain: undefined,
|
||||
focusComponent: {
|
||||
component: <WalletSelect />,
|
||||
onClose: () => {
|
||||
disconnect({ chainId: chainConfig.id })
|
||||
},
|
||||
},
|
||||
})
|
||||
return
|
||||
@ -219,15 +188,7 @@ export default function WalletConnecting(props: Props) {
|
||||
return
|
||||
}
|
||||
handleConnect(provider.id)
|
||||
}, [
|
||||
handleConnect,
|
||||
isConnecting,
|
||||
providerId,
|
||||
providers,
|
||||
handleMobileConnect,
|
||||
disconnect,
|
||||
chainConfig.id,
|
||||
])
|
||||
}, [handleConnect, isConnecting, providerId, providers, handleMobileConnect])
|
||||
|
||||
return (
|
||||
<FullOverlayContent
|
||||
|
||||
@ -13,7 +13,6 @@ import { WALLETS } from 'constants/wallets'
|
||||
import useStore from 'store'
|
||||
import { WalletID } from 'types/enums/wallet'
|
||||
import { isAndroid, isIOS, isMobile } from 'utils/mobile'
|
||||
import useChainConfig from 'hooks/useChainConfig'
|
||||
|
||||
interface Props {
|
||||
error?: ErrorObject
|
||||
@ -53,7 +52,7 @@ function WalletOption(props: WalletOptionProps) {
|
||||
}
|
||||
|
||||
export default function WalletSelect(props: Props) {
|
||||
const chainConfig = useChainConfig()
|
||||
const chainConfig = useStore((s) => s.chainConfig)
|
||||
const { extensionProviders, mobileProviders, mobileConnect } = useShuttle()
|
||||
const [qrCodeUrl, setQRCodeUrl] = useState('')
|
||||
const [error, setError] = useState(props.error)
|
||||
|
||||
@ -1,13 +1,10 @@
|
||||
import classNames from 'classnames'
|
||||
|
||||
import AssetRate from 'components/common/assets/AssetRate'
|
||||
import Loading from 'components/common/Loading'
|
||||
import Text from 'components/common/Text'
|
||||
import { byDenom } from 'utils/array'
|
||||
|
||||
export const APY_META = { accessorKey: 'apy', header: 'APY', meta: { className: 'w-30' } }
|
||||
|
||||
interface Props {
|
||||
apy?: number | null
|
||||
apy: number
|
||||
markets: Market[]
|
||||
denom: string
|
||||
type: PositionType
|
||||
@ -16,22 +13,12 @@ interface Props {
|
||||
export default function Apr(props: Props) {
|
||||
const { markets, type, denom, apy } = props
|
||||
|
||||
if (apy === undefined) return <Loading />
|
||||
if (apy === null) return <Text size='xs'>N/A</Text>
|
||||
|
||||
if (apy === 0)
|
||||
return (
|
||||
<p className={classNames('w-full text-xs text-right number', type === 'vault' && 'pb-4')}>
|
||||
–
|
||||
</p>
|
||||
)
|
||||
|
||||
const isEnabled =
|
||||
markets.find((market) => market.asset.denom === props.denom)?.borrowEnabled ?? false
|
||||
if (apy === 0) return <p className='w-full text-xs text-right number'>–</p>
|
||||
const isEnabled = markets.find(byDenom(denom))?.borrowEnabled ?? false
|
||||
|
||||
return (
|
||||
<AssetRate
|
||||
className={classNames('justify-end text-xs', type === 'vault' && 'pb-4')}
|
||||
className='justify-end text-xs'
|
||||
rate={apy}
|
||||
isEnabled={type !== 'lend' || isEnabled}
|
||||
type='apy'
|
||||
|
||||
@ -1,12 +1,5 @@
|
||||
import Text from 'components/common/Text'
|
||||
import AssetImage from 'components/common/assets/AssetImage'
|
||||
import useAllAssets from 'hooks/assets/useAllAssets'
|
||||
export const ASSET_META = {
|
||||
accessorKey: 'symbol',
|
||||
header: 'Asset',
|
||||
id: 'symbol',
|
||||
meta: { className: 'w-40' },
|
||||
}
|
||||
export const ASSET_META = { accessorKey: 'symbol', header: 'Asset', id: 'symbol' }
|
||||
|
||||
interface Props {
|
||||
symbol: string
|
||||
@ -15,18 +8,12 @@ interface Props {
|
||||
|
||||
export default function Asset(props: Props) {
|
||||
const { symbol, type } = props
|
||||
const assets = useAllAssets()
|
||||
const asset = assets.find((asset) => asset.symbol === symbol) ?? assets[0]
|
||||
|
||||
return (
|
||||
<div className='flex gap-2'>
|
||||
<AssetImage asset={asset} size={16} className='w-4 h-4' />
|
||||
<Text size='xs' className='text-white'>
|
||||
{asset.symbol}
|
||||
{type === 'borrow' && <span className='ml-1 text-loss'>(debt)</span>}
|
||||
{type === 'lend' && <span className='ml-1 text-profit'>(lent)</span>}
|
||||
{type === 'vault' && <span className='ml-1 text-profit'>(farm)</span>}
|
||||
</Text>
|
||||
</div>
|
||||
<Text size='xs'>
|
||||
{symbol}
|
||||
{type === 'borrow' && <span className='ml-1 text-loss'>(debt)</span>}
|
||||
{type === 'lend' && <span className='ml-1 text-profit'>(lent)</span>}
|
||||
{type === 'vault' && <span className='ml-1 text-profit'>(farm)</span>}
|
||||
</Text>
|
||||
)
|
||||
}
|
||||
|
||||
@ -1,6 +1,5 @@
|
||||
import { Row } from '@tanstack/react-table'
|
||||
import classNames from 'classnames'
|
||||
import { useMemo } from 'react'
|
||||
|
||||
import { getAmountChangeColor } from 'components/account/AccountBalancesTable/functions'
|
||||
import { FormattedNumber } from 'components/common/FormattedNumber'
|
||||
@ -28,9 +27,10 @@ export const sizeSortingFn = (a: Row<AccountBalanceRow>, b: Row<AccountBalanceRo
|
||||
|
||||
export default function Size(props: Props) {
|
||||
const { amountChange, type, size } = props
|
||||
const color = useMemo(() => getAmountChangeColor(type, amountChange), [amountChange, type])
|
||||
|
||||
if (type === 'vault') return <p className='text-xs text-right number'>–</p>
|
||||
|
||||
const color = getAmountChangeColor(type, amountChange)
|
||||
const className = classNames('text-xs text-right', color)
|
||||
const allowZero = !amountChange.isZero()
|
||||
|
||||
@ -47,7 +47,6 @@ export default function Size(props: Props) {
|
||||
const formattedAmount = formatAmountToPrecision(size, MAX_AMOUNT_DECIMALS)
|
||||
const minimumAmount = allowZero ? 0 : MIN_AMOUNT
|
||||
const lowAmount = formattedAmount === 0 ? minimumAmount : Math.max(formattedAmount, MIN_AMOUNT)
|
||||
|
||||
return (
|
||||
<FormattedNumber
|
||||
className={className}
|
||||
|
||||
@ -13,7 +13,7 @@ import Value, {
|
||||
VALUE_META,
|
||||
valueBalancesSortingFn,
|
||||
} from 'components/account/AccountBalancesTable/Columns/Value'
|
||||
import useMarkets from 'hooks/markets/useMarkets'
|
||||
import useMarketAssets from 'hooks/markets/useMarketAssets'
|
||||
import useHealthComputer from 'hooks/useHealthComputer'
|
||||
import useStore from 'store'
|
||||
|
||||
@ -21,8 +21,7 @@ export default function useAccountBalancesColumns(
|
||||
account: Account,
|
||||
showLiquidationPrice?: boolean,
|
||||
) {
|
||||
const markets = useMarkets()
|
||||
|
||||
const { data: markets } = useMarketAssets()
|
||||
const updatedAccount = useStore((s) => s.updatedAccount)
|
||||
|
||||
const { computeLiquidationPrice } = useHealthComputer(updatedAccount ?? account)
|
||||
|
||||
@ -1,3 +1,4 @@
|
||||
import { BN_ZERO } from 'constants/math'
|
||||
import { BNCoin } from 'types/classes/BNCoin'
|
||||
import { demagnify, getCoinValue } from 'utils/formatters'
|
||||
|
||||
@ -25,7 +26,39 @@ export function getAssetAccountBalanceRow(
|
||||
}
|
||||
}
|
||||
|
||||
export function getVaultAccountBalanceRow(
|
||||
vault: DepositedVault,
|
||||
apy: number,
|
||||
prev?: DepositedVault,
|
||||
): AccountBalanceRow {
|
||||
const { name } = vault
|
||||
const previous = prev || vault
|
||||
const totalLockedValue = vault.values.primary.plus(vault.values.secondary)
|
||||
const totalValue = totalLockedValue.plus(vault.values.unlocked).plus(vault.values.unlocking)
|
||||
const prevTotalValue = previous.values.primary
|
||||
.plus(previous.values.secondary)
|
||||
.plus(previous.values.unlocked)
|
||||
.plus(previous.values.unlocking)
|
||||
const amountChange = !prev ? totalValue : totalValue.minus(prevTotalValue)
|
||||
|
||||
if (totalLockedValue.isLessThan(totalValue)) {
|
||||
apy = totalLockedValue.dividedBy(totalValue).times(apy).toNumber()
|
||||
}
|
||||
|
||||
return {
|
||||
type: 'vault',
|
||||
symbol: name,
|
||||
size: 0,
|
||||
value: totalValue.toString(),
|
||||
denom: vault.denoms.lp,
|
||||
amount: BN_ZERO,
|
||||
apy,
|
||||
amountChange,
|
||||
}
|
||||
}
|
||||
|
||||
export function getAmountChangeColor(type: PositionType, amount: BigNumber) {
|
||||
if (type === 'perp') return ''
|
||||
if (type === 'borrow') {
|
||||
if (amount.isGreaterThan(0)) return 'text-loss'
|
||||
if (amount.isLessThan(0)) return 'text-profit'
|
||||
|
||||
@ -1,6 +1,9 @@
|
||||
import { useMemo } from 'react'
|
||||
|
||||
import { getAssetAccountBalanceRow } from 'components/account/AccountBalancesTable/functions'
|
||||
import {
|
||||
getAssetAccountBalanceRow,
|
||||
getVaultAccountBalanceRow,
|
||||
} from 'components/account/AccountBalancesTable/functions'
|
||||
import useAllAssets from 'hooks/assets/useAllAssets'
|
||||
import useHLSStakingAssets from 'hooks/useHLSStakingAssets'
|
||||
import usePrices from 'hooks/usePrices'
|
||||
@ -24,6 +27,7 @@ export default function useAccountBalanceData(props: Props) {
|
||||
const accountDeposits = usedAccount?.deposits ?? []
|
||||
const accountLends = usedAccount?.lends ?? []
|
||||
const accountDebts = usedAccount?.debts ?? []
|
||||
const accountVaults = usedAccount?.vaults ?? []
|
||||
|
||||
const deposits: AccountBalanceRow[] = []
|
||||
accountDeposits.forEach((deposit) => {
|
||||
@ -33,7 +37,6 @@ export default function useAccountBalanceData(props: Props) {
|
||||
? hlsStrategies.find((strategy) => strategy.denoms.deposit === asset.denom)?.apy ?? 0
|
||||
: 0
|
||||
const prevDeposit = updatedAccount ? account?.deposits.find(byDenom(deposit.denom)) : deposit
|
||||
|
||||
deposits.push(
|
||||
getAssetAccountBalanceRow('deposit', asset, prices, assets, deposit, apy, prevDeposit),
|
||||
)
|
||||
@ -50,6 +53,14 @@ export default function useAccountBalanceData(props: Props) {
|
||||
return getAssetAccountBalanceRow('lend', asset, prices, assets, lending, apy, prevLending)
|
||||
})
|
||||
|
||||
const vaults = accountVaults.map((vault) => {
|
||||
const apy = vault.apy ?? 0
|
||||
const prevVault = updatedAccount
|
||||
? account?.vaults.find((position) => position.name === vault.name)
|
||||
: vault
|
||||
return getVaultAccountBalanceRow(vault, apy, prevVault)
|
||||
})
|
||||
|
||||
const debts = accountDebts.map((debt) => {
|
||||
const asset = assets.find(byDenom(debt.denom)) ?? assets[0]
|
||||
const apy = borrowingData.find((market) => market.asset.denom === debt.denom)?.apy.borrow ?? 0
|
||||
@ -58,7 +69,7 @@ export default function useAccountBalanceData(props: Props) {
|
||||
: debt
|
||||
return getAssetAccountBalanceRow('borrow', asset, prices, assets, debt, apy, prevDebt)
|
||||
})
|
||||
return [...deposits, ...lends, ...debts]
|
||||
return [...deposits, ...lends, ...vaults, ...debts]
|
||||
}, [
|
||||
updatedAccount,
|
||||
account,
|
||||
|
||||
@ -2,21 +2,24 @@ import BigNumber from 'bignumber.js'
|
||||
import classNames from 'classnames'
|
||||
import { useMemo } from 'react'
|
||||
|
||||
import useBorrowMarketAssetsTableData from 'components/borrow/Table/useBorrowMarketAssetsTableData'
|
||||
import DisplayCurrency from 'components/common/DisplayCurrency'
|
||||
import { FormattedNumber } from 'components/common/FormattedNumber'
|
||||
import { ArrowRight } from 'components/common/Icons'
|
||||
import Text from 'components/common/Text'
|
||||
import useLendingMarketAssetsTableData from 'components/earn/lend/Table/useLendingMarketAssetsTableData'
|
||||
import { BN_ZERO, MAX_AMOUNT_DECIMALS } from 'constants/math'
|
||||
import { ORACLE_DENOM } from 'constants/oracle'
|
||||
import useAllAssets from 'hooks/assets/useAllAssets'
|
||||
import useBorrowMarketAssetsTableData from 'hooks/useBorrowMarketAssetsTableData'
|
||||
import useHLSStakingAssets from 'hooks/useHLSStakingAssets'
|
||||
import useLendingMarketAssetsTableData from 'hooks/useLendingMarketAssetsTableData'
|
||||
import usePrices from 'hooks/usePrices'
|
||||
import useVaultAprs from 'hooks/vaults/useVaultAprs'
|
||||
import useStore from 'store'
|
||||
import { BNCoin } from 'types/classes/BNCoin'
|
||||
import { calculateAccountApr, getAccountPositionValues } from 'utils/accounts'
|
||||
import {
|
||||
calculateAccountApr,
|
||||
calculateAccountBalanceValue,
|
||||
getAccountPositionValues,
|
||||
} from 'utils/accounts'
|
||||
|
||||
interface Props {
|
||||
account: Account
|
||||
@ -38,7 +41,6 @@ export default function AccountComposition(props: Props) {
|
||||
const hasChanged = !!updatedAccount
|
||||
const { data: prices } = usePrices()
|
||||
const { data: hlsStrategies } = useHLSStakingAssets()
|
||||
const { data: vaultAprs } = useVaultAprs()
|
||||
const assets = useAllAssets()
|
||||
const data = useBorrowMarketAssetsTableData()
|
||||
const borrowAssetsData = useMemo(() => data?.allAssets || [], [data])
|
||||
@ -68,6 +70,15 @@ export default function AccountComposition(props: Props) {
|
||||
return [updatedPositionValue, updatedDebtsBalance]
|
||||
}, [updatedAccount, prices, assets])
|
||||
|
||||
const netWorth = useMemo(
|
||||
() => calculateAccountBalanceValue(account, prices, assets),
|
||||
[account, assets, prices],
|
||||
)
|
||||
const updatedTotalBalance = useMemo(
|
||||
() => (updatedAccount ? calculateAccountBalanceValue(updatedAccount, prices, assets) : BN_ZERO),
|
||||
[updatedAccount, prices, assets],
|
||||
)
|
||||
|
||||
const apr = useMemo(
|
||||
() =>
|
||||
calculateAccountApr(
|
||||
@ -77,19 +88,9 @@ export default function AccountComposition(props: Props) {
|
||||
prices,
|
||||
hlsStrategies,
|
||||
assets,
|
||||
vaultAprs,
|
||||
props.isHls,
|
||||
),
|
||||
[
|
||||
account,
|
||||
assets,
|
||||
borrowAssetsData,
|
||||
hlsStrategies,
|
||||
lendingAssetsData,
|
||||
prices,
|
||||
props.isHls,
|
||||
vaultAprs,
|
||||
],
|
||||
[account, assets, borrowAssetsData, hlsStrategies, lendingAssetsData, prices, props.isHls],
|
||||
)
|
||||
const updatedApr = useMemo(
|
||||
() =>
|
||||
@ -101,7 +102,6 @@ export default function AccountComposition(props: Props) {
|
||||
prices,
|
||||
hlsStrategies,
|
||||
assets,
|
||||
vaultAprs,
|
||||
props.isHls,
|
||||
)
|
||||
: BN_ZERO,
|
||||
@ -112,7 +112,6 @@ export default function AccountComposition(props: Props) {
|
||||
prices,
|
||||
hlsStrategies,
|
||||
assets,
|
||||
vaultAprs,
|
||||
props.isHls,
|
||||
],
|
||||
)
|
||||
@ -132,11 +131,17 @@ export default function AccountComposition(props: Props) {
|
||||
className='pb-3'
|
||||
isDecrease
|
||||
/>
|
||||
<Item
|
||||
title='Net worth'
|
||||
current={netWorth}
|
||||
change={hasChanged ? updatedTotalBalance : netWorth}
|
||||
className='py-3 font-bold border border-transparent border-y-white/20'
|
||||
/>
|
||||
<Item
|
||||
title='APR'
|
||||
current={apr}
|
||||
change={hasChanged ? updatedApr : apr}
|
||||
className='pb-3'
|
||||
className='py-3'
|
||||
isPercentage
|
||||
/>
|
||||
</div>
|
||||
@ -162,7 +167,6 @@ function Item(props: ItemProps) {
|
||||
suffix: '%',
|
||||
minDecimals: 2,
|
||||
maxDecimals: current.abs().isLessThan(0.1) ? MAX_AMOUNT_DECIMALS : 2,
|
||||
abbreviated: false,
|
||||
}}
|
||||
className='text-sm'
|
||||
animate
|
||||
@ -171,7 +175,6 @@ function Item(props: ItemProps) {
|
||||
<DisplayCurrency
|
||||
coin={BNCoin.fromDenomAndBigNumber(ORACLE_DENOM, current)}
|
||||
className='text-sm'
|
||||
options={{ abbreviated: false }}
|
||||
/>
|
||||
)}
|
||||
{current.toFixed(2) !== change.toFixed(2) && (
|
||||
@ -194,7 +197,6 @@ function Item(props: ItemProps) {
|
||||
<DisplayCurrency
|
||||
coin={BNCoin.fromDenomAndBigNumber(ORACLE_DENOM, change)}
|
||||
className={classNames('text-sm', increase ? 'text-profit' : 'text-loss')}
|
||||
options={{ abbreviated: false }}
|
||||
/>
|
||||
)}
|
||||
</>
|
||||
|
||||
@ -0,0 +1,54 @@
|
||||
import classNames from 'classnames'
|
||||
|
||||
import { FormattedNumber } from 'components/common/FormattedNumber'
|
||||
import { ArrowRight } from 'components/common/Icons'
|
||||
|
||||
interface Props {
|
||||
leverage: number
|
||||
updatedLeverage: number | null
|
||||
}
|
||||
|
||||
export default function AccountDetailsLeverage(props: Props) {
|
||||
const { leverage, updatedLeverage } = props
|
||||
|
||||
if (!updatedLeverage) {
|
||||
return (
|
||||
<FormattedNumber
|
||||
className={'w-full text-center text-2xs'}
|
||||
amount={isNaN(leverage) ? 0 : leverage}
|
||||
options={{
|
||||
maxDecimals: 2,
|
||||
minDecimals: 2,
|
||||
suffix: 'x',
|
||||
}}
|
||||
animate
|
||||
/>
|
||||
)
|
||||
}
|
||||
|
||||
return (
|
||||
<div className='flex'>
|
||||
<FormattedNumber
|
||||
className={'w-full text-center text-2xs'}
|
||||
amount={isNaN(leverage) ? 1 : leverage}
|
||||
options={{
|
||||
maxDecimals: 1,
|
||||
minDecimals: 1,
|
||||
rounded: true,
|
||||
}}
|
||||
animate
|
||||
/>
|
||||
<ArrowRight width={12} />
|
||||
<FormattedNumber
|
||||
className={classNames(
|
||||
'w-full text-center text-2xs',
|
||||
updatedLeverage > leverage && 'text-loss',
|
||||
updatedLeverage < leverage && 'text-profit',
|
||||
)}
|
||||
amount={isNaN(updatedLeverage) ? 0 : updatedLeverage}
|
||||
options={{ maxDecimals: 1, minDecimals: 1, rounded: true }}
|
||||
animate
|
||||
/>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
@ -1,18 +1,20 @@
|
||||
import classNames from 'classnames'
|
||||
import { useMemo } from 'react'
|
||||
import { useCallback, useMemo } from 'react'
|
||||
import { useLocation } from 'react-router-dom'
|
||||
|
||||
import AccountBalancesTable from 'components/account/AccountBalancesTable'
|
||||
import AccountComposition from 'components/account/AccountComposition'
|
||||
import AccountDetailsLeverage from 'components/account/AccountDetails/AccountDetailsLeverage'
|
||||
import Skeleton from 'components/account/AccountDetails/Skeleton'
|
||||
import AccountSummary from 'components/account/AccountSummary'
|
||||
import AccountSummaryLeverage from 'components/account/AccountSummary/AccountSummaryLeverage'
|
||||
import AccountPerpPositionTable from 'components/account/AccountPerpPositionTable'
|
||||
import { HealthGauge } from 'components/account/Health/HealthGauge'
|
||||
import useBorrowMarketAssetsTableData from 'components/borrow/Table/useBorrowMarketAssetsTableData'
|
||||
import EscButton from 'components/common/Button/EscButton'
|
||||
import { glowElement } from 'components/common/Button/utils'
|
||||
import Card from 'components/common/Card'
|
||||
import DisplayCurrency from 'components/common/DisplayCurrency'
|
||||
import { FormattedNumber } from 'components/common/FormattedNumber'
|
||||
import { ThreeDots } from 'components/common/Icons'
|
||||
import Text from 'components/common/Text'
|
||||
import useLendingMarketAssetsTableData from 'components/earn/lend/Table/useLendingMarketAssetsTableData'
|
||||
import { DEFAULT_SETTINGS } from 'constants/defaultSettings'
|
||||
import { LocalStorageKeys } from 'constants/localStorageKeys'
|
||||
import { ORACLE_DENOM } from 'constants/oracle'
|
||||
@ -22,10 +24,11 @@ import useCurrentAccount from 'hooks/accounts/useCurrentAccount'
|
||||
import useAllAssets from 'hooks/assets/useAllAssets'
|
||||
import useLocalStorage from 'hooks/localStorage/useLocalStorage'
|
||||
import useAccountId from 'hooks/useAccountId'
|
||||
import useHealthComputer from 'hooks/useHealthComputer'
|
||||
import useBorrowMarketAssetsTableData from 'hooks/useBorrowMarketAssetsTableData'
|
||||
import useHLSStakingAssets from 'hooks/useHLSStakingAssets'
|
||||
import useHealthComputer from 'hooks/useHealthComputer'
|
||||
import useLendingMarketAssetsTableData from 'hooks/useLendingMarketAssetsTableData'
|
||||
import usePrices from 'hooks/usePrices'
|
||||
import useVaultAprs from 'hooks/vaults/useVaultAprs'
|
||||
import useStore from 'store'
|
||||
import { BNCoin } from 'types/classes/BNCoin'
|
||||
import {
|
||||
@ -37,9 +40,8 @@ import {
|
||||
export default function AccountDetailsController() {
|
||||
const address = useStore((s) => s.address)
|
||||
const isHLS = useStore((s) => s.isHLS)
|
||||
const { data: _, isLoading } = useAccounts('default', address)
|
||||
const { data: accounts, isLoading } = useAccounts('default', address)
|
||||
const { data: accountIds } = useAccountIds(address, false, true)
|
||||
|
||||
const accountId = useAccountId()
|
||||
|
||||
const account = useCurrentAccount()
|
||||
@ -61,7 +63,6 @@ function AccountDetails(props: Props) {
|
||||
const { account } = props
|
||||
const location = useLocation()
|
||||
const { data: hlsStrategies } = useHLSStakingAssets()
|
||||
const { data: vaultAprs } = useVaultAprs()
|
||||
const [reduceMotion] = useLocalStorage<boolean>(
|
||||
LocalStorageKeys.REDUCE_MOTION,
|
||||
DEFAULT_SETTINGS.reduceMotion,
|
||||
@ -110,25 +111,28 @@ function AccountDetails(props: Props) {
|
||||
prices,
|
||||
hlsStrategies,
|
||||
assets,
|
||||
vaultAprs,
|
||||
account.kind === 'high_levered_strategy',
|
||||
),
|
||||
[
|
||||
account,
|
||||
assets,
|
||||
borrowAssetsData,
|
||||
hlsStrategies,
|
||||
lendingAssetsData,
|
||||
prices,
|
||||
updatedAccount,
|
||||
vaultAprs,
|
||||
],
|
||||
[account, assets, borrowAssetsData, hlsStrategies, lendingAssetsData, prices, updatedAccount],
|
||||
)
|
||||
const isFullWidth =
|
||||
location.pathname.includes('trade') ||
|
||||
location.pathname === '/' ||
|
||||
location.pathname.includes('perps')
|
||||
|
||||
function AccountDetailsHeader() {
|
||||
const onClose = useCallback(() => useStore.setState({ accountDetailsExpanded: false }), [])
|
||||
|
||||
return (
|
||||
<div className='flex items-center justify-between w-full p-4 bg-white/10 '>
|
||||
<Text size='lg' className='flex items-center flex-grow font-semibold'>
|
||||
{`Credit Account ${account.id}`}
|
||||
</Text>
|
||||
<EscButton onClick={onClose} hideText className='w-6 h-6' />
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
return (
|
||||
<>
|
||||
{!isFullWidth && accountDetailsExpanded && (
|
||||
@ -140,95 +144,56 @@ function AccountDetails(props: Props) {
|
||||
<div
|
||||
data-testid='account-details'
|
||||
className={classNames(
|
||||
accountDetailsExpanded ? 'right-4' : '-right-74',
|
||||
'w-94 flex items-start gap-4 absolute top-6 z-2',
|
||||
!reduceMotion && 'transition-all duration-500',
|
||||
accountDetailsExpanded ? 'right-4' : '-right-90',
|
||||
'w-110 flex items-start gap-4 absolute top-6',
|
||||
!reduceMotion && 'transition-all duration-300',
|
||||
)}
|
||||
>
|
||||
<div
|
||||
className={classNames(
|
||||
'group/accountdetail relative min-h-75',
|
||||
'flex flex-wrap min-w-16 w-16 group/accountdetail relative',
|
||||
'border rounded-base border-white/20',
|
||||
'backdrop-blur-sticky z-3 overflow-hidden',
|
||||
!reduceMotion && 'transition-all duration-500',
|
||||
accountDetailsExpanded
|
||||
? 'is-expanded w-full h-auto'
|
||||
: 'w-16 hover:bg-white/10 hover:cursor-pointer bg-white/5',
|
||||
'bg-white/5 backdrop-blur-sticky z-2',
|
||||
!reduceMotion && 'transition-colors duration-300',
|
||||
'hover:bg-white/10 hover:cursor-pointer ',
|
||||
)}
|
||||
onClick={() => {
|
||||
if (accountDetailsExpanded) return
|
||||
useStore.setState({ accountDetailsExpanded: true })
|
||||
}}
|
||||
onClick={() => useStore.setState({ accountDetailsExpanded: !accountDetailsExpanded })}
|
||||
>
|
||||
<div
|
||||
className={classNames(
|
||||
'w-16 pr-[1px]',
|
||||
accountDetailsExpanded
|
||||
? 'opacity-0 absolute inset-0 -z-1'
|
||||
: 'transition-opacity opacity-100 duration-300 delay-200',
|
||||
)}
|
||||
>
|
||||
<div className='flex flex-wrap justify-center w-full py-4'>
|
||||
<HealthGauge
|
||||
health={health}
|
||||
updatedHealth={updatedHealth}
|
||||
healthFactor={healthFactor}
|
||||
updatedHealthFactor={updatedHealthFactor}
|
||||
/>
|
||||
<Text size='2xs' className='mb-0.5 mt-1 w-full text-center text-white/50'>
|
||||
Health
|
||||
</Text>
|
||||
</div>
|
||||
<div className='w-full py-4 border-t border-white/20'>
|
||||
<Text
|
||||
size='2xs'
|
||||
className='mb-0.5 w-full text-center text-white/50 whitespace-nowrap'
|
||||
>
|
||||
Net worth
|
||||
</Text>
|
||||
<DisplayCurrency coin={coin} className='w-full text-center truncate text-2xs ' />
|
||||
</div>
|
||||
<div className='w-full py-4 border-t border-white/20'>
|
||||
<Text size='2xs' className='mb-0.5 w-full text-center text-white/50'>
|
||||
Leverage
|
||||
</Text>
|
||||
<AccountSummaryLeverage
|
||||
leverage={leverage.toNumber() || 1}
|
||||
updatedLeverage={updatedLeverage?.toNumber() || null}
|
||||
/>
|
||||
</div>
|
||||
<div className='w-full py-4 border-t border-white/20'>
|
||||
<Text size='2xs' className='mb-0.5 w-full text-center text-white/50'>
|
||||
APR
|
||||
</Text>
|
||||
<FormattedNumber
|
||||
className={'w-full text-center text-2xs'}
|
||||
amount={apr.toNumber()}
|
||||
options={{ maxDecimals: 2, minDecimals: 2, suffix: '%' }}
|
||||
animate
|
||||
/>
|
||||
</div>
|
||||
<div className='flex flex-wrap justify-center w-full py-4'>
|
||||
<HealthGauge
|
||||
health={health}
|
||||
updatedHealth={updatedHealth}
|
||||
healthFactor={healthFactor}
|
||||
updatedHealthFactor={updatedHealthFactor}
|
||||
/>
|
||||
<Text size='2xs' className='mb-0.5 mt-1 w-full text-center text-white/50'>
|
||||
Health
|
||||
</Text>
|
||||
</div>
|
||||
<div
|
||||
className={classNames(
|
||||
'grid relative z-2',
|
||||
!reduceMotion && 'transition-[grid-template-rows,opacity]',
|
||||
accountDetailsExpanded
|
||||
? 'transition-[grid-template-rows,opacity] opacity-100 delay-200 duration-600 grid-rows-[1fr]'
|
||||
: 'transition-opacity opacity-0 duration-300 grid-rows-[0fr]',
|
||||
)}
|
||||
>
|
||||
<div className='overflow-hidden'>
|
||||
<AccountSummary account={account} isAccountDetails />
|
||||
</div>
|
||||
<div
|
||||
className={classNames(
|
||||
'absolute inset-0 -z-1',
|
||||
'before:content-[""] before:transition-opacity before:-z-1 before:absolute before:left-0 before:h-full before:w-full before:bg-white/10 before:rounded-b-base before:border-t before:border-white/10',
|
||||
accountDetailsExpanded
|
||||
? 'before:opacity-100 before:delay-500 before:top-full'
|
||||
: 'before:opacity-0 before:duration-0',
|
||||
)}
|
||||
<div className='w-full py-4 border-t border-white/20'>
|
||||
<Text size='2xs' className='mb-0.5 w-full text-center text-white/50 whitespace-nowrap'>
|
||||
Net worth
|
||||
</Text>
|
||||
<DisplayCurrency coin={coin} className='w-full text-center truncate text-2xs ' />
|
||||
</div>
|
||||
<div className='w-full py-4 border-t border-white/20'>
|
||||
<Text size='2xs' className='mb-0.5 w-full text-center text-white/50'>
|
||||
Leverage
|
||||
</Text>
|
||||
<AccountDetailsLeverage
|
||||
leverage={leverage.toNumber() || 1}
|
||||
updatedLeverage={updatedLeverage?.toNumber() || null}
|
||||
/>
|
||||
</div>
|
||||
<div className='w-full py-4 border-t border-white/20'>
|
||||
<Text size='2xs' className='mb-0.5 w-full text-center text-white/50'>
|
||||
APR
|
||||
</Text>
|
||||
<FormattedNumber
|
||||
className={'w-full text-center text-2xs'}
|
||||
amount={apr.toNumber()}
|
||||
options={{ maxDecimals: 2, minDecimals: 2, suffix: '%' }}
|
||||
animate
|
||||
/>
|
||||
</div>
|
||||
<div
|
||||
@ -244,6 +209,24 @@ function AccountDetails(props: Props) {
|
||||
|
||||
{glowElement(!reduceMotion)}
|
||||
</div>
|
||||
<div className='flex w-90 backdrop-blur-sticky z-2'>
|
||||
<Card className='w-90 bg-white/5' title={<AccountDetailsHeader />}>
|
||||
<AccountComposition account={account} />
|
||||
<Text className='w-full px-4 py-2 text-white bg-white/10'>Balances</Text>
|
||||
<AccountBalancesTable
|
||||
account={account}
|
||||
borrowingData={borrowAssetsData}
|
||||
lendingData={lendingAssetsData}
|
||||
hideCard
|
||||
/>
|
||||
{account.perps.length > 0 && (
|
||||
<>
|
||||
<Text className='w-full px-4 py-2 text-white bg-white/10'>Perp Positions</Text>
|
||||
<AccountPerpPositionTable account={account} hideCard />
|
||||
</>
|
||||
)}
|
||||
</Card>
|
||||
</div>
|
||||
</div>
|
||||
</>
|
||||
)
|
||||
|
||||
@ -10,7 +10,7 @@ import Text from 'components/common/Text'
|
||||
import WalletBridges from 'components/Wallet/WalletBridges'
|
||||
import { BN_ZERO } from 'constants/math'
|
||||
import useBaseAsset from 'hooks/assets/useBasetAsset'
|
||||
import useMarkets from 'hooks/markets/useMarkets'
|
||||
import useMarketAssets from 'hooks/markets/useMarketAssets'
|
||||
import useAutoLend from 'hooks/useAutoLend'
|
||||
import { useUpdatedAccount } from 'hooks/useUpdatedAccount'
|
||||
import useWalletBalances from 'hooks/useWalletBalances'
|
||||
@ -35,8 +35,7 @@ export default function AccountFundContent(props: Props) {
|
||||
const { autoLendEnabledAccountIds } = useAutoLend()
|
||||
const isLending = autoLendEnabledAccountIds.includes(props.accountId)
|
||||
const [fundingAssets, setFundingAssets] = useState<BNCoin[]>([])
|
||||
const markets = useMarkets()
|
||||
|
||||
const { data: marketAssets } = useMarketAssets()
|
||||
const { data: walletBalances } = useWalletBalances(props.address)
|
||||
const { simulateDeposits } = useUpdatedAccount(props.account)
|
||||
const baseAsset = useBaseAsset()
|
||||
@ -95,6 +94,10 @@ export default function AccountFundContent(props: Props) {
|
||||
}
|
||||
}, [baseBalance])
|
||||
|
||||
useEffect(() => {
|
||||
simulateDeposits(isLending ? 'lend' : 'deposit', fundingAssets)
|
||||
}, [isLending, fundingAssets, simulateDeposits])
|
||||
|
||||
useEffect(() => {
|
||||
const currentSelectedDenom = fundingAssets.map((asset) => asset.denom)
|
||||
|
||||
@ -121,14 +124,10 @@ export default function AccountFundContent(props: Props) {
|
||||
})
|
||||
}, [])
|
||||
|
||||
const onDebounce = useCallback(() => {
|
||||
simulateDeposits(isLending ? 'lend' : 'deposit', fundingAssets)
|
||||
}, [isLending, fundingAssets, simulateDeposits])
|
||||
|
||||
const depositCapReachedCoins = useMemo(() => {
|
||||
const depositCapReachedCoins: BNCoin[] = []
|
||||
fundingAssets.forEach((asset) => {
|
||||
const marketAsset = markets.find((market) => market.asset.denom === asset.denom)
|
||||
const marketAsset = marketAssets.find(byDenom(asset.denom))
|
||||
if (!marketAsset) return
|
||||
|
||||
const capLeft = getCapLeftWithBuffer(marketAsset.cap)
|
||||
@ -138,7 +137,7 @@ export default function AccountFundContent(props: Props) {
|
||||
depositCapReachedCoins.push(BNCoin.fromDenomAndBigNumber(asset.denom, capLeft))
|
||||
})
|
||||
return depositCapReachedCoins
|
||||
}, [fundingAssets, markets])
|
||||
}, [fundingAssets, marketAssets])
|
||||
|
||||
return (
|
||||
<>
|
||||
@ -159,7 +158,6 @@ export default function AccountFundContent(props: Props) {
|
||||
amount={coin.amount ?? BN_ZERO}
|
||||
isConfirming={isConfirming}
|
||||
updateFundingAssets={updateFundingAssets}
|
||||
onDebounce={onDebounce}
|
||||
/>
|
||||
</div>
|
||||
)
|
||||
|
||||
@ -10,7 +10,6 @@ interface Props {
|
||||
denom: string
|
||||
isConfirming: boolean
|
||||
updateFundingAssets: (amount: BigNumber, denom: string) => void
|
||||
onDebounce: () => void
|
||||
}
|
||||
|
||||
export default function AccountFundRow(props: Props) {
|
||||
@ -24,7 +23,6 @@ export default function AccountFundRow(props: Props) {
|
||||
<TokenInputWithSlider
|
||||
asset={asset}
|
||||
onChange={(amount) => props.updateFundingAssets(amount, asset.denom)}
|
||||
onDebounce={props.onDebounce}
|
||||
amount={props.amount}
|
||||
max={balance}
|
||||
balances={props.balances}
|
||||
|
||||
@ -2,17 +2,16 @@ import { useCallback, useMemo } from 'react'
|
||||
|
||||
import AccountFundFullPage from 'components/account/AccountFund/AccountFundFullPage'
|
||||
import Skeleton from 'components/account/AccountList/Skeleton'
|
||||
import useBorrowMarketAssetsTableData from 'components/borrow/Table/useBorrowMarketAssetsTableData'
|
||||
import Button from 'components/common/Button'
|
||||
import { ArrowDownLine, ArrowUpLine, TrashBin } from 'components/common/Icons'
|
||||
import SwitchAutoLend from 'components/common/Switch/SwitchAutoLend'
|
||||
import useLendingMarketAssetsTableData from 'components/earn/lend/Table/useLendingMarketAssetsTableData'
|
||||
import useAccount from 'hooks/accounts/useAccount'
|
||||
import useAllAssets from 'hooks/assets/useAllAssets'
|
||||
import useBorrowMarketAssetsTableData from 'hooks/useBorrowMarketAssetsTableData'
|
||||
import useHealthComputer from 'hooks/useHealthComputer'
|
||||
import useHLSStakingAssets from 'hooks/useHLSStakingAssets'
|
||||
import useLendingMarketAssetsTableData from 'hooks/useLendingMarketAssetsTableData'
|
||||
import usePrices from 'hooks/usePrices'
|
||||
import useVaultAprs from 'hooks/vaults/useVaultAprs'
|
||||
import useStore from 'store'
|
||||
import { calculateAccountApr, calculateAccountBalanceValue } from 'utils/accounts'
|
||||
|
||||
@ -28,7 +27,6 @@ export default function AccountStats(props: Props) {
|
||||
const { data: account } = useAccount(accountId)
|
||||
const { data: prices } = usePrices()
|
||||
const { data: hlsStrategies } = useHLSStakingAssets()
|
||||
const { data: vaultAprs } = useVaultAprs()
|
||||
|
||||
const positionBalance = useMemo(
|
||||
() => (!account ? null : calculateAccountBalanceValue(account, prices, assets)),
|
||||
@ -54,10 +52,9 @@ export default function AccountStats(props: Props) {
|
||||
prices,
|
||||
hlsStrategies,
|
||||
assets,
|
||||
vaultAprs,
|
||||
account.kind === 'high_levered_strategy',
|
||||
),
|
||||
[account, assets, borrowAssetsData, hlsStrategies, lendingAssetsData, prices, vaultAprs],
|
||||
[account, assets, borrowAssetsData, hlsStrategies, lendingAssetsData, prices],
|
||||
)
|
||||
|
||||
const deleteAccountHandler = useCallback(() => {
|
||||
|
||||
@ -46,7 +46,12 @@ export default function Skeleton(props: Props) {
|
||||
<Text size='xs' className='w-auto mr-1 text-white/70'>
|
||||
Health
|
||||
</Text>
|
||||
<HealthBar health={health} healthFactor={healthFactor} className='w-[92px] h-0.5' />
|
||||
<HealthBar
|
||||
health={health}
|
||||
healthFactor={healthFactor}
|
||||
className='w-[92px] h-0.5'
|
||||
hasLabel
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -103,7 +103,7 @@ export default function AccountMenuContent() {
|
||||
id={ACCOUNT_MENU_BUTTON_ID}
|
||||
onClick={handleCreateAccountClick}
|
||||
leftIcon={hasCreditAccounts ? <Account /> : <PlusCircled />}
|
||||
color={hasCreditAccounts ? 'secondary' : 'primary'}
|
||||
color={hasCreditAccounts ? 'tertiary' : 'primary'}
|
||||
hasFocus={showMenu}
|
||||
hasSubmenu={hasCreditAccounts}
|
||||
>
|
||||
|
||||
@ -1,6 +1,5 @@
|
||||
import { ReactNode } from 'react'
|
||||
|
||||
import AssetImage from 'components/common/assets/AssetImage'
|
||||
import DisplayCurrency from 'components/common/DisplayCurrency'
|
||||
import { FormattedNumber } from 'components/common/FormattedNumber'
|
||||
import Text from 'components/common/Text'
|
||||
@ -10,25 +9,14 @@ import { BN_ZERO } from 'constants/math'
|
||||
import usePerpsEnabledAssets from 'hooks/assets/usePerpsEnabledAssets'
|
||||
import { BNCoin } from 'types/classes/BNCoin'
|
||||
import { demagnify } from 'utils/formatters'
|
||||
|
||||
export const ASSET_META = {
|
||||
accessorKey: 'symbol',
|
||||
header: 'Asset',
|
||||
id: 'symbol',
|
||||
meta: { className: 'w-40' },
|
||||
}
|
||||
export const ASSET_META = { accessorKey: 'symbol', header: 'Asset', id: 'symbol' }
|
||||
|
||||
interface Props {
|
||||
row: AccountPerpRow
|
||||
}
|
||||
|
||||
interface TooltipProps {
|
||||
row: AccountPerpRow
|
||||
asset: Asset
|
||||
}
|
||||
|
||||
function LabelAndValue(props: { label: string; children: ReactNode; className?: string }) {
|
||||
const { label, children } = props
|
||||
const { label, children, className } = props
|
||||
|
||||
return (
|
||||
<div className='flex items-center justify-between'>
|
||||
@ -40,8 +28,11 @@ function LabelAndValue(props: { label: string; children: ReactNode; className?:
|
||||
)
|
||||
}
|
||||
|
||||
function TooltipContent(props: TooltipProps) {
|
||||
const { row, asset } = props
|
||||
function TooltipContent(props: Props) {
|
||||
const { row } = props
|
||||
const assets = usePerpsEnabledAssets()
|
||||
const asset = assets.find((asset) => asset.symbol === row.symbol)
|
||||
if (!asset) return null
|
||||
|
||||
return (
|
||||
<div className='flex flex-col flex-wrap gap-1 w-50'>
|
||||
@ -59,12 +50,7 @@ function TooltipContent(props: TooltipProps) {
|
||||
/>
|
||||
</LabelAndValue>
|
||||
<LabelAndValue label='Unrealized PnL'>
|
||||
<DisplayCurrency
|
||||
coin={row.pnl.net}
|
||||
options={{ abbreviated: false }}
|
||||
showZero
|
||||
isProfitOrLoss
|
||||
/>
|
||||
<DisplayCurrency coin={row.pnl} options={{ abbreviated: false }} showZero isProfitOrLoss />
|
||||
</LabelAndValue>
|
||||
</div>
|
||||
)
|
||||
@ -72,14 +58,9 @@ function TooltipContent(props: TooltipProps) {
|
||||
|
||||
export default function Asset(props: Props) {
|
||||
const { row } = props
|
||||
const assets = usePerpsEnabledAssets()
|
||||
const asset = assets.find((asset) => asset.symbol === row.symbol)
|
||||
if (!asset) return null
|
||||
|
||||
return (
|
||||
<Tooltip content={<TooltipContent row={row} asset={asset} />} type='info'>
|
||||
<Text size='xs' className='flex items-center gap-2 no-wrap group/asset hover:cursor-help'>
|
||||
<AssetImage asset={asset} size={16} className='w-4 h-4' />
|
||||
<Tooltip content={<TooltipContent row={row} />} type='info'>
|
||||
<Text size='xs' className='flex items-center gap-1 no-wrap group/asset hover:cursor-help'>
|
||||
<span className='pb-[1px] border-b border-white/20 border-dashed group-hover/asset:border-transparent'>
|
||||
{row.symbol}
|
||||
</span>
|
||||
|
||||
@ -1,9 +1,10 @@
|
||||
import DisplayCurrency from 'components/common/DisplayCurrency'
|
||||
import { BNCoin } from 'types/classes/BNCoin'
|
||||
|
||||
export const PNL_META = { id: 'pnl', header: 'Total PnL', meta: { className: 'w-30' } }
|
||||
|
||||
interface Props {
|
||||
pnl: PerpsPnL
|
||||
pnl: BNCoin
|
||||
}
|
||||
|
||||
export default function TotalPnL(props: Props) {
|
||||
@ -12,7 +13,7 @@ export default function TotalPnL(props: Props) {
|
||||
return (
|
||||
<DisplayCurrency
|
||||
className='text-xs text-right number'
|
||||
coin={pnl.net}
|
||||
coin={pnl}
|
||||
options={{ abbreviated: false }}
|
||||
isProfitOrLoss
|
||||
showZero
|
||||
|
||||
@ -6,7 +6,7 @@ export function getAssetAccountPerpRow(
|
||||
prices: BNCoin[],
|
||||
position: PerpsPosition,
|
||||
assets: Asset[],
|
||||
prev?: PerpsPosition,
|
||||
prev?: BNCoin,
|
||||
): AccountPerpRow {
|
||||
const { denom, amount } = position
|
||||
const amountChange = !prev ? position.amount : position.amount.minus(prev.amount)
|
||||
|
||||
@ -1,67 +0,0 @@
|
||||
import { useEffect, useMemo, useState } from 'react'
|
||||
|
||||
import DisplayCurrency from 'components/common/DisplayCurrency'
|
||||
import { InfoCircle } from 'components/common/Icons'
|
||||
import Text from 'components/common/Text'
|
||||
import { Tooltip } from 'components/common/Tooltip'
|
||||
import useLiquidationPrice from 'hooks/useLiquidationPrice'
|
||||
import { BNCoin } from 'types/classes/BNCoin'
|
||||
import { LiquidationPriceKind } from 'utils/health_computer'
|
||||
import { BN } from 'utils/helpers'
|
||||
|
||||
export const LIQ_META = {
|
||||
accessorKey: 'symbol',
|
||||
header: 'Liquidation Price',
|
||||
id: 'liqPrice',
|
||||
meta: { className: 'w-40' },
|
||||
}
|
||||
|
||||
interface Props {
|
||||
amount: number
|
||||
computeLiquidationPrice: (denom: string, kind: LiquidationPriceKind) => number | null
|
||||
denom: string
|
||||
type: PositionType
|
||||
account: Account
|
||||
}
|
||||
|
||||
export default function LiqPrice(props: Props) {
|
||||
const { denom, type, amount, account, computeLiquidationPrice } = props
|
||||
const [lastLiquidationPrice, setLastLiquidationPrice] = useState<number | null>(null)
|
||||
const hasDebt = account.debts.length > 0
|
||||
|
||||
const liqPrice = useMemo(() => {
|
||||
if (type === 'vault' || amount === 0) return 0
|
||||
return computeLiquidationPrice(denom, type === 'borrow' ? 'debt' : 'asset')
|
||||
}, [amount, computeLiquidationPrice, denom, type])
|
||||
|
||||
const { liquidationPrice } = useLiquidationPrice(liqPrice)
|
||||
|
||||
useEffect(() => {
|
||||
if (lastLiquidationPrice !== liqPrice && liqPrice !== null) setLastLiquidationPrice(liqPrice)
|
||||
}, [liqPrice, lastLiquidationPrice])
|
||||
|
||||
const tooltipText = useMemo(() => {
|
||||
if (type === 'vault')
|
||||
return 'Liquidation prices cannot be calculated for farm positions. But it a drop in price of the underlying assets can still cause a liquidation.'
|
||||
if (!hasDebt) return 'Your position cannot be liquidated as you currently have no debt.'
|
||||
return 'The position size is too small to liquidate the account, even if the price goes to $0.00.'
|
||||
}, [type, hasDebt])
|
||||
|
||||
if (!lastLiquidationPrice || (liquidationPrice === 0 && lastLiquidationPrice === 0))
|
||||
return (
|
||||
<Text size='xs' className='flex items-center justify-end number'>
|
||||
N/A
|
||||
<Tooltip content={tooltipText} type='info' className='ml-1'>
|
||||
<InfoCircle className='w-3.5 h-3.5 text-white/40 hover:text-inherit' />
|
||||
</Tooltip>
|
||||
</Text>
|
||||
)
|
||||
|
||||
return (
|
||||
<DisplayCurrency
|
||||
className='text-xs text-right number'
|
||||
coin={BNCoin.fromDenomAndBigNumber('usd', BN(lastLiquidationPrice))}
|
||||
options={{ abbreviated: false }}
|
||||
/>
|
||||
)
|
||||
}
|
||||
@ -1,64 +0,0 @@
|
||||
import classNames from 'classnames'
|
||||
import { useMemo } from 'react'
|
||||
|
||||
import { getSizeChangeColor } from 'components/account/AccountStrategiesTable/functions'
|
||||
import { FormattedNumber } from 'components/common/FormattedNumber'
|
||||
import { MAX_AMOUNT_DECIMALS, MIN_AMOUNT } from 'constants/math'
|
||||
import useAllAssets from 'hooks/assets/useAllAssets'
|
||||
import { BNCoin } from 'types/classes/BNCoin'
|
||||
import { byDenom } from 'utils/array'
|
||||
import { formatAmountToPrecision } from 'utils/formatters'
|
||||
|
||||
export const SIZE_META = { header: 'Size', meta: { className: 'w-40' } }
|
||||
|
||||
interface Props {
|
||||
amount: BNCoin[]
|
||||
amountChange: BNCoin[]
|
||||
}
|
||||
|
||||
export default function Size(props: Props) {
|
||||
const { amount, amountChange } = props
|
||||
const color = useMemo(() => getSizeChangeColor(amountChange), [amountChange])
|
||||
const assets = useAllAssets()
|
||||
const className = classNames('text-xs text-right w-full', color)
|
||||
const minimumAmount = 0.0001
|
||||
|
||||
const primarySymbol = assets.find(byDenom(amount[0].denom))?.symbol
|
||||
const primarySize = amount[0].amount.toString()
|
||||
const primaryFormattedAmount = formatAmountToPrecision(primarySize, MAX_AMOUNT_DECIMALS)
|
||||
const primaryLowAmount =
|
||||
primaryFormattedAmount === 0 ? minimumAmount : Math.max(primaryFormattedAmount, MIN_AMOUNT)
|
||||
|
||||
const secondarySymbol = assets.find(byDenom(amount[1].denom))?.symbol
|
||||
const secondarySize = amount[1].amount.toString()
|
||||
const secondaryFormattedAmount = formatAmountToPrecision(secondarySize, MAX_AMOUNT_DECIMALS)
|
||||
const secondaryLowAmount =
|
||||
secondaryFormattedAmount === 0 ? minimumAmount : Math.max(secondaryFormattedAmount, MIN_AMOUNT)
|
||||
|
||||
return (
|
||||
<div className='flex flex-wrap'>
|
||||
<FormattedNumber
|
||||
className={className}
|
||||
smallerThanThreshold={primaryFormattedAmount < MIN_AMOUNT}
|
||||
amount={primaryLowAmount}
|
||||
options={{
|
||||
maxDecimals: 4,
|
||||
minDecimals: 0,
|
||||
suffix: ` ${primarySymbol}`,
|
||||
}}
|
||||
animate
|
||||
/>
|
||||
<FormattedNumber
|
||||
className={className}
|
||||
smallerThanThreshold={secondaryFormattedAmount < MIN_AMOUNT}
|
||||
amount={secondaryLowAmount}
|
||||
options={{
|
||||
maxDecimals: 4,
|
||||
minDecimals: 0,
|
||||
suffix: ` ${secondarySymbol}`,
|
||||
}}
|
||||
animate
|
||||
/>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
@ -1,39 +0,0 @@
|
||||
import classNames from 'classnames'
|
||||
|
||||
import { getSizeChangeColor } from 'components/account/AccountStrategiesTable/functions'
|
||||
import DisplayCurrency from 'components/common/DisplayCurrency'
|
||||
import Text from 'components/common/Text'
|
||||
import { ORACLE_DENOM } from 'constants/oracle'
|
||||
import { BNCoin } from 'types/classes/BNCoin'
|
||||
import { BN } from 'utils/helpers'
|
||||
export const STRATEGY_AND_VALUE_META = {
|
||||
header: 'Strategy & Value',
|
||||
id: 'name',
|
||||
meta: { className: 'w-40' },
|
||||
}
|
||||
|
||||
interface Props {
|
||||
name: string
|
||||
value: string
|
||||
amountChange: BNCoin[]
|
||||
}
|
||||
|
||||
export default function StrategyAndValue(props: Props) {
|
||||
const { name, value, amountChange } = props
|
||||
const color = getSizeChangeColor(amountChange)
|
||||
const coin = BNCoin.fromDenomAndBigNumber(ORACLE_DENOM, BN(value))
|
||||
|
||||
return (
|
||||
<div className='flex flex-wrap'>
|
||||
<Text size='xs' className='text-white'>
|
||||
{`${name} LP`}
|
||||
</Text>
|
||||
<DisplayCurrency
|
||||
coin={coin}
|
||||
className={classNames('text-xs text-right', color)}
|
||||
options={{ abbreviated: false }}
|
||||
showZero
|
||||
/>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
@ -1,44 +0,0 @@
|
||||
import { Row } from '@tanstack/react-table'
|
||||
import classNames from 'classnames'
|
||||
|
||||
import { getAmountChangeColor } from 'components/account/AccountBalancesTable/functions'
|
||||
import DisplayCurrency from 'components/common/DisplayCurrency'
|
||||
import { ORACLE_DENOM } from 'constants/oracle'
|
||||
import { BNCoin } from 'types/classes/BNCoin'
|
||||
import { BN } from 'utils/helpers'
|
||||
|
||||
export const VALUE_META = { accessorKey: 'value', header: 'Value' }
|
||||
|
||||
interface Props {
|
||||
amountChange: BigNumber
|
||||
value: string
|
||||
type: PositionType
|
||||
}
|
||||
|
||||
export const valueBalancesSortingFn = (
|
||||
a: Row<AccountBalanceRow>,
|
||||
b: Row<AccountBalanceRow>,
|
||||
): number => {
|
||||
const valueA = BN(a.original.value)
|
||||
const valueB = BN(b.original.value)
|
||||
return valueA.minus(valueB).toNumber()
|
||||
}
|
||||
|
||||
export const valuePerpSortingFn = (a: Row<AccountPerpRow>, b: Row<AccountPerpRow>): number => {
|
||||
const valueA = BN(a.original.value)
|
||||
const valueB = BN(b.original.value)
|
||||
return valueA.minus(valueB).toNumber()
|
||||
}
|
||||
|
||||
export default function Value(props: Props) {
|
||||
const { amountChange, type, value } = props
|
||||
const color = getAmountChangeColor(type, amountChange)
|
||||
const coin = new BNCoin({
|
||||
denom: ORACLE_DENOM,
|
||||
amount: value,
|
||||
})
|
||||
|
||||
return (
|
||||
<DisplayCurrency coin={coin} className={classNames('text-xs text-right', color)} showZero />
|
||||
)
|
||||
}
|
||||
@ -1,40 +0,0 @@
|
||||
import { ColumnDef } from '@tanstack/react-table'
|
||||
import { useMemo } from 'react'
|
||||
|
||||
import Apy, { APY_META } from 'components/account/AccountBalancesTable/Columns/Apy'
|
||||
import Size, { SIZE_META } from 'components/account/AccountStrategiesTable/Columns/Size'
|
||||
import StrategyAndValue, {
|
||||
STRATEGY_AND_VALUE_META,
|
||||
} from 'components/account/AccountStrategiesTable/Columns/StrategyAndValue'
|
||||
import useMarkets from 'hooks/markets/useMarkets'
|
||||
|
||||
export default function useAccountStrategiesColumns(account: Account) {
|
||||
const markets = useMarkets()
|
||||
|
||||
return useMemo<ColumnDef<AccountStrategyRow>[]>(() => {
|
||||
return [
|
||||
{
|
||||
...STRATEGY_AND_VALUE_META,
|
||||
cell: ({ row }) => (
|
||||
<StrategyAndValue
|
||||
name={row.original.name}
|
||||
value={row.original.value}
|
||||
amountChange={row.original.amountChange}
|
||||
/>
|
||||
),
|
||||
},
|
||||
{
|
||||
...SIZE_META,
|
||||
cell: ({ row }) => (
|
||||
<Size amount={row.original.amount} amountChange={row.original.amountChange} />
|
||||
),
|
||||
},
|
||||
{
|
||||
...APY_META,
|
||||
cell: ({ row }) => (
|
||||
<Apy apy={row.original.apy} markets={markets} denom={row.original.denom} type={'vault'} />
|
||||
),
|
||||
},
|
||||
]
|
||||
}, [markets])
|
||||
}
|
||||
@ -1,70 +0,0 @@
|
||||
import { BN_ONE, BN_ZERO } from 'constants/math'
|
||||
import { BNCoin } from 'types/classes/BNCoin'
|
||||
import { byDenom } from 'utils/array'
|
||||
|
||||
export function getVaultAccountStrategiesRow(
|
||||
vault: DepositedVault,
|
||||
prices: BNCoin[],
|
||||
apy?: number | null,
|
||||
prev?: DepositedVault,
|
||||
): AccountStrategyRow {
|
||||
const { name } = vault
|
||||
const previous = prev || vault
|
||||
const totalLockedValue = vault.values.primary.plus(vault.values.secondary)
|
||||
const totalValue = totalLockedValue.plus(vault.values.unlocked).plus(vault.values.unlocking)
|
||||
const prevTotalValue = previous.values.primary
|
||||
.plus(previous.values.secondary)
|
||||
.plus(previous.values.unlocked)
|
||||
.plus(previous.values.unlocking)
|
||||
|
||||
if (totalLockedValue.isLessThan(totalValue) && apy) {
|
||||
apy = totalLockedValue.dividedBy(totalValue).times(apy).toNumber()
|
||||
}
|
||||
|
||||
const halfValue = totalValue.dividedBy(2)
|
||||
const halfValuePrev = prevTotalValue.dividedBy(2)
|
||||
const primaryPrice =
|
||||
prices.find(byDenom(vault.denoms.primary)) ??
|
||||
BNCoin.fromDenomAndBigNumber(vault.denoms.primary, BN_ONE)
|
||||
const primaryAmount = halfValue.dividedBy(primaryPrice.amount)
|
||||
const primaryAmountPrev = halfValuePrev.dividedBy(primaryPrice.amount)
|
||||
|
||||
const secondaryPrice =
|
||||
prices.find(byDenom(vault.denoms.secondary)) ??
|
||||
BNCoin.fromDenomAndBigNumber(vault.denoms.secondary, BN_ONE)
|
||||
const secondaryAmount = halfValue.dividedBy(secondaryPrice.amount)
|
||||
const secondaryAmountPrev = halfValuePrev.dividedBy(secondaryPrice.amount)
|
||||
|
||||
const amountChange = [
|
||||
BNCoin.fromDenomAndBigNumber(
|
||||
vault.denoms.primary,
|
||||
!prev ? BN_ZERO : primaryAmount.minus(primaryAmountPrev),
|
||||
),
|
||||
BNCoin.fromDenomAndBigNumber(
|
||||
vault.denoms.secondary,
|
||||
!prev ? BN_ZERO : secondaryAmount.minus(secondaryAmountPrev),
|
||||
),
|
||||
]
|
||||
|
||||
return {
|
||||
name: name,
|
||||
denom: vault.denoms.lp,
|
||||
amount: [
|
||||
BNCoin.fromDenomAndBigNumber(vault.denoms.primary, primaryAmount),
|
||||
BNCoin.fromDenomAndBigNumber(vault.denoms.secondary, secondaryAmount),
|
||||
],
|
||||
value: totalValue.toString(),
|
||||
apy,
|
||||
amountChange: amountChange,
|
||||
}
|
||||
}
|
||||
|
||||
export function getSizeChangeColor(amountChange: BNCoin[]) {
|
||||
const primaryChange = amountChange[0].amount
|
||||
const secondaryChange = amountChange[1].amount
|
||||
|
||||
if (primaryChange.isGreaterThan(0) || secondaryChange.isGreaterThan(0)) return 'text-profit'
|
||||
if (primaryChange.isLessThan(0) || secondaryChange.isLessThan(0)) return 'text-loss'
|
||||
|
||||
return ''
|
||||
}
|
||||
@ -1,38 +0,0 @@
|
||||
import classNames from 'classnames'
|
||||
|
||||
import useAccountStrategiesColumns from 'components/account/AccountStrategiesTable/Columns/useAccountStrategiesColumns'
|
||||
import useAccountStrategiesData from 'components/account/AccountStrategiesTable/useAccountStrategiesData'
|
||||
import Table from 'components/common/Table'
|
||||
import useStore from 'store'
|
||||
|
||||
interface Props {
|
||||
account: Account
|
||||
hideCard?: boolean
|
||||
tableBodyClassName?: string
|
||||
}
|
||||
|
||||
export default function AccountStrategiesTable(props: Props) {
|
||||
const { account, tableBodyClassName, hideCard } = props
|
||||
const updatedAccount = useStore((s) => s.updatedAccount)
|
||||
const accountStrategiesData = useAccountStrategiesData({
|
||||
account,
|
||||
updatedAccount,
|
||||
})
|
||||
|
||||
const columns = useAccountStrategiesColumns(account)
|
||||
|
||||
if (accountStrategiesData.length === 0) return null
|
||||
|
||||
return (
|
||||
<Table
|
||||
title='Strategies'
|
||||
columns={columns}
|
||||
data={accountStrategiesData}
|
||||
tableBodyClassName={classNames(tableBodyClassName, 'text-white/60')}
|
||||
initialSorting={[]}
|
||||
spacingClassName='p-2'
|
||||
hideCard={hideCard}
|
||||
type='strategies'
|
||||
/>
|
||||
)
|
||||
}
|
||||
@ -1,29 +0,0 @@
|
||||
import { useMemo } from 'react'
|
||||
|
||||
import { getVaultAccountStrategiesRow } from 'components/account/AccountStrategiesTable/functions'
|
||||
import usePrices from 'hooks/usePrices'
|
||||
import useVaultAprs from 'hooks/vaults/useVaultAprs'
|
||||
|
||||
interface Props {
|
||||
account: Account
|
||||
updatedAccount?: Account
|
||||
}
|
||||
|
||||
export default function useAccountStategiesData(props: Props) {
|
||||
const { account, updatedAccount } = props
|
||||
const { data: prices } = usePrices()
|
||||
const { data: vaultAprs } = useVaultAprs()
|
||||
return useMemo<AccountStrategyRow[]>(() => {
|
||||
const usedAccount = updatedAccount ?? account
|
||||
const accountVaults = usedAccount?.vaults ?? []
|
||||
|
||||
return accountVaults.map((vault) => {
|
||||
const apy = vaultAprs.find((vaultApr) => vaultApr.address === vault.address)?.apy
|
||||
const prevVault = updatedAccount
|
||||
? account?.vaults.find((position) => position.name === vault.name)
|
||||
: vault
|
||||
|
||||
return getVaultAccountStrategiesRow(vault, prices, apy, prevVault)
|
||||
})
|
||||
}, [updatedAccount, account, vaultAprs, prices])
|
||||
}
|
||||
202
src/components/account/AccountSummary.tsx
Normal file
202
src/components/account/AccountSummary.tsx
Normal file
@ -0,0 +1,202 @@
|
||||
import classNames from 'classnames'
|
||||
import { HTMLAttributes, useCallback, useMemo } from 'react'
|
||||
|
||||
import AccountBalancesTable from 'components/account/AccountBalancesTable'
|
||||
import AccountComposition from 'components/account/AccountComposition'
|
||||
import AccountPerpPositionTable from 'components/account/AccountPerpPositionTable'
|
||||
import HealthBar from 'components/account/Health/HealthBar'
|
||||
import Accordion from 'components/common/Accordion'
|
||||
import Card from 'components/common/Card'
|
||||
import DisplayCurrency from 'components/common/DisplayCurrency'
|
||||
import { FormattedNumber } from 'components/common/FormattedNumber'
|
||||
import { ArrowRight } from 'components/common/Icons'
|
||||
import Text from 'components/common/Text'
|
||||
import { DEFAULT_SETTINGS } from 'constants/defaultSettings'
|
||||
import { LocalStorageKeys } from 'constants/localStorageKeys'
|
||||
import { BN_ZERO } from 'constants/math'
|
||||
import { ORACLE_DENOM } from 'constants/oracle'
|
||||
import useAllAssets from 'hooks/assets/useAllAssets'
|
||||
import useLocalStorage from 'hooks/localStorage/useLocalStorage'
|
||||
import useBorrowMarketAssetsTableData from 'hooks/useBorrowMarketAssetsTableData'
|
||||
import useHealthComputer from 'hooks/useHealthComputer'
|
||||
import useLendingMarketAssetsTableData from 'hooks/useLendingMarketAssetsTableData'
|
||||
import usePrices from 'hooks/usePrices'
|
||||
import useStore from 'store'
|
||||
import { BNCoin } from 'types/classes/BNCoin'
|
||||
import { calculateAccountBalanceValue, calculateAccountLeverage } from 'utils/accounts'
|
||||
|
||||
interface Props {
|
||||
account: Account
|
||||
isHls?: boolean
|
||||
}
|
||||
|
||||
export default function AccountSummary(props: Props) {
|
||||
const [accountSummaryTabs, setAccountSummaryTabs] = useLocalStorage<boolean[]>(
|
||||
LocalStorageKeys.ACCOUNT_SUMMARY_TABS,
|
||||
DEFAULT_SETTINGS.accountSummaryTabs,
|
||||
)
|
||||
const { data: prices } = usePrices()
|
||||
const assets = useAllAssets()
|
||||
const updatedAccount = useStore((s) => s.updatedAccount)
|
||||
const chainConfig = useStore((s) => s.chainConfig)
|
||||
const accountBalance = useMemo(
|
||||
() =>
|
||||
props.account
|
||||
? calculateAccountBalanceValue(updatedAccount ?? props.account, prices, assets)
|
||||
: BN_ZERO,
|
||||
[props.account, updatedAccount, prices, assets],
|
||||
)
|
||||
const data = useBorrowMarketAssetsTableData()
|
||||
const borrowAssetsData = useMemo(() => data?.allAssets || [], [data])
|
||||
const { availableAssets: lendingAvailableAssets, accountLentAssets } =
|
||||
useLendingMarketAssetsTableData()
|
||||
|
||||
const lendingAssetsData = useMemo(
|
||||
() => [...lendingAvailableAssets, ...accountLentAssets],
|
||||
[lendingAvailableAssets, accountLentAssets],
|
||||
)
|
||||
const { health, healthFactor } = useHealthComputer(props.account)
|
||||
const { health: updatedHealth, healthFactor: updatedHealthFactor } =
|
||||
useHealthComputer(updatedAccount)
|
||||
const leverage = useMemo(
|
||||
() => (props.account ? calculateAccountLeverage(props.account, prices, assets) : BN_ZERO),
|
||||
[props.account, prices, assets],
|
||||
)
|
||||
const updatedLeverage = useMemo(() => {
|
||||
if (!updatedAccount) return null
|
||||
const updatedLeverage = calculateAccountLeverage(updatedAccount, prices, assets)
|
||||
|
||||
if (updatedLeverage.eq(leverage)) return null
|
||||
return updatedLeverage
|
||||
}, [updatedAccount, prices, assets, leverage])
|
||||
|
||||
const handleToggle = useCallback(
|
||||
(index: number) => {
|
||||
setAccountSummaryTabs(accountSummaryTabs.map((tab, i) => (i === index ? !tab : tab)))
|
||||
},
|
||||
[accountSummaryTabs, setAccountSummaryTabs],
|
||||
)
|
||||
|
||||
const items = useMemo(() => {
|
||||
const itemsArray = [
|
||||
{
|
||||
title: `Credit Account ${props.account.id} Composition`,
|
||||
renderContent: () =>
|
||||
props.account ? <AccountComposition account={props.account} isHls={props.isHls} /> : null,
|
||||
isOpen: accountSummaryTabs[0],
|
||||
toggleOpen: (index: number) => handleToggle(index),
|
||||
renderSubTitle: () => <></>,
|
||||
},
|
||||
{
|
||||
title: 'Balances',
|
||||
renderContent: () =>
|
||||
props.account ? (
|
||||
<AccountBalancesTable
|
||||
account={props.account}
|
||||
borrowingData={borrowAssetsData}
|
||||
lendingData={lendingAssetsData}
|
||||
hideCard
|
||||
isHls={props.isHls}
|
||||
/>
|
||||
) : null,
|
||||
isOpen: accountSummaryTabs[1],
|
||||
toggleOpen: (index: number) => handleToggle(index),
|
||||
renderSubTitle: () => <></>,
|
||||
},
|
||||
]
|
||||
if (chainConfig.perps)
|
||||
itemsArray.push({
|
||||
title: 'Perp Positions',
|
||||
renderContent: () =>
|
||||
props.account && props.account.perps.length > 0 ? (
|
||||
<AccountPerpPositionTable account={props.account} hideCard />
|
||||
) : null,
|
||||
isOpen: accountSummaryTabs[2] ?? false,
|
||||
toggleOpen: (index: number) => handleToggle(index),
|
||||
renderSubTitle: () => <></>,
|
||||
})
|
||||
|
||||
return itemsArray
|
||||
}, [
|
||||
props.account,
|
||||
borrowAssetsData,
|
||||
lendingAssetsData,
|
||||
props.isHls,
|
||||
chainConfig.perps,
|
||||
handleToggle,
|
||||
accountSummaryTabs,
|
||||
])
|
||||
|
||||
if (!props.account) return null
|
||||
return (
|
||||
<div className='h-[546px] max-w-screen overflow-y-scroll scrollbar-hide w-93.5'>
|
||||
<Card className='mb-4 h-min min-w-fit bg-white/10' contentClassName='flex'>
|
||||
<Item label='Net worth' classes='flex-1'>
|
||||
<DisplayCurrency
|
||||
coin={BNCoin.fromDenomAndBigNumber(ORACLE_DENOM, accountBalance)}
|
||||
className='text-2xs'
|
||||
/>
|
||||
</Item>
|
||||
<Item label='Leverage' classes='flex-1 w-[93px]'>
|
||||
<FormattedNumber
|
||||
className={'w-full text-center text-2xs'}
|
||||
amount={isNaN(leverage.toNumber()) ? 0 : leverage.toNumber()}
|
||||
options={{
|
||||
maxDecimals: 2,
|
||||
minDecimals: 2,
|
||||
suffix: 'x',
|
||||
}}
|
||||
animate
|
||||
/>
|
||||
{updatedLeverage && (
|
||||
<>
|
||||
<ArrowRight width={12} />
|
||||
<FormattedNumber
|
||||
className={classNames(
|
||||
'w-full text-center text-2xs',
|
||||
updatedLeverage?.isGreaterThan(leverage) && 'text-loss',
|
||||
updatedLeverage?.isLessThan(leverage) && 'text-profit',
|
||||
)}
|
||||
amount={isNaN(updatedLeverage.toNumber()) ? 0 : updatedLeverage?.toNumber()}
|
||||
options={{ maxDecimals: 2, minDecimals: 2, suffix: 'x' }}
|
||||
animate
|
||||
/>
|
||||
</>
|
||||
)}
|
||||
</Item>
|
||||
<Item label='Account health'>
|
||||
<HealthBar
|
||||
health={health}
|
||||
healthFactor={healthFactor}
|
||||
updatedHealth={updatedHealth}
|
||||
updatedHealthFactor={updatedHealthFactor}
|
||||
className='h-1'
|
||||
/>
|
||||
</Item>
|
||||
</Card>
|
||||
<Accordion items={items} allowMultipleOpen />
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
interface ItemProps extends HTMLAttributes<HTMLDivElement> {
|
||||
label: string
|
||||
classes?: string
|
||||
}
|
||||
|
||||
function Item(props: ItemProps) {
|
||||
return (
|
||||
<div
|
||||
className={classNames(
|
||||
'flex flex-col justify-around px-3 py-1 border-r border-r-white/10',
|
||||
props.classes,
|
||||
)}
|
||||
{...props}
|
||||
>
|
||||
<Text size='2xs' className='text-white/50 whitespace-nowrap'>
|
||||
{props.label}
|
||||
</Text>
|
||||
<div className='flex h-4.5 w-full'>{props.children}</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
Some files were not shown because too many files have changed in this diff Show More
Loading…
Reference in New Issue
Block a user