Swivel Finance | Walkthrough of Swivel, The Swivel Exchange, and Swivel.js

hey guys thanks for checking out our workshop and thanks to everybody at global as always for doing all they do hurting cats and just in general taking care of the ecosystem as a quick introduction i'm julian the founder of swivel i've been doing these hackathons for a couple years but this is the first time i'm doing a sponsorship so honestly just in general pump to support such great organization and see everything you guys can come up with as far as swivel itself we're the protocol for fixed yield lending and tokenized cash flows and in more simple terms that essentially means that we enable fixed yields and rate trading the the plan for today is just do a brief overview of the protocol and then take a look both at the exchange and do a quick code walkthrough of swillowjs so swivel was actually the first to implement this sort of design but at this point civil is now one of a few protocols that allow our user to deposit an underlying token like usdc and receive two component tokens in return the first being a yield bearing token that actually represents the the claim to any interest generated we call these n tokens and the second actually represents the the claim to the deposit bond maturity one to one and we call these zc tokens because they accurately are something sort of like a zero coupon and this sort of design is actually pretty flexible because users can either sell their nusdc immediately to get a fixed yield or alternatively another user could potentially buy uh that zc usdc off of off of them and that user would be getting a fixed yield because this cc usd would appreciate towards par upon maturity the most common interaction then is kind of one that i just described um what effectively happens here is is alice uh the one in pink has a thousand dollars in principle and wants to lend it at a fixed rate um bob comes around and and he essentially is willing to make the bet that the rates will likely be higher than alice expects they will and he's willing to pay fifty dollars to get access to any interest generated by the thousand dollars that alice has at this couldn't print in time um and this effectively locks both of their money up until 12 months from now so bob pays this immediate premium this is effectively what would be five percent to alice she yields that immediately and the the money the thousand dollars in principle is deposited then into an interspring protocol bob gets the n tokens the notional tokens and gets any interest generated by a thousand dollars in usdc whereas alice gets the redemption tokens effectively she gets access to a thousand dollars redeemable at maturity um a thousand c ustt and this interaction can kind of be reversed or done a few different ways and i i suppose i'll kind of go over that a little bit more um when we take a look at the exchange and of course we've got docs for everything but with that basic sort of overview covered we can just take a look at the exchange just quickly walking through the exchange you'll notice that for the most part it's almost like any traditional exchange you can check your market in this case instead of having an asset and another asset you have an asset and its maturity and then from there you can either choose to choose to trade in die or one of the underlying tokens that are split out from die additionally we've actually made it a little bit easier for folks to foster tokens so if you need to get some test net tokens you can just faust them out from here but to just go through the interactions i think a lot of them are pretty straightforward um to get a fixed deal and just do a market order you keep it on market and you can enter the amount you want to lend and get a fixed yield in this case this is a 105 apy because this is monopoly money and people are willing to pay a crazy amount um but realistically you'd never get that much locking in this rate though i guess we can just do a quick test transaction um it should give me about a hundred back actually it will give me exactly um a hundred die back immediately as my premium and then i'll as well have a hundred zc die from the transaction minus a small fee as well so we can wait for that to confirm and there we go it's confirmed check the transaction that might take a second to show up as well and there it is so like i said you got both 100 cc die and 100 die in return which obviously isn't going to be typical but is the case right now on testnet um if you actually want to then go and sell that zc die you can easily do so and effectively sell it back to the order book similarly you would place a limit order there's not enough orders for you to sell against right now immediately so it is what it is um but at this point um you know you could alternatively take a position in indie so there's the order book or alternatively um instead of just immediately taking positions uh put a limit order and just place an order on the order book itself so we can actually see this order let's put it in at 0.998 or 1 let's do 50. confirm this is now signing that order and boom there it is so all of that is actually i think pretty straightforward a lot of it operates like a normal exchange except for the fact that you're lending money and it's all routed through compound if you actually want to then track your positions you can go to the positions page and this gives you access to some of the some of the functions that were mentioned in the original introduction instead of actually just doing everything through the order book you can combine and redeem and do everything just directly so one could potentially just split their position let's say they had a given amount of dye split it into zcdi and in die let's split 10 really quick um and from there you could just sell one of these on an amm or do whatever you'd want with them you don't necessarily need to enter a position or get these tokens by using the order book so that might take a second we don't actually need to look at that for now and then at the end once this market has matured so this one matures in 10 days this button these buttons will be replaced by redeem button right here so a user can redeem their zc token balance and this is the floating interest that you get based on the amount of tokens you have so that's a good overview of the exchange if you at all need to take a look at the docs um the docs are relatively comprehensive though i'll tell you we are working on them actively and some parts are differently older or deprecated in general so just bear with us or ask us questions um and yeah that kind of wraps up the exchange so you know i'll i'll get on into swivel js so we recently open sourced swivel js and it is what most developers will be using to interact with the swivel architecture from their application unless they particularly want to pull down our abis and interact with them directly so the first prerequisite is ethers um you know we we do not currently have it set up to work with web3.js currently um so you know again prerequisite is ethers and from there you can just install swivel.js directly from npm as far as usage you there there's a number of contracts within our architecture um but the main one you're ever going to be interacting with is swivel this is what you use to sign new orders create them or alternatively actually interact with the contracts initiate new positions exit positions or split or combine a token so this is really what most people will be needing to use the first step is going to be importing ethers and then as well the ethers fender and swivel from swivel js so i'm going to be showing an example from a pretty basic df that i've used a few times in the past um first up here again is is importing swivel yes this is a basic react-d app and you know i've done this function already but we're going to be replicating it again so let's do async create market order fixed and the param the only param we really need is the amount that we want to be filling so again the first thing we need to do is initialize a provider let's just pull this straight in and from there we have a signer as well as the provider right i pulled that as well that you can actually push into the vendor for ethers within swivel and this is what we're using to essentially do all of the actual signing etc etc and it kind of wraps everything together right so we'll do that as well it's pretty straightforward um and depending this may change in the future right our deployment currently is on um is on renkobe so all this is actually accurate if you'd like to pull this directly into your code so i'll do that and from there again the last step really is to initialize swivel um from here you can essentially call the the endpoints for any of the functions within it um there's not great documentation right now for this but hopefully by the time any of you see this we'll have it all up within our docs um so let's do that as well okay so from here we we have swivel already made and we could directly interact with one of the contracts already right but one thing most users will be needing to do is uh is do their allowances so what one could do is check allowances and if they have enough not take care of it right for now we're just going to do what we've actually done in the other example and we're going to just actually have the user set their allowances so we're going to const approve and we've already actually initialized the die contract um when we initialized the component so from here we actually have that die available if you need to do that you can do that separately it would essentially just be any erc with the address right so die dot approve is the function on the die contract and you're going to be approving the swivel address right we have this up here um and the swivel address is actually swivel contract is what handles all fun custody throughout all of our architecture so you're approving the swivel address to access how much i mean you could do the maximum amount um i mean in this case if you are actually having the user do this every time you could just do the amount right so have the approval done but specifically in this case you don't want to kind of do anything else after this point so you're going to approve you're going to wait essentially for that receipt from the previous approval okay so from there you essentially you have the ability to call back this receipt wait for it um if approved receipt status equal equal zero do the rest so if it fails throw new error could not approve if it doesn't fail however you can move on with the rest of the transaction from here i mean you could do one of two things you could fetch the swivel api um i feel like that's kind of out of the scope of this instruction so i'm gonna actually just hard code the order in and to do that um i'm just gonna look below and use the exact same order i already have hard-coded um if if you aren't on renkobe and you need to do things on another network feel free to to contact us and we can do a deployment and make sure you have access to an order um but for now you can feel free to use this exact same order and if it's past this expiry that you need to to be accessing it just feel free again to contact us or alternatively just just use uh the api it's it's not that complicated as well um so main part main point though is you're establishing the order that you're planning to fill in this case this is someone that is willing to pay this is someone that is initializing the vault um and and uh they are not exiting the position so this is someone that is doing something with the vault and is not exiting so this is effectively someone that is initializing a uh a a floating position um and in layman's terms if you're not super super familiar with the project already um that means that this party is willing to pay premium and purchase n tokens and to do it they have this much principle they have this much premium to spend i think this is a five percent rate something like that um but the bottom line yeah is that this is the order that that the user is actually planning to fill with this amount right so once you have the order it's it's really almost as straightforward as directly interacting with the smart contract the other thing that's actually returned from the api is going to be the signature depending actually on exactly the currency you're using this is going to change so this step here this is 1e18 so if you were alternatively using usdc this is this is dye um you'd actually only use one e6 but const amount uh normalized amount equal amount times 1 e 10 e 18.

