Skip to content

Commit c0a7854

Browse files
authored
Merge pull request #308 from oasisprotocol/lw/no-claim
stake: Remove misleading mentions of claim step after unstaking
2 parents 83215d3 + 99f2360 commit c0a7854

6 files changed

Lines changed: 69 additions & 124 deletions

File tree

.changelog/308.bugfix.md

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
stake: Remove misleading mentions of claim step after unstaking

stake/src/components/StakingTabs/DebondingTab.tsx

Lines changed: 64 additions & 112 deletions
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,6 @@ import {
99
NumberUtils,
1010
SharesAmount,
1111
StringUtils,
12-
SuccessIcon,
1312
Table,
1413
ToggleButton,
1514
Tooltip,
@@ -24,37 +23,16 @@ import { endOfDay } from 'date-fns/endOfDay'
2423
import { useAppState } from '../../hooks/useAppState'
2524
import { useAccount } from 'wagmi'
2625

27-
type DebondingItemStatus = 'ready' | 'waiting' | null
28-
2926
type DebondingItem = Undelegation & {
30-
status: DebondingItemStatus
3127
debondTimeEstimate: Date | null
3228
}
3329

3430
interface Props {
3531
undelegations: Undelegations
3632
}
3733

38-
const getDebondingItemStatus = (
39-
epoch: DebondingItem['epoch'],
40-
latestEpoch?: number | bigint
41-
): DebondingItemStatus => {
42-
if (!latestEpoch) {
43-
return null
44-
}
45-
46-
if (epoch <= latestEpoch) {
47-
return 'ready'
48-
}
49-
50-
return 'waiting'
51-
}
52-
5334
const DebondingTabCmp: FC<Props> = ({ undelegations }) => {
54-
const {
55-
state: { consensusStatus },
56-
getTimeEstimateForFutureEpoch,
57-
} = useGrpc()
35+
const { getTimeEstimateForFutureEpoch } = useGrpc()
5836
const { chain } = useAccount()
5937
const nativeCurrency = chain?.nativeCurrency
6038
const {
@@ -74,7 +52,6 @@ const DebondingTabCmp: FC<Props> = ({ undelegations }) => {
7452
from,
7553
shares,
7654
epoch,
77-
status: getDebondingItemStatus(epoch, consensusStatus?.latest_epoch),
7855
debondTimeEstimate: debondTimeEstimates[i],
7956
} satisfies DebondingItem
8057
})
@@ -84,7 +61,7 @@ const DebondingTabCmp: FC<Props> = ({ undelegations }) => {
8461
init()
8562

8663
// eslint-disable-next-line react-hooks/exhaustive-deps
87-
}, [undelegations, consensusStatus?.latest_epoch])
64+
}, [undelegations])
8865

8966
if (debondingItems === null) return null
9067

