add subtitle

examples/client/Locomotion/src/Components/CardRow/index.tsx

@@ -114,8 +114,7 @@ const CardRow = (paymentMethod: any) => {
  if (isOfflinePaymentMethod(paymentMethod)) {
  return offlinePaymentText;
  }
- return paymentMethod.doNotCapitalizeName ? paymentMethod.name
- : capitalizeFirstLetter(paymentMethod.name);
+ return paymentMethod.name;
  };
 
  useEffect(() => {

examples/client/Locomotion/src/Components/RideCard/index.tsx

@@ -13,6 +13,7 @@ import {
 import StopPointsVerticalView from '../StopPointsVerticalView';
 import { getFormattedPrice, isPriceEstimated, convertTimezoneByLocation } from '../../context/newRideContext/utils';
 import cashIcon from '../../assets/cash.svg';
+import offlineIcon from '../../assets/offline.svg';
 import { PAYMENT_METHODS } from '../../pages/Payments/consts';
 import PaymentContext from '../../context/payments';
 import SettingsContext from '../../context/settings';
@@ -56,12 +57,13 @@ const CardComponent = ({ paymentMethod, businessAccountId }: CardComponentProps)
  return cashIcon;
  }
  if (isOffline) {
- return null;
+ return offlineIcon;
  }
  };
  return (
  <TextRowWithIcon
  text={getText() || ''}
+ subTitle={businessAccountId ? offlinePaymentText : ''}
  Image={() => !isCash && !isOffline && <PaymentIcon type={paymentMethod.brand} />}
  icon={getIcon()}
  style={{ marginTop: 10, marginBottom: 10 }}

examples/client/Locomotion/src/Components/TextRowWithIcon/index.tsx

@@ -1,6 +1,7 @@
 import React, { useContext } from 'react';
 import { Text, View } from 'react-native';
 import styled, { ThemeContext } from 'styled-components';
+import BusinessAccountText from '../BusinessAccountText';
 import { FONT_SIZES } from '../../context/theme';
 import SvgIcon from '../SvgIcon';
 
@@ -31,7 +32,7 @@ interface TextRowWithIconProps {
 }
 
 const TextRowWithIcon = ({
- text, icon, style, Image, iconWidth, iconHeight,
+ subTitle, text, icon, style, Image, iconWidth, iconHeight,
 }: TextRowWithIconProps) => {
  const theme = useContext(ThemeContext);
  const getImage = () => {
@@ -56,7 +57,13 @@ const TextRowWithIcon = ({
  ...((Image || icon) && { marginLeft: 10 }),
  }}
  >
- {text}
+ {subTitle ? (
+ <BusinessAccountText
+ title={text}
+ subTitle={subTitle}
+ />
+ )
+ : text}
  </BasicText>
  </Container>
  );

examples/client/Locomotion/src/pages/ActiveRide/RideDrawer/FutureRides/StopPointRow.js

@@ -1,7 +1,5 @@
 import React from 'react';
-import { View } from 'react-native';
 import styled from 'styled-components';
-import moment from 'moment';
 
 import i18n from '../../../../I18n';
 import Button from '../../../../Components/Button';