diff --git a/CHANGELOG.rst b/CHANGELOG.rst
index 5266efaaed8..ae4bcaae5d1 100644
--- a/CHANGELOG.rst
+++ b/CHANGELOG.rst
@@ -15,6 +15,9 @@ Unreleased
 ~~~~~~~~~~
 * Add simple history to proctored exam attempt, writing both old and new model for now. Includes admin view.
 
+[3.22.1] - 2021-08-02
+* Add edit button to grouped allowances, which allows instructors to edit the value of a single allowance.
+
 [3.22.0] - 2021-07-26
 ~~~~~~~~~~~~~~~~~~~~~
 * If verified name functionality is enabled through the "name_affirmation" runtime service,
diff --git a/edx_proctoring/__init__.py b/edx_proctoring/__init__.py
index cb14a356941..87fee2acddb 100644
--- a/edx_proctoring/__init__.py
+++ b/edx_proctoring/__init__.py
@@ -3,6 +3,6 @@
 """
 
 # Be sure to update the version number in edx_proctoring/package.json
-__version__ = '3.22.0'
+__version__ = '3.22.1'
 
 default_app_config = 'edx_proctoring.apps.EdxProctoringConfig'  # pylint: disable=invalid-name
diff --git a/edx_proctoring/settings/common.py b/edx_proctoring/settings/common.py
index 80841654025..c7c41c1ede5 100644
--- a/edx_proctoring/settings/common.py
+++ b/edx_proctoring/settings/common.py
@@ -28,6 +28,7 @@ def plugin_settings(settings):
             'proctoring/js/views/proctored_exam_add_bulk_allowance_view.js',
             'proctoring/js/views/proctored_exam_allowance_view.js',
             'proctoring/js/views/proctored_exam_attempt_view.js',
+            'proctoring/js/views/proctored_exam_edit_allowance_view.js',
             'proctoring/js/views/proctored_exam_onboarding_view.js',
             'proctoring/js/views/proctored_exam_view.js',
             'proctoring/js/views/proctored_exam_info.js',
diff --git a/edx_proctoring/static/proctoring/js/views/proctored_exam_add_bulk_allowance_view.js b/edx_proctoring/static/proctoring/js/views/proctored_exam_add_bulk_allowance_view.js
index cdd6daf52c8..110bb7a8fa6 100644
--- a/edx_proctoring/static/proctoring/js/views/proctored_exam_add_bulk_allowance_view.js
+++ b/edx_proctoring/static/proctoring/js/views/proctored_exam_add_bulk_allowance_view.js
@@ -236,9 +236,9 @@ edx = edx || {};
         },
         updateAllowanceLabels: function(selectedAllowanceType) {
             if (selectedAllowanceType === 'additional_time_granted') {
-                $('#allowance_value_label').text(gettext('Input Additional Minutes as a Positive Number'));
+                $('#allowance_value_label').text(gettext('Add Time(Minutes)'));
             } else if (selectedAllowanceType === 'time_multiplier') {
-                $('#allowance_value_label').text(gettext('Input Multiplier as a Number Greater Than 1'));
+                $('#allowance_value_label').text(gettext('Add Multiplier as a Number Greater Than 1'));
             } else {
                 $('#allowance_value_label').text(gettext('Add Policy Exception'));
             }
diff --git a/edx_proctoring/static/proctoring/js/views/proctored_exam_allowance_view.js b/edx_proctoring/static/proctoring/js/views/proctored_exam_allowance_view.js
index 73be7d293c4..daa3e1da3f5 100644
--- a/edx_proctoring/static/proctoring/js/views/proctored_exam_allowance_view.js
+++ b/edx_proctoring/static/proctoring/js/views/proctored_exam_allowance_view.js
@@ -44,7 +44,8 @@ edx = edx || {};
         events: {
             'click #add-allowance': 'showAddModal',
             'click .remove_allowance': 'removeAllowance',
-            'click .accordion-trigger': 'toggleAllowanceAccordion'
+            'click .accordion-trigger': 'toggleAllowanceAccordion',
+            'click .edit_allowance': 'editAllowance'
         },
         getCSRFToken: function() {
             var cookieValue = null;
@@ -185,6 +186,29 @@ edx = edx || {};
             event.stopPropagation();
             event.preventDefault();
         },
+        editAllowance: function(event) {
+            var $element = $(event.currentTarget);
+            var userName = $element.data('user-name');
+            var examID = $element.data('exam-id');
+            var examName = $element.data('exam-name');
+            var key = $element.data('key-name');
+            var keyName = $element.data('key-value');
+            var self = this;
+            self.proctoredExamCollection.fetch({
+                success: function() {
+                    // eslint-disable-next-line no-new
+                    new edx.instructor_dashboard.proctoring.EditAllowanceView({
+                        course_id: self.course_id,
+                        selected_exam_ID: examID,
+                        selected_exam_name: examName,
+                        proctored_exam_allowance_view: self,
+                        selected_user: userName,
+                        allowance_type: key,
+                        allowance_type_name: keyName
+                    });
+                }
+            });
+        },
         toggleAllowanceAccordion: function(event) {
             // based on code from openedx/features/course_experience/static/course_experience/js/CourseOutline.js
             // but modified to better fit this feature's needs
@@ -193,16 +217,16 @@ edx = edx || {};
             if (accordionRow.classList.contains('accordion-trigger')) {
                 isExpanded = accordionRow.getAttribute('aria-expanded') === 'true';
                 if (!isExpanded) {
-                    $toggleChevron = $(accordionRow).find('.fa-chevron-right');
+                    $toggleChevron = $(accordionRow).find('.fa-chevron-down');
                     $contentPanel = $('#' + accordionRow.innerText.trim());
                     $contentPanel.show();
-                    $toggleChevron.addClass('fa-rotate-90');
+                    $toggleChevron.addClass('fa-rotate-180');
                     accordionRow.setAttribute('aria-expanded', 'true');
                 } else {
-                    $toggleChevron = $(accordionRow).find('.fa-chevron-right');
+                    $toggleChevron = $(accordionRow).find('.fa-chevron-down');
                     $contentPanel = $('#' + accordionRow.innerText.trim());
                     $contentPanel.hide();
-                    $toggleChevron.removeClass('fa-rotate-90');
+                    $toggleChevron.removeClass('fa-rotate-180');
                     accordionRow.setAttribute('aria-expanded', 'false');
                 }
             }
diff --git a/edx_proctoring/static/proctoring/js/views/proctored_exam_edit_allowance_view.js b/edx_proctoring/static/proctoring/js/views/proctored_exam_edit_allowance_view.js
new file mode 100644
index 00000000000..ffa758e5f89
--- /dev/null
+++ b/edx_proctoring/static/proctoring/js/views/proctored_exam_edit_allowance_view.js
@@ -0,0 +1,164 @@
+edx = edx || {};
+
+(function(Backbone, $, _, gettext) {
+    'use strict';
+
+    edx.instructor_dashboard = edx.instructor_dashboard || {};
+    edx.instructor_dashboard.proctoring = edx.instructor_dashboard.proctoring || {};
+
+    edx.instructor_dashboard.proctoring.EditAllowanceView = Backbone.ModalView.extend({
+        name: 'EditAllowanceView',
+        template: null,
+        template_url: '/static/proctoring/templates/edit-allowance.underscore',
+        initialize: function(options) {
+            this.selected_exam_ID = options.selected_exam_ID;
+            this.selected_exam_name = options.selected_exam_name;
+            this.proctored_exam_allowance_view = options.proctored_exam_allowance_view;
+            this.course_id = options.course_id;
+            this.selected_user = options.selected_user;
+            this.allowance_type = options.allowance_type;
+            this.allowance_type_name = options.allowance_type_name;
+            this.model = new edx.instructor_dashboard.proctoring.ProctoredExamBulkAllowanceModel();
+            _.bindAll(this, 'render');
+            this.loadTemplateData();
+            // Backbone.Validation.bind( this,  {valid:this.hideError, invalid:this.showError});
+        },
+        events: {
+            'submit form': 'editAllowance'
+        },
+        loadTemplateData: function() {
+            var self = this;
+            $.ajax({url: self.template_url, dataType: 'html'})
+                .done(function(templateData) {
+                    self.template = _.template(templateData);
+                    self.render();
+                    self.showModal();
+                    self.updateCss();
+                });
+        },
+        updateCss: function() {
+            var $el = $(this.el);
+            $el.find('.modal-header').css({
+                color: '#1580b0',
+                'font-size': '20px',
+                'font-weight': '600',
+                'line-height': 'normal',
+                padding: '10px 15px',
+                'border-bottom': '1px solid #ccc'
+            });
+            $el.find('form').css({
+                padding: '15px'
+            });
+            $el.find('form table.compact td').css({
+                'vertical-align': 'middle',
+                padding: '4px 8px'
+            });
+            $el.find('form label').css({
+                display: 'block',
+                'font-size': '14px',
+                margin: 0,
+                cursor: 'default'
+            });
+            $el.find('form input[type="text"]').css({
+                height: '26px',
+                padding: '1px 8px 2px',
+                'font-size': '14px',
+                width: '100%'
+            });
+            $el.find('form input[type="submit"]').css({
+                'margin-top': '10px',
+                float: 'right'
+            });
+            $el.find('.error-message').css({
+                color: '#ff0000',
+                'line-height': 'normal',
+                'font-size': '14px'
+            });
+            $el.find('.error-response').css({
+                color: '#ff0000',
+                'line-height': 'normal',
+                'font-size': '14px',
+                padding: '0px 10px 5px 7px'
+            });
+        },
+        getAllowanceValue: function() {
+            return $('#allowance_value').val();
+        },
+        hideError: function(view, attr) {
+            var $element = view.$form[attr];
+
+            $element.removeClass('error');
+            $element.parent().find('.error-message').empty();
+        },
+        showError: function(view, attr, errorMessage) {
+            var $element = view.$form[attr];
+            var $errorMessage;
+
+            $element.addClass('error');
+            $errorMessage = $element.parent().find('.error-message');
+            if ($errorMessage.length === 0) {
+                $errorMessage = $("<div class='error-message'></div>");
+                $element.parent().append($errorMessage);
+            }
+
+            $errorMessage.empty().append(errorMessage);
+            this.updateCss();
+        },
+        editAllowance: function(event) {
+            var $errorResponse, formHasErrors, allowanceValue;
+            var self = this;
+            event.preventDefault();
+            $errorResponse = $('.error-response');
+            $errorResponse.html();
+            allowanceValue = this.getAllowanceValue();
+            formHasErrors = false;
+
+            if (allowanceValue === '') {
+                formHasErrors = true;
+                self.showError(self, 'allowance_value', gettext('Required field'));
+            } else {
+                self.hideError(self, 'allowance_value');
+            }
+
+            if (!formHasErrors) {
+                self.model.fetch({
+                    headers: {
+                        'X-CSRFToken': self.proctored_exam_allowance_view.getCSRFToken()
+                    },
+                    type: 'PUT',
+                    data: {
+                        exam_ids: this.selected_exam_ID,
+                        user_ids: this.selected_user,
+                        allowance_type: this.allowance_type,
+                        value: allowanceValue
+                    },
+                    success: function() {
+                        // fetch the allowances again.
+                        $errorResponse.html();
+                        self.proctored_exam_allowance_view.collection.url =
+                            self.proctored_exam_allowance_view.initial_url + self.course_id + '/allowance';
+                        self.proctored_exam_allowance_view.hydrate();
+                        self.hideModal();
+                    },
+                    error: function(unused, response) {
+                        var data = $.parseJSON(response.responseText);
+                        $errorResponse.html(gettext(data.detail));
+                    }
+                });
+            }
+        },
+        render: function() {
+            $(this.el).html(this.template({
+                selected_user: this.selected_user,
+                selected_exam_name: this.selected_exam_name,
+                allowance_type: this.allowance_type,
+                allowance_type_name: this.allowance_type_name
+            }));
+
+            this.$form = {
+                allowance_value: this.$('#allowance_value')
+            };
+            return this;
+        }
+    });
+}).call(this, Backbone, $, _, gettext);
diff --git a/edx_proctoring/static/proctoring/spec/proctored_exam_add_bulk_allowance_spec.js b/edx_proctoring/static/proctoring/spec/proctored_exam_add_bulk_allowance_spec.js
index ab51a804140..1e3f500c77d 100644
--- a/edx_proctoring/static/proctoring/spec/proctored_exam_add_bulk_allowance_spec.js
+++ b/edx_proctoring/static/proctoring/spec/proctored_exam_add_bulk_allowance_spec.js
@@ -88,7 +88,7 @@ describe('ProctoredExamAAllowanceView', function() {
         // from http://www.howtocreate.co.uk/tutorials/jsexamples/syntax/prepareInline.html
 
         // eslint-disable-next-line max-len
-        html = '<div class=\'modal-header\'><%- gettext("Add a New Allowance") %></div>\n<form>\n    <h3 class=\'error-response\'><h3>\n    <table class=\'compact\'>\n        <tr>\n            <td>\n                <label><%- gettext("Add Usernames or Emails seperated by commas") %></label>\n            </td>\n        </tr>\n        <tr>\n            <td>\n                <input type="text" id="user_info" />\n            </td>\n        </tr>\n        <tr>\n            <td>\n                <label><%- gettext("Select Exam Type") %></label>\n            </td>\n        </tr>\n        <tr>\n            <td>\n                <select id="exam_type">\n                    <option value="proctored_exam">\n                        <%- gettext("Proctored Exam") %>\n                    </option>\n                    <option value="timed_exam">\n                        <%- gettext("Timed Exam") %>\n                    </option>\n                </select>\n            </td>\n        </tr>\n        <tr>\n            <td>\n                <label><%- gettext("Select Exams") %></label>\n            </td>\n        </tr>\n        <tr>\n            <td>\n                <select multiple id=\'proctored_exam\' class="exam_dropdown">\n                    <option hidden selected value=default> <%- gettext("Choose Exams Below") %> </option>\n                    <% _.each(proctored_exams, function(proctored_exam){ %>\n                    <option value="<%= proctored_exam.id  %>">\n                    <%- interpolate(gettext(\' %(exam_display_name)s \'), { exam_display_name: proctored_exam.exam_name }, true) %>\n                    </option>\n                    <% }); %>\n                </select>\n                <select multiple id=\'timed_exam\' class="exam_dropdown" style="display:none;">\n                    <option hidden selected value=default> <%- gettext("Choose Exams Below") %> </option>\n                    <% _.each(timed_exams, function(timed_exam){ %>\n                    <option value="<%= timed_exam.id  %>">\n                    <%- interpolate(gettext(\' %(exam_display_name)s \'), { exam_display_name: timed_exam.exam_name }, true) %>\n                    </option>\n                    <% }); %>\n                </select>\n            </td>\n        </tr>\n        <tr>\n            <td colspan="3">\n                <div id="selected_exams" ></div>\n            </td>\n        </tr>\n        <tr>\n            <td>\n                <label><%- gettext("Allowance Type") %></label>\n            </td>\n        </tr>\n        <tr>\n            <td>\n                <select id="allowance_type">\n                    <% _.each(allowance_types, function(allowance_type){ %>\n                    <option value="<%= allowance_type[0] %>">\n                        <%= allowance_type[1] %>\n                    </option>\n                    <% }); %>\n                </select>\n            </td>\n        </tr>\n        <tr>\n            <td>\n                <label id=\'allowance_value_label\'><%- gettext("Input Additional Minutes as a Positive Number") %></label>\n            </td>\n        </tr>\n        <tr>\n            <td>\n                <input type="text" id="allowance_value" />\n            </td>\n        </tr>\n        <tr>\n            <td>\n                <input id=\'addNewAllowance\' type=\'submit\' value=\'Create Allowance\' />\n            </td>\n        </tr>\n    </table>\n</form>';
+        html = '<div class=\'modal-header\'><%- gettext("Add a New Allowance") %></div>\n<form>\n    <h3 class=\'error-response\'><h3>\n    <table class=\'compact\'>\n        <tr>\n            <td>\n                <label><%- gettext("Add Usernames or Emails seperated by commas") %></label>\n            </td>\n        </tr>\n        <tr>\n            <td>\n                <input type="text" id="user_info" />\n            </td>\n        </tr>\n        <tr>\n            <td>\n                <label><%- gettext("Select Exam Type") %></label>\n            </td>\n        </tr>\n        <tr>\n            <td>\n                <select id="exam_type">\n                    <option value="proctored_exam">\n                        <%- gettext("Proctored Exam") %>\n                    </option>\n                    <option value="timed_exam">\n                        <%- gettext("Timed Exam") %>\n                    </option>\n                </select>\n            </td>\n        </tr>\n        <tr>\n            <td>\n                <label><%- gettext("Select Exams") %></label>\n            </td>\n        </tr>\n        <tr>\n            <td>\n                <select multiple id=\'proctored_exam\' class="exam_dropdown">\n                    <option hidden selected value=default> <%- gettext("Choose Exams Below") %> </option>\n                    <% _.each(proctored_exams, function(proctored_exam){ %>\n                    <option value="<%= proctored_exam.id  %>">\n                    <%- interpolate(gettext(\' %(exam_display_name)s \'), { exam_display_name: proctored_exam.exam_name }, true) %>\n                    </option>\n                    <% }); %>\n                </select>\n                <select multiple id=\'timed_exam\' class="exam_dropdown" style="display:none;">\n                    <option hidden selected value=default> <%- gettext("Choose Exams Below") %> </option>\n                    <% _.each(timed_exams, function(timed_exam){ %>\n                    <option value="<%= timed_exam.id  %>">\n                    <%- interpolate(gettext(\' %(exam_display_name)s \'), { exam_display_name: timed_exam.exam_name }, true) %>\n                    </option>\n                    <% }); %>\n                </select>\n            </td>\n        </tr>\n        <tr>\n            <td colspan="3">\n                <div id="selected_exams" ></div>\n            </td>\n        </tr>\n        <tr>\n            <td>\n                <label><%- gettext("Allowance Type") %></label>\n            </td>\n        </tr>\n        <tr>\n            <td>\n                <select id="allowance_type">\n                    <% _.each(allowance_types, function(allowance_type){ %>\n                    <option value="<%= allowance_type[0] %>">\n                        <%= allowance_type[1] %>\n                    </option>\n                    <% }); %>\n                </select>\n            </td>\n        </tr>\n        <tr>\n            <td>\n                <label id=\'allowance_value_label\'><%- gettext("Add Time(Minutes)") %></label>\n            </td>\n        </tr>\n        <tr>\n            <td>\n                <input type="text" id="allowance_value" />\n            </td>\n        </tr>\n        <tr>\n            <td>\n                <input id=\'addNewAllowance\' type=\'submit\' value=\'Create Allowance\' />\n            </td>\n        </tr>\n    </table>\n</form>\n';
 
         allowancesHtml = '<span class="tip">' +
             '<%- gettext("Allowances") %>' +
diff --git a/edx_proctoring/static/proctoring/spec/proctored_exam_bulk_allowance_spec.js b/edx_proctoring/static/proctoring/spec/proctored_exam_bulk_allowance_spec.js
index 4d2f217cdcb..f71117d669e 100644
--- a/edx_proctoring/static/proctoring/spec/proctored_exam_bulk_allowance_spec.js
+++ b/edx_proctoring/static/proctoring/spec/proctored_exam_bulk_allowance_spec.js
@@ -29,7 +29,7 @@ describe('ProctoredExamAllowanceView', function() {
 
     beforeEach(function() {
         // eslint-disable-next-line max-len
-        html = '<span class="tip"> <%- gettext("Allowances") %>\n    <span>\n        <a id="add-allowance" href="#"  class="add blue-button">+ <%- gettext("Add Allowance") %></a>\n    </span>\n</span>\n<% var is_allowances = proctored_exam_allowances.length !== 0 %>\n<% if (is_allowances) { %>\n\n<div class="wrapper-content wrapper">\n   <section class="content exam-allowances-content">\n            <% _.each(proctored_exam_allowances, function(student){ %>\n                <div class="accordion-trigger" aria-expanded="false" style="font-size:20px;">\n                    <span class="fa fa-chevron-right" aria-hidden="true"></span>\n                    <%=student[0].user.username %>\n                </div>\n                <table class="allowance-table" id="<%=student[0].user.username %>" style="display:none;">\n                    <tbody>\n                        <tr class="allowance-headings">\n                            <th class="exam-name"><%- gettext("Exam Name") %></th>\n                            <th class="email"><%- gettext("Email") %></th>\n                            <th class="allowance-name"><%- gettext("Allowance Type") %> </th>\n                            <th class="allowance-value"><%- gettext("Allowance Value") %></th>\n                            <th class="c_action"><%- gettext("Actions") %> </th>\n                        </tr>\n                    <% _.each(student, function(proctored_exam_allowance){ %>\n                            <% var key = proctored_exam_allowance.key; %>\n                            <% for (i = 0; i < allowance_types.length; i += 1) { %>\n                                <% if (key === allowance_types[i][0]) { %>\n                                    <% proctored_exam_allowance.key_display_name = allowance_types[i][1]; %>\n                                    <% break; %>\n                                <% }} %>\n                            <% if (!proctored_exam_allowance.key_display_name) { %>\n                                <% proctored_exam_allowance.key_display_name = key;} %>\n                        <tr class="allowance-items">\n                            <td>\n                            <%- proctored_exam_allowance.proctored_exam.exam_name %>\n                            </td>\n                            <td>\n                            <% if (proctored_exam_allowance.user){ %>\n                            <%= proctored_exam_allowance.user.email %>\n                            </td>\n                            <% }else{ %>\n                                <td>N/A</td>\n                                <td>N/A</td>\n                            <% } %>\n                            <td>\n                            <%= proctored_exam_allowance.key_display_name %>\n                            </td>\n                        <td>\n                            <%- proctored_exam_allowance.value %></td>\n                        <td>\n                        <a data-exam-id="<%= proctored_exam_allowance.proctored_exam.id %>"\n                            data-key-name="<%= proctored_exam_allowance.key %>"\n                            data-user-id="<%= proctored_exam_allowance.user.id %>"\n                        class="remove_allowance" href="#">[x]</a>\n                        </td>\n                        </tr>\n                    <% }); %>\n                    </tbody>\n                </table>\n            <% }); %>\n   </section>\n</div>\n<% } %>\n';
+        html = '<span class="tip"> <%- gettext("Allowances") %>\n    <span>\n        <a id="add-allowance" href="#"  class="add blue-button">+ <%- gettext("Add Allowance") %></a>\n    </span>\n</span>\n<% var is_allowances = proctored_exam_allowances.length !== 0 %>\n<% if (is_allowances) { %>\n\n<div class="wrapper-content wrapper">\n   <section class="content exam-allowances-content">\n            <% _.each(proctored_exam_allowances, function(student){ %>\n                <div class="accordion-trigger" aria-expanded="false" style="font-size:20px;">\n                    <span class="fa fa-chevron-down" aria-hidden="true"></span>\n                    <%=student[0].user.username %>\n                </div>\n                <table class="allowance-table" id="<%=student[0].user.username %>" style="display:none;">\n                    <tbody>\n                        <tr class="allowance-headings">\n                            <th class="exam-name"><%- gettext("Exam Name") %></th>\n                            <th class="email"><%- gettext("Email") %></th>\n                            <th class="allowance-name"><%- gettext("Allowance Type") %> </th>\n                            <th class="allowance-value"><%- gettext("Allowance Value") %></th>\n                            <th class="c_action"><%- gettext("Actions") %> </th>\n                        </tr>\n                    <% _.each(student, function(proctored_exam_allowance){ %>\n                            <% var key = proctored_exam_allowance.key; %>\n                            <% for (i = 0; i < allowance_types.length; i += 1) { %>\n                                <% if (key === allowance_types[i][0]) { %>\n                                    <% proctored_exam_allowance.key_display_name = allowance_types[i][1]; %>\n                                    <% break; %>\n                                <% }} %>\n                            <% if (!proctored_exam_allowance.key_display_name) { %>\n                                <% proctored_exam_allowance.key_display_name = key;} %>\n                        <tr class="allowance-items">\n                            <td>\n                            <%- proctored_exam_allowance.proctored_exam.exam_name %>\n                            </td>\n                            <td>\n                            <% if (proctored_exam_allowance.user){ %>\n                            <%= proctored_exam_allowance.user.email %>\n                            </td>\n                            <% }else{ %>\n                                <td>N/A</td>\n                                <td>N/A</td>\n                            <% } %>\n                            <td>\n                            <%= proctored_exam_allowance.key_display_name %>\n                            </td>\n                        <td>\n                            <%- proctored_exam_allowance.value %></td>\n                        <td>\n                        <a data-exam-id="<%= proctored_exam_allowance.proctored_exam.id %>"\n                            data-key-name="<%= proctored_exam_allowance.key %>"\n                            data-key-value="<%= proctored_exam_allowance.key_display_name %>"\n                            data-user-name="<%= proctored_exam_allowance.user.username %>"\n                            data-exam-name="<%= proctored_exam_allowance.proctored_exam.exam_name %>"\n                        class="edit_allowance" href="#">Edit</a>\n                        <a data-exam-id="<%= proctored_exam_allowance.proctored_exam.id %>"\n                            data-key-name="<%= proctored_exam_allowance.key %>"\n                            data-user-id="<%= proctored_exam_allowance.user.id %>"\n                        class="remove_allowance" href="#">Delete</a>\n                        </td>\n                        </tr>\n                    <% }); %>\n                    </tbody>\n                </table>\n            <% }); %>\n   </section>\n</div>\n<% } %>\n';
         this.server = sinon.fakeServer.create();
         this.server.autoRespond = true;
         setFixtures('<div class="special-allowance-container" data-course-id="test_course_id"' +
diff --git a/edx_proctoring/static/proctoring/templates/add-new-bulk-allowance.underscore b/edx_proctoring/static/proctoring/templates/add-new-bulk-allowance.underscore
index 74dbb238c83..9173754fa2f 100644
--- a/edx_proctoring/static/proctoring/templates/add-new-bulk-allowance.underscore
+++ b/edx_proctoring/static/proctoring/templates/add-new-bulk-allowance.underscore
@@ -88,7 +88,7 @@
         </tr>
         <tr>
             <td>
-                <label id='allowance_value_label'><%- gettext("Input Additional Minutes as a Positive Number") %></label>
+                <label id='allowance_value_label'><%- gettext("Add Time(Minutes)") %></label>
             </td>
         </tr>
         <tr>
diff --git a/edx_proctoring/static/proctoring/templates/course_grouped_allowances.underscore b/edx_proctoring/static/proctoring/templates/course_grouped_allowances.underscore
index d0333ba9cb0..a58bfb84eac 100644
--- a/edx_proctoring/static/proctoring/templates/course_grouped_allowances.underscore
+++ b/edx_proctoring/static/proctoring/templates/course_grouped_allowances.underscore
@@ -10,7 +10,7 @@
    <section class="content exam-allowances-content">
             <% _.each(proctored_exam_allowances, function(student){ %>
                 <div class="accordion-trigger" aria-expanded="false" style="font-size:20px;">
-                    <span class="fa fa-chevron-right" aria-hidden="true"></span>
+                    <span class="fa fa-chevron-down" aria-hidden="true"></span>
                     <%=student[0].user.username %>
                 </div>
                 <table class="allowance-table" id="<%=student[0].user.username %>" style="display:none;">
@@ -49,10 +49,16 @@
                         <td>
                             <%- proctored_exam_allowance.value %></td>
                         <td>
+                        <a data-exam-id="<%= proctored_exam_allowance.proctored_exam.id %>"
+                            data-key-name="<%= proctored_exam_allowance.key %>"
+                            data-key-value="<%= proctored_exam_allowance.key_display_name %>"
+                            data-user-name="<%= proctored_exam_allowance.user.username %>"
+                            data-exam-name="<%= proctored_exam_allowance.proctored_exam.exam_name %>"
+                        class="edit_allowance" href="#">Edit</a>
                         <a data-exam-id="<%= proctored_exam_allowance.proctored_exam.id %>"
                             data-key-name="<%= proctored_exam_allowance.key %>"
                             data-user-id="<%= proctored_exam_allowance.user.id %>"
-                        class="remove_allowance" href="#">[x]</a>
+                        class="remove_allowance" href="#">Delete</a>
                         </td>
                         </tr>
                     <% }); %>
diff --git a/edx_proctoring/static/proctoring/templates/edit-allowance.underscore b/edx_proctoring/static/proctoring/templates/edit-allowance.underscore
new file mode 100644
index 00000000000..d1ad44e5443
--- /dev/null
+++ b/edx_proctoring/static/proctoring/templates/edit-allowance.underscore
@@ -0,0 +1,52 @@
+<div class='modal-header'><%- gettext("Edit Allowance") %></div>
+<form>
+    <h3 class='error-response'><h3>
+    <table class='compact'>
+        <tr>
+            <td>
+                <label><%- gettext("Username") %></label>
+            </td>
+            <td>
+                <label> <%= selected_user %> </label>
+            </td>
+        </tr>
+        <tr>
+            <td>
+                <label><%- gettext("Special Exam") %></label>
+            </td>
+            <td>
+                <label>
+                    <%= selected_exam_name %>
+                </label>
+            </td>
+        </tr>
+        <tr>
+            <td>
+                <label><%- gettext("Allowance Type") %></label>
+            </td>
+            <td>
+                <label>
+                    <%= allowance_type_name %>
+                </label>
+            </td>
+        </tr>
+        <tr>
+            <td>
+                <% if (allowance_type == 'additional_time_granted') { %>
+                    <label id='allowance_value_label'><%- gettext("Add Time(Minutes)") %></label>
+                <% }else{ %>
+                    <label id='allowance_value_label'><%- gettext("Add Policy Exception") %></label>
+                <% } %>
+            </td>
+            <td>
+                <input type="text" id="allowance_value" />
+            </td>
+        </tr>
+        <tr>
+            <td></td>
+            <td>
+                <input id='editAllowance' type='submit' value='Save' />
+            </td>
+        </tr>
+    </table>
+</form>
diff --git a/package.json b/package.json
index e618cb6e599..1084458ef08 100644
--- a/package.json
+++ b/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@edx/edx-proctoring",
   "//": "Note that the version format is slightly different than that of the Python version when using prereleases.",
-  "version": "3.22.0",
+  "version": "3.22.1",
   "main": "edx_proctoring/static/index.js",
   "scripts": {
     "test": "gulp test"