Skip to content

Commit

Permalink
adjusting bond subnav items (OlympusDAO#1658)
Browse files Browse the repository at this point in the history 
* adjusting bond subnav items

* fix sortedInverseBonds, remove Highest Discount text

* update snapshots from OlympusDAO#1656

Co-authored-by: appleseed-iii <[email protected]>
  • Loading branch information
@brightiron @appleseed-iii
brightiron and appleseed-iii authored Apr 11, 2022
1 parent 4fcf148 commit 28aef2c
Show file tree
Hide file tree
Showing 7 changed files with 101 additions and 41 deletions.
18 changes: 12 additions & 6 deletions src/__tests__/__snapshots__/App.unit.test.jsx.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3332,8 +3332,10 @@ exports[`<App/> should not render a connection error message when user wallet is
class="MuiTypography-root MuiTypography-body1"
style="line-height: 1.4;"
>
0
%
<span
class="MuiSkeleton-root MuiSkeleton-text MuiSkeleton-pulse"
style="width: 80px;"
/>
</p>
</td>
<td
Expand Down Expand Up @@ -6721,8 +6723,10 @@ exports[`<App/> should not render an error message when user wallet is connected
class="MuiTypography-root MuiTypography-body1"
style="line-height: 1.4;"
>
0
%
<span
class="MuiSkeleton-root MuiSkeleton-text MuiSkeleton-pulse"
style="width: 80px;"
/>
</p>
</td>
<td
Expand Down Expand Up @@ -10110,8 +10114,10 @@ exports[`<App/> should render an error message when user wallet is connected and
class="MuiTypography-root MuiTypography-body1"
style="line-height: 1.4;"
>
0
%
<span
class="MuiSkeleton-root MuiSkeleton-text MuiSkeleton-pulse"
style="width: 80px;"
/>
</p>
</td>
<td
Expand Down
6 changes: 4 additions & 2 deletions src/__tests__/__snapshots__/Root.unit.test.tsx.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3396,8 +3396,10 @@ exports[`<Root/> should render component 1`] = `
class="MuiTypography-root-275 MuiTypography-body1-277"
style="line-height: 1.4;"
>
0
%
<span
class="MuiSkeleton-root-591 MuiSkeleton-text-592 MuiSkeleton-pulse-595"
style="width: 80px;"
/>
</p>
</td>
<td
Expand Down
79 changes: 59 additions & 20 deletions src/components/Sidebar/NavContent.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -84,26 +84,65 @@ const NavContent: React.FC<NavContentProps> = ({ handleDrawerToggle }) => {
<>
<NavItem to="/dashboard" icon="dashboard" label={t`Dashboard`} />
<NavItem to="/bonds" icon="bond" label={t`Bond`}>
{sortedBonds.map((bond, i) => (
<NavItem
to={`/bonds/${bond.index}`}
key={i}
onClick={handleDrawerToggle}
label={bond.displayName}
chip={`${bond.discount && trim(bond.discount * 100, 2)}%`}
chipColor={bond.discount && bond.discount < 0 ? "error" : "success"}
/>
))}
{sortedInverseBonds.map((bond, i) => (
<NavItem
to={`/bonds/inverse/${bond.index}`}
key={i}
onClick={handleDrawerToggle}
label={bond.displayName}
chip={`${bond.discount && trim(bond.discount * 100, 2)}%`}
chipColor={bond.discount && bond.discount < 0 ? "error" : "success"}
/>
))}
{sortedBonds.length > 0 || sortedInverseBonds.length > 0 ? (
<Box mr="12px" mb="5px">
<div className="bond-discounts">
{sortedBonds.length > 0 && (
<>
{sortedBonds.map((bond, i) => {
return (
<Link
component={NavLink}
to={`/bonds/${bond.index}`}
key={i}
className={"bond"}
onClick={handleDrawerToggle}
>
<Typography variant="body1">
<Box display="flex" flexDirection="row" justifyContent="space-between">
<span>{bond.displayName}</span>
<span className="bond-pair-roi">
<DisplayBondDiscount key={bond.index} bond={bond} />
</span>
</Box>
</Typography>
</Link>
);
})}
</>
)}
{sortedInverseBonds.length > 0 && (
<Box mt="15px">
<Typography variant="body2">
<Trans>Inverse Bonds</Trans>
</Typography>
{sortedInverseBonds.map((bond, i) => {
return (
<Link
component={NavLink}
to={`/bonds/inverse/${bond.index}`}
key={i}
className={"bond"}
onClick={handleDrawerToggle}
>
<Typography variant="body1">
<Box display="flex" flexDirection="row" justifyContent="space-between">
{bond.displayName}
<span className="bond-pair-roi">
<DisplayBondDiscount key={bond.index} bond={bond} />
</span>
</Box>
</Typography>
</Link>
);
})}
</Box>
)}
</div>
</Box>
) : (
<></>
)}
</NavItem>
<NavItem to="/stake" icon="stake" label={t`Stake`} />

Expand Down
2 changes: 1 addition & 1 deletion src/components/Sidebar/Sidebar.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -81,7 +81,7 @@
.bond-discounts {
text-align: left;
color: #999999;
padding-left: 33px;
padding-left: 26px;
margin-top: 8px;
a {
margin-top: 0.7rem;
Expand Down
1 change: 1 addition & 0 deletions src/locales/translations
Submodule translations added at af8f11
12 changes: 8 additions & 4 deletions src/views/Stake/__tests__/__snapshots__/Stake.unit.test.tsx.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2540,8 +2540,10 @@ exports[`<Stake/> should render component 1`] = `
class="MuiTypography-root MuiTypography-body1"
style="line-height: 1.4;"
>
0
%
<span
class="MuiSkeleton-root MuiSkeleton-text MuiSkeleton-pulse"
style="width: 80px;"
/>
</p>
</td>
<td
Expand Down Expand Up @@ -5134,8 +5136,10 @@ exports[`<Stake/> should render correct staking headers 1`] = `
class="MuiTypography-root MuiTypography-body1"
style="line-height: 1.4;"
>
0
%
<span
class="MuiSkeleton-root MuiSkeleton-text MuiSkeleton-pulse"
style="width: 80px;"
/>
</p>
</td>
<td
Expand Down
24 changes: 16 additions & 8 deletions src/views/V1-Stake/__tests__/__snapshots__/V1-Stake.unit.test.tsx.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2846,8 +2846,10 @@ exports[`<Stake/> should render component. not connected 1`] = `
class="MuiTypography-root MuiTypography-body1"
style="line-height: 1.4;"
>
0
%
<span
class="MuiSkeleton-root MuiSkeleton-text MuiSkeleton-pulse"
style="width: 80px;"
/>
</p>
</td>
<td
Expand Down Expand Up @@ -5783,8 +5785,10 @@ exports[`<Stake/> should render the stake input Area when connected 1`] = `
class="MuiTypography-root MuiTypography-body1"
style="line-height: 1.4;"
>
0
%
<span
class="MuiSkeleton-root MuiSkeleton-text MuiSkeleton-pulse"
style="width: 80px;"
/>
</p>
</td>
<td
Expand Down Expand Up @@ -8502,8 +8506,10 @@ exports[`<Stake/> should render the v1 migration modal 1`] = `
class="MuiTypography-root MuiTypography-body1"
style="line-height: 1.4;"
>
0
%
<span
class="MuiSkeleton-root MuiSkeleton-text MuiSkeleton-pulse"
style="width: 80px;"
/>
</p>
</td>
<td
Expand Down Expand Up @@ -11667,8 +11673,10 @@ exports[`<Stake/> should render the v1 migration modal and banner 1`] = `
class="MuiTypography-root MuiTypography-body1"
style="line-height: 1.4;"
>
0
%
<span
class="MuiSkeleton-root MuiSkeleton-text MuiSkeleton-pulse"
style="width: 80px;"
/>
</p>
</td>
<td
Expand Down

0 comments on commit 28aef2c

Please sign in to comment.