mirror of
https://github.com/streamyfin/streamyfin.git
synced 2026-07-18 02:04:35 +01:00
Compare commits
6 Commits
fix/auth-s
...
fix/ui-hea
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
71b82a75ee | ||
|
|
e0cf1559bc | ||
|
|
610158efbd | ||
|
|
8b02cfcb65 | ||
|
|
3020bf5903 | ||
|
|
1f76119082 |
@@ -73,7 +73,6 @@ export default function IndexLayout() {
|
||||
headerLeft: () => (
|
||||
<Pressable
|
||||
onPress={() => _router.back()}
|
||||
className='pl-0.5'
|
||||
style={{ marginRight: Platform.OS === "android" ? 16 : 0 }}
|
||||
>
|
||||
<Feather name='chevron-left' size={28} color='white' />
|
||||
@@ -158,7 +157,6 @@ export default function IndexLayout() {
|
||||
headerLeft: () => (
|
||||
<Pressable
|
||||
onPress={() => _router.back()}
|
||||
className='pl-0.5'
|
||||
style={{ marginRight: Platform.OS === "android" ? 16 : 0 }}
|
||||
>
|
||||
<Feather name='chevron-left' size={28} color='white' />
|
||||
|
||||
@@ -1,4 +1,6 @@
|
||||
import { Ionicons } from "@expo/vector-icons";
|
||||
import { File, Paths } from "expo-file-system";
|
||||
import { requireOptionalNativeModule } from "expo-modules-core";
|
||||
import { useNavigation } from "expo-router";
|
||||
import type * as SharingType from "expo-sharing";
|
||||
import { useCallback, useEffect, useId, useMemo, useState } from "react";
|
||||
@@ -6,6 +8,7 @@ import { useTranslation } from "react-i18next";
|
||||
import { Platform, ScrollView, TouchableOpacity, View } from "react-native";
|
||||
import Collapsible from "react-native-collapsible";
|
||||
import { useSafeAreaInsets } from "react-native-safe-area-context";
|
||||
import { toast } from "sonner-native";
|
||||
import { Text } from "@/components/common/Text";
|
||||
import { FilterButton } from "@/components/filters/FilterButton";
|
||||
import { Loader } from "@/components/Loader";
|
||||
@@ -72,6 +75,25 @@ export default function Page() {
|
||||
}
|
||||
}, [filteredLogs, Sharing]);
|
||||
|
||||
const copyLog = useCallback(
|
||||
async (log: NonNullable<typeof logs>[number]) => {
|
||||
// Skip on builds that don't ship the expo-clipboard native module
|
||||
// (probe returns null instead of throwing); same guard as Quick Connect.
|
||||
if (!requireOptionalNativeModule("ExpoClipboard")) return;
|
||||
const Clipboard = await import("expo-clipboard");
|
||||
const text = [
|
||||
`[${log.level}] ${new Date(log.timestamp).toLocaleString()}`,
|
||||
log.message,
|
||||
log.data ? JSON.stringify(log.data, null, 2) : null,
|
||||
]
|
||||
.filter(Boolean)
|
||||
.join("\n");
|
||||
await Clipboard.setStringAsync(text);
|
||||
toast.success(t("home.settings.logs.copied"));
|
||||
},
|
||||
[logs, t],
|
||||
);
|
||||
|
||||
useEffect(() => {
|
||||
if (Platform.isTV) return;
|
||||
|
||||
@@ -88,8 +110,15 @@ export default function Page() {
|
||||
}, [share, loading]);
|
||||
|
||||
return (
|
||||
<View className='flex-1'>
|
||||
<View className='flex flex-row justify-end py-2 px-4 space-x-2'>
|
||||
<ScrollView
|
||||
// Like the sibling settings pages, let iOS auto-inset the content below the
|
||||
// transparent header (no manual header-height math). The filter bar is a
|
||||
// sticky header so it stays pinned just under the header while logs scroll.
|
||||
contentInsetAdjustmentBehavior='automatic'
|
||||
stickyHeaderIndices={[0]}
|
||||
contentContainerStyle={{ paddingBottom: insets.bottom }}
|
||||
>
|
||||
<View className='flex flex-row justify-end py-2 px-4 space-x-2 bg-black'>
|
||||
<FilterButton
|
||||
id={orderFilterId}
|
||||
queryKey='log'
|
||||
@@ -112,67 +141,77 @@ export default function Page() {
|
||||
multiple={true}
|
||||
/>
|
||||
</View>
|
||||
<ScrollView
|
||||
className='pb-4 px-4'
|
||||
contentContainerStyle={{ paddingBottom: insets.bottom }}
|
||||
>
|
||||
<View className='flex flex-col space-y-2'>
|
||||
{filteredLogs?.map((log, index) => (
|
||||
<View className='bg-neutral-900 rounded-xl p-3' key={index}>
|
||||
<TouchableOpacity
|
||||
disabled={!log.data}
|
||||
onPress={() =>
|
||||
setState((v) => ({
|
||||
...v,
|
||||
[log.timestamp]: !v[log.timestamp],
|
||||
}))
|
||||
}
|
||||
>
|
||||
<View className='flex flex-row justify-between'>
|
||||
<Text
|
||||
className={`mb-1
|
||||
<View className='flex flex-col space-y-2 px-4'>
|
||||
{filteredLogs?.map((log, index) => (
|
||||
<View className='bg-neutral-900 rounded-xl p-3' key={index}>
|
||||
<TouchableOpacity
|
||||
disabled={!log.data}
|
||||
onPress={() =>
|
||||
setState((v) => ({
|
||||
...v,
|
||||
[log.timestamp]: !v[log.timestamp],
|
||||
}))
|
||||
}
|
||||
>
|
||||
<View className='flex flex-row justify-between'>
|
||||
<Text
|
||||
className={`mb-1
|
||||
${log.level === "INFO" && "text-blue-500"}
|
||||
${log.level === "ERROR" && "text-red-500"}
|
||||
${log.level === "DEBUG" && "text-purple-500"}
|
||||
`}
|
||||
>
|
||||
{log.level}
|
||||
</Text>
|
||||
|
||||
<Text className='text-xs'>
|
||||
{new Date(log.timestamp).toLocaleString()}
|
||||
</Text>
|
||||
</View>
|
||||
<Text selectable className='text-xs'>
|
||||
{log.message}
|
||||
>
|
||||
{log.level}
|
||||
</Text>
|
||||
</TouchableOpacity>
|
||||
|
||||
{log.data && (
|
||||
<>
|
||||
{!state[log.timestamp] && (
|
||||
<Text className='text-xs mt-0.5'>
|
||||
{t("home.settings.logs.click_for_more_info")}
|
||||
</Text>
|
||||
)}
|
||||
<Collapsible collapsed={!state[log.timestamp]}>
|
||||
<View className='mt-2 flex flex-col space-y-2'>
|
||||
<ScrollView className='rounded-xl' style={codeBlockStyle}>
|
||||
<Text>{JSON.stringify(log.data, null, 2)}</Text>
|
||||
</ScrollView>
|
||||
</View>
|
||||
</Collapsible>
|
||||
</>
|
||||
<Text className='text-xs'>
|
||||
{new Date(log.timestamp).toLocaleString()}
|
||||
</Text>
|
||||
</View>
|
||||
<Text className='text-xs'>{log.message}</Text>
|
||||
{/* Keep the whole collapsed row tappable: the hint lives inside
|
||||
the toggle so tapping it expands too. */}
|
||||
{log.data && !state[log.timestamp] && (
|
||||
<Text className='text-xs mt-0.5'>
|
||||
{t("home.settings.logs.click_for_more_info")}
|
||||
</Text>
|
||||
)}
|
||||
</View>
|
||||
))}
|
||||
{filteredLogs?.length === 0 && (
|
||||
<Text className='opacity-50'>
|
||||
{t("home.settings.logs.no_logs_available")}
|
||||
</Text>
|
||||
)}
|
||||
</View>
|
||||
</ScrollView>
|
||||
</View>
|
||||
</TouchableOpacity>
|
||||
|
||||
{log.data && (
|
||||
<Collapsible collapsed={!state[log.timestamp]}>
|
||||
<View className='mt-2 flex flex-col space-y-2'>
|
||||
<ScrollView
|
||||
className='rounded-xl'
|
||||
style={codeBlockStyle}
|
||||
nestedScrollEnabled
|
||||
>
|
||||
{/* Only the raw payload is selectable (per request); the
|
||||
header/message stay tap-to-toggle. */}
|
||||
<Text selectable>{JSON.stringify(log.data, null, 2)}</Text>
|
||||
</ScrollView>
|
||||
{!Platform.isTV && (
|
||||
<TouchableOpacity
|
||||
onPress={() => copyLog(log)}
|
||||
className='flex flex-row items-center self-end px-2 py-1'
|
||||
>
|
||||
<Ionicons name='copy-outline' size={16} color='white' />
|
||||
<Text className='text-xs ml-1'>
|
||||
{t("home.settings.logs.copy")}
|
||||
</Text>
|
||||
</TouchableOpacity>
|
||||
)}
|
||||
</View>
|
||||
</Collapsible>
|
||||
)}
|
||||
</View>
|
||||
))}
|
||||
{filteredLogs?.length === 0 && (
|
||||
<Text className='opacity-50'>
|
||||
{t("home.settings.logs.no_logs_available")}
|
||||
</Text>
|
||||
)}
|
||||
</View>
|
||||
</ScrollView>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -11,7 +11,6 @@ import { Image } from "expo-image";
|
||||
import { DarkTheme, ThemeProvider } from "expo-router/react-navigation";
|
||||
import { Platform } from "react-native";
|
||||
import { GlobalModal } from "@/components/GlobalModal";
|
||||
import { PendingAccountSaveModal } from "@/components/PendingAccountSaveModal";
|
||||
import { enableTVMenuKeyInterception } from "@/hooks/useTVBackHandler";
|
||||
import i18n from "@/i18n";
|
||||
import { DownloadProvider } from "@/providers/DownloadProvider";
|
||||
@@ -552,7 +551,6 @@ function Layout() {
|
||||
closeButton
|
||||
/>
|
||||
{!Platform.isTV && <GlobalModal />}
|
||||
{!Platform.isTV && <PendingAccountSaveModal />}
|
||||
</ThemeProvider>
|
||||
</IntroSheetProvider>
|
||||
</BottomSheetModalProvider>
|
||||
|
||||
3
bun.lock
3
bun.lock
@@ -31,6 +31,7 @@
|
||||
"expo-brightness": "~56.0.5",
|
||||
"expo-build-properties": "~56.0.18",
|
||||
"expo-camera": "~56.0.8",
|
||||
"expo-clipboard": "~56.0.4",
|
||||
"expo-constants": "~56.0.18",
|
||||
"expo-crypto": "~56.0.4",
|
||||
"expo-dev-client": "~56.0.20",
|
||||
@@ -1001,6 +1002,8 @@
|
||||
|
||||
"expo-camera": ["expo-camera@56.0.8", "", { "dependencies": { "barcode-detector": "^3.0.0" }, "peerDependencies": { "expo": "*", "react": "*", "react-native": "*", "react-native-web": "*" }, "optionalPeers": ["react-native-web"] }, "sha512-UDOpUUMisFRmCv1XQV1MJCKGAH2CsIC1Rs6P9Bbc6JLVmbxEKAd5dK68y6cScOdWURxVfJ0PRcjYnSuc8ayyIQ=="],
|
||||
|
||||
"expo-clipboard": ["expo-clipboard@56.0.4", "", { "peerDependencies": { "expo": "*", "react": "*", "react-native": "*" } }, "sha512-qb4DYlkiowHYHaUYVT2FN9nk/nI1xShXOUYsI7J9dVpQCOHcGFjCBPX1VAvEW4Ye4/Aagd6IuhOVAq/+scBOiA=="],
|
||||
|
||||
"expo-constants": ["expo-constants@56.0.18", "", { "dependencies": { "@expo/env": "~2.3.0" }, "peerDependencies": { "expo": "*", "react-native": "*" } }, "sha512-8AMtbDGl/WVPnWlmbpGmvcdnNCy9E4PFnwdVwj600vljkMDPSxcAcjw8GVXEPk3PpZ+ngTqsrkltWyj0UKYAxw=="],
|
||||
|
||||
"expo-crypto": ["expo-crypto@56.0.4", "", { "peerDependencies": { "expo": "*" } }, "sha512-fRNEhoXRXgAWBpe3/hq5X+KXTit3OZqdiAGts1YvNEUHQb+H5591mpPac0Yw+sZg9pXcrjRnzo5AxvZaENpc7g=="],
|
||||
|
||||
@@ -1,52 +0,0 @@
|
||||
import { useAtom, useAtomValue } from "jotai";
|
||||
import type React from "react";
|
||||
import { useEffect } from "react";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import { Platform } from "react-native";
|
||||
import { toast } from "sonner-native";
|
||||
import { SaveAccountModal } from "@/components/SaveAccountModal";
|
||||
import {
|
||||
pendingAccountSaveAtom,
|
||||
useJellyfin,
|
||||
userAtom,
|
||||
} from "@/providers/JellyfinProvider";
|
||||
import { writeErrorLog } from "@/utils/log";
|
||||
|
||||
/**
|
||||
* Post-login save-account prompt. Login flows (password or Quick Connect)
|
||||
* only flag the intent via pendingAccountSaveAtom; the protection picker
|
||||
* shows here, AFTER the session is authorized — the login screen itself
|
||||
* unmounts as soon as the user is set, so it can't host the modal.
|
||||
*/
|
||||
export const PendingAccountSaveModal: React.FC = () => {
|
||||
const [pending, setPending] = useAtom(pendingAccountSaveAtom);
|
||||
const user = useAtomValue(userAtom);
|
||||
const { saveCurrentAccount } = useJellyfin();
|
||||
const { t } = useTranslation();
|
||||
|
||||
// A logout before answering drops the intent — it must not resurface on
|
||||
// the next (possibly different) login.
|
||||
useEffect(() => {
|
||||
if (!user && pending) setPending(null);
|
||||
}, [user, pending, setPending]);
|
||||
|
||||
if (Platform.isTV) return null;
|
||||
|
||||
return (
|
||||
<SaveAccountModal
|
||||
visible={!!pending && !!user}
|
||||
username={user?.Name ?? ""}
|
||||
onClose={() => setPending(null)}
|
||||
onSave={(securityType, pinCode) => {
|
||||
const serverName = pending?.serverName;
|
||||
setPending(null);
|
||||
saveCurrentAccount({ securityType, pinCode, serverName }).catch(
|
||||
(error) => {
|
||||
writeErrorLog(`Failed to save account: ${error?.message ?? error}`);
|
||||
toast.error(t("save_account.not_saved"));
|
||||
},
|
||||
);
|
||||
}}
|
||||
/>
|
||||
);
|
||||
};
|
||||
@@ -1,4 +1,4 @@
|
||||
import { Ionicons } from "@expo/vector-icons";
|
||||
import { Feather } from "@expo/vector-icons";
|
||||
import { BlurView, type BlurViewProps } from "expo-blur";
|
||||
import { Platform } from "react-native";
|
||||
import { Pressable, type PressableProps } from "react-native-gesture-handler";
|
||||
@@ -23,7 +23,7 @@ export const HeaderBackButton: React.FC<Props> = ({
|
||||
className='flex items-center justify-center w-9 h-9'
|
||||
{...pressableProps}
|
||||
>
|
||||
<Ionicons name='arrow-back' size={24} color='white' />
|
||||
<Feather name='chevron-left' size={28} color='white' />
|
||||
</Pressable>
|
||||
);
|
||||
}
|
||||
@@ -36,10 +36,10 @@ export const HeaderBackButton: React.FC<Props> = ({
|
||||
intensity={100}
|
||||
className='overflow-hidden rounded-full p-2'
|
||||
>
|
||||
<Ionicons
|
||||
<Feather
|
||||
className='drop-shadow-2xl'
|
||||
name='arrow-back'
|
||||
size={24}
|
||||
name='chevron-left'
|
||||
size={28}
|
||||
color='white'
|
||||
/>
|
||||
</BlurView>
|
||||
@@ -49,13 +49,18 @@ export const HeaderBackButton: React.FC<Props> = ({
|
||||
return (
|
||||
<Pressable
|
||||
onPress={() => router.back()}
|
||||
className=' rounded-full p-2'
|
||||
// Match the Settings page back button: chevron flush to the edge with a
|
||||
// 16px gap before the title (the old `p-2` pushed both arrow and title
|
||||
// too far right). drop-shadow keeps it readable over images. hitSlop
|
||||
// keeps the touch area at ~44dp now that the padding is gone.
|
||||
style={{ marginRight: 16 }}
|
||||
{...pressableProps}
|
||||
hitSlop={8}
|
||||
>
|
||||
<Ionicons
|
||||
<Feather
|
||||
className='drop-shadow-2xl'
|
||||
name='arrow-back'
|
||||
size={24}
|
||||
name='chevron-left'
|
||||
size={28}
|
||||
color='white'
|
||||
/>
|
||||
</Pressable>
|
||||
|
||||
@@ -39,11 +39,7 @@ import { useRefreshLibraryOnFocus } from "@/hooks/useRefreshLibraryOnFocus";
|
||||
import { useInvalidatePlaybackProgressCache } from "@/hooks/useRevalidatePlaybackProgressCache";
|
||||
import { useDownload } from "@/providers/DownloadProvider";
|
||||
import { useIntroSheet } from "@/providers/IntroSheetProvider";
|
||||
import {
|
||||
apiAtom,
|
||||
pendingAccountSaveAtom,
|
||||
userAtom,
|
||||
} from "@/providers/JellyfinProvider";
|
||||
import { apiAtom, userAtom } from "@/providers/JellyfinProvider";
|
||||
import { SortByOption, SortOrderOption } from "@/utils/atoms/filters";
|
||||
import { useSettings } from "@/utils/atoms/settings";
|
||||
import { eventBus } from "@/utils/eventBus";
|
||||
@@ -93,9 +89,6 @@ const HomeMobile = () => {
|
||||
const invalidateCache = useInvalidatePlaybackProgressCache();
|
||||
const [loadedSections, setLoadedSections] = useState<Set<string>>(new Set());
|
||||
const { showIntro } = useIntroSheet();
|
||||
// Gate the intro so it can't steal presentation from the post-login
|
||||
// save-account sheet (both are BottomSheetModals): wait until no save is pending.
|
||||
const pendingAccountSave = useAtomValue(pendingAccountSaveAtom);
|
||||
|
||||
// Fallback refresh for newly added content when returning to the home screen
|
||||
// (primary path is the LibraryChanged WebSocket event).
|
||||
@@ -104,9 +97,7 @@ const HomeMobile = () => {
|
||||
// Show intro modal on first launch
|
||||
useEffect(() => {
|
||||
const hasShownIntro = storage.getBoolean("hasShownIntro");
|
||||
// Defer while the save-account sheet is up; this effect re-runs and schedules
|
||||
// the intro once the sheet is dismissed (pendingAccountSaveAtom cleared).
|
||||
if (!hasShownIntro && !pendingAccountSave) {
|
||||
if (!hasShownIntro) {
|
||||
const timer = setTimeout(() => {
|
||||
showIntro();
|
||||
}, 1000);
|
||||
@@ -115,7 +106,7 @@ const HomeMobile = () => {
|
||||
clearTimeout(timer);
|
||||
};
|
||||
}
|
||||
}, [showIntro, pendingAccountSave]);
|
||||
}, [showIntro]);
|
||||
|
||||
useEffect(() => {
|
||||
if (isConnected && !prevIsConnected.current) {
|
||||
|
||||
@@ -3,7 +3,7 @@ import type { PublicSystemInfo } from "@jellyfin/sdk/lib/generated-client";
|
||||
import { Image } from "expo-image";
|
||||
import { useLocalSearchParams, useNavigation } from "expo-router";
|
||||
import { t } from "i18next";
|
||||
import { useAtomValue, useSetAtom } from "jotai";
|
||||
import { useAtomValue } from "jotai";
|
||||
import { useCallback, useEffect, useState } from "react";
|
||||
import {
|
||||
Alert,
|
||||
@@ -21,14 +21,13 @@ import { Input } from "@/components/common/Input";
|
||||
import { Text } from "@/components/common/Text";
|
||||
import JellyfinServerDiscovery from "@/components/JellyfinServerDiscovery";
|
||||
import { PreviousServersList } from "@/components/PreviousServersList";
|
||||
import { SaveAccountModal } from "@/components/SaveAccountModal";
|
||||
import { Colors } from "@/constants/Colors";
|
||||
import {
|
||||
apiAtom,
|
||||
pendingAccountSaveAtom,
|
||||
useJellyfin,
|
||||
userAtom,
|
||||
} from "@/providers/JellyfinProvider";
|
||||
import type { SavedServer } from "@/utils/secureCredentials";
|
||||
import { apiAtom, useJellyfin } from "@/providers/JellyfinProvider";
|
||||
import type {
|
||||
AccountSecurityType,
|
||||
SavedServer,
|
||||
} from "@/utils/secureCredentials";
|
||||
|
||||
const CredentialsSchema = z.object({
|
||||
username: z.string().min(1, t("login.username_required")),
|
||||
@@ -36,7 +35,6 @@ const CredentialsSchema = z.object({
|
||||
|
||||
export const Login: React.FC = () => {
|
||||
const api = useAtomValue(apiAtom);
|
||||
const user = useAtomValue(userAtom);
|
||||
const navigation = useNavigation();
|
||||
const params = useLocalSearchParams();
|
||||
const {
|
||||
@@ -47,7 +45,6 @@ export const Login: React.FC = () => {
|
||||
loginWithSavedCredential,
|
||||
loginWithPassword,
|
||||
} = useJellyfin();
|
||||
const setPendingAccountSave = useSetAtom(pendingAccountSaveAtom);
|
||||
|
||||
const {
|
||||
apiUrl: _apiUrl,
|
||||
@@ -67,24 +64,13 @@ export const Login: React.FC = () => {
|
||||
password: _password || "",
|
||||
});
|
||||
|
||||
// Save account state — only the intent lives here; the protection picker is
|
||||
// the global PendingAccountSaveModal, shown after the login succeeds.
|
||||
// Save account state
|
||||
const [saveAccount, setSaveAccount] = useState(false);
|
||||
|
||||
// Tracks an in-flight Quick Connect attempt (code issued, provider polling).
|
||||
const [quickConnectActive, setQuickConnectActive] = useState(false);
|
||||
|
||||
// A Quick Connect login with "save account" on flags the post-login save:
|
||||
// the protection picker shows globally once the session exists (this screen
|
||||
// unmounts on login, so it can't host the modal).
|
||||
useEffect(() => {
|
||||
if (user) {
|
||||
if (quickConnectActive && saveAccount) {
|
||||
setPendingAccountSave({ serverName });
|
||||
}
|
||||
setQuickConnectActive(false);
|
||||
}
|
||||
}, [user]);
|
||||
const [showSaveModal, setShowSaveModal] = useState(false);
|
||||
const [pendingLogin, setPendingLogin] = useState<{
|
||||
username: string;
|
||||
password: string;
|
||||
} | null>(null);
|
||||
|
||||
// Handle URL params for server connection
|
||||
useEffect(() => {
|
||||
@@ -131,22 +117,29 @@ export const Login: React.FC = () => {
|
||||
const result = CredentialsSchema.safeParse(credentials);
|
||||
if (!result.success) return;
|
||||
|
||||
const ok = await performLogin(credentials.username, credentials.password);
|
||||
// The protection picker shows AFTER a successful login (global modal) —
|
||||
// never for a failed one.
|
||||
if (ok && saveAccount) {
|
||||
setPendingAccountSave({ serverName });
|
||||
if (saveAccount) {
|
||||
setPendingLogin({
|
||||
username: credentials.username,
|
||||
password: credentials.password,
|
||||
});
|
||||
setShowSaveModal(true);
|
||||
} else {
|
||||
await performLogin(credentials.username, credentials.password);
|
||||
}
|
||||
};
|
||||
|
||||
const performLogin = async (
|
||||
username: string,
|
||||
password: string,
|
||||
): Promise<boolean> => {
|
||||
options?: {
|
||||
saveAccount?: boolean;
|
||||
securityType?: AccountSecurityType;
|
||||
pinCode?: string;
|
||||
},
|
||||
) => {
|
||||
setLoading(true);
|
||||
try {
|
||||
await login(username, password, serverName);
|
||||
return true;
|
||||
await login(username, password, serverName, options);
|
||||
} catch (error) {
|
||||
if (error instanceof Error) {
|
||||
Alert.alert(t("login.connection_failed"), error.message);
|
||||
@@ -156,9 +149,23 @@ export const Login: React.FC = () => {
|
||||
t("login.an_unexpected_error_occurred"),
|
||||
);
|
||||
}
|
||||
return false;
|
||||
} finally {
|
||||
setLoading(false);
|
||||
setPendingLogin(null);
|
||||
}
|
||||
};
|
||||
|
||||
const handleSaveAccountConfirm = async (
|
||||
securityType: AccountSecurityType,
|
||||
pinCode?: string,
|
||||
) => {
|
||||
setShowSaveModal(false);
|
||||
if (pendingLogin) {
|
||||
await performLogin(pendingLogin.username, pendingLogin.password, {
|
||||
saveAccount: true,
|
||||
securityType,
|
||||
pinCode,
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
@@ -252,7 +259,6 @@ export const Login: React.FC = () => {
|
||||
try {
|
||||
const code = await initiateQuickConnect();
|
||||
if (code) {
|
||||
setQuickConnectActive(true);
|
||||
Alert.alert(
|
||||
t("login.quick_connect"),
|
||||
t("login.enter_code_to_login", { code: code }),
|
||||
@@ -437,6 +443,16 @@ export const Login: React.FC = () => {
|
||||
</View>
|
||||
)}
|
||||
</KeyboardAvoidingView>
|
||||
|
||||
<SaveAccountModal
|
||||
visible={showSaveModal}
|
||||
onClose={() => {
|
||||
setShowSaveModal(false);
|
||||
setPendingLogin(null);
|
||||
}}
|
||||
onSave={handleSaveAccountConfirm}
|
||||
username={pendingLogin?.username || credentials.username}
|
||||
/>
|
||||
</SafeAreaView>
|
||||
);
|
||||
};
|
||||
|
||||
@@ -54,6 +54,7 @@
|
||||
"expo-brightness": "~56.0.5",
|
||||
"expo-build-properties": "~56.0.18",
|
||||
"expo-camera": "~56.0.8",
|
||||
"expo-clipboard": "~56.0.4",
|
||||
"expo-constants": "~56.0.18",
|
||||
"expo-crypto": "~56.0.4",
|
||||
"expo-dev-client": "~56.0.20",
|
||||
|
||||
@@ -15,14 +15,12 @@ import {
|
||||
useContext,
|
||||
useEffect,
|
||||
useMemo,
|
||||
useRef,
|
||||
useState,
|
||||
} from "react";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import { AppState, Platform } from "react-native";
|
||||
import { getDeviceNameSync } from "react-native-device-info";
|
||||
import uuid from "react-native-uuid";
|
||||
import { toast } from "sonner-native";
|
||||
import useRouter from "@/hooks/useAppRouter";
|
||||
import { useInterval } from "@/hooks/useInterval";
|
||||
import { JellyseerrApi, useJellyseerr } from "@/hooks/useJellyseerr";
|
||||
@@ -93,12 +91,6 @@ export const apiAtom = atom<Api | null>(initialApi);
|
||||
export const userAtom = atom<UserDto | null>(initialUser);
|
||||
export const wsAtom = atom<WebSocket | null>(null);
|
||||
export const cacheVersionAtom = atom<number>(0);
|
||||
// Set by a login flow that wants the account saved: the protection picker
|
||||
// shows AFTER the session is authorized (the login screen unmounts on
|
||||
// success, so the modal lives at the root — see PendingAccountSaveModal).
|
||||
export const pendingAccountSaveAtom = atom<{ serverName?: string } | null>(
|
||||
null,
|
||||
);
|
||||
|
||||
interface LoginOptions {
|
||||
saveAccount?: boolean;
|
||||
@@ -116,11 +108,6 @@ interface JellyfinContextValue {
|
||||
serverName?: string,
|
||||
options?: LoginOptions,
|
||||
) => Promise<void>;
|
||||
saveCurrentAccount: (options?: {
|
||||
securityType?: AccountSecurityType;
|
||||
pinCode?: string;
|
||||
serverName?: string;
|
||||
}) => Promise<void>;
|
||||
logout: () => Promise<void>;
|
||||
initiateQuickConnect: () => Promise<string | undefined>;
|
||||
stopQuickConnectPolling: () => void;
|
||||
@@ -178,69 +165,6 @@ export const JellyfinProvider: React.FC<{ children: ReactNode }> = ({
|
||||
const { clearAllJellyseerData, setJellyseerrUser } = useJellyseerr();
|
||||
const queryClient = useQueryClient();
|
||||
|
||||
// --- Session-expiry handling ----------------------------------------------
|
||||
// When the server revokes the token (e.g. the device/session is deleted), a
|
||||
// 401 can surface from any authenticated request. Without central handling
|
||||
// the dead token stays in storage, so every reload re-fires authed calls →
|
||||
// 401 spam + uncaught rejections, and the app lingers in a half-authenticated
|
||||
// state. A single response interceptor on the authenticated api clears the
|
||||
// session on the first 401 so the app drops cleanly to the login screen.
|
||||
const sessionExpiredRef = useRef(false);
|
||||
|
||||
// Shared teardown for manual logout AND forced session expiry — keeping it
|
||||
// in one place prevents the two paths from drifting (a 401 expiry must wipe
|
||||
// plugin settings / Jellyseerr state too, or the next login on the same
|
||||
// device inherits the previous user's data).
|
||||
// Saved credentials are kept so the user can quick-login again.
|
||||
const clearSessionState = useCallback(async () => {
|
||||
// All synchronous teardown first: if the async Jellyseerr cleanup below
|
||||
// fails or resolves late (user may already be re-authenticating), the
|
||||
// session/cache state is already gone.
|
||||
storage.remove("token");
|
||||
storage.remove("user");
|
||||
storage.remove("REACT_QUERY_OFFLINE_CACHE");
|
||||
clearTVDiscoverySafely();
|
||||
setUser(null);
|
||||
setApi(null);
|
||||
setPluginSettings(undefined);
|
||||
queryClient.clear();
|
||||
|
||||
try {
|
||||
await clearAllJellyseerData();
|
||||
} catch (e) {
|
||||
writeErrorLog(
|
||||
`Failed to clear Jellyseerr data: ${e instanceof Error ? e.message : e}`,
|
||||
);
|
||||
}
|
||||
}, [setUser, setApi, setPluginSettings, clearAllJellyseerData, queryClient]);
|
||||
|
||||
const handleSessionExpired = useCallback(() => {
|
||||
if (sessionExpiredRef.current) return; // run once per session
|
||||
sessionExpiredRef.current = true;
|
||||
clearSessionState().catch((e) =>
|
||||
writeErrorLog(`Session-expiry cleanup failed: ${e?.message ?? e}`),
|
||||
);
|
||||
}, [clearSessionState]);
|
||||
|
||||
useEffect(() => {
|
||||
// Only guard an authenticated session. A pre-auth api (login screen) keeps
|
||||
// its own handling — a wrong-password 401 is not a session expiry.
|
||||
if (!api?.accessToken) return;
|
||||
sessionExpiredRef.current = false; // re-arm for this fresh session
|
||||
const interceptorId = api.axiosInstance.interceptors.response.use(
|
||||
(response) => response,
|
||||
(error) => {
|
||||
if (error?.response?.status === 401) {
|
||||
handleSessionExpired();
|
||||
}
|
||||
return Promise.reject(error);
|
||||
},
|
||||
);
|
||||
return () => {
|
||||
api.axiosInstance.interceptors.response.eject(interceptorId);
|
||||
};
|
||||
}, [api, handleSessionExpired]);
|
||||
|
||||
const headers = useMemo(() => {
|
||||
if (!deviceId) return {};
|
||||
return {
|
||||
@@ -383,40 +307,6 @@ export const JellyfinProvider: React.FC<{ children: ReactNode }> = ({
|
||||
},
|
||||
});
|
||||
|
||||
// Persist the CURRENT session to secure storage — used by the post-login
|
||||
// save-account modal (the protection picker shows AFTER a successful
|
||||
// login, for both the password and Quick Connect flows).
|
||||
const saveCurrentAccount = useCallback(
|
||||
async (options?: {
|
||||
securityType?: AccountSecurityType;
|
||||
pinCode?: string;
|
||||
serverName?: string;
|
||||
}) => {
|
||||
const token = storage.getString("token");
|
||||
if (!api?.basePath || !user?.Id || !user.Name || !token) return;
|
||||
const securityType = options?.securityType || "none";
|
||||
let pinHash: string | undefined;
|
||||
if (securityType === "pin") {
|
||||
// Never persist a "pin" credential without its hash — it would be
|
||||
// impossible to unlock.
|
||||
if (!options?.pinCode) throw new Error("PIN code is required");
|
||||
pinHash = await hashPIN(options.pinCode);
|
||||
}
|
||||
await saveAccountCredential({
|
||||
serverUrl: api.basePath,
|
||||
serverName: options?.serverName || "",
|
||||
token,
|
||||
userId: user.Id,
|
||||
username: user.Name,
|
||||
savedAt: Date.now(),
|
||||
securityType,
|
||||
pinHash,
|
||||
primaryImageTag: user.PrimaryImageTag ?? undefined,
|
||||
});
|
||||
},
|
||||
[api?.basePath, user],
|
||||
);
|
||||
|
||||
const loginMutation = useMutation({
|
||||
mutationFn: async ({
|
||||
username,
|
||||
@@ -448,25 +338,18 @@ export const JellyfinProvider: React.FC<{ children: ReactNode }> = ({
|
||||
if (securityType === "pin" && options.pinCode) {
|
||||
pinHash = await hashPIN(options.pinCode);
|
||||
}
|
||||
if (securityType === "pin" && !pinHash) {
|
||||
// Never persist a "pin" credential without its hash — it would be
|
||||
// impossible to unlock. Skip the save rather than failing a login
|
||||
// that already succeeded, and tell the user it didn't happen.
|
||||
writeErrorLog("Account save skipped: PIN required but missing");
|
||||
toast.error(t("save_account.not_saved"));
|
||||
} else {
|
||||
await saveAccountCredential({
|
||||
serverUrl: api.basePath,
|
||||
serverName: serverName || "",
|
||||
token: auth.data.AccessToken,
|
||||
userId: auth.data.User.Id || "",
|
||||
username,
|
||||
savedAt: Date.now(),
|
||||
securityType,
|
||||
pinHash,
|
||||
primaryImageTag: auth.data.User.PrimaryImageTag ?? undefined,
|
||||
});
|
||||
}
|
||||
|
||||
await saveAccountCredential({
|
||||
serverUrl: api.basePath,
|
||||
serverName: serverName || "",
|
||||
token: auth.data.AccessToken,
|
||||
userId: auth.data.User.Id || "",
|
||||
username,
|
||||
savedAt: Date.now(),
|
||||
securityType,
|
||||
pinHash,
|
||||
primaryImageTag: auth.data.User.PrimaryImageTag ?? undefined,
|
||||
});
|
||||
}
|
||||
|
||||
const recentPluginSettings = await refreshStreamyfinPluginSettings();
|
||||
@@ -526,7 +409,19 @@ export const JellyfinProvider: React.FC<{ children: ReactNode }> = ({
|
||||
writeErrorLog("Failed to delete expo push token for device"),
|
||||
);
|
||||
|
||||
await clearSessionState();
|
||||
storage.remove("token");
|
||||
storage.remove("user");
|
||||
clearTVDiscoverySafely();
|
||||
setUser(null);
|
||||
setApi(null);
|
||||
setPluginSettings(undefined);
|
||||
await clearAllJellyseerData();
|
||||
|
||||
// Clear React Query cache to prevent data from previous account lingering
|
||||
queryClient.clear();
|
||||
storage.remove("REACT_QUERY_OFFLINE_CACHE");
|
||||
|
||||
// Note: We keep saved credentials for quick switching back
|
||||
},
|
||||
onError: (error) => {
|
||||
console.error("Logout failed:", error);
|
||||
@@ -614,9 +509,7 @@ export const JellyfinProvider: React.FC<{ children: ReactNode }> = ({
|
||||
}
|
||||
},
|
||||
onError: (error) => {
|
||||
// Expected, handled case (e.g. revoked token → "Session Expired", or
|
||||
// server unreachable): the UI surfaces the message, so warn, don't error.
|
||||
console.warn("Quick login failed:", error);
|
||||
console.error("Quick login failed:", error);
|
||||
},
|
||||
});
|
||||
|
||||
@@ -727,66 +620,54 @@ export const JellyfinProvider: React.FC<{ children: ReactNode }> = ({
|
||||
setUser(storedUser);
|
||||
}
|
||||
|
||||
// Validate the token and refresh user data in the background. Do NOT
|
||||
// await this: the Jellyfin SDK axios instance has no timeout, so when
|
||||
// offline this call hangs for the full OS TCP timeout (75-120s) and
|
||||
// blocks splash dismissal. The cached storedUser (set above) is enough
|
||||
// to render; on success we just refresh it.
|
||||
getUserApi(apiInstance)
|
||||
.getCurrentUser()
|
||||
.then(async (response) => {
|
||||
// The response can resolve long after startup (no axios timeout).
|
||||
// If the session changed meanwhile (logout, account switch), drop
|
||||
// it instead of repopulating a stale user / re-saving credentials.
|
||||
if (getTokenFromStorage() !== token) return;
|
||||
setUser(response.data);
|
||||
// Dismiss splash screen with cached data immediately,
|
||||
// fetch fresh user data in the background
|
||||
setInitialLoaded(true);
|
||||
|
||||
// Migrate current session to secure storage if not already saved
|
||||
if (storedUser?.Id && storedUser?.Name) {
|
||||
const existingCredential = await getAccountCredential(
|
||||
serverUrl,
|
||||
storedUser.Id,
|
||||
);
|
||||
if (!existingCredential) {
|
||||
await saveAccountCredential({
|
||||
serverUrl,
|
||||
serverName: "",
|
||||
token,
|
||||
userId: storedUser.Id,
|
||||
username: storedUser.Name,
|
||||
savedAt: Date.now(),
|
||||
securityType: "none",
|
||||
primaryImageTag: response.data.PrimaryImageTag ?? undefined,
|
||||
});
|
||||
} else if (
|
||||
response.data.PrimaryImageTag !==
|
||||
existingCredential.primaryImageTag
|
||||
) {
|
||||
// Update image tag if it has changed
|
||||
addAccountToServer(serverUrl, existingCredential.serverName, {
|
||||
userId: existingCredential.userId,
|
||||
username: existingCredential.username,
|
||||
securityType: existingCredential.securityType,
|
||||
savedAt: existingCredential.savedAt,
|
||||
primaryImageTag: response.data.PrimaryImageTag ?? undefined,
|
||||
});
|
||||
}
|
||||
}
|
||||
})
|
||||
.catch((e) => {
|
||||
// Expected, handled case (offline, or a token the server rejects —
|
||||
// the UI prompts re-login): warn, don't error. Log only
|
||||
// status/message — never the raw error (axios errors carry the
|
||||
// request config incl. the Authorization header / token).
|
||||
console.warn(
|
||||
"Background user validation failed:",
|
||||
e?.response?.status ?? e?.message ?? "unknown error",
|
||||
try {
|
||||
const response = await getUserApi(apiInstance).getCurrentUser();
|
||||
setUser(response.data);
|
||||
|
||||
// Migrate current session to secure storage if not already saved
|
||||
if (storedUser?.Id && storedUser?.Name) {
|
||||
const existingCredential = await getAccountCredential(
|
||||
serverUrl,
|
||||
storedUser.Id,
|
||||
);
|
||||
});
|
||||
if (!existingCredential) {
|
||||
await saveAccountCredential({
|
||||
serverUrl,
|
||||
serverName: "",
|
||||
token,
|
||||
userId: storedUser.Id,
|
||||
username: storedUser.Name,
|
||||
savedAt: Date.now(),
|
||||
securityType: "none",
|
||||
primaryImageTag: response.data.PrimaryImageTag ?? undefined,
|
||||
});
|
||||
} else if (
|
||||
response.data.PrimaryImageTag !==
|
||||
existingCredential.primaryImageTag
|
||||
) {
|
||||
// Update image tag if it has changed
|
||||
addAccountToServer(serverUrl, existingCredential.serverName, {
|
||||
userId: existingCredential.userId,
|
||||
username: existingCredential.username,
|
||||
securityType: existingCredential.securityType,
|
||||
savedAt: existingCredential.savedAt,
|
||||
primaryImageTag: response.data.PrimaryImageTag ?? undefined,
|
||||
});
|
||||
}
|
||||
}
|
||||
} catch (e) {
|
||||
// Background fetch failed — app already rendered with cached data
|
||||
console.warn("Background user fetch failed, using cached data:", e);
|
||||
}
|
||||
} else {
|
||||
setInitialLoaded(true);
|
||||
}
|
||||
} catch (e) {
|
||||
console.error(e);
|
||||
} finally {
|
||||
setInitialLoaded(true);
|
||||
}
|
||||
};
|
||||
@@ -800,7 +681,6 @@ export const JellyfinProvider: React.FC<{ children: ReactNode }> = ({
|
||||
removeServer: () => removeServerMutation.mutateAsync(),
|
||||
login: (username, password, serverName, options) =>
|
||||
loginMutation.mutateAsync({ username, password, serverName, options }),
|
||||
saveCurrentAccount,
|
||||
logout: () => logoutMutation.mutateAsync(),
|
||||
initiateQuickConnect,
|
||||
stopQuickConnectPolling,
|
||||
|
||||
@@ -56,7 +56,6 @@
|
||||
"save_account": {
|
||||
"title": "Save account",
|
||||
"save_for_later": "Save this account",
|
||||
"not_saved": "Account was not saved",
|
||||
"security_option": "Security option",
|
||||
"no_protection": "No protection",
|
||||
"no_protection_desc": "Quick login without authentication",
|
||||
@@ -416,7 +415,9 @@
|
||||
"click_for_more_info": "Click for more info",
|
||||
"level": "Level",
|
||||
"no_logs_available": "No logs available",
|
||||
"delete_all_logs": "Delete all logs"
|
||||
"delete_all_logs": "Delete all logs",
|
||||
"copy": "Copy",
|
||||
"copied": "Copied to clipboard"
|
||||
},
|
||||
"languages": {
|
||||
"title": "Languages",
|
||||
|
||||
Reference in New Issue
Block a user