wip: password reset routes

.env.example

@@ -10,6 +10,5 @@ SCORO_URL=ws://localhost:6543
 GOOGLE_CLIENT_ID=toto
 GOOGLE_SECRET=tata
 GOOGLE_CALLBACK_URL=http://localhost:19006/logged/google
-SMTP_TRANSPORT=smtps://toto:tata@relay
+SMTP_TRANSPORT=
 MAIL_AUTHOR='"Chromacase" <chromacase@octohub.app>'
-IGNORE_MAILS=true

.github/workflows/CI.yml

@@ -93,7 +93,7 @@ jobs:
         run: |
           docker-compose ps -a
           docker-compose logs
-          wget --retry-connrefused http://localhost:3000 || (docker-compose logs && exit 1)
+          wget --retry-connrefused http://localhost:3000 # /healthcheck
 
       - name: Run scorometer tests
         run: |

.gitignore

@@ -13,4 +13,3 @@ log.html
 node_modules/
 ./front/coverage
 .venv
-.DS_Store

assets/populate.py

@@ -1,4 +1,4 @@
-#!/usr/bin/env python3
+#!/bin/env python3
 
 import sys
 import os

back/src/auth/auth.controller.ts

@@ -79,6 +79,22 @@ export class AuthController {
 		}
 	}
 
+	@HttpCode(200)
+	@UseGuards(JwtAuthGuard)
+	@Put('reset')
+	async password_reset(@Request() req: any, @Query('token') token: string): Promise<void> {
+		if (await this.authService.resetPassword(req.user.id, token))
+			return;
+		throw new BadRequestException("Invalid token. Expired or invalid.");
+	}
+
+	@HttpCode(200)
+	@UseGuards(JwtAuthGuard)
+	@Put('send-reset')
+	async send_reset(@Request() req: any): Promise<void> {
+		await this.authService.sendResetMail(req.user);
+	}
+
 	@HttpCode(200)
 	@UseGuards(JwtAuthGuard)
 	@Put('verify')

back/src/auth/auth.service.ts

