chart-view, styles and tests

component/charts/chart-styles.ts

@@ -0,0 +1,16 @@
+import { StyleSheet } from 'react-native';
+
+import { colors, shadows } from '../../styles';
+
+export const graphStyles = StyleSheet.create({
+  container: {
+    backgroundColor: colors.panelWhite,
+    borderColor: 'black',
+    borderRadius: 5,
+    marginVertical: 10,
+    marginHorizontal: 15,
+    paddingTop: 15,
+    paddingHorizontal: 15,
+    ...shadows.standard
+  },
+});

component/charts/chart-view.tsx

@@ -0,0 +1,17 @@
+import React from 'react';
+import { StyleProp, View, ViewStyle } from 'react-native';
+
+import { graphStyles } from './chart-styles';
+
+interface ChartViewProps {
+  style?: StyleProp<ViewStyle>;
+  children: React.ReactNode;
+  testID?: string;
+}
+
+// ChartView functional component with margin props
+const ChartView: React.FC<ChartViewProps> = ({ children, style, testID }) => {
+  return <View style={[graphStyles.container, style]} testID={testID} >{children}</View>;
+};
+
+export default ChartView;