Merged in SW-3396-move-my-saved-cards-to-design-system (pull request #2762)

SW-3396 move my saved cards to design system

* Move PaymentOption, PaymentOptionsGroup, PaymentIcons and MySavedCards (renamed SelectPaymentMethod) to design-system

* Remove unused svg payment icons

* cleanu

* cleanup

* trackUpdatePaymentMethod: remove hotelId argument that was never passed


Approved-by: Anton Gunnarsson

packages/design-system/lib/components/Payment/PaymentMethodIcon.tsx

@@ -0,0 +1,61 @@
+import { PaymentMethodEnum } from '@scandic-hotels/common/constants/paymentMethod'
+import { GenericCardIcon } from './Icons/GenericCardIcon'
+import { SwishIcon } from './Icons/SwishIcon'
+import { VippsIcon } from './Icons/VippsIcon'
+import { MobilePayIcon } from './Icons/MobilePayIcon'
+import { ApplePayIcon } from './Icons/ApplePayIcon'
+import { GooglePayIcon } from './Icons/GooglePayIcon'
+import { PayPalIcon } from './Icons/PayPalIcon'
+import { KlarnaIcon } from './Icons/KlarnaIcon'
+import { AmericanExpressIcon } from './Icons/AmericanExpressIcon'
+import { DanKortIcon } from './Icons/DanKortIcon'
+import { DinersClubIcon } from './Icons/DinersClubIcon'
+import { JcbIcon } from './Icons/JcbIcon'
+import { MasterCardIcon } from './Icons/MasterCardIcon'
+import { VisaIcon } from './Icons/VisaIcon'
+import { MaestroIcon } from './Icons/MaestroIcon'
+import { ChinaUnionPayIcon } from './Icons/ChinaUnionPayIcon'
+import { DiscoverIcon } from './Icons/DiscoverIcon'
+import { PaymentIconProps } from './Icons/IconProps'
+
+const paymentMethods: Partial<
+  Record<
+    keyof typeof PaymentMethodEnum,
+    (props: PaymentIconProps) => React.ReactNode
+  >
+> = {
+  swish: (props) => <SwishIcon {...props} />,
+  vipps: (props) => <VippsIcon {...props} />,
+  mobilePay: (props) => <MobilePayIcon {...props} />,
+  applePay: (props) => <ApplePayIcon {...props} />,
+  googlePay: (props) => <GooglePayIcon {...props} />,
+  payPal: (props) => <PayPalIcon {...props} />,
+  klarna: (props) => <KlarnaIcon {...props} />,
+  americanExpress: (props) => <AmericanExpressIcon {...props} />,
+  dankort: (props) => <DanKortIcon {...props} />,
+  dinersClub: (props) => <DinersClubIcon {...props} />,
+  jcb: (props) => <JcbIcon {...props} />,
+  masterCard: (props) => <MasterCardIcon {...props} />,
+  visa: (props) => <VisaIcon {...props} />,
+  maestro: (props) => <MaestroIcon {...props} />,
+  chinaUnionPay: (props) => <ChinaUnionPayIcon {...props} />,
+  discover: (props) => <DiscoverIcon {...props} />,
+}
+
+type PaymentMethodIconProps = {
+  paymentMethod: PaymentMethodEnum
+  className?: string
+  alt?: string
+}
+export const PaymentMethodIcon = ({
+  paymentMethod,
+  ...props
+}: PaymentMethodIconProps) => {
+  const Icon = paymentMethods[paymentMethod]
+
+  if (!Icon) {
+    return <GenericCardIcon {...props} role="img" />
+  }
+
+  return <Icon {...props} role="img" />
+}