feat: Add bulk page (Staging only)

reacherhq · Dec 16, 2023 · b9c5237 · b9c5237
1 parent 3047d54
commit b9c5237
Show file tree

Hide file tree

Showing 4 changed files with 67 additions and 65 deletions.
diff --git a/src/app/api/v1/bulk/route.ts b/src/app/api/v1/bulk/route.ts
@@ -11,6 +11,14 @@ interface BulkPayload {
 }
 
 export const POST = async (req: NextRequest): Promise<Response> => {
+	// TODO Remove this once we allow Bulk.
+	if (process.env.VERCEL_ENV === "production") {
+		return Response.json(
+			{ error: "Not available in production" },
+			{ status: 403 }
+		);
+	}
+
 	try {
 		const user = await getUser(req);
 

diff --git a/src/app/api/v1/bulk/webhook/route.ts b/src/app/api/v1/bulk/webhook/route.ts
@@ -1,8 +1,8 @@
 import { CheckEmailOutput } from "@reacherhq/api";
-import { SupabaseCall } from "@/util/supabaseClient";
 import { supabaseAdmin } from "@/util/supabaseServer";
 import { NextRequest } from "next/server";
 import { removeSensitiveData } from "@/util/api";
+import { Tables } from "@/supabase/database.types";
 
 export interface WebhookExtra {
 	bulkEmailId: string;
@@ -25,7 +25,7 @@ export const POST = async (req: NextRequest): Promise<Response> => {
 
 	// Add to supabase calls
 	const res1 = await supabaseAdmin
-		.from<SupabaseCall>("calls")
+		.from<Tables<"calls">>("calls")
 		.insert({
 			endpoint: extra.endpoint,
 			user_id: extra.userId,

diff --git a/src/components/Demo.tsx b/src/components/Demo.tsx
@@ -5,7 +5,6 @@ import React, { useState } from "react";
 import { postData } from "@/util/helpers";
 import { sentryException } from "@/util/sentry";
 import { useUser } from "@/util/useUser";
-import { Bulk } from "./Bulk";
 
 function alertError(email: string, e: string) {
 	alert(
@@ -67,8 +66,6 @@ export function Demo({ onVerified }: DemoProps): React.ReactElement {
 		<Card>
 			<Text h3>Verify an email (quick & easy 💪)</Text>
 
-			<Bulk />
-
 			<Text>
 				Simply enter an email and click &quot;Verify&quot; to get the
 				results.

diff --git a/src/components/Bulk.tsx → src/pages/bulk.tsx b/src/components/Bulk.tsx → src/pages/bulk.tsx
@@ -1,4 +1,4 @@
-import { Button, Spacer, Table, Text, Textarea } from "@geist-ui/react";
+import { Button, Page, Spacer, Table, Text, Textarea } from "@geist-ui/react";
 import { CheckEmailOutput } from "@reacherhq/api/lib";
 import React, { useEffect, useState } from "react";
 
@@ -7,6 +7,7 @@ import { sentryException } from "@/util/sentry";
 import { useUser } from "@/util/useUser";
 import { Tables } from "@/supabase/database.types";
 import { supabase } from "@/util/supabaseClient";
+import { Nav } from "@/components";
 
 function alertError(email: string, e: string) {
 	alert(
@@ -21,33 +22,25 @@ interface BulkProps {
 	onVerified?(result: CheckEmailOutput): Promise<void>;
 }
 
-const emailsToTest = [
-	"[email protected]",
-	"[email protected]",
-	"[email protected]",
-	"[email protected]",
-	"[email protected]",
-	"[email protected]",
-	"[email protected]",
-	"[email protected]",
-	"[email protected]",
-	"[email protected]",
-	"[email protected]",
-	"[email protected]",
-	"[email protected]",
-];
-
 interface BulkJobWithEmails extends Tables<"bulk_jobs"> {
 	bulk_emails: Tables<"bulk_emails">[];
 }
 
-export function Bulk({ onVerified }: BulkProps): React.ReactElement {
+export default function Bulk({ onVerified }: BulkProps): React.ReactElement {
 	const { user, userDetails } = useUser();
-	const [emails, setEmails] = useState(emailsToTest.join("\n"));
+	const [emails, setEmails] = useState("");
 	const [loading, setLoading] = useState(false);
 
 	const [bulkJobs, setBulkJobs] = useState<BulkJobWithEmails[]>([]);
 
+	useEffect(() => {
+		// This is a temporary redirect to the dashboard while I still work
+		// on the bulk page.
+		if (window.location.hostname == "app.reacher.email") {
+			window.location.href = "https://app.reacher.email/dashboard";
+		}
+	}, []);
+
 	useEffect(() => {
 		setInterval(async () => {
 			console.log("FETCHING BULK JOBS...");
@@ -99,50 +92,54 @@ export function Bulk({ onVerified }: BulkProps): React.ReactElement {
 
 	return (
 		<>
-			<Text h3>BULK</Text>
-
-			<div className="text-center">
-				<Textarea
-					autoFocus
-					disabled={loading}
-					onChange={(e) => {
-						setEmails(e.target.value);
-					}}
-					placeholder="[email protected]"
-					value={emails}
-				></Textarea>
+			<Nav />
+			<Page>
+				<Text h3>BULK Work in Progress Page</Text>
+
+				<div className="text-center">
+					<Textarea
+						autoFocus
+						disabled={loading}
+						onChange={(e) => {
+							setEmails(e.target.value);
+						}}
+						placeholder="[email protected]"
+						value={emails}
+					></Textarea>
+
+					<Spacer />
+
+					<Button
+						disabled={loading}
+						loading={loading}
+						onClick={handleVerify}
+						type="success"
+					>
+						Bulk Verify
+					</Button>
+				</div>
 
 				<Spacer />
 
-				<Button
-					disabled={loading}
-					loading={loading}
-					onClick={handleVerify}
-					type="success"
-				>
-					Bulk Verify
-				</Button>
-			</div>
-
-			<Spacer />
-
-			<Table data={bulkJobs}>
-				<Table.Column prop="id" label="ID" />
-			</Table>
-
-			<div>
-				ALLJOBS:
-				{bulkJobs.map((job) => (
-					<div key={job.id}>
-						{job.id} -{" "}
-						{
-							job.bulk_emails.filter(({ call_id }) => !!call_id)
-								.length
-						}
-						/{job.bulk_emails.length}
-					</div>
-				))}
-			</div>
+				<Table data={bulkJobs}>
+					<Table.Column prop="id" label="ID" />
+				</Table>
+
+				<div>
+					ALLJOBS:
+					{bulkJobs.map((job) => (
+						<div key={job.id}>
+							{job.id} -{" "}
+							{
+								job.bulk_emails.filter(
+									({ call_id }) => !!call_id
+								).length
+							}
+							/{job.bulk_emails.length}
+						</div>
+					))}
+				</div>
+			</Page>
 		</>
 	);
 }