diff --git a/assets/icons/colored/compound.svg b/assets/icons/colored/compound.svg
new file mode 100644
index 0000000..bcde02d
--- /dev/null
+++ b/assets/icons/colored/compound.svg
@@ -0,0 +1,5 @@
+
\ No newline at end of file
diff --git a/assets/icons/colored/maker.svg b/assets/icons/colored/maker.svg
new file mode 100644
index 0000000..6036a98
--- /dev/null
+++ b/assets/icons/colored/maker.svg
@@ -0,0 +1,8 @@
+
\ No newline at end of file
diff --git a/components/sidebar/context/aaveV2/SidebarAaveV2Borrow.vue b/components/sidebar/context/aaveV2/SidebarAaveV2Borrow.vue
index ff16129..ddc7a51 100644
--- a/components/sidebar/context/aaveV2/SidebarAaveV2Borrow.vue
+++ b/components/sidebar/context/aaveV2/SidebarAaveV2Borrow.vue
@@ -19,12 +19,12 @@
- Amount to supply
+ Amount to borrow
diff --git a/components/sidebar/context/aaveV2/SidebarAaveV2Withdraw.vue b/components/sidebar/context/aaveV2/SidebarAaveV2Withdraw.vue
index 06969a8..b653995 100644
--- a/components/sidebar/context/aaveV2/SidebarAaveV2Withdraw.vue
+++ b/components/sidebar/context/aaveV2/SidebarAaveV2Withdraw.vue
@@ -11,12 +11,12 @@
- Amount to supply
+ Amount to withdraw
diff --git a/components/sidebar/context/compound/SidebarCompoundBorrow.vue b/components/sidebar/context/compound/SidebarCompoundBorrow.vue
new file mode 100644
index 0000000..f7edfbf
--- /dev/null
+++ b/components/sidebar/context/compound/SidebarCompoundBorrow.vue
@@ -0,0 +1,210 @@
+
+
+ Borrow {{ symbol }}
+
+
+
+ {{ formatNumber(balance) }} {{ symbol }}
+
+
+
+
+ Amount to borrow
+
+
+
+
+
+
+
+
+
+
+
+ Projected Debt Position
+
+
+
+
+
+
+ {{ formatUsdMax(liquidationPrice, liquidationMaxPrice) }}
+ / {{ formatUsd(liquidationMaxPrice) }}
+
+
+
+
+
+ Borrow
+
+
+
+
+
+
+
+
+
diff --git a/components/sidebar/context/compound/SidebarCompoundPayback.vue b/components/sidebar/context/compound/SidebarCompoundPayback.vue
new file mode 100644
index 0000000..8c1780f
--- /dev/null
+++ b/components/sidebar/context/compound/SidebarCompoundPayback.vue
@@ -0,0 +1,225 @@
+
+
+ Payback {{ symbol }}
+
+
+
+
+ {{ formatNumber(balance) }} {{ symbol }}
+
+
+
+
+
+ {{ formatNumber(tokenMaxBalance) }} {{ symbol }}
+
+
+
+
+
+ Amount to supply
+
+
+
+
+
+
+
+
+
+
+
+ Projected Debt Position
+
+
+
+
+
+
+ {{ formatUsdMax(liquidationPrice, liquidationMaxPrice) }}
+ / {{ formatUsd(liquidationMaxPrice) }}
+
+
+
+
+
+ Payback
+
+
+
+
+
+
+
+
+
diff --git a/components/sidebar/context/compound/SidebarCompoundSupply.vue b/components/sidebar/context/compound/SidebarCompoundSupply.vue
new file mode 100644
index 0000000..13a9e73
--- /dev/null
+++ b/components/sidebar/context/compound/SidebarCompoundSupply.vue
@@ -0,0 +1,203 @@
+
+
+ Supply {{ symbol }}
+
+
+
+ {{ formatNumber(balance) }} {{ symbol }}
+
+
+
+
+ Amount to supply
+
+
+
+
+
+
+
+
+
+
+
+ Projected Debt Position
+
+
+
+
+
+
+ {{ formatUsdMax(liquidationPrice, liquidationMaxPrice) }}
+ / {{ formatUsd(liquidationMaxPrice) }}
+
+
+
+
+
+ Supply
+
+
+
+
+
+
+
+
+
diff --git a/components/sidebar/context/compound/SidebarCompoundWithdraw.vue b/components/sidebar/context/compound/SidebarCompoundWithdraw.vue
new file mode 100644
index 0000000..239ea3b
--- /dev/null
+++ b/components/sidebar/context/compound/SidebarCompoundWithdraw.vue
@@ -0,0 +1,212 @@
+
+
+ Withdraw {{ symbol }}
+
+
+
+ {{ formatNumber(originalBalance) }} {{ symbol }}
+
+
+
+
+ Amount to withdraw
+
+
+
+
+
+
+
+
+
+
+
+ Projected Debt Position
+
+
+
+
+
+
+ {{ formatUsdMax(liquidationPrice, liquidationMaxPrice) }}
+ / {{ formatUsd(liquidationMaxPrice) }}
+
+
+
+
+
+ Withdraw
+
+
+
+
+
+
+
+
+
diff --git a/composables/useCompoundPosition.ts b/composables/useCompoundPosition.ts
index 2a11d20..1fb3366 100644
--- a/composables/useCompoundPosition.ts
+++ b/composables/useCompoundPosition.ts
@@ -56,19 +56,14 @@ const totalBorrow = computed(() =>
const ethPriceInUsd = computed(() => position.value?.ethPriceInUsd);
-const annualPercentageRateTypes = computed(() => [
- { label: "Variable", value: "variable", rateMode: 2 },
- { label: "Stable", value: "stable", rateMode: 1 }
-]);
-
export function useCompoundPosition(
{ overridePosition } = { overridePosition: null }
) {
overridePosition = overridePosition || (pos => pos);
- const { web3, chainId, networkName } = useWeb3();
+ const { web3, networkName } = useWeb3();
const { activeAccount } = useDSA();
- const { getTokenByKey, allATokensV2 } = useToken();
+ const { getTokenByKey } = useToken();
const resolver = computed(() => addresses.mainnet.resolver.compound);
@@ -126,11 +121,14 @@ export function useCompoundPosition(
const stats = computed(() =>
displayPositions.value.reduce(
- (stats, { key, supply, borrow, priceInEth, factor, liquidation }) => {
+ (stats, { key, supply, borrow, priceInEth, factor }) => {
if (key === "eth") {
stats.ethSupplied = supply;
}
+ console.log(key, supply, borrow, priceInEth, factor);
+
+
stats.totalSupplyInEth = plus(
stats.totalSupplyInEth,
times(supply, priceInEth)
@@ -143,10 +141,6 @@ export function useCompoundPosition(
stats.totalMaxBorrowLimitInEth,
times(supply, times(priceInEth, factor))
).toFixed();
- stats.totalMaxLiquidationLimitInEth = plus(
- stats.totalMaxLiquidationLimitInEth,
- times(supply, times(priceInEth, liquidation))
- ).toFixed();
return stats;
},
@@ -154,7 +148,6 @@ export function useCompoundPosition(
totalSupplyInEth: "0",
totalBorrowInEth: "0",
totalMaxBorrowLimitInEth: "0",
- totalMaxLiquidationLimitInEth: "0",
ethSupplied: "0"
}
)
@@ -178,12 +171,15 @@ export function useCompoundPosition(
return [];
}
- const ctokenPosition = position.value.data.find(
- x => x.cTokenId === ctoken.id
+ const ctokenPosition = overridePosition(
+ position.value.data.find(x => x.cTokenId === ctoken.id)
);
- const p = getPositionOrDefaultPosition(token, ctokenPosition);
+ if (!ctokenPosition) {
+ return [];
+ }
+ const p = getPositionOrDefaultPosition(token, ctokenPosition);
if (gt(p.supply, "0") && gt(p.borrow, "0")) {
return [
{ ...p, type: "supply" },
@@ -202,15 +198,14 @@ export function useCompoundPosition(
return false;
}
return true;
- })
- .map(overridePosition);
+ });
});
- function getPositionOrDefaultPosition(token, p) {
- if (!p) {
+ function getPositionOrDefaultPosition(token, pos) {
+ if (!pos) {
const defaultPosition = {
key: token?.key,
- tokenId: `${token?.symbol}-A`,
+ tokenId: `${token.symbol}-A`,
ctknBalance: "0",
cTokenDecimals: "0",
cf: "0",
@@ -234,44 +229,34 @@ export function useCompoundPosition(
return {
key: token?.key,
- tokenId: p.cTokenId,
- ctknBalance: p.ctknBalance,
- cTokenDecimals: p.cTokenDecimals,
- cf: p.factor,
- supply: p.supply,
- supplyUsd: times(p.supply, p.priceInUsd).toFixed(),
- supplyRate: p.supplyRate,
- supplyYield: p.supplyYield,
- borrow: p.borrow,
- borrowUsd: times(p.borrow, p.priceInUsd).toFixed(),
- borrowRate: p.borrowRate,
- borrowYield: p.borrowYield,
- borrowEnabled: p.borrowEnabled,
- type: getType(p),
+ tokenId: pos.cTokenId,
+ ctknBalance: pos.ctknBalance,
+ cTokenDecimals: pos.cTokenDecimals,
+ cf: pos.factor,
+ supply: pos.supply,
+ supplyUsd: times(pos.supply, pos.priceInUsd).toFixed(),
+ supplyRate: pos.supplyRate,
+ supplyYield: pos.supplyYield,
+ borrow: pos.borrow,
+ borrowUsd: times(pos.borrow, pos.priceInUsd).toFixed(),
+ borrowRate: pos.borrowRate,
+ borrowYield: pos.borrowYield,
+ borrowEnabled: pos.borrowEnabled,
+ type: getType(pos),
supplyRewardRate: times(
- p.compSupplyApy,
+ pos.compSupplyApy,
rewardTokenPriceInUsd.value
).toFixed(),
borrowRewardRate: times(
- p.compBorrowApy,
+ pos.compBorrowApy,
rewardTokenPriceInUsd.value
).toFixed(),
- priceInUsd: p.priceInUsd
+ priceInUsd: pos.priceInUsd,
+ priceInEth: pos.priceInEth,
+ factor: pos.factor,
};
}
- const maxLiquidation = computed(() => {
- if (isZero(stats.value.totalSupplyInEth)) return "0";
-
- return max(
- div(
- stats.value.totalMaxLiquidationLimitInEth,
- stats.value.totalSupplyInEth
- ),
- "0"
- ).toFixed();
- });
-
const liquidationPrice = computed(() => {
if (isZero(stats.value.ethSupplied)) return "0";
@@ -279,7 +264,7 @@ export function useCompoundPosition(
times(
div(
stats.value.totalBorrowInEth,
- stats.value.totalMaxLiquidationLimitInEth
+ stats.value.totalMaxBorrowLimitInEth
),
ethPriceInUsd.value
),
@@ -320,10 +305,8 @@ export function useCompoundPosition(
totalBorrow,
status,
liquidation,
- maxLiquidation,
liquidationPrice,
- liquidationMaxPrice: ethPriceInUsd,
- annualPercentageRateTypes
+ liquidationMaxPrice: ethPriceInUsd
};
}
diff --git a/composables/useModal.ts b/composables/useModal.ts
index aa3b73b..8313eec 100644
--- a/composables/useModal.ts
+++ b/composables/useModal.ts
@@ -1,6 +1,5 @@
import { computed, ref } from "@nuxtjs/composition-api";
-//@ts-ignore
-import NetworksMismatchDialog from "~/components/modal/NetworksMismatchDialog";
+import NetworksMismatchDialog from "~/components/modal/NetworksMismatchDialog.vue";
const modal = ref(null);
const props = ref({});
diff --git a/composables/useNetwork.ts b/composables/useNetwork.ts
index ee82272..8640af7 100644
--- a/composables/useNetwork.ts
+++ b/composables/useNetwork.ts
@@ -1,9 +1,7 @@
import { computed, onMounted, ref, watch } from "@nuxtjs/composition-api";
import { useLocalStorage } from "vue-composable";
-//@ts-ignore
import MainnetSVG from "~/assets/icons/mainnet.svg?inline";
-//@ts-ignore
import PolygonSVG from "~/assets/icons/polygon.svg?inline";
import { useModal } from "./useModal";
import { useNotification } from "./useNotification";
diff --git a/composables/useProtocolData.ts b/composables/useProtocolData.ts
index 0a9d32b..38b7e98 100644
--- a/composables/useProtocolData.ts
+++ b/composables/useProtocolData.ts
@@ -1,4 +1,3 @@
-// @ts-nocheck
import SVGCompound from "@/assets/logo/compound.svg?inline";
import SVGMakerDAO from "@/assets/logo/makerdao.svg?inline";
import SVGAave from "@/assets/logo/aave.svg?inline";
diff --git a/composables/useSidebar.ts b/composables/useSidebar.ts
index ea5eefb..55fa797 100644
--- a/composables/useSidebar.ts
+++ b/composables/useSidebar.ts
@@ -9,21 +9,21 @@ import {
import { useDSA } from "./useDSA";
import { useWeb3 } from "./useWeb3";
-//@ts-ignore
import SidebarAaveV2Supply from "~/components/sidebar/context/aaveV2/SidebarAaveV2Supply.vue";
-//@ts-ignore
import SidebarAaveV2Withdraw from '~/components/sidebar/context/aaveV2/SidebarAaveV2Withdraw.vue'
-//@ts-ignore
import SidebarAaveV2Borrow from '~/components/sidebar/context/aaveV2/SidebarAaveV2Borrow.vue'
-//@ts-ignore
import SidebarAaveV2Payback from '~/components/sidebar/context/aaveV2/SidebarAaveV2Payback.vue'
-//@ts-ignore
+
import SidebarOverview from '~/components/sidebar/context/overview/SidebarOverview.vue'
-//@ts-ignore
import SidebarDepositOverview from '~/components/sidebar/context/SidebarDepositOverview.vue'
-//@ts-ignore
import SidebarWithdraw from '~/components/sidebar/context/SidebarWithdraw.vue'
+import SidebarCompoundWithdraw from '~/components/sidebar/context/compound/SidebarCompoundWithdraw.vue'
+import SidebarCompoundSupply from '~/components/sidebar/context/compound/SidebarCompoundSupply.vue'
+import SidebarCompoundBorrow from '~/components/sidebar/context/compound/SidebarCompoundBorrow.vue'
+import SidebarCompoundPayback from '~/components/sidebar/context/compound/SidebarCompoundBorrow.vue'
+
+
const sidebars = {
"#overview" : {component: SidebarOverview, back : false, close : true },
"#deposit-overview": {component: SidebarDepositOverview, back: { hash: 'overview' } },
@@ -33,10 +33,6 @@ const sidebars = {
"/polygon/aave-v2#borrow": { component: SidebarAaveV2Borrow },
"/polygon/aave-v2#payback": { component: SidebarAaveV2Payback },
"/polygon/aave-v2#withdraw": { component: SidebarAaveV2Withdraw },
- "/polygon/aave-v2#withdraw-token": {
- component: null,
- back: { hash: "withdraw-overview" }
- },
"/mainnet/aave-v2": { component: null },
@@ -44,10 +40,13 @@ const sidebars = {
"/mainnet/aave-v2#borrow": { component: SidebarAaveV2Borrow },
"/mainnet/aave-v2#payback": { component: SidebarAaveV2Payback },
"/mainnet/aave-v2#withdraw": { component: SidebarAaveV2Withdraw },
- "/mainnet/aave-v2#withdraw-token": {
- component: null,
- back: { hash: "withdraw-overview" }
- }
+
+
+ "/mainnet/compound": { component: null },
+ "/mainnet/compound#withdraw": { component: SidebarCompoundWithdraw },
+ "/mainnet/compound#supply": { component: SidebarCompoundSupply },
+ "/mainnet/compound#borrow": { component: SidebarCompoundBorrow },
+ "/mainnet/compound#payback": { component: SidebarCompoundPayback },
};
const sidebar = ref(null);
diff --git a/pages/index.vue b/pages/index.vue
index df21656..d2b2136 100644
--- a/pages/index.vue
+++ b/pages/index.vue
@@ -33,8 +33,9 @@