[$40] Extend Payments Popover

[maxceem]

At the moment Payments Popover only shows Challenge id with copy and new tab buttons:

We want to update it to show the table with the next columns:

• "Challenge ID" - show what we show now: challenge id link with two icons (keep it short like now) and add ... when cut it.

• "Weekly Rate" - memberRate as dollar value, ex: $1000.00

• "Days" - days as a number, ex: 2

• "Amount" - amount as dollar value, ex: $400.00

• "Status" - status show as a label, possible values: completed (#0ab88a), scheduled (#9d41c9), in-progress (#9d41c9), failed (#E90C5A), cancelled (#aaa) - Preferable reuse PaymentStatus component.

• No sorting is needed. Keep the style of this table as simple as possible, so we keep this popover as small as possible.

• Make the Total Paid value dashed if there is at least one payment so we know that we can click it:

  

[maxceem]

works good

paid via https://www.topcoder.com/challenges/cac94a1e-2aea-471b-95c2-dba2ba3c20cc

[sandhiyakavi]

Verified on Dev Env.

[sandhiyakavi]

Verified on PRod Env with @nkumar-topcoder