Front: type-check navigator + lint and pretty

front/Navigation.tsx

@@ -210,7 +210,7 @@ const ProfileErrorView = (props: { onTryAgain: () => void }) => {
 				<TextButton
 					onPress={() => {
 						dispatch(unsetAccessToken());
-						navigation.navigate('Start');
+						navigation.navigate('Login');
 					}}
 					colorScheme="error"
 					variant="outline"

front/components/CompetenciesTable.tsx

@@ -15,7 +15,7 @@ type CompetenciesTableProps = {
 const CompetenciesTable = (props: CompetenciesTableProps) => {
 	const navigation = useNavigation();
 	return (
-		<Card padding={5} onPress={() => navigation.navigate('User')} shadow={3}>
+		<Card padding={5} onPress={() => navigation.navigate('User', {})} shadow={3}>
 			<HStack space={5} flex={1}>
 				<VStack space={5}>
 					{Object.keys(props).map((competencyName, i) => (

front/components/Loading.tsx

@@ -1,8 +1,5 @@
 import { useTheme } from 'native-base';
 import { Center, Spinner } from 'native-base';
-import useColorScheme from '../hooks/colorScheme';
-import { DefaultTheme, DarkTheme } from '@react-navigation/native';
-import { useMemo } from 'react';
 const LoadingComponent = () => {
 	const theme = useTheme();
 	return <Spinner color={theme.colors.primary[500]} />;

front/components/ProgressBar.tsx

@@ -14,7 +14,7 @@ const ProgressBar = ({ xp }: { xp: number }) => {
 	const nav = useNavigation();
 
 	return (
-		<Card w="100%" onPress={() => nav.navigate('User')}>
+		<Card w="100%" onPress={() => nav.navigate('User', {})}>
 			<Stack padding={4} space={2} direction="row" alignItems="center">
 				<UserAvatar />
 				<VStack alignItems={'center'} flexGrow={1} space={2}>

front/components/UI/LinkBase.tsx

@@ -10,7 +10,6 @@ interface LinkBaseProps {
 const LinkBase: React.FC<LinkBaseProps> = ({ text, onPress }) => {
 	const underlineHeight = useRef(new Animated.Value(4)).current;
 	const opacity = useRef(new Animated.Value(1)).current;
-	const color = useRef(new Animated.Value(1)).current;
 	const theme = useTheme();
 
 	const handleMouseEnter = () => {

front/components/UI/LogoutButtonCC.tsx

@@ -1,16 +1,14 @@
-import { Text, Row, Heading, Column, Center } from 'native-base';
 import ButtonBase, { ButtonType } from './ButtonBase';
-import { CloseSquare, LoginCurve, LogoutCurve } from 'iconsax-react-native';
+import { LogoutCurve } from 'iconsax-react-native';
 import { useDispatch } from 'react-redux';
 import { translate } from '../../i18n/i18n';
 import { unsetAccessToken } from '../../state/UserSlice';
-import { BlurView } from 'expo-blur';
 import { useState } from 'react';
-import Modal from 'react-native-modal';
 import React from 'react';
 import SignUpForm from '../../components/forms/signupform';
 import API, { APIError } from '../../API';
 import PopupCC from './PopupCC';
+import { StyleProp, ViewStyle } from 'react-native';
 
 const handleSubmit = async (username: string, password: string, email: string) => {
 	try {
@@ -26,7 +24,7 @@ const handleSubmit = async (username: string, password: string, email: string) =
 type LogoutButtonCCProps = {
 	collapse?: boolean;
 	isGuest?: boolean;
-	style: any;
+	style: StyleProp<ViewStyle>;
 	buttonType: ButtonType;
 };
 

front/components/UI/PopupCC.tsx

@@ -1,7 +1,6 @@
 import { Text, Row, Heading, Column } from 'native-base';
 import ButtonBase from './ButtonBase';
 import { CloseSquare } from 'iconsax-react-native';
-import { BlurView } from 'expo-blur';
 import { ReactNode } from 'react';
 import Modal from 'react-native-modal';
 import React from 'react';

front/components/UI/Scaffold.tsx

@@ -168,7 +168,7 @@ const ScaffoldCC = (props: ScaffoldCCProps) => {
 							type="menu"
 							isDisabled={props.routeName === 'Settings'}
 							iconVariant={props.routeName === 'Settings' ? 'Bold' : 'Outline'}
-							onPress={async () => navigation.navigate('Settings')}
+							onPress={async () => navigation.navigate('Settings', {})}
 						/>
 						<Spacer />
 						{!user.isGuest && (

front/components/UI/ScaffoldAuth.tsx

@@ -52,6 +52,7 @@ const ScaffoldAuth: FunctionComponent<ScaffoldAuthProps> = ({
 		colorScheme == 'light'
 			? require('../../assets/icon_light.png')
 			: require('../../assets/icon_dark.png');
+	// eslint-disable-next-line @typescript-eslint/no-var-requires
 	const [banner] = useAssets(require('../../assets/banner.jpg'));
 
 	return (

front/components/UI/ScaffoldDesktopCC.tsx

@@ -1,9 +1,9 @@
-import { View, Image, useWindowDimensions } from 'react-native';
-import { Divider, Text, ScrollView, Flex, Row, useMediaQuery, useTheme } from 'native-base';
+/* eslint-disable no-mixed-spaces-and-tabs */
+import { View, Image } from 'react-native';
+import { Divider, Text, ScrollView, Row, useMediaQuery, useTheme } from 'native-base';
 import { useQuery, useQueries } from '../../Queries';
 import API from '../../API';
 import Song from '../../models/Song';
-import { LinearGradient } from 'expo-linear-gradient';
 import ButtonBase from './ButtonBase';
 import { Icon } from 'iconsax-react-native';
 import { LoadingView } from '../Loading';
@@ -13,8 +13,6 @@ import Spacer from './Spacer';
 import User from '../../models/User';
 import LogoutButtonCC from './LogoutButtonCC';
 import GlassmorphismCC from './Glassmorphism';
-import { ColorSchemeProvider } from '../../Theme';
-import useColorScheme from '../../hooks/colorScheme';
 
 type ScaffoldDesktopCCProps = {
 	widthPadding: boolean;

front/components/UI/ScaffoldMobileCC.tsx

@@ -1,3 +1,4 @@
+/* eslint-disable no-mixed-spaces-and-tabs */
 import { View } from 'react-native';
 import { ScrollView, Flex, useMediaQuery, useTheme } from 'native-base';
 import ButtonBase from './ButtonBase';

front/components/UI/TextFieldBase.tsx

@@ -3,7 +3,6 @@ import React, { useState } from 'react';
 import { View, TouchableOpacity, StyleSheet, StyleProp, ViewStyle } from 'react-native';
 import InteractiveBase from './InteractiveBase';
 import { Input, useTheme } from 'native-base';
-import { ColorSchemeProvider } from '../../Theme';
 import useColorScheme from '../../hooks/colorScheme';
 
 export interface TextFieldBaseProps {

front/views/ErrorView.tsx

@@ -8,7 +8,7 @@ const ErrorView = () => {
 		<Center style={{ flexGrow: 1 }}>
 			<VStack space={3} alignItems="center">
 				<Translate translationKey="anErrorOccured" />
-				<Button onPress={() => navigation.navigate('Home')}>
+				<Button onPress={() => navigation.navigate('Home', {})}>
 					<Translate translationKey="goBackHome" />
 				</Button>
 			</VStack>

front/views/ForgotPasswordView.tsx

@@ -12,7 +12,7 @@ const ForgotPasswordView = () => {
 				route: `/auth/forgot-password?email=${email}`,
 				method: 'PUT',
 			});
-			navigation.navigate('Home');
+			navigation.navigate('Home', {});
 			return 'email sent';
 		} catch {
 			return 'Error with email, please contact support';

front/views/HomeView.tsx

@@ -13,6 +13,7 @@ import Song from '../models/Song';
 import { FontAwesome5 } from '@expo/vector-icons';
 import ScaffoldCC from '../components/UI/ScaffoldCC';
 
+// eslint-disable-next-line @typescript-eslint/ban-types
 const HomeView = (props: RouteProps<{}>) => {
 	const navigation = useNavigation();
 	const userQuery = useQuery(API.getUserInfo);
@@ -135,13 +136,13 @@ const HomeView = (props: RouteProps<{}>) => {
 							translate={{ translationKey: 'settingsBtn' }}
 							colorScheme="gray"
 							size="sm"
-							onPress={() => navigation.navigate('Settings')}
+							onPress={() => navigation.navigate('Settings', {})}
 						/>
 						<TextButton
 							label={'V2'}
 							colorScheme="gray"
 							size="sm"
-							onPress={() => navigation.navigate('HomeNew')}
+							onPress={() => navigation.navigate('HomeNew', {})}
 						/>
 					</HStack>
 					<Box style={{ width: '100%' }}>

front/views/PasswordResetView.tsx

@@ -17,7 +17,7 @@ const PasswordResetView = () => {
 					password,
 				},
 			});
-			navigation.navigate('Home');
+			navigation.navigate('Home', {});
 			return 'password succesfully reset';
 		} catch {
 			return 'password reset failed';

front/views/PlayView.tsx

@@ -136,7 +136,7 @@ const PlayView = ({ songId, type, route }: RouteProps<PlayViewProps>) => {
 		stopwatch.stop();
 		if (webSocket.current?.readyState != WebSocket.OPEN) {
 			console.warn('onEnd: Websocket not open');
-			navigation.dispatch(StackActions.replace('Home'));
+			navigation.dispatch(StackActions.replace('Home', {}));
 			return;
 		}
 		webSocket.current?.send(

front/views/ProfileView.tsx

@@ -19,6 +19,7 @@ function xpToProgressBarValue(xp: number): number {
 	return Math.floor(xp / 10);
 }
 
+// eslint-disable-next-line @typescript-eslint/ban-types
 const ProfileView = (props: RouteProps<{}>) => {
 	const layout = useWindowDimensions();
 	const navigation = useNavigation();
@@ -70,7 +71,7 @@ const ProfileView = (props: RouteProps<{}>) => {
 								title="Modifier profil"
 								style={{ width: 'fit-content' }}
 								type={'filled'}
-								onPress={async () => navigation.navigate('Settings')}
+								onPress={async () => navigation.navigate('Settings', {})}
 							/>
 						</Wrap>
 						<Text style={{ paddingBottom: 10, fontWeight: 'bold' }}>

front/views/ScoreView.tsx

@@ -163,7 +163,7 @@ const ScoreView = (props: RouteProps<ScoreViewProps>) => {
 					<TextButton
 						colorScheme="gray"
 						translate={{ translationKey: 'backBtn' }}
-						onPress={() => navigation.navigate('Home')}
+						onPress={() => navigation.navigate('Home', {})}
 					/>
 					<TextButton
 						onPress={() => navigation.navigate('Song', { songId })}

front/views/V2/DiscoveryView.tsx

@@ -46,6 +46,7 @@ const cards = [
 	},
 ] as [HomeCardProps, HomeCardProps, HomeCardProps, HomeCardProps];
 
+// eslint-disable-next-line @typescript-eslint/ban-types
 const HomeView = (props: RouteProps<{}>) => {
 	const songsQuery = useQuery(API.getSongSuggestions);
 	const screenSize = useBreakpointValue({ base: 'small', md: 'big' });

front/views/VerifiedView.tsx

@@ -17,7 +17,7 @@ const VerifiedView = () => {
 					route: `/auth/verify?token=${(route.params as any).token}`,
 					method: 'PUT',
 				});
-				navigation.navigate('Home');
+				navigation.navigate('Home', {});
 			} catch {
 				setFailed(true);
 			}

front/views/settings/NotificationsSettings.tsx

@@ -1,5 +1,4 @@
 import React from 'react';
-import { Flex } from 'native-base';
 import { translate } from '../../i18n/i18n';
 import ElementList from '../../components/GtkUI/ElementList';
 import useUserSettings from '../../hooks/userSettings';

front/views/settings/PreferencesSettings.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
 import { useDispatch } from 'react-redux';
-import { Column, Flex } from 'native-base';
+import { Column } from 'native-base';
 import { useLanguage } from '../../state/LanguageSlice';
 import { AvailableLanguages, DefaultLanguage, translate } from '../../i18n/i18n';
 import { useSelector } from '../../state/Store';

front/views/settings/PrivacySettings.tsx

@@ -1,5 +1,4 @@
 import React from 'react';
-import { Flex } from 'native-base';
 import { translate } from '../../i18n/i18n';
 import ElementList from '../../components/GtkUI/ElementList';
 import { useDispatch } from 'react-redux';

front/views/settings/SettingsPremium.tsx

@@ -1,6 +1,5 @@
 import API from '../../API';
 import React from 'react';
-import { Flex } from 'native-base';
 import { LoadingView } from '../../components/Loading';
 import ElementList from '../../components/GtkUI/ElementList';
 import { translate } from '../../i18n/i18n';

front/views/settings/SettingsProfile.tsx

@@ -1,6 +1,6 @@
 import API from '../../API';
 import React from 'react';
-import { Column, Flex, Toast } from 'native-base';
+import { Column, Toast } from 'native-base';
 import { LoadingView } from '../../components/Loading';
 import ElementList from '../../components/GtkUI/ElementList';
 import { translate } from '../../i18n/i18n';
@@ -10,8 +10,6 @@ import { Google, PasswordCheck, SmsEdit, UserSquare, Verify } from 'iconsax-reac
 import ChangeEmailForm from '../../components/forms/changeEmailForm';
 import ChangePasswordForm from '../../components/forms/changePasswordForm';
 import LogoutButtonCC from '../../components/UI/LogoutButtonCC';
-import Spacer from '../../components/UI/Spacer';
-import { ColorSchemeProvider } from '../../Theme';
 import useColorScheme from '../../hooks/colorScheme';
 
 const handleChangeEmail = async (newEmail: string): Promise<string> => {

front/views/settings/SettingsView.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { Center, Flex, Text, useTheme } from 'native-base';
+import { Center, Text, useTheme } from 'native-base';
 import ProfileSettings from './SettingsProfile';
 import NotificationsSettings from './NotificationsSettings';
 import PrivacySettings from './PrivacySettings';
@@ -26,7 +26,6 @@ import { Scene } from 'react-native-tab-view/lib/typescript/src/types';
 import PremiumSettings from './SettingsPremium';
 import { RouteProps } from '../../Navigation';
 import ScaffoldCC from '../../components/UI/ScaffoldCC';
-import { ColorSchemeProvider } from '../../Theme';
 import useColorScheme from '../../hooks/colorScheme';
 import { translate } from '../../i18n/i18n';
 
@@ -66,6 +65,7 @@ const getTabData = (key: string) => {
 	}
 };
 
+// eslint-disable-next-line @typescript-eslint/ban-types
 const SetttingsNavigator = (props: RouteProps<{}>) => {
 	const layout = useWindowDimensions();
 	const [index, setIndex] = React.useState(0);