From e01a11f3b9b4110fb4ed952a8765f51bcb27b6d7 Mon Sep 17 00:00:00 2001 From: David Uhlmann Date: Fri, 29 Mar 2024 20:30:12 +1000 Subject: [PATCH 1/9] feat: add description of Duality UI and Dex UIs in general --- docs/neutron/modules/dex/user-interfaces.md | 50 +++++++++++++++++++++ sidebars.js | 1 + 2 files changed, 51 insertions(+) create mode 100644 docs/neutron/modules/dex/user-interfaces.md diff --git a/docs/neutron/modules/dex/user-interfaces.md b/docs/neutron/modules/dex/user-interfaces.md new file mode 100644 index 000000000..ce39ce9fe --- /dev/null +++ b/docs/neutron/modules/dex/user-interfaces.md @@ -0,0 +1,50 @@ +# User Interfaces + +You can use Neutron DEX by directly crafting [DEX messages](/neutron/modules/dex/messages) and sending them through transactions in your own scripts, but you can also use various user interfaces to interact with the Dex. We are working with several partners in the Neutron ecosystem (such as [Astroport](https://app.astroport.fi)) that use Neutron DEX and by using these applications you can benefit from the Dex's features. + +We also provide a reference UI: the Duality UI as described here, to show an integration of all of the Dex's functions. + +## Reference Duality UI + +The Duality UI is a reference UI that integrates all of the Dex's functions. We hope it can help those wishing to integrate the Dex to their own application or for those who are curious to check out the full flexibility capabilities of the Neutron DEX. + +The Duality UI has deployments at: +- testnet: https://app.testnet.duality.xyz +- beta: https://beta.duality.xyz + +and contains several key pages to show the functions of the Dex: `Swap`, `Pools`, `Orderbook`, `Portfolio`, `Bridge` explained in the sections below. + +To experience all the functions of the Dex you can in order: +1. Bridge tokens to the Neutron chain on the `Bridge` page +2. Deposit tokens into a Dex pair using the `Pools` page +3. Trade on that pool using the `Swap` or `Orderbook` page +4. View your tokens and positions on the `Portfolio` page + +### Swap Page +This is where you can trade tokens through a simple UI with a few options. The tokens tradeable here must already be on the Neutron chain (see the Bridge page to move tokens to the chain). + +The token in the first input will be swapped for the token asked for in the second input, a **Settings** section provides the option to set a custom **Max Slippage** percentage so your trade amount out cannot deviate unexpectedly when your transaction is processed. + +### Pools Page +This is where you can deposit tokens (provide liquidity) on the Dex. + +Select an existing liquidity pair to see the liquidity details of that pair including some statistics of TVL, Volume, and Dex Fees over time. + +By **adding** to an existing pair or **creating** a new pair you will see the liquidity deposit input UI. As discussed in the Dex concepts pages, each token pair on the Dex may contain thousands of pools divided into "ticks" with many available fees for each tick. Here the UI will attempt to help you add your token reserves across appropriate pools in the shape you desire. For additional flexibility you can drag and drop the percentage of each of your pools to create almost any shape of liquidity you desire. + +You can withdraw your liquidity by **editing** your existing position and withdrawing the specific pools of liquidity you have deposited in. + +### Orderbook Page +This is where you can trade tokens through an advanced interface with additional order type options. + +Here for each token pair you can see a live price chart as well as the current liquidity depth and recent trades, and your history of your own recent trades. Using these tools you can place an advanced **Buy** or **Sell** order using the Limit Order card. Here you can select the [order type](/neutron/modules/dex/messages#place-limit-order) you want to use and set its specific options such as how long the order should remain in the market (if relevant). + +### Portfolio Page +This is where you can see your assets and deposits on the Neutron chain. + +In the **Positions** section you can review the pairs that you have deposits in. In the **Assets** section you can review the available tokens you can use for trading or depositing on the Dex. + +### Bridge Page +This is where you can bring tokens from other chains onto the Neutron chain for trading and depositing on the Dex. + +You can see the amount of tokens you currently hold on the Neutron chain and access tools to bring more tokens into the Neutron chain or withdraw them out of the Neutron chain. diff --git a/sidebars.js b/sidebars.js index df4cec464..48869ff59 100644 --- a/sidebars.js +++ b/sidebars.js @@ -208,6 +208,7 @@ const sidebars = { }, 'neutron/modules/dex/messages', 'neutron/modules/dex/client', + 'neutron/modules/dex/user-interfaces', ] }, { From 0bdb214f2d039ee8aed5faacb1bcf4cc1d35bd21 Mon Sep 17 00:00:00 2001 From: David Uhlmann Date: Fri, 29 Mar 2024 20:32:43 +1000 Subject: [PATCH 2/9] feat: add TradingView mention --- docs/neutron/modules/dex/user-interfaces.md | 2 ++ 1 file changed, 2 insertions(+) diff --git a/docs/neutron/modules/dex/user-interfaces.md b/docs/neutron/modules/dex/user-interfaces.md index ce39ce9fe..dec8613ba 100644 --- a/docs/neutron/modules/dex/user-interfaces.md +++ b/docs/neutron/modules/dex/user-interfaces.md @@ -39,6 +39,8 @@ This is where you can trade tokens through an advanced interface with additional Here for each token pair you can see a live price chart as well as the current liquidity depth and recent trades, and your history of your own recent trades. Using these tools you can place an advanced **Buy** or **Sell** order using the Limit Order card. Here you can select the [order type](/neutron/modules/dex/messages#place-limit-order) you want to use and set its specific options such as how long the order should remain in the market (if relevant). +The charting technology is provided by [TradingView](https://www.tradingview.com/), a platform for traders and investors. It offers advanced charting tools so that you can plan your trade with the context of your own saved notes and measurements, and other features such as major upcoming events in the [TradingView economic calendar](https://www.tradingview.com/economic-calendar/). + ### Portfolio Page This is where you can see your assets and deposits on the Neutron chain. From 9a739b8b827b0a965acf80c04f19c9de0f2a495d Mon Sep 17 00:00:00 2001 From: David Uhlmann Date: Wed, 10 Jul 2024 12:29:47 +1000 Subject: [PATCH 3/9] feat: update reference to Neutron ecosystem page --- docs/neutron/modules/dex/user-interfaces.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/neutron/modules/dex/user-interfaces.md b/docs/neutron/modules/dex/user-interfaces.md index dec8613ba..04b881dbe 100644 --- a/docs/neutron/modules/dex/user-interfaces.md +++ b/docs/neutron/modules/dex/user-interfaces.md @@ -1,6 +1,6 @@ # User Interfaces -You can use Neutron DEX by directly crafting [DEX messages](/neutron/modules/dex/messages) and sending them through transactions in your own scripts, but you can also use various user interfaces to interact with the Dex. We are working with several partners in the Neutron ecosystem (such as [Astroport](https://app.astroport.fi)) that use Neutron DEX and by using these applications you can benefit from the Dex's features. +You can use Neutron DEX by directly crafting [DEX messages](/neutron/modules/dex/messages) and sending them through transactions in your own scripts, but you can also use various user interfaces to interact with the Dex. We are working with several partners in the Neutron [ecosystem](https://app.neutron.org/ecosystem) (such as [Astroport](https://app.astroport.fi)) that use Neutron DEX and by using these applications you can benefit from the Dex's features. We also provide a reference UI: the Duality UI as described here, to show an integration of all of the Dex's functions. From 7b668a66cd3779330de8fda4f96538b5fd0aa71a Mon Sep 17 00:00:00 2001 From: David Uhlmann Date: Wed, 10 Jul 2024 13:29:14 +1000 Subject: [PATCH 4/9] feat: update docs to app.neutron.org page descriptions --- docs/neutron/modules/dex/user-interfaces.md | 50 +++++---------------- 1 file changed, 12 insertions(+), 38 deletions(-) diff --git a/docs/neutron/modules/dex/user-interfaces.md b/docs/neutron/modules/dex/user-interfaces.md index 04b881dbe..96ea920d7 100644 --- a/docs/neutron/modules/dex/user-interfaces.md +++ b/docs/neutron/modules/dex/user-interfaces.md @@ -1,52 +1,26 @@ # User Interfaces -You can use Neutron DEX by directly crafting [DEX messages](/neutron/modules/dex/messages) and sending them through transactions in your own scripts, but you can also use various user interfaces to interact with the Dex. We are working with several partners in the Neutron [ecosystem](https://app.neutron.org/ecosystem) (such as [Astroport](https://app.astroport.fi)) that use Neutron DEX and by using these applications you can benefit from the Dex's features. +You can use Neutron DEX by directly crafting [DEX messages](/neutron/modules/dex/messages) and sending them through transactions in your own scripts, but you can also use various user interfaces to interact with the Dex. -We also provide a reference UI: the Duality UI as described here, to show an integration of all of the Dex's functions. +We are working with several partners in the Neutron [ecosystem](https://app.neutron.org/ecosystem) (such as [Astroport](https://app.astroport.fi)) that use Neutron DEX and by using these applications you can benefit from the Dex's features. We also provide a UI as described here in the Neutron app for placing orders on the DEX. -## Reference Duality UI +## Neutron app -The Duality UI is a reference UI that integrates all of the Dex's functions. We hope it can help those wishing to integrate the Dex to their own application or for those who are curious to check out the full flexibility capabilities of the Neutron DEX. +### Orderbook -The Duality UI has deployments at: -- testnet: https://app.testnet.duality.xyz -- beta: https://beta.duality.xyz - -and contains several key pages to show the functions of the Dex: `Swap`, `Pools`, `Orderbook`, `Portfolio`, `Bridge` explained in the sections below. - -To experience all the functions of the Dex you can in order: -1. Bridge tokens to the Neutron chain on the `Bridge` page -2. Deposit tokens into a Dex pair using the `Pools` page -3. Trade on that pool using the `Swap` or `Orderbook` page -4. View your tokens and positions on the `Portfolio` page - -### Swap Page -This is where you can trade tokens through a simple UI with a few options. The tokens tradeable here must already be on the Neutron chain (see the Bridge page to move tokens to the chain). - -The token in the first input will be swapped for the token asked for in the second input, a **Settings** section provides the option to set a custom **Max Slippage** percentage so your trade amount out cannot deviate unexpectedly when your transaction is processed. - -### Pools Page -This is where you can deposit tokens (provide liquidity) on the Dex. - -Select an existing liquidity pair to see the liquidity details of that pair including some statistics of TVL, Volume, and Dex Fees over time. - -By **adding** to an existing pair or **creating** a new pair you will see the liquidity deposit input UI. As discussed in the Dex concepts pages, each token pair on the Dex may contain thousands of pools divided into "ticks" with many available fees for each tick. Here the UI will attempt to help you add your token reserves across appropriate pools in the shape you desire. For additional flexibility you can drag and drop the percentage of each of your pools to create almost any shape of liquidity you desire. - -You can withdraw your liquidity by **editing** your existing position and withdrawing the specific pools of liquidity you have deposited in. - -### Orderbook Page -This is where you can trade tokens through an advanced interface with additional order type options. +The Neutron app orderbook is available at [app.neutron.org/orderbook](https://app.neutron.org/orderbook) Here for each token pair you can see a live price chart as well as the current liquidity depth and recent trades, and your history of your own recent trades. Using these tools you can place an advanced **Buy** or **Sell** order using the Limit Order card. Here you can select the [order type](/neutron/modules/dex/messages#place-limit-order) you want to use and set its specific options such as how long the order should remain in the market (if relevant). The charting technology is provided by [TradingView](https://www.tradingview.com/), a platform for traders and investors. It offers advanced charting tools so that you can plan your trade with the context of your own saved notes and measurements, and other features such as major upcoming events in the [TradingView economic calendar](https://www.tradingview.com/economic-calendar/). -### Portfolio Page -This is where you can see your assets and deposits on the Neutron chain. +#### Portfolio Balance +In the sidebar you can view your current asset balances on the Neutron chain. + +### Bridge -In the **Positions** section you can review the pairs that you have deposits in. In the **Assets** section you can review the available tokens you can use for trading or depositing on the Dex. +The Neutron app bridge is available at [app.neutron.org/bridge](https://app.neutron.org/bridge) -### Bridge Page -This is where you can bring tokens from other chains onto the Neutron chain for trading and depositing on the Dex. +This is where you can bring tokens from other chains onto the Neutron chain for trading on the Dex. -You can see the amount of tokens you currently hold on the Neutron chain and access tools to bring more tokens into the Neutron chain or withdraw them out of the Neutron chain. +You can see the amount of tokens you currently hold on the Neutron chain and bring more tokens into the Neutron chain or withdraw them out of the Neutron chain. From 49a2307d29889a75f56776c2b5dda212e2b12a4b Mon Sep 17 00:00:00 2001 From: David Uhlmann Date: Wed, 10 Jul 2024 13:56:13 +1000 Subject: [PATCH 5/9] feat: describe sections of the Orderbook page --- docs/neutron/modules/dex/user-interfaces.md | 44 ++++++++++++++++++++- 1 file changed, 42 insertions(+), 2 deletions(-) diff --git a/docs/neutron/modules/dex/user-interfaces.md b/docs/neutron/modules/dex/user-interfaces.md index 96ea920d7..6b79156a6 100644 --- a/docs/neutron/modules/dex/user-interfaces.md +++ b/docs/neutron/modules/dex/user-interfaces.md @@ -10,11 +10,51 @@ We are working with several partners in the Neutron [ecosystem](https://app.neut The Neutron app orderbook is available at [app.neutron.org/orderbook](https://app.neutron.org/orderbook) -Here for each token pair you can see a live price chart as well as the current liquidity depth and recent trades, and your history of your own recent trades. Using these tools you can place an advanced **Buy** or **Sell** order using the Limit Order card. Here you can select the [order type](/neutron/modules/dex/messages#place-limit-order) you want to use and set its specific options such as how long the order should remain in the market (if relevant). +Here for each token pair you can see a live price chart as well as the current liquidity depth and recent trades, and your history of your own recent trades. Using this information you can place an advanced **Buy** or **Sell** order using the order form. + +#### Token pair Navigation + +The token pair selector near the top of the page lets you select which pair you would like to trade on from a list of available pairs. + +#### Token pair summary + +The token pair summary near the top of the page shows a summary of the recent activity of the token pair. + +#### Token pair price chart + +The chart on the left of the page shows the recent history of the token pair prices relative to each other. The charting technology is provided by [TradingView](https://www.tradingview.com/), a platform for traders and investors. It offers advanced charting tools so that you can plan your trade with the context of your own saved notes and measurements, and other features such as major upcoming events in the [TradingView economic calendar](https://www.tradingview.com/economic-calendar/). -#### Portfolio Balance +#### Token pair order book table + +The order book table is near the center of the page under a tab "**Order Book**". + +The order book table displays the aggregate amount of current liquidity of the DEX at each price point. The bottom of the table shows a summary of the current total amount of liquidity of the pair (valued at the current price). + +The table can alternatively show only buy or sell orders using controls to the top-left of the table. The resolution of the prices of each row can be changed using a selector to the top-right of the table. + +#### Token pair recent trades table + +The recent trades table is near the center of the page under a tab "**Recent Trades**". + +The recent trades table displays recent trades on the token pair as they are made and become availble to read on the chain. You can see more information about each trade by visiting the external link for that trade. + +#### Token pair order form + +The order form is near the right of the page with tabs **Limit**/**Market** and **Buy**/**Sell**. + +Here you are able to craft a [place limit order message](/neutron/modules/dex/messages#place-limit-order) to send to the chain. The specific fields of the message such as `AmountIn` and `MaxAmountOut` are determined from the form input amounts, the setting `LimitSellPrice` comes from the specified "limit price" input or is calculated from a **Market** type "slippage" input as a slippage limit. And the optional `ExpirationTime` field may be set by selecting an "Expiry" option other than "none" in a **Limit** order. The `OrderType` field will either be GOOD_TIL_TIME for limit orders with expiry, GOOD_TIL_CANCELLED for limit orders without expiry, or FILL_OR_KILL for market orders. + +The form simulates a trade of the current order to determine the result amount and the estimated fees. When the form is edited or the liquidity of the pair has changed then the estimated result will be updated. + +#### Your token pair order history + +Your order history for the token pair is near the bottom of the page. + +Here you can see the details of your active "open" orders in the **Trades** tab and your completed "closed" orders in the **Order Histtory** tab. Active orders are orders that are not yet complete, depending on the current order state you may be able to [withdraw](/neutron/modules/dex/messages#withdraw-filled-limit-order) the swapped order amount or [cancel](/neutron/modules/dex/messages#cancel-limit-order-message) the unswapped order amount. Closed orders in the **Order History** are no longer actionable. + +#### Your portfolio Balance In the sidebar you can view your current asset balances on the Neutron chain. ### Bridge From 8d3c73c59f2d242d844f475326d4d7e74889ada4 Mon Sep 17 00:00:00 2001 From: David Uhlmann Date: Wed, 10 Jul 2024 15:31:12 +1000 Subject: [PATCH 6/9] fix: update the usage of the term "dex" as always "DEX" the acronym --- docs/neutron/modules/dex/user-interfaces.md | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/docs/neutron/modules/dex/user-interfaces.md b/docs/neutron/modules/dex/user-interfaces.md index 6b79156a6..7f58348be 100644 --- a/docs/neutron/modules/dex/user-interfaces.md +++ b/docs/neutron/modules/dex/user-interfaces.md @@ -1,8 +1,8 @@ # User Interfaces -You can use Neutron DEX by directly crafting [DEX messages](/neutron/modules/dex/messages) and sending them through transactions in your own scripts, but you can also use various user interfaces to interact with the Dex. +You can use Neutron DEX by directly crafting [DEX messages](/neutron/modules/dex/messages) and sending them through transactions in your own scripts, but you can also use various user interfaces to interact with the DEX. -We are working with several partners in the Neutron [ecosystem](https://app.neutron.org/ecosystem) (such as [Astroport](https://app.astroport.fi)) that use Neutron DEX and by using these applications you can benefit from the Dex's features. We also provide a UI as described here in the Neutron app for placing orders on the DEX. +We are working with several partners in the Neutron [ecosystem](https://app.neutron.org/ecosystem) (such as [Astroport](https://app.astroport.fi)) that use Neutron DEX and by using these applications you can benefit from the DEX's features. We also provide a UI as described here in the Neutron app for placing orders on the DEX. ## Neutron app @@ -61,6 +61,6 @@ In the sidebar you can view your current asset balances on the Neutron chain. The Neutron app bridge is available at [app.neutron.org/bridge](https://app.neutron.org/bridge) -This is where you can bring tokens from other chains onto the Neutron chain for trading on the Dex. +This is where you can bring tokens from other chains onto the Neutron chain for trading on the DEX. You can see the amount of tokens you currently hold on the Neutron chain and bring more tokens into the Neutron chain or withdraw them out of the Neutron chain. From 1a2a26c17e9f04ce334ac92260a1d7be0e61bfcb Mon Sep 17 00:00:00 2001 From: David Uhlmann Date: Wed, 10 Jul 2024 15:35:19 +1000 Subject: [PATCH 7/9] fix: make "Cancel Limit Order" heading consistent with other headings --- docs/neutron/modules/dex/messages.md | 2 +- docs/neutron/modules/dex/user-interfaces.md | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/docs/neutron/modules/dex/messages.md b/docs/neutron/modules/dex/messages.md index 4e607d8b4..f98f1b04f 100644 --- a/docs/neutron/modules/dex/messages.md +++ b/docs/neutron/modules/dex/messages.md @@ -222,7 +222,7 @@ message MsgPlaceLimitOrder { | `OrderType` orderType | Type of limit order to be used. Must be one of: GOOD\_TIL\_CANCELLED, FILL\_OR\_KILL, IMMEDIATE\_OR\_CANCEL, JUST\_IN\_TIME, or GOOD\_TIL\_TIME | | `ExpirationTime` time.Time | Expiration time for order. Only valid for GOOD\_TIL\_TIME limit orders | -## Cancel Limit Order Message +## Cancel Limit Order ### Overview diff --git a/docs/neutron/modules/dex/user-interfaces.md b/docs/neutron/modules/dex/user-interfaces.md index 7f58348be..708e815d3 100644 --- a/docs/neutron/modules/dex/user-interfaces.md +++ b/docs/neutron/modules/dex/user-interfaces.md @@ -52,7 +52,7 @@ The form simulates a trade of the current order to determine the result amount a Your order history for the token pair is near the bottom of the page. -Here you can see the details of your active "open" orders in the **Trades** tab and your completed "closed" orders in the **Order Histtory** tab. Active orders are orders that are not yet complete, depending on the current order state you may be able to [withdraw](/neutron/modules/dex/messages#withdraw-filled-limit-order) the swapped order amount or [cancel](/neutron/modules/dex/messages#cancel-limit-order-message) the unswapped order amount. Closed orders in the **Order History** are no longer actionable. +Here you can see the details of your active "open" orders in the **Trades** tab and your completed "closed" orders in the **Order Histtory** tab. Active orders are orders that are not yet complete, depending on the current order state you may be able to [withdraw](/neutron/modules/dex/messages#withdraw-filled-limit-order) the swapped order amount or [cancel](/neutron/modules/dex/messages#cancel-limit-order) the unswapped order amount. Closed orders in the **Order History** are no longer actionable. #### Your portfolio Balance In the sidebar you can view your current asset balances on the Neutron chain. From 68ed08244ad7699eb7ac093589afb7c47fdc1e89 Mon Sep 17 00:00:00 2001 From: David Uhlmann Date: Mon, 25 Nov 2024 22:02:39 +1000 Subject: [PATCH 8/9] feat: update to current UI state, no balances are listed in the sidebar at the moment --- docs/neutron/modules/dex/user-interfaces.md | 3 --- 1 file changed, 3 deletions(-) diff --git a/docs/neutron/modules/dex/user-interfaces.md b/docs/neutron/modules/dex/user-interfaces.md index 708e815d3..627c646c4 100644 --- a/docs/neutron/modules/dex/user-interfaces.md +++ b/docs/neutron/modules/dex/user-interfaces.md @@ -54,9 +54,6 @@ Your order history for the token pair is near the bottom of the page. Here you can see the details of your active "open" orders in the **Trades** tab and your completed "closed" orders in the **Order Histtory** tab. Active orders are orders that are not yet complete, depending on the current order state you may be able to [withdraw](/neutron/modules/dex/messages#withdraw-filled-limit-order) the swapped order amount or [cancel](/neutron/modules/dex/messages#cancel-limit-order) the unswapped order amount. Closed orders in the **Order History** are no longer actionable. -#### Your portfolio Balance -In the sidebar you can view your current asset balances on the Neutron chain. - ### Bridge The Neutron app bridge is available at [app.neutron.org/bridge](https://app.neutron.org/bridge) From 5f5afeb2f4141a74a5ff0b91959e1973cb0053dd Mon Sep 17 00:00:00 2001 From: David Uhlmann Date: Sat, 14 Dec 2024 00:31:08 +1000 Subject: [PATCH 9/9] feat: remove DEX usage by Astroport mention --- docs/neutron/modules/dex/user-interfaces.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/neutron/modules/dex/user-interfaces.md b/docs/neutron/modules/dex/user-interfaces.md index 627c646c4..180658d98 100644 --- a/docs/neutron/modules/dex/user-interfaces.md +++ b/docs/neutron/modules/dex/user-interfaces.md @@ -2,7 +2,7 @@ You can use Neutron DEX by directly crafting [DEX messages](/neutron/modules/dex/messages) and sending them through transactions in your own scripts, but you can also use various user interfaces to interact with the DEX. -We are working with several partners in the Neutron [ecosystem](https://app.neutron.org/ecosystem) (such as [Astroport](https://app.astroport.fi)) that use Neutron DEX and by using these applications you can benefit from the DEX's features. We also provide a UI as described here in the Neutron app for placing orders on the DEX. +We are working with several partners in the Neutron [ecosystem](https://app.neutron.org/ecosystem) that use Neutron DEX and by using these applications you can benefit from the DEX's features. We also provide a UI as described here in the Neutron app for placing orders on the DEX. ## Neutron app