diff --git a/.babelrc b/.babelrc index 2bcd546d..7d30f8bf 100644 --- a/.babelrc +++ b/.babelrc @@ -1,8 +1,3 @@ { - "presets": ["babel-preset-expo"], - "env": { - "development": { - "plugins": ["transform-react-jsx-source"] - } - } + "presets": ["babel-preset-expo"] } diff --git a/.eslintrc.json b/.eslintrc.json new file mode 100644 index 00000000..5e603ecd --- /dev/null +++ b/.eslintrc.json @@ -0,0 +1,3 @@ +{ + "extends": "react-app" +} diff --git a/.gitignore b/.gitignore index 1025e17b..ae31869b 100644 --- a/.gitignore +++ b/.gitignore @@ -1,3 +1,8 @@ node_modules/ .expo/ +.DS_Store npm-debug.* +package-lock.json +.idea +.vscode +yarn.lock \ No newline at end of file diff --git a/.npmignore b/.npmignore index a3793247..6e2cdcf4 100644 --- a/.npmignore +++ b/.npmignore @@ -2,3 +2,4 @@ node_modules/ .expo/ npm-debug.* /promo +.babelrc diff --git a/.prettierrc b/.prettierrc new file mode 100644 index 00000000..9e26dfee --- /dev/null +++ b/.prettierrc @@ -0,0 +1 @@ +{} \ No newline at end of file diff --git a/App.js b/App.js index 464f9644..f835c519 100644 --- a/App.js +++ b/App.js @@ -1,106 +1,119 @@ -import React from 'react' -import { ScrollView, StatusBar, Dimensions, Text } from 'react-native' -import ScrollableTabView from 'react-native-scrollable-tab-view' -import LineChart from './src/line-chart' -import PieChart from './src/pie-chart' -import ProgressChart from './src/progress-chart' -import BarChart from './src/bar-chart' -import ContributionGraph from './src/contribution-graph' -import { data, contributionData, pieChartData, progressChartData } from './data' -import 'babel-polyfill' +import "babel-polyfill"; +import React from "react"; +import { ScrollView, StatusBar, Dimensions, Text } from "react-native"; +import ScrollableTabView from "react-native-scrollable-tab-view"; +import FlashMessage, { showMessage } from "react-native-flash-message"; +import LineChart from "./src/line-chart"; +import PieChart from "./src/pie-chart"; +import ProgressChart from "./src/progress-chart"; +import BarChart from "./src/bar-chart"; +import StackedBarChart from "./src/stackedbar-chart"; +import ContributionGraph from "./src/contribution-graph"; +import { + data, + contributionData, + pieChartData, + progressChartData, + stackedBarGraphData +} from "./data"; // in Expo - swipe left to see the following styling, or create your own const chartConfigs = [ { - backgroundColor: '#000000', - backgroundGradientFrom: '#1E2923', - backgroundGradientTo: '#08130D', + backgroundColor: "#000000", + backgroundGradientFrom: "#1E2923", + backgroundGradientTo: "#08130D", color: (opacity = 1) => `rgba(26, 255, 146, ${opacity})`, style: { borderRadius: 16 } }, { - backgroundColor: '#022173', - backgroundGradientFrom: '#022173', - backgroundGradientTo: '#1b3fa0', + backgroundColor: "#022173", + backgroundGradientFrom: "#022173", + backgroundGradientTo: "#1b3fa0", color: (opacity = 1) => `rgba(255, 255, 255, ${opacity})`, style: { borderRadius: 16 + }, + propsForBackgroundLines: { + strokeDasharray: "" // solid background lines with no dashes } }, { - backgroundColor: '#ffffff', - backgroundGradientFrom: '#ffffff', - backgroundGradientTo: '#ffffff', + backgroundColor: "#ffffff", + backgroundGradientFrom: "#ffffff", + backgroundGradientTo: "#ffffff", color: (opacity = 1) => `rgba(0, 0, 0, ${opacity})` }, { - backgroundColor: '#26872a', - backgroundGradientFrom: '#43a047', - backgroundGradientTo: '#66bb6a', + backgroundColor: "#26872a", + backgroundGradientFrom: "#43a047", + backgroundGradientTo: "#66bb6a", color: (opacity = 1) => `rgba(255, 255, 255, ${opacity})`, style: { borderRadius: 16 } }, { - backgroundColor: '#000000', - backgroundGradientFrom: '#000000', - backgroundGradientTo: '#000000', + backgroundColor: "#000000", + backgroundGradientFrom: "#000000", + backgroundGradientTo: "#000000", color: (opacity = 1) => `rgba(${255}, ${255}, ${255}, ${opacity})` - }, { - backgroundColor: '#0091EA', - backgroundGradientFrom: '#0091EA', - backgroundGradientTo: '#0091EA', + }, + { + backgroundColor: "#0091EA", + backgroundGradientFrom: "#0091EA", + backgroundGradientTo: "#0091EA", color: (opacity = 1) => `rgba(${255}, ${255}, ${255}, ${opacity})` }, { - backgroundColor: '#e26a00', - backgroundGradientFrom: '#fb8c00', - backgroundGradientTo: '#ffa726', + backgroundColor: "#e26a00", + backgroundGradientFrom: "#fb8c00", + backgroundGradientTo: "#ffa726", color: (opacity = 1) => `rgba(255, 255, 255, ${opacity})`, style: { borderRadius: 16 } }, { - backgroundColor: '#b90602', - backgroundGradientFrom: '#e53935', - backgroundGradientTo: '#ef5350', + backgroundColor: "#b90602", + backgroundGradientFrom: "#e53935", + backgroundGradientTo: "#ef5350", color: (opacity = 1) => `rgba(255, 255, 255, ${opacity})`, style: { borderRadius: 16 } }, { - backgroundColor: '#ff3e03', - backgroundGradientFrom: '#ff3e03', - backgroundGradientTo: '#ff3e03', + backgroundColor: "#ff3e03", + backgroundGradientFrom: "#ff3e03", + backgroundGradientTo: "#ff3e03", color: (opacity = 1) => `rgba(${0}, ${0}, ${0}, ${opacity})` } -] +]; export default class App extends React.Component { renderTabBar() { - return