Borrowing flow

[ferostabio]

close #573

• [x] hide "estimated cost" in initial state
• [x] don't show 0 values in routes (check current implementation)
• [x] tapping in routes selects the vault
• [x] keep only one expanded vault (tapping in "see routes" for other vault collapses the currently expanded one)
• [x] animate initial state + overview transition 🎉
• [x] animate unfolding
• [x] hover on both rows
• [x] folded container
• [x] fees
• [x] place box on right
• [x] rework widget (make containers)
• [x] mobile adaptations

[ferostabio]

It’s a very, very early draft, a starting point, but wanted to push as soon as possible so, with a couple of tweaks if needed, @NikolaiYurchenko can already start working

• As I mentioned above it's a draft. borow.store's debt property is now undefined by default and quickly updated all usages. UI mostly just checks for undefined and returns either null or <>.
• Most times, both UI and store, checking if we there's a debt value is more than enough.
• There are a couple of places in which it might not be enough, at all. Added lots ot TODO in places we need to think about
• The Position object is a good example. In the positions helper's viewDynamic… function, it expects a debt object. And the user won't be managing a position and have no debt, so there's no point in allowing there an optional field. Nothing big, but need to figure it out.

[github-actions[bot]]

Please test this PR on: https://v2-staging-537-dot-fuji-306908.ey.r.appspot.com

[ferostabio]

• [x] hide "estimated cost" in initial state
• [x] don't show 0 values in routes (check current implementation)
• [x] tapping in routes selects the vault
• [x] keep only one expanded vault (tapping in "see routes" for other vault collapses the currently expanded one)
• [x] animate initial state + overview transition 🎉

[NikolaiYurchenko]

• [x] animate unfolding
• [x] hover on both rows
• [x] folded container
• [x] fees
• [x] place box on right
• [x] rework widget (make containers)
• [x] mobile adaptations

[ferostabio]

• [x] Show current position in the borrowing screen, not just when managing a position
• [x] Jumping beta bar seems to be back

https://github.com/Fujicracy/fuji-v2/assets/501915/2633548a-29ef-4772-9c15-bd2d627b97fb

[ferostabio]

• [x] weth -> eth before choosing a chain doesn't work (Federico)
• [x] increase animation time
• [x] undefined.content (notification)
• [x] going back to borrow after choosing a debt, screen shows overview before disappearing, need to make sure to remove the debt before we load the data.
• [x] related to the above, going from markets screen has no effect since the borrow page clears the debt.
• [x] add overview title
• [x] remove blank space between amount and percentage in routes
• [x] route hover, left state has rounded corners but not on the right ---Nick: cant reproduce :(
• [x] details text in overview's bottom has not enough top margin
• [x] fold routes when selecting one
• [x] typing an input (and tapping max/recommended) folds routes
• [x] also happens changing chain/token
• [x] change wording from 'chain' to 'network'
• [x] change "collateral apy" to "supply apy" in markets (Federico will change it in the apy chart) mobile:
• [x] all vaults is too close to the left
• [x] icons are above the overview button
• [x] stepper lines left position
• [x] mobile cells width reduce
• [x] swap debt/supply apr colors
• [x] increase selected route brightness
• [x] add network icon not only when editing
• [x] select chain, now that it has a placeholder, returns a warning a lot of times MUI: You have provided an out-of-range value for the select component.
• [x] Move network icon to the right of slippage setting
• [ ] Getting Warning: Cannot update a component (BorrowHeader) while rendering a different component (BorrowPage). To locate the bad setState() call insideBorrowPage, follow the stack trace as described in https://reactjs.org/link/setstate-in-render
• [x] 404 (probably general error as well) have duplicated header

[brozorec]

• [x] When switching tokens or networks, the list of "All Vaults" can get updated. Add a skeleton loader so that the change is more evident.

• [x] "See all vaults" is with a smaller font size, rename "Close" to "Hide".

• [x] Add animation when folding and unfolding.

• [x] UI issue

• [x] When I directly hit "/my-positions/VAULT_ADDR-CHAIN_ID", the page doesn't load.

• [x] When I'm on manage position, I can't do a deposit-only or a withdraw-only.

• [x] I want to make a payback+withdraw and there's an approval. After the approval tx gets executed, no signature gets prompted. There's an error notification and the button doesn't stop loading.

• [x] I want to withdraw only. Approval shouldn't be needed: After I approve (although I shouldn't be asked for), the button displays "Signs & Borrow", I guess there's an issue with the mode:

[brozorec]

• [x] I still have the issue "I want to make a payback+withdraw and there's an approval. After the approval tx gets executed, no signature gets prompted." and the tx fails.
• [x] In manage position, the debt (both when borrowing and when payback) is not taken into account in the LTV gauge and when hitting the max withdraw button.
• [x] I'm on the borrow page and the current chain is different than the collateral chain. When I change the chain, the form re-init.
• [x] Change "Select a chain" to "Select a network" and "Select a chain to borrow on" to "Select a network to borrow on"

[ferostabio]

I'm on the borrow page and the current chain is different than the collateral chain. When I change the chain, the form re-init.

I either cannot reproduce or don't fully understand this one @brozorec