Use type imports

front/apps/mobile/app/(public)/_layout.tsx

@@ -18,7 +18,7 @@
  * along with Kyoo. If not, see <https://www.gnu.org/licenses/>.
  */
 
-import { Account, ConnectionErrorContext, useAccount } from "@kyoo/models";
+import { type Account, ConnectionErrorContext, useAccount } from "@kyoo/models";
 import { NavbarProfile, NavbarTitle } from "@kyoo/ui";
 import { Redirect, Stack } from "expo-router";
 import { useContext, useRef } from "react";

front/apps/mobile/app/_layout.tsx

@@ -36,7 +36,7 @@ import {
 	Poppins_400Regular,
 	Poppins_900Black,
 } from "@expo-google-fonts/poppins";
-import { ReactNode, useEffect, useState } from "react";
+import { type ReactNode, useEffect, useState } from "react";
 import { useColorScheme } from "react-native";
 import { initReactI18next } from "react-i18next";
 import { ThemeProvider as RNThemeProvider } from "@react-navigation/native";

front/apps/mobile/app/utils.tsx

@@ -19,12 +19,12 @@
  */
 
 import { Stack, useLocalSearchParams } from "expo-router";
-import { ComponentType, useEffect } from "react";
+import { type ComponentType, useEffect } from "react";
-import { StatusBar, StatusBarProps } from "react-native";
+import { StatusBar, type StatusBarProps } from "react-native";
 import * as ScreenOrientation from "expo-screen-orientation";
 import * as NavigationBar from "expo-navigation-bar";
 import arrayShuffle from "array-shuffle";
