feat: 🎸 bump to RN 0.66 + upgrade dependencies (kolplattformen#521)

Co-authored-by: Erik Hellman <erik.hellman@hellsoft.se> Co-authored-by: Viktor Sarström <viktorsarstrom@gmail.com> Co-authored-by: Jonathan Edenström <jonathan@edenstrom.io>
imzeeshan · Dec 16, 2021 · f05ff64 · f05ff64
1 parent 22f5746
commit f05ff64
Show file tree

Hide file tree

Showing 42 changed files with 5,263 additions and 18,098 deletions.
diff --git a/.gitignore b/.gitignore
@@ -108,4 +108,5 @@ secrets.yaml
 requests
 xcshareddata
 xcuserdata
-/.vs
+/.vs
+*.hprof
diff --git a/apps/api-test-app/project.json b/apps/api-test-app/project.json
@@ -0,0 +1,46 @@
+{
+  "root": "apps/api-test-app",
+  "sourceRoot": "apps/api-test-app/src",
+  "projectType": "application",
+  "targets": {
+    "build": {
+      "executor": "@nrwl/node:build",
+      "outputs": ["{options.outputPath}"],
+      "options": {
+        "outputPath": "dist/apps/api-test-app",
+        "main": "apps/api-test-app/src/main.js",
+        "tsConfig": "apps/api-test-app/tsconfig.app.json",
+        "assets": ["apps/api-test-app/src/assets"]
+      },
+      "configurations": {
+        "production": {
+          "optimization": true,
+          "extractLicenses": true,
+          "inspect": false,
+          "fileReplacements": [
+            {
+              "replace": "apps/api-test-app/src/environments/environment.js",
+              "with": "apps/api-test-app/src/environments/environment.prod.js"
+            }
+          ]
+        }
+      }
+    },
+    "serve": {
+      "executor": "@nrwl/node:execute",
+      "options": {
+        "buildTarget": "api-test-app:build",
+        "watch": false,
+        "inspect": false
+      }
+    },
+    "lint": {
+      "executor": "@nrwl/linter:eslint",
+      "outputs": ["{options.outputFile}"],
+      "options": {
+        "lintFilePatterns": ["apps/api-test-app/**/*.js"]
+      }
+    }
+  },
+  "tags": []
+}
diff --git a/apps/skolplattformen-app/.flowconfig b/apps/skolplattformen-app/.flowconfig
@@ -67,4 +67,4 @@ untyped-import
 untyped-type-import
 
 [version]
-^0.137.0
+^0.158.0
diff --git a/apps/skolplattformen-app/android/app/build.gradle b/apps/skolplattformen-app/android/app/build.gradle
@@ -121,6 +121,11 @@ def jscFlavor = 'org.webkit:android-jsc:+'
  */
 def enableHermes = project.ext.react.get("enableHermes", false);
 
+/**
+ * Architectures to build native code for in debug.
+ */
+def nativeArchitectures = project.getProperties().get("reactNativeDebugArchitectures")
+
 android {
     compileSdkVersion rootProject.ext.compileSdkVersion
 
@@ -161,6 +166,12 @@ android {
     buildTypes {
         debug {
             signingConfig signingConfigs.debug
+            if (nativeArchitectures) {
+                ndk {
+                    abiFilters nativeArchitectures.split(',')
+                }
+            }
+
         }
         release {
             // Caution! In production, you need to generate your own keystore file.
@@ -195,7 +206,7 @@ dependencies {
     implementation "androidx.swiperefreshlayout:swiperefreshlayout:1.1.0"
 
     debugImplementation("com.facebook.flipper:flipper:${FLIPPER_VERSION}") {
-      exclude group:'com.facebook.fbjni'
+        exclude group:'com.facebook.fbjni'
     }
 
     debugImplementation("com.facebook.flipper:flipper-network-plugin:${FLIPPER_VERSION}") {

diff --git a/apps/skolplattformen-app/android/build.gradle b/apps/skolplattformen-app/android/build.gradle
@@ -6,14 +6,14 @@ buildscript {
         minSdkVersion = 21
         compileSdkVersion = 30
         targetSdkVersion = 30
-        ndkVersion = "20.1.5948944"
+        ndkVersion = "21.4.7075529"
     }
     repositories {
         google()
         mavenCentral()
     }
     dependencies {
-        classpath("com.android.tools.build:gradle:4.2.1")
+        classpath("com.android.tools.build:gradle:4.2.2")
         // NOTE: Do not place your application dependencies here; they belong
         // in the individual module build.gradle files
     }
@@ -43,4 +43,4 @@ subprojects {
             force 'androidx.vectordrawable:vectordrawable-animated:1.1.0'
         }
     }
-}
+}
diff --git a/apps/skolplattformen-app/android/gradle.properties b/apps/skolplattformen-app/android/gradle.properties
@@ -11,7 +11,7 @@
 # http://www.gradle.org/docs/current/userguide/multi_project_builds.html#sec:decoupled_projects
 # org.gradle.parallel=true
 #Thu Apr 01 10:00:57 CEST 2021
-FLIPPER_VERSION=0.93.0
+FLIPPER_VERSION=0.99.0
 android.enableJetifier=true
 android.useAndroidX=true
 org.gradle.jvmargs=-Xmx2048M -Dkotlin.daemon.jvm.options\="-Xmx2048M"
diff --git a/apps/skolplattformen-app/components/absence.component.tsx b/apps/skolplattformen-app/components/absence.component.tsx
@@ -1,4 +1,5 @@
 import { RouteProp, useRoute } from '@react-navigation/native'
+import { NativeStackNavigationOptions } from '@react-navigation/native-stack'
 import { useUser } from '@skolplattformen/hooks'
 import {
   Button,
@@ -14,7 +15,6 @@ import Personnummer from 'personnummer'
 import React, { useCallback } from 'react'
 import { View } from 'react-native'
 import DateTimePickerModal from 'react-native-modal-datetime-picker'
-import { NativeStackNavigationOptions } from 'react-native-screens/native-stack'
 import * as Yup from 'yup'
 import { defaultStackStyling } from '../design/navigationThemes'
 import usePersonalStorage from '../hooks/usePersonalStorage'
@@ -48,7 +48,7 @@ export const absenceRouteOptions =
     const child = route.params.child
     return {
       ...defaultStackStyling(darkMode),
-      headerCenter: () => (
+      headerTitle: () => (
         <NavigationTitle
           title={translate('abscense.title')}
           subtitle={studentName(child?.name)}
@@ -191,9 +191,6 @@ const Absence = () => {
                     confirmTextIOS={translate('general.confirm')}
                     date={moment(values.startTime).toDate()}
                     isVisible={values.displayStartTimePicker}
-                    headerTextIOS={translate(
-                      'abscense.selectAbscenseStartTime'
-                    )}
                     locale="sv-SE"
                     maximumDate={maximumDate.toDate()}
                     minimumDate={minumumDate.toDate()}
@@ -225,7 +222,6 @@ const Absence = () => {
                     confirmTextIOS={translate('general.confirm')}
                     date={moment(values.endTime).toDate()}
                     isVisible={values.displayEndTimePicker}
-                    headerTextIOS={translate('abscense.selectAbscenseEndTime')}
                     // Todo fix this
                     locale="sv-SE"
                     maximumDate={maximumDate.toDate()}

diff --git a/apps/skolplattformen-app/components/auth.component.tsx b/apps/skolplattformen-app/components/auth.component.tsx
@@ -1,3 +1,4 @@
+import { NativeStackNavigationOptions } from '@react-navigation/native-stack'
 import { StackNavigationProp } from '@react-navigation/stack'
 import {
   StyleService,
@@ -14,7 +15,6 @@ import {
   TouchableWithoutFeedback,
   View,
 } from 'react-native'
-import { NativeStackNavigationOptions } from 'react-native-screens/native-stack'
 import { useTranslation } from '../hooks/useTranslation'
 import { Layout as LayoutStyle, Sizing, Typography } from '../styles'
 import { fontSize } from '../styles/typography'
@@ -43,8 +43,8 @@ interface AuthProps {
 export const authRouteOptions = (): NativeStackNavigationOptions => {
   return {
     headerShown: false,
-    replaceAnimation: 'push',
-    stackAnimation: 'fade',
+    animationTypeForReplace: 'push',
+    animation: 'fade',
   }
 }
 

diff --git a/apps/skolplattformen-app/components/child.component.tsx b/apps/skolplattformen-app/components/child.component.tsx
@@ -5,24 +5,24 @@ import {
   useNavigation,
   useRoute,
 } from '@react-navigation/native'
+import { NativeStackNavigationOptions } from '@react-navigation/native-stack'
 import { StackNavigationProp } from '@react-navigation/stack'
 import { Icon } from '@ui-kitten/components'
 import React, { useEffect } from 'react'
 import { StyleProp, TextProps } from 'react-native'
-import { NativeStackNavigationOptions } from 'react-native-screens/native-stack'
 import { defaultStackStyling } from '../design/navigationThemes'
+import { useFeature } from '../hooks/useFeature'
 import { studentName } from '../utils/peopleHelpers'
 import { translate } from '../utils/translation'
 import { Calendar } from './calendar.component'
 import { ChildProvider } from './childContext.component'
+import { Classmates } from './classmates.component'
 import { Menu } from './menu.component'
 import { RootStackParamList } from './navigation.component'
 import { NavigationTitle } from './navigationTitle.component'
 import { NewsList } from './newsList.component'
 import { NotificationsList } from './notificationsList.component'
-import { Classmates } from './classmates.component'
 import { TabBarLabel } from './tabBarLabel.component'
-import { useFeature } from '../hooks/useFeature'
 
 type ChildNavigationProp = StackNavigationProp<RootStackParamList, 'Child'>
 type ChildRouteProps = RouteProp<RootStackParamList, 'Child'>
@@ -95,35 +95,44 @@ const TabNavigator = ({
       <Screen
         name="News"
         component={NewsScreen}
-        options={{ title: translate('navigation.news') }}
+        options={{ title: translate('navigation.news'), headerShown: false }}
       />
     )}
     {screenSettings.NOTIFICATIONS_SCREEN && (
       <Screen
         name="Notifications"
         component={NotificationsScreen}
-        options={{ title: translate('navigation.notifications') }}
+        options={{
+          title: translate('navigation.notifications'),
+          headerShown: false,
+        }}
       />
     )}
     {screenSettings.CALENDER_SCREEN && (
       <Screen
         name="Calendar"
         component={CalendarScreen}
-        options={{ title: translate('navigation.calender') }}
+        options={{
+          title: translate('navigation.calender'),
+          headerShown: false,
+        }}
       />
     )}
     {screenSettings.MENU_SCREEN && (
       <Screen
         name="Menu"
         component={MenuScreen}
-        options={{ title: translate('navigation.menu') }}
+        options={{ title: translate('navigation.menu'), headerShown: false }}
       />
     )}
     {screenSettings.CLASSMATES_SCREEN && (
       <Screen
         name="Classmates"
         component={ClassmatesScreen}
-        options={{ title: translate('navigation.classmates') }}
+        options={{
+          title: translate('navigation.classmates'),
+          headerShown: false,
+        }}
       />
     )}
   </Navigator>
@@ -162,7 +171,7 @@ export const childRouteOptions =
 
     return {
       ...defaultStackStyling(darkMode),
-      headerCenter: () => (
+      headerTitle: () => (
         <NavigationTitle
           title={getHeaderTitle(route)}
           subtitle={studentName(child?.name)}

diff --git a/apps/skolplattformen-app/components/children.component.tsx b/apps/skolplattformen-app/components/children.component.tsx
@@ -1,4 +1,5 @@
-import { useNavigation } from '@react-navigation/core'
+import { NavigationProp, useNavigation } from '@react-navigation/core'
+import { NativeStackNavigationOptions } from '@react-navigation/native-stack'
 import { Child } from '@skolplattformen/api'
 import { useApi, useChildList } from '@skolplattformen/hooks'
 import {
@@ -19,13 +20,13 @@ import {
   ListRenderItemInfo,
   View,
 } from 'react-native'
-import { NativeStackNavigationOptions } from 'react-native-screens/native-stack'
 import { defaultStackStyling } from '../design/navigationThemes'
 import AppStorage from '../services/appStorage'
-import { Colors, Layout as LayoutStyle, Sizing, Typography } from '../styles'
+import { Layout as LayoutStyle, Sizing, Typography } from '../styles'
 import { translate } from '../utils/translation'
 import { ChildListItem } from './childListItem.component'
-import { SettingsIcon, RefreshIcon } from './icon.component'
+import { RefreshIcon, SettingsIcon } from './icon.component'
+import { RootStackParamList } from './navigation.component'
 
 const colors = ['primary', 'success', 'info', 'warning', 'danger']
 
@@ -35,14 +36,14 @@ export const childenRouteOptions =
       ...defaultStackStyling(darkMode),
       title: translate('children.title'),
       headerLargeTitle: true,
-      headerLargeTitleHideShadow: true,
+      headerLargeTitleShadowVisible: false,
     }
   }
 
 export const Children = () => {
   const styles = useStyleSheet(themedStyles)
 
-  const navigation = useNavigation()
+  const navigation = useNavigation<NavigationProp<RootStackParamList>>()
 
   const { api } = useApi()
   const { data: childList, status, reload } = useChildList()

diff --git a/apps/skolplattformen-app/components/library.component.tsx b/apps/skolplattformen-app/components/library.component.tsx
@@ -3,7 +3,7 @@ import { StyleService, Text, useStyleSheet } from '@ui-kitten/components'
 import React from 'react'
 import { Linking, Platform } from 'react-native'
 import { ScrollView } from 'react-native-gesture-handler'
-import { NativeStackNavigationOptions } from 'react-native-screens/native-stack'
+import { NativeStackNavigationOptions } from '@react-navigation/native-stack'
 import { Layout, Sizing, Typography } from '../styles'
 import { fontSize } from '../styles/typography'
 import { RootStackParamList } from './navigation.component'

diff --git a/apps/skolplattformen-app/components/navigation.component.tsx b/apps/skolplattformen-app/components/navigation.component.tsx
@@ -1,4 +1,5 @@
 import { NavigationContainer } from '@react-navigation/native'
+import { createNativeStackNavigator } from '@react-navigation/native-stack'
 import {
   Child as ChildType,
   NewsItem as NewsItemType,
@@ -8,7 +9,6 @@ import { useTheme } from '@ui-kitten/components'
 import { Library } from 'libraries.json'
 import React, { useEffect } from 'react'
 import { StatusBar, useColorScheme } from 'react-native'
-import { createNativeStackNavigator } from 'react-native-screens/native-stack'
 import { schema } from '../app.json'
 import {
   darkNavigationTheme,
@@ -44,7 +44,7 @@ import {
 export type RootStackParamList = {
   Login: undefined
   Children: undefined
-  Settings: undefined
+  Settings: { rand?: number } | undefined
   SettingsAppearance: undefined
   SettingsAppearanceTheme: undefined
   SettingsLicenses: undefined

diff --git a/apps/skolplattformen-app/components/navigationTitle.component.tsx b/apps/skolplattformen-app/components/navigationTitle.component.tsx
@@ -19,7 +19,7 @@ export const NavigationTitle = ({ title, subtitle }: NavigationTitleProps) => {
           {title}
         </Text>
       )}
-      <Text style={styles.subtitle}>{subtitle}</Text>
+      {subtitle && <Text style={styles.subtitle}>{subtitle}</Text>}
     </View>
   )
 }

diff --git a/apps/skolplattformen-app/components/newsItem.component.tsx b/apps/skolplattformen-app/components/newsItem.component.tsx
@@ -1,4 +1,5 @@
 import { RouteProp } from '@react-navigation/native'
+import { NativeStackNavigationOptions } from '@react-navigation/native-stack'
 import { StackNavigationProp } from '@react-navigation/stack'
 import { useNewsDetails } from '@skolplattformen/hooks'
 import { StyleService, Text, useStyleSheet } from '@ui-kitten/components'
@@ -12,7 +13,6 @@ import {
   ScrollView,
   View,
 } from 'react-native'
-import { NativeStackNavigationOptions } from 'react-native-screens/native-stack'
 import { defaultStackStyling } from '../design/navigationThemes'
 import { Layout, Sizing, Typography } from '../styles'
 import { studentName } from '../utils/peopleHelpers'
@@ -43,10 +43,7 @@ export const newsItemRouteOptions =
     const { child } = route.params
     return {
       ...defaultStackStyling(darkMode),
-      headerCenter: () => (
-        <NavigationTitle subtitle={studentName(child?.name)} />
-      ),
-      headerLargeTitle: false,
+      headerTitle: () => <NavigationTitle title={studentName(child?.name)} />,
     }
   }