import { Attribute, BrandingOverlayType } from '@bifold/oca/build/legacy';
import { useNavigation } from '@react-navigation/native';
import startCase from 'lodash.startcase';
import React, { useCallback, useEffect, useMemo, useState } from 'react';
import { useTranslation } from 'react-i18next';
import { FlatList, Image, ImageBackground, Linking, View, TouchableOpacity } from 'react-native';
import Icon from 'react-native-vector-icons/MaterialIcons';
import { TOKENS, useServices } from '../../container-api';
import { useTheme } from '../../contexts/theme';
import { credentialTextColor, getCredentialIdentifiers, toImageSource, getEffectiveCredentialName } from '../../utils/credential';
import { formatIfDate, getAttributeFormats, getSecondaryBackgroundColor, isDataUrl, pTypeToText, useCredentialConnectionLabel } from '../../utils/helpers';
import { shadeIsLightOrDark, Shade } from '../../utils/luminance';
import { testIdWithKey } from '../../utils/testable';
import CardWatermark from './CardWatermark';
import CredentialActionFooter from './CredentialCard11ActionFooter';
import CredentialCard11Logo from './CredentialCard11Logo';
import useCredentialCardStyles from '../../hooks/credential-card-styles';
import CredentialIssuerBody from './CredentialCard11Issuer';
import { ThemedText } from '../texts/ThemedText';
import { CredentialErrors } from '../../types/credentials';
/*
  A card is defined as a nx8 (height/rows x width/columns) grid.
  | 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 |
  | 2 |   |   |   |   |   |   |   |
  | 3 |   |   |   |   |   |   |   |
  | 4 |   |   |   |   |   |   |   |
  ...

  The card width is the full screen width.

  Secondary Body (1):
  Primary Body   (2): Small Logo (1x1) -> L (shifted left by 50%)
                      Issuer Name (1x6)
                      Credential Name (1x6)
                      Primary Attribute 1 (1x6)
                      Primary Attribute 2 (1x6)
  Status         (3): Icon (1x1) -> S

   (1)            (2)           (3)
  | L | Issuer Name            | S |
  |   | Credential Name        |   |
  |   |                        |   |
  |   | Primary Attribute 1    |   |
  |   | Primary Attribute 2    |   |
  ...

  Note: The small logo MUST be provided as 1x1 (height/width) ratio.
 */

const CredentialCard11 = ({
  credential,
  style = {},
  displayItems,
  onPress = undefined,
  elevated = false,
  credName,
  credDefId,
  schemaId,
  proof,
  hasAltCredentials,
  credentialErrors = [],
  handleAltCredChange,
  brandingOverlay,
  hideSlice = false,
  extraOverlayParameter,
  brandingOverlayType = BrandingOverlayType.Branding10
}) => {
  var _overlay$metaOverlay13, _overlay$metaOverlay14;
  const [dimensions, setDimensions] = useState({
    cardWidth: 0,
    cardHeight: 0
  });
  const {
    i18n,
    t
  } = useTranslation();
  const {
    ColorPalette,
    ListItems,
    Assets
  } = useTheme();
  const [flaggedAttributes, setFlaggedAttributes] = useState();
  const [allPI, setAllPI] = useState();
  const credentialConnectionLabel = useCredentialConnectionLabel(credential);
  const [bundleResolver, credHelpActionOverrides] = useServices([TOKENS.UTIL_OCA_RESOLVER, TOKENS.CRED_HELP_ACTION_OVERRIDES]);
  const isBranding11 = brandingOverlayType === BrandingOverlayType.Branding11;
  const [helpAction, setHelpAction] = useState();
  const [overlay, setOverlay] = useState({});
  const {
    styles,
    borderRadius,
    logoHeight
  } = useCredentialCardStyles(overlay, brandingOverlayType, proof);
  const attributeFormats = useMemo(() => getAttributeFormats(overlay.bundle), [overlay.bundle]);
  const logoText = useMemo(() => {
    var _overlay$metaOverlay4, _overlay$metaOverlay5;
    if (isBranding11) {
      var _overlay$metaOverlay, _overlay$metaOverlay2, _overlay$metaOverlay3;
      return (_overlay$metaOverlay = overlay.metaOverlay) !== null && _overlay$metaOverlay !== void 0 && _overlay$metaOverlay.issuer && ((_overlay$metaOverlay2 = overlay.metaOverlay) === null || _overlay$metaOverlay2 === void 0 ? void 0 : _overlay$metaOverlay2.issuer) !== 'Unknown Contact' ? (_overlay$metaOverlay3 = overlay.metaOverlay) === null || _overlay$metaOverlay3 === void 0 ? void 0 : _overlay$metaOverlay3.issuer : t('Contacts.UnknownContact');
    }
    return ((_overlay$metaOverlay4 = overlay.metaOverlay) === null || _overlay$metaOverlay4 === void 0 ? void 0 : _overlay$metaOverlay4.name) ?? ((_overlay$metaOverlay5 = overlay.metaOverlay) === null || _overlay$metaOverlay5 === void 0 ? void 0 : _overlay$metaOverlay5.issuer) ?? 'C';
  }, [overlay, isBranding11, t]);
  const cardData = useMemo(() => {
    var _overlay$presentation, _overlay$presentation2;
    const fields = displayItems ?? [];
    const primaryField = overlay === null || overlay === void 0 || (_overlay$presentation = overlay.presentationFields) === null || _overlay$presentation === void 0 ? void 0 : _overlay$presentation.find(field => {
      var _overlay$brandingOver;
      return field.name === (overlay === null || overlay === void 0 || (_overlay$brandingOver = overlay.brandingOverlay) === null || _overlay$brandingOver === void 0 ? void 0 : _overlay$brandingOver.primaryAttribute);
    });
    const secondaryField = overlay === null || overlay === void 0 || (_overlay$presentation2 = overlay.presentationFields) === null || _overlay$presentation2 === void 0 ? void 0 : _overlay$presentation2.find(field => {
      var _overlay$brandingOver2;
      return field.name === (overlay === null || overlay === void 0 || (_overlay$brandingOver2 = overlay.brandingOverlay) === null || _overlay$brandingOver2 === void 0 ? void 0 : _overlay$brandingOver2.secondaryAttribute);
    });
    primaryField && fields.push(primaryField);
    secondaryField && fields.push(secondaryField);
    return fields;
  }, [displayItems, overlay]);
  const navigation = useNavigation();
  const fontColorWithHighContrast = () => {
    var _overlay$brandingOver3;
    if (proof && brandingOverlayType === BrandingOverlayType.Branding10) {
      return ColorPalette.grayscale.mediumGrey;
    }
    const c = ((_overlay$brandingOver3 = overlay.brandingOverlay) === null || _overlay$brandingOver3 === void 0 ? void 0 : _overlay$brandingOver3.primaryBackgroundColor) ?? ColorPalette.grayscale.lightGrey;
    const shade = shadeIsLightOrDark(c);
    return shade == Shade.Light ? ColorPalette.grayscale.darkGrey : ColorPalette.grayscale.lightGrey;
  };
  const parseAttribute = useCallback(item => {
    var _parsedItem, _parsedItem2, _parsedItem3;
    let parsedItem = item;
    if (item && item.pValue != null) {
      var _overlay$bundle;
      parsedItem = pTypeToText(item, t, (_overlay$bundle = overlay.bundle) === null || _overlay$bundle === void 0 ? void 0 : _overlay$bundle.captureBase.attributes);
    }
    const parsedValue = formatIfDate(attributeFormats === null || attributeFormats === void 0 ? void 0 : attributeFormats[item.name ?? ''], ((_parsedItem = parsedItem) === null || _parsedItem === void 0 ? void 0 : _parsedItem.value) ?? ((_parsedItem2 = parsedItem) === null || _parsedItem2 === void 0 ? void 0 : _parsedItem2.pValue) ?? null);
    return {
      label: item.label ?? item.name ?? '',
      value: item.value !== undefined && item.value != null ? parsedValue : `${(_parsedItem3 = parsedItem) === null || _parsedItem3 === void 0 ? void 0 : _parsedItem3.pType} ${parsedValue}`
    };
  }, [t, overlay, attributeFormats]);
  useEffect(() => {
    setAllPI(credential && cardData.every(item => {
      if (item === undefined) {
        return true;
      } else if (item instanceof Attribute) {
        const {
          label
        } = parseAttribute(item);
        return flaggedAttributes === null || flaggedAttributes === void 0 ? void 0 : flaggedAttributes.includes(label);
      } else {
        // Predicates are not PII
        return false;
      }
    }));
  }, [credential, cardData, parseAttribute, flaggedAttributes]);
  useEffect(() => {
    if (brandingOverlay) {
      setOverlay(brandingOverlay);
      return;
    }
    const params = {
      identifiers: credential ? getCredentialIdentifiers(credential) : {
        schemaId,
        credentialDefinitionId: credDefId
      },
      attributes: proof ? [] : credential === null || credential === void 0 ? void 0 : credential.credentialAttributes,
      meta: {
        credName,
        credConnectionId: credential === null || credential === void 0 ? void 0 : credential.connectionId,
        alias: credentialConnectionLabel
      },
      language: i18n.language
    };
    bundleResolver.resolveAllBundles(params).then(bundle => {
      if (proof) {
        var _resolvedBundle$captu, _overlayBundle$metada, _Object$values;
        const resolvedBundle = bundle === null || bundle === void 0 ? void 0 : bundle.bundle;
        const overlayBundle = (resolvedBundle === null || resolvedBundle === void 0 ? void 0 : resolvedBundle.bundle) ?? resolvedBundle;
        const flagged = (overlayBundle === null || overlayBundle === void 0 ? void 0 : overlayBundle.flaggedAttributes) ?? (resolvedBundle === null || resolvedBundle === void 0 || (_resolvedBundle$captu = resolvedBundle.captureBase) === null || _resolvedBundle$captu === void 0 ? void 0 : _resolvedBundle$captu.flaggedAttributes);
        const flaggedNames = Array.isArray(flagged) && flagged.every(item => typeof item === 'string') ? flagged : Array.isArray(flagged) ? flagged.map(attr => attr === null || attr === void 0 ? void 0 : attr.name).filter(Boolean) : [];
        setFlaggedAttributes(flaggedNames);
        const issuerUrls = overlayBundle === null || overlayBundle === void 0 || (_overlayBundle$metada = overlayBundle.metadata) === null || _overlayBundle$metada === void 0 ? void 0 : _overlayBundle$metada.issuerUrl;
        const issuerUrl = (issuerUrls === null || issuerUrls === void 0 ? void 0 : issuerUrls[params.language]) ?? ((_Object$values = Object.values(issuerUrls ?? {})) === null || _Object$values === void 0 ? void 0 : _Object$values[0]);

        // Check if there is a help action override for this credential
        const override = credHelpActionOverrides === null || credHelpActionOverrides === void 0 ? void 0 : credHelpActionOverrides.find(override => credDefId && override.credDefIds.includes(credDefId) || schemaId && override.schemaIds.includes(schemaId));
        if (override) {
          setHelpAction(() => () => {
            override.action(navigation);
          });
        } else if (issuerUrl) {
          setHelpAction(() => () => {
            Linking.openURL(issuerUrl);
          });
        }
      }
      setOverlay(o => {
        var _bundle$metaOverlay, _bundle$metaOverlay2;
        return {
          ...o,
          ...bundle,
          brandingOverlay: bundle.brandingOverlay,
          // Apply effective name
          ...(bundle.metaOverlay && {
            metaOverlay: {
              ...bundle.metaOverlay,
              name: credential ? getEffectiveCredentialName(credential, (_bundle$metaOverlay = bundle.metaOverlay) === null || _bundle$metaOverlay === void 0 ? void 0 : _bundle$metaOverlay.name) : (_bundle$metaOverlay2 = bundle.metaOverlay) === null || _bundle$metaOverlay2 === void 0 ? void 0 : _bundle$metaOverlay2.name
            }
          })
        };
      });
    });
  }, [credential, schemaId, credDefId, credName, credentialConnectionLabel, i18n.language, bundleResolver, proof, credHelpActionOverrides, navigation, brandingOverlay]);
  const AttributeLabel = ({
    label
  }) => {
    var _overlay$bundle2;
    const ylabel = ((_overlay$bundle2 = overlay.bundle) === null || _overlay$bundle2 === void 0 || (_overlay$bundle2 = _overlay$bundle2.labelOverlay) === null || _overlay$bundle2 === void 0 ? void 0 : _overlay$bundle2.attributeLabels[label]) ?? startCase(label);
    return /*#__PURE__*/React.createElement(ThemedText, {
      variant: "labelSubtitle",
      style: [styles.textContainer, {
        lineHeight: 19,
        opacity: 0.8
      }],
      testID: testIdWithKey('AttributeName')
    }, ylabel);
  };
  const AttributeErrorLabel = ({
    errorMessage
  }) => {
    return /*#__PURE__*/React.createElement(View, {
      style: {
        flexDirection: 'row',
        alignItems: 'center'
      }
    }, /*#__PURE__*/React.createElement(Icon, {
      testID: testIdWithKey('AttributeErrorIcon'),
      style: {
        paddingTop: 2,
        paddingHorizontal: 2
      },
      name: "close",
      color: ListItems.proofError.color,
      size: ListItems.recordAttributeText.fontSize
    }), /*#__PURE__*/React.createElement(ThemedText, {
      variant: "labelSubtitle",
      testID: testIdWithKey('AttributeErrorText'),
      style: [styles.textContainer, {
        lineHeight: 19,
        opacity: 0.8,
        color: ListItems.proofError.color
      }]
    }, errorMessage));
  };
  const AttributeValue = ({
    value,
    warn
  }) => {
    return /*#__PURE__*/React.createElement(React.Fragment, null, isDataUrl(value) ? /*#__PURE__*/React.createElement(Image, {
      style: styles.imageAttr,
      source: {
        uri: value
      }
    }) : /*#__PURE__*/React.createElement(ThemedText, {
      variant: "bold",
      style: [styles.textContainer, {
        color: warn ? ColorPalette.notification.warnText : styles.textContainer.color
      }],
      testID: testIdWithKey('AttributeValue')
    }, value));
  };
  const renderCardAttribute = item => {
    var _overlay$bundle3;
    const {
      label,
      value
    } = parseAttribute(item);
    const parsedValue = formatIfDate(item.format, value) ?? '';
    return /*#__PURE__*/React.createElement(View, {
      style: styles.cardAttributeContainer
    }, /*#__PURE__*/React.createElement(View, {
      style: {
        flexDirection: 'row',
        alignItems: 'center'
      }
    }, credentialErrors.includes(CredentialErrors.NotInWallet) && /*#__PURE__*/React.createElement(Icon, {
      testID: testIdWithKey('AttributeNameErrorIcon'),
      style: {
        paddingTop: 2,
        paddingHorizontal: 2
      },
      name: "close",
      color: ListItems.proofError.color,
      size: ListItems.recordAttributeText.fontSize
    }), /*#__PURE__*/React.createElement(AttributeLabel, {
      label: label
    })), !credentialErrors.includes(CredentialErrors.NotInWallet) && !item.hasError && /*#__PURE__*/React.createElement(View, {
      style: {
        flexDirection: 'row',
        alignItems: 'center'
      }
    }, (flaggedAttributes === null || flaggedAttributes === void 0 ? void 0 : flaggedAttributes.includes(label)) && !item.pValue && proof && /*#__PURE__*/React.createElement(Icon, {
      testID: testIdWithKey('AttributeNameWarningIcon'),
      style: {
        paddingTop: 2,
        paddingHorizontal: 2
      },
      name: "warning",
      color: ColorPalette.notification.warnIcon,
      size: ListItems.recordAttributeText.fontSize
    }), /*#__PURE__*/React.createElement(AttributeValue, {
      warn: (flaggedAttributes === null || flaggedAttributes === void 0 ? void 0 : flaggedAttributes.includes(label)) && !item.pValue && proof,
      value: parsedValue
    })), !credentialErrors.includes(CredentialErrors.NotInWallet) && item.hasError && /*#__PURE__*/React.createElement(AttributeErrorLabel, {
      errorMessage: t('ProofRequest.MissingAttribute', {
        name: ((_overlay$bundle3 = overlay.bundle) === null || _overlay$bundle3 === void 0 || (_overlay$bundle3 = _overlay$bundle3.labelOverlay) === null || _overlay$bundle3 === void 0 ? void 0 : _overlay$bundle3.attributeLabels[label]) ?? startCase(label)
      })
    }), !credentialErrors.includes(CredentialErrors.NotInWallet) && item.satisfied != undefined && item.satisfied === false && /*#__PURE__*/React.createElement(AttributeErrorLabel, {
      errorMessage: t('ProofRequest.PredicateNotSatisfied')
    }));
  };
  const CredentialCardPrimaryBodyFooter = () => {
    if (hasAltCredentials && handleAltCredChange) {
      var _overlay$brandingOver4;
      return /*#__PURE__*/React.createElement(CredentialActionFooter, {
        onPress: handleAltCredChange,
        text: t('ProofRequest.ChangeCredential'),
        testID: 'ChangeCredential',
        textColor: isBranding11 ? credentialTextColor(ColorPalette, (_overlay$brandingOver4 = overlay.brandingOverlay) === null || _overlay$brandingOver4 === void 0 ? void 0 : _overlay$brandingOver4.primaryBackgroundColor) : undefined
      });
    }
    if (Boolean(credentialErrors.length) && helpAction) {
      var _overlay$brandingOver5;
      return /*#__PURE__*/React.createElement(CredentialActionFooter, {
        onPress: helpAction,
        text: t('ProofRequest.GetThisCredential'),
        testID: 'GetThisCredential',
        textColor: isBranding11 ? credentialTextColor(ColorPalette, (_overlay$brandingOver5 = overlay.brandingOverlay) === null || _overlay$brandingOver5 === void 0 ? void 0 : _overlay$brandingOver5.primaryBackgroundColor) : undefined
      });
    }
    return /*#__PURE__*/React.createElement(React.Fragment, null);
  };
  const CredentialCardPrimaryBody = () => {
    var _overlay$metaOverlay6, _overlay$metaOverlay7, _overlay$metaOverlay8;
    return /*#__PURE__*/React.createElement(View, {
      testID: testIdWithKey('CredentialCardPrimaryBody'),
      style: styles.primaryBodyContainer
    }, brandingOverlayType === BrandingOverlayType.Branding10 && /*#__PURE__*/React.createElement(CredentialIssuerBody, {
      overlay: overlay,
      overlayType: brandingOverlayType,
      proof: proof,
      hasBody: !(((_overlay$metaOverlay6 = overlay.metaOverlay) === null || _overlay$metaOverlay6 === void 0 ? void 0 : _overlay$metaOverlay6.issuer) === 'Unknown Contact' && proof)
    }), /*#__PURE__*/React.createElement(View, {
      style: styles.primaryBodyNameContainer
    }, /*#__PURE__*/React.createElement(ThemedText, {
      variant: "bold",
      testID: testIdWithKey('CredentialName'),
      style: [styles.textContainer, styles.credentialName, {
        color: allPI && proof ? ColorPalette.notification.warnText : styles.textContainer.color
      }]
    }, (_overlay$metaOverlay7 = overlay.metaOverlay) === null || _overlay$metaOverlay7 === void 0 ? void 0 : _overlay$metaOverlay7.name)), extraOverlayParameter && !displayItems && /*#__PURE__*/React.createElement(View, {
      style: {
        flex: 1,
        justifyContent: 'flex-end'
      }
    }, /*#__PURE__*/React.createElement(ThemedText, {
      variant: "caption",
      style: {
        color: styles.textContainer.color
      }
    }, extraOverlayParameter.label ?? startCase(extraOverlayParameter.name || ''), ":", ' ', extraOverlayParameter.value)), /*#__PURE__*/React.createElement(View, {
      style: {
        flexDirection: 'row',
        alignItems: 'center'
      }
    }, credentialErrors.includes(CredentialErrors.Revoked) && Boolean(proof) && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Assets.svg.credentialRevoked, {
      height: 30,
      width: 30
    }), /*#__PURE__*/React.createElement(ThemedText, {
      style: styles.errorText,
      testID: testIdWithKey('RevokedOrNotAvailable'),
      numberOfLines: 1
    }, t('CredentialDetails.Revoked'))), credentialErrors.includes(CredentialErrors.NotInWallet) && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Assets.svg.credentialNotAvailable, {
      height: 30,
      width: 30
    }), /*#__PURE__*/React.createElement(ThemedText, {
      style: styles.errorText,
      testID: testIdWithKey('RevokedOrNotAvailable')
    }, t('ProofRequest.NotAvailableInYourWallet')))), /*#__PURE__*/React.createElement(FlatList, {
      data: cardData,
      scrollEnabled: false,
      initialNumToRender: cardData === null || cardData === void 0 ? void 0 : cardData.length,
      renderItem: ({
        item
      }) => {
        return renderCardAttribute(item);
      },
      ListFooterComponent: /*#__PURE__*/React.createElement(React.Fragment, null, brandingOverlayType === BrandingOverlayType.Branding11 && /*#__PURE__*/React.createElement(CredentialIssuerBody, {
        overlay: overlay,
        overlayType: brandingOverlayType,
        proof: proof,
        hasBody: !(((_overlay$metaOverlay8 = overlay.metaOverlay) === null || _overlay$metaOverlay8 === void 0 ? void 0 : _overlay$metaOverlay8.issuer) === 'Unknown Contact' && proof)
      }), /*#__PURE__*/React.createElement(CredentialCardPrimaryBodyFooter, null))
    }));
  };

  /**
   * Returns the background color for the slice of the card.
   *
   * @return {ColorValue} - The background color for the slice.
   */
  function getSliceBackgroundColor() {
    var _overlay$brandingOver6;
    if ((_overlay$brandingOver6 = overlay.brandingOverlay) !== null && _overlay$brandingOver6 !== void 0 && _overlay$brandingOver6.secondaryBackgroundColor) {
      return overlay.brandingOverlay.secondaryBackgroundColor;
    }
    if (styles.secondaryBodyContainer.backgroundColor) {
      return styles.secondaryBodyContainer.backgroundColor;
    }
    return 'transparent';
  }
  const CredentialCardSecondaryBody = () => {
    var _overlay$brandingOver7;
    // If the slice is hidden, we return an empty view with the same styles
    if (hideSlice) {
      return /*#__PURE__*/React.createElement(View, {
        testID: testIdWithKey('CredentialCardSecondaryBody'),
        style: [styles.secondaryBodyContainer, {
          backgroundColor: 'transparent',
          overflow: 'hidden'
        }]
      });
    }
    return /*#__PURE__*/React.createElement(View, {
      testID: testIdWithKey('CredentialCardSecondaryBody'),
      style: [styles.secondaryBodyContainer, {
        backgroundColor: getSliceBackgroundColor(),
        overflow: 'hidden'
      }]
    }, (_overlay$brandingOver7 = overlay.brandingOverlay) !== null && _overlay$brandingOver7 !== void 0 && _overlay$brandingOver7.backgroundImageSlice && (!displayItems || brandingOverlayType === BrandingOverlayType.Branding11) ? /*#__PURE__*/React.createElement(ImageBackground, {
      source: toImageSource(overlay.brandingOverlay.backgroundImageSlice),
      style: {
        flexGrow: 1
      },
      imageStyle: {
        borderTopLeftRadius: borderRadius,
        borderBottomLeftRadius: borderRadius
      }
    }) : !(proof || getSecondaryBackgroundColor(overlay, proof)) && /*#__PURE__*/React.createElement(View, {
      style: [{
        position: 'absolute',
        width: logoHeight,
        height: '100%',
        borderTopLeftRadius: borderRadius,
        borderBottomLeftRadius: borderRadius,
        backgroundColor: 'rgba(0,0,0,0.24)'
      }]
    }));
  };
  const CredentialCardStatus = ({
    status
  }) => {
    return /*#__PURE__*/React.createElement(View, {
      testID: testIdWithKey('CredentialCardStatus'),
      style: [styles.statusContainer, {
        position: 'absolute',
        right: 0,
        top: 0
      }]
    }, status ? /*#__PURE__*/React.createElement(View, {
      style: [styles.statusContainer, {
        backgroundColor: status === 'error' ? ColorPalette.notification.error : ColorPalette.notification.warn
      }]
    }, /*#__PURE__*/React.createElement(Icon, {
      size: 0.7 * logoHeight,
      style: {
        color: status === 'error' ? ColorPalette.semantic.error : ColorPalette.notification.warnIcon
      },
      name: status
    })) : /*#__PURE__*/React.createElement(View, {
      style: styles.statusContainer
    }));
  };
  const CredentialCard = ({
    status
  }) => {
    var _overlay$metaOverlay9, _overlay$metaOverlay0, _overlay$metaOverlay1, _overlay$metaOverlay10, _overlay$metaOverlay11, _overlay$metaOverlay12, _overlay$brandingOver8, _overlay$brandingOver9;
    const issuerAccessibilityLabel = (_overlay$metaOverlay9 = overlay.metaOverlay) !== null && _overlay$metaOverlay9 !== void 0 && _overlay$metaOverlay9.issuer ? `${t('Credentials.IssuedBy')} ${(_overlay$metaOverlay0 = overlay.metaOverlay) === null || _overlay$metaOverlay0 === void 0 ? void 0 : _overlay$metaOverlay0.issuer}` : '';
    const watermarkLabel = (_overlay$metaOverlay1 = overlay.metaOverlay) !== null && _overlay$metaOverlay1 !== void 0 && _overlay$metaOverlay1.watermark ? ((_overlay$metaOverlay10 = overlay.metaOverlay) === null || _overlay$metaOverlay10 === void 0 ? void 0 : _overlay$metaOverlay10.watermark) + ',' : '';
    const accessibilityLabel = isBranding11 ? `${watermarkLabel} ${((_overlay$metaOverlay11 = overlay.metaOverlay) === null || _overlay$metaOverlay11 === void 0 ? void 0 : _overlay$metaOverlay11.name) ?? ''} ${t('Credentials.Credential')}${cardData.length > 0 ? ',' : ''}` + cardData.map(item => {
      const {
        label,
        value
      } = parseAttribute(item);
      if (label && value) {
        return ` ${label}, ${value}`;
      }
    }) + `, ${issuerAccessibilityLabel}` : `${issuerAccessibilityLabel}, ${watermarkLabel} ${((_overlay$metaOverlay12 = overlay.metaOverlay) === null || _overlay$metaOverlay12 === void 0 ? void 0 : _overlay$metaOverlay12.name) ?? ''} ${t('Credentials.Credential')}.` + cardData.map(item => {
      const {
        label,
        value
      } = parseAttribute(item);
      if (label && value) {
        return ` ${label}, ${value}`;
      }
    });
    const MainCredentialBody = () => /*#__PURE__*/React.createElement(View, {
      style: styles.cardContainer,
      accessible: true,
      accessibilityLabel: accessibilityLabel
    }, /*#__PURE__*/React.createElement(CredentialCardSecondaryBody, null), /*#__PURE__*/React.createElement(CredentialCard11Logo, {
      noLogoText: logoText,
      overlay: overlay,
      elevated: elevated
    }), /*#__PURE__*/React.createElement(CredentialCardPrimaryBody, null), /*#__PURE__*/React.createElement(CredentialCardStatus, {
      status: status
    }));
    return /*#__PURE__*/React.createElement(React.Fragment, null, (_overlay$brandingOver8 = overlay.brandingOverlay) !== null && _overlay$brandingOver8 !== void 0 && _overlay$brandingOver8.backgroundImage && hideSlice ? /*#__PURE__*/React.createElement(ImageBackground, {
      source: toImageSource((_overlay$brandingOver9 = overlay.brandingOverlay) === null || _overlay$brandingOver9 === void 0 ? void 0 : _overlay$brandingOver9.backgroundImage)
    }, /*#__PURE__*/React.createElement(MainCredentialBody, null)) : /*#__PURE__*/React.createElement(MainCredentialBody, null));
  };
  const getCredentialStatus = () => {
    if (brandingOverlayType === BrandingOverlayType.Branding10) {
      if (credentialErrors.includes(CredentialErrors.Revoked) && !proof) {
        return 'error';
      } else if (allPI && proof) {
        return 'warning';
      }
      return undefined;
    }
    if (credentialErrors.includes(CredentialErrors.Revoked)) {
      return 'error';
    } else if (allPI && proof) {
      return 'warning';
    }
    return undefined;
  };
  return overlay.bundle ? /*#__PURE__*/React.createElement(View, {
    style: [styles.container, style, {
      elevation: elevated ? 5 : 0,
      overflow: elevated ? 'visible' : 'hidden'
    }, hasAltCredentials ? styles.selectedCred : undefined],
    onLayout: event => {
      setDimensions({
        cardHeight: event.nativeEvent.layout.height,
        cardWidth: event.nativeEvent.layout.width
      });
    }
  }, /*#__PURE__*/React.createElement(TouchableOpacity, {
    accessible: false,
    accessibilityLabel: typeof onPress === 'undefined' ? undefined : t('Credentials.CredentialDetails'),
    disabled: typeof onPress === 'undefined' ? true : false,
    onPress: onPress,
    style: [styles.container, style],
    testID: testIdWithKey('ShowCredentialDetails')
  }, /*#__PURE__*/React.createElement(View, {
    testID: testIdWithKey('CredentialCard'),
    style: {
      overflow: 'hidden'
    }
  }, ((_overlay$metaOverlay13 = overlay.metaOverlay) === null || _overlay$metaOverlay13 === void 0 ? void 0 : _overlay$metaOverlay13.watermark) && /*#__PURE__*/React.createElement(CardWatermark, {
    width: dimensions.cardWidth,
    height: dimensions.cardHeight,
    style: {
      color: fontColorWithHighContrast()
    },
    watermark: (_overlay$metaOverlay14 = overlay.metaOverlay) === null || _overlay$metaOverlay14 === void 0 ? void 0 : _overlay$metaOverlay14.watermark
  }), /*#__PURE__*/React.createElement(CredentialCard
  // if the credential is revoked and we are not in a proof context
  // display a small error icon in the top right of the credential card
  , {
    status: getCredentialStatus()
  })))) : null;
};
export default CredentialCard11;
//# sourceMappingURL=CredentialCard11.js.map