@@ -127,25 +104,20 @@ const DebondingTabCmp: FC<Props> = ({ undelegations }) => {
127104
</td>
128105
<td>
129106
{!isExpanded && (
130-
<>
131-
{entry.status === 'waiting' && (
132-
<div className={classes.rowStatusWaiting}>
133-
{entry.debondTimeEstimate && (
134-
<Tooltip>
135-
<TooltipTrigger>
136-
<HourglassIcon />
137-
</TooltipTrigger>
138-
<TooltipContent>
139-
Expected to be available on
140-
<br />
141-
{DateUtils.intlDateFormat(entry.debondTimeEstimate, { format: 'short' })}
142-
</TooltipContent>
143-
</Tooltip>
144-
)}
145-
</div>
107+
<div className={classes.rowStatusWaiting}>
108+
{entry.debondTimeEstimate && (
109+
<Tooltip>
110+
<TooltipTrigger>
111+
<HourglassIcon />
112+
</TooltipTrigger>
113+
<TooltipContent>
114+
Expected to be available on
115+
<br />
116+
{DateUtils.intlDateFormat(entry.debondTimeEstimate, { format: 'short' })}
117+
</TooltipContent>
118+
</Tooltip>
146119
)}
147-
{entry.status === 'ready' && <SuccessIcon label="Available to claim" />}
148-
</>
120+
</div>
149121
)}
150122
</td>
151123
<td>
@@ -158,77 +130,57 @@ const DebondingTabCmp: FC<Props> = ({ undelegations }) => {
158130
{isExpanded && (
159131
<tr className={classes.expandedRow}>
160132
<td colSpan={4}>
161-
{entry.status === 'waiting' && (
162-
<div className={classes.debondingRowExpanded}>
163-
<p className="body">
164-
<span>Expected amount:</span>
165-
<SharesAmount
166-
className={classes.debondingRowExpandedAmount}
167-
shares={entry.shares}
168-
validator={validator}
169-
type="unstaking"
170-
/>
171-
</p>
172-
</div>
173-
)}
133+
<div className={classes.debondingRowExpanded}>
134+
<p className="body">
135+
<span>Expected amount:</span>
136+
<SharesAmount
137+
className={classes.debondingRowExpandedAmount}
138+
shares={entry.shares}
139+
validator={validator}
140+
type="unstaking"
141+
/>
142+
</p>
143+
</div>
174144
<div className={classes.debondingRowActions}>
175-
{entry.status === 'ready' && (
176-
<div className={classes.debondingReady}>
177-
<div className={StringUtils.clsx(classes.infoBox, classes.infoBoxSuccess)}>
178-
<p className="body">
179-
Your{' '}
180-
<SharesAmount
181-
shares={entry.shares}
182-
validator={validator}
183-
type="unstaking"
184-
/>{' '}
185-
is available.
145+
<div className={classes.infoBox}>
146+
{entry.debondTimeEstimate && (
147+
<>
148+
<HourglassIcon />
149+
<p>
150+
Estimated to be available on {isMobileScreen && <br />}
151+
{DateUtils.intlDateFormat(entry.debondTimeEstimate, { format: 'short' })}
186152
</p>
187-
</div>
188-
</div>
189-
)}
190-
{entry.status === 'waiting' && (
191-
<div className={classes.infoBox}>
192-
{entry.debondTimeEstimate && (
193-
<>
194-
<HourglassIcon />
195-
<p>
196-
Estimated to be available on {isMobileScreen && <br />}
197-
{DateUtils.intlDateFormat(entry.debondTimeEstimate, { format: 'short' })}
198-
</p>
199-
</>
200-
)}
201-
202-
<SharesAmount shares={entry.shares} validator={validator} type="unstaking">
203-
{amount => {
204-
if (amount === null) return null
205-
if (entry.debondTimeEstimate === null) return null
206-
207-
const formattedAmount = `${NumberUtils.formatAmount(amount.toFixed(0), 18)} ${nativeCurrency?.symbol}`
208-
const validatorFriendlyName =
209-
StringUtils.getValidatorFriendlyName(validator)
210-
211-
return (
212-
<a
213-
href={CalendarUtils.addGoogleCalendarEventLink(
214-
`Unstaking of ${formattedAmount} from ${validatorFriendlyName} completed`,
215-
startOfDay(entry.debondTimeEstimate),
216-
endOfDay(entry.debondTimeEstimate),
217-
window.location.href,
218-
`Your stake in amount of ${formattedAmount} will be automatically withdrawn from validator ${validatorFriendlyName} today.`
219-
)}
220-
target="_blank"
221-
rel="nofollow"
222-
>
223-
<Button size="small" variant="text" className={classes.scheduleBtn}>
224-
Remind me
225-
</Button>
226-
</a>
227-
)
228-
}}
229-
</SharesAmount>
230-
</div>
231-
)}
153+
</>
154+
)}
155+
156+
<SharesAmount shares={entry.shares} validator={validator} type="unstaking">
157+
{amount => {
158+
if (amount === null) return null
159+
if (entry.debondTimeEstimate === null) return null
160+
161+
const formattedAmount = `${NumberUtils.formatAmount(amount.toFixed(0), 18)} ${nativeCurrency?.symbol}`
162+
const validatorFriendlyName = StringUtils.getValidatorFriendlyName(validator)
163+
164+
return (
165+
<a
166+
href={CalendarUtils.addGoogleCalendarEventLink(
167+
`Unstaking of ${formattedAmount} from ${validatorFriendlyName} completed`,
168+
startOfDay(entry.debondTimeEstimate),
169+
endOfDay(entry.debondTimeEstimate),
170+
window.location.href,
171+
`Your stake in amount of ${formattedAmount} will be automatically withdrawn from validator ${validatorFriendlyName} today.`
172+
)}
173+
target="_blank"
174+
rel="nofollow"
175+
>
176+
<Button size="small" variant="text" className={classes.scheduleBtn}>
177+
Remind me
178+
</Button>
179+
</a>
180+
)
181+
}}
182+
</SharesAmount>
183+
</div>
232184
</div>
233185
</td>
234186
</tr>

stake/src/components/StakingTabs/index.module.css

Lines changed: 3 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -82,10 +82,6 @@
8282
margin: 1.375rem 1.375rem 1.125rem;
8383
}
8484

85-
.infoBoxSuccess {
86-
background: var(--green-25);
87-
}
88-
8985
.overviewTab {
9086
padding: 1rem 2.9375rem 1rem 1.25rem;
9187

@@ -212,12 +208,10 @@
212208
p {
213209
line-height: 40px;
214210
}
215-
}
216211

217-
.debondingReady {
218-
display: flex;
219-
flex-direction: column;
220-
align-items: center;
212+
.debondingRowExpandedAmount.debondingRowExpandedAmount {
213+
width: auto;
214+
}
221215
}
222216
}
223217

stake/src/pages/UnstakePage/index.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -245,7 +245,7 @@ const UnstakePageCmp: FC = () => {
245245
calcAmountFromPercentage={getAmountFromPercentage}
246246
/>
247247
<p className="body mute">
248-
<b>Note:</b> users will be able to claim their staked ROSE after the 14 day debonding period has
248+
<b>Note:</b> users will be able to use their staked ROSE after the 14 day debonding period has
249249
finished.
250250
</p>
251251
<div className={classes.actionButtonsContainer}>

stake/src/providers/GrpcContext.ts

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,6 @@ export interface GrpcProviderState {
77
}
88

99
export interface GrpcProviderContext {
10-
readonly state: GrpcProviderState
1110
fetchConsensusStatus: () => Promise<oasis.types.ConsensusStatus>
1211
getTimeEstimateForFutureEpoch: (epoch: bigint) => Promise<Date | null>
1312
fetchDelegations: () => Promise<Delegations>

stake/src/providers/GrpcProvider.tsx

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -77,7 +77,6 @@ export const GrpcContextProvider: FC<PropsWithChildren> = ({ children }) => {
7777
}, [isSupportedNetwork])
7878

7979
const providerState: GrpcProviderContext = {
80-
state,
8180
fetchConsensusStatus,
8281
getTimeEstimateForFutureEpoch,
8382
fetchDelegations: () => getDelegations(chainId!, address!),

0 commit comments

Comments
 (0)