chore(PaymentCard): refactor payment card to ts #3625

AadneRo · 2024-05-29T11:55:13Z

rewrite the component to typescript
remove all use of the daggy library
Implement new custom card api
Re-write the docs for the component

Please test and give feedback on the docs I've added here

vercel · 2024-05-29T11:55:16Z

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
eufemia	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Jun 25, 2024 11:16am

langz

So far, this looks nice 🍏

packages/dnb-eufemia/src/extensions/payment-card/types.ts

packages/dnb-eufemia/src/extensions/payment-card/stories/PaymentCard.stories.tsx

codesandbox-ci · 2024-06-13T11:54:48Z

This pull request is automatically built and testable in CodeSandbox.

To see build info of the built libraries, click here or the icon next to each commit SHA.

AadneRo · 2024-06-14T10:34:06Z

packages/dnb-design-system-portal/src/docs/uilib/extensions/payment-card/properties.mdx

-| `Expired`        |
-| `Blocked`        |
-| `Active`         |
+| Properties          | Type              | Description            |


Do you think I should change this as well?

tujoworker

Would be cool to have an entry in the v11.mdx file ⭐

packages/dnb-design-system-portal/src/docs/uilib/about-the-lib/releases/eufemia/v11-info.mdx

langz · 2024-06-14T12:04:16Z

...ions/payment-card/__tests__/__image_snapshots__/paymentcard-have-to-match-all-cards.snap.png

I see there's a few changes/updates to a few card designs in this PR:

VX1 has gotten bank axept logo added.

VX4 has gotten bank axept logo removed.

Are these changes correct?

When looking at the Figma sketch(Not 100% sure if this is the correct source), there I don't find VX1 anymore, and it looks like VX4 has the bank axept logo:

I don't know what's correct here. Is there a designer or so that we could ask to verify it?
Just asking them to look through the snapshot/screenshot, and say if they see anything strange.

langz · 2024-06-14T12:08:30Z

packages/dnb-design-system-portal/src/docs/uilib/extensions/payment-card/props-mapping.png

Nice, I like this, very good :)

langz · 2024-06-14T12:11:09Z

I think the Sbanken cards that you've implemented looks great.
I had a thought that I could help verify if they look as expected, vs. the source/truth which I assume is in a FIgma file.
Do you have the link to the Figma file, so that I can do a quick comparison between designs and what've implemented in this PR?

Should we also add a link to Sbanken cards in this PR, like we have a link to DNB cards in PaymentCards docs as well.

langz · 2024-06-14T12:12:53Z

packages/dnb-eufemia/src/extensions/payment-card/PaymentCardDocs.ts