and to make sure that everything can digest this we're going to turn that into a string as well um from there i i believe this is all just kind of thrown into the swivel contract i'm going to verify that and yeah it's it's pretty much that straightforward so the transaction that we're actually trying to create verity costs dx equal um a weight swivel dot initiate and you're going to be putting in the a an array so i guess this is kind of an interesting wrinkle because you might be filling multiple orders at once this could be multiple different amounts in this case this is a massive order so the intention is you're only going to be filling one but in the future you might have multiple orders with multiple signatures and multiple amounts in that case though each of the parameters is actually an array so the first thing you input is the order and then you are putting in the amount that you want to fill for each order so in this case it's actually that normalized amount and the final parameter is going to be that signature above um the the swivel contractor the rather the the the swivel gs um wrapper here actually takes the signature and splits it up into um i forgot the brackets splits it up into its components to actually send it to the contract and everything is actually kind of taken care of from here um so if we want to we can do like we did below and actually wait the transaction to do something else but really that's not necessary i'll just kind of throw these in anyway and yeah this is uh this is a pretty basic exam basic example of how one would order a get get a fixed rate right in this example this already has an order for you um i suppose in the future it might be good to do an additional wrinkle where you fetch and and request an order to fill if you were trying to get a fixed rate um yeah i think that concludes the the walkthrough so it's just a final little review what we've essentially made is a nice little application that allows you to input an amount and effectively order for a fixed yield um yep the order was at five percent we're doing a quick transaction on metamask um and we can also check i forget all what we added to the console log but yeah we're doing a fixed order the confirmation for the approval came in so now we can confirm the order itself and there you go that should be it thanks for coming to our workshop and if you guys have any questions feel free to reach out