diff --git a/lib/MusicBrainz/Server/Controller/Admin/Attributes.pm b/lib/MusicBrainz/Server/Controller/Admin/Attributes.pm
index 7511bcd0cdb..dc8590aa408 100644
--- a/lib/MusicBrainz/Server/Controller/Admin/Attributes.pm
+++ b/lib/MusicBrainz/Server/Controller/Admin/Attributes.pm
@@ -143,10 +143,24 @@ sub delete : Chained('attribute_base') Args(1) RequireAuth(account_admin) Secure
 
         $c->detach;
     }
+
+    $c->stash(
+        component_path  => 'admin/attributes/DeleteAttribute',
+        component_props => {
+            attribute => $attr->TO_JSON,
+            form => $form->TO_JSON,
+        },
+        current_view    => 'Node',
+    );
+
     if ($c->form_posted_and_valid($form)) {
-        $c->model('MB')->with_transaction(sub {
-            $c->model($model)->delete($id);
-        });
+        if ($form->field('cancel')->input) {
+            # Do nothing
+        } else {
+            $c->model('MB')->with_transaction(sub {
+                $c->model($model)->delete($id);
+            });
+        }
 
         $c->response->redirect($c->uri_for('/admin/attributes', $model));
         $c->detach;
diff --git a/root/admin/attributes/Attribute.js b/root/admin/attributes/Attribute.js
index e224bbea62e..6012354e499 100644
--- a/root/admin/attributes/Attribute.js
+++ b/root/admin/attributes/Attribute.js
@@ -16,25 +16,6 @@ import expand2react from '../../static/scripts/common/i18n/expand2react.js';
 import yesNo from '../../static/scripts/common/utility/yesNo.js';
 import loopParity from '../../utility/loopParity.js';
 
-type AttributeT =
-  | AreaTypeT
-  | ArtistTypeT
-  | CollectionTypeT
-  | CoverArtTypeT
-  | EventTypeT
-  | GenderT
-  | InstrumentTypeT
-  | LabelTypeT
-  | MediumFormatT
-  | PlaceTypeT
-  | ReleaseGroupSecondaryTypeT
-  | ReleaseGroupTypeT
-  | ReleasePackagingT
-  | ReleaseStatusT
-  | SeriesTypeT
-  | WorkAttributeTypeT
-  | WorkTypeT;
-
 type Props = {
   +attributes: Array<AttributeT>,
   +model: string,
diff --git a/root/admin/attributes/DeleteAttribute.js b/root/admin/attributes/DeleteAttribute.js
new file mode 100644
index 00000000000..b00f0e2c7da
--- /dev/null
+++ b/root/admin/attributes/DeleteAttribute.js
@@ -0,0 +1,34 @@
+/*
+ * @flow strict
+ * Copyright (C) 2022 MetaBrainz Foundation
+ *
+ * This file is part of MusicBrainz, the open internet music database,
+ * and is licensed under the GPL version 2, or (at your option) any
+ * later version: http://www.gnu.org/licenses/gpl-2.0.txt
+ */
+
+import * as React from 'react';
+
+import ConfirmLayout from '../../components/ConfirmLayout.js';
+
+type Props = {
+  +attribute: AttributeT,
+  +form: SecureConfirmFormT,
+};
+
+const DeleteAttribute = ({
+  attribute,
+  form,
+}: Props): React.Element<typeof ConfirmLayout> => (
+  <ConfirmLayout
+    form={form}
+    question={exp.l(
+      `Are you sure you wish to remove the
+       <strong>{name}</strong> attribute?`,
+      {name: attribute.name},
+    )}
+    title={l('Remove Attribute')}
+  />
+);
+
+export default DeleteAttribute;
diff --git a/root/admin/attributes/delete.tt b/root/admin/attributes/delete.tt
deleted file mode 100644
index 598cdbbf25b..00000000000
--- a/root/admin/attributes/delete.tt
+++ /dev/null
@@ -1,17 +0,0 @@
-[%- WRAPPER 'layout.tt' title=l('Remove Attribute') full_width=1 -%]
-    <div id="content">
-        <h1>[% l('Remove Attribute') %]</h1>
-
-        <p>
-            [%- l('Are you sure you wish to remove the <strong>{name}</strong> attribute?', { name => attribute.name }) -%]
-        </p>
-
-        <form action="[% c.req.uri %]" method="post">
-            [%- USE r = FormRenderer(form) -%]
-            [% form_csrf_token(r) %]
-            <span class="buttons">
-                <button type="submit" name="confirm.submit">[% l('Remove') %]</button>
-            </span>
-        </form>
-    </div>
-[%- END -%]
diff --git a/root/server/components.mjs b/root/server/components.mjs
index d400b589f83..39e747a7059 100644
--- a/root/server/components.mjs
+++ b/root/server/components.mjs
@@ -39,6 +39,7 @@ export default {
   'account/sso/DiscourseUnconfirmedEmailAddress': (): Promise<mixed> => import('../account/sso/DiscourseUnconfirmedEmailAddress.js'),
   'admin/attributes/Attribute': (): Promise<mixed> => import('../admin/attributes/Attribute.js'),
   'admin/attributes/CannotRemoveAttribute': (): Promise<mixed> => import('../admin/attributes/CannotRemoveAttribute.js'),
+  'admin/attributes/DeleteAttribute': (): Promise<mixed> => import('../admin/attributes/DeleteAttribute.js'),
   'admin/attributes/Index': (): Promise<mixed> => import('../admin/attributes/Index.js'),
   'admin/attributes/Language': (): Promise<mixed> => import('../admin/attributes/Language.js'),
   'admin/attributes/Script': (): Promise<mixed> => import('../admin/attributes/Script.js'),
diff --git a/root/types/misc.js b/root/types/misc.js
index 5326c5988b8..68b76d69d78 100644
--- a/root/types/misc.js
+++ b/root/types/misc.js
@@ -7,6 +7,25 @@
  * later version: http://www.gnu.org/licenses/gpl-2.0.txt
  */
 
+declare type AttributeT =
+  | AreaTypeT
+  | ArtistTypeT
+  | CollectionTypeT
+  | CoverArtTypeT
+  | EventTypeT
+  | GenderT
+  | InstrumentTypeT
+  | LabelTypeT
+  | MediumFormatT
+  | PlaceTypeT
+  | ReleaseGroupSecondaryTypeT
+  | ReleaseGroupTypeT
+  | ReleasePackagingT
+  | ReleaseStatusT
+  | SeriesTypeT
+  | WorkAttributeTypeT
+  | WorkTypeT;
+
 /*
  * See http://search.cpan.org/~lbrocard/Data-Page-2.02/lib/Data/Page.pm
  * Serialized in MusicBrainz::Server::TO_JSON.