From 00bec1a41fe06cc42758c038be01fb736584b0fd Mon Sep 17 00:00:00 2001 From: Georges KABBOUCHI Date: Mon, 16 Aug 2021 01:17:42 +0300 Subject: [PATCH] Token Swap Component --- assets/icons/1inch.svg | 26 ++ components/common/input/InputPercent.vue | 85 +++++ components/common/input/ToggleButton.vue | 4 +- components/common/list/List.vue | 12 +- components/common/menu/Menu.vue | 2 +- components/swap/SwapCard.vue | 398 +++++++++++++++++++++++ composables/swap/use1InchSwap.ts | 7 + pages/index.vue | 15 + pages/mainnet/1inch.vue | 51 +++ pages/polygon/1inch.vue | 51 +++ 10 files changed, 647 insertions(+), 4 deletions(-) create mode 100644 assets/icons/1inch.svg create mode 100644 components/common/input/InputPercent.vue create mode 100644 components/swap/SwapCard.vue create mode 100644 composables/swap/use1InchSwap.ts create mode 100644 pages/mainnet/1inch.vue create mode 100644 pages/polygon/1inch.vue diff --git a/assets/icons/1inch.svg b/assets/icons/1inch.svg new file mode 100644 index 0000000..ffc89e0 --- /dev/null +++ b/assets/icons/1inch.svg @@ -0,0 +1,26 @@ + + + + + + + + + + \ No newline at end of file diff --git a/components/common/input/InputPercent.vue b/components/common/input/InputPercent.vue new file mode 100644 index 0000000..278a03b --- /dev/null +++ b/components/common/input/InputPercent.vue @@ -0,0 +1,85 @@ + + + diff --git a/components/common/input/ToggleButton.vue b/components/common/input/ToggleButton.vue index f4bfff3..687a731 100644 --- a/components/common/input/ToggleButton.vue +++ b/components/common/input/ToggleButton.vue @@ -11,9 +11,9 @@ @click="toggle" >
diff --git a/components/common/list/List.vue b/components/common/list/List.vue index d0aada6..5c74ad2 100644 --- a/components/common/list/List.vue +++ b/components/common/list/List.vue @@ -5,7 +5,13 @@
-
+
@@ -27,6 +33,10 @@ export default defineComponent({ type: Array, default: () => [], }, + itemsWrapperClasses: { + type: String, + default: '' + }, divided: { type: Boolean, default: false, diff --git a/components/common/menu/Menu.vue b/components/common/menu/Menu.vue index 1b74af4..67a64f1 100644 --- a/components/common/menu/Menu.vue +++ b/components/common/menu/Menu.vue @@ -14,7 +14,7 @@
diff --git a/components/swap/SwapCard.vue b/components/swap/SwapCard.vue new file mode 100644 index 0000000..3aae842 --- /dev/null +++ b/components/swap/SwapCard.vue @@ -0,0 +1,398 @@ + + + diff --git a/composables/swap/use1InchSwap.ts b/composables/swap/use1InchSwap.ts new file mode 100644 index 0000000..6fc8d21 --- /dev/null +++ b/composables/swap/use1InchSwap.ts @@ -0,0 +1,7 @@ +export const use1InchSwap = () => { + const swap = ({ buyAddress, sellAddress, sellAmount, unitAmount }) => {}; + + return { + swap + }; +}; diff --git a/pages/index.vue b/pages/index.vue index 1069ee5..e6d1db1 100644 --- a/pages/index.vue +++ b/pages/index.vue @@ -35,6 +35,7 @@ import { useNetwork } from "~/composables/useNetwork"; import AaveIcon from "~/assets/icons/aave.svg?inline"; import CompoundIcon from "~/assets/icons/compound.svg?inline"; import MakerIcon from "~/assets/icons/makerdao.svg?inline"; +import OneInchIcon from "~/assets/icons/1inch.svg?inline"; const appsPerNetwork = { mainnet: [ @@ -58,6 +59,13 @@ const appsPerNetwork = { name: "MakerDAO", url: "/mainnet/maker", description: "Collateralized Debt" + }, + { + id: "1inch", + icon: OneInchIcon, + name: "1inch", + url: "/mainnet/1inch", + description: "DEX aggregator with the best prices on the market" } ], polygon: [ @@ -67,6 +75,13 @@ const appsPerNetwork = { name: "Aave v2", url: "/polygon/aave-v2", description: "Lend and borrow straight from your Gnosis Safe" + }, + { + id: "1inch", + icon: OneInchIcon, + name: "1inch", + url: "/polygon/1inch", + description: "DEX aggregator with the best prices on the market" } ] }; diff --git a/pages/mainnet/1inch.vue b/pages/mainnet/1inch.vue new file mode 100644 index 0000000..9286e96 --- /dev/null +++ b/pages/mainnet/1inch.vue @@ -0,0 +1,51 @@ + + + diff --git a/pages/polygon/1inch.vue b/pages/polygon/1inch.vue new file mode 100644 index 0000000..eaf9689 --- /dev/null +++ b/pages/polygon/1inch.vue @@ -0,0 +1,51 @@ + + +