diff --git a/back/src/Kyoo.Authentication/Models/DTO/ServerInfo.cs b/back/src/Kyoo.Authentication/Models/DTO/ServerInfo.cs
index 866e3b18..6e9a6b29 100644
--- a/back/src/Kyoo.Authentication/Models/DTO/ServerInfo.cs
+++ b/back/src/Kyoo.Authentication/Models/DTO/ServerInfo.cs
@@ -22,11 +22,21 @@ namespace Kyoo.Authentication.Models;
public class ServerInfo
{
+ ///
+ /// The list of oidc providers configured for this instance of kyoo.
+ ///
public Dictionary Oidc { get; set; }
}
public class OidcInfo
{
+ ///
+ /// The name of this oidc service. Human readable.
+ ///
public string DisplayName { get; set; }
+
+ ///
+ /// A url returing a square logo for this provider.
+ ///
public string? LogoUrl { get; set; }
}
diff --git a/front/packages/models/src/resources/index.ts b/front/packages/models/src/resources/index.ts
index 3d934384..2070550d 100644
--- a/front/packages/models/src/resources/index.ts
+++ b/front/packages/models/src/resources/index.ts
@@ -32,3 +32,4 @@ export * from "./watch-info";
export * from "./watch-status";
export * from "./watchlist";
export * from "./user";
+export * from "./server-info";
diff --git a/front/packages/models/src/resources/server-info.ts b/front/packages/models/src/resources/server-info.ts
new file mode 100644
index 00000000..598f21c0
--- /dev/null
+++ b/front/packages/models/src/resources/server-info.ts
@@ -0,0 +1,54 @@
+/*
+ * Kyoo - A portable and vast media library solution.
+ * Copyright (c) Kyoo.
+ *
+ * See AUTHORS.md and LICENSE file in the project root for full license information.
+ *
+ * Kyoo is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * any later version.
+ *
+ * Kyoo is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with Kyoo. If not, see .
+ */
+
+import { z } from "zod";
+import { imageFn } from "..";
+
+export const OidcInfoP = z.object({
+ /*
+ * The name of this oidc service. Human readable.
+ */
+ displayName: z.string(),
+ /*
+ * A url returing a square logo for this provider.
+ */
+ logoUrl: z.string().nullable(),
+});
+
+export const ServerInfoP = z.object({
+ /*
+ * The list of oidc providers configured for this instance of kyoo.
+ */
+ oidc: z
+ .record(z.string(), OidcInfoP)
+ .transform((x) =>
+ Object.fromEntries(
+ Object.entries(x).map(([provider, info]) => [
+ provider,
+ { ...info, link: imageFn(`/auth/login/${provider}`) },
+ ]),
+ ),
+ ),
+});
+
+/**
+ * A season of a Show.
+ */
+export type ServerInfo = z.infer;
diff --git a/front/packages/primitives/src/button.tsx b/front/packages/primitives/src/button.tsx
index 5e095475..c061564e 100644
--- a/front/packages/primitives/src/button.tsx
+++ b/front/packages/primitives/src/button.tsx
@@ -23,14 +23,17 @@ import { Theme, useYoshiki } from "yoshiki/native";
import { PressableFeedback } from "./links";
import { P } from "./text";
import { ts } from "./utils";
-import { View } from "react-native";
+import { Falsy, View } from "react-native";
export const Button = forwardRef<
View,
- { text: string; licon?: ReactElement; icon?: ReactElement } & ComponentProps<
- typeof PressableFeedback
- >
->(function Button({ text, icon, licon, ...props }, ref) {
+ {
+ children?: ReactElement | Falsy;
+ text?: string;
+ licon?: ReactElement | Falsy;
+ icon?: ReactElement | Falsy;
+ } & ComponentProps
+>(function Button({ children, text, icon, licon, ...props }, ref) {
const { css } = useYoshiki("button");
return (
@@ -55,17 +58,20 @@ export const Button = forwardRef<
props as any,
)}
>
-
- {licon}
-
@@ -102,4 +102,6 @@ export const LoginPage: QueryPage = () => {
);
};
+LoginPage.getFetchUrls = () => [OidcLogin.query()];
+
LoginPage.getLayout = DefaultLayout;
diff --git a/front/packages/ui/src/login/oidc.tsx b/front/packages/ui/src/login/oidc.tsx
new file mode 100644
index 00000000..e165f938
--- /dev/null
+++ b/front/packages/ui/src/login/oidc.tsx
@@ -0,0 +1,83 @@
+/*
+ * Kyoo - A portable and vast media library solution.
+ * Copyright (c) Kyoo.
+ *
+ * See AUTHORS.md and LICENSE file in the project root for full license information.
+ *
+ * Kyoo is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * any later version.
+ *
+ * Kyoo is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with Kyoo. If not, see .
+ */
+
+import { QueryIdentifier, ServerInfo, ServerInfoP, useFetch } from "@kyoo/models";
+import { Button, HR, P, Skeleton, tooltip, ts } from "@kyoo/primitives";
+import { View, ImageBackground } from "react-native";
+import { percent, rem, useYoshiki } from "yoshiki/native";
+import { useTranslation } from "react-i18next";
+import { ErrorView } from "../errors";
+
+export const OidcLogin = () => {
+ const { css } = useYoshiki();
+ const { t } = useTranslation();
+ const { data, error } = useFetch(OidcLogin.query());
+
+ const btn = css({ width: { xs: percent(100), sm: percent(75) }, marginY: ts(1) });
+
+ return (
+
+ {error ? (
+
+ ) : data ? (
+ Object.values(data.oidc).map((x) => (
+
+ )
+ }
+ text={t("login.via", { provider: x.displayName })}
+ {...tooltip(t("login.via", { provider: x.displayName }))}
+ {...btn}
+ />
+ ))
+ ) : (
+ [...Array(3)].map((_, i) => (
+
+ ))
+ )}
+
+
+