From ebd46970d98ed3dcf5365d76497ee47696a18d8f Mon Sep 17 00:00:00 2001 From: Lei Nelissen Date: Sun, 2 Jan 2022 19:29:20 +0100 Subject: [PATCH] Fix linting errors --- src/components/Button.tsx | 1 + src/components/DownloadIcon.tsx | 7 +++++-- src/components/ListButton.tsx | 1 + src/screens/Downloads/types.ts | 0 src/screens/Music/stacks/Album.tsx | 7 ++++--- src/screens/Music/stacks/Playlist.tsx | 5 +++-- src/screens/Music/stacks/Search.tsx | 7 +++++-- src/screens/Music/stacks/components/TrackListView.tsx | 1 - src/screens/Player/components/ProgressBar.tsx | 2 +- 9 files changed, 20 insertions(+), 11 deletions(-) delete mode 100644 src/screens/Downloads/types.ts diff --git a/src/components/Button.tsx b/src/components/Button.tsx index d39af06..487754b 100644 --- a/src/components/Button.tsx +++ b/src/components/Button.tsx @@ -46,6 +46,7 @@ const Button = React.forwardRef(function Button(props, ref) { { const subscription = offsetAnimation.addListener((offset) => { - circleRef.current?.setNativeProps({ strokeDashoffset: offset.value }); + // @ts-expect-error undocumented functionality + const setNativeProps = circleRef.current?.setNativeProps as (props: CircleProps) => void | undefined; + setNativeProps?.({ strokeDashoffset: offset.value }); }); return () => offsetAnimation.removeListener(subscription); @@ -78,6 +80,7 @@ function DownloadIcon({ trackId, size = 16, fill }: DownloadIconProps) { cy={radius} r={radius - 1} stroke={iconFill} + // @ts-expect-error react-native-svg has outdated react-native typings ref={circleRef} strokeWidth={1.5} strokeDasharray={[ circumference, circumference ]} diff --git a/src/components/ListButton.tsx b/src/components/ListButton.tsx index 9b76fe1..d8bad9f 100644 --- a/src/components/ListButton.tsx +++ b/src/components/ListButton.tsx @@ -34,6 +34,7 @@ const ListButton: React.FC = ({ children, ...props }) => const handlePressOut = useCallback(() => setPressed(false), []); return ( + // @ts-expect-error styled-components has outdated react-native typings ; const Album: React.FC = () => { const { params: { id } } = useRoute(); - const dispatch = useAppDispatch(); + const dispatch = useDispatch(); // Retrieve the album data from the store const album = useTypedSelector((state) => state.music.albums.entities[id]); const albumTracks = useTypedSelector((state) => state.music.tracks.byAlbum[id]); // Define a function for refreshing this entity - const refresh = useCallback(() => dispatch(fetchTracksByAlbum(id)), [id, dispatch]); + const refresh = useCallback(() => { dispatch(fetchTracksByAlbum(id)); }, [id, dispatch]); // Auto-fetch the track data periodically useEffect(() => { diff --git a/src/screens/Music/stacks/Playlist.tsx b/src/screens/Music/stacks/Playlist.tsx index b2a0807..6de8420 100644 --- a/src/screens/Music/stacks/Playlist.tsx +++ b/src/screens/Music/stacks/Playlist.tsx @@ -1,18 +1,19 @@ import React, { useCallback, useEffect } from 'react'; import { MusicStackParams } from '../types'; import { useRoute, RouteProp } from '@react-navigation/native'; -import { useAppDispatch, useTypedSelector } from 'store'; +import { useTypedSelector } from 'store'; import TrackListView from './components/TrackListView'; import { fetchTracksByPlaylist } from 'store/music/actions'; import { differenceInDays } from 'date-fns'; import { ALBUM_CACHE_AMOUNT_OF_DAYS } from 'CONSTANTS'; import { t } from '@localisation'; +import { useDispatch } from 'react-redux'; type Route = RouteProp; const Playlist: React.FC = () => { const { params: { id } } = useRoute(); - const dispatch = useAppDispatch(); + const dispatch = useDispatch(); // Retrieve the album data from the store const playlist = useTypedSelector((state) => state.music.playlists.entities[id]); diff --git a/src/screens/Music/stacks/Search.tsx b/src/screens/Music/stacks/Search.tsx index c47f14b..8196dba 100644 --- a/src/screens/Music/stacks/Search.tsx +++ b/src/screens/Music/stacks/Search.tsx @@ -2,7 +2,7 @@ import React, { useState, useEffect, useRef, useCallback } from 'react'; import Input from 'components/Input'; import { ActivityIndicator, Text, TextInput, View } from 'react-native'; import styled from 'styled-components/native'; -import { useAppDispatch, useTypedSelector } from 'store'; +import { useTypedSelector } from 'store'; import Fuse from 'fuse.js'; import { Album, AlbumTrack } from 'store/music/types'; import { FlatList } from 'react-native-gesture-handler'; @@ -15,6 +15,7 @@ import { t } from '@localisation'; import useDefaultStyles from 'components/Colors'; import { searchAndFetchAlbums } from 'store/music/actions'; import { debounce } from 'lodash'; +import { useDispatch } from 'react-redux'; const Container = styled.View` padding: 0 20px; @@ -96,7 +97,7 @@ export default function Search() { // Prepare helpers const navigation = useNavigation(); const getImage = useGetImage(); - const dispatch = useAppDispatch(); + const dispatch = useDispatch(); /** * Since it is impractical to have a global fuse variable, we need to @@ -118,6 +119,7 @@ export default function Search() { // eslint-disable-next-line react-hooks/exhaustive-deps const fetchJellyfinResults = useCallback(debounce(async (searchTerm: string, currentResults: CombinedResults) => { // First, query the Jellyfin API + // @ts-expect-error need to fix this with AppDispatch const { payload } = await dispatch(searchAndFetchAlbums({ term: searchTerm })); // Convert the current results to album ids @@ -206,6 +208,7 @@ export default function Search() { const HeaderComponent = React.useMemo(() => ( { duration: 0, }; - timer: NodeJS.Timeout | null = null; + timer: number | null = null; componentDidMount() { this.timer = setInterval(this.updateProgress, 500);