Add oidcs on the server-url page

This commit is contained in:
Zoe Roux 2024-03-06 22:49:56 +01:00
parent e8b4a26eda
commit 35e1cc7253
3 changed files with 25 additions and 6 deletions

View File

@ -99,7 +99,7 @@ export const Link = ({
target, target,
children, children,
...props ...props
}: { href?: string | null; target?: string; replace?: boolean } & PressableProps) => { }: { href?: string | UrlObject | null; target?: string; replace?: boolean } & PressableProps) => {
const linkProps = useLink({ const linkProps = useLink({
href: href ?? "#", href: href ?? "#",
replace, replace,
@ -114,7 +114,8 @@ export const Link = ({
onPress={(e?: any) => { onPress={(e?: any) => {
props?.onPress?.(e); props?.onPress?.(e);
if (e?.defaultPrevented) return; if (e?.defaultPrevented) return;
if (Platform.OS !== "web" && href?.includes("://")) Linking.openURL(href); if (Platform.OS !== "web" && typeof href === "string" && href?.includes("://"))
Linking.openURL(href);
else linkProps.onPress(e); else linkProps.onPress(e);
}} }}
> >

View File

@ -41,7 +41,6 @@ declare module "react-native" {
} }
interface ViewProps { interface ViewProps {
dataSet?: Record<string, string>; dataSet?: Record<string, string>;
href?: string;
hrefAttrs?: { hrefAttrs?: {
rel: "noreferrer"; rel: "noreferrer";
target?: "_blank"; target?: "_blank";

View File

@ -19,12 +19,12 @@
*/ */
import { QueryIdentifier, QueryPage, ServerInfo, ServerInfoP, useFetch } from "@kyoo/models"; import { QueryIdentifier, QueryPage, ServerInfo, ServerInfoP, useFetch } from "@kyoo/models";
import { Button, P, Input, ts, H1, HR } from "@kyoo/primitives"; import { Button, P, Link, Input, ts, H1, HR } from "@kyoo/primitives";
import { useState } from "react"; import { useState } from "react";
import { useTranslation } from "react-i18next"; import { useTranslation } from "react-i18next";
import { Platform, View } from "react-native"; import { ImageBackground, Platform, View } from "react-native";
import { useRouter } from "solito/router"; import { useRouter } from "solito/router";
import { Theme, useYoshiki } from "yoshiki/native"; import { Theme, percent, useYoshiki } from "yoshiki/native";
import { DefaultLayout } from "../layout"; import { DefaultLayout } from "../layout";
export const cleanApiUrl = (apiUrl: string) => { export const cleanApiUrl = (apiUrl: string) => {
@ -65,6 +65,25 @@ export const ServerUrlPage: QueryPage = () => {
)} )}
</View> </View>
<View {...css({ marginTop: ts(5) })}> <View {...css({ marginTop: ts(5) })}>
<View {...css({ flexDirection: "row", width: percent(100), alignItems: "center" })}>
{data &&
Object.values(data.oidc).map((x) => (
<Link
key={x.displayName}
href={{ pathname: x.link, query: { apiUrl } }}
{...css({ justifyContent: "center" })}
>
{x.logoUrl != null ? (
<ImageBackground
source={{ uri: x.logoUrl }}
{...css({ width: ts(3), height: ts(3), margin: ts(1) })}
/>
) : (
t("login.via", { provider: x.displayName })
)}
</Link>
))}
</View>
<HR /> <HR />
<View {...css({ flexDirection: "row", gap: ts(2) })}> <View {...css({ flexDirection: "row", gap: ts(2) })}>
<Button <Button