Skip to content

Commit

Permalink
v5.3.0
Browse files Browse the repository at this point in the history
v5.3.0
  • Loading branch information
platschi authored Dec 15, 2022
2 parents 400c4f1 + 731ca7b commit 4dd70ef
Show file tree
Hide file tree
Showing 194 changed files with 19,291 additions and 9,918 deletions.
8 changes: 4 additions & 4 deletions .github/workflows/audit_build_verify.yml
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,7 @@ jobs:

steps:
- name: Checkout
uses: actions/checkout@93ea575cb5d8a053eaa0ac8fa3b40d7e05a33cc8 # pin@v2
uses: actions/checkout@755da8c3cf115ac066823e79a1e1788f8940201b # pin@v2

- name: Audit dependencies
run: npm audit --audit-level=critical
Expand All @@ -29,7 +29,7 @@ jobs:

steps:
- name: Checkout
uses: actions/checkout@93ea575cb5d8a053eaa0ac8fa3b40d7e05a33cc8 # pin@v2
uses: actions/checkout@755da8c3cf115ac066823e79a1e1788f8940201b # pin@v2

- name: Set npm cache directory
run: npm config set cache .npm-cache --global
Expand Down Expand Up @@ -60,7 +60,7 @@ jobs:
run: npm run lint:sarif

- name: Upload lint results
uses: github/codeql-action/upload-sarif@4238421316c33d73aeea2801274dd286f157c2bb # pin@codeql-bundle-20220322
uses: github/codeql-action/upload-sarif@959cbb7472c4d4ad70cdfe6f4976053fe48ab394 # pin@codeql-bundle-20220322
with:
sarif_file: lint-results.sarif
continue-on-error: true
Expand All @@ -79,7 +79,7 @@ jobs:

steps:
- name: Checkout
uses: actions/checkout@93ea575cb5d8a053eaa0ac8fa3b40d7e05a33cc8 # pin@v2
uses: actions/checkout@755da8c3cf115ac066823e79a1e1788f8940201b # pin@v2

- name: Set npm cache directory
run: npm config set cache .npm-cache --global
Expand Down
8 changes: 4 additions & 4 deletions .github/workflows/codeql.yml
Original file line number Diff line number Diff line change
Expand Up @@ -18,16 +18,16 @@ jobs:

steps:
- name: Checkout repository
uses: actions/checkout@93ea575cb5d8a053eaa0ac8fa3b40d7e05a33cc8 # pin@v2
uses: actions/checkout@755da8c3cf115ac066823e79a1e1788f8940201b # pin@v2

- name: Initialize CodeQL
uses: github/codeql-action/init@4238421316c33d73aeea2801274dd286f157c2bb # pin@codeql-bundle-20220322
uses: github/codeql-action/init@959cbb7472c4d4ad70cdfe6f4976053fe48ab394 # pin@codeql-bundle-20220322
with:
queries: security-and-quality
languages: javascript

- name: Autobuild
uses: github/codeql-action/autobuild@4238421316c33d73aeea2801274dd286f157c2bb # pin@codeql-bundle-20220322
uses: github/codeql-action/autobuild@959cbb7472c4d4ad70cdfe6f4976053fe48ab394 # pin@codeql-bundle-20220322

- name: Perform CodeQL Analysis
uses: github/codeql-action/analyze@4238421316c33d73aeea2801274dd286f157c2bb # pin@codeql-bundle-20220322
uses: github/codeql-action/analyze@959cbb7472c4d4ad70cdfe6f4976053fe48ab394 # pin@codeql-bundle-20220322
2 changes: 1 addition & 1 deletion .github/workflows/lighthouse.yml
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,7 @@ jobs:

steps:
- name: Checkout
uses: actions/checkout@93ea575cb5d8a053eaa0ac8fa3b40d7e05a33cc8 # pin@v2
uses: actions/checkout@755da8c3cf115ac066823e79a1e1788f8940201b # pin@v2

