2120/claim countdowns

[alfetopito]

Summary

Closes #2120

Wiring up the countdown in the Claim table

Seconds is a bonus that I can remove if it doesn't look good.

Anywhere else we should have a countdown?

To Test

1. Check an address which has claims

• Watch the count going down

  Background

Optional: Give background information for changes you've made, that might be difficult to explain via comments

[github-actions]

• 🔭 GP Swap: Gnosis Protocol v2 Swap UI

[W3stside]

i'd set a fixed width to the countdown, it bounces around, probably for @biocom

[anxolin]

Works perfect!

[elena-zh]

Hey @alfetopito . great changes!
Unfortunately, I'm not able to see airdrop option for accounts in the latest PRs.. But here is my question: will we show a countdown on this screen as well?

[W3stside]

mentioned this in slack but do we not usually depend on the block timestamp instead of computer machine time? (considering the latter can be manipulated via changing machine local time)

[fairlighteth]

Great to see this :)

i'd set a fixed width to the countdown, it bounces around, probably for @biocom

@W3stside Yes indeed, need to review this once merged.

Countdown for the simple airdrop window would be nice too (as @elena-zh suggested).

A suggestion to simplify, but requires a bit more of a logic implementation:

• Show DATE + Days left >>> March 11, 2022 (in 40 days)
• Then once we're 1 or 2 days before deadline >>> The logic you have now (counting down).

I see benefit in seeing a clear date/time stamp + a countdown combination. If I want to 'save the date' in my calendar, and only see a countdown, I have to reverse count and figure out the actual time stamp (Yes a tooltip could work here, but what about mobile?).

[alfetopito]

Great to see this :)

i'd set a fixed width to the countdown, it bounces around, probably for @biocom

@W3stside Yes indeed, need to review this once merged.

Countdown for the simple airdrop window would be nice too (as @elena-zh suggested).

Easy to add, just need to find out where. Thus it might be better if you do it @biocom

A suggestion to simplify, but requires a bit more of a logic implementation:

* Show DATE + Days left >>> March 11, 2022 (in 40 days)

* Then once we're 1 or 2 days before deadline >>> The logic you have now (counting down).

I see benefit in seeing a clear date/time stamp + a countdown combination. If I want to 'save the date' in my calendar, and only see a countdown, I have to reverse count and figure out the actual time stamp (Yes a tooltip could work here, but what about mobile?).

I have a dumb idea for implementing this but need a better suggestion to present it:
On click on the countdown, show the date and vice-versa.
Or have a button to switch between.
This is easier and covers both cases, but I'm struggling on how to show the users it's an option.

I'll push that in another PR to not mix up things, and can be accepted or not.

[alfetopito]

mentioned this in slack but do we not usually depend on the block timestamp instead of computer machine time? (considering the latter can be manipulated via changing machine local time)

Well, the code is based on Uni's claim stuff and they did rely on system clock.
I don't think it's worth the effort as it's in the user's interest to have the local time correct.

• Worst case local time is in the future: the UI will show as closed an they won't be able to claim
• Worst case local time is in the past: the UI will allow them to claim past claim window but the tx will revert as the contract prevents it

[alfetopito]

Hey @alfetopito . great changes! Unfortunately, I'm not able to see airdrop option for accounts in the latest PRs.

Yeah there was a bug there. It has since been fixed and merge onto claim branch.

But here is my question: will we show a countdown on this screen as well?

Agree we should. Left it up to @biocom as it'll make more sense he add and style it at once.

[alfetopito]

Actually, added the airdrop end date to the component #2178