diff --git a/cypress/integration/admin/webhookSubscriptions.js b/cypress/integration/admin/webhookSubscriptions.js
index 337b65b8eab..d30468bf7e6 100644
--- a/cypress/integration/admin/webhookSubscriptions.js
+++ b/cypress/integration/admin/webhookSubscriptions.js
@@ -44,6 +44,43 @@ describe('WebhookSubscriptions Details Show Page', function () {
   });
 });
 
+describe('WebhookSubscriptions Details Edit Page', function () {
+  before(() => {
+    cy.prepareAdminApp();
+  });
+
+  it('pulls up edit page for a webhook subscription', function () {
+    cy.signInAsNewAdminUser();
+    cy.get('a[href*="system/webhook_subscriptions"]').click();
+    cy.url().should('eq', adminBaseURL + '/system/webhook_subscriptions');
+    cy.get('tr[resource="webhook_subscriptions"]').first().click();
+
+    // check that the page pulls up the right webhook subscription
+    cy.get('.ra-field-id > div > label')
+      .first()
+      .next()
+      .then(($id) => {
+        cy.get('a').contains('Edit').click();
+        cy.url().should('eq', adminBaseURL + '/system/webhook_subscriptions/' + $id.text());
+      });
+
+    // check labels on edit page
+    const labels = ['Id', 'Subscriber', 'Status', 'Event key', 'Callback url', 'Created at', 'Updated at', 'Severity'];
+    labels.forEach((label) => {
+      cy.get('label').contains(label);
+    });
+
+    // Change webhook subscription status
+    cy.get('div[id="status"]').click();
+    cy.get('#menu-status ul > li[data-value=DISABLED').click();
+    cy.get('button').contains('Save').click();
+
+    // Check that the webhook subscription status was changed for the first webhook subscription in the list
+    cy.url().should('eq', adminBaseURL + '/system/webhook_subscriptions');
+    cy.get('td.column-status > span').first().should('contain', 'DISABLED');
+  });
+});
+
 describe('Webhook Subscription Create Page', function () {
   before(() => {
     cy.prepareAdminApp();
@@ -64,16 +101,16 @@ describe('Webhook Subscription Create Page', function () {
     cy.get('button').contains('Save').click();
 
     // redirected to details page
-    cy.get('.ra-field-id span.MuiTypography-root')
+    cy.get('input[id="id"]')
       .invoke('text')
       .then((subID) => {
-        cy.get('#react-admin-title').contains('Webhook Subscription ID: ' + subID);
+        cy.get('#react-admin-title').contains('Webhook subscription #' + subID);
       });
 
-    cy.get('.ra-field-subscriberId').contains('5db13bb4-6d29-4bdb-bc81-262f4513ecf6');
-    cy.get('.ra-field-eventKey').contains('PaymentRequest.Update');
-    cy.get('.ra-field-callbackUrl').contains('https://test1.com');
-    cy.get('.ra-field-status').contains('ACTIVE');
-    cy.get('.ra-field-severity').contains('0');
+    cy.get('input[id="subscriberId"]').type('5db13bb4-6d29-4bdb-bc81-262f4513ecf6');
+    cy.get('input[id="eventKey"]').type('PaymentRequest.Update');
+    cy.get('input[id="callbackUrl"]').type('https://test1.com');
+    cy.get('div[id="status"]').should('contain', 'Active');
+    cy.get('div[id="severity"]').should('contain', '0');
   });
 });
diff --git a/src/pages/Admin/WebhookSubscriptions/WebhookSubscriptionEdit.jsx b/src/pages/Admin/WebhookSubscriptions/WebhookSubscriptionEdit.jsx
new file mode 100644
index 00000000000..a9cd483a60d
--- /dev/null
+++ b/src/pages/Admin/WebhookSubscriptions/WebhookSubscriptionEdit.jsx
@@ -0,0 +1,44 @@
+import React from 'react';
+import { Edit, required, SaveButton, SelectInput, SimpleForm, TextInput, Toolbar } from 'react-admin';
+
+import { WEBHOOK_SUBSCRIPTION_STATUS } from 'shared/constants';
+
+const WebhookSubscriptionEditToolbar = (props) => (
+  <Toolbar {...props}>
+    <SaveButton />
+  </Toolbar>
+);
+
+const WebhookSubscriptionEdit = (props) => (
+  /* eslint-disable-next-line react/jsx-props-no-spreading */
+  <Edit {...props}>
+    <SimpleForm toolbar={<WebhookSubscriptionEditToolbar />}>
+      <TextInput source="id" disabled />
+      <TextInput label="Subscriber Id" source="subscriberId" validate={required()} />
+      <TextInput source="eventKey" validate={required()} />
+      <TextInput source="callbackUrl" validate={required()} />
+      <SelectInput
+        source="severity"
+        choices={[
+          { id: 0, name: 0 },
+          { id: 1, name: 1 },
+          { id: 2, name: 2 },
+          { id: 3, name: 3 },
+          { id: 4, name: 4 },
+        ]}
+      />
+      <SelectInput
+        source="status"
+        choices={[
+          { id: WEBHOOK_SUBSCRIPTION_STATUS.ACTIVE, name: 'Active' },
+          { id: WEBHOOK_SUBSCRIPTION_STATUS.DISABLED, name: 'Disabled' },
+          { id: WEBHOOK_SUBSCRIPTION_STATUS.FAILING, name: 'Failing' },
+        ]}
+      />
+      <TextInput source="createdAt" disabled />
+      <TextInput source="updatedAt" disabled />
+    </SimpleForm>
+  </Edit>
+);
+
+export default WebhookSubscriptionEdit;
diff --git a/src/scenes/SystemAdmin/Home.jsx b/src/scenes/SystemAdmin/Home.jsx
index 83918205b6c..67d6daa33cb 100644
--- a/src/scenes/SystemAdmin/Home.jsx
+++ b/src/scenes/SystemAdmin/Home.jsx
@@ -27,6 +27,7 @@ import UserEdit from 'pages/Admin/Users/UserEdit';
 import WebhookSubscriptionList from 'pages/Admin/WebhookSubscriptions/WebhookSubscriptionsList';
 import WebhookSubscriptionShow from 'pages/Admin/WebhookSubscriptions/WebhookSubscriptionShow';
 import WebhookSubscriptionCreate from 'pages/Admin/WebhookSubscriptions/WebhookSubscriptionCreate';
+import WebhookSubscriptionEdit from '../../pages/Admin/WebhookSubscriptions/WebhookSubscriptionEdit';
 
 import styles from './Home.module.scss';
 import * as Cookies from 'js-cookie';
@@ -103,6 +104,7 @@ const Home = () => (
         show={WebhookSubscriptionShow}
         create={WebhookSubscriptionCreate}
         list={WebhookSubscriptionList}
+        edit={WebhookSubscriptionEdit}
       />
     </Admin>
   </div>