Fix oidc links baseUrl

This commit is contained in:
Zoe Roux 2024-03-07 00:36:47 +01:00
parent 35e1cc7253
commit f1707db5fb
4 changed files with 25 additions and 12 deletions

View File

@ -25,6 +25,7 @@ import {
QueryFunctionContext, QueryFunctionContext,
useInfiniteQuery, useInfiniteQuery,
useQuery, useQuery,
useQueryClient,
} from "@tanstack/react-query"; } from "@tanstack/react-query";
import { z } from "zod"; import { z } from "zod";
import { KyooErrors } from "./kyoo-errors"; import { KyooErrors } from "./kyoo-errors";
@ -32,6 +33,8 @@ import { Page, Paged } from "./page";
import { getToken } from "./login"; import { getToken } from "./login";
import { getCurrentApiUrl } from "."; import { getCurrentApiUrl } from ".";
export let lastUsedUrl: string = null!;
export const queryFn = async <Parser extends z.ZodTypeAny>( export const queryFn = async <Parser extends z.ZodTypeAny>(
context: { context: {
apiUrl?: string | null; apiUrl?: string | null;
@ -49,7 +52,9 @@ export const queryFn = async <Parser extends z.ZodTypeAny>(
type?: Parser, type?: Parser,
token?: string | null, token?: string | null,
): Promise<z.infer<Parser>> => { ): Promise<z.infer<Parser>> => {
const url = context.apiUrl === undefined ? getCurrentApiUrl() : context.apiUrl; const url = context.apiUrl ?? getCurrentApiUrl();
lastUsedUrl = url!;
if (token === undefined && context.authenticated !== false) token = await getToken(); if (token === undefined && context.authenticated !== false) token = await getToken();
const path = [url] const path = [url]
.concat( .concat(
@ -166,7 +171,6 @@ export type QueryIdentifier<T = unknown, Ret = T> = {
placeholderData?: T | (() => T); placeholderData?: T | (() => T);
enabled?: boolean; enabled?: boolean;
apiUrl?: string;
options?: Partial<Parameters<typeof queryFn>[0]>; options?: Partial<Parameters<typeof queryFn>[0]>;
}; };
@ -184,10 +188,10 @@ export type QueryPage<Props = {}, Items = unknown> = ComponentType<
export const toQueryKey = (query: { export const toQueryKey = (query: {
path: (string | undefined)[]; path: (string | undefined)[];
params?: { [query: string]: boolean | number | string | string[] | undefined }; params?: { [query: string]: boolean | number | string | string[] | undefined };
apiUrl?: string; options?: { apiUrl?: string | null };
}) => { }) => {
return [ return [
query.apiUrl, query.options?.apiUrl,
...query.path, ...query.path,
query.params query.params
? "?" + ? "?" +
@ -203,7 +207,14 @@ export const useFetch = <Data,>(query: QueryIdentifier<Data>) => {
return useQuery<Data, KyooErrors>({ return useQuery<Data, KyooErrors>({
queryKey: toQueryKey(query), queryKey: toQueryKey(query),
queryFn: (ctx) => queryFn: (ctx) =>
queryFn({ ...ctx, apiUrl: query.apiUrl ? null : undefined, ...query.options }, query.parser), queryFn(
{
...ctx,
queryKey: toQueryKey({ ...query, options: {} }),
...query.options,
},
query.parser,
),
placeholderData: query.placeholderData as any, placeholderData: query.placeholderData as any,
enabled: query.enabled, enabled: query.enabled,
}); });
@ -214,7 +225,7 @@ export const useInfiniteFetch = <Data, Ret>(query: QueryIdentifier<Data, Ret>) =
queryKey: toQueryKey(query), queryKey: toQueryKey(query),
queryFn: (ctx) => queryFn: (ctx) =>
queryFn( queryFn(
{ ...ctx, apiUrl: query.apiUrl ? null : undefined, ...query.options }, { ...ctx, queryKey: toQueryKey({ ...query, options: {} }), ...query.options },
Paged(query.parser), Paged(query.parser),
), ),
getNextPageParam: (page: Page<Data>) => page?.next || undefined, getNextPageParam: (page: Page<Data>) => page?.next || undefined,

View File

@ -20,10 +20,10 @@
import { Platform } from "react-native"; import { Platform } from "react-native";
import { ZodObject, ZodRawShape, z } from "zod"; import { ZodObject, ZodRawShape, z } from "zod";
import { getCurrentApiUrl } from ".."; import { lastUsedUrl } from "..";
export const imageFn = (url: string) => export const imageFn = (url: string) =>
Platform.OS === "web" ? `/api${url}` : `${getCurrentApiUrl()!}${url}`; Platform.OS === "web" ? `/api${url}` : `${lastUsedUrl}${url}`;
export const baseAppUrl = () => (Platform.OS === "web" ? window.location.origin : "kyoo://"); export const baseAppUrl = () => (Platform.OS === "web" ? window.location.origin : "kyoo://");

View File

@ -26,7 +26,7 @@ import {
oidcLogin, oidcLogin,
useFetch, useFetch,
} from "@kyoo/models"; } from "@kyoo/models";
import { Button, HR, P, Skeleton, ts } from "@kyoo/primitives"; import { Button, HR, Link, P, Skeleton, ts } from "@kyoo/primitives";
import { View, ImageBackground } from "react-native"; import { View, ImageBackground } from "react-native";
import { percent, rem, useYoshiki } from "yoshiki/native"; import { percent, rem, useYoshiki } from "yoshiki/native";
import { useTranslation } from "react-i18next"; import { useTranslation } from "react-i18next";
@ -48,7 +48,8 @@ export const OidcLogin = ({ apiUrl }: { apiUrl?: string }) => {
) : data ? ( ) : data ? (
Object.values(data.oidc).map((x) => ( Object.values(data.oidc).map((x) => (
<Button <Button
href={apiUrl ? `${x.link}&apiUrl=${apiUrl}` : x.link} as={Link}
href={{ pathname: x.link, query: { apiUrl } }}
key={x.displayName} key={x.displayName}
licon={ licon={
x.logoUrl != null && ( x.logoUrl != null && (
@ -104,7 +105,7 @@ export const OidcCallbackPage: QueryPage<{
hasRun.current = true; hasRun.current = true;
function onError(error: string) { function onError(error: string) {
router.replace({pathname: "/login", query: { error, apiUrl }}, undefined, { router.replace({ pathname: "/login", query: { error, apiUrl } }, undefined, {
experimental: { nativeBehavior: "stack-replace", isNestedNavigator: false }, experimental: { nativeBehavior: "stack-replace", isNestedNavigator: false },
}); });
} }

View File

@ -42,11 +42,12 @@ const query: QueryIdentifier<ServerInfo> = {
export const ServerUrlPage: QueryPage = () => { export const ServerUrlPage: QueryPage = () => {
const [_apiUrl, setApiUrl] = useState(""); const [_apiUrl, setApiUrl] = useState("");
const apiUrl = cleanApiUrl(_apiUrl); const apiUrl = cleanApiUrl(_apiUrl);
const { data, error } = useFetch({ ...query, apiUrl }); const { data, error } = useFetch({ ...query, options: { apiUrl } });
const router = useRouter(); const router = useRouter();
const { t } = useTranslation(); const { t } = useTranslation();
const { css } = useYoshiki(); const { css } = useYoshiki();
return ( return (
<View <View
{...css({ {...css({