+
+export const PaymentCardTypeProperties: PropertiesTableProps = {
+  displayName: {
+    doc: 'used by the screan reader.',


Suggested change

doc: 'used by the screan reader.',

doc: 'used by the screen reader.',

AadneRo · 2024-06-14T12:17:51Z

I think the Sbanken cards that you've implemented looks great. I had a thought that I could help verify if they look as expected, vs. the source/truth which I assume is in a FIgma file. Do you have the link to the Figma file, so that I can do a quick comparison between designs and what've implemented in this PR?

Should we also add a link to Sbanken cards in this PR, like we have a link to DNB cards in PaymentCards docs as well.

Here is the link, I'll add it to the docs as well
https://www.figma.com/design/4fgS4rHsGJtU9JxE3DWwFO/Eufemia---Web-(Sbanken)?node-id=21096-10019&t=SxGeJNuxR8Cmo4ze-0

- remove all use of the daggy library - Minor changes to the API in order to remove this dependency - major refactor of all components

Update all card styles to match the old

- Revert the export - cleanup

vercel bot had a problem deploying to Preview May 29, 2024 12:08 Failure

AadneRo changed the title ~~Chore/refactor payment card to ts~~ chore(PaymentCard): refactor payment card to ts May 30, 2024

AadneRo force-pushed the chore/refactor-payment-card-to-ts branch from ef394c1 to 26017b1 Compare June 7, 2024 13:13

vercel bot had a problem deploying to Preview June 7, 2024 13:38 Failure

langz reviewed Jun 10, 2024

View reviewed changes

AadneRo force-pushed the chore/refactor-payment-card-to-ts branch from f479d55 to dac526f Compare June 10, 2024 14:21

vercel bot had a problem deploying to Preview June 10, 2024 14:27 Failure

vercel bot had a problem deploying to Preview June 12, 2024 14:05 Failure

vercel bot had a problem deploying to Preview June 12, 2024 14:14 Failure

AadneRo force-pushed the chore/refactor-payment-card-to-ts branch from 0efc600 to aca2531 Compare June 13, 2024 11:48

vercel bot deployed to Preview June 13, 2024 12:01 View deployment

AadneRo force-pushed the chore/refactor-payment-card-to-ts branch from aca2531 to 08a1af2 Compare June 14, 2024 09:50

vercel bot deployed to Preview June 14, 2024 10:03 View deployment

AadneRo force-pushed the chore/refactor-payment-card-to-ts branch from 08a1af2 to 4f10c12 Compare June 14, 2024 10:17

vercel bot deployed to Preview June 14, 2024 10:24 View deployment

AadneRo force-pushed the chore/refactor-payment-card-to-ts branch 3 times, most recently from be669b7 to b9f37ab Compare June 14, 2024 10:32

AadneRo commented Jun 14, 2024

View reviewed changes

AadneRo marked this pull request as ready for review June 14, 2024 10:40

vercel bot deployed to Preview June 14, 2024 10:48 View deployment

tujoworker reviewed Jun 14, 2024

View reviewed changes

vercel bot deployed to Preview June 14, 2024 11:25 View deployment

langz reviewed Jun 14, 2024

View reviewed changes

packages/dnb-design-system-portal/src/docs/uilib/about-the-lib/releases/eufemia/v11-info.mdx Outdated Show resolved Hide resolved

langz reviewed Jun 14, 2024

View reviewed changes

packages/dnb-design-system-portal/src/docs/uilib/about-the-lib/releases/eufemia/v11-info.mdx Outdated Show resolved Hide resolved

langz reviewed Jun 14, 2024

View reviewed changes

packages/dnb-design-system-portal/src/docs/uilib/extensions/payment-card/props-mapping.png Outdated

Copy link

Contributor

langz Jun 14, 2024

Choose a reason for hiding this comment

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

Nice, I like this, very good :)

langz reviewed Jun 14, 2024

View reviewed changes

AadneRo added 22 commits June 14, 2024 14:21

Refactor PaymentCard to ts

9d6f958

- remove all use of the daggy library - Minor changes to the API in order to remove this dependency - major refactor of all components

Update card designs type

5d58bad

Update all card styles to match the old

Add translations to type

a058c1a

Remove old files

5d626e3

Update export and nit picks

c5fd793

story

fdaf393

update api

5500b27

docs

f5043d0

implement new api and logic

f4ce90e

Export all designs

ff5d62c

- Revert the export - cleanup

Cleanup

2274e92

update table in storybook

acd08b1

Update info and add more examples

c5ec4d5

Change customCard type name

268f749

cleanup

d303caa

update docs and add typed docs

616eb09

fix tests

72f7703

Fis Products table

842ec9f

Update tests

044c5e8

nitpick

b6f4deb

Update v11-info with breaking changes

6d023a4

typos and other nits

3d3ec75

AadneRo force-pushed the chore/refactor-payment-card-to-ts branch from 8b4f41e to 3d3ec75 Compare June 14, 2024 12:21

vercel bot deployed to Preview June 14, 2024 12:29 View deployment

AadneRo added 2 commits June 25, 2024 13:04

product code card type adjustments

1694750

typo

941d591

vercel bot deployed to Preview June 25, 2024 11:16 View deployment

tujoworker force-pushed the main branch from f3f55d3 to a5623f5 Compare November 25, 2024 21:39

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

chore(PaymentCard): refactor payment card to ts #3625

chore(PaymentCard): refactor payment card to ts #3625

AadneRo commented May 29, 2024 •

edited

Loading

vercel bot commented May 29, 2024 •

edited

Loading

langz left a comment

codesandbox-ci bot commented Jun 13, 2024 •

edited

Loading

AadneRo Jun 14, 2024

tujoworker left a comment

langz Jun 14, 2024 •

edited

Loading

langz Jun 14, 2024

langz commented Jun 14, 2024

langz Jun 14, 2024

AadneRo commented Jun 14, 2024

	doc: 'used by the screan reader.',
	doc: 'used by the screen reader.',

chore(PaymentCard): refactor payment card to ts #3625

Are you sure you want to change the base?

chore(PaymentCard): refactor payment card to ts #3625

Conversation

AadneRo commented May 29, 2024 • edited Loading

vercel bot commented May 29, 2024 • edited Loading

langz left a comment

Choose a reason for hiding this comment

codesandbox-ci bot commented Jun 13, 2024 • edited Loading

AadneRo Jun 14, 2024

Choose a reason for hiding this comment

tujoworker left a comment

Choose a reason for hiding this comment

langz Jun 14, 2024 • edited Loading

Choose a reason for hiding this comment

langz Jun 14, 2024

Choose a reason for hiding this comment

langz commented Jun 14, 2024

langz Jun 14, 2024

Choose a reason for hiding this comment

AadneRo commented Jun 14, 2024

AadneRo commented May 29, 2024 •

edited

Loading

vercel bot commented May 29, 2024 •

edited

Loading

codesandbox-ci bot commented Jun 13, 2024 •

edited

Loading

langz Jun 14, 2024 •

edited

Loading