Fix splashscreen breaking change

This commit is contained in:
Zoe Roux 2023-08-31 23:28:32 +02:00
parent a9d4fb769d
commit 25418071fe
No known key found for this signature in database
4 changed files with 19 additions and 10 deletions

View File

@ -40,10 +40,10 @@ import { useTheme } from "yoshiki/native";
import { CircularProgress } from "@kyoo/primitives";
import { useRouter } from "solito/router";
import "intl-pluralrules";
import '@formatjs/intl-locale/polyfill'
import '@formatjs/intl-displaynames/polyfill'
import '@formatjs/intl-displaynames/locale-data/en'
import '@formatjs/intl-displaynames/locale-data/fr'
import "@formatjs/intl-locale/polyfill";
import "@formatjs/intl-displaynames/polyfill";
import "@formatjs/intl-displaynames/locale-data/en";
import "@formatjs/intl-displaynames/locale-data/fr";
// TODO: use a backend to load jsons.
import en from "../../../translations/en.json";
@ -105,14 +105,20 @@ const AuthGuard = ({ selected }: { selected: number | null }) => {
};
let rendered: boolean = false;
SplashScreen.preventAutoHideAsync();
export default function Root() {
const [queryClient] = useState(() => createQueryClient());
const theme = useColorScheme();
const [fontsLoaded] = useFonts({ Poppins_300Light, Poppins_400Regular, Poppins_900Black });
const info = useAccounts();
const isReady = fontsLoaded && (rendered || info.type !== "loading");
if (!fontsLoaded || (!rendered && info.type === "loading")) return <SplashScreen />;
useEffect(() => {
if (isReady) SplashScreen.hideAsync();
}, [isReady]);
if (!isReady) return null;
rendered = true;
return (
<AccountContext.Provider value={info}>

View File

@ -46,6 +46,7 @@ export const ItemList = ({
<ImageBackground
src={thumbnail}
alt={name}
quality="low"
as={Link}
href={href ?? ""}
onFocus={() => setHovered((i) => i + 1)}
@ -103,7 +104,7 @@ export const ItemList = ({
</Skeleton>
)}
</View>
<Poster src={poster} alt="" isLoading={isLoading} layout={{ height: percent(80) }} />
<Poster src={poster} alt="" quality="low" isLoading={isLoading} layout={{ height: percent(80) }} />
</ImageBackground>
);
};

View File

@ -18,7 +18,7 @@
* along with Kyoo. If not, see <https://www.gnu.org/licenses/>.
*/
import { focusReset, H6, Image, Link, P, Skeleton, ts } from "@kyoo/primitives";
import { focusReset, H6, Image, ImageProps, Link, P, Skeleton, ts } from "@kyoo/primitives";
import { useTranslation } from "react-i18next";
import { View } from "react-native";
import { Layout, WithLoading } from "../fetch";
@ -48,13 +48,13 @@ export const EpisodeBox = ({
WithLoading<{
name: string | null;
overview: string;
thumbnail?: string | null;
thumbnail?: ImageProps["src"] | null;
}>) => {
const { t } = useTranslation();
return (
<View {...props}>
<Image src={thumbnail} alt="" layout={{ width: percent(100), aspectRatio: 16 / 9 }} />
<Image src={thumbnail} quality="low" alt="" layout={{ width: percent(100), aspectRatio: 16 / 9 }} />
<Skeleton>{isLoading || <P>{name ?? t("show.episodeNoMetadata")}</P>}</Skeleton>
<Skeleton>{isLoading || <P>{overview}</P>}</Skeleton>
</View>
@ -123,6 +123,7 @@ export const EpisodeLine = ({
</P>
<Image
src={thumbnail}
quality="low"
alt=""
layout={{
width: percent(18),

View File

@ -110,7 +110,7 @@ const TitleLine = ({
<Poster
src={poster}
alt={name}
quality="high"
quality="medium"
isLoading={isLoading}
layout={{
width: { xs: percent(50), md: percent(25) },
@ -351,6 +351,7 @@ export const Header = ({ query, slug }: { query: QueryIdentifier<Show | Movie>;
<Head title={data?.name} description={data?.overview} />
<ImageBackground
src={data?.thumbnail}
quality="high"
alt=""
containerStyle={{
height: {