Fix auto-focus in bulk update and delete modals

Author: kraenhansen

packages/compass-crud/src/components/bulk-delete-modal.tsx

@@ -94,7 +94,12 @@ const BulkDeleteModal: React.FunctionComponent<BulkDeleteModalProps> = ({
 
   const exportButtonId = useId();
   return (
-    <Modal setOpen={onCancel} open={open} data-testid="bulk-delete-modal">
+    <Modal
+      setOpen={onCancel}
+      open={open}
+      data-testid="bulk-delete-modal"
+      initialFocus={`#${exportButtonId}`}
+    >
       <ModalHeader
         title={`Delete ${documentCount ?? ''} document${
           documentCount === 1 ? '' : 's'

packages/compass-crud/src/components/bulk-update-modal.tsx

@@ -405,6 +405,7 @@ export default function BulkUpdateModal({
       setOpen={closeBulkUpdateModal}
       data-testid="bulk-update-modal"
       className={enablePreview ? modalContentStyles : undefined}
+      initialFocus={`#${bulkUpdateUpdateId} .cm-content`}
     >
       <ModalHeader title={modalTitleAndButtonText} subtitle={ns} />
       <ModalBody>
@@ -439,8 +440,6 @@ export default function BulkUpdateModal({
                   onBlur={() => ({})}
                   annotations={annotations}
                   minLines={12}
-                  // eslint-disable-next-line jsx-a11y/no-autofocus
-                  autoFocus
                 />
 
                 <div className={bannerContainerStyles}>