add initiate login endpoint to /login (#7)

Author: nicknisi

app/components/sign-in-button.tsx

@@ -4,7 +4,7 @@ import { useRootLoaderData } from '~/root';
 
 export default function SignInButton({ large }: { large?: boolean }) {
   const rootLoaderData = useRootLoaderData();
-  const { user, signInUrl } = rootLoaderData || {};
+  const { user } = rootLoaderData || {};
 
   if (user) {
     return (
@@ -20,7 +20,7 @@ export default function SignInButton({ large }: { large?: boolean }) {
 
   return (
     <Button asChild size={large ? '3' : '2'}>
-      <a href={signInUrl}>Sign In{large && ' with AuthKit'}</a>
+      <a href="/login">Sign In{large && ' with AuthKit'}</a>
     </Button>
   );
 }

app/root.tsx

@@ -8,20 +8,11 @@ import { Links, Link, Meta, Outlet, Scripts, ScrollRestoration, useRouteLoaderDa
 import Footer from './components/footer';
 import SignInButton from './components/sign-in-button';
 
-import { getSignInUrl, signOut, authkitLoader } from '@workos-inc/authkit-react-router';
+import { signOut, authkitLoader } from '@workos-inc/authkit-react-router';
 
 export const links: LinksFunction = () => [];
 
-export const loader = (args: LoaderFunctionArgs) =>
-  authkitLoader(
-    args,
-    async () => {
-      return {
-        signInUrl: await getSignInUrl(),
-      };
-    },
-    { debug: true },
-  );
+export const loader = (args: LoaderFunctionArgs) => authkitLoader(args, { debug: true });
 
 export function useRootLoaderData() {
   return useRouteLoaderData<typeof loader>('root');

app/routes/login.ts

@@ -0,0 +1,8 @@
+import { getSignInUrl } from '@workos-inc/authkit-react-router';
+import { redirect } from 'react-router';
+
+export const loader = async () => {
+  const signInUrl = await getSignInUrl();
+
+  return redirect(signInUrl);
+};