fix: missing fallback cover images

This commit is contained in:
Lei Nelissen
2025-01-29 11:25:00 +01:00
parent b381537b62
commit 614066c11e
4 changed files with 8 additions and 6 deletions

View File

@@ -59,6 +59,8 @@ function CoverImage({
return { imageSize, canvasSize }; return { imageSize, canvasSize };
}, [blurRadius, margin]); }, [blurRadius, margin]);
console.log({ src });
return ( return (
<Container size={imageSize} style={style}> <Container size={imageSize} style={style}>
<BlurContainer size={canvasSize} offset={blurRadius}> <BlurContainer size={canvasSize} offset={blurRadius}>

View File

@@ -11,11 +11,11 @@ import Button from '@/components/Button';
import DownloadIcon from '@/components/DownloadIcon'; import DownloadIcon from '@/components/DownloadIcon';
import styled from 'styled-components/native'; import styled from 'styled-components/native';
import { Text } from '@/components/Typography'; import { Text } from '@/components/Typography';
import FastImage from 'react-native-fast-image';
import { useGetImage } from '@/utility/JellyfinApi/lib'; import { useGetImage } from '@/utility/JellyfinApi/lib';
import { ShadowWrapper } from '@/components/Shadow'; import { ShadowWrapper } from '@/components/Shadow';
import { SafeFlatList } from '@/components/SafeNavigatorView'; import { SafeFlatList } from '@/components/SafeNavigatorView';
import { t } from '@/localisation'; import { t } from '@/localisation';
import BaseAlbumImage from '../Music/stacks/components/AlbumImage';
const DownloadedTrack = styled.View` const DownloadedTrack = styled.View`
flex: 1 0 auto; flex: 1 0 auto;
@@ -25,7 +25,7 @@ const DownloadedTrack = styled.View`
margin: 0 20px; margin: 0 20px;
`; `;
const AlbumImage = styled(FastImage)` const AlbumImage = styled(BaseAlbumImage)`
height: 32px; height: 32px;
width: 32px; width: 32px;
border-radius: 4px; border-radius: 4px;

View File

@@ -1,6 +1,5 @@
import React, { useCallback, useContext, useEffect, useRef } from 'react'; import React, { useCallback, useContext, useEffect, useRef } from 'react';
import { ActivityIndicator, Animated, Dimensions, Platform, Pressable, View } from 'react-native'; import { ActivityIndicator, Animated, Dimensions, Platform, Pressable, View } from 'react-native';
import FastImage from 'react-native-fast-image';
import styled, { css } from 'styled-components/native'; import styled, { css } from 'styled-components/native';
import PlayIcon from '@/assets/icons/play.svg'; import PlayIcon from '@/assets/icons/play.svg';
@@ -18,6 +17,7 @@ import { NavigationProp } from '@/screens/types';
import { ShadowWrapper } from '@/components/Shadow'; import { ShadowWrapper } from '@/components/Shadow';
import { BottomTabBarHeightContext } from '@react-navigation/bottom-tabs'; import { BottomTabBarHeightContext } from '@react-navigation/bottom-tabs';
import { useSafeAreaInsets } from 'react-native-safe-area-context'; import { useSafeAreaInsets } from 'react-native-safe-area-context';
import AlbumImage from '../../stacks/components/AlbumImage';
export const NOW_PLAYING_POPOVER_MARGIN = 6; export const NOW_PLAYING_POPOVER_MARGIN = 6;
export const NOW_PLAYING_POPOVER_WIDTH = Dimensions.get('screen').width - 2 * NOW_PLAYING_POPOVER_MARGIN; export const NOW_PLAYING_POPOVER_WIDTH = Dimensions.get('screen').width - 2 * NOW_PLAYING_POPOVER_MARGIN;
@@ -62,7 +62,7 @@ const ShadowOverlay = styled.View`
bottom: 0; bottom: 0;
`; `;
const Cover = styled(FastImage)` const Cover = styled(AlbumImage)`
height: 32px; height: 32px;
width: 32px; width: 32px;
border-radius: 4px; border-radius: 4px;

View File

@@ -9,7 +9,6 @@ import { FlatList } from 'react-native-gesture-handler';
import TouchableHandler from '@/components/TouchableHandler'; import TouchableHandler from '@/components/TouchableHandler';
import { useNavigation } from '@react-navigation/native'; import { useNavigation } from '@react-navigation/native';
import { useGetImage } from '@/utility/JellyfinApi/lib'; import { useGetImage } from '@/utility/JellyfinApi/lib';
import FastImage from 'react-native-fast-image';
import { t } from '@/localisation'; import { t } from '@/localisation';
import useDefaultStyles, { ColoredBlurView } from '@/components/Colors'; import useDefaultStyles, { ColoredBlurView } from '@/components/Colors';
import { searchAndFetchAlbums } from '@/store/music/actions'; import { searchAndFetchAlbums } from '@/store/music/actions';
@@ -22,6 +21,7 @@ import { ShadowWrapper } from '@/components/Shadow';
import { useKeyboardHeight } from '@/utility/useKeyboardHeight'; import { useKeyboardHeight } from '@/utility/useKeyboardHeight';
import { NavigationProp } from '@/screens/types'; import { NavigationProp } from '@/screens/types';
import { useNavigationOffsets } from '@/components/SafeNavigatorView'; import { useNavigationOffsets } from '@/components/SafeNavigatorView';
import BaseAlbumImage from '@/screens/Music/stacks/components/AlbumImage';
// import MicrophoneIcon from '@/assets/icons/microphone.svg'; // import MicrophoneIcon from '@/assets/icons/microphone.svg';
// import AlbumIcon from '@/assets/icons/collection.svg'; // import AlbumIcon from '@/assets/icons/collection.svg';
// import TrackIcon from '@/assets/icons/note.svg'; // import TrackIcon from '@/assets/icons/note.svg';
@@ -52,7 +52,7 @@ const Loading = styled.View`
justify-content: center; justify-content: center;
`; `;
const AlbumImage = styled(FastImage)` const AlbumImage = styled(BaseAlbumImage)`
border-radius: 4px; border-radius: 4px;
width: 32px; width: 32px;
height: 32px; height: 32px;