remove <ThemeContainer/>

[noumantahir]

remove usages of <ThemeContainer/> in favour of ThemeContainer redux's state.application.isDarkTheme

Example

There is component being used in about 17 files, it can safely be replace with redux property specially in functional components without any issues.

import React from 'react';
import { View } from 'react-native';

import LottieView from 'lottie-react-native';
import { ThemeContainer } from '../../../../containers'; //TO BE REMOVED

import styles from './listItemPlaceHolderStyles';

const CommentPlaceHolderView = () => {
  const animationStyle = {
    width: 300,
    height: 72,
  };

  return (
    <ThemeContainer> //TO BE REMOVED
      {({ isDarkTheme }) => { //TO BE REMOVED
        const color = isDarkTheme ? '#2e3d51' : '#f5f5f5'; //TO BE PORTED
        return ( //TO BE REMOVED
          <View style={styles.container}>
            <LottieView
              style={animationStyle}
              source={require('../../../../assets/animations/commentBody.json')}
              autoPlay
              loop={true}
              autoSize={true}
              resizeMode="cover"
              colorFilters={[
                {
                  keypath: 'comments',
                  color,
                },
              ]}
            />
          </View>
        ); //TO BE REMOVED
      }} //TO BE REMOVED
    </ThemeContainer> //TO BE REMOVED
  );
};

export default CommentPlaceHolderView;

For instance in functional component above, the updated code will look like this...

import React from 'react';
import { View } from 'react-native';

import LottieView from 'lottie-react-native';

import styles from './listItemPlaceHolderStyles';
import { useSelector } from 'react-redux'; //NEW LINE ADDED

const CommentPlaceHolderView = () => {

  const isDarkTheme = useSelector(state => state.application.isDarkTheme) //NEW LINE ADDED
  const color = isDarkTheme ? '#2e3d51' : '#f5f5f5'; //PORTED FROM OLD CODE

  const animationStyle = {
    width: 300,
    height: 72,
  };

  return (
    <View style={styles.container}>
      <LottieView
        style={animationStyle}
        source={require('../../../../assets/animations/commentBody.json')}
        autoPlay
        loop={true}
        autoSize={true}
        resizeMode="cover"
        colorFilters={[
          {
            keypath: 'comments',
            color,
          },
        ]}
      />
    </View>
  );
};

export default CommentPlaceHolderView;