- name: Run lighthouse
run: |
Expand Down
7 changes: 3 additions & 4 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -19,11 +19,10 @@ The latest IPFS hash can be found under [releases](https://github.com/Kwenta/kwe
- Recoil
- Unstated-next
- Styled-Components
- Immer

## Ethereum stack

- ethers.js v5 - Ethereum wallet implementation.
- [ethers.js v5](https://github.com/ethers-io/ethers.js) - Ethereum wallet implementation.
- [Rainbowkit](https://github.com/rainbow-me/rainbowkit) - for ethereum wallet onboarding.
- [@synthetixio/contracts-interface](https://github.com/Synthetixio/js-monorepo/tree/master/packages/contracts-interface) - for interactions with the Synthetix protocol.
- [@synthetixio/queries](https://github.com/Synthetixio/js-monorepo/tree/master/packages/queries) - for historical data (powered by [TheGraph](https://thegraph.com/))
Expand Down Expand Up @@ -84,7 +83,7 @@ Page tests should be added to the \_\_tests\_\_ folder at the root as it is not

### End-2-End testing

In order to run fully automated end-2-end (e2e) tests Kwenta uses [Synpress](https://github.com/Synthetixio/synpress) (a wrapper around [Cynpress](https://www.cypress.io/)).
In order to run fully automated end-2-end (e2e) tests Kwenta uses [Synpress](https://github.com/Synthetixio/synpress) (a wrapper around [Cypress](https://www.cypress.io/)).

#### Constraints

Expand Down Expand Up @@ -127,4 +126,4 @@ Kwenta welcomes contributors. Regardless of the time you have available, everyon

## Contact

Join the community on the [Kwenta Discord server](https://discord.gg/HUPyQ63TFF)!
Join the community on the [Kwenta Discord server](https://discord.gg/kwenta)!
Binary file added assets/png/rainbowkit/frame.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
4 changes: 4 additions & 0 deletions components/Loader/Loader.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -30,4 +30,8 @@ export const MiniLoader = () => {
return <Loader inline height="11px" width="11px" style={{ marginLeft: '10px' }} />;
};

export const ButtonLoader = () => {
return <Loader inline height="20x" width="20px" />;
};

export default Loader;
28 changes: 28 additions & 0 deletions components/Rainbowkit/Frame/Frame.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,28 @@
import { Chain, Wallet } from '@rainbow-me/rainbowkit';
import { InjectedConnector } from 'wagmi/connectors/injected';

import FrameIcon from 'assets/png/rainbowkit/frame.png';

type FrameOptions = {
chains: Chain[];
shimDisconnect?: boolean;
};

const Frame = ({ chains, shimDisconnect }: FrameOptions): Wallet => ({
id: 'frame',
iconBackground: '#FFF',
name: 'Frame',
iconUrl: async () => FrameIcon,
downloadUrls: {
browserExtension:
'https://chrome.google.com/webstore/detail/frame-companion/ldcoohedfbjoobcadoglnnmmfbdlmmhf',
},
createConnector: () => {
const connector = new InjectedConnector({ chains, options: { shimDisconnect } });
return {
connector,
};
},
});

export default Frame;
1 change: 1 addition & 0 deletions components/Rainbowkit/Frame/index.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
export { default } from './Frame';
163 changes: 163 additions & 0 deletions components/StakeCard/StakeCard.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,163 @@
import Wei from '@synthetixio/wei';
import { FC, memo, useCallback, useMemo, useState } from 'react';
import { useTranslation } from 'react-i18next';
import styled from 'styled-components';

import Button from 'components/Button';
import NumericInput from 'components/Input/NumericInput';
import SegmentedControl from 'components/SegmentedControl';
import { DEFAULT_CRYPTO_DECIMALS, DEFAULT_TOKEN_DECIMALS } from 'constants/defaults';
import { StakingCard } from 'sections/dashboard/Stake/common';
import { FlexDivRowCentered, numericValueCSS } from 'styles/common';
import { toWei, truncateNumbers } from 'utils/formatters/number';

type StakeCardProps = {
title: string;
stakeBalance: Wei;
unstakeBalance: Wei;
onStake(amount: string): void;
onUnstake(amount: string): void;
stakeEnabled?: boolean;
unstakeEnabled?: boolean;
isApproved?: boolean;
onApprove?: () => void;
};

const StakeCard: FC<StakeCardProps> = memo(
({
title,
stakeBalance,
unstakeBalance,
onStake,
onUnstake,
stakeEnabled = true,
unstakeEnabled = true,
isApproved,
onApprove,
}) => {
const { t } = useTranslation();

const [amount, setAmount] = useState('');
const [activeTab, setActiveTab] = useState(0);

const balance = useMemo(() => {
return activeTab === 0 ? stakeBalance : unstakeBalance;
}, [activeTab, stakeBalance, unstakeBalance]);

const isEnabled = useMemo(() => {
return toWei(amount).gt(0) && balance.gt(0);
}, [amount, balance]);

const isStakeEnabled = useMemo(() => {
return activeTab === 0 && isEnabled && stakeEnabled;
}, [activeTab, isEnabled, stakeEnabled]);

const isUnstakeEnabled = useMemo(() => {
return activeTab === 1 && isEnabled && unstakeEnabled;
}, [activeTab, isEnabled, unstakeEnabled]);

const isDisabled = useMemo(() => {
return activeTab === 0 ? !isStakeEnabled : !isUnstakeEnabled;
}, [activeTab, isStakeEnabled, isUnstakeEnabled]);

const balanceString = useMemo(() => {
return truncateNumbers(balance, DEFAULT_CRYPTO_DECIMALS);
}, [balance]);

const onMaxClick = useCallback(() => {
setAmount(truncateNumbers(balance, DEFAULT_TOKEN_DECIMALS));
}, [balance]);

const handleTabChange = useCallback((tabIndex: number) => {
setAmount('');
setActiveTab(tabIndex);
}, []);

const handleSubmit = useCallback(() => {
if (!isApproved) {
onApprove?.();
} else if (isStakeEnabled) {
onStake(amount);
} else if (isUnstakeEnabled) {
onUnstake(amount);
}
}, [isStakeEnabled, isUnstakeEnabled, onStake, onUnstake, amount, onApprove, isApproved]);

const handleChange = useCallback((_, newValue: string) => {
if (newValue !== '' && newValue.indexOf('.') === -1) {
setAmount(parseFloat(newValue).toString());
} else {
setAmount(newValue);
}
}, []);

return (
<StakingInputCardContainer>
<SegmentedControl
values={[
t('dashboard.stake.tabs.stake-table.stake'),
t('dashboard.stake.tabs.stake-table.unstake'),
]}
onChange={handleTabChange}
selectedIndex={activeTab}
/>
<StakeInputContainer>
<StakeInputHeader>
<div>{title}</div>
<StyledFlexDivRowCentered>
<div>{t('dashboard.stake.tabs.stake-table.balance')}</div>
<div className="max" onClick={onMaxClick}>
{balanceString}
</div>
</StyledFlexDivRowCentered>
</StakeInputHeader>
<StyledInput value={amount} onChange={handleChange} />
</StakeInputContainer>
<Button fullWidth variant="flat" size="sm" disabled={isDisabled} onClick={handleSubmit}>
{!isApproved
? t('dashboard.stake.tabs.stake-table.approve')
: activeTab === 0
? t('dashboard.stake.tabs.stake-table.stake')
: t('dashboard.stake.tabs.stake-table.unstake')}
</Button>
</StakingInputCardContainer>
);
}
);

const StyledFlexDivRowCentered = styled(FlexDivRowCentered)`
column-gap: 5px;
`;

const StakingInputCardContainer = styled(StakingCard)`
min-height: 125px;
max-height: 250px;
display: flex;
flex-direction: column;
justify-content: space-between;
`;

const StakeInputHeader = styled.div`
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 10px;
color: ${(props) => props.theme.colors.selectedTheme.title};
font-size: 14px;
.max {
cursor: pointer;
color: ${(props) => props.theme.colors.selectedTheme.button.text.primary};
${numericValueCSS};
}
`;

const StakeInputContainer = styled.div`
margin: 20px 0;
`;

const StyledInput = styled(NumericInput)`
font-family: ${(props) => props.theme.fonts.monoBold};
`;

export default StakeCard;
7 changes: 5 additions & 2 deletions components/TVChart/TVChart.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@ import { ThemeContext } from 'styled-components';
import { chain } from 'wagmi';

import Connector from 'containers/Connector';
import { FuturesOrder } from 'queries/futures/types';
import { FuturesOrder } from 'sdk/types/futures';
import { ChartBody } from 'sections/exchange/TradeCard/Charts/common/styles';
import { currentThemeState } from 'store/ui';
import darkTheme from 'styles/theme/colors/dark';
Expand Down Expand Up @@ -88,9 +88,9 @@ export function TVChart({
};

const renderOrderLines = () => {
clearOrderLines();
_widget.current?.onChartReady(() => {
_widget.current?.chart().dataReady(() => {
clearOrderLines();
_oderLineRefs.current = openOrders.reduce<IPositionLineAdapter[]>((acc, order) => {
if (order.targetPrice) {
const color =
Expand Down Expand Up @@ -292,6 +292,9 @@ export function TVChart({
}, [marketAsset]);

const onSubscribe = useCallback((newIntervalId: number) => {
if (_intervalId.current) {
clearInterval(_intervalId.current);
}
_intervalId.current = newIntervalId;
}, []);

Expand Down
8 changes: 5 additions & 3 deletions components/Table/Pagination.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -13,6 +13,7 @@ type PaginationProps = {
pageCount: number;
canNextPage: boolean;
canPreviousPage: boolean;
compact: boolean;
setPage: (page: number) => void;
previousPage: () => void;
nextPage: () => void;
Expand All @@ -24,6 +25,7 @@ const Pagination: FC<PaginationProps> = React.memo(
pageCount,
canNextPage = true,
canPreviousPage = true,
compact = false,
setPage,
nextPage,
previousPage,
Expand All @@ -34,7 +36,7 @@ const Pagination: FC<PaginationProps> = React.memo(
const toLastPage = () => setPage(pageCount - 1);

return (
<PaginationContainer>
<PaginationContainer compact={compact}>
<span>
<ArrowButton onClick={firstPage} disabled={!canPreviousPage}>
<LeftEndArrowIcon />
Expand Down Expand Up @@ -67,9 +69,9 @@ const PageInfo = styled.span`
color: ${(props) => props.theme.colors.selectedTheme.gray};
`;

const PaginationContainer = styled(GridDivCenteredCol)`
const PaginationContainer = styled(GridDivCenteredCol)<{ compact: boolean }>`
grid-template-columns: auto 1fr auto;
padding: 15px 12px;
padding: ${(props) => (props.compact ? '10px' : '15px')} 12px;
border-bottom-left-radius: 4px;
border-bottom-right-radius: 4px;
justify-items: center;
Expand Down
5 changes: 4 additions & 1 deletion components/Table/Table.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,7 @@ export type TablePalette = 'primary';

const CARD_HEIGHT = '40px';
const MAX_PAGE_ROWS = 100;
const MAX_TOTAL_ROWS = 1000;
const MAX_TOTAL_ROWS = 9999;

type ColumnWithSorting<D extends object = {}> = Column<D> & {
sortType?: string | ((rowA: Row<any>, rowB: Row<any>) => -1 | 1);
Expand Down Expand Up @@ -66,6 +66,7 @@ type TableProps = {
sortBy?: object[];
showShortList?: boolean;
lastRef?: any;
compactPagination?: boolean;
};

export const Table: FC<TableProps> = ({
Expand All @@ -86,6 +87,7 @@ export const Table: FC<TableProps> = ({
showShortList,
sortBy = [],
lastRef = null,
compactPagination = false,
}) => {
const memoizedColumns = useMemo(
() => columns,
Expand Down Expand Up @@ -209,6 +211,7 @@ export const Table: FC<TableProps> = ({
</TableContainer>
{showPagination && !showShortList && data.length > (pageSize ?? MAX_PAGE_ROWS) ? (
<Pagination
compact={compactPagination}
pageIndex={pageIndex}
pageCount={pageCount}
canNextPage={canNextPage}
Expand Down
Loading

0 comments on commit 4dd70ef

Please sign in to comment.