Files
car-crushers-portal/app/routes/data-request_.auth.tsx
T

46 lines
1.3 KiB
TypeScript

import { Button, Card, Container, Heading, VStack } from "@chakra-ui/react";
import { useLoaderData } from "@remix-run/react";
export async function loader({ context }: { context: RequestContext }) {
const state = crypto.randomUUID().replace(/-/g, "");
const url = new URL(context.request.url);
url.pathname = "/api/data-requests/session";
await context.env.DATA.put(
`rbxstate_${state}`,
context.request.headers.get("cf-connecting-ip") ?? "",
{
expirationTtl: 300,
},
);
return {
client_id: context.env.ROBLOX_OAUTH_CLIENT_ID,
state,
url: encodeURIComponent(url.href),
};
}
export default function () {
const { client_id, state, url } = useLoaderData<typeof loader>();
return (
<Container pt="16vh">
<Card borderRadius="32px" p="4vh">
<VStack alignContent="center" gap="2vh">
<Heading>Log in to Car Crushers</Heading>
<br />
<Button
as="a"
borderRadius="24px"
colorScheme="blue"
href={`https://apis.roblox.com/oauth/v1/authorize?client_id=${client_id}&redirect_uri=${url}&response_type=code&state=${state}`}
>
Log in with Roblox
</Button>
</VStack>
</Card>
</Container>
);
}