revert maigc link

.env.example

@@ -1,11 +1,6 @@
-# set this to true to prevent search engines from indexing the website
-# default to false for seo safety
-DISALLOW_INDEXING="false"
-
 # generate with `openssl rand -hex 32`
 SESSION_SECRET="session_secret"
 CSRF_SECRET="csrf_secret"
-MAGIC_LINK_SECRET="magic_link_secret"
 
 # Github > Settings > Developer settings > New App
 # or simply https://github.com/settings/developers
@@ -23,9 +18,9 @@ TURSO_DB_URL="file:local/dev.db"
 # turso db tokens create <database-name>
 TURSO_DB_AUTH_TOKEN="MOCK_TURSO_DB_AUTH_TOKEN"
 
-# Resend > API Keys > Create API Key
-# https://resend.com/api-keys
-RESEND_API_KEY="MOCK_RESEND_API_KEY"
+# set this to true to prevent search engines from indexing the website
+# default to false for seo safety
+DISALLOW_INDEXING="false"
 
 # Sentry > Project Setting > SDK Setup > Client Keys
 SENTRY_DNS="your-dns"

app/components/status-button.tsx

@@ -9,7 +9,7 @@ export interface StatusButtonProps extends ButtonProps {
 export const StatusButton = forwardRef<HTMLButtonElement, StatusButtonProps>(
 	({ status, className, children, ...props }, ref) => {
 		const statusIcon = {
-			success: <Icon name="check-circled" className="text-green-600" />,
+			success: <Icon name="check-circled" />,
 			pending: <Icon name="update" className="animate-spin" />,
 			error: (
 				<Icon

app/routes/_auth+/login.tsx

@@ -1,27 +1,17 @@
-import { getFormProps, getInputProps, useForm } from '@conform-to/react'
-import { getZodConstraint, parseWithZod } from '@conform-to/zod'
 import { type SEOHandle } from '@nasa-gcn/remix-seo'
-import { data, Form, useActionData, useSearchParams } from 'react-router'
-import { z } from 'zod'
-import { Field } from '#app/components/forms.tsx'
-import { StatusButton } from '#app/components/status-button.tsx'
+import { useSearchParams } from 'react-router'
 import {
 	Card,
 	CardContent,
 	CardDescription,
 	CardHeader,
 	CardTitle,
 } from '#app/components/ui/card.tsx'
-import { Separator } from '#app/components/ui/separator.tsx'
 import { requireAnonymous } from '#app/utils/auth/auth.server.ts'
 import {
 	ProviderConnectionForm,
 	providerNames,
 } from '#app/utils/auth/connections.tsx'
-import { createAuthenticator } from '#app/utils/auth/magic-link.server.ts'
-import { combineHeaders } from '#app/utils/request.server.ts'
-import { createToastHeaders } from '#app/utils/toast.server.ts'
-import { useIsPending } from '#app/utils/ui.ts'
 import { type Route } from './+types/login'
 
 export const handle: SEOHandle = {
@@ -44,37 +34,6 @@ export async function loader({ request }: Route.LoaderArgs) {
 	return null
 }
 
-export async function action({ request }: Route.ActionArgs) {
-	const formData = await request.clone().formData()
-	const submission = parseWithZod(formData, {
-		schema: MagicLinkLoginSchema,
-	})
-
-	if (submission.status !== 'success') {
-		return data(
-			{ result: submission.reply() },
-			{ status: submission.status === 'error' ? 400 : 200 },
-		)
-	}
-
-	const authenticator = createAuthenticator(request)
-	const authHeaders = (await authenticator
-		.authenticate('email-link', request)
-		.catch((headers) => headers)) as Headers
-
-	const toastHeaders = await createToastHeaders({
-		title: '✨ Magic Link has been sent',
-		message: `sent to ${submission.value.email}`,
-	})
-
-	return data(
-		{ result: submission.reply() },
-		{
-			headers: combineHeaders(authHeaders, toastHeaders),
-		},
-	)
-}
-
 export default function Login() {
 	const [searchParams] = useSearchParams()
 	const redirectTo = searchParams.get('redirectTo')
@@ -87,8 +46,6 @@ export default function Login() {
 					<CardDescription>Choose your path</CardDescription>
 				</CardHeader>
 				<CardContent>
-					<MagicLinkLogin />
-					<Separator className="my-4" />
 					<ul className="flex flex-col gap-y-2">
 						{providerNames.map((providerName) => (
 							<li key={providerName}>
@@ -104,41 +61,3 @@ export default function Login() {
 		</div>
 	)
 }
-
-export const MagicLinkLoginSchema = z.object({
-	email: z.string().email(),
-})
-
-function MagicLinkLogin() {
-	const isPending = useIsPending()
-	const actionData = useActionData<typeof action>()
-	const [form, fields] = useForm({
-		id: 'magic-link-login-form',
-		constraint: getZodConstraint(MagicLinkLoginSchema),
-		lastResult: actionData?.result,
-		shouldRevalidate: 'onBlur',
-		onValidate: ({ formData }) =>
-			parseWithZod(formData, { schema: MagicLinkLoginSchema }),
-	})
-
-	return (
-		<Form method="post" {...getFormProps(form)}>
-			<Field
-				labelProps={{ children: 'Email' }}
-				inputProps={{
-					...getInputProps(fields.email, { type: 'email' }),
-					autoComplete: 'email',
-				}}
-				errors={fields.email.errors}
-			/>
-			<StatusButton
-				type="submit"
-				className="w-full"
-				status={isPending ? 'pending' : (form.status ?? 'idle')}
-				disabled={isPending}
-			>
-				Email a login link
-			</StatusButton>
-		</Form>
-	)
-}