@@ -36,7 +36,6 @@ export class AuthService {
 	}
 
 	async sendVerifyMail(user: User) {
-		if (process.env.IGNORE_MAILS === "true") return;
 		const token = await this.jwtService.signAsync(
 			{
 				userId: user.id,

back/src/song/song.service.ts

@@ -6,14 +6,6 @@ import { PrismaService } from 'src/prisma/prisma.service';
 export class SongService {
 	constructor(private prisma: PrismaService) {}
 
-	async songByArtist(data: number): Promise<Song[]> {
-		return this.prisma.song.findMany({
-			where: {
-				artistId: {equals: data},
-			},
-		});
-	}
-
 	async createSong(data: Prisma.SongCreateInput): Promise<Song> {
 		return this.prisma.song.create({
 			data,

front/API.ts

@@ -21,7 +21,7 @@ import { PlageHandler } from './models/Plage';
 import { ListHandler } from './models/List';
 import { AccessTokenResponseHandler } from './models/AccessTokenResponse';
 import * as yup from 'yup';
-import { base64ToBlob } from './utils/base64ToBlob';
+import { base64ToBlob } from 'file64';
 import { ImagePickerAsset } from 'expo-image-picker';
 
 type AuthenticationInput = { username: string; password: string };
@@ -287,43 +287,6 @@ export default class API {
 				),
 		};
 	}
-
-	/**
-	 * @description retrieves songs from a specific artist
-	 * @param artistId is the id of the artist that composed the songs aimed
-	 * @returns a Promise of Songs type array
-	 */
-	public static getSongsByArtist(artistId: number): Query<Song[]> {
-		return {
-			key: ['artist', artistId, 'songs'],
-			exec: () =>
-				API.fetch(
-					{
-						route: `/song?artistId=${artistId}`,
-					},
-					{ handler: PlageHandler(SongHandler) }
-				).then(({ data }) => data),
-		};
-	}
-
-	/**
-	 *  Retrieves all songs corresponding to the given genre ID
-	 * @param genreId the id of the genre we're aiming
-	 * @returns a promise of an array of Songs
-	 */
-	public static getSongsByGenre(genreId: number): Query<Song[]> {
-		return {
-			key: ['genre', genreId, 'songs'],
-			exec: () =>
-				API.fetch(
-					{
-						route: `/song?genreId=${genreId}`,
-					},
-					{ handler: PlageHandler(SongHandler) }
-				).then(({ data }) => data),
-		};
-	}
-
 	/**
 	 * Retrive a song's midi partition
 	 * @param songId the id to find the song
@@ -359,23 +322,6 @@ export default class API {
 		return `${API.baseUrl}/genre/${genreId}/illustration`;
 	}
 
-	/**
-	 * Retrieves a genre
-	 * @param genreId the id of the aimed genre
-	 */
-	public static getGenre(genreId: number): Query<Genre> {
-		return {
-			key: ['genre', genreId],
-			exec: () =>
-				API.fetch(
-					{
-						route: `/genre/${genreId}`,
-					},
-					{ handler: GenreHandler }
-				),
-		};
-	}
-
 	/**
 	 * Retrive a song's musicXML partition
 	 * @param songId the id to find the song

front/Navigation.tsx

@@ -28,7 +28,6 @@ import { Button, Center, VStack } from 'native-base';
 import { unsetAccessToken } from './state/UserSlice';
 import TextButton from './components/TextButton';
 import ErrorView from './views/ErrorView';
-import GenreDetailsView from './views/GenreDetailsView';
 import GoogleView from './views/GoogleView';
 import VerifiedView from './views/VerifiedView';
 
@@ -61,11 +60,6 @@ const protectedRoutes = () =>
 			options: { title: translate('artistFilter') },
 			link: '/artist/:artistId',
 		},
-		Genre: {
-			component: GenreDetailsView,
-			options: { title: translate('genreFilter') },
-			link: '/genre/:genreId',
-		},
 		Score: {
 			component: ScoreView,
 			options: { title: translate('score'), headerLeft: null },

front/components/RowCustom.tsx

@@ -1,34 +0,0 @@
-import { useColorScheme } from 'react-native';
-import { RootState, useSelector } from '../state/Store';
-import { Box, Pressable } from 'native-base';
-
-const RowCustom = (props: Parameters<typeof Box>[0] & { onPress?: () => void }) => {
-	const settings = useSelector((state: RootState) => state.settings.local);
-	const systemColorMode = useColorScheme();
-	const colorScheme = settings.colorScheme;
-
-	return (
-		<Pressable onPress={props.onPress}>
-			{({ isHovered, isPressed }) => (
-				<Box
-					{...props}
-					py={3}
-					my={1}
-					bg={
-						(colorScheme == 'system' ? systemColorMode : colorScheme) == 'dark'
-							? isHovered || isPressed
-								? 'gray.800'
-								: undefined
-							: isHovered || isPressed
-							? 'coolGray.200'
-							: undefined
-					}
-				>
-					{props.children}
-				</Box>
-			)}
-		</Pressable>
-	);
-};
-
-export default RowCustom;

front/components/SearchResult.tsx

@@ -1,16 +1,20 @@
 import React, { useMemo } from 'react';
 import {
+	HStack,
 	VStack,
 	Heading,
 	Text,
+	Pressable,
 	Box,
 	Card,
+	Image,
 	Flex,
 	useBreakpointValue,
 	Column,
 	ScrollView,
 } from 'native-base';
-import { SafeAreaView } from 'react-native';
+import { SafeAreaView, useColorScheme } from 'react-native';
+import { RootState, useSelector } from '../state/Store';
 import { SearchContext } from '../views/SearchView';
 import { useQueries, useQuery } from '../Queries';
 import { translate } from '../i18n/i18n';
@@ -20,11 +24,11 @@ import ArtistCard from './ArtistCard';
 import GenreCard from './GenreCard';
 import SongCard from './SongCard';
 import CardGridCustom from './CardGridCustom';
+import TextButton from './TextButton';
 import SearchHistoryCard from './HistoryCard';
 import Song, { SongWithArtist } from '../models/Song';
 import { useNavigation } from '../Navigation';
 import Artist from '../models/Artist';
-import SongRow from '../components/SongRow';
 
 const swaToSongCardProps = (song: SongWithArtist) => ({
 	songId: song.id,
@@ -33,6 +37,101 @@ const swaToSongCardProps = (song: SongWithArtist) => ({
 	cover: song.cover ?? 'https://picsum.photos/200',
 });
 
+const RowCustom = (props: Parameters<typeof Box>[0] & { onPress?: () => void }) => {
+	const settings = useSelector((state: RootState) => state.settings.local);
+	const systemColorMode = useColorScheme();
+	const colorScheme = settings.colorScheme;
+
+	return (
+		<Pressable onPress={props.onPress}>
+			{({ isHovered, isPressed }) => (
+				<Box
+					{...props}
+					py={3}
+					my={1}
+					bg={
+						(colorScheme == 'system' ? systemColorMode : colorScheme) == 'dark'
+							? isHovered || isPressed
+								? 'gray.800'
+								: undefined
+							: isHovered || isPressed
+							? 'coolGray.200'
+							: undefined
+					}
+				>
+					{props.children}
+				</Box>
+			)}
+		</Pressable>
+	);
+};
+
+type SongRowProps = {
+	song: Song | SongWithArtist; // TODO: remove Song
+	onPress: () => void;
+};
+
+const SongRow = ({ song, onPress }: SongRowProps) => {
+	return (
+		<RowCustom width={'100%'}>
+			<HStack px={2} space={5} justifyContent={'space-between'}>
+				<Image
+					flexShrink={0}
+					flexGrow={0}
+					pl={10}
+					style={{ zIndex: 0, aspectRatio: 1, borderRadius: 5 }}
+					source={{ uri: song.cover }}
+					alt={song.name}
+				/>
+				<HStack
+					style={{
+						display: 'flex',
+						flexShrink: 1,
+						flexGrow: 1,
+						alignItems: 'center',
+						justifyContent: 'flex-start',
+					}}
+					space={6}
+				>
+					<Text
+						style={{
+							flexShrink: 1,
+						}}
+						isTruncated
+						pl={10}
+						maxW={'100%'}
+						bold
+						fontSize="md"
+					>
+						{song.name}
+					</Text>
+					<Text
+						style={{
+							flexShrink: 0,
+						}}
+						fontSize={'sm'}
+					>
+						{song.artistId ?? 'artist'}
+					</Text>
+				</HStack>
+				<TextButton
+					flexShrink={0}
+					flexGrow={0}
+					translate={{ translationKey: 'playBtn' }}
+					colorScheme="primary"
+					variant={'outline'}
+					size="sm"
+					onPress={onPress}
+				/>
+			</HStack>
+		</RowCustom>
+	);
+};
+
+SongRow.defaultProps = {
+	onPress: () => {},
+};
+
 const HomeSearchComponent = () => {
 	const { updateStringQuery } = React.useContext(SearchContext);
 	const { isLoading: isLoadingHistory, data: historyData = [] } = useQuery(
@@ -153,17 +252,15 @@ const ArtistSearchComponent = (props: ItemSearchComponentProps) => {
 			</Text>
 			{artistData?.length ? (
 				<CardGridCustom
-					content={artistData
-						.slice(0, props.maxItems ?? artistData.length)
-						.map((artistData) => ({
-							image: API.getArtistIllustration(artistData.id),
-							name: artistData.name,
-							id: artistData.id,
-							onPress: () => {
-								API.createSearchHistoryEntry(artistData.name, 'artist');
-								navigation.navigate('Artist', { artistId: artistData.id });
-							},
-						}))}
+					content={artistData.slice(0, props.maxItems ?? artistData.length).map((a) => ({
+						image: API.getArtistIllustration(a.id),
+						name: a.name,
+						id: a.id,
+						onPress: () => {
+							API.createSearchHistoryEntry(a.name, 'artist');
+							navigation.navigate('Artist', { artistId: a.id });
+						},
+					}))}
 					cardComponent={ArtistCard}
 				/>
 			) : (
@@ -190,7 +287,7 @@ const GenreSearchComponent = (props: ItemSearchComponentProps) => {
 						id: g.id,
 						onPress: () => {
 							API.createSearchHistoryEntry(g.name, 'genre');
-							navigation.navigate('Genre', { genreId: g.id });
+							navigation.navigate('Home');
 						},
 					}))}
 					cardComponent={GenreCard}

front/components/SongRow.tsx

@@ -1,71 +0,0 @@
-import { HStack, Image, Text } from 'native-base';
-import Song, { SongWithArtist } from '../models/Song';
-import RowCustom from './RowCustom';
-import TextButton from './TextButton';
-
-type SongRowProps = {
-	song: Song | SongWithArtist; // TODO: remove Song
-	onPress: () => void;
-};
-
-const SongRow = ({ song, onPress }: SongRowProps) => {
-	return (
-		<RowCustom width={'100%'}>
-			<HStack px={2} space={5} justifyContent={'space-between'}>
-				<Image
-					flexShrink={0}
-					flexGrow={0}
-					pl={10}
-					style={{ zIndex: 0, aspectRatio: 1, borderRadius: 5 }}
-					source={{ uri: song.cover }}
-					alt={song.name}
-					borderColor={'white'}
-					borderWidth={1}
-				/>
-				<HStack
-					style={{
-						display: 'flex',
-						flexShrink: 1,
-						flexGrow: 1,
-						alignItems: 'center',
-						justifyContent: 'flex-start',
-					}}
-					space={6}
-				>
-					<Text
-						style={{
-							flexShrink: 1,
-						}}
-						isTruncated
-						pl={5}
-						maxW={'100%'}
-						bold
-						fontSize="md"
-					>
-						{song.name}
-					</Text>
-					<Text
-						style={{
-							flexShrink: 0,
-						}}
-						fontSize={'sm'}
-					>
-						{song.artistId ?? 'artist'}
-					</Text>
-				</HStack>
-				<TextButton
-					flexShrink={0}
-					flexGrow={0}
-					translate={{ translationKey: 'playBtn' }}
-					colorScheme="primary"
-					variant={'outline'}
-					size="sm"
-					mr={5}
-					onPress={onPress}
-				/>
-			</HStack>
-		</RowCustom>
-	);
-};
-
-export default SongRow;

front/components/UserAvatar.tsx

@@ -18,9 +18,10 @@ const UserAvatar = ({ size }: UserAvatarProps) => {
 		if (!user.data) {
 			return null;
 		}
-		// NOTE: We do this to avoid parsing URL with `new URL`, which is not compatible with related path
-		// (which is used for production, on web)
-		return `${user.data.data.avatar}?updatedAt=${user.dataUpdatedAt.toString()}`;
+		const url = new URL(user.data.data.avatar);
+
+		url.searchParams.append('updatedAt', user.dataUpdatedAt.toString());
+		return url;
 	}, [user.data]);
 
 	return (

front/i18n/Translations.ts

@@ -43,7 +43,6 @@ export const en = {
 	artistFilter: 'Artists',
 	songsFilter: 'Songs',
 	genreFilter: 'Genres',
-	favoriteFilter: 'Favorites',
 
 	// profile page
 	user: 'Profile',
@@ -183,7 +182,7 @@ export const en = {
 	noRecentSearches: 'No recent searches',
 	avatar: 'Avatar',
 	changeIt: 'Change It',
-	verified: 'Verified',
+	verified: "Verified",
 };
 
 export const fr: typeof en = {
@@ -233,7 +232,6 @@ export const fr: typeof en = {
 	artistFilter: 'Artistes',
 	songsFilter: 'Morceaux',
 	genreFilter: 'Genres',
-	favoriteFilter: 'Favoris',
 
 	// Difficulty settings
 	diffBtn: 'Difficulté',
@@ -369,7 +367,7 @@ export const fr: typeof en = {
 	noRecentSearches: 'Aucune recherche récente',
 	avatar: 'Avatar',
 	changeIt: 'Modifier',
-	verified: 'Verifié',
+	verified: "Verifié",
 };
 
 export const sp: typeof en = {
@@ -432,7 +430,6 @@ export const sp: typeof en = {
 	artistFilter: 'Artistas',
 	songsFilter: 'canciones',
 	genreFilter: 'géneros',
-	favoriteFilter: 'Favorites',
 
 	// Difficulty settings
 	diffBtn: 'Dificultad',
@@ -560,5 +557,5 @@ export const sp: typeof en = {
 
 	avatar: 'Avatar',
 	changeIt: 'Cambialo',
-	verified: 'Verified',
+	verified: "Verified"
 };

front/package.json

@@ -8,8 +8,8 @@
 		"ios": "expo start --ios",
 		"web": "expo start --web",
 		"eject": "expo eject",
-		"pretty:check": "prettier --check .",
-		"pretty:write": "prettier --write .",
+		"pretty:check": "prettier --check",
+		"pretty:write": "prettier --write",
 		"lint": "eslint .",
 		"test": "jest -i",
 		"test:cov": "jest -i --coverage",
@@ -40,6 +40,7 @@
 		"expo-secure-store": "~12.0.0",
 		"expo-splash-screen": "~0.17.5",
 		"expo-status-bar": "~1.4.2",
+		"file64": "^1.0.2",
 		"format-duration": "^2.0.0",
 		"i18next": "^21.8.16",
 		"install": "^0.13.0",

front/utils/base64ToBlob.ts

@@ -1,23 +0,0 @@
-// SRC: https://github.com/encrypit/file64/blob/master/src/base64-to-blob.ts
-export async function base64ToBlob(base64: string): Promise<Blob> {
-	const response = await fetch(base64);
-	let blob = await response.blob();
-	const mimeType = getMimeType(base64);
-	if (mimeType) {
-		// https://stackoverflow.com/a/50875615
-		blob = blob.slice(0, blob.size, mimeType);
-	}
-	return blob;
-}
-
-const mimeRegex = /^data:(.+);base64,/;
-
-/**
- * Gets MIME type from Base64.
- *
- * @param base64 - Base64.
- * @returns - MIME type.
- */
-function getMimeType(base64: string) {
-	return base64.match(mimeRegex)?.slice(1, 2).pop();
-}

front/views/ArtistDetailsView.tsx

@@ -1,58 +1,49 @@
-import { Box, Heading, useBreakpointValue, ScrollView } from 'native-base';
+import { VStack, Image, Heading, IconButton, Icon, Container } from 'native-base';
+import { Ionicons } from '@expo/vector-icons';
+import { SafeAreaView } from 'react-native';
 import { useQuery } from '../Queries';
 import { LoadingView } from '../components/Loading';
 import API from '../API';
-import Song from '../models/Song';
-import SongRow from '../components/SongRow';
-import { Key } from 'react';
-import { RouteProps, useNavigation } from '../Navigation';
-import { ImageBackground } from 'react-native';
+import { useNavigation } from '../Navigation';
+
+const handleFavorite = () => {};
 
 type ArtistDetailsViewProps = {
 	artistId: number;
 };
 
-const ArtistDetailsView = ({ artistId }: RouteProps<ArtistDetailsViewProps>) => {
-	const artistQuery = useQuery(API.getArtist(artistId));
-	const songsQuery = useQuery(API.getSongsByArtist(artistId));
-	const screenSize = useBreakpointValue({ base: 'small', md: 'big' });
-	const isMobileView = screenSize == 'small';
+const ArtistDetailsView = ({ artistId }: ArtistDetailsViewProps) => {
 	const navigation = useNavigation();
+	const { isLoading, data: artistData, isError } = useQuery(API.getArtist(artistId));
 
-	if (artistQuery.isError || songsQuery.isError) {
-		navigation.navigate('Error');
-		return <></>;
-	}
-	if (!artistQuery.data || songsQuery.data === undefined) {
+	if (isLoading) {
 		return <LoadingView />;
 	}
 
+	if (isError) {
+		navigation.navigate('Error');
+	}
+
 	return (
-		<ScrollView>
-			<ImageBackground
-				style={{ width: '100%', height: isMobileView ? 200 : 300 }}
-				source={{ uri: API.getArtistIllustration(artistQuery.data.id) }}
-			></ImageBackground>
-			<Box>
-				<Heading mt={-20} ml={3} fontSize={50}>
-					{artistQuery.data.name}
-				</Heading>
-				<ScrollView mt={3}>
-					<Box>
-						{songsQuery.data.map((comp: Song, index: Key | null | undefined) => (
-							<SongRow
-								key={index}
-								song={comp}
-								onPress={() => {
-									API.createSearchHistoryEntry(comp.name, 'song');
-									navigation.navigate('Song', { songId: comp.id });
-								}}
-							/>
-						))}
-					</Box>
-				</ScrollView>
-			</Box>
-		</ScrollView>
+		<SafeAreaView>
+			<Container m={3}>
+				<Image
+					source={{ uri: 'https://picsum.photos/200' }}
+					alt={artistData?.name}
+					size={20}
+					borderRadius="full"
+				/>
+				<VStack space={3}>
+					<Heading>{artistData?.name}</Heading>
+					<IconButton
+						icon={<Icon as={Ionicons} name="heart" size={6} color="red.500" />}
+						onPress={() => handleFavorite()}
+						variant="unstyled"
+						_pressed={{ opacity: 0.6 }}
+					/>
+				</VStack>
+			</Container>
+		</SafeAreaView>
 	);
 };
 

front/views/GenreDetailsView.tsx

@@ -1,74 +0,0 @@
-import { Flex, Heading, useBreakpointValue, ScrollView } from 'native-base';
-import { useQueries, useQuery } from '../Queries';
-import { LoadingView } from '../components/Loading';
-import { RouteProps, useNavigation } from '../Navigation';
-import API from '../API';
-import CardGridCustom from '../components/CardGridCustom';
-import SongCard from '../components/SongCard';
-import { ImageBackground } from 'react-native';
-
-type GenreDetailsViewProps = {
-	genreId: number;
-};
-
-const GenreDetailsView = ({ genreId }: RouteProps<GenreDetailsViewProps>) => {
-	const genreQuery = useQuery(API.getGenre(genreId));
-	const songsQuery = useQuery(API.getSongsByGenre(genreId));
-	const artistQueries = useQueries(
-		songsQuery.data?.map((song) => song.artistId).map((artistId) => API.getArtist(artistId)) ??
-			[]
-	);
-	// Here, .artist will always be defined
-	const songWithArtist = songsQuery?.data
-		?.map((song) => ({
-			...song,
-			artist: artistQueries.find((query) => query.data?.id == song.artistId)?.data,
-		}))
-		.filter((song) => song.artist !== undefined);
-
-	const screenSize = useBreakpointValue({ base: 'small', md: 'big' });
-	const isMobileView = screenSize == 'small';
-	const navigation = useNavigation();
-
-	if (genreQuery.isError || songsQuery.isError) {
-		navigation.navigate('Error');
-		return <></>;
-	}
-	if (!genreQuery.data || songsQuery.data === undefined || songWithArtist === undefined) {
-		return <LoadingView />;
-	}
-
-	return (
-		<ScrollView>
-			<ImageBackground
-				style={{ width: '100%', height: isMobileView ? 200 : 300 }}
-				source={{ uri: API.getGenreIllustration(genreQuery.data.id) }}
-			></ImageBackground>
-			<Heading ml={3} fontSize={50}>
-				{genreQuery.data.name}
-			</Heading>
-			<Flex
-				flexWrap="wrap"
-				direction={isMobileView ? 'column' : 'row'}
-				justifyContent={['flex-start']}
-				mt={4}
-			>
-				<CardGridCustom
-					content={songWithArtist.map((songData) => ({
-						name: songData.name,
-						cover: songData.cover,
-						artistName: songData.artist!.name,
-						songId: songData.id,
-						onPress: () => {
-							API.createSearchHistoryEntry(songData.name, 'song');
-							navigation.navigate('Song', { songId: songData.id });
-						},
-					}))}
-					cardComponent={SongCard}
-				/>
-			</Flex>
-		</ScrollView>
-	);
-};
-
-export default GenreDetailsView;

front/views/PlayView.tsx

@@ -77,7 +77,7 @@ const PlayView = ({ songId, type, route }: RouteProps<PlayViewProps>) => {
 	const webSocket = useRef<WebSocket>();
 	const [paused, setPause] = useState<boolean>(true);
 	const stopwatch = useStopwatch();
-	const time = useRef(0);
+	const [time, setTime] = useState(0);
 	const [partitionRendered, setPartitionRendered] = useState(false); // Used to know when partitionview can render
 	const [score, setScore] = useState(0); // Between 0 and 100
 	const fadeAnim = useRef(new Animated.Value(0)).current;
@@ -236,7 +236,7 @@ const PlayView = ({ songId, type, route }: RouteProps<PlayViewProps>) => {
 	useEffect(() => {
 		ScreenOrientation.lockAsync(ScreenOrientation.OrientationLock.LANDSCAPE).catch(() => {});
 		const interval = setInterval(() => {
-			time.current = getElapsedTime(); // Countdown
+			setTime(() => getElapsedTime()); // Countdown
 		}, 1);
 
 		return () => {
@@ -289,7 +289,7 @@ const PlayView = ({ songId, type, route }: RouteProps<PlayViewProps>) => {
 			<View style={{ flexGrow: 1, justifyContent: 'center' }}>
 				<PartitionCoord
 					file={musixml.data}
-					timestamp={time.current}
+					timestamp={time}
 					onEndReached={onEnd}
 					onPause={onPause}
 					onResume={onResume}
@@ -342,14 +342,14 @@ const PlayView = ({ songId, type, route }: RouteProps<PlayViewProps>) => {
 									}}
 								/>
 								<Text>
-									{time.current < 0
+									{time < 0
 										? paused
 											? '0:00'
-											: Math.floor((time.current % 60000) / 1000)
+											: Math.floor((time % 60000) / 1000)
 													.toFixed(0)
 													.toString()
-										: `${Math.floor(time.current / 60000)}:${Math.floor(
-												(time.current % 60000) / 1000
+										: `${Math.floor(time / 60000)}:${Math.floor(
+												(time % 60000) / 1000
 										  )
 												.toFixed(0)
 												.toString()

front/views/VerifiedView.tsx

@@ -1,4 +1,5 @@
 import { useEffect, useState } from 'react';
+import { useDispatch } from 'react-redux';
 import API from '../API';
 import { Text } from 'native-base';
 import { useNavigation } from '../Navigation';
@@ -13,7 +14,6 @@ const VerifiedView = () => {
 		async function run() {
 			try {
 				await API.fetch({
-					// eslint-disable-next-line @typescript-eslint/no-explicit-any
 					route: `/auth/verify?token=${(route.params as any).token}`,
 					method: 'PUT',
 				});

front/yarn.lock

@@ -9118,11 +9118,6 @@ expo-keep-awake@~11.0.1:
   resolved "https://registry.yarnpkg.com/expo-keep-awake/-/expo-keep-awake-11.0.1.tgz#ee354465892a94040ffe09901b85b469e7d54fb3"
   integrity sha512-44ZjgLE4lnce2d40Pv8xsjMVc6R5GvgHOwZfkLYtGmgYG9TYrEJeEj5UfSeweXPL3pBFhXKfFU8xpGYMaHdP0A==
 
-expo-linear-gradient@^12.3.0:
-  version "12.3.0"
-  resolved "https://registry.yarnpkg.com/expo-linear-gradient/-/expo-linear-gradient-12.3.0.tgz#7abd8fedbf0138c86805aebbdfbbf5e5fa865f19"
-  integrity sha512-f9e+Oxe5z7fNQarTBZXilMyswlkbYWQHONVfq8MqmiEnW3h9XsxxmVJLG8uVQSQPUsbW+x1UUT/tnU6mkMWeLg==
-
 expo-linking@~3.3.1:
   version "3.3.1"
   resolved "https://registry.yarnpkg.com/expo-linking/-/expo-linking-3.3.1.tgz#253b183321e54cb6fa1a667a53d4594aa88a3357"
@@ -9456,6 +9451,11 @@ file-uri-to-path@1.0.0:
   resolved "https://registry.yarnpkg.com/file-uri-to-path/-/file-uri-to-path-1.0.0.tgz#553a7b8446ff6f684359c445f1e37a05dacc33dd"
   integrity sha512-0Zt+s3L7Vf1biwWZ29aARiVYLx7iMGnEUl9x33fbB/j3jR81u/O2LbqK+Bm1CDSNDKVtJ/YjwY7TUd5SkeLQLw==
 
+file64@^1.0.2:
+  version "1.0.2"
+  resolved "https://registry.yarnpkg.com/file64/-/file64-1.0.2.tgz#d3dde9bab142ccf0049e0bd407a2576e94894825"
+  integrity sha512-cDQefGBdb8OO7Pb2nXiRcZlVjwgzoG0uuJ/H2fxNdz3vbOZctp0iPJoHDQ4VZrirqGYc9n/p9+ZqptLZrcSGRA==
+
 filesize@6.1.0:
   version "6.1.0"
   resolved "https://registry.yarnpkg.com/filesize/-/filesize-6.1.0.tgz#e81bdaa780e2451d714d71c0d7a4f3238d37ad00"