v0.8.0

App.tsx

@@ -27,7 +27,7 @@ const supportedLanguages: string[] = [
   "pt",
   "pl",
   "zh",
-  "my",
+  "ms",
   "es",
 ];
 const defaultLanguage = "en";

app.example.json

@@ -4,7 +4,7 @@
     "slug": "not-my-fault-earth",
     "privacy": "public",
     "platforms": ["ios", "android"],
-    "version": "0.7.3",
+    "version": "0.8.0",
     "orientation": "portrait",
     "splash": {
       "image": "./assets/images/splash.png",
@@ -19,13 +19,13 @@
       "icon": "./assets/images/ios.icon.png",
       "bundleIdentifier": "nmf.earth",
       "supportsTablet": true,
-      "buildNumber": "31"
+      "buildNumber": "33"
     },
     "android": {
       "icon": "./assets/images/android.icon.png",
       "useNextNotificationsApi": true,
       "package": "nmf.earth",
-      "versionCode": 31
+      "versionCode": 33
     },
     "userInterfaceStyle": "automatic",
     "hooks": {

app/ducks/emissions/__tests__/emissions.selectors.test.ts

@@ -1,11 +1,11 @@
 import {
   FoodType,
+  MealType,
   TransportType,
   StreamingType,
-  ElectricityType,
-  FashionType,
   PurchaseType,
-  MealType,
+  FashionType,
+  ElectricityType,
 } from "carbon-footprint";
 
 import { Emission, EmissionType } from "interfaces";
@@ -92,6 +92,15 @@ const emissionMeal: Emission = {
   value: 20,
 };
 
+const emissionProductScanned: Emission = {
+  id: "9",
+  creationDate: "2020-01-29T11:04:55.334Z",
+  emissionModelType: "productScanned",
+  emissionType: EmissionType.productScanned,
+  isMitigated: false,
+  value: 100,
+};
+
 describe("if there are emissions", () => {
   beforeEach(() => {
     state = {
@@ -105,6 +114,7 @@ describe("if there are emissions", () => {
         emissionFashion,
         emissionPurchase,
         emissionMeal,
+        emissionProductScanned,
       ],
     };
   });
@@ -125,6 +135,7 @@ describe("if there are emissions", () => {
       emissionFashion,
       emissionPurchase,
       emissionMeal,
+      emissionProductScanned,
     ]));
 
   test("`getCustomEmissions` should return custom emissions", () =>
@@ -158,15 +169,8 @@ describe("if there are emissions", () => {
       emissionMeal,
     ]));
 
-  test("`getOtherEmissions` should return other emissions", () =>
-    expect(emissions.selectors.getOtherEmissions(state)).toEqual([
-      emissionCustom,
-      emissionStreaming,
-      emissionElectricity,
-      emissionFashion,
-      emissionPurchase,
-      emissionMeal,
-    ]));
+  test("`getProductScanned` should return product scanned emissions", () =>
+    expect(emissions.selectors.getProductScanned(state)).toEqual([emissionProductScanned]));
 });
 
 describe("if there are no emissions", () => {
@@ -209,6 +213,9 @@ describe("if there are no emissions", () => {
   test("`getMealEmissions` should return mitigated no emission", () =>
     expect(emissions.selectors.getMealEmissions(state)).toEqual([]));
 
+  test("`getProductScanned` should return mitigated no emission", () =>
+    expect(emissions.selectors.getProductScanned(state)).toEqual([]));
+
   test("`getEatableEmissions` should return mitigated no emission", () =>
     expect(emissions.selectors.getEatableEmissions(state)).toEqual([]));
 });

app/ducks/emissions/emissions.selectors.ts

@@ -31,6 +31,9 @@ const isCustomEmission = (emission) => emission.emissionType === EmissionType.cu
 
 const isMealEmission = (emission) => emission.emissionType === EmissionType.meal;
 
+const isProductScannedEmission = (emission) =>
+  emission.emissionType === EmissionType.productScanned;
+
 const isEatableEmission = (emission) =>
   emission.emissionType === EmissionType.meal || emission.emissionType === EmissionType.food;
 
@@ -60,6 +63,8 @@ const getEatableEmissions = pipe(getAllEmissions, filter(isEatableEmission));
 
 const getCustomEmissions = pipe(getAllEmissions, filter(isCustomEmission));
 
+const getProductScanned = pipe(getAllEmissions, filter(isProductScannedEmission));
+
 const getOtherEmissions = pipe(getAllEmissions, filter(isOtherEmission));
 
 export default {
@@ -71,6 +76,7 @@ export default {
   getFashionEmissions,
   getPurchaseEmissions,
   getCustomEmissions,
+  getProductScanned,
   getOtherEmissions,
   getMealEmissions,
   getEatableEmissions,

app/screens/Budget/BudgetScreen.tsx

@@ -18,24 +18,51 @@ const BudgetScreen: NavStatelessComponent = () => {
   const navigator = navigate(navigation);
 
   const monthlyCarbonBudget = useSelector(selectors.getMonthlyCarbonBudget);
-  const totalCurrentMonthEmissions = useSelector(selectors.getCurrentMonthAllCarbonValue);
-  const transportCurrentMonthEmissions = useSelector(selectors.getCurrentMonthTransportCarbonValue);
+
   const foodCurrentMonthEmissions = useSelector(selectors.getCurrentMonthFoodCarbonValue);
-  const otherCurrentMonthEmissions = useSelector(selectors.getCurrentMonthOtherCarbonValue);
+  const mealCurrentMonthEmissions = useSelector(selectors.getCurrentMonthMealCarbonValue);
+  const transportCurrentMonthEmissions = useSelector(selectors.getCurrentMonthTransportCarbonValue);
+  const streamingCurrentMonthEmissions = useSelector(selectors.getCurrentMonthStreamingCarbonValue);
+  const purchaseCurrentMonthEmissions = useSelector(selectors.getCurrentMonthPurchaseCarbonValue);
+  const fashionCurrentMonthEmissions = useSelector(selectors.getCurrentMonthFashionCarbonValue);
+  const electricityCurrentMonthEmissions = useSelector(
+    selectors.getCurrentMonthElectricityCarbonValue
+  );
+  const productScannedCurrentMonthEmissions = useSelector(
+    selectors.getCurrentMonthProductScannedCarbonValue
+  );
+  const customCurrentMonthEmissions = useSelector(selectors.getCurrentMonthCustomCarbonValue);
+  const totalCurrentMonthEmissions = useSelector(selectors.getCurrentMonthAllCarbonValue);
 
-  const totalCurrentYearEmissions = useSelector(selectors.getCurrentYearAllCarbonValue);
-  const transportCurrentYearEmissions = useSelector(selectors.getCurrentMonthTransportCarbonValue);
   const foodCurrentYearEmissions = useSelector(selectors.getCurrentYearFoodCarbonValue);
-  const otherCurrentYearEmissions = useSelector(selectors.getCurrentYearOtherCarbonValue);
+  const mealCurrentYearEmissions = useSelector(selectors.getCurrentYearMealCarbonValue);
+  const transportCurrentYearEmissions = useSelector(selectors.getCurrentYearTransportCarbonValue);
+  const streamingCurrentYearEmissions = useSelector(selectors.getCurrentYearStreamingCarbonValue);
+  const purchaseCurrentYearEmissions = useSelector(selectors.getCurrentYearPurchaseCarbonValue);
+  const fashionCurrentYearEmissions = useSelector(selectors.getCurrentYearFashionCarbonValue);
+  const electricityCurrentYearEmissions = useSelector(
+    selectors.getCurrentYearElectricityCarbonValue
+  );
+  const productScannedCurrentYearEmissions = useSelector(
+    selectors.getCurrentYearProductScannedCarbonValue
+  );
+  const customCurrentYearEmissions = useSelector(selectors.getCurrentYearCustomCarbonValue);
+  const totalCurrentYearEmissions = useSelector(selectors.getCurrentYearAllCarbonValue);
 
   return (
     <ScrollView style={styles.container}>
       <ProgressChart
         isMonth
         totalEmissions={totalCurrentMonthEmissions}
         foodEmissions={foodCurrentMonthEmissions}
+        mealEmissions={mealCurrentMonthEmissions}
         transportEmissions={transportCurrentMonthEmissions}
-        otherEmissions={otherCurrentMonthEmissions}
+        streamingEmissions={streamingCurrentMonthEmissions}
+        purchaseEmissions={purchaseCurrentMonthEmissions}
+        fashionEmissions={fashionCurrentMonthEmissions}
+        electricityEmissions={electricityCurrentMonthEmissions}
+        productScannedEmissions={productScannedCurrentMonthEmissions}
+        customEmissions={customCurrentMonthEmissions}
         monthlyEmissionsBudget={monthlyCarbonBudget}
       />
       <Button.Primary
@@ -52,8 +79,14 @@ const BudgetScreen: NavStatelessComponent = () => {
       <ProgressChart
         totalEmissions={totalCurrentYearEmissions}
         foodEmissions={foodCurrentYearEmissions}
+        mealEmissions={mealCurrentYearEmissions}
         transportEmissions={transportCurrentYearEmissions}
-        otherEmissions={otherCurrentYearEmissions}
+        streamingEmissions={streamingCurrentYearEmissions}
+        purchaseEmissions={purchaseCurrentYearEmissions}
+        fashionEmissions={fashionCurrentYearEmissions}
+        electricityEmissions={electricityCurrentYearEmissions}
+        productScannedEmissions={productScannedCurrentYearEmissions}
+        customEmissions={customCurrentYearEmissions}
         monthlyEmissionsBudget={monthlyCarbonBudget}
       />
     </ScrollView>

app/screens/Budget/components/ProgressChart/ProgressChart.styles.ts

@@ -24,4 +24,7 @@ export default StyleSheet.create({
   header: {
     textTransform: "capitalize",
   },
+  subHeader: {
+    paddingTop: 20,
+  },
 });

app/screens/Budget/components/ProgressChart/ProgressChart.tsx

@@ -7,22 +7,34 @@ import { Text } from "components";
 import { withLocalization, LocalizationContextProps, getLocaleForMoment } from "utils";
 
 import styles from "./ProgressChart.styles";
-import { Legend, Chart, PeriodBudget } from "./components";
+import { Legend, PeriodBudget } from "./components";
 
 interface Props {
   isMonth?: boolean;
   totalEmissions: number;
   foodEmissions: number;
+  mealEmissions: number;
   transportEmissions: number;
-  otherEmissions: number;
+  streamingEmissions: number;
+  purchaseEmissions: number;
+  fashionEmissions: number;
+  electricityEmissions: number;
+  productScannedEmissions: number;
+  customEmissions: number;
   monthlyEmissionsBudget: number;
 }
 
 const ProgressChart = ({
   totalEmissions = 0,
   foodEmissions = 0,
+  mealEmissions = 0,
   transportEmissions = 0,
-  otherEmissions = 0,
+  streamingEmissions = 0,
+  purchaseEmissions = 0,
+  fashionEmissions = 0,
+  electricityEmissions = 0,
+  productScannedEmissions = 0,
+  customEmissions = 0,
   monthlyEmissionsBudget = 0,
   isMonth = false,
   language = "",
@@ -33,12 +45,7 @@ const ProgressChart = ({
 
   const periodEmissionsBudget = isMonth ? monthlyEmissionsBudget : monthlyEmissionsBudget * 12;
 
-  const totalEmissionsPercentage =
-    totalEmissions / periodEmissionsBudget > 1 ? 1 : totalEmissions / periodEmissionsBudget;
-  const transportEmissionsPercentage =
-    transportEmissions / periodEmissionsBudget > 1 ? 1 : transportEmissions / periodEmissionsBudget;
-  const foodEmissionsPercentage =
-    foodEmissions / periodEmissionsBudget > 1 ? 1 : foodEmissions / periodEmissionsBudget;
+  const totalEmissionsPercentage = Math.round((totalEmissions / periodEmissionsBudget) * 100);
 
   const period = moment()
     .locale(getLocaleForMoment(language))
@@ -48,17 +55,21 @@ const ProgressChart = ({
     <View style={styles.container}>
       <View style={styles.periodContainer}>
         <Text.H3 style={styles.header}>{period}</Text.H3>
+        <Text.H1 lightGray style={styles.subHeader}>
+          {totalEmissionsPercentage + "%"}
+        </Text.H1>
       </View>
-      <Chart
-        totalEmissionsPercentage={totalEmissionsPercentage}
-        transportEmissionsPercentage={transportEmissionsPercentage}
-        foodEmissionsPercentage={foodEmissionsPercentage}
-      />
       <Legend
         totalEmissions={totalEmissions}
         foodEmissions={foodEmissions}
+        mealEmissions={mealEmissions}
         transportEmissions={transportEmissions}
-        otherEmissions={otherEmissions}
+        streamingEmissions={streamingEmissions}
+        purchaseEmissions={purchaseEmissions}
+        fashionEmissions={fashionEmissions}
+        electricityEmissions={electricityEmissions}
+        productScannedEmissions={productScannedEmissions}
+        customEmissions={customEmissions}
       />
       <PeriodBudget period={period.toLowerCase()} periodEmissionsBudget={periodEmissionsBudget} />
     </View>