Files
app
routes
_index.tsx
about.tsx
admin-application.tsx
appeals.tsx
book-event.tsx
data-transfer.tsx
data-transfer_.complete.tsx
data-transfer_.destination-account.tsx
data-transfer_.start.tsx
delete-account.tsx
et-members.tsx
et-members_.strikes_.$uid.tsx
events-calendar.tsx
events-team.tsx
events-team_.events-breakdown.tsx
events-team_.historical.tsx
events-team_.report.tsx
hammer.tsx
me.tsx
mod-queue.tsx
privacy.tsx
report.tsx
rpserver.tsx
short-links.tsx
short-links_.create.tsx
support.tsx
team.tsx
terms.tsx
styles
context.tsx
createEmotionCache.ts
entry.client.tsx
entry.server.tsx
root.tsx
components
data
functions
public
.gitignore
.node-version
.prettierignore
OFL.txt
README.md
emotion-server.js
index.css
index.d.ts
package-lock.json
package.json
remix.config.js
server.ts
theme.ts
tsconfig.json
car-crushers-portal/app/routes/data-transfer_.destination-account.tsx

34 lines
1.1 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 { host, protocol } = new URL(context.request.url);
return { client_id: context.env.ROBLOX_OAUTH_CLIENT_ID, host, protocol };
}
export default function () {
const loaderData = useLoaderData<typeof loader>();
return (
<Container pt="16vh">
<Card borderRadius="32px" p="4vh">
<VStack alignContent="center" gap="2vh">
<Heading>Verify your new Roblox account</Heading>
<br />
<Button
as="a"
borderRadius="24px"
colorScheme="blue"
href={`https://apis.roblox.com/oauth/v1/authorize?client_id=${
loaderData.client_id
}&redirect_uri=${encodeURIComponent(
`${loaderData.protocol}//${loaderData.host}/api/data-transfers/verify`,
)}&response_type=code&scope=openid%20profile`}
>
Verify
</Button>
</VStack>
</Card>
</Container>
);
}