Repository: NMF-earth/nmf-app (language: typescript)

Issue:
Not compatible @expo/vector-icons version
**Describe the bug**
When you try to run the app, the following warning will appear in console:
![image](https://user-images.githubusercontent.com/39802870/103212070-a9019d80-48e8-11eb-9c70-fa0f5d4c15ea.png)
The app works fine and there's no another problem besides that warning. But that's a good practice to keep it updated.

**To Reproduce**
Steps to reproduce the behavior:
1. run `expo start`

**Additional context**
New `@expo/vector-icons` have new icons and a lot of name changes in Ionicons icons



Discussion hints:

Pull request: Updated @expo-vector-icons
<!-- Thanks for submitting a pull request! We appreciate a lot your help. Please provide some information so that others can review your pull request. The two last fields below are optional but appreciated. -->

✅ I have read the [contributing file](https://github.com/NMF-earth/nmf-app/blob/main/contributing.md)

## Summary

<!-- MANDATORY : Explain the **motivation** for making this change. What existing problem does the pull request solve? -->
PR resolves #252 


## Changelog

<!-- Help reviewers and the release process by writing your own changelog entry -->

- Update @expo-vector-icons from `10.0.6` to `12.0.0` to solve the warning on starting the app
- Change MaterialCommunityIcons to FontAwesome5 in SocialMedia component - Medium Icon was removed in [v5.0.45](https://dev.materialdesignicons.com/changelog#version-5.0.45)
- Change BottomTabNavigator icons due to changes in [Ionicons 5.0.0](https://github.com/ionic-team/ionicons/releases/tag/5.0.0)
- Updated SocialMedia unit test due to change in icons component (Material to FontAwesome)
- Added @types/react-native-vector-icons to solve typescript problem

## Demo

<!-- Demonstrate the code is solid. Example: The exact commands you ran and their output, screenshots / videos if the pull request changes the user interface. -->

![image](https://user-images.githubusercontent.com/39802870/103216378-a9a03100-48f4-11eb-8d57-080d2f7b8509.png)

All icons changed (SocialMedia and BottomTabNavigator)



Test command: NODE_OPTIONS='--experimental-vm-modules --max-old-space-size=4096' npx --no-install jest app/components/ListItem/__tests__/ListItem.test.tsx app/components/SocialMedia/__tests__/SocialMedia.test.tsx app/screens/Act/__tests__/ActScreen.test.tsx app/screens/Budget/components/ProgressChart/__tests__/ProgressChart.test.tsx app/screens/Emissions/components/EmissionsListItem/__tests__/EmissionListItem.test.tsx app/screens/Settings/components/SettingsRow/__tests__/SettingsRow.test.tsx --passWithNoTests 2>&1

Fix patch:
diff --git a/app/components/ListItem/ListItem.tsx b/app/components/ListItem/ListItem.tsx
index 318b7371..e81eb2bb 100644
--- a/app/components/ListItem/ListItem.tsx
+++ b/app/components/ListItem/ListItem.tsx
@@ -20,7 +20,7 @@ const ListItem = ({ title, onPress }: Props) => {
       </Text.Secondary>
       <Ionicons
         style={styles.icon}
-        name={"ios-arrow-forward"}
+        name={"ios-chevron-forward-outline"}
         size={26}
         color={Colors.grey40}
       />
diff --git a/app/components/SocialMedia/SocialMedia.tsx b/app/components/SocialMedia/SocialMedia.tsx
index 4ac1d37f..afe63392 100644
--- a/app/components/SocialMedia/SocialMedia.tsx
+++ b/app/components/SocialMedia/SocialMedia.tsx
@@ -1,6 +1,6 @@
 import React from "react";
 import { View, TouchableOpacity } from "react-native";
-import { MaterialCommunityIcons } from "@expo/vector-icons";
+import { FontAwesome5 } from "@expo/vector-icons";
 import * as Linking from "expo-linking";
 
 import { Colors } from "style";
@@ -14,7 +14,7 @@ const socialMedia = [
       "https://join.slack.com/t/not-my-fault/shared_invite/enQtODMzMzcyNjExMzc3LTVlNDQwMTA0OGUxMmJmNTE4MTA4MTgwZGZmNTBiZmRhNTcxY2FlN2MzZGQyMmRjZDVjN2Q2MjFlNzE4ZGI5ZTI",
   },
   {
-    iconName: "github-circle",
+    iconName: "github",
     url: "https://github.com/NMF-earth",
   },
   {
@@ -22,23 +22,21 @@ const socialMedia = [
     url: "https://mastodon.social/@nmf_earth",
   },
   {
-    iconName: "medium",
+    iconName: "medium-m",
     url: "https://medium.com/@nmf_earth",
   },
 ];
 
-export default () => (
+const SocialMedia = () => (
   <View style={styles.container}>
     <View style={styles.box}>
       {socialMedia.map((item, index) => (
         <TouchableOpacity key={index} onPress={() => Linking.openURL(item.url)}>
-          <MaterialCommunityIcons
-            name={item.iconName}
-            size={32}
-            color={Colors.grey70}
-          />
+          <FontAwesome5 name={item.iconName} size={32} color={Colors.grey70} />
         </TouchableOpacity>
       ))}
     </View>
   </View>
 );
+
+export default SocialMedia;
diff --git a/app/navigation/Navigator/BottomTabNavigator.tsx b/app/navigation/Navigator/BottomTabNavigator.tsx
index 0dea2ae5..07d9b47d 100644
--- a/app/navigation/Navigator/BottomTabNavigator.tsx
+++ b/app/navigation/Navigator/BottomTabNavigator.tsx
@@ -23,21 +23,21 @@ const BudgetOptions = {
 const EmissionsOptions = {
   tabBarLabel: t("EMISSIONS_SCREEN_TAB_NAME"),
   tabBarIcon: ({ focused }) => (
-    <TabBarIcon focused={focused} name={"md-stats"} />
+    <TabBarIcon focused={focused} name={"md-stats-chart-sharp"} />
   ),
 };
 
 const ActOptions = {
   tabBarLabel: t("ACT_SCREEN_TAB_NAME"),
   tabBarIcon: ({ focused }) => (
-    <TabBarIcon focused={focused} name={"md-hand"} />
+    <TabBarIcon focused={focused} name={"md-hand-left-sharp"} />
   ),
 };
 
 const SettingsOptions = {
   tabBarLabel: t("SETTINGS_SCREEN_TAB_NAME"),
   tabBarIcon: ({ focused }) => (
-    <TabBarIcon focused={focused} name={"md-switch"} />
+    <TabBarIcon focused={focused} name={"md-options"} />
   ),
 };
 
diff --git a/app/screens/Emissions/components/EmissionsListItem/EmissionsListItem.tsx b/app/screens/Emissions/components/EmissionsListItem/EmissionsListItem.tsx
index 3579e7b0..c4d7dc8a 100644
--- a/app/screens/Emissions/components/EmissionsListItem/EmissionsListItem.tsx
+++ b/app/screens/Emissions/components/EmissionsListItem/EmissionsListItem.tsx
@@ -50,7 +50,7 @@ const EmissionsListItem = ({
       </View>
     </View>
     <Ionicons
-      name={"ios-arrow-forward"}
+      name={"ios-chevron-forward-outline"}
       size={18}
       style={styles.icon}
       color={Colors.grey100}
diff --git a/app/screens/Settings/components/SettingsRow/SettingsRow.tsx b/app/screens/Settings/components/SettingsRow/SettingsRow.tsx
index 45997eec..94ac18d5 100644
--- a/app/screens/Settings/components/SettingsRow/SettingsRow.tsx
+++ b/app/screens/Settings/components/SettingsRow/SettingsRow.tsx
@@ -16,7 +16,11 @@ const SettingsRow = ({ title, onPress }: Props) => {
   return (
     <TouchableOpacity onPress={onPress} style={styles.container}>
       <Text.Secondary bold>{title}</Text.Secondary>
-      <Ionicons name={"ios-arrow-forward"} size={20} color={Colors.grey100} />
+      <Ionicons
+        name={"ios-chevron-forward-outline"}
+        size={20}
+        color={Colors.grey100}
+      />
     </TouchableOpacity>
   );
 };
diff --git a/package.json b/package.json
index 56364e26..e25d76f6 100644
--- a/package.json
+++ b/package.json
@@ -26,7 +26,7 @@
     ]
   },
   "dependencies": {
-    "@expo/vector-icons": "10.0.6",
+    "@expo/vector-icons": "12.0.0",
     "@react-native-community/datetimepicker": "3.0.4",
     "@react-native-community/masked-view": "0.1.10",
     "@react-native-community/slider": "3.0.3",
@@ -88,6 +88,7 @@
     "@types/ramda": "0.26.39",
     "@types/react": "16.9.35",
     "@types/react-native": "0.63.2",
+    "@types/react-native-vector-icons": "6.4.6",
     "@types/react-redux": "7.1.7",
     "@types/react-test-renderer": "16.9.2",
     "@types/uuid": "3.4.6",
diff --git a/yarn.lock b/yarn.lock
index 07a8b88e..0e13ca09 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -1258,12 +1258,17 @@
   dependencies:
     cross-spawn "^6.0.5"
 
-"@expo/vector-icons@10.0.6":
-  version "10.0.6"
-  resolved "https://registry.yarnpkg.com/@expo/vector-icons/-/vector-icons-10.0.6.tgz#5718953ff0b97827d11dae5787976fa8ce5caaed"
-  integrity sha512-qNlKPNdf073LpeEpyClxAh0D3mmIK4TGAQzeKR0HVwf14RIEe17+mLW5Z6Ka5Ho/lUtKMRPDHumSllFyKvpeGg==
+"@expo/vector-icons@12.0.0":
+  version "12.0.0"
+  resolved "https://registry.yarnpkg.com/@expo/vector-icons/-/vector-icons-12.0.0.tgz#200859ed32095847abd5cce8efe9aa1c7286f1f8"
+  integrity sha512-R8kVnAamF48bFEctgunkgYB4HImQ/wO2d0r23QgW3snSWe+gZmXukcvm45d8SRCvnMdRRXnZdTsYLYKSNrux4Q==
   dependencies:
-    lodash "^4.17.4"
+    lodash.frompairs "^4.0.1"
+    lodash.isequal "^4.5.0"
+    lodash.isstring "^4.0.1"
+    lodash.omit "^4.5.0"
+    lodash.pick "^4.4.0"
+    lodash.template "^4.5.0"
 
 "@expo/vector-icons@^12.0.0":
   version "12.0.2"
@@ -1730,7 +1735,7 @@
   resolved "https://registry.yarnpkg.com/@react-native-community/slider/-/slider-3.0.3.tgz#830167fd757ba70ac638747ba3169b2dbae60330"
   integrity sha512-8IeHfDwJ9/CTUwFs6x90VlobV3BfuPgNLjTgC6dRZovfCWigaZwVNIFFJnHBakK3pW2xErAPwhdvNR4JeNoYbw==
 
-"@react-navigation/bottom-tabs@^5.11.2":
+"@react-navigation/bottom-tabs@5.11.2":
   version "5.11.2"
   resolved "https://registry.yarnpkg.com/@react-navigation/bottom-tabs/-/bottom-tabs-5.11.2.tgz#5b541612fcecdea2a5024a4028da35e4a727bde6"
   integrity sha512-7+hH00N9Ze74VcX8uYWVyXFXZ0Fwid+lG+SSLtmnJjk1Y6oIQpQ17EPqKO0UZlKKjhsvMlAnL5fdgFtoqnSjcA==
@@ -1771,7 +1776,7 @@
   dependencies:
     nanoid "^3.1.15"
 
-"@react-navigation/stack@^5.12.8":
+"@react-navigation/stack@5.12.8":
   version "5.12.8"
   resolved "https://registry.yarnpkg.com/@react-navigation/stack/-/stack-5.12.8.tgz#31e54e05d8a3ffaaa3e39a1a9b7969f8316a35bf"
   integrity sha512-wUJFbU0v606RBXOUxHToCXJNmiwxtFYhN2TFvjxCZ3PJU+OWWx8HTmn99pT3rVH4Ax2cfO5BDUy9v+r74ZrIWw==
@@ -2630,6 +2635,21 @@
     "@types/react" "*"
     "@types/reactcss" "*"
 
+"@types/react-native-vector-icons@^6.4.6":
+  version "6.4.6"
+  resolved "https://registry.yarnpkg.com/@types/react-native-vector-icons/-/react-native-vector-icons-6.4.6.tgz#848e3b14572def56212cafbf5cb1254b445bfb41"
+  integrity sha512-lAyxNfMd5L1xZvXWsGcJmNegDf61TAp40uL6ashNNWj9W3IrDJO59L9+9inh0Y2MsEZpLTdxzVU8Unb4/0FQng==
+  dependencies:
+    "@types/react" "*"
+    "@types/react-native" "*"
+
+"@types/react-native@*":
+  version "0.63.43"
+  resolved "https://registry.yarnpkg.com/@types/react-native/-/react-native-0.63.43.tgz#0278dd540f8479b35ae5d6ef373dd9b3be4cffb1"
+  integrity sha512-zFD+rFf7xmk3ZL5laaGdWB8NLNoN36TjHc2M5PcT5gXcDk7ZJBPsiabNcPDQPSIU/om8YPwBpaFdd1IiyuIM+g==
+  dependencies:
+    "@types/react" "*"
+
 "@types/react-native@0.63.2":
   version "0.63.2"
   resolved "https://registry.yarnpkg.com/@types/react-native/-/react-native-0.63.2.tgz#428a4d71351ccbc31ab170b5f32477c7ce78dfd7"
@@ -6122,7 +6142,7 @@ expo-application@~2.4.1:
   resolved "https://registry.yarnpkg.com/expo-application/-/expo-application-2.4.1.tgz#f8eb4a3a05a0b8a8f38f2e981f587a815945b685"
   integrity sha512-VHDvXz55LIYdLoE1aR0AFycB1jz4ggbMToUbKAbCEjro+PdUNm/Gj8gQeFgH6wL2oAztQH4qJ+uiOwrw8SFK+Q==
 
-expo-asset@~8.2.1:
+expo-asset@8.2.1, expo-asset@~8.2.1:
   version "8.2.1"
   resolved "https://registry.yarnpkg.com/expo-asset/-/expo-asset-8.2.1.tgz#1b69724f29ca4260805f2e6368c4428d8ad90cc6"
   integrity sha512-M97jZU83Gm6wWGkrCwTzDVlufQCmnrCbmW4AMOH6xl3XhwOpgsQ6m6xrwT0Sq1tto7JUuL0tPbB9vb9L7yLfyg==
@@ -6150,6 +6170,14 @@ expo-constants@9.3.1:
     fbjs "1.0.0"
     uuid "^3.3.2"
 
+expo-constants@9.3.3:
+  version "9.3.3"
+  resolved "https://registry.yarnpkg.com/expo-constants/-/expo-constants-9.3.3.tgz#e02b71109e0514d17aa7eacbad44f1277eca1ae8"
+  integrity sha512-QDjM4rbUiBCpWb4XJvkZHJnrrm40EcHBj3ZRhc/IcZVFt+BlsSHIg3YlZ0ncjikYswVGEY85kcJy1Kq1g6ib3w==
+  dependencies:
+    fbjs "1.0.0"
+    uuid "^3.3.2"
+
 expo-device@*:
   version "2.4.0"
   resolved "https://registry.yarnpkg.com/expo-device/-/expo-device-2.4.0.tgz#277f830827c3b12710f1db5c0096d507e751689b"
@@ -6172,7 +6200,7 @@ expo-file-system@~9.3.0:
   dependencies:
     uuid "^3.4.0"
 
-expo-font@~8.4.0:
+expo-font@8.4.0, expo-font@~8.4.0:
   version "8.4.0"
   resolved "https://registry.yarnpkg.com/expo-font/-/expo-font-8.4.0.tgz#7cb4cc9d852dd8d0977ce425146b94221b40c1d5"
   integrity sha512-CPGcHLUkPP+yf618fiw2bWTFLojIYCCqWonco/JONcM3tsv6wjkafx4Qw1mMCRoFL7XoiBfHylkKnD0avpzQIQ==
@@ -6190,7 +6218,7 @@ expo-linear-gradient@~8.4.0:
   resolved "https://registry.yarnpkg.com/expo-linear-gradient/-/expo-linear-gradient-8.4.0.tgz#34e6f960b1971c57dacf7211c747ba490a76bf63"
   integrity sha512-f9JOXaIl0MR8RBYRIud5UAsEi52oz81XhQs73VUpujemHjOyHmrZa6dqwf399YOwI/WBwbpcINcUIw/mCYE1mA==
 
-expo-linking@~2.0.0:
+expo-linking@2.0.0, expo-linking@~2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/expo-linking/-/expo-linking-2.0.0.tgz#c39f610825e99ef0d10e8d82fbcf7beed8456b00"
   integrity sha512-/48/+MHa96l3/YgL0uM/hbli+H0J8XXAUWgMCBpTIcmUc0POYw4Xp+7BhXcTbPRZsVoOiAHAmKIsEjFVTd5L+A==
@@ -6199,7 +6227,7 @@ expo-linking@~2.0.0:
     qs "^6.5.0"
     url-parse "^1.4.4"
 
-expo-localization@~9.1.0:
+expo-localization@9.1.0:
   version "9.1.0"
   resolved "https://registry.yarnpkg.com/expo-localization/-/expo-localization-9.1.0.tgz#463381568082fdcb28ad4e4c533a6f9471a3f78a"
   integrity sha512-0KYVUOJAHVRS/5oq0Bcf2i0imKOIFdpLnnNSG9XeaskkNgNSnbzeTQsoDvHi9UGYLwwtUo9HLciQJ/xcoSiftw==
@@ -6211,7 +6239,7 @@ expo-location@~10.0.0:
   resolved "https://registry.yarnpkg.com/expo-location/-/expo-location-10.0.0.tgz#2923411649434f2f079343b163b13c5c9eee8b2d"
   integrity sha512-QLEb0iaBv4/blLxxfKRj2/HPisY+1t+g6MgegqZ1j1U/0qih4dvzUQrxie9ZOZyQB9gnXFCRnZv3QzHEb52dcA==
 
-expo-notifications@~0.8.2:
+expo-notifications@0.8.2:
   version "0.8.2"
   resolved "https://registry.yarnpkg.com/expo-notifications/-/expo-notifications-0.8.2.tgz#69e04a4e48ec6bafaeb354d284fbc23c26f2d62d"
   integrity sha512-eX/HB96FqXzSMAwtA/fhxB1tGYELQywPm7oBTfnALHH3MFHy1bW7NZYGcU82sDF+DF09uLZ4Fn4p5ValMWA5TA==
@@ -6234,7 +6262,7 @@ expo-secure-store@~9.3.0:
   resolved "https://registry.yarnpkg.com/expo-secure-store/-/expo-secure-store-9.3.0.tgz#b716d5d115cc50a34037d1afef84fe4b8ea0745c"
   integrity sha512-dNhKcoUUn+1kmEfFVxSU7h+YsqODqlExZQJcQgxgeiuCeeDvJWkE10t3jjrO6aNfrdM5i/X2l3oh401EDslWsQ==
 
-expo-splash-screen@~0.8.1:
+expo-splash-screen@0.8.1:
   version "0.8.1"
   resolved "https://registry.yarnpkg.com/expo-splash-screen/-/expo-splash-screen-0.8.1.tgz#de4a018c82af879eeaa9b697013ef37d9567453a"
   integrity sha512-7NQo8OgkfQ4sv4mIHE58fkiQTGyl5dOP70uAUTb5YXC/QUsHIqEpKQ6ZXDpkLU1cbZ32c8Vtok4r2FRIUrzxcg==
@@ -6249,19 +6277,19 @@ expo-sqlite@~8.5.0:
     "@expo/websql" "^1.0.1"
     lodash "^4.17.15"
 
-expo-status-bar@~1.0.3:
+expo-status-bar@1.0.3:
   version "1.0.3"
   resolved "https://registry.yarnpkg.com/expo-status-bar/-/expo-status-bar-1.0.3.tgz#62b4d6145680abd43ba6ecfa465f835e88bf6263"
   integrity sha512-/Orgla1nkIrfswNHbuAOTbPVq0g3+GrhoQVk7MRafY2dwrFLgXhaPExS+eN2hpmzqPv2LG5cqAZDCQUAjmZYBQ==
 
-expo-web-browser@~8.6.0:
+expo-web-browser@8.6.0:
   version "8.6.0"
   resolved "https://registry.yarnpkg.com/expo-web-browser/-/expo-web-browser-8.6.0.tgz#121ad81b2597b8273739b630c278a6f6937b95ae"
   integrity sha512-VHFuBl0im00yEVbEzOZUrQVvq8uGhyU/4WivJkfLF4GA3Pj7CaG6PMo0+6YNzkzB1JoVx5AfuKgBbSuOuETP9Q==
   dependencies:
     compare-urls "^2.0.0"
 
-expo@^40.0.0:
+expo@40.0.0:
   version "40.0.0"
   resolved "https://registry.yarnpkg.com/expo/-/expo-40.0.0.tgz#6caf03587532cd18b482991332a8b75eeca2fcb7"
   integrity sha512-LT6Ae/Ms0qtRyJlJsj/FMB5AQpj6nED39SY9KqY4zK/uFG+R7DJ/4VUzkPued1mWtRUrtaqR+t88pA3p0vAWcg==
@@ -8261,10 +8289,10 @@ jest-environment-node@^25.5.0:
     jest-util "^25.5.0"
     semver "^6.3.0"
 
-jest-expo@^40.0.0:
-  version "40.0.1"
-  resolved "https://registry.yarnpkg.com/jest-expo/-/jest-expo-40.0.1.tgz#3ee1e955036eff1e0b7d0b4ec599701bc65eaa2d"
-  integrity sha512-4X6x4Xj4ErUxhfDhZJyWob/xg3KuOReQidQYXPMTEUEG1Qw5LchCV2wm4fcuQwRGTks9DGpB/2eM3PosVdwCpA==
+jest-expo@40.0.0:
+  version "40.0.0"
+  resolved "https://registry.yarnpkg.com/jest-expo/-/jest-expo-40.0.0.tgz#eb472c0a9df943b1e9bbc74e4bad88a373b656d2"
+  integrity sha512-rRi/EmgAY/GwaVqyBvzOMwaE/nb7A4+l27Io85RCTBgeN5qIxm2YntQp+zvj5ux7qkN9JYZiRNpXCqiWEXmJ9w==
   dependencies:
     "@expo/config" "^3.2.3"
     babel-jest "^25.2.0"
@@ -9066,7 +9094,7 @@ lodash.unescape@4.0.1:
   resolved "https://registry.yarnpkg.com/lodash.unescape/-/lodash.unescape-4.0.1.tgz#bf2249886ce514cda112fae9218cdc065211fc9c"
   integrity sha1-vyJJiGzlFM2hEvrpIYzcBlIR/Jw=
 
-lodash@^4.0.1, lodash@^4.17.11, lodash@^4.17.12, lodash@^4.17.13, lodash@^4.17.14, lodash@^4.17.15, lodash@^4.17.19, lodash@^4.17.20, lodash@^4.17.4, lodash@^4.3.0, lodash@^4.5.0, lodash@^4.6.0:
+lodash@^4.0.1, lodash@^4.17.11, lodash@^4.17.12, lodash@^4.17.13, lodash@^4.17.14, lodash@^4.17.15, lodash@^4.17.19, lodash@^4.17.20, lodash@^4.3.0, lodash@^4.5.0, lodash@^4.6.0:
   version "4.17.20"
   resolved "https://registry.yarnpkg.com/lodash/-/lodash-4.17.20.tgz#b44a9b6297bcb698f1c51a3545a2b3b368d59c52"
   integrity sha512-PlhdFcillOINfeV7Ni6oF1TAEayyZBoZ8bcshTHqOYJYlrqzRK5hagpagky5o4HfCzzd1TRkXPMFq6cKk9rGmA==
@@ -11322,7 +11350,7 @@ react-native-color-picker@^0.4.0:
     prop-types "^15.5.10"
     tinycolor2 "^1.4.1"
 
-react-native-gesture-handler@~1.8.0:
+react-native-gesture-handler@1.8.0:
   version "1.8.0"
   resolved "https://registry.yarnpkg.com/react-native-gesture-handler/-/react-native-gesture-handler-1.8.0.tgz#18f61f51da50320f938957b0ee79bc58f47449dc"
   integrity sha512-E2FZa0qZ5Bi0Z8Jg4n9DaFomHvedSjwbO2DPmUUHYRy1lH2yxXUpSrqJd6yymu+Efzmjg2+JZzsjFYA2Iq8VEQ==
@@ -11385,10 +11413,10 @@ react-native-modal@^11.0.2:
     prop-types "^15.6.2"
     react-native-animatable "1.3.3"
 
-react-native-reanimated@~1.13.0:
-  version "1.13.2"
-  resolved "https://registry.yarnpkg.com/react-native-reanimated/-/react-native-reanimated-1.13.2.tgz#1ae5457b24b4913d173a5a064bb28eae7783d293"
-  integrity sha512-O+WhgxSjOIzcVdAAvx+h2DY331Ek1knKlaq+jsNLpC1fhRy9XTdOObovgob/aF2ve9uJfPEawCx8381g/tUJZQ==
+react-native-reanimated@1.13.0:
+  version "1.13.0"
+  resolved "https://registry.yarnpkg.com/react-native-reanimated/-/react-native-reanimated-1.13.0.tgz#1ee5d27d34bd2cee7dfad4ae9a3673300872c917"
+  integrity sha512-uadP/0QO+4TCsyPSvzRdl+76NPM7Bp8M25KQLB4Hg3tWBMjhrMrETnzNi33L/OPfmhU+7rceyi0QPe/DxKT5bQ==
   dependencies:
     fbjs "^1.0.0"
 
@@ -11407,7 +11435,7 @@ react-native-safe-area-context@3.1.9:
   resolved "https://registry.yarnpkg.com/react-native-safe-area-context/-/react-native-safe-area-context-3.1.9.tgz#48864ea976b0fa57142a2cc523e1fd3314e7247e"
   integrity sha512-wmcGbdyE/vBSL5IjDPReoJUEqxkZsywZw5gPwsVUV1NBpw5eTIdnL6Y0uNKHE25Z661moxPHQz6kwAkYQyorxA==
 
-react-native-screens@~2.15.0:
+react-native-screens@2.15.0:
   version "2.15.0"
   resolved "https://registry.yarnpkg.com/react-native-screens/-/react-native-screens-2.15.0.tgz#9b97c1881c4fcdf304bf363f0013225901625f44"
   integrity sha512-qTSQPy0WKHtlb8xt5gY0Gt6sdvfQUQAnFSqgsggW9UEvySbkHzpqOrOYNA79Ca8oXO0dCFwp6X8buIiDefa7+Q==


Test patch:
diff --git a/app/components/ListItem/__tests__/__snapshots__/ListItem.test.tsx.snap b/app/components/ListItem/__tests__/__snapshots__/ListItem.test.tsx.snap
index 9d4ffda9..9e718427 100644
--- a/app/components/ListItem/__tests__/__snapshots__/ListItem.test.tsx.snap
+++ b/app/components/ListItem/__tests__/__snapshots__/ListItem.test.tsx.snap
@@ -22,7 +22,7 @@ exports[`<ListItem /> render 1`] = `
   </Text.Secondary>
   <Ionicons
     color="#9CA6A0"
-    name="ios-arrow-forward"
+    name="ios-chevron-forward-outline"
     size={26}
     style={
       Object {
diff --git a/app/components/SocialMedia/__tests__/SocialMedia.test.tsx b/app/components/SocialMedia/__tests__/SocialMedia.test.tsx
index c47807a0..1a85e263 100644
--- a/app/components/SocialMedia/__tests__/SocialMedia.test.tsx
+++ b/app/components/SocialMedia/__tests__/SocialMedia.test.tsx
@@ -2,10 +2,18 @@ import React from "react";
 import { create } from "react-test-renderer";
 import * as Linking from "expo-linking";
 
-import SocialMedia from "../";
+import SocialMedia from "..";
 
 jest.unmock("../");
 
+jest.mock("@expo/vector-icons", () => {
+  // eslint-disable-next-line @typescript-eslint/no-var-requires
+  const { View } = require("react-native");
+  return {
+    FontAwesome5: View,
+  };
+});
+
 beforeEach(() => {
   jest.spyOn(Linking, "openURL").mockImplementation((url: string) => {
     if (url) {
@@ -16,7 +24,7 @@ beforeEach(() => {
 });
 
 test("renders correctly SocialMedia", () => {
-  const tree = create(<SocialMedia />).toJSON();
+  const tree = create(<SocialMedia />);
   expect(tree).toMatchSnapshot();
 });
 
diff --git a/app/components/SocialMedia/__tests__/__snapshots__/SocialMedia.test.tsx.snap b/app/components/SocialMedia/__tests__/__snapshots__/SocialMedia.test.tsx.snap
index 4a9c6666..040774f2 100644
--- a/app/components/SocialMedia/__tests__/__snapshots__/SocialMedia.test.tsx.snap
+++ b/app/components/SocialMedia/__tests__/__snapshots__/SocialMedia.test.tsx.snap
@@ -25,7 +25,7 @@ exports[`renders correctly SocialMedia 1`] = `
     <TouchableOpacity
       onPress={[Function]}
     >
-      <MaterialCommunityIcons
+      <View
         color="#595D58"
         name="slack"
         size={32}
@@ -34,16 +34,16 @@ exports[`renders correctly SocialMedia 1`] = `
     <TouchableOpacity
       onPress={[Function]}
     >
-      <MaterialCommunityIcons
+      <View
         color="#595D58"
-        name="github-circle"
+        name="github"
         size={32}
       />
     </TouchableOpacity>
     <TouchableOpacity
       onPress={[Function]}
     >
-      <MaterialCommunityIcons
+      <View
         color="#595D58"
         name="mastodon"
         size={32}
@@ -52,9 +52,9 @@ exports[`renders correctly SocialMedia 1`] = `
     <TouchableOpacity
       onPress={[Function]}
     >
-      <MaterialCommunityIcons
+      <View
         color="#595D58"
-        name="medium"
+        name="medium-m"
         size={32}
       />
     </TouchableOpacity>
diff --git a/app/screens/Act/__tests__/__snapshots__/ActScreen.test.tsx.snap b/app/screens/Act/__tests__/__snapshots__/ActScreen.test.tsx.snap
index e10f0945..fb65db74 100644
--- a/app/screens/Act/__tests__/__snapshots__/ActScreen.test.tsx.snap
+++ b/app/screens/Act/__tests__/__snapshots__/ActScreen.test.tsx.snap
@@ -163,7 +163,7 @@ exports[`ActScreen renders correctly 1`] = `
         </Text.Secondary>
         <Ionicons
           color="#9CA6A0"
-          name="ios-arrow-forward"
+          name="ios-chevron-forward-outline"
           size={26}
           style={
             Object {
@@ -198,7 +198,7 @@ exports[`ActScreen renders correctly 1`] = `
         </Text.Secondary>
         <Ionicons
           color="#9CA6A0"
-          name="ios-arrow-forward"
+          name="ios-chevron-forward-outline"
           size={26}
           style={
             Object {
@@ -233,7 +233,7 @@ exports[`ActScreen renders correctly 1`] = `
         </Text.Secondary>
         <Ionicons
           color="#9CA6A0"
-          name="ios-arrow-forward"
+          name="ios-chevron-forward-outline"
           size={26}
           style={
             Object {
@@ -268,7 +268,7 @@ exports[`ActScreen renders correctly 1`] = `
         </Text.Secondary>
         <Ionicons
           color="#9CA6A0"
-          name="ios-arrow-forward"
+          name="ios-chevron-forward-outline"
           size={26}
           style={
             Object {
@@ -303,7 +303,7 @@ exports[`ActScreen renders correctly 1`] = `
         </Text.Secondary>
         <Ionicons
           color="#9CA6A0"
-          name="ios-arrow-forward"
+          name="ios-chevron-forward-outline"
           size={26}
           style={
             Object {
@@ -338,7 +338,7 @@ exports[`ActScreen renders correctly 1`] = `
         </Text.Secondary>
         <Ionicons
           color="#9CA6A0"
-          name="ios-arrow-forward"
+          name="ios-chevron-forward-outline"
           size={26}
           style={
             Object {
diff --git a/app/screens/Budget/components/ProgressChart/__tests__/__snapshots__/ProgressChart.test.tsx.snap b/app/screens/Budget/components/ProgressChart/__tests__/__snapshots__/ProgressChart.test.tsx.snap
index b43002d0..d06ffc36 100644
--- a/app/screens/Budget/components/ProgressChart/__tests__/__snapshots__/ProgressChart.test.tsx.snap
+++ b/app/screens/Budget/components/ProgressChart/__tests__/__snapshots__/ProgressChart.test.tsx.snap
@@ -33,7 +33,7 @@ exports[`ProgressChart renders correctly 1`] = `
         }
       }
     >
-      2020
+      2021
     </Text.H3>
   </View>
   <Chart
@@ -48,7 +48,7 @@ exports[`ProgressChart renders correctly 1`] = `
     transportEmissions={600}
   />
   <PeriodBudget
-    period="2020"
+    period="2021"
     periodEmissionsBudget={12000}
   />
 </View>
diff --git a/app/screens/Emissions/components/EmissionsListItem/__tests__/__snapshots__/EmissionListItem.test.tsx.snap b/app/screens/Emissions/components/EmissionsListItem/__tests__/__snapshots__/EmissionListItem.test.tsx.snap
index b44c20a7..3b96c729 100644
--- a/app/screens/Emissions/components/EmissionsListItem/__tests__/__snapshots__/EmissionListItem.test.tsx.snap
+++ b/app/screens/Emissions/components/EmissionsListItem/__tests__/__snapshots__/EmissionListItem.test.tsx.snap
@@ -95,7 +95,7 @@ exports[`EmissionsListItem renders correctly if mitigated 1`] = `
     </View>
     <Ionicons
       color="#111714"
-      name="ios-arrow-forward"
+      name="ios-chevron-forward-outline"
       size={18}
       style={
         Object {
@@ -192,7 +192,7 @@ exports[`EmissionsListItem renders correctly with audio icon 1`] = `
     </View>
     <Ionicons
       color="#111714"
-      name="ios-arrow-forward"
+      name="ios-chevron-forward-outline"
       size={18}
       style={
         Object {
@@ -289,7 +289,7 @@ exports[`EmissionsListItem renders correctly with boat icon 1`] = `
     </View>
     <Ionicons
       color="#111714"
-      name="ios-arrow-forward"
+      name="ios-chevron-forward-outline"
       size={18}
       style={
         Object {
@@ -386,7 +386,7 @@ exports[`EmissionsListItem renders correctly with bus icon 1`] = `
     </View>
     <Ionicons
       color="#111714"
-      name="ios-arrow-forward"
+      name="ios-chevron-forward-outline"
       size={18}
       style={
         Object {
@@ -483,7 +483,7 @@ exports[`EmissionsListItem renders correctly with car icon 1`] = `
     </View>
     <Ionicons
       color="#111714"
-      name="ios-arrow-forward"
+      name="ios-chevron-forward-outline"
       size={18}
       style={
         Object {
@@ -580,7 +580,7 @@ exports[`EmissionsListItem renders correctly with chocolate icon 1`] = `
     </View>
     <Ionicons
       color="#111714"
-      name="ios-arrow-forward"
+      name="ios-chevron-forward-outline"
       size={18}
       style={
         Object {
@@ -677,7 +677,7 @@ exports[`EmissionsListItem renders correctly with coffee icon 1`] = `
     </View>
     <Ionicons
       color="#111714"
-      name="ios-arrow-forward"
+      name="ios-chevron-forward-outline"
       size={18}
       style={
         Object {
@@ -774,7 +774,7 @@ exports[`EmissionsListItem renders correctly with fish icon 1`] = `
     </View>
     <Ionicons
       color="#111714"
-      name="ios-arrow-forward"
+      name="ios-chevron-forward-outline"
       size={18}
       style={
         Object {
@@ -871,7 +871,7 @@ exports[`EmissionsListItem renders correctly with full hd video icon 1`] = `
     </View>
     <Ionicons
       color="#111714"
-      name="ios-arrow-forward"
+      name="ios-chevron-forward-outline"
       size={18}
       style={
         Object {
@@ -968,7 +968,7 @@ exports[`EmissionsListItem renders correctly with hd video icon 1`] = `
     </View>
     <Ionicons
       color="#111714"
-      name="ios-arrow-forward"
+      name="ios-chevron-forward-outline"
       size={18}
       style={
         Object {
@@ -1065,7 +1065,7 @@ exports[`EmissionsListItem renders correctly with longHaulFlight icon 1`] = `
     </View>
     <Ionicons
       color="#111714"
-      name="ios-arrow-forward"
+      name="ios-chevron-forward-outline"
       size={18}
       style={
         Object {
@@ -1162,7 +1162,7 @@ exports[`EmissionsListItem renders correctly with mediumHaulFlight icon 1`] = `
     </View>
     <Ionicons
       color="#111714"
-      name="ios-arrow-forward"
+      name="ios-chevron-forward-outline"
       size={18}
       style={
         Object {
@@ -1259,7 +1259,7 @@ exports[`EmissionsListItem renders correctly with motorbike icon 1`] = `
     </View>
     <Ionicons
       color="#111714"
-      name="ios-arrow-forward"
+      name="ios-chevron-forward-outline"
       size={18}
       style={
         Object {
@@ -1356,7 +1356,7 @@ exports[`EmissionsListItem renders correctly with redMeat icon 1`] = `
     </View>
     <Ionicons
       color="#111714"
-      name="ios-arrow-forward"
+      name="ios-chevron-forward-outline"
       size={18}
       style={
         Object {
@@ -1453,7 +1453,7 @@ exports[`EmissionsListItem renders correctly with shortHaulFlight icon 1`] = `
     </View>
     <Ionicons
       color="#111714"
-      name="ios-arrow-forward"
+      name="ios-chevron-forward-outline"
       size={18}
       style={
         Object {
@@ -1550,7 +1550,7 @@ exports[`EmissionsListItem renders correctly with train icon 1`] = `
     </View>
     <Ionicons
       color="#111714"
-      name="ios-arrow-forward"
+      name="ios-chevron-forward-outline"
       size={18}
       style={
         Object {
@@ -1647,7 +1647,7 @@ exports[`EmissionsListItem renders correctly with ultra hd video icon 1`] = `
     </View>
     <Ionicons
       color="#111714"
-      name="ios-arrow-forward"
+      name="ios-chevron-forward-outline"
       size={18}
       style={
         Object {
@@ -1744,7 +1744,7 @@ exports[`EmissionsListItem renders correctly with whiteMeat icon 1`] = `
     </View>
     <Ionicons
       color="#111714"
-      name="ios-arrow-forward"
+      name="ios-chevron-forward-outline"
       size={18}
       style={
         Object {
diff --git a/app/screens/Settings/components/SettingsRow/__tests__/__snapshots__/SettingsRow.test.tsx.snap b/app/screens/Settings/components/SettingsRow/__tests__/__snapshots__/SettingsRow.test.tsx.snap
index 364acab1..39d13730 100644
--- a/app/screens/Settings/components/SettingsRow/__tests__/__snapshots__/SettingsRow.test.tsx.snap
+++ b/app/screens/Settings/components/SettingsRow/__tests__/__snapshots__/SettingsRow.test.tsx.snap
@@ -20,7 +20,7 @@ exports[`SettingsRow renders correctly 1`] = `
   </Text.Secondary>
   <Ionicons
     color="#111714"
-    name="ios-arrow-forward"
+    name="ios-chevron-forward-outline"
     size={20}
   />
 </TouchableOpacity>