Skip to content

Commit

Permalink
Merge remote-tracking branch 'origin/koni/dev/issue-2558' into subwal…
Browse files Browse the repository at this point in the history 
…let-dev
  • Loading branch information
@saltict
saltict committed Feb 6, 2024
2 parents ed9748f + 46c7793 commit 078ff26
Show file tree
Hide file tree
Showing 3 changed files with 75 additions and 53 deletions.
93 changes: 45 additions & 48 deletions packages/extension-koni-ui/src/Popup/Transaction/variants/Unbond.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -408,54 +408,51 @@ const Component: React.FC = () => {
</Checkbox>
</Form.Item>

{!fastLeaveValue || !showFastLeave
? (
poolInfo.type !== YieldPoolType.LENDING
? (
<>
{!!UNSTAKE_ALERT_DATA.length && (
<div className={'__instruction-items-container'}>
{UNSTAKE_ALERT_DATA.map((_props, index) => {
return (
<InstructionItem
className={'__instruction-item'}
description={(
<div dangerouslySetInnerHTML={{ __html: (_props.description)?.replace('{unBondedTime}', unBondedTime) }}></div>
)}
iconInstruction={
<BackgroundIcon
backgroundColor={getAlphaColor(_props.iconColor, 0.1)}
iconColor={_props.iconColor}
phosphorIcon={getBannerButtonIcon(_props.icon)}
size='lg'
weight='fill'
/>
}
key={`${_props.icon}-${index}`}
title={_props.title}
/>
);
})}
</div>
)}
</>
)
: (
<AlertBox
description={t('You can withdraw your supplied funds immediately')}
title={t('Withdraw')}
type={'info'}
/>
)
)
: (
<AlertBox
description={t('With fast unstake, you will receive your funds immediately with a higher fee')}
title={t('Fast unstake')}
type={'info'}
/>
)}

<div className={'__instruction-items-container'}>
{!fastLeaveValue || !showFastLeave
? (
poolInfo.type !== YieldPoolType.LENDING
? (
<>
{!!UNSTAKE_ALERT_DATA.length && UNSTAKE_ALERT_DATA.map((_props, index) => {
return (
<InstructionItem
className={'__instruction-item'}
description={(
<div dangerouslySetInnerHTML={{ __html: (_props.description)?.replace('{unBondedTime}', unBondedTime) }}></div>
)}
iconInstruction={
<BackgroundIcon
backgroundColor={getAlphaColor(_props.iconColor, 0.1)}
iconColor={_props.iconColor}
phosphorIcon={getBannerButtonIcon(_props.icon)}
size='lg'
weight='fill'
/>
}
key={`${_props.icon}-${index}`}
title={_props.title}
/>
);
})}
</>
)
: (
<AlertBox
description={t('You can withdraw your supplied funds immediately')}
title={t('Withdraw')}
type={'info'}
/>
)
)
: (
<AlertBox
description={t('With fast unstake, you will receive your funds immediately with a higher fee')}
title={t('Fast unstake')}
type={'info'}
/>
)}
</div>
</Form>
</TransactionContent>
<TransactionFooter>
Expand Down
26 changes: 22 additions & 4 deletions packages/extension-koni-ui/src/components/Earning/EarningOptionItem.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,7 @@
import { _ChainInfo } from '@subwallet/chain-list/types';
import { useTranslation } from '@subwallet/extension-koni-ui/hooks';
import { ThemeProps, YieldGroupInfo } from '@subwallet/extension-koni-ui/types';
import { isRelatedToAstar } from '@subwallet/extension-koni-ui/utils';
import { Icon, Logo, Number } from '@subwallet/react-ui';
import CN from 'classnames';
import { CaretRight } from 'phosphor-react';
Expand All @@ -21,7 +22,9 @@ const Component: React.FC<Props> = (props: Props) => {
const { chain, className, isShowBalance, onClick, poolGroup } = props;
const { t } = useTranslation();

const { balance, maxApy, symbol, token } = poolGroup;
const { balance, group, maxApy, symbol, token } = poolGroup;

const _isRelatedToAstar = isRelatedToAstar(group);

return (
<div
Expand Down Expand Up @@ -52,7 +55,7 @@ const Component: React.FC<Props> = (props: Props) => {
</div>

{
!!maxApy && (
!_isRelatedToAstar && !!maxApy && (
<div className='__item-upto'>
<div className='__item-upto-label'>
{t('Up to')}:
Expand Down Expand Up @@ -83,7 +86,7 @@ const Component: React.FC<Props> = (props: Props) => {
</div>
</div>
{
!!maxApy && (
!_isRelatedToAstar && !!maxApy && (
<div className='__item-time'>
{t('per year')}
</div>
Expand All @@ -94,6 +97,14 @@ const Component: React.FC<Props> = (props: Props) => {
</div>

<div className={'__item-right-part'}>
{
_isRelatedToAstar && (
<div className={'__visit-dapp'}>
{t('View on dApp')}
</div>
)
}

<Icon
phosphorIcon={CaretRight}
size='sm'
Expand Down Expand Up @@ -126,7 +137,8 @@ const EarningOptionItem = styled(Component)<Props>(({ theme: { token } }: Props)
'.__item-right-part': {
display: 'flex',
alignItems: 'center',
paddingLeft: 10
paddingLeft: 10,
gap: 10
},

'.__item-logo': {
Expand Down Expand Up @@ -220,6 +232,12 @@ const EarningOptionItem = styled(Component)<Props>(({ theme: { token } }: Props)
fontSize: token.fontSizeSM,
lineHeight: token.lineHeightSM,
color: token.colorTextLight4
},

'.__visit-dapp': {
color: token.colorTextLight4,
fontSize: token.fontSizeSM,
lineHeight: token.lineHeightSM
}
});
});
Expand Down
9 changes: 8 additions & 1 deletion packages/extension-koni-ui/src/utils/earning.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,14 @@ import { Database, HandsClapping, Leaf, User, Users } from 'phosphor-react';

// todo: after supporting Astar v3, remove this
export function isRelatedToAstar (slug: string) {
return ['ASTR___native_staking___astar', 'SDN___native_staking___shiden', 'SDN-Shiden', 'ASTR-Astar'].includes(slug);
return [
'ASTR___native_staking___astar',
'SDN___native_staking___shiden',
'SBY___native_staking___shibuya',
'SDN-Shiden',
'ASTR-Astar',
'shibuya-NATIVE-SBY'
].includes(slug);
}

// todo: About label, will convert to key for i18n later
Expand Down

1 comment on commit 078ff26

@saltict
Copy link
Author

@saltict saltict commented on 078ff26 Feb 6, 2024

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🚀 Deployed on https://subwallet-dev--sw-web-runner.netlify.app

Please sign in to comment.