Tristan Yang
31 lines
996 B
TypeScript
31 lines
996 B
TypeScript
import { useEffect, FC } from "react";
|
|
import { useGetOpenidMutation } from "../../app/services/auth";
|
|
import Button from "../../common/component/styled/Button";
|
|
import { OIDCConfig } from "../../types/auth";
|
|
|
|
const OidcLoginEntry: FC<{ issuer: OIDCConfig }> = ({ issuer }) => {
|
|
const [getOpenId, { data, isLoading, isSuccess }] = useGetOpenidMutation();
|
|
|
|
const handleSolidLogin = () => {
|
|
getOpenId({
|
|
issuer: issuer.domain,
|
|
redirect_uri: `${location.origin}/#/login`
|
|
});
|
|
};
|
|
|
|
useEffect(() => {
|
|
if (isSuccess && data) {
|
|
const { url } = data;
|
|
location.href = url;
|
|
}
|
|
}, [data, isSuccess]);
|
|
|
|
return (
|
|
<Button className="flex text-gray-800 dark:text-gray-100 flex-center gap-3" disabled={isLoading || isSuccess} onClick={handleSolidLogin}>
|
|
{!!issuer.favicon && <img src={issuer.favicon} className="w-6 h-6" alt="icon" />}
|
|
{isLoading ? `Loading...` : `Login with ${issuer.domain}`}
|
|
</Button>
|
|
);
|
|
};
|
|
export default OidcLoginEntry;
|