Cutlery/Kyoo
1
0
Fork 0
mirror of https://github.com/zoriya/Kyoo.git synced 2025-05-24 02:02:36 -04:00
Code Issues Packages Projects Releases Wiki Activity

Sort imports

Browse Source
This commit is contained in:
Zoe Roux 2024-05-10 17:23:06 +02:00
parent 491150c261
commit 14f2f8cb8c
No known key found for this signature in database
97 changed files with 413 additions and 413 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
front/apps/mobile/app/(app)/(tabs)/_layout.tsx
View File

@ -19,10 +19,10 @@
*/
import { Icon } from "@kyoo/primitives";
import { Tabs } from "expo-router";
import Home from "@material-symbols/svg-400/rounded/home-fill.svg";
import Browse from "@material-symbols/svg-400/rounded/browse-fill.svg";
import Downloading from "@material-symbols/svg-400/rounded/downloading-fill.svg";
import Home from "@material-symbols/svg-400/rounded/home-fill.svg";
import { Tabs } from "expo-router";
export default function TabsLayout() {
return (

42
front/apps/mobile/app/_layout.tsx
View File

@ -20,39 +20,39 @@
import "react-native-reanimated";
import { PortalProvider } from "@gorhom/portal";
import { SnackbarProvider, ThemeSelector } from "@kyoo/primitives";
import { DownloadProvider } from "@kyoo/ui";
import { AccountProvider, createQueryClient, storage, useUserTheme } from "@kyoo/models";
import { PersistQueryClientProvider } from "@tanstack/react-query-persist-client";
import { createSyncStoragePersister } from "@tanstack/query-sync-storage-persister";
import i18next from "i18next";
import { Slot } from "expo-router";
import { getLocales } from "expo-localization";
import * as SplashScreen from "expo-splash-screen";
import {
useFonts,
Poppins_300Light,
Poppins_400Regular,
Poppins_900Black,
useFonts,
} from "@expo-google-fonts/poppins";
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";
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-displaynames/polyfill";
import "@formatjs/intl-locale/polyfill";
import { PortalProvider } from "@gorhom/portal";
import { AccountProvider, createQueryClient, storage, useUserTheme } from "@kyoo/models";
import { SnackbarProvider, ThemeSelector } from "@kyoo/primitives";
import { DownloadProvider } from "@kyoo/ui";
import { ThemeProvider as RNThemeProvider } from "@react-navigation/native";
import { createSyncStoragePersister } from "@tanstack/query-sync-storage-persister";
import { PersistQueryClientProvider } from "@tanstack/react-query-persist-client";
import { getLocales } from "expo-localization";
import { Slot } from "expo-router";
import * as SplashScreen from "expo-splash-screen";
import i18next from "i18next";
import "intl-pluralrules";
import { type ReactNode, useEffect, useState } from "react";
import { initReactI18next } from "react-i18next";
import { useColorScheme } from "react-native";
import NetInfo from "@react-native-community/netinfo";
import { onlineManager } from "@tanstack/react-query";
import { useTheme } from "yoshiki/native";
// TODO: use a backend to load jsons.
import en from "../../../translations/en.json";
import fr from "../../../translations/fr.json";
import zh from "../../../translations/zh.json";
import { useTheme } from "yoshiki/native";
import NetInfo from "@react-native-community/netinfo";
import { onlineManager } from "@tanstack/react-query";
onlineManager.setEventListener((setOnline) => {
return NetInfo.addEventListener((state) => {

12
front/apps/mobile/app/utils.tsx
View File

@ -18,14 +18,14 @@
* along with Kyoo. If not, see <https://www.gnu.org/licenses/>.
*/
import { Stack, useLocalSearchParams } from "expo-router";
import { type ComponentType, useEffect } from "react";
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 { type QueryPage, useHasPermission } from "@kyoo/models";
import { Unauthorized } from "@kyoo/ui";
import arrayShuffle from "array-shuffle";
import * as NavigationBar from "expo-navigation-bar";
import { Stack, useLocalSearchParams } from "expo-router";
import * as ScreenOrientation from "expo-screen-orientation";
import { type ComponentType, useEffect } from "react";
import { StatusBar, type StatusBarProps } from "react-native";
const FullscreenProvider = () => {
useEffect(() => {

4
front/apps/web/src/i18n.tsx
View File

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

44
front/apps/web/src/pages/_app.tsx
View File

@ -20,42 +20,42 @@
import "../polyfill";
import { HydrationBoundary, QueryClientProvider, dehydrate } from "@tanstack/react-query";
import { ReactQueryDevtools } from "@tanstack/react-query-devtools";
import {
HiddenIfNoJs,
TouchOnlyCss,
SkeletonCss,
ThemeSelector,
SnackbarProvider,
} from "@kyoo/primitives";
import { WebTooltip } from "@kyoo/primitives/src/tooltip.web";
import { PortalProvider } from "@gorhom/portal";
import {
AccountP,
AccountProvider,
ConnectionErrorContext,
createQueryClient,
fetchQuery,
getTokenWJ,
type QueryIdentifier,
type QueryPage,
ServerInfoP,
setSsrApiUrl,
UserP,
createQueryClient,
fetchQuery,
getTokenWJ,
setSsrApiUrl,
useUserTheme,
} from "@kyoo/models";
import { type ComponentType, useContext, useState } from "react";
import { getCurrentAccount, readCookie, updateAccount } from "@kyoo/models/src/account-internal";
import {
HiddenIfNoJs,
SkeletonCss,
SnackbarProvider,
ThemeSelector,
TouchOnlyCss,
} from "@kyoo/primitives";
import { WebTooltip } from "@kyoo/primitives/src/tooltip.web";
import { ConnectionError } from "@kyoo/ui";
import { HydrationBoundary, QueryClientProvider, dehydrate } from "@tanstack/react-query";
import { ReactQueryDevtools } from "@tanstack/react-query-devtools";
import arrayShuffle from "array-shuffle";
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";
import Head from "next/head";
import { withTranslations } from "../i18n";
import arrayShuffle from "array-shuffle";
import { type ComponentType, useContext, useState } from "react";
import { Tooltip } from "react-tooltip";
import { getCurrentAccount, readCookie, updateAccount } from "@kyoo/models/src/account-internal";
import { PortalProvider } from "@gorhom/portal";
import { ConnectionError } from "@kyoo/ui";
import superjson from "superjson";
import { StyleRegistryProvider, useMobileHover, useStyleRegistry, useTheme } from "yoshiki/web";
import { withTranslations } from "../i18n";
const font = Poppins({ weight: ["300", "400", "900"], subsets: ["latin"], display: "swap" });

4
front/apps/web/src/pages/_document.tsx
View File

@ -18,9 +18,9 @@
* along with Kyoo. If not, see <https://www.gnu.org/licenses/>.
*/
import { type DocumentContext, Head, Html, Main, NextScript } from "next/document";
import { AppRegistry } from "react-native";
import { Html, Main, Head, NextScript, type DocumentContext } from "next/document";
import { createStyleRegistry, StyleRegistryProvider } from "yoshiki/web";
import { StyleRegistryProvider, createStyleRegistry } from "yoshiki/web";
export const style = `
/**

4
front/packages/models/src/account-internal.ts
View File

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

16
front/packages/models/src/accounts.tsx
View File

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

12
front/packages/models/src/login.ts
View File

@ -18,13 +18,13 @@
* along with Kyoo. If not, see <https://www.gnu.org/licenses/>.
*/
import { queryFn } from "./query";
import type { KyooErrors } from "./kyoo-errors";
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";
import { useEffect, useRef, useState } from "react";
import { Platform } from "react-native";
import { addAccount, getCurrentAccount, removeAccounts, updateAccount } from "./account-internal";
import { type Account, type Token, TokenP, getCurrentApiUrl } from "./accounts";
import type { KyooErrors } from "./kyoo-errors";
import { queryFn } from "./query";
import { UserP } from "./resources";
type Result<A, B> =
| { ok: true; value: A; error?: undefined }

8
front/packages/models/src/query.tsx
View File

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

2
front/packages/models/src/resources/episode.base.ts
View File

@ -19,9 +19,9 @@
*/
import { z } from "zod";
import { zdate } from "../utils";
import { ImagesP, imageFn } from "../traits";
import { ResourceP } from "../traits/resource";
import { zdate } from "../utils";
export const BaseEpisodeP = ResourceP("episode")
.merge(ImagesP)

2
front/packages/models/src/resources/episode.ts
View File

@ -19,8 +19,8 @@
*/
import { z } from "zod";
import { ShowP } from "./show";
import { BaseEpisodeP } from "./episode.base";
import { ShowP } from "./show";
import { WatchStatusP } from "./watch-status";
export const EpisodeP = BaseEpisodeP.and(

8
front/packages/models/src/resources/movie.ts
View File

@ -19,13 +19,13 @@
*/
import { z } from "zod";
import { zdate } from "../utils";
import { ImagesP, ResourceP, imageFn } from "../traits";
import { Genre } from "./genre";
import { StudioP } from "./studio";
import { Status } from "./show";
import { zdate } from "../utils";
import { CollectionP } from "./collection";
import { Genre } from "./genre";
import { MetadataP } from "./metadata";
import { Status } from "./show";
import { StudioP } from "./studio";
import { WatchStatusP } from "./watch-status";
export const MovieP = ResourceP("movie")

2
front/packages/models/src/resources/news.ts
View File

@ -19,8 +19,8 @@
*/
import { z } from "zod";
import { MovieP } from "./movie";
import { EpisodeP } from "./episode";
import { MovieP } from "./movie";
export const NewsP = z.union([
/*

2
front/packages/models/src/resources/season.ts
View File

@ -19,8 +19,8 @@
*/
import { z } from "zod";
import { zdate } from "../utils";
import { ImagesP, ResourceP } from "../traits";
import { zdate } from "../utils";
export const SeasonP = ResourceP("season").merge(ImagesP).extend({
/**

2
front/packages/models/src/resources/server-info.ts
View File

@ -18,9 +18,9 @@
* along with Kyoo. If not, see <https://www.gnu.org/licenses/>.
*/
import { Platform } from "react-native";
import { z } from "zod";
import { imageFn } from "..";
import { Platform } from "react-native";
export const OidcInfoP = z.object({
/*

6
front/packages/models/src/resources/show.ts
View File

@ -19,12 +19,12 @@
*/
import { z } from "zod";
import { zdate } from "../utils";
import { ImagesP, ResourceP } from "../traits";
import { Genre } from "./genre";
import { StudioP } from "./studio";
import { zdate } from "../utils";
import { BaseEpisodeP } from "./episode.base";
import { Genre } from "./genre";
import { MetadataP } from "./metadata";
import { StudioP } from "./studio";
import { ShowWatchStatusP } from "./watch-status";
/**

2
front/packages/models/src/resources/user.ts
View File

@ -19,8 +19,8 @@
*/
import { z } from "zod";
import { ResourceP } from "../traits/resource";
import { imageFn } from "../traits/images";
import { ResourceP } from "../traits/resource";
export const UserP = ResourceP("user")
.extend({

2
front/packages/models/src/resources/watch-info.ts
View File

@ -18,9 +18,9 @@
* along with Kyoo. If not, see <https://www.gnu.org/licenses/>.
*/
import i18next from "i18next";
import { z } from "zod";
import { imageFn } from "../traits";
import i18next from "i18next";
import { QualityP } from "./quality";
const getDisplayName = (sub: Track) => {

2
front/packages/models/src/theme.ts
View File

@ -18,9 +18,9 @@
* along with Kyoo. If not, see <https://www.gnu.org/licenses/>.
*/
import { Platform } from "react-native";
import { useMMKVString } from "react-native-mmkv";
import { setCookie, storage } from "./account-internal";
import { Platform } from "react-native";
export const useUserTheme = (ssrTheme?: "light" | "dark" | "auto") => {
if (Platform.OS === "web" && typeof window === "undefined" && ssrTheme) return ssrTheme;

4
front/packages/models/src/utils.ts
View File

@ -19,10 +19,10 @@
*/
import { Platform } from "react-native";
import type { Movie, Show } from "./resources";
import { z } from "zod";
import { useMMKVString } from "react-native-mmkv";
import { z } from "zod";
import { storage } from "./account-internal";
import type { Movie, Show } from "./resources";
export const zdate = z.coerce.date;

2
front/packages/primitives/src/alert.tsx
View File

@ -20,7 +20,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 AlertButton, type AlertOptions, Alert as RNAlert } from "react-native";
import type { SweetAlertIcon } from "sweetalert2";
export interface ExtendedAlertStatic {

8
front/packages/primitives/src/avatar.tsx
View File

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

2
front/packages/primitives/src/button.tsx
View File

@ -19,11 +19,11 @@
*/
import { type ComponentType, type ForwardedRef, type ReactElement, forwardRef } from "react";
import { type Falsy, type PressableProps, View } from "react-native";
import { type Theme, useYoshiki } from "yoshiki/native";
import { PressableFeedback } from "./links";
import { P } from "./text";
import { ts } from "./utils";
import { type Falsy, type PressableProps, View } from "react-native";
export const Button = forwardRef(function Button<AsProps = PressableProps>(
{

6
front/packages/primitives/src/chip.tsx
View File

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

2
front/packages/primitives/src/divider.tsx
View File

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

4
front/packages/primitives/src/icons.tsx
View File

@ -23,10 +23,10 @@ import { type ComponentProps, type ComponentType, type ForwardedRef, forwardRef
import { Platform, type PressableProps } from "react-native";
import type { SvgProps } from "react-native-svg";
import type { YoshikiStyle } from "yoshiki";
import { px, type Stylable, type Theme, useYoshiki } from "yoshiki/native";
import { type Stylable, type Theme, px, useYoshiki } from "yoshiki/native";
import { PressableFeedback } from "./links";
import { type Breakpoint, focusReset, ts } from "./utils";
import { P } from "./text";
import { type Breakpoint, focusReset, ts } from "./utils";
declare module "react" {
function forwardRef<T, P = {}>(

6
front/packages/primitives/src/image/image.tsx
View File

@ -18,14 +18,14 @@
* along with Kyoo. If not, see <https://www.gnu.org/licenses/>.
*/
import { getCurrentToken } from "@kyoo/models";
import { useState } from "react";
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 FastImage from "react-native-fast-image";
import { percent, useYoshiki } from "yoshiki/native";
import type { Props, ImageLayout } from "./base-image";
import { Skeleton } from "../skeleton";
import { getCurrentToken } from "@kyoo/models";
import type { ImageLayout, Props } from "./base-image";
export const Image = ({
src,

8
front/packages/primitives/src/image/image.web.tsx
View File

@ -18,14 +18,14 @@
* along with Kyoo. If not, see <https://www.gnu.org/licenses/>.
*/
import NextImage from "next/image";
import { useState } from "react";
import { type ImageStyle, View, type ViewStyle } from "react-native";
import { useYoshiki } from "yoshiki/native";
import type { Props, ImageLayout } from "./base-image";
import { BlurhashContainer } from "./blurhash.web";
import { Skeleton } from "../skeleton";
import NextImage from "next/image";
import { imageBorderRadius } from "../constants";
import { Skeleton } from "../skeleton";
import type { ImageLayout, Props } from "./base-image";
import { BlurhashContainer } from "./blurhash.web";
export const Image = ({
src,

6
front/packages/primitives/src/input.tsx
View File

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

12
front/packages/primitives/src/links.tsx
View File

@ -18,20 +18,20 @@
* along with Kyoo. If not, see <https://www.gnu.org/licenses/>.
*/
import { forwardRef, type ReactNode } from "react";
import type { UrlObject } from "node:url";
import { type ReactNode, forwardRef } from "react";
import {
Linking,
Platform,
Pressable,
type PressableProps,
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";
import { alpha } from "./themes";
import { parseNextPath } from "solito/router";
import { useTheme, useYoshiki } from "yoshiki/native";
import { alpha } from "./themes";
export const A = ({
href,

12
front/packages/primitives/src/menu.tsx
View File

@ -19,29 +19,29 @@
*/
import { Portal } from "@gorhom/portal";
import Check from "@material-symbols/svg-400/rounded/check-fill.svg";
import Close from "@material-symbols/svg-400/rounded/close-fill.svg";
import { ScrollView } from "moti";
import {
type ComponentType,
createContext,
type ReactElement,
type ReactNode,
createContext,
useContext,
useEffect,
useRef,
useState,
} from "react";
import { StyleSheet, Pressable, View } from "react-native";
import { Pressable, StyleSheet, View } from "react-native";
import { useSafeAreaInsets } from "react-native-safe-area-context";
import type { SvgProps } from "react-native-svg";
import { useRouter } from "solito/router";
import { percent, px, sm, useYoshiki, vh, xl } from "yoshiki/native";
import Close from "@material-symbols/svg-400/rounded/close-fill.svg";
import { Icon, IconButton } from "./icons";
import { PressableFeedback } from "./links";
import { P } from "./text";
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 type { SvgProps } from "react-native-svg";
const MenuContext = createContext<((open: boolean) => void) | undefined>(undefined);

12
front/packages/primitives/src/menu.web.tsx
View File

@ -18,24 +18,24 @@
* along with Kyoo. If not, see <https://www.gnu.org/licenses/>.
*/
import Dot from "@material-symbols/svg-400/rounded/fiber_manual_record-fill.svg";
import * as DropdownMenu from "@radix-ui/react-dropdown-menu";
import Link from "next/link";
import {
type ComponentProps,
type ComponentType,
forwardRef,
type ReactElement,
type ReactNode,
forwardRef,
} from "react";
import Link from "next/link";
import type { PressableProps } from "react-native";
import { useYoshiki } from "yoshiki/web";
import type { SvgProps } from "react-native-svg";
import { useYoshiki as useNativeYoshiki } from "yoshiki/native";
import { useYoshiki } from "yoshiki/web";
import { Icon } from "./icons";
import { P } from "./text";
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 type { SvgProps } from "react-native-svg";
type YoshikiFunc<T> = (props: ReturnType<typeof useYoshiki>) => T;
export const YoshikiProvider = ({ children }: { children: YoshikiFunc<ReactNode> }) => {

10
front/packages/primitives/src/popup.tsx
View File

@ -18,13 +18,13 @@
* along with Kyoo. If not, see <https://www.gnu.org/licenses/>.
*/
import { type ReactNode, useCallback, useEffect, useState } from "react";
import { Container } from "./container";
import { usePortal } from "@gorhom/portal";
import { ContrastArea, SwitchVariant, type YoshikiFunc } from "./themes";
import { View, ScrollView } from "react-native";
import { imageBorderRadius } from "./constants";
import { type ReactNode, useCallback, useEffect, useState } from "react";
import { ScrollView, View } from "react-native";
import { px, vh } from "yoshiki/native";
import { imageBorderRadius } from "./constants";
import { Container } from "./container";
import { ContrastArea, SwitchVariant, type YoshikiFunc } from "./themes";
import { ts } from "./utils";
export const Popup = ({ children, ...props }: { children: ReactNode | YoshikiFunc<ReactNode> }) => {

2
front/packages/primitives/src/progress.tsx
View File

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

4
front/packages/primitives/src/select.tsx
View File

@ -18,10 +18,10 @@
* along with Kyoo. If not, see <https://www.gnu.org/licenses/>.
*/
import { Icon } from "./icons";
import ExpandMore from "@material-symbols/svg-400/rounded/expand_more-fill.svg";
import { Menu } from "./menu";
import { Button } from "./button";
import { Icon } from "./icons";
import { Menu } from "./menu";
export const Select = <Value extends string>({
label,

22
front/packages/primitives/src/select.web.tsx
View File

@ -18,20 +18,20 @@
* along with Kyoo. If not, see <https://www.gnu.org/licenses/>.
*/
import Check from "@material-symbols/svg-400/rounded/check-fill.svg";
import ExpandLess from "@material-symbols/svg-400/rounded/expand_less-fill.svg";
import ExpandMore from "@material-symbols/svg-400/rounded/expand_more-fill.svg";
import * as RSelect from "@radix-ui/react-select";
import { forwardRef } from "react";
import { Icon } from "./icons";
import Check from "@material-symbols/svg-400/rounded/check-fill.svg";
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 { type Theme, px, useYoshiki as useNativeYoshiki } from "yoshiki/native";
import { useYoshiki } from "yoshiki";
import { PressableFeedback } from "./links";
import { P } from "./text";
import { focusReset, ts } from "./utils";
import { View } from "react-native";
import { useYoshiki } from "yoshiki";
import { type Theme, px, useYoshiki as useNativeYoshiki } from "yoshiki/native";
import { Icon } from "./icons";
import { PressableFeedback } from "./links";
import { InternalTriger, YoshikiProvider } from "./menu.web";
import { P } from "./text";
import { ContrastArea, SwitchVariant } from "./themes";
import { focusReset, ts } from "./utils";
export const Select = ({
label,

4
front/packages/primitives/src/skeleton.tsx
View File

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

2
front/packages/primitives/src/skeleton.web.tsx
View File

@ -20,7 +20,7 @@
import { LinearGradient } from "expo-linear-gradient";
import { View, type ViewProps } from "react-native";
import { px, rem, useYoshiki, percent, em } from "yoshiki/native";
import { em, percent, px, rem, useYoshiki } from "yoshiki/native";
import { hiddenIfNoJs } from "./utils/nojs";
export const SkeletonCss = () => (

4
front/packages/primitives/src/slider.tsx
View File

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

6
front/packages/primitives/src/snackbar.tsx
View File

@ -20,13 +20,13 @@
import { usePortal } from "@gorhom/portal";
import { type ReactElement, createContext, useCallback, useContext, useRef } from "react";
import { ContrastArea, SwitchVariant } from "./themes";
import { P } from "./text";
import { View } from "react-native";
import { percent, px } from "yoshiki/native";
import { ts } from "./utils";
import { Button } from "./button";
import { imageBorderRadius } from "./constants";
import { P } from "./text";
import { ContrastArea, SwitchVariant } from "./themes";
import { ts } from "./utils";
export type Snackbar = {
key?: string;

6
front/packages/primitives/src/text.tsx
View File

@ -18,9 +18,6 @@
* along with Kyoo. If not, see <https://www.gnu.org/licenses/>.
*/
import type { ComponentType, ComponentProps } from "react";
import { Platform, Text, type TextProps, type TextStyle, type StyleProp } from "react-native";
import { percent, rem, useYoshiki } from "yoshiki/native";
import {
H1 as EH1,
H2 as EH2,
@ -30,6 +27,9 @@ import {
H6 as EH6,
P as EP,
} from "@expo/html-elements";
import type { ComponentProps, ComponentType } from "react";
import { Platform, type StyleProp, Text, type TextProps, type TextStyle } from "react-native";
import { percent, rem, useYoshiki } from "yoshiki/native";
import { ts } from "./utils/spacing";
const styleText = (

6
front/packages/primitives/src/themes/theme.tsx
View File

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

4
front/packages/primitives/src/tooltip.web.tsx
View File

@ -18,9 +18,9 @@
* along with Kyoo. If not, see <https://www.gnu.org/licenses/>.
*/
import type { Theme } from "yoshiki/native";
import { Tooltip as RTooltip } from "react-tooltip";
import { forwardRef } from "react";
import { Tooltip as RTooltip } from "react-tooltip";
import type { Theme } from "yoshiki/native";
import { ContrastArea } from "./themes";
export const tooltip = (tooltip: string, up?: boolean) => ({

2
front/packages/primitives/src/utils/breakpoints.ts
View File

@ -19,7 +19,7 @@
*/
import { useWindowDimensions } from "react-native";
import { type Breakpoints as YoshikiBreakpoint, isBreakpoints, breakpoints } from "yoshiki/native";
import { type Breakpoints as YoshikiBreakpoint, breakpoints, isBreakpoints } 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>>;

2
front/packages/ui/src/admin/index.tsx
View File

@ -22,8 +22,8 @@ import type { QueryPage } from "@kyoo/models";
import { ts } from "@kyoo/primitives";
import { ScrollView } from "react-native";
import { DefaultLayout } from "../layout";
import { UserList } from "./users";
import { Scanner } from "./scanner";
import { UserList } from "./users";
export const AdminPage: QueryPage = () => {
return (

8
front/packages/ui/src/admin/scanner.tsx
View File

@ -19,13 +19,13 @@
*/
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";
import { ErrorView } from "../errors";
import { z } from "zod";
import { useTranslation } from "react-i18next";
import { View } from "react-native";
import { useYoshiki } from "yoshiki/native";
import { z } from "zod";
import { ErrorView } from "../errors";
import { SettingsContainer } from "../settings/base";
import Info from "@material-symbols/svg-400/outlined/info.svg";
import Scan from "@material-symbols/svg-400/outlined/sensors.svg";

4
front/packages/ui/src/admin/users.tsx
View File

@ -29,10 +29,10 @@ import { SettingsContainer } from "../settings/base";
import UserI from "@material-symbols/svg-400/rounded/account_circle.svg";
import Delete from "@material-symbols/svg-400/rounded/delete.svg";
import MoreVert from "@material-symbols/svg-400/rounded/more_vert.svg";
import Verifed from "@material-symbols/svg-400/rounded/verified_user.svg";
import Unverifed from "@material-symbols/svg-400/rounded/gpp_bad.svg";
import MoreVert from "@material-symbols/svg-400/rounded/more_vert.svg";
import Admin from "@material-symbols/svg-400/rounded/shield_person.svg";
import Verifed from "@material-symbols/svg-400/rounded/verified_user.svg";
import { useMutation, useQueryClient } from "@tanstack/react-query";
export const UserGrid = ({

22
front/packages/ui/src/browse/grid.tsx
View File

@ -20,22 +20,22 @@
import { type KyooImage, WatchStatusV } from "@kyoo/models";
import {
Link,
Skeleton,
ts,
focusReset,
P,
SubP,
PosterBackground,
Icon,
Link,
P,
PosterBackground,
Skeleton,
SubP,
focusReset,
important,
ts,
} from "@kyoo/primitives";
import { type ImageStyle, Platform, View } from "react-native";
import { max, percent, px, rem, type Stylable, type Theme, useYoshiki } from "yoshiki/native";
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";
import { type ImageStyle, Platform, View } from "react-native";
import { type Stylable, type Theme, max, percent, px, rem, useYoshiki } from "yoshiki/native";
import { ItemContext } from "../components/context-menus";
import type { Layout, WithLoading } from "../fetch";
export const ItemWatchStatus = ({
watchStatus,

18
front/packages/ui/src/browse/header.tsx
View File

@ -29,17 +29,17 @@ import {
tooltip,
ts,
} from "@kyoo/primitives";
import { useTranslation } from "react-i18next";
import { useYoshiki } from "yoshiki/native";
import Style from "@material-symbols/svg-400/rounded/style.svg";
import GridView from "@material-symbols/svg-400/rounded/grid_view.svg";
import ViewList from "@material-symbols/svg-400/rounded/view_list.svg";
import Sort from "@material-symbols/svg-400/rounded/sort.svg";
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 ArrowUpward from "@material-symbols/svg-400/rounded/arrow_upward.svg";
import GridView from "@material-symbols/svg-400/rounded/grid_view.svg";
import Sort from "@material-symbols/svg-400/rounded/sort.svg";
import Style from "@material-symbols/svg-400/rounded/style.svg";
import ViewList from "@material-symbols/svg-400/rounded/view_list.svg";
import { forwardRef } from "react";
import { View, type PressableProps } from "react-native";
import { useTranslation } from "react-i18next";
import { type PressableProps, View } from "react-native";
import { useYoshiki } from "yoshiki/native";
import { Layout, SearchSort, SortOrd } from "./types";
const SortTrigger = forwardRef<View, PressableProps & { sortKey: string }>(function SortTrigger(
{ sortKey, ...props },

10
front/packages/ui/src/browse/index.tsx
View File

@ -19,21 +19,21 @@
*/
import {
type QueryIdentifier,
type QueryPage,
type LibraryItem,
LibraryItemP,
type QueryIdentifier,
type QueryPage,
getDisplayDate,
} from "@kyoo/models";
import { type ComponentProps, useState } from "react";
import { createParam } from "solito";
import { DefaultLayout } from "../layout";
import type { WithLoading } from "../fetch";
import { InfiniteFetch } from "../fetch-infinite";
import { DefaultLayout } from "../layout";
import { ItemGrid } from "./grid";
import { ItemList } from "./list";
import { SortBy, SortOrd, Layout } from "./types";
import { BrowseSettings } from "./header";
import { ItemList } from "./list";
import { Layout, SortBy, SortOrd } from "./types";
const { useParam } = createParam<{ sortBy?: string }>();

10
front/packages/ui/src/browse/list.tsx
View File

@ -20,22 +20,22 @@
import type { KyooImage, WatchStatusV } from "@kyoo/models";
import {
Heading,
ImageBackground,
Link,
P,
Skeleton,
ts,
ImageBackground,
Heading,
PosterBackground,
Skeleton,
imageBorderRadius,
important,
ts,
} from "@kyoo/primitives";
import { useState } from "react";
import { Platform, View } from "react-native";
import { percent, px, rem, useYoshiki } from "yoshiki/native";
import { ItemContext } from "../components/context-menus";
import type { Layout, WithLoading } from "../fetch";
import { ItemWatchStatus } from "./grid";
import { ItemContext } from "../components/context-menus";
export const ItemList = ({
href,

12
front/packages/ui/src/collection/index.tsx
View File

@ -27,18 +27,18 @@ import {
type QueryPage,
getDisplayDate,
} from "@kyoo/models";
import { Header as ShowHeader, TitleLine } from "../details/header";
import { Container, Head, ImageBackground, P, Skeleton, ts, usePageStyle } from "@kyoo/primitives";
import { percent, px, useYoshiki } from "yoshiki/native";
import { useTranslation } from "react-i18next";
import { forwardRef } from "react";
import { useTranslation } from "react-i18next";
import { Platform, View, type ViewProps } from "react-native";
import { percent, px, useYoshiki } from "yoshiki/native";
import { ItemGrid } from "../browse/grid";
import { Header as ShowHeader, TitleLine } from "../details/header";
import { SvgWave } from "../details/show";
import { Fetch } from "../fetch";
import { InfiniteFetch } from "../fetch-infinite";
import { DefaultLayout } from "../layout";
import { ItemDetails } from "../home/recommended";
import { SvgWave } from "../details/show";
import { ItemGrid } from "../browse/grid";
import { DefaultLayout } from "../layout";
const Header = ({ slug }: { slug: string }) => {
const { css } = useYoshiki();

4
front/packages/ui/src/components/media-info.tsx
View File

@ -26,11 +26,11 @@ import {
WatchInfoP,
} from "@kyoo/models";
import { Button, HR, P, Popup, Skeleton } from "@kyoo/primitives";
import { Fetch } from "../fetch";
import { Fragment } from "react";
import { useTranslation } from "react-i18next";
import { View } from "react-native";
import { useYoshiki } from "yoshiki/native";
import { Fragment } from "react";
import { Fetch } from "../fetch";
const MediaInfoTable = ({
mediaInfo: { path, video, container, audios, subtitles, duration, size },

2
front/packages/ui/src/components/rating.tsx
View File

@ -19,8 +19,8 @@
*/
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 { View } from "react-native";
import { rem, useYoshiki } from "yoshiki/native";
export const Rating = ({ rating, color }: { rating?: number; color: Breakpoint<string> }) => {

8
front/packages/ui/src/components/watchlist-info.tsx
View File

@ -18,15 +18,15 @@
* along with Kyoo. If not, see <https://www.gnu.org/licenses/>.
*/
import { WatchStatusV, queryFn, useAccount } from "@kyoo/models";
import { IconButton, Menu, tooltip } from "@kyoo/primitives";
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";
import BookmarkAdd from "@material-symbols/svg-400/rounded/bookmark_add.svg";
import BookmarkAdded from "@material-symbols/svg-400/rounded/bookmark_added-fill.svg";
import BookmarkRemove from "@material-symbols/svg-400/rounded/bookmark_remove.svg";
import { useMutation, useQueryClient } from "@tanstack/react-query";
import { WatchStatusV, queryFn, useAccount } from "@kyoo/models";
import type { ComponentProps } from "react";
import { useTranslation } from "react-i18next";
export const watchListIcon = (status: WatchStatusV | null) => {
switch (status) {

16
front/packages/ui/src/details/episode.tsx
View File

@ -18,30 +18,30 @@
* along with Kyoo. If not, see <https://www.gnu.org/licenses/>.
*/
import { type KyooImage, WatchStatusV } from "@kyoo/models";
import {
focusReset,
H6,
IconButton,
ImageBackground,
type ImageProps,
important,
Link,
P,
Skeleton,
SubP,
focusReset,
important,
tooltip,
ts,
} from "@kyoo/primitives";
import ExpandLess from "@material-symbols/svg-400/rounded/expand_less-fill.svg";
import ExpandMore from "@material-symbols/svg-400/rounded/expand_more-fill.svg";
import { useState } from "react";
import { useTranslation } from "react-i18next";
import { type ImageStyle, Platform, type PressableProps, View } from "react-native";
import type { Layout, WithLoading } from "../fetch";
import { percent, rem, type Stylable, type Theme, useYoshiki } from "yoshiki/native";
import { type KyooImage, WatchStatusV } from "@kyoo/models";
import { type Stylable, type Theme, percent, rem, useYoshiki } from "yoshiki/native";
import { ItemProgress } from "../browse/grid";
import { EpisodesContext } from "../components/context-menus";
import { useState } from "react";
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 type { Layout, WithLoading } from "../fetch";
export const episodeDisplayNumber = (
episode: {

4
front/packages/ui/src/details/movie.tsx
View File

@ -19,12 +19,12 @@
*/
import { type Movie, MovieP, type QueryIdentifier, type QueryPage } from "@kyoo/models";
import { usePageStyle } from "@kyoo/primitives";
import { Platform, ScrollView } from "react-native";
import { useYoshiki } from "yoshiki/native";
import { DefaultLayout } from "../layout";
import { Header } from "./header";
import { DetailsCollections } from "./collection";
import { usePageStyle } from "@kyoo/primitives";
import { Header } from "./header";
const query = (slug: string): QueryIdentifier<Movie> => ({
parser: MovieP,

14
front/packages/ui/src/details/season.tsx
View File

@ -26,14 +26,14 @@ import {
SeasonP,
useInfiniteFetch,
} from "@kyoo/models";
import { Skeleton, H6, HR, P, ts, Menu, IconButton, tooltip, usePageStyle } from "@kyoo/primitives";
import { rem, useYoshiki } from "yoshiki/native";
import { View } from "react-native";
import { InfiniteFetch } from "../fetch-infinite";
import { episodeDisplayNumber, EpisodeLine } from "./episode";
import { useTranslation } from "react-i18next";
import type { ComponentType } from "react";
import { H6, HR, IconButton, Menu, P, Skeleton, tooltip, ts, usePageStyle } from "@kyoo/primitives";
import MenuIcon from "@material-symbols/svg-400/rounded/menu-fill.svg";
import type { ComponentType } from "react";
import { useTranslation } from "react-i18next";
import { View } from "react-native";
import { rem, useYoshiki } from "yoshiki/native";
import { InfiniteFetch } from "../fetch-infinite";
import { EpisodeLine, episodeDisplayNumber } from "./episode";
type SeasonProcessed = Season & { href: string };

14
front/packages/ui/src/details/show.tsx
View File

@ -25,17 +25,17 @@ import {
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, type SvgProps } from "react-native-svg";
import { Container, H2, SwitchVariant, focusReset, ts } from "@kyoo/primitives";
import { forwardRef, useState } from "react";
import { useTranslation } from "react-i18next";
import { Platform, View, type ViewProps } from "react-native";
import Svg, { Path, type SvgProps } from "react-native-svg";
import { percent, useYoshiki } from "yoshiki/native";
import { DefaultLayout } from "../layout";
import { DetailsCollections } from "./collection";
import { EpisodeLine, episodeDisplayNumber } from "./episode";
import { useTranslation } from "react-i18next";
import { Header } from "./header";
import { EpisodeList, SeasonHeader } from "./season";
export const SvgWave = (props: SvgProps) => {
const { css } = useYoshiki();

2
front/packages/ui/src/downloads/index.web.tsx
View File

@ -19,9 +19,9 @@
*/
import { type WatchInfo, getCurrentApiUrl, queryFn, toQueryKey } from "@kyoo/models";
import { Player } from "../player";
import { getCurrentAccount } from "@kyoo/models/src/account-internal";
import type { ReactNode } from "react";
import { Player } from "../player";
export const useDownloader = () => {
return async (type: "episode" | "movie", slug: string) => {

18
front/packages/ui/src/downloads/page.tsx
View File

@ -18,9 +18,7 @@
* along with Kyoo. If not, see <https://www.gnu.org/licenses/>.
*/
import { type State, downloadAtom } from "./state";
import { FlashList } from "@shopify/flash-list";
import { type ImageStyle, View } from "react-native";
import type { KyooImage } from "@kyoo/models";
import {
Alert,
H6,
@ -34,17 +32,19 @@ import {
ts,
usePageStyle,
} from "@kyoo/primitives";
import { EpisodeLine, displayRuntime, episodeDisplayNumber } from "../details/episode";
import { useTranslation } from "react-i18next";
import { EmptyView } from "../fetch";
import { percent, useYoshiki } from "yoshiki/native";
import type { KyooImage } from "@kyoo/models";
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";
import NotStarted from "@material-symbols/svg-400/rounded/not_started.svg";
import { FlashList } from "@shopify/flash-list";
import { useRouter } from "expo-router";
import { type Atom, useAtomValue } from "jotai";
import { useTranslation } from "react-i18next";
import { type ImageStyle, View } from "react-native";
import { percent, useYoshiki } from "yoshiki/native";
import { EpisodeLine, displayRuntime, episodeDisplayNumber } from "../details/episode";
import { EmptyView } from "../fetch";
import { type State, downloadAtom } from "./state";
const DownloadedItem = ({
name,

10
front/packages/ui/src/downloads/state.tsx
View File

@ -21,7 +21,6 @@
import RNBackgroundDownloader, {
type DownloadTask,
} from "@kesha-antonov/react-native-background-downloader";
import { deleteAsync } from "expo-file-system";
import {
type Account,
type Episode,
@ -34,14 +33,15 @@ import {
queryFn,
toQueryKey,
} from "@kyoo/models";
import { Player } from "../player";
import { atom, useSetAtom, type PrimitiveAtom, useStore } from "jotai";
import { getCurrentAccount, storage } from "@kyoo/models/src/account-internal";
import { type QueryClient, useQueryClient } from "@tanstack/react-query";
import { deleteAsync } from "expo-file-system";
import type { Router } from "expo-router/build/types";
import { type PrimitiveAtom, atom, useSetAtom, useStore } from "jotai";
import { type ReactNode, useEffect } from "react";
import { ToastAndroid } from "react-native";
import { type QueryClient, useQueryClient } from "@tanstack/react-query";
import type { Router } from "expo-router/build/types";
import { z } from "zod";
import { Player } from "../player";
export type State = {
status: "DOWNLOADING" | "PAUSED" | "DONE" | "FAILED" | "STOPPED";

4
front/packages/ui/src/errors/connection.tsx
View File

@ -20,13 +20,13 @@
import { ConnectionErrorContext, useAccount } from "@kyoo/models";
import { Button, H1, Icon, Link, P, ts } from "@kyoo/primitives";
import { useRouter } from "solito/router";
import Register from "@material-symbols/svg-400/rounded/app_registration.svg";
import { useContext } from "react";
import { useTranslation } from "react-i18next";
import { View } from "react-native";
import { useRouter } from "solito/router";
import { useYoshiki } from "yoshiki/native";
import { DefaultLayout } from "../layout";
import Register from "@material-symbols/svg-400/rounded/app_registration.svg";
export const ConnectionError = () => {
const { css } = useYoshiki();

8
front/packages/ui/src/fetch-infinite.tsx
View File

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

6
front/packages/ui/src/fetch-infinite.web.tsx
View File

@ -20,20 +20,20 @@
import { type Page, type QueryIdentifier, useInfiniteFetch } from "@kyoo/models";
import { HR } from "@kyoo/primitives";
import type { ContentStyle } from "@shopify/flash-list";
import {
type ComponentProps,
type ComponentType,
Fragment,
isValidElement,
type ReactElement,
isValidElement,
useCallback,
useEffect,
useRef,
} from "react";
import { type Stylable, nativeStyleToCss, useYoshiki, ysMap } from "yoshiki";
import { EmptyView, type Layout, type WithLoading, addHeader } from "./fetch";
import { ErrorView } from "./errors";
import type { ContentStyle } from "@shopify/flash-list";
import { EmptyView, type Layout, type WithLoading, addHeader } from "./fetch";
const InfiniteScroll = <Props,>({
children,

4
front/packages/ui/src/home/genre.tsx
View File

@ -27,12 +27,12 @@ import {
} from "@kyoo/models";
import { H3, ts } from "@kyoo/primitives";
import { useRef } from "react";
import { useTranslation } from "react-i18next";
import { View } from "react-native";
import { useYoshiki } from "yoshiki/native";
import { itemMap } from "../browse";
import { ItemGrid } from "../browse/grid";
import { InfiniteFetchList } from "../fetch-infinite";
import { useTranslation } from "react-i18next";
import { itemMap } from "../browse";
export const Header = ({ title }: { title: string }) => {
const { css } = useYoshiki();

8
front/packages/ui/src/home/header.tsx
View File

@ -31,13 +31,13 @@ import {
tooltip,
ts,
} from "@kyoo/primitives";
import Info from "@material-symbols/svg-400/rounded/info.svg";
import PlayArrow from "@material-symbols/svg-400/rounded/play_arrow-fill.svg";
import { useTranslation } from "react-i18next";
import { View } from "react-native";
import { percent, rem, useYoshiki } from "yoshiki/native";
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";
import Info from "@material-symbols/svg-400/rounded/info.svg";
import type { WithLoading } from "../fetch";
export const Header = ({
isLoading,

18
front/packages/ui/src/home/index.tsx
View File

@ -19,17 +19,17 @@
*/
import { Genre, type QueryPage, toQueryKey } from "@kyoo/models";
import { Fetch } from "../fetch";
import { Header } from "./header";
import { DefaultLayout } from "../layout";
import { RefreshControl, ScrollView } from "react-native";
import { GenreGrid } from "./genre";
import { Recommended } from "./recommended";
import { VerticalRecommended } from "./vertical";
import { NewsList } from "./news";
import { WatchlistList } from "./watchlist";
import { useQueryClient } from "@tanstack/react-query";
import { useState } from "react";
import { RefreshControl, ScrollView } from "react-native";
import { Fetch } from "../fetch";
import { DefaultLayout } from "../layout";
import { GenreGrid } from "./genre";
import { Header } from "./header";
import { NewsList } from "./news";
import { Recommended } from "./recommended";
import { VerticalRecommended } from "./vertical";
import { WatchlistList } from "./watchlist";
export const HomePage: QueryPage<{}, Genre> = ({ randomItems }) => {
const queryClient = useQueryClient();

8
front/packages/ui/src/home/news.tsx
View File

@ -19,12 +19,12 @@
*/
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";
import { Header } from "./genre";
import { EpisodeBox, episodeDisplayNumber } from "../details/episode";
import { useYoshiki } from "yoshiki/native";
import { ItemGrid } from "../browse/grid";
import { EpisodeBox, episodeDisplayNumber } from "../details/episode";
import { InfiniteFetch } from "../fetch-infinite";
import { Header } from "./genre";
export const NewsList = () => {
const { t } = useTranslation();

10
front/packages/ui/src/home/recommended.tsx
View File

@ -31,25 +31,25 @@ import {
Chip,
H3,
IconFab,
imageBorderRadius,
Link,
P,
PosterBackground,
Skeleton,
SubP,
focusReset,
imageBorderRadius,
tooltip,
ts,
} from "@kyoo/primitives";
import PlayArrow from "@material-symbols/svg-400/rounded/play_arrow-fill.svg";
import { useState } from "react";
import { useTranslation } from "react-i18next";
import { ScrollView, View } from "react-native";
import { type Theme, calc, percent, px, rem, useYoshiki } from "yoshiki/native";
import { ItemGrid, ItemWatchStatus } from "../browse/grid";
import { ItemContext } from "../components/context-menus";
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";
import { useState } from "react";
import { ItemContext } from "../components/context-menus";
export const ItemDetails = ({
isLoading,

8
front/packages/ui/src/home/vertical.tsx
View File

@ -20,13 +20,13 @@
import { type LibraryItem, LibraryItemP, type QueryIdentifier } from "@kyoo/models";
import { H3 } from "@kyoo/primitives";
import { useTranslation } from "react-i18next";
import { View } from "react-native";
import { useYoshiki } from "yoshiki/native";
import { InfiniteFetch } from "../fetch-infinite";
import { ItemList } from "../browse/list";
import { useTranslation } from "react-i18next";
import { ItemGrid } from "../browse/grid";
import { itemMap } from "../browse";
import { ItemGrid } from "../browse/grid";
import { ItemList } from "../browse/list";
import { InfiniteFetch } from "../fetch-infinite";
export const VerticalRecommended = () => {
const { t } = useTranslation();

10
front/packages/ui/src/home/watchlist.tsx
View File

@ -25,14 +25,14 @@ import {
getDisplayDate,
useAccount,
} from "@kyoo/models";
import { Button, P, ts } from "@kyoo/primitives";
import { useTranslation } from "react-i18next";
import { View } from "react-native";
import { useYoshiki } from "yoshiki/native";
import { ItemGrid } from "../browse/grid";
import { InfiniteFetch } from "../fetch-infinite";
import { useTranslation } from "react-i18next";
import { Header } from "./genre";
import { EpisodeBox, episodeDisplayNumber } from "../details/episode";
import { View } from "react-native";
import { Button, P, ts } from "@kyoo/primitives";
import { InfiniteFetch } from "../fetch-infinite";
import { Header } from "./genre";
export const WatchlistList = () => {
const { t } = useTranslation();

6
front/packages/ui/src/layout.tsx
View File

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

4
front/packages/ui/src/login/form.tsx
View File

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

8
front/packages/ui/src/login/login.tsx
View File

@ -18,18 +18,18 @@
* along with Kyoo. If not, see <https://www.gnu.org/licenses/>.
*/
import { login, type QueryPage } from "@kyoo/models";
import { Button, P, Input, ts, H1, A } from "@kyoo/primitives";
import { type QueryPage, login } from "@kyoo/models";
import { A, Button, H1, Input, P, ts } from "@kyoo/primitives";
import { useEffect, useState } from "react";
import { useTranslation } from "react-i18next";
import { Trans } from "react-i18next";
import { Platform } from "react-native";
import { useRouter } from "solito/router";
import { percent, px, useYoshiki } from "yoshiki/native";
import { DefaultLayout } from "../layout";
import { FormPage } from "./form";
import { PasswordInput } from "./password-input";
import { OidcLogin } from "./oidc";
import { Platform } from "react-native";
import { PasswordInput } from "./password-input";
export const LoginPage: QueryPage<{ apiUrl?: string; error?: string }> = ({
apiUrl,

6
front/packages/ui/src/login/oidc.tsx
View File

@ -27,11 +27,11 @@ import {
useFetch,
} from "@kyoo/models";
import { Button, HR, Link, P, Skeleton, ts } from "@kyoo/primitives";
import { View, ImageBackground } from "react-native";
import { percent, rem, useYoshiki } from "yoshiki/native";
import { useTranslation } from "react-i18next";
import { useEffect, useRef } from "react";
import { useTranslation } from "react-i18next";
import { ImageBackground, View } from "react-native";
import { useRouter } from "solito/router";
import { percent, rem, useYoshiki } from "yoshiki/native";
import { ErrorView } from "../errors";
export const OidcLogin = ({ apiUrl }: { apiUrl?: string }) => {

4
front/packages/ui/src/login/password-input.tsx
View File

@ -19,10 +19,10 @@
*/
import { IconButton, Input } from "@kyoo/primitives";
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";
import { type ComponentProps, useState } from "react";
import { px, useYoshiki } from "yoshiki/native";
export const PasswordInput = (props: ComponentProps<typeof Input>) => {
const { css } = useYoshiki();

8
front/packages/ui/src/login/register.tsx
View File

@ -18,18 +18,18 @@
* along with Kyoo. If not, see <https://www.gnu.org/licenses/>.
*/
import { login, type QueryPage } from "@kyoo/models";
import { Button, P, Input, ts, H1, A } from "@kyoo/primitives";
import { type QueryPage, login } from "@kyoo/models";
import { A, Button, H1, Input, P, ts } from "@kyoo/primitives";
import { useEffect, useState } from "react";
import { useTranslation } from "react-i18next";
import { Trans } from "react-i18next";
import { Platform } from "react-native";
import { useRouter } from "solito/router";
import { percent, px, useYoshiki } from "yoshiki/native";
import { DefaultLayout } from "../layout";
import { FormPage } from "./form";
import { PasswordInput } from "./password-input";
import { OidcLogin } from "./oidc";
import { Platform } from "react-native";
import { PasswordInput } from "./password-input";
export const RegisterPage: QueryPage<{ apiUrl?: string }> = ({ apiUrl }) => {
const [email, setEmail] = useState("");

2
front/packages/ui/src/login/server-url.tsx
View File

@ -25,7 +25,7 @@ import {
ServerInfoP,
useFetch,
} from "@kyoo/models";
import { Button, P, Link, Input, ts, H1, HR } from "@kyoo/primitives";
import { Button, H1, HR, Input, Link, P, ts } from "@kyoo/primitives";
import { useState } from "react";
import { useTranslation } from "react-i18next";
import { ImageBackground, Platform, View } from "react-native";

34
front/packages/ui/src/navbar/index.tsx
View File

@ -20,31 +20,31 @@
import { logout, useAccount, useAccounts, useHasPermission } from "@kyoo/models";
import {
Input,
IconButton,
Header,
Avatar,
A,
tooltip,
ts,
Avatar,
HR,
Header,
IconButton,
Input,
Link,
Menu,
PressableFeedback,
HR,
Link,
tooltip,
ts,
} from "@kyoo/primitives";
import { Platform, type TextInput, View, type ViewProps } from "react-native";
import Admin from "@material-symbols/svg-400/rounded/admin_panel_settings.svg";
import Register from "@material-symbols/svg-400/rounded/app_registration.svg";
import Login from "@material-symbols/svg-400/rounded/login.svg";
import Logout from "@material-symbols/svg-400/rounded/logout.svg";
import Search from "@material-symbols/svg-400/rounded/search-fill.svg";
import Settings from "@material-symbols/svg-400/rounded/settings.svg";
import { forwardRef, useEffect, useRef, useState } from "react";
import { useTranslation } from "react-i18next";
import { Platform, type TextInput, View, type ViewProps } from "react-native";
import { useRouter } from "solito/router";
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";
import Logout from "@material-symbols/svg-400/rounded/logout.svg";
import Admin from "@material-symbols/svg-400/rounded/admin_panel_settings.svg";
import Settings from "@material-symbols/svg-400/rounded/settings.svg";
import { KyooLongLogo } from "./icon";
import { forwardRef, useEffect, useRef, useState } from "react";
import { AdminPage } from "../admin";
import { KyooLongLogo } from "./icon";
export const NavbarTitle = (props: Stylable & { onLayout?: ViewProps["onLayout"] }) => {
const { t } = useTranslation();

24
front/packages/ui/src/player/components/hover.tsx
View File

@ -18,32 +18,32 @@
* along with Kyoo. If not, see <https://www.gnu.org/licenses/>.
*/
import type { Audio, Chapter, KyooImage, Subtitle } from "@kyoo/models";
import {
alpha,
CircularProgress,
ContrastArea,
H1,
H2,
IconButton,
imageBorderRadius,
Poster,
PressableFeedback,
Skeleton,
Slider,
Tooltip,
alpha,
imageBorderRadius,
tooltip,
ts,
useIsTouch,
} from "@kyoo/primitives";
import type { Chapter, KyooImage, Subtitle, Audio } from "@kyoo/models";
import { useAtomValue, useSetAtom, useAtom } from "jotai";
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";
import ArrowBack from "@material-symbols/svg-400/rounded/arrow_back-fill.svg";
import { LeftButtons, TouchControls } from "./left-buttons";
import { RightButtons } from "./right-buttons";
import { useAtom, useAtomValue, useSetAtom } from "jotai";
import { atom } from "jotai";
import { type ReactNode, useCallback, useEffect, useRef, useState } from "react";
import { useTranslation } from "react-i18next";
import { type ImageStyle, Platform, Pressable, View, type ViewProps } from "react-native";
import { useRouter } from "solito/router";
import { percent, rem, useYoshiki } from "yoshiki/native";
import {
bufferedAtom,
durationAtom,
@ -52,8 +52,8 @@ import {
playAtom,
progressAtom,
} from "../state";
import { type ReactNode, useCallback, useEffect, useRef, useState } from "react";
import { atom } from "jotai";
import { LeftButtons, TouchControls } from "./left-buttons";
import { RightButtons } from "./right-buttons";
import { BottomScrubber, ScrubberTooltip } from "./scrubber";
const hoverReasonAtom = atom({

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

@ -19,19 +19,19 @@
*/
import { IconButton, Link, P, Slider, noTouch, tooltip, touchOnly, ts } from "@kyoo/primitives";
import Pause from "@material-symbols/svg-400/rounded/pause-fill.svg";
import PlayArrow from "@material-symbols/svg-400/rounded/play_arrow-fill.svg";
import SkipNext from "@material-symbols/svg-400/rounded/skip_next-fill.svg";
import SkipPrevious from "@material-symbols/svg-400/rounded/skip_previous-fill.svg";
import VolumeDown from "@material-symbols/svg-400/rounded/volume_down-fill.svg";
import VolumeMute from "@material-symbols/svg-400/rounded/volume_mute-fill.svg";
import VolumeOff from "@material-symbols/svg-400/rounded/volume_off-fill.svg";
import VolumeUp from "@material-symbols/svg-400/rounded/volume_up-fill.svg";
import { useAtom, useAtomValue } from "jotai";
import { useTranslation } from "react-i18next";
import { Platform, View } from "react-native";
import SkipPrevious from "@material-symbols/svg-400/rounded/skip_previous-fill.svg";
import SkipNext from "@material-symbols/svg-400/rounded/skip_next-fill.svg";
import PlayArrow from "@material-symbols/svg-400/rounded/play_arrow-fill.svg";
import Pause from "@material-symbols/svg-400/rounded/pause-fill.svg";
import VolumeOff from "@material-symbols/svg-400/rounded/volume_off-fill.svg";
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 { type Stylable, px, useYoshiki } from "yoshiki/native";
import { durationAtom, mutedAtom, playAtom, progressAtom, volumeAtom } from "../state";
import { HoverTouch, hoverAtom } from "./hover";
export const LeftButtons = ({

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

@ -19,15 +19,15 @@
*/
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";
import { useTranslation } from "react-i18next";
import { IconButton, Menu, tooltip, ts } from "@kyoo/primitives";
import ClosedCaption from "@material-symbols/svg-400/rounded/closed_caption-fill.svg";
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 SettingsIcon from "@material-symbols/svg-400/rounded/settings-fill.svg";
import { useAtom } from "jotai";
import { useTranslation } from "react-i18next";
import { Platform, View } from "react-native";
import { type Stylable, useYoshiki } from "yoshiki/native";
import { fullscreenAtom, subtitleAtom } from "../state";
import { AudiosMenu, QualitiesMenu } from "../video";

16
front/packages/ui/src/player/components/scrubber.tsx
View File

@ -18,16 +18,16 @@
* along with Kyoo. If not, see <https://www.gnu.org/licenses/>.
*/
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, type Theme, useForceRerender } from "yoshiki/native";
import { useMemo } from "react";
import { type Chapter, type QueryIdentifier, imageFn, useFetch } from "@kyoo/models";
import { P, Sprite, imageBorderRadius, ts } from "@kyoo/primitives";
import { useAtomValue } from "jotai";
import { durationAtom } from "../state";
import { toTimerString } from "./left-buttons";
import { seekProgressAtom } from "./hover";
import { useMemo } from "react";
import { Platform, View } from "react-native";
import { type Theme, percent, px, useForceRerender, useYoshiki } from "yoshiki/native";
import { ErrorView } from "../../errors";
import { durationAtom } from "../state";
import { seekProgressAtom } from "./hover";
import { toTimerString } from "./left-buttons";
type Thumb = {
from: number;

14
front/packages/ui/src/player/index.tsx
View File

@ -29,19 +29,19 @@ import {
useFetch,
} from "@kyoo/models";
import { Head } from "@kyoo/primitives";
import { useState, useEffect, type ComponentProps } from "react";
import { Platform, StyleSheet, View } from "react-native";
import { useTranslation } from "react-i18next";
import { useRouter } from "solito/router";
import { useSetAtom } from "jotai";
import { type ComponentProps, useEffect, useState } from "react";
import { useTranslation } from "react-i18next";
import { Platform, StyleSheet, View } from "react-native";
import { useRouter } from "solito/router";
import { useYoshiki } from "yoshiki/native";
import { Back, Hover, LoadingIndicator } from "./components/hover";
import { durationAtom, fullscreenAtom, Video } from "./state";
import { episodeDisplayNumber } from "../details/episode";
import { ErrorView } from "../errors";
import { Back, Hover, LoadingIndicator } from "./components/hover";
import { useVideoKeyboard } from "./keyboard";
import { MediaSessionManager } from "./media-session";
import { Video, durationAtom, fullscreenAtom } from "./state";
import { WatchStatusObserver } from "./watch-status-observer";
import { ErrorView } from "../errors";
type Item = (Movie & { type: "movie" }) | (Episode & { type: "episode" });

4
front/packages/ui/src/player/keyboard.tsx
View File

@ -20,8 +20,9 @@
import type { Subtitle } from "@kyoo/models";
import { atom, useSetAtom } from "jotai";
import { useRouter } from "solito/router";
import { useEffect } from "react";
import { Platform } from "react-native";
import { useRouter } from "solito/router";
import {
durationAtom,
fullscreenAtom,
@ -31,7 +32,6 @@ import {
subtitleAtom,
volumeAtom,
} from "./state";
import { Platform } from "react-native";
type Action =
| { type: "play" }

2
front/packages/ui/src/player/media-session.tsx
View File

@ -19,8 +19,8 @@
*/
import { useAtom, useAtomValue, useSetAtom } from "jotai";
import { useRouter } from "solito/router";
import { useEffect } from "react";
import { useRouter } from "solito/router";
import { reducerAtom } from "./keyboard";
import { durationAtom, playAtom, progressAtom } from "./state";

8
front/packages/ui/src/player/state.tsx
View File

@ -19,21 +19,21 @@
*/
import { type Audio, type Episode, type Subtitle, getLocalSetting, useAccount } from "@kyoo/models";
import { useSnackbar } from "@kyoo/primitives";
import { atom, useAtom, useAtomValue, useSetAtom } from "jotai";
import { useAtomCallback } from "jotai/utils";
import {
type ElementRef,
memo,
useCallback,
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";
import { Platform } from "react-native";
import NativeVideo, { type VideoProps } from "./video";
export const playAtom = atom(true);
export const loadAtom = atom(false);

12
front/packages/ui/src/player/video.tsx
View File

@ -35,8 +35,12 @@ export * from "react-native-video";
import { type Audio, type Subtitle, useToken } from "@kyoo/models";
import { type IconButton, Menu } from "@kyoo/primitives";
import { type ComponentProps, forwardRef, useEffect } from "react";
import "@kyoo/primitives/src/types.d.ts";
import { atom, useAtom, useAtomValue, useSetAtom } from "jotai";
import { type ComponentProps, forwardRef, useEffect } from "react";
import { useTranslation } from "react-i18next";
import { View } from "react-native";
import uuid from "react-native-uuid";
import NativeVideo, {
type VideoRef,
type OnLoadData,
@ -44,12 +48,8 @@ import NativeVideo, {
SelectedTrackType,
SelectedVideoTrackType,
} from "react-native-video";
import { useTranslation } from "react-i18next";
import { PlayMode, audioAtom, playModeAtom, subtitleAtom } from "./state";
import uuid from "react-native-uuid";
import { View } from "react-native";
import "@kyoo/primitives/src/types.d.ts";
import { useYoshiki } from "yoshiki/native";
import { PlayMode, audioAtom, playModeAtom, subtitleAtom } from "./state";
const MimeTypes: Map<string, string> = new Map([
["subrip", "application/x-subrip"],

20
front/packages/ui/src/player/video.web.tsx
View File

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

2
front/packages/ui/src/player/watch-status-observer.tsx
View File

@ -20,9 +20,9 @@
import { type MutationParam, WatchStatusV, useAccount } from "@kyoo/models";
import { useMutation, useQueryClient } from "@tanstack/react-query";
import { useEffect, useCallback } from "react";
import { useAtomValue } from "jotai";
import { useAtomCallback } from "jotai/utils";
import { useCallback, useEffect } from "react";
import { playAtom, progressAtom } from "./state";
export const WatchStatusObserver = ({

10
front/packages/ui/src/search/index.tsx
View File

@ -19,17 +19,17 @@
*/
import { type LibraryItem, LibraryItemP, type QueryIdentifier, type QueryPage } from "@kyoo/models";
import { usePageStyle } from "@kyoo/primitives";
import { useState } from "react";
import { useTranslation } from "react-i18next";
import { createParam } from "solito";
import { DefaultLayout } from "../layout";
import { InfiniteFetch } from "../fetch-infinite";
import { itemMap } from "../browse";
import { SearchSort, SortOrd, Layout } from "../browse/types";
import { BrowseSettings } from "../browse/header";
import { ItemGrid } from "../browse/grid";
import { BrowseSettings } from "../browse/header";
import { ItemList } from "../browse/list";
import { usePageStyle } from "@kyoo/primitives";
import { Layout, SearchSort, SortOrd } from "../browse/types";
import { InfiniteFetch } from "../fetch-infinite";
import { DefaultLayout } from "../layout";
const { useParam } = createParam<{ sortBy?: string }>();

4
front/packages/ui/src/settings/account.tsx
View File

@ -28,18 +28,18 @@ import {
} from "@kyoo/models";
import { Alert, Avatar, Button, H1, Icon, Input, P, Popup, ts, usePopup } from "@kyoo/primitives";
import { useMutation, useQueryClient } from "@tanstack/react-query";
import * as ImagePicker from "expo-image-picker";
import { type ComponentProps, useState } from "react";
import { useTranslation } from "react-i18next";
import { View } from "react-native";
import { rem, useYoshiki } from "yoshiki/native";
import * as ImagePicker from "expo-image-picker";
import { PasswordInput } from "../login/password-input";
import { Preference, SettingsContainer } from "./base";
import Username from "@material-symbols/svg-400/outlined/badge.svg";
import AccountCircle from "@material-symbols/svg-400/rounded/account_circle-fill.svg";
import Mail from "@material-symbols/svg-400/outlined/mail.svg";
import Password from "@material-symbols/svg-400/outlined/password.svg";
import AccountCircle from "@material-symbols/svg-400/rounded/account_circle-fill.svg";
import Delete from "@material-symbols/svg-400/rounded/delete.svg";
import Logout from "@material-symbols/svg-400/rounded/logout.svg";

2
front/packages/ui/src/settings/index.tsx
View File

@ -24,8 +24,8 @@ import { ScrollView } from "react-native";
import { DefaultLayout } from "../layout";
import { AccountSettings } from "./account";
import { About, GeneralSettings } from "./general";
import { PlaybackSettings } from "./playback";
import { OidcSettings } from "./oidc";
import { PlaybackSettings } from "./playback";
export const SettingsPage: QueryPage = () => {
const account = useAccount();

2
front/packages/ui/src/settings/oidc.tsx
View File

@ -34,8 +34,8 @@ import { ErrorView } from "../errors";
import { Preference, SettingsContainer } from "./base";
import Badge from "@material-symbols/svg-400/outlined/badge.svg";
import OpenProfile from "@material-symbols/svg-400/outlined/open_in_new.svg";
import Remove from "@material-symbols/svg-400/outlined/close.svg";
import OpenProfile from "@material-symbols/svg-400/outlined/open_in_new.svg";
import { useMutation, useQueryClient } from "@tanstack/react-query";
export const OidcSettings = () => {

8
front/packages/ui/src/settings/playback.tsx
View File

@ -18,16 +18,16 @@
* along with Kyoo. If not, see <https://www.gnu.org/licenses/>.
*/
import { Select } from "@kyoo/primitives";
import { useLocalSetting } from "@kyoo/models";
import { useTranslation } from "react-i18next";
import { Select } from "@kyoo/primitives";
import { useSetAtom } from "jotai";
import { Preference, SettingsContainer, useSetting } from "./base";
import { useTranslation } from "react-i18next";
import { PlayMode, playModeAtom } from "../player/state";
import { Preference, SettingsContainer, useSetting } from "./base";
import SubtitleLanguage from "@material-symbols/svg-400/rounded/closed_caption-fill.svg";
import PlayModeI from "@material-symbols/svg-400/rounded/display_settings-fill.svg";
import AudioLanguage from "@material-symbols/svg-400/rounded/music_note-fill.svg";
import SubtitleLanguage from "@material-symbols/svg-400/rounded/closed_caption-fill.svg";
// I gave up on finding a way to retrive this using the Intl api (probably does not exist)
// Simply copy pasted the list of languages from https://www.localeplanet.com/api/codelist.json