feat: bulk delete members ✌️

apps/admin-dashboard/app/routes/_dashboard.students.remove.tsx

@@ -0,0 +1,140 @@
+import {
+  type ActionFunctionArgs,
+  data,
+  Form,
+  type LoaderFunctionArgs,
+  redirect,
+  useActionData,
+} from 'react-router';
+import z from 'zod';
+
+import { job } from '@oyster/core/bull';
+import { db } from '@oyster/db';
+import {
+  Button,
+  ErrorMessage,
+  Field,
+  getErrors,
+  Modal,
+  Textarea,
+  validateForm,
+} from '@oyster/ui';
+import { Callout } from '@oyster/ui/callout';
+
+import { Route } from '@/shared/constants';
+import {
+  commitSession,
+  ensureUserAuthenticated,
+  toast,
+} from '@/shared/session.server';
+
+export async function loader({ request }: LoaderFunctionArgs) {
+  await ensureUserAuthenticated(request);
+
+  return {};
+}
+
+const RemoveMembersFormData = z.object({
+  memberIds: z
+    .string()
+    .min(1)
+    .transform((value) => value.split('\n').filter(Boolean)),
+});
+
+export async function action({ request }: ActionFunctionArgs) {
+  const session = await ensureUserAuthenticated(request);
+
+  const form = await request.formData();
+
+  const result = await validateForm(form, RemoveMembersFormData);
+
+  if (!result.ok) {
+    return data(result, { status: 400 });
+  }
+
+  const count = await removeMembers(result.data.memberIds);
+
+  toast(session, {
+    message: `Removed ${count} members.`,
+  });
+
+  return redirect(Route['/students'], {
+    headers: {
+      'Set-Cookie': await commitSession(session),
+    },
+  });
+}
+
+async function removeMembers(ids: string[]): Promise<number> {
+  const students = await db
+    .deleteFrom('students')
+    .where('id', 'in', ids)
+    .returning(['airtableId', 'email', 'firstName', 'slackId'])
+    .execute();
+
+  for (const student of students) {
+    job('student.removed', {
+      airtableId: student.airtableId as string,
+      email: student.email,
+      firstName: student.firstName,
+      sendViolationEmail: false,
+      slackId: student.slackId,
+    });
+  }
+
+  return students.length;
+}
+
+export default function RemoveMembersPage() {
+  const { error, errors } = getErrors(useActionData<typeof action>());
+
+  return (
+    <Modal onCloseTo={Route['/students']}>
+      <Modal.Header>
+        <Modal.Title>Bulk Remove Members</Modal.Title>
+        <Modal.CloseButton />
+      </Modal.Header>
+
+      <Modal.Description>
+        This action is not reversible. All of their engagement records will be
+        deleted and they will be removed from Slack, Mailchimp and Airtable.
+      </Modal.Description>
+
+      <Callout color="blue">
+        Note: These members will immediately be removed from our database, but
+        it may take some time for them to be removed from Slack, Mailchimp and
+        Airtable.
+      </Callout>
+
+      <Form className="form" method="post">
+        <ErrorMessage>{error}</ErrorMessage>
+
+        <Field
+          description="Please list the IDs of the members to remove separated by a newline."
+          error={errors.memberIds}
+          label="Member IDs"
+          labelFor="memberIds"
+          required
+        >
+          <Textarea
+            id="memberIds"
+            maxRows={10}
+            minRows={10}
+            name="memberIds"
+            required
+          />
+        </Field>
+
+        <Button.Group>
+          <Button color="error" type="submit">
+            Remove
+          </Button>
+        </Button.Group>
+      </Form>
+    </Modal>
+  );
+}
+
+export function ErrorBoundary() {
+  return <></>;
+}

apps/admin-dashboard/app/routes/_dashboard.students.tsx

@@ -1,6 +1,14 @@
 import dayjs from 'dayjs';
 import { sql } from 'kysely';