-import { QueryPage, useHasPermission } from "@kyoo/models";
+import { type QueryPage, useHasPermission } from "@kyoo/models";
 import { Unauthorized } from "@kyoo/ui";
 
 const FullscreenProvider = () => {

front/apps/web/src/i18n-d.ts

@@ -19,7 +19,7 @@
  */
 
 import "i18next";
-import en from "../../../translations/en.json";
+import type en from "../../../translations/en.json";
 
 declare module "i18next" {
 	interface CustomTypeOptions {

front/apps/web/src/i18n.tsx

@@ -18,10 +18,10 @@
  * along with Kyoo. If not, see <https://www.gnu.org/licenses/>.
  */
 
-import { ComponentType, useMemo } from "react";
+import { type ComponentType, useMemo } from "react";
-import i18next, { InitOptions } from "i18next";
+import i18next, { type InitOptions } from "i18next";
 import { I18nextProvider } from "react-i18next";
-import { AppContext, AppInitialProps, type AppProps } from "next/app";
+import type { AppContext, AppInitialProps, AppProps } from "next/app";
 
 import en from "../../../translations/en.json";
 import fr from "../../../translations/fr.json";

front/apps/web/src/pages/_app.tsx

@@ -37,15 +37,15 @@ import {
 	createQueryClient,
 	fetchQuery,
 	getTokenWJ,
-	QueryIdentifier,
+	type QueryIdentifier,
-	QueryPage,
+	type QueryPage,
 	ServerInfoP,
 	setSsrApiUrl,
 	UserP,
 	useUserTheme,
 } from "@kyoo/models";
-import { ComponentType, useContext, useState } from "react";
+import { type ComponentType, useContext, useState } from "react";
-import NextApp, { AppContext, type AppProps } from "next/app";
+import NextApp, { type AppContext, type AppProps } from "next/app";
 import { Poppins } from "next/font/google";
 import { useTheme, useMobileHover, useStyleRegistry, StyleRegistryProvider } from "yoshiki/web";
 import superjson from "superjson";

front/apps/web/src/pages/_document.tsx

@@ -19,7 +19,7 @@
  */
 
 import { AppRegistry } from "react-native";
-import { Html, Main, Head, NextScript, DocumentContext } from "next/document";
+import { Html, Main, Head, NextScript, type DocumentContext } from "next/document";
 import { createStyleRegistry, StyleRegistryProvider } from "yoshiki/web";
 
 export const style = `

front/apps/web/src/router.tsx

@@ -18,10 +18,10 @@
  * along with Kyoo. If not, see <https://www.gnu.org/licenses/>.
  */
 
-import { QueryPage, useHasPermission } from "@kyoo/models";
+import { type QueryPage, useHasPermission } from "@kyoo/models";
 import { Unauthorized } from "@kyoo/ui";
 import { useRouter } from "next/router";
-import { ComponentType } from "react";
+import type { ComponentType } from "react";
 
 export const withRoute = <Props,>(
 	Component: ComponentType<Props>,

front/biome.json

@@ -8,7 +8,7 @@
 		"lineEnding": "lf",
 		"lineWidth": 100,
 		"attributePosition": "auto",
-		"ignore": ["**/.yarn/**", "**/.next/**", "**/.expo/**"]
+		"ignore": ["**/.yarn/**", "**/.next/**", "**/.expo/**", "**/next-env.d.ts"]
 	},
 	"organizeImports": {
 		"enabled": true
@@ -19,7 +19,6 @@
 			"recommended": true,
 			"style": {
 				"noNonNullAssertion": "off",
-				"useImportType": "off",
 				"noParameterAssign": "off",
 				"useEnumInitializers": "off"
 			},
@@ -34,7 +33,7 @@
 				"noBannedTypes": "off"
 			}
 		},
-		"ignore": ["**/.yarn/**", "**/.next/**", "**/.expo/**"]
+		"ignore": ["**/.yarn/**", "**/.next/**", "**/.expo/**", "**/next-env.d.ts"]
 	},
 	"javascript": {
 		"formatter": {

front/packages/models/src/account-internal.ts

@@ -18,8 +18,8 @@
  * along with Kyoo. If not, see <https://www.gnu.org/licenses/>.
  */
 
-import { ZodTypeAny, z } from "zod";
+import { type ZodTypeAny, z } from "zod";
-import { Account, AccountP } from "./accounts";
+import { type Account, AccountP } from "./accounts";
 import { MMKV } from "react-native-mmkv";
 import { Platform } from "react-native";
 

front/packages/models/src/accounts.tsx

@@ -18,8 +18,16 @@
  * along with Kyoo. If not, see <https://www.gnu.org/licenses/>.
  */
 
-import { ReactNode, createContext, useContext, useEffect, useMemo, useRef, useState } from "react";
+import {
-import { ServerInfoP, User, UserP } from "./resources";
+	type ReactNode,
+	createContext,
+	useContext,
+	useEffect,
+	useMemo,
+	useRef,
+	useState,
+} from "react";
+import { ServerInfoP, type User, UserP } from "./resources";
 import { z } from "zod";
 import { zdate } from "./utils";
 import { removeAccounts, setCookie, updateAccount } from "./account-internal";
@@ -28,7 +36,7 @@ import { Platform } from "react-native";
 import { useQueryClient } from "@tanstack/react-query";
 import { atom, getDefaultStore, useAtomValue, useSetAtom } from "jotai";
 import { useFetch } from "./query";
-import { KyooErrors } from "./kyoo-errors";
+import type { KyooErrors } from "./kyoo-errors";
 
 export const TokenP = z.object({
 	token_type: z.literal("Bearer"),

front/packages/models/src/login.ts

@@ -19,8 +19,8 @@
  */
 
 import { queryFn } from "./query";
-import { KyooErrors } from "./kyoo-errors";
+import type { KyooErrors } from "./kyoo-errors";
-import { Account, Token, TokenP, getCurrentApiUrl } from "./accounts";
+import { type Account, type Token, TokenP, getCurrentApiUrl } from "./accounts";
 import { UserP } from "./resources";
 import { addAccount, getCurrentAccount, removeAccounts, updateAccount } from "./account-internal";
 import { Platform } from "react-native";

front/packages/models/src/query.tsx

@@ -18,16 +18,16 @@
  * along with Kyoo. If not, see <https://www.gnu.org/licenses/>.
  */
 
-import { ComponentType, ReactElement } from "react";
+import type { ComponentType, ReactElement } from "react";
 import {
 	QueryClient,
-	QueryFunctionContext,
+	type QueryFunctionContext,
 	useInfiniteQuery,
 	useQuery,
 } from "@tanstack/react-query";
-import { z } from "zod";
+import type { z } from "zod";
-import { KyooErrors } from "./kyoo-errors";
+import type { KyooErrors } from "./kyoo-errors";
-import { Page, Paged } from "./page";
+import { type Page, Paged } from "./page";
 import { getToken, getTokenWJ } from "./login";
 import { getCurrentApiUrl } from ".";
 

front/packages/models/src/utils.ts

@@ -19,7 +19,7 @@
  */
 
 import { Platform } from "react-native";
-import { Movie, Show } from "./resources";
+import type { Movie, Show } from "./resources";
 import { z } from "zod";
 import { useMMKVString } from "react-native-mmkv";
 import { storage } from "./account-internal";

front/packages/primitives/src/alert.tsx

@@ -21,7 +21,7 @@
 // Stolen from https://github.com/necolas/react-native-web/issues/1026#issuecomment-1458279681
 
 import { Alert as RNAlert, type AlertOptions, type AlertButton } from "react-native";
-import { type SweetAlertIcon } from "sweetalert2";
+import type { SweetAlertIcon } from "sweetalert2";
 
 export interface ExtendedAlertStatic {
 	alert: (

front/packages/primitives/src/alert.web.tsx

@@ -20,7 +20,7 @@
 
 // Stolen from https://github.com/necolas/react-native-web/issues/1026#issuecomment-1458279681
 
-import { type AlertButton, type AlertOptions } from "react-native";
+import type { AlertButton, AlertOptions } from "react-native";
 import Swal, { type SweetAlertIcon } from "sweetalert2";
 
 // biome-ignore lint/complexity/noStaticOnlyClass: Compatibility with rn

front/packages/primitives/src/avatar.tsx

@@ -18,12 +18,12 @@
  * along with Kyoo. If not, see <https://www.gnu.org/licenses/>.
  */
 
-import { View, ViewStyle, Image, ImageProps } from "react-native";
+import { View, type ViewStyle, Image, type ImageProps } from "react-native";
-import { useYoshiki, px, Stylable } from "yoshiki/native";
+import { useYoshiki, px, type Stylable } from "yoshiki/native";
 import { Icon } from "./icons";
 import { P } from "./text";
 import AccountCircle from "@material-symbols/svg-400/rounded/account_circle-fill.svg";
-import { ComponentType, forwardRef, RefAttributes } from "react";
+import { type ComponentType, forwardRef, type RefAttributes } from "react";
 
 const stringToColor = (string: string) => {
 	let hash = 0;

front/packages/primitives/src/button.tsx

@@ -18,12 +18,12 @@
  * along with Kyoo. If not, see <https://www.gnu.org/licenses/>.
  */
 
-import { ComponentType, ForwardedRef, ReactElement, forwardRef } from "react";
+import { type ComponentType, type ForwardedRef, type ReactElement, forwardRef } from "react";
-import { Theme, useYoshiki } from "yoshiki/native";
+import { type Theme, useYoshiki } from "yoshiki/native";
 import { PressableFeedback } from "./links";
 import { P } from "./text";
 import { ts } from "./utils";
-import { Falsy, PressableProps, View } from "react-native";
+import { type Falsy, type PressableProps, View } from "react-native";
 
 export const Button = forwardRef(function Button<AsProps = PressableProps>(
 	{

front/packages/primitives/src/chip.tsx

@@ -18,11 +18,11 @@
  * along with Kyoo. If not, see <https://www.gnu.org/licenses/>.
  */
 
-import { px, rem, Theme, useYoshiki } from "yoshiki/native";
+import { px, rem, type Theme, useYoshiki } from "yoshiki/native";
 import { Link } from "./links";
 import { P } from "./text";
 import { capitalize, ts } from "./utils";
-import { TextProps } from "react-native";
+import type { TextProps } from "react-native";
 import { Skeleton } from "./skeleton";
 
 export const Chip = ({

front/packages/primitives/src/container.tsx

@@ -18,8 +18,8 @@
  * along with Kyoo. If not, see <https://www.gnu.org/licenses/>.
  */
 
-import { ComponentType } from "react";
+import type { ComponentType } from "react";
-import { View, ViewProps } from "react-native";
+import { View, type ViewProps } from "react-native";
 import { percent, px, useYoshiki } from "yoshiki/native";
 
 export const Container = <AsProps = ViewProps>({

front/packages/primitives/src/divider.tsx

@@ -19,7 +19,7 @@
  */
 
 import { HR as EHR } from "@expo/html-elements";
-import { px, Stylable, useYoshiki } from "yoshiki/native";
+import { px, type Stylable, useYoshiki } from "yoshiki/native";
 import { ts } from "./utils";
 
 export const HR = ({

front/packages/primitives/src/icons.tsx

@@ -18,13 +18,14 @@
  * along with Kyoo. If not, see <https://www.gnu.org/licenses/>.
  */
 
-import React, { ComponentProps, ComponentType, ForwardedRef, forwardRef } from "react";
+import type React from "react";
-import { Platform, PressableProps } from "react-native";
+import { type ComponentProps, type ComponentType, type ForwardedRef, forwardRef } from "react";
-import { SvgProps } from "react-native-svg";
+import { Platform, type PressableProps } from "react-native";
-import { YoshikiStyle } from "yoshiki";
+import type { SvgProps } from "react-native-svg";
-import { px, Stylable, Theme, useYoshiki } from "yoshiki/native";
+import type { YoshikiStyle } from "yoshiki";
+import { px, type Stylable, type Theme, useYoshiki } from "yoshiki/native";
 import { PressableFeedback } from "./links";
-import { Breakpoint, focusReset, ts } from "./utils";
+import { type Breakpoint, focusReset, ts } from "./utils";
 import { P } from "./text";
 
 declare module "react" {

front/packages/primitives/src/image/base-image.tsx

@@ -18,10 +18,10 @@
  * along with Kyoo. If not, see <https://www.gnu.org/licenses/>.
  */
 
-import { KyooImage } from "@kyoo/models";
+import type { KyooImage } from "@kyoo/models";
-import { ReactElement } from "react";
+import type { ReactElement } from "react";
-import { ImageStyle } from "react-native";
+import type { ImageStyle } from "react-native";
-import { YoshikiStyle } from "yoshiki/src/type";
+import type { YoshikiStyle } from "yoshiki/src/type";
 
 export type YoshikiEnhanced<Style> = Style extends any
 	? {

front/packages/primitives/src/image/blurhash.tsx

@@ -18,10 +18,10 @@
  * along with Kyoo. If not, see <https://www.gnu.org/licenses/>.
  */
 
-import { ReactElement } from "react";
+import type { ReactElement } from "react";
 import { View } from "react-native";
 import { Blurhash } from "react-native-blurhash";
-import { Stylable, useYoshiki } from "yoshiki/native";
+import { type Stylable, useYoshiki } from "yoshiki/native";
 
 export const BlurhashContainer = ({
 	blurhash,

front/packages/primitives/src/image/blurhash.web.tsx

@@ -20,8 +20,8 @@
 
 import { decode } from "blurhash";
 import {
-	HTMLAttributes,
+	type HTMLAttributes,
-	ReactElement,
+	type ReactElement,
 	forwardRef,
 	useImperativeHandle,
 	useLayoutEffect,

front/packages/primitives/src/image/image.tsx

@@ -19,11 +19,11 @@
  */
 
 import { useState } from "react";
-import { FlexStyle, ImageStyle, View, ViewStyle } from "react-native";
+import { type FlexStyle, type ImageStyle, View, type ViewStyle } from "react-native";
 import FastImage from "react-native-fast-image";
 import { Blurhash } from "react-native-blurhash";
 import { percent, useYoshiki } from "yoshiki/native";
-import { Props, ImageLayout } from "./base-image";
+import type { Props, ImageLayout } from "./base-image";
 import { Skeleton } from "../skeleton";
 import { getCurrentToken } from "@kyoo/models";
 

front/packages/primitives/src/image/image.web.tsx

@@ -19,9 +19,9 @@
  */
 
 import { useState } from "react";
-import { ImageStyle, View, ViewStyle } from "react-native";
+import { type ImageStyle, View, type ViewStyle } from "react-native";
 import { useYoshiki } from "yoshiki/native";
-import { Props, ImageLayout } from "./base-image";
+import type { Props, ImageLayout } from "./base-image";
 import { BlurhashContainer } from "./blurhash.web";
 import { Skeleton } from "../skeleton";
 import NextImage from "next/image";

front/packages/primitives/src/image/index.tsx

@@ -18,14 +18,14 @@
  * along with Kyoo. If not, see <https://www.gnu.org/licenses/>.
  */
 
-import { ImageStyle, View, ViewProps, ViewStyle } from "react-native";
+import { LinearGradient, type LinearGradientProps } from "expo-linear-gradient";
-import { Props, ImageLayout, YoshikiEnhanced } from "./base-image";
+import type { ComponentProps, ComponentType, ReactNode } from "react";
-import { Image } from "./image";
+import { type ImageStyle, View, type ViewProps, type ViewStyle } from "react-native";
-import { ComponentProps, ComponentType, ReactNode } from "react";
-import { LinearGradient, LinearGradientProps } from "expo-linear-gradient";
-import { ContrastArea } from "../themes";
 import { percent } from "yoshiki/native";
 import { imageBorderRadius } from "../constants";
+import { ContrastArea } from "../themes";
+import type { ImageLayout, Props, YoshikiEnhanced } from "./base-image";
+import { Image } from "./image";
 
 export { Sprite } from "./sprite";
 export { BlurhashContainer } from "./blurhash";

front/packages/primitives/src/input.tsx

@@ -18,11 +18,11 @@
  * along with Kyoo. If not, see <https://www.gnu.org/licenses/>.
  */
 
-import { forwardRef, ReactNode, useState } from "react";
+import { forwardRef, type ReactNode, useState } from "react";
-import { TextInput, TextInputProps, View, ViewStyle } from "react-native";
+import { TextInput, type TextInputProps, View, type ViewStyle } from "react-native";
-import { px, Theme, useYoshiki } from "yoshiki/native";
+import { px, type Theme, useYoshiki } from "yoshiki/native";
 import { focusReset, ts } from "./utils";
-import { YoshikiEnhanced } from "./image/base-image";
+import type { YoshikiEnhanced } from "./image/base-image";
 
 export const Input = forwardRef<
 	TextInput,

front/packages/primitives/src/links.tsx

@@ -18,8 +18,15 @@
  * along with Kyoo. If not, see <https://www.gnu.org/licenses/>.
  */
 
-import { forwardRef, ReactNode } from "react";
+import { forwardRef, type ReactNode } from "react";
-import { Platform, Pressable, TextProps, View, PressableProps, Linking } from "react-native";
+import {
+	Platform,
+	Pressable,
+	type TextProps,
+	type View,
+	type PressableProps,
+	Linking,
+} from "react-native";
 import { TextLink, useLink } from "solito/link";
 import { useTheme, useYoshiki } from "yoshiki/native";
 import type { UrlObject } from "node:url";

front/packages/primitives/src/menu.tsx

@@ -21,10 +21,10 @@
 import { Portal } from "@gorhom/portal";
 import { ScrollView } from "moti";
 import {
-	ComponentType,
+	type ComponentType,
 	createContext,
-	ReactElement,
+	type ReactElement,
-	ReactNode,
+	type ReactNode,
 	useContext,
 	useEffect,
 	useRef,
@@ -41,7 +41,7 @@ import { ContrastArea, SwitchVariant } from "./themes";
 import { ts } from "./utils";
 import Check from "@material-symbols/svg-400/rounded/check-fill.svg";
 import { useRouter } from "solito/router";
-import { SvgProps } from "react-native-svg";
+import type { SvgProps } from "react-native-svg";
 
 const MenuContext = createContext<((open: boolean) => void) | undefined>(undefined);
 

front/packages/primitives/src/menu.web.tsx

@@ -19,9 +19,15 @@
  */
 
 import * as DropdownMenu from "@radix-ui/react-dropdown-menu";
-import { ComponentProps, ComponentType, forwardRef, ReactElement, ReactNode } from "react";
+import {
+	type ComponentProps,
+	type ComponentType,
+	forwardRef,
+	type ReactElement,
+	type ReactNode,
+} from "react";
 import Link from "next/link";
-import { PressableProps } from "react-native";
+import type { PressableProps } from "react-native";
 import { useYoshiki } from "yoshiki/web";
 import { useYoshiki as useNativeYoshiki } from "yoshiki/native";
 import { P } from "./text";
@@ -29,7 +35,7 @@ import { ContrastArea, SwitchVariant } from "./themes";
 import { Icon } from "./icons";
 import Dot from "@material-symbols/svg-400/rounded/fiber_manual_record-fill.svg";
 import { focusReset, ts } from "./utils";
-import { SvgProps } from "react-native-svg";
+import type { SvgProps } from "react-native-svg";
 
 type YoshikiFunc<T> = (props: ReturnType<typeof useYoshiki>) => T;
 export const YoshikiProvider = ({ children }: { children: YoshikiFunc<ReactNode> }) => {

front/packages/primitives/src/popup.tsx

@@ -18,10 +18,10 @@
  * along with Kyoo. If not, see <https://www.gnu.org/licenses/>.
  */
 
-import { ReactNode, useCallback, useEffect, useState } from "react";
+import { type ReactNode, useCallback, useEffect, useState } from "react";
 import { Container } from "./container";
 import { usePortal } from "@gorhom/portal";
-import { ContrastArea, SwitchVariant, YoshikiFunc } from "./themes";
+import { ContrastArea, SwitchVariant, type YoshikiFunc } from "./themes";
 import { View, ScrollView } from "react-native";
 import { imageBorderRadius } from "./constants";
 import { px, vh } from "yoshiki/native";

front/packages/primitives/src/progress.tsx

@@ -20,7 +20,7 @@
 
 import { ActivityIndicator, Platform, View } from "react-native";
 import { Circle, Svg } from "react-native-svg";
-import { px, Stylable, useYoshiki } from "yoshiki/native";
+import { px, type Stylable, useYoshiki } from "yoshiki/native";
 
 export const CircularProgress = ({
 	size = 48,

front/packages/primitives/src/select.web.tsx

@@ -26,7 +26,7 @@ import ExpandMore from "@material-symbols/svg-400/rounded/expand_more-fill.svg";
 import ExpandLess from "@material-symbols/svg-400/rounded/expand_less-fill.svg";
 import { ContrastArea, SwitchVariant } from "./themes";
 import { InternalTriger, YoshikiProvider } from "./menu.web";
-import { Theme, px, useYoshiki as useNativeYoshiki } from "yoshiki/native";
+import { type Theme, px, useYoshiki as useNativeYoshiki } from "yoshiki/native";
 import { useYoshiki } from "yoshiki";
 import { PressableFeedback } from "./links";
 import { P } from "./text";

front/packages/primitives/src/skeleton.tsx

@@ -21,7 +21,7 @@
 import { LinearGradient as LG } from "expo-linear-gradient";
 import { AnimatePresence, motify, MotiView } from "moti";
 import { useState } from "react";
-import { Platform, View, ViewProps } from "react-native";
+import { Platform, View, type ViewProps } from "react-native";
 import { px, rem, useYoshiki, percent, em } from "yoshiki/native";
 import { hiddenIfNoJs } from "./utils/nojs";
 

front/packages/primitives/src/skeleton.web.tsx

@@ -19,7 +19,7 @@
  */
 
 import { LinearGradient } from "expo-linear-gradient";
-import { View, ViewProps } from "react-native";
+import { View, type ViewProps } from "react-native";
 import { px, rem, useYoshiki, percent, em } from "yoshiki/native";
 import { hiddenIfNoJs } from "./utils/nojs";
 

front/packages/primitives/src/slider.tsx

@@ -19,10 +19,10 @@
  */
 
 import { useRef, useState } from "react";
-import { GestureResponderEvent, Platform, View } from "react-native";
+import { type GestureResponderEvent, Platform, View } from "react-native";
 import { px, percent, Stylable, useYoshiki } from "yoshiki/native";
 import { focusReset } from "./utils";
-import { ViewProps } from "react-native-svg/lib/typescript/fabric/utils";
+import type { ViewProps } from "react-native-svg/lib/typescript/fabric/utils";
 
 export const Slider = ({
 	progress,

front/packages/primitives/src/snackbar.tsx

@@ -19,7 +19,7 @@
  */
 
 import { usePortal } from "@gorhom/portal";
-import { ReactElement, createContext, useCallback, useContext, useRef } from "react";
+import { type ReactElement, createContext, useCallback, useContext, useRef } from "react";
 import { ContrastArea, SwitchVariant } from "./themes";
 import { P } from "./text";
 import { View } from "react-native";

front/packages/primitives/src/svg.d.ts

@@ -19,8 +19,8 @@
  */
 
 declare module "*.svg" {
-	import React from "react";
+	import type React from "react";
-	import { SvgProps } from "react-native-svg";
+	import type { SvgProps } from "react-native-svg";
 	const content: React.FC<SvgProps>;
 	export default content;
 }

front/packages/primitives/src/text.tsx

@@ -18,8 +18,8 @@
  * along with Kyoo. If not, see <https://www.gnu.org/licenses/>.
  */
 
-import { ComponentType, ComponentProps } from "react";
+import type { ComponentType, ComponentProps } from "react";
-import { Platform, Text, TextProps, TextStyle, StyleProp } from "react-native";
+import { Platform, Text, type TextProps, type TextStyle, type StyleProp } from "react-native";
 import { percent, rem, useYoshiki } from "yoshiki/native";
 import {
 	H1 as EH1,

front/packages/primitives/src/themes/catppuccin.ts

@@ -18,7 +18,7 @@
  * along with Kyoo. If not, see <https://www.gnu.org/licenses/>.
  */
 
-import { ThemeBuilder } from "./theme";
+import type { ThemeBuilder } from "./theme";
 
 // Ref: https://github.com/catppuccin/catppuccin
 export const catppuccin: ThemeBuilder = {

front/packages/primitives/src/themes/theme.tsx

@@ -18,9 +18,9 @@
  * along with Kyoo. If not, see <https://www.gnu.org/licenses/>.
  */
 
-import { ReactNode } from "react";
+import type { ReactNode } from "react";
-import { Property } from "csstype";
+import type { Property } from "csstype";
-import { Theme, ThemeProvider, useAutomaticTheme } from "yoshiki";
+import { type Theme, ThemeProvider, useAutomaticTheme } from "yoshiki";
 import { useTheme, useYoshiki } from "yoshiki/native";
 import "yoshiki";
 import "yoshiki/native";

front/packages/primitives/src/tooltip.web.tsx

@@ -18,7 +18,7 @@
  * along with Kyoo. If not, see <https://www.gnu.org/licenses/>.
  */
 
-import { Theme } from "yoshiki/native";
+import type { Theme } from "yoshiki/native";
 import { Tooltip as RTooltip } from "react-tooltip";
 import { forwardRef } from "react";
 import { ContrastArea } from "./themes";

front/packages/primitives/src/types.d.ts

@@ -18,7 +18,7 @@
  * along with Kyoo. If not, see <https://www.gnu.org/licenses/>.
  */
 
-import React from "react";
+import type React from "react";
 import "react-native";
 
 declare module "react-native" {

front/packages/primitives/src/utils/breakpoints.ts

@@ -19,7 +19,7 @@
  */
 
 import { useWindowDimensions } from "react-native";
-import { Breakpoints as YoshikiBreakpoint, isBreakpoints, breakpoints } from "yoshiki/native";
+import { type Breakpoints as YoshikiBreakpoint, isBreakpoints, breakpoints } from "yoshiki/native";
 
 type AtLeastOne<T, U = { [K in keyof T]: Pick<T, K> }> = Partial<T> & U[keyof U];
 export type Breakpoint<T> = T | AtLeastOne<YoshikiBreakpoint<T>>;

front/packages/primitives/src/utils/nojs.tsx

@@ -18,7 +18,7 @@
  * along with Kyoo. If not, see <https://www.gnu.org/licenses/>.
  */
 
-import { ViewProps } from "react-native";
+import type { ViewProps } from "react-native";
 
 export const hiddenIfNoJs: ViewProps = { style: { $$css: true, noJs: "noJsHidden" } as any };
 

front/packages/primitives/src/utils/touchonly.tsx

@@ -19,7 +19,7 @@
  */
 
 import { useEffect } from "react";
-import { Platform, ViewProps } from "react-native";
+import { Platform, type ViewProps } from "react-native";
 
 export const TouchOnlyCss = () => {
 	return (

front/packages/ui/src/admin/index.tsx

@@ -18,7 +18,7 @@
  * along with Kyoo. If not, see <https://www.gnu.org/licenses/>.
  */
 
-import { QueryPage } from "@kyoo/models";
+import type { QueryPage } from "@kyoo/models";
 import { ts } from "@kyoo/primitives";
 import { ScrollView } from "react-native";
 import { DefaultLayout } from "../layout";

front/packages/ui/src/admin/scanner.tsx

@@ -18,7 +18,7 @@
  * along with Kyoo. If not, see <https://www.gnu.org/licenses/>.
  */
 
-import { Issue, IssueP, QueryIdentifier, queryFn, useFetch } from "@kyoo/models";
+import { type Issue, IssueP, type QueryIdentifier, queryFn, useFetch } from "@kyoo/models";
 import { useTranslation } from "react-i18next";
 import { SettingsContainer } from "../settings/base";
 import { Button, Icon, P, Skeleton, tooltip, ts } from "@kyoo/primitives";

front/packages/ui/src/admin/users.tsx

@@ -18,12 +18,12 @@
  * along with Kyoo. If not, see <https://www.gnu.org/licenses/>.
  */
 
-import { QueryIdentifier, User, UserP, queryFn } from "@kyoo/models";
+import { type QueryIdentifier, type User, UserP, queryFn } from "@kyoo/models";
 import { Alert, Avatar, Icon, IconButton, Menu, P, Skeleton, tooltip, ts } from "@kyoo/primitives";
 import { useTranslation } from "react-i18next";
 import { View } from "react-native";
 import { px, useYoshiki } from "yoshiki/native";
-import { Layout, WithLoading } from "../fetch";
+import type { Layout, WithLoading } from "../fetch";
 import { InfiniteFetch } from "../fetch-infinite";
 import { SettingsContainer } from "../settings/base";
 

front/packages/ui/src/browse/grid.tsx

@@ -18,7 +18,7 @@
  * along with Kyoo. If not, see <https://www.gnu.org/licenses/>.
  */
 
-import { KyooImage, WatchStatusV } from "@kyoo/models";
+import { type KyooImage, WatchStatusV } from "@kyoo/models";
 import {
 	Link,
 	Skeleton,
@@ -30,9 +30,9 @@ import {
 	Icon,
 	important,
 } from "@kyoo/primitives";
-import { ImageStyle, Platform, View } from "react-native";
+import { type ImageStyle, Platform, View } from "react-native";
-import { max, percent, px, rem, Stylable, Theme, useYoshiki } from "yoshiki/native";
+import { max, percent, px, rem, type Stylable, type Theme, useYoshiki } from "yoshiki/native";
-import { Layout, WithLoading } from "../fetch";
+import type { Layout, WithLoading } from "../fetch";
 import Done from "@material-symbols/svg-400/rounded/done-fill.svg";
 import { ItemContext } from "../components/context-menus";
 import { useState } from "react";

front/packages/ui/src/browse/header.tsx

@@ -39,7 +39,7 @@ import ArrowUpward from "@material-symbols/svg-400/rounded/arrow_upward.svg";
 import ArrowDownward from "@material-symbols/svg-400/rounded/arrow_downward.svg";
 import { Layout, SearchSort, SortOrd } from "./types";
 import { forwardRef } from "react";
-import { View, PressableProps } from "react-native";
+import { View, type PressableProps } from "react-native";
 
 const SortTrigger = forwardRef<View, PressableProps & { sortKey: string }>(function SortTrigger(
 	{ sortKey, ...props },

front/packages/ui/src/browse/index.tsx

@@ -19,16 +19,16 @@
  */
 
 import {
-	QueryIdentifier,
+	type QueryIdentifier,
-	QueryPage,
+	type QueryPage,
-	LibraryItem,
+	type LibraryItem,
 	LibraryItemP,
 	getDisplayDate,
 } from "@kyoo/models";
-import { ComponentProps, useState } from "react";
+import { type ComponentProps, useState } from "react";
 import { createParam } from "solito";
 import { DefaultLayout } from "../layout";
-import { WithLoading } from "../fetch";
+import type { WithLoading } from "../fetch";
 import { InfiniteFetch } from "../fetch-infinite";
 import { ItemGrid } from "./grid";
 import { ItemList } from "./list";

front/packages/ui/src/browse/list.tsx

@@ -18,7 +18,7 @@
  * along with Kyoo. If not, see <https://www.gnu.org/licenses/>.
  */
 
-import { KyooImage, WatchStatusV } from "@kyoo/models";
+import type { KyooImage, WatchStatusV } from "@kyoo/models";
 import {
 	Link,
 	P,
@@ -33,7 +33,7 @@ import {
 import { useState } from "react";
 import { Platform, View } from "react-native";
 import { percent, px, rem, useYoshiki } from "yoshiki/native";
-import { Layout, WithLoading } from "../fetch";
+import type { Layout, WithLoading } from "../fetch";
 import { ItemWatchStatus } from "./grid";
 import { ItemContext } from "../components/context-menus";
 

front/packages/ui/src/collection/index.tsx

@@ -19,12 +19,12 @@
  */
 
 import {
-	Collection,
+	type Collection,
 	CollectionP,
-	LibraryItem,
+	type LibraryItem,
 	LibraryItemP,
-	QueryIdentifier,
+	type QueryIdentifier,
-	QueryPage,
+	type QueryPage,
 	getDisplayDate,
 } from "@kyoo/models";
 import { Header as ShowHeader, TitleLine } from "../details/header";
@@ -32,7 +32,7 @@ import { Container, Head, ImageBackground, P, Skeleton, ts, usePageStyle } from
 import { percent, px, useYoshiki } from "yoshiki/native";
 import { useTranslation } from "react-i18next";
 import { forwardRef } from "react";
-import { Platform, View, ViewProps } from "react-native";
+import { Platform, View, type ViewProps } from "react-native";
 import { Fetch } from "../fetch";
 import { InfiniteFetch } from "../fetch-infinite";
 import { DefaultLayout } from "../layout";

front/packages/ui/src/components/context-menus.tsx

@@ -26,7 +26,7 @@ import Info from "@material-symbols/svg-400/rounded/info.svg";
 import MoreVert from "@material-symbols/svg-400/rounded/more_vert.svg";
 import MovieInfo from "@material-symbols/svg-400/rounded/movie_info.svg";
 import { useMutation, useQueryClient } from "@tanstack/react-query";
-import { ComponentProps } from "react";
+import type { ComponentProps } from "react";
 import { useTranslation } from "react-i18next";
 import { Platform } from "react-native";
 import { useYoshiki } from "yoshiki/native";

front/packages/ui/src/components/media-info.tsx

@@ -18,7 +18,13 @@
  * along with Kyoo. If not, see <https://www.gnu.org/licenses/>.
  */
 
-import { Audio, QueryIdentifier, Subtitle, WatchInfo, WatchInfoP } from "@kyoo/models";
+import {
+	type Audio,
+	type QueryIdentifier,
+	type Subtitle,
+	type WatchInfo,
+	WatchInfoP,
+} from "@kyoo/models";
 import { Button, HR, P, Popup, Skeleton } from "@kyoo/primitives";
 import { Fetch } from "../fetch";
 import { useTranslation } from "react-i18next";

front/packages/ui/src/components/rating.tsx

@@ -18,7 +18,7 @@
  * along with Kyoo. If not, see <https://www.gnu.org/licenses/>.
  */
 
-import { Breakpoint, Icon, P, Skeleton, ts } from "@kyoo/primitives";
+import { type Breakpoint, Icon, P, Skeleton, ts } from "@kyoo/primitives";
 import { View } from "react-native";
 import Star from "@material-symbols/svg-400/rounded/star-fill.svg";
 import { rem, useYoshiki } from "yoshiki/native";

front/packages/ui/src/components/watchlist-info.tsx

@@ -19,7 +19,7 @@
  */
 
 import { IconButton, Menu, tooltip } from "@kyoo/primitives";
-import { ComponentProps } from "react";
+import type { ComponentProps } from "react";
 import { useTranslation } from "react-i18next";
 import BookmarkAdd from "@material-symbols/svg-400/rounded/bookmark_add.svg";
 import Bookmark from "@material-symbols/svg-400/rounded/bookmark-fill.svg";

front/packages/ui/src/details/collection.tsx

@@ -19,15 +19,15 @@
  */
 
 import {
-	Collection,
+	type Collection,
 	CollectionP,
-	KyooImage,
+	type KyooImage,
-	QueryIdentifier,
+	type QueryIdentifier,
 	useInfiniteFetch,
 } from "@kyoo/models";
 import { Container, H2, ImageBackground, Link, P, focusReset, ts } from "@kyoo/primitives";
 import { useTranslation } from "react-i18next";
-import { Theme, useYoshiki } from "yoshiki/native";
+import { type Theme, useYoshiki } from "yoshiki/native";
 import { ErrorView } from "../errors";
 
 export const PartOf = ({

front/packages/ui/src/details/episode.tsx

@@ -23,7 +23,7 @@ import {
 	H6,
 	IconButton,
 	ImageBackground,
-	ImageProps,
+	type ImageProps,
 	important,
 	Link,
 	P,
@@ -33,10 +33,10 @@ import {
 	ts,
 } from "@kyoo/primitives";
 import { useTranslation } from "react-i18next";
-import { ImageStyle, Platform, PressableProps, View } from "react-native";
+import { type ImageStyle, Platform, type PressableProps, View } from "react-native";
-import { Layout, WithLoading } from "../fetch";
+import type { Layout, WithLoading } from "../fetch";
-import { percent, rem, Stylable, Theme, useYoshiki } from "yoshiki/native";
+import { percent, rem, type Stylable, type Theme, useYoshiki } from "yoshiki/native";
-import { KyooImage, WatchStatusV } from "@kyoo/models";
+import { type KyooImage, WatchStatusV } from "@kyoo/models";
 import { ItemProgress } from "../browse/grid";
 import { EpisodesContext } from "../components/context-menus";
 import { useState } from "react";

front/packages/ui/src/details/header.tsx

@@ -19,17 +19,17 @@
  */
 
 import {
-	Genre,
+	type Genre,
-	KyooImage,
+	type KyooImage,
-	Movie,
+	type Movie,
-	QueryIdentifier,
+	type QueryIdentifier,
-	Show,
+	type Show,
-	Studio,
+	type Studio,
 	getDisplayDate,
 	queryFn,
 	useAccount,
 } from "@kyoo/models";
-import { WatchStatusV } from "@kyoo/models/src/resources/watch-status";
+import type { WatchStatusV } from "@kyoo/models/src/resources/watch-status";
 import {
 	A,
 	Chip,
@@ -63,10 +63,10 @@ import Theaters from "@material-symbols/svg-400/rounded/theaters-fill.svg";
 import { useMutation } from "@tanstack/react-query";
 import { Fragment } from "react";
 import { useTranslation } from "react-i18next";
-import { ImageStyle, Platform, View } from "react-native";
+import { type ImageStyle, Platform, View } from "react-native";
 import {
-	Stylable,
+	type Stylable,
-	Theme,
+	type Theme,
 	em,
 	max,
 	md,

front/packages/ui/src/details/movie.tsx

@@ -18,7 +18,7 @@
  * along with Kyoo. If not, see <https://www.gnu.org/licenses/>.
  */
 
-import { Movie, MovieP, QueryIdentifier, QueryPage } from "@kyoo/models";
+import { type Movie, MovieP, type QueryIdentifier, type QueryPage } from "@kyoo/models";
 import { Platform, ScrollView } from "react-native";
 import { useYoshiki } from "yoshiki/native";
 import { DefaultLayout } from "../layout";

front/packages/ui/src/details/person.tsx

@@ -19,7 +19,7 @@
  */
 
 import { Avatar, Link, P, Skeleton, SubP } from "@kyoo/primitives";
-import { Stylable, useYoshiki } from "yoshiki/native";
+import { type Stylable, useYoshiki } from "yoshiki/native";
 
 export const PersonAvatar = ({
 	slug,

front/packages/ui/src/details/season.tsx

@@ -19,10 +19,10 @@
  */
 
 import {
-	Episode,
+	type Episode,
 	EpisodeP,
-	QueryIdentifier,
+	type QueryIdentifier,
-	Season,
+	type Season,
 	SeasonP,
 	useInfiniteFetch,
 } from "@kyoo/models";
@@ -32,7 +32,7 @@ import { View } from "react-native";
 import { InfiniteFetch } from "../fetch-infinite";
 import { episodeDisplayNumber, EpisodeLine } from "./episode";
 import { useTranslation } from "react-i18next";
-import { ComponentType } from "react";
+import type { ComponentType } from "react";
 import MenuIcon from "@material-symbols/svg-400/rounded/menu-fill.svg";
 
 type SeasonProcessed = Season & { href: string };

front/packages/ui/src/details/show.tsx

@@ -18,13 +18,19 @@
  * along with Kyoo. If not, see <https://www.gnu.org/licenses/>.
  */
 
-import { QueryIdentifier, QueryPage, Show, ShowP, ShowWatchStatus } from "@kyoo/models";
+import {
-import { Platform, View, ViewProps } from "react-native";
+	type QueryIdentifier,
+	type QueryPage,
+	type Show,
+	ShowP,
+	type ShowWatchStatus,
+} from "@kyoo/models";
+import { Platform, View, type ViewProps } from "react-native";
 import { percent, useYoshiki } from "yoshiki/native";
 import { DefaultLayout } from "../layout";
 import { EpisodeList, SeasonHeader } from "./season";
 import { Header } from "./header";
-import Svg, { Path, SvgProps } from "react-native-svg";
+import Svg, { Path, type SvgProps } from "react-native-svg";
 import { Container, H2, SwitchVariant, focusReset, ts } from "@kyoo/primitives";
 import { forwardRef, useState } from "react";
 import { DetailsCollections } from "./collection";

front/packages/ui/src/downloads/index.web.tsx

@@ -18,10 +18,10 @@
  * along with Kyoo. If not, see <https://www.gnu.org/licenses/>.
  */
 
-import { WatchInfo, getCurrentApiUrl, queryFn, toQueryKey } from "@kyoo/models";
+import { type WatchInfo, getCurrentApiUrl, queryFn, toQueryKey } from "@kyoo/models";
 import { Player } from "../player";
 import { getCurrentAccount } from "@kyoo/models/src/account-internal";
-import { ReactNode } from "react";
+import type { ReactNode } from "react";
 
 export const useDownloader = () => {
 	return async (type: "episode" | "movie", slug: string) => {

front/packages/ui/src/downloads/page.tsx

@@ -18,9 +18,9 @@
  * along with Kyoo. If not, see <https://www.gnu.org/licenses/>.
  */
 
-import { State, downloadAtom } from "./state";
+import { type State, downloadAtom } from "./state";
 import { FlashList } from "@shopify/flash-list";
-import { ImageStyle, View } from "react-native";
+import { type ImageStyle, View } from "react-native";
 import {
 	Alert,
 	H6,
@@ -38,8 +38,8 @@ import { EpisodeLine, displayRuntime, episodeDisplayNumber } from "../details/ep
 import { useTranslation } from "react-i18next";
 import { EmptyView } from "../fetch";
 import { percent, useYoshiki } from "yoshiki/native";
-import { KyooImage } from "@kyoo/models";
+import type { KyooImage } from "@kyoo/models";
-import { Atom, useAtomValue } from "jotai";
+import { type Atom, useAtomValue } from "jotai";
 import DownloadForOffline from "@material-symbols/svg-400/rounded/download_for_offline.svg";
 import Downloading from "@material-symbols/svg-400/rounded/downloading.svg";
 import ErrorIcon from "@material-symbols/svg-400/rounded/error.svg";

front/packages/ui/src/downloads/state.tsx

@@ -23,24 +23,24 @@ import RNBackgroundDownloader, {
 } from "@kesha-antonov/react-native-background-downloader";
 import { deleteAsync } from "expo-file-system";
 import {
-	Account,
+	type Account,
-	Episode,
+	type Episode,
 	EpisodeP,
-	Movie,
+	type Movie,
 	MovieP,
-	QueryIdentifier,
+	type QueryIdentifier,
-	WatchInfo,
+	type WatchInfo,
 	WatchInfoP,
 	queryFn,
 	toQueryKey,
 } from "@kyoo/models";
 import { Player } from "../player";
-import { atom, useSetAtom, PrimitiveAtom, useStore } from "jotai";
+import { atom, useSetAtom, type PrimitiveAtom, useStore } from "jotai";
 import { getCurrentAccount, storage } from "@kyoo/models/src/account-internal";
-import { ReactNode, useEffect } from "react";
+import { type ReactNode, useEffect } from "react";
 import { ToastAndroid } from "react-native";
-import { QueryClient, useQueryClient } from "@tanstack/react-query";
+import { type QueryClient, useQueryClient } from "@tanstack/react-query";
-import { Router } from "expo-router/build/types";
+import type { Router } from "expo-router/build/types";
 import { z } from "zod";
 
 export type State = {

front/packages/ui/src/errors/error.tsx

@@ -18,7 +18,7 @@
  * along with Kyoo. If not, see <https://www.gnu.org/licenses/>.
  */
 
-import { ConnectionErrorContext, KyooErrors } from "@kyoo/models";
+import { ConnectionErrorContext, type KyooErrors } from "@kyoo/models";
 import { P } from "@kyoo/primitives";
 import { useContext, useLayoutEffect } from "react";
 import { View } from "react-native";

front/packages/ui/src/fetch-infinite.tsx

@@ -18,13 +18,19 @@
  * along with Kyoo. If not, see <https://www.gnu.org/licenses/>.
  */
 
-import { Page, QueryIdentifier, useInfiniteFetch } from "@kyoo/models";
+import { type Page, type QueryIdentifier, useInfiniteFetch } from "@kyoo/models";
 import { useBreakpointMap, HR } from "@kyoo/primitives";
-import { ContentStyle, FlashList } from "@shopify/flash-list";
+import { type ContentStyle, FlashList } from "@shopify/flash-list";
-import { ComponentProps, ComponentType, isValidElement, ReactElement, useRef } from "react";
+import {
-import { EmptyView, Layout, OfflineView, WithLoading, addHeader } from "./fetch";
+	type ComponentProps,
+	type ComponentType,
+	isValidElement,
+	type ReactElement,
+	useRef,
+} from "react";
+import { EmptyView, type Layout, OfflineView, type WithLoading, addHeader } from "./fetch";
 import { ErrorView } from "./errors";
-import { FlatList, View, ViewStyle } from "react-native";
+import { FlatList, View, type ViewStyle } from "react-native";
 
 const emulateGap = (
 	layout: "grid" | "vertical" | "horizontal",

front/packages/ui/src/fetch-infinite.web.tsx

@@ -18,20 +18,20 @@
  * along with Kyoo. If not, see <https://www.gnu.org/licenses/>.
  */
 
-import { Page, QueryIdentifier, useInfiniteFetch } from "@kyoo/models";
+import { type Page, type QueryIdentifier, useInfiniteFetch } from "@kyoo/models";
 import { HR } from "@kyoo/primitives";
 import {
-	ComponentProps,
+	type ComponentProps,
-	ComponentType,
+	type ComponentType,
 	Fragment,
 	isValidElement,
-	ReactElement,
+	type ReactElement,
 	useCallback,
 	useEffect,
 	useRef,
 } from "react";
-import { Stylable, nativeStyleToCss, useYoshiki, ysMap } from "yoshiki";
+import { type Stylable, nativeStyleToCss, useYoshiki, ysMap } from "yoshiki";
-import { EmptyView, Layout, WithLoading, addHeader } from "./fetch";
+import { EmptyView, type Layout, type WithLoading, addHeader } from "./fetch";
 import { ErrorView } from "./errors";
 import type { ContentStyle } from "@shopify/flash-list";
 

front/packages/ui/src/fetch.tsx

@@ -18,9 +18,9 @@
  * along with Kyoo. If not, see <https://www.gnu.org/licenses/>.
  */
 
-import { Page, QueryIdentifier, useFetch } from "@kyoo/models";
+import { type Page, type QueryIdentifier, useFetch } from "@kyoo/models";
-import { Breakpoint, P } from "@kyoo/primitives";
+import { type Breakpoint, P } from "@kyoo/primitives";
-import { ComponentType, ReactElement, isValidElement } from "react";
+import { type ComponentType, type ReactElement, isValidElement } from "react";
 import { useTranslation } from "react-i18next";
 import { View } from "react-native";
 import { useYoshiki } from "yoshiki/native";

front/packages/ui/src/home/genre.tsx

@@ -18,7 +18,13 @@
  * along with Kyoo. If not, see <https://www.gnu.org/licenses/>.
  */
 
-import { Genre, LibraryItem, LibraryItemP, QueryIdentifier, useInfiniteFetch } from "@kyoo/models";
+import {
+	type Genre,
+	type LibraryItem,
+	LibraryItemP,
+	type QueryIdentifier,
+	useInfiniteFetch,
+} from "@kyoo/models";
 import { H3, ts } from "@kyoo/primitives";
 import { useRef } from "react";
 import { View } from "react-native";

front/packages/ui/src/home/header.tsx

@@ -18,7 +18,7 @@
  * along with Kyoo. If not, see <https://www.gnu.org/licenses/>.
  */
 
-import { KyooImage, LibraryItem, LibraryItemP, QueryIdentifier } from "@kyoo/models";
+import { type KyooImage, type LibraryItem, LibraryItemP, type QueryIdentifier } from "@kyoo/models";
 import {
 	H1,
 	H2,
@@ -33,7 +33,7 @@ import {
 } from "@kyoo/primitives";
 import { View } from "react-native";
 import { percent, rem, useYoshiki } from "yoshiki/native";
-import { WithLoading } from "../fetch";
+import type { WithLoading } from "../fetch";
 import { Header as DetailsHeader } from "../details/header";
 import { useTranslation } from "react-i18next";
 import PlayArrow from "@material-symbols/svg-400/rounded/play_arrow-fill.svg";

front/packages/ui/src/home/index.tsx

@@ -18,7 +18,7 @@
  * along with Kyoo. If not, see <https://www.gnu.org/licenses/>.
  */
 
-import { Genre, QueryPage, toQueryKey } from "@kyoo/models";
+import { Genre, type QueryPage, toQueryKey } from "@kyoo/models";
 import { Fetch } from "../fetch";
 import { Header } from "./header";
 import { DefaultLayout } from "../layout";

front/packages/ui/src/home/news.tsx

@@ -18,7 +18,7 @@
  * along with Kyoo. If not, see <https://www.gnu.org/licenses/>.
  */
 
-import { News, NewsP, QueryIdentifier, getDisplayDate } from "@kyoo/models";
+import { type News, NewsP, type QueryIdentifier, getDisplayDate } from "@kyoo/models";
 import { ItemGrid } from "../browse/grid";
 import { InfiniteFetch } from "../fetch-infinite";
 import { useTranslation } from "react-i18next";

front/packages/ui/src/home/recommended.tsx

@@ -19,12 +19,12 @@
  */
 
 import {
-	Genre,
+	type Genre,
-	KyooImage,
+	type KyooImage,
-	LibraryItem,
+	type LibraryItem,
 	LibraryItemP,
-	QueryIdentifier,
+	type QueryIdentifier,
-	WatchStatusV,
+	type WatchStatusV,
 	getDisplayDate,
 } from "@kyoo/models";
 import {
@@ -43,8 +43,8 @@ import {
 } from "@kyoo/primitives";
 import { useTranslation } from "react-i18next";
 import { ScrollView, View } from "react-native";
-import { Theme, calc, percent, px, rem, useYoshiki } from "yoshiki/native";
+import { type Theme, calc, percent, px, rem, useYoshiki } from "yoshiki/native";
-import { Layout, WithLoading } from "../fetch";
+import type { Layout, WithLoading } from "../fetch";
 import { InfiniteFetch } from "../fetch-infinite";
 import PlayArrow from "@material-symbols/svg-400/rounded/play_arrow-fill.svg";
 import { ItemGrid, ItemWatchStatus } from "../browse/grid";

front/packages/ui/src/home/vertical.tsx

@@ -18,7 +18,7 @@
  * along with Kyoo. If not, see <https://www.gnu.org/licenses/>.
  */
 
-import { LibraryItem, LibraryItemP, QueryIdentifier } from "@kyoo/models";
+import { type LibraryItem, LibraryItemP, type QueryIdentifier } from "@kyoo/models";
 import { H3 } from "@kyoo/primitives";
 import { View } from "react-native";
 import { useYoshiki } from "yoshiki/native";

front/packages/ui/src/home/watchlist.tsx

@@ -18,7 +18,13 @@
  * along with Kyoo. If not, see <https://www.gnu.org/licenses/>.
  */
 
-import { QueryIdentifier, Watchlist, WatchlistP, getDisplayDate, useAccount } from "@kyoo/models";
+import {
+	type QueryIdentifier,
+	type Watchlist,
+	WatchlistP,
+	getDisplayDate,
+	useAccount,
+} from "@kyoo/models";
 import { useYoshiki } from "yoshiki/native";
 import { ItemGrid } from "../browse/grid";
 import { InfiniteFetch } from "../fetch-infinite";

front/packages/ui/src/i18n-d.ts

@@ -19,7 +19,7 @@
  */
 
 import "i18next";
-import en from "../../../translations/en.json";
+import type en from "../../../translations/en.json";
 
 declare module "i18next" {
 	interface CustomTypeOptions {

front/packages/ui/src/layout.tsx

@@ -18,7 +18,7 @@
  * along with Kyoo. If not, see <https://www.gnu.org/licenses/>.
  */
 
-import { ReactElement } from "react";
+import type { ReactElement } from "react";
 import { Navbar } from "./navbar";
 import { useYoshiki, vw } from "yoshiki/native";
 import { Main } from "@kyoo/primitives";

front/packages/ui/src/login/form.tsx

@@ -20,10 +20,10 @@
 
 import { imageFn } from "@kyoo/models";
 import { ts } from "@kyoo/primitives";
-import { ReactNode } from "react";
+import type { ReactNode } from "react";
-import { ScrollView, ImageBackground, ImageProps, Platform, View } from "react-native";
+import { ScrollView, ImageBackground, type ImageProps, Platform, View } from "react-native";
-import Svg, { SvgProps, Path } from "react-native-svg";
+import Svg, { type SvgProps, Path } from "react-native-svg";
-import { min, px, Stylable, useYoshiki, vh } from "yoshiki/native";
+import { min, px, type Stylable, useYoshiki, vh } from "yoshiki/native";
 
 const SvgBlob = (props: SvgProps) => {
 	const { css, theme } = useYoshiki();

front/packages/ui/src/login/login.tsx

@@ -18,7 +18,7 @@
  * along with Kyoo. If not, see <https://www.gnu.org/licenses/>.
  */
 
-import { login, QueryPage } from "@kyoo/models";
+import { login, type QueryPage } from "@kyoo/models";
 import { Button, P, Input, ts, H1, A } from "@kyoo/primitives";
 import { useEffect, useState } from "react";
 import { useTranslation } from "react-i18next";

front/packages/ui/src/login/oidc.tsx

@@ -19,9 +19,9 @@
  */
 
 import {
-	QueryIdentifier,
+	type QueryIdentifier,
-	QueryPage,
+	type QueryPage,
-	ServerInfo,
+	type ServerInfo,
 	ServerInfoP,
 	oidcLogin,
 	useFetch,

front/packages/ui/src/login/password-input.tsx

@@ -19,7 +19,7 @@
  */
 
 import { IconButton, Input } from "@kyoo/primitives";
-import { ComponentProps, useState } from "react";
+import { type ComponentProps, useState } from "react";
 import { px, useYoshiki } from "yoshiki/native";
 import Visibility from "@material-symbols/svg-400/rounded/visibility-fill.svg";
 import VisibilityOff from "@material-symbols/svg-400/rounded/visibility_off-fill.svg";

front/packages/ui/src/login/register.tsx

@@ -18,7 +18,7 @@
  * along with Kyoo. If not, see <https://www.gnu.org/licenses/>.
  */
 
-import { login, QueryPage } from "@kyoo/models";
+import { login, type QueryPage } from "@kyoo/models";
 import { Button, P, Input, ts, H1, A } from "@kyoo/primitives";
 import { useEffect, useState } from "react";
 import { useTranslation } from "react-i18next";

front/packages/ui/src/login/server-url.tsx

@@ -18,13 +18,19 @@
  * along with Kyoo. If not, see <https://www.gnu.org/licenses/>.
  */
 
-import { QueryIdentifier, QueryPage, ServerInfo, ServerInfoP, useFetch } from "@kyoo/models";
+import {
+	type QueryIdentifier,
+	type QueryPage,
+	type ServerInfo,
+	ServerInfoP,
+	useFetch,
+} from "@kyoo/models";
 import { Button, P, Link, Input, ts, H1, HR } from "@kyoo/primitives";
 import { useState } from "react";
 import { useTranslation } from "react-i18next";
 import { ImageBackground, Platform, View } from "react-native";
 import { useRouter } from "solito/router";
-import { Theme, percent, useYoshiki } from "yoshiki/native";
+import { type Theme, percent, useYoshiki } from "yoshiki/native";
 import { DefaultLayout } from "../layout";
 
 export const cleanApiUrl = (apiUrl: string) => {

front/packages/ui/src/navbar/icon.tsx

@@ -18,7 +18,7 @@
  * along with Kyoo. If not, see <https://www.gnu.org/licenses/>.
  */
 
-import Svg, { SvgProps, Path } from "react-native-svg";
+import Svg, { type SvgProps, Path } from "react-native-svg";
 
 /* export const KyooLogo = (props: SvgProps) => ( */
 /* 	<Svg viewBox="0 0 128 128" {...props}> */

front/packages/ui/src/navbar/index.tsx

@@ -32,10 +32,10 @@ import {
 	HR,
 	Link,
 } from "@kyoo/primitives";
-import { Platform, TextInput, View, ViewProps } from "react-native";
+import { Platform, type TextInput, View, type ViewProps } from "react-native";
 import { useTranslation } from "react-i18next";
 import { useRouter } from "solito/router";
-import { Stylable, useYoshiki } from "yoshiki/native";
+import { type Stylable, useYoshiki } from "yoshiki/native";
 import Search from "@material-symbols/svg-400/rounded/search-fill.svg";
 import Login from "@material-symbols/svg-400/rounded/login.svg";
 import Register from "@material-symbols/svg-400/rounded/app_registration.svg";

front/packages/ui/src/player/components/hover.tsx

@@ -35,9 +35,9 @@ import {
 	ts,
 	useIsTouch,
 } from "@kyoo/primitives";
-import { Chapter, KyooImage, Subtitle, Audio } from "@kyoo/models";
+import type { Chapter, KyooImage, Subtitle, Audio } from "@kyoo/models";
 import { useAtomValue, useSetAtom, useAtom } from "jotai";
-import { ImageStyle, Platform, Pressable, View, ViewProps } from "react-native";
+import { type ImageStyle, Platform, Pressable, View, type ViewProps } from "react-native";
 import { useTranslation } from "react-i18next";
 import { percent, rem, useYoshiki } from "yoshiki/native";
 import { useRouter } from "solito/router";
@@ -52,7 +52,7 @@ import {
 	playAtom,
 	progressAtom,
 } from "../state";
-import { ReactNode, useCallback, useEffect, useRef, useState } from "react";
+import { type ReactNode, useCallback, useEffect, useRef, useState } from "react";
 import { atom } from "jotai";
 import { BottomScrubber, ScrubberTooltip } from "./scrubber";
 

front/packages/ui/src/player/components/left-buttons.tsx

@@ -31,7 +31,7 @@ import VolumeMute from "@material-symbols/svg-400/rounded/volume_mute-fill.svg";
 import VolumeDown from "@material-symbols/svg-400/rounded/volume_down-fill.svg";
 import VolumeUp from "@material-symbols/svg-400/rounded/volume_up-fill.svg";
 import { durationAtom, mutedAtom, playAtom, progressAtom, volumeAtom } from "../state";
-import { Stylable, px, useYoshiki } from "yoshiki/native";
+import { type Stylable, px, useYoshiki } from "yoshiki/native";
 import { HoverTouch, hoverAtom } from "./hover";
 
 export const LeftButtons = ({

front/packages/ui/src/player/components/right-buttons.tsx

@@ -18,7 +18,7 @@
  * along with Kyoo. If not, see <https://www.gnu.org/licenses/>.
  */
 
-import { Audio, Subtitle } from "@kyoo/models";
+import type { Audio, Subtitle } from "@kyoo/models";
 import { IconButton, tooltip, Menu, ts } from "@kyoo/primitives";
 import { useAtom } from "jotai";
 import { Platform, View } from "react-native";
@@ -28,7 +28,7 @@ import Fullscreen from "@material-symbols/svg-400/rounded/fullscreen-fill.svg";
 import FullscreenExit from "@material-symbols/svg-400/rounded/fullscreen_exit-fill.svg";
 import SettingsIcon from "@material-symbols/svg-400/rounded/settings-fill.svg";
 import MusicNote from "@material-symbols/svg-400/rounded/music_note-fill.svg";
-import { Stylable, useYoshiki } from "yoshiki/native";
+import { type Stylable, useYoshiki } from "yoshiki/native";
 import { fullscreenAtom, subtitleAtom } from "../state";
 import { AudiosMenu, QualitiesMenu } from "../video";
 

front/packages/ui/src/player/components/scrubber.tsx

@@ -18,10 +18,10 @@
  * along with Kyoo. If not, see <https://www.gnu.org/licenses/>.
  */
 
-import { useFetch, QueryIdentifier, imageFn, Chapter } from "@kyoo/models";
+import { useFetch, type QueryIdentifier, imageFn, type Chapter } from "@kyoo/models";
 import { Sprite, P, imageBorderRadius, ts } from "@kyoo/primitives";
 import { View, Platform } from "react-native";
-import { percent, useYoshiki, px, Theme, useForceRerender } from "yoshiki/native";
+import { percent, useYoshiki, px, type Theme, useForceRerender } from "yoshiki/native";
 import { useMemo } from "react";
 import { useAtomValue } from "jotai";
 import { durationAtom } from "../state";

front/packages/ui/src/player/index.tsx

@@ -19,17 +19,17 @@
  */
 
 import {
-	Episode,
+	type Episode,
 	EpisodeP,
-	Movie,
+	type Movie,
 	MovieP,
-	QueryIdentifier,
+	type QueryIdentifier,
-	WatchInfo,
+	type WatchInfo,
 	WatchInfoP,
 	useFetch,
 } from "@kyoo/models";
 import { Head } from "@kyoo/primitives";
-import { useState, useEffect, ComponentProps } from "react";
+import { useState, useEffect, type ComponentProps } from "react";
 import { Platform, StyleSheet, View } from "react-native";
 import { useTranslation } from "react-i18next";
 import { useRouter } from "solito/router";

front/packages/ui/src/player/keyboard.tsx

@@ -18,7 +18,7 @@
  * along with Kyoo. If not, see <https://www.gnu.org/licenses/>.
  */
 
-import { Subtitle } from "@kyoo/models";
+import type { Subtitle } from "@kyoo/models";
 import { atom, useSetAtom } from "jotai";
 import { useRouter } from "solito/router";
 import { useEffect } from "react";

front/packages/ui/src/player/state.tsx

@@ -18,11 +18,19 @@
  * along with Kyoo. If not, see <https://www.gnu.org/licenses/>.
  */
 
-import { Audio, Episode, Subtitle, getLocalSetting, useAccount } from "@kyoo/models";
+import { type Audio, type Episode, type Subtitle, getLocalSetting, useAccount } from "@kyoo/models";
 import { atom, useAtom, useAtomValue, useSetAtom } from "jotai";
 import { useAtomCallback } from "jotai/utils";
-import { ElementRef, memo, useEffect, useLayoutEffect, useRef, useState, useCallback } from "react";
+import {
-import NativeVideo, { VideoProps } from "./video";
+	type ElementRef,
+	memo,
+	useEffect,
+	useLayoutEffect,
+	useRef,
+	useState,
+	useCallback,
+} from "react";
+import NativeVideo, { type VideoProps } from "./video";
 import { Platform } from "react-native";
 import { useSnackbar } from "@kyoo/primitives";
 import { useTranslation } from "react-i18next";

front/packages/ui/src/player/video.tsx

@@ -33,14 +33,14 @@ declare module "react-native-video" {
 
 export * from "react-native-video";
 
-import { Audio, Subtitle, useToken } from "@kyoo/models";
+import { type Audio, type Subtitle, useToken } from "@kyoo/models";
-import { IconButton, Menu } from "@kyoo/primitives";
+import { type IconButton, Menu } from "@kyoo/primitives";
-import { ComponentProps, forwardRef, useEffect } from "react";
+import { type ComponentProps, forwardRef, useEffect } from "react";
 import { atom, useAtom, useAtomValue, useSetAtom } from "jotai";
 import NativeVideo, {
-	VideoRef,
+	type VideoRef,
-	OnLoadData,
+	type OnLoadData,
-	VideoProps,
+	type VideoProps,
 	SelectedTrackType,
 	SelectedVideoTrackType,
 } from "react-native-video";

front/packages/ui/src/player/video.web.tsx

@@ -18,22 +18,22 @@
  * along with Kyoo. If not, see <https://www.gnu.org/licenses/>.
  */
 
-import { getToken, Subtitle, Audio } from "@kyoo/models";
+import { getToken, type Subtitle, type Audio } from "@kyoo/models";
 import {
 	forwardRef,
-	RefObject,
+	type RefObject,
 	useEffect,
 	useImperativeHandle,
 	useLayoutEffect,
 	useRef,
-	ComponentProps,
+	type ComponentProps,
 } from "react";
-import { VideoProps } from "react-native-video";
+import type { VideoProps } from "react-native-video";
 import { useAtomValue, useSetAtom, useAtom } from "jotai";
 import { useForceRerender, useYoshiki } from "yoshiki";
 import Jassub from "jassub";
 import { audioAtom, playAtom, PlayMode, playModeAtom, progressAtom, subtitleAtom } from "./state";
-import Hls, { Level, LoadPolicy } from "hls.js";
+import Hls, { type Level, type LoadPolicy } from "hls.js";
 import { useTranslation } from "react-i18next";
 import { Menu, tooltip } from "@kyoo/primitives";
 import toVttBlob from "srt-webvtt";