omnipay-savings-sdk
Version:
Omnipay Savings SDK
100 lines (99 loc) • 4.71 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.getBackgroundColor = exports.getTextColor = void 0;
const jsx_runtime_1 = require("react/jsx-runtime");
const react_native_1 = require("react-native");
const utils_1 = require("../../utils");
const Button_1 = require("../Button");
const Text_1 = require("../Text");
const SmartImage_1 = require("../Images/SmartImage");
const getTextColor = (status) => {
switch (status) {
case 'Debit':
return utils_1.Colors.debitRed;
case 'Credit':
return utils_1.Colors.creditGreen;
}
};
exports.getTextColor = getTextColor;
const getBackgroundColor = (status) => {
switch (status) {
case 'Debit':
return utils_1.Colors.debitRedBackground;
case 'Credit':
return utils_1.Colors.creditGreenBackground;
}
};
exports.getBackgroundColor = getBackgroundColor;
const showIcon = (status) => {
switch (status) {
case 'Debit':
return ((0, jsx_runtime_1.jsx)(SmartImage_1.SmartImage, { source: utils_1.Images.debit, style: {
width: (0, utils_1.ms)(18),
height: (0, utils_1.ms)(18),
} }));
case 'Credit':
return ((0, jsx_runtime_1.jsx)(SmartImage_1.SmartImage, { source: utils_1.Images.credit, style: {
width: (0, utils_1.ms)(18),
height: (0, utils_1.ms)(18),
} }));
default:
break;
}
};
const TransactionIcon = ({ status }) => {
return ((0, jsx_runtime_1.jsx)(react_native_1.View, Object.assign({ style: [
styles.iconContainer,
{
backgroundColor: (0, exports.getBackgroundColor)(status),
},
] }, { children: showIcon(status) })));
};
const TransactionCard = ({ status, title, transactionType, showTransactionType, amount, onPress, createdDate, bottomSpacing = 12.5, }) => {
return ((0, jsx_runtime_1.jsxs)(Button_1.CustomPressable, Object.assign({ style: [
utils_1.globalStyles.rowBetween,
{
marginTop: (0, utils_1.hp)(12.5),
marginBottom: (0, utils_1.ms)(bottomSpacing),
height: (0, utils_1.fontSz)(45),
alignItems: 'center',
},
], onPress: onPress }, { children: [(0, jsx_runtime_1.jsxs)(react_native_1.View, Object.assign({ style: [
utils_1.globalStyles.rowStart,
{
flex: 1,
height: '100%',
alignItems: 'center',
},
] }, { children: [(0, jsx_runtime_1.jsx)(TransactionIcon, { status: status }), (0, jsx_runtime_1.jsxs)(react_native_1.View, Object.assign({ style: [
utils_1.globalStyles.colBetween,
{
flex: 1,
},
] }, { children: [(0, jsx_runtime_1.jsx)(Text_1.Text, { numberOfLines: 1, fontWeight: "400", style: {
color: utils_1.Colors.transactionCardHeader,
paddingBottom: (0, utils_1.ms)(6),
}, fontSize: (0, utils_1.fontSz)(12), text: title !== null && title !== void 0 ? title : '' }), (0, jsx_runtime_1.jsx)(Text_1.Text, { fontWeight: "400", style: {
color: utils_1.Colors.transactionCardTime,
}, fontSize: (0, utils_1.fontSz)(11), text: (0, utils_1.formatDate)(createdDate) })] }))] })), (0, jsx_runtime_1.jsx)(react_native_1.View, Object.assign({ style: [utils_1.globalStyles.colBetween, { alignItems: 'flex-end' }] }, { children: (0, jsx_runtime_1.jsx)(Text_1.Text, { style: {
color: (0, exports.getTextColor)(status),
}, fontWeight: "400", fontSize: (0, utils_1.fontSz)(14), text: (0, utils_1.formatAsCurrency)(amount) }) }))] })));
};
exports.default = TransactionCard;
const styles = react_native_1.StyleSheet.create({
iconContainer: {
justifyContent: 'center',
alignItems: 'center',
width: (0, utils_1.fontSz)(45),
height: (0, utils_1.fontSz)(45),
borderRadius: (0, utils_1.fontSz)(45 / 2),
marginRight: (0, utils_1.fontSz)(12.5),
},
transactionTypeContainer: {
alignSelf: 'flex-start',
paddingHorizontal: (0, utils_1.fontSz)(8),
paddingVertical: (0, utils_1.fontSz)(5),
borderRadius: (0, utils_1.fontSz)(4),
backgroundColor: utils_1.Colors.transactionCardTypeBackground,
},
});