-import { CornerUpLeft, Edit, ExternalLink, Star, Trash } from 'react-feather';
+import {
+  CornerUpLeft,
+  Edit,
+  ExternalLink,
+  Menu,
+  Star,
+  Trash,
+  Trash2,
+} from 'react-feather';
 import {
   generatePath,
   Link,
@@ -14,6 +22,7 @@ import { db } from '@oyster/db';
 import {
   Dashboard,
   Dropdown,
+  IconButton,
   Pagination,
   type SerializeFrom,
   Table,
@@ -118,6 +127,10 @@ export default function StudentsPage() {
 
       <Dashboard.Subheader>
         <Dashboard.SearchForm placeholder="Search by name..." />
+
+        <div className="ml-auto flex items-center gap-2">
+          <StudentsMenuDropdown />
+        </div>
       </Dashboard.Subheader>
 
       <StudentsTable />
@@ -127,6 +140,31 @@ export default function StudentsPage() {
   );
 }
 
+function StudentsMenuDropdown() {
+  return (
+    <Dropdown.Root>
+      <Dropdown.Trigger>
+        <IconButton
+          backgroundColor="gray-100"
+          backgroundColorOnHover="gray-200"
+          icon={<Menu />}
+          shape="square"
+        />
+      </Dropdown.Trigger>
+
+      <Dropdown>
+        <Dropdown.List>
+          <Dropdown.Item>
+            <Link to={Route['/students/remove']}>
+              <Trash2 /> Bulk Remove Members
+            </Link>
+          </Dropdown.Item>
+        </Dropdown.List>
+      </Dropdown>
+    </Dropdown.Root>
+  );
+}
+
 type StudentInView = SerializeFrom<typeof loader>['students'][number];
 
 function StudentsTable() {

apps/admin-dashboard/app/shared/constants.ts

@@ -41,6 +41,7 @@ const ROUTES = [
   '/schools/:id/chapter/create',
   '/schools/:id/edit',
   '/students',
+  '/students/remove',
   '/students/:id/email',
   '/students/:id/points/grant',
   '/students/:id/remove',

packages/core/src/infrastructure/bull.ts

@@ -44,10 +44,10 @@ export function getQueue(name: string) {
     _queues[name] = new Queue(name, {
       connection,
       defaultJobOptions: {
-        attempts: 3,
+        attempts: 1,
         backoff: { delay: 5000, type: 'exponential' },
-        removeOnComplete: { age: 60 * 60 * 24 * 1, count: 100 },
-        removeOnFail: { age: 60 * 60 * 24 * 7, count: 1000 },
+        removeOnComplete: { age: 60 * 60 * 24 * 1, count: 1000 },
+        removeOnFail: { age: 60 * 60 * 24 * 30, count: 10000 },
       },
     });
   }
@@ -143,7 +143,7 @@ export function registerWorker<Schema extends ZodType>(
     autorun: false,
     connection: redis,
     removeOnComplete: { age: 60 * 60 * 24 * 1, count: 1000 },
-    removeOnFail: { age: 60 * 60 * 24 * 7, count: 10000 },
+    removeOnFail: { age: 60 * 60 * 24 * 30, count: 10000 },
     ...options,
   };
 

packages/core/src/modules/airtable.ts

@@ -14,6 +14,7 @@ import {
   AirtableBullJob,
   type GetBullJobData,
 } from '@/infrastructure/bull.types';
+import { reportException } from '@/infrastructure/sentry';
 import { IS_PRODUCTION } from '@/shared/env';
 import { ColorStackError, ErrorWithContext } from '@/shared/errors';
 import { RateLimiter } from '@/shared/utils/rate-limiter';
@@ -387,14 +388,28 @@ async function deleteAirtableRecord({
 
   await airtableRateLimiter.process();
 
-  await fetch(
+  const response = await fetch(
     `${AIRTABLE_API_URI}/${airtableBaseId}/${airtableTableId}/${airtableRecordId}`,
     {
       headers: getAirtableHeaders(),
       method: 'delete',
     }
   );
 
+  if (!response.ok) {
+    const error = new ErrorWithContext(
+      'Failed to delete Airtable record.'
+    ).withContext({
+      airtableBaseId,
+      airtableRecordId,
+      airtableTableId,
+    });
+
+    reportException(error);
+
+    throw error;
+  }
+
   console.log({
     code: 'airtable_record_deleted',
     message: 'Airtable record was deleted.',

packages/ui/src/components/textarea.tsx

@@ -13,6 +13,7 @@ type TextareaProps = Pick<
   | 'defaultValue'
   | 'id'
   | 'maxLength'
+  | 'maxRows'
   | 'minLength'
   | 'minRows'
   | 'name'