diff --git a/web/app/components/document/sidebar.hbs b/web/app/components/document/sidebar.hbs
index f0498f3cb..bf45601d3 100644
--- a/web/app/components/document/sidebar.hbs
+++ b/web/app/components/document/sidebar.hbs
@@ -318,7 +318,7 @@
                   <p
                     class="hds-typography-body-200 hds-font-weight-medium hds-foreground-primary"
                   >
-                    {{dateformat @document.dueDate}}</p>
+                    {{dateformat this.dueDate}}</p>
                 {{else}}
                   <p
                     class="hds-typography-body-200 hds-font-weight-medium hds-foreground-faint"
@@ -330,7 +330,9 @@
                 <Hds::Form::TextInput::Field
                   id="user-question"
                   @type="date"
-                  @value={{F.value}}
+                  @renderInPlace={{true}}
+                  @value={{this.dueDate}}
+                  {{on "change" this.updateDueDate}}
                   {{on "blur" F.update}}
                   as |F|
                 />
@@ -597,41 +599,14 @@
           </Hds::Form::Field>
           <Hds::Form::Field @layout="vertical" as |F|>
             <F.Control>
-              {{#if this.editingIsDisabled}}
-                <p
-                  class="hds-typography-body-200 hds-font-weight-medium hds-foreground-primary"
-                >{{dateformat @document.dueDate}}</p>
-              {{else}}
-                <EditableField
-                  @value={{@document.dueDate}}
-                  @onChange={{perform this.updateDueDate}}
-                  @loading={{this.save.isRunning}}
-                  @disabled={{this.editingIsDisabled}}
-                >
-                  <:default>
-                    {{#unless (is-empty @document.dueDate)}}
-                      <p
-                        class="hds-typography-body-200 hds-font-weight-medium hds-foreground-primary"
-                      >
-                        {{dateformat @document.dueDate}}</p>
-                    {{else}}
-                      <p
-                        class="hds-typography-body-200 hds-font-weight-medium hds-foreground-faint"
-                      >
-                        Enter due date here</p>
-                    {{/unless}}
-                  </:default>
-                  <:editing as |F|>
-                    <Hds::Form::TextInput::Field
-                      id="user-question"
-                      @type="date"
-                      @value={{F.value}}
-                      {{on "blur" F.update}}
-                      as |F|
-                    />
-                  </:editing>
-                </EditableField>
-              {{/if}}
+              <Hds::Form::TextInput::Field
+                id="user-question"
+                @type="date"
+                @renderInPlace={{true}}
+                @value={{this.dueDate}}
+                {{on "change" this.updateDueDate}}
+                @disabled={{M.taskIsRunning}}
+              />
             </F.Control>
             <F.Label>Add Due Date <Hds::Badge @text="Required" /></F.Label>
           </Hds::Form::Field>
diff --git a/web/app/components/document/sidebar.ts b/web/app/components/document/sidebar.ts
index db74cc39c..bcce9512f 100644
--- a/web/app/components/document/sidebar.ts
+++ b/web/app/components/document/sidebar.ts
@@ -265,11 +265,11 @@ export default class DocumentSidebarComponent extends Component<DocumentSidebarC
     await this.save.perform("project", this.project);
   });
 
-  updateDueDate = task(async (date: string) => {
-    this.dueDate = date;
-    await this.save.perform("dueDate", this.dueDate);
-    // productAbbreviation is computed by the back end
-  });
+  // updateDueDate = task(async (date: string) => {
+  //   this.dueDate = date;
+  //   await this.save.perform("dueDate", this.dueDate);
+  //   // productAbbreviation is computed by the back end
+  // });
 
   isAllReviewersReviewed(
     reviewedReviewers: string[],
@@ -527,6 +527,7 @@ export default class DocumentSidebarComponent extends Component<DocumentSidebarC
         // Update reviewers.
         await this.patchDocument.perform({
           reviewers: this.reviewers.compact().mapBy("email"),
+          dueDate: this.dueDate,
         });
         await this.fetchSvc.fetch(`/api/v1/reviews/${this.docID}`, {
           method: "POST",
@@ -566,6 +567,14 @@ export default class DocumentSidebarComponent extends Component<DocumentSidebarC
   updateReviewers(reviewers: HermesUser[]) {
     this.reviewers = reviewers;
   }
+  @action
+  updateDueDate(event:Event) {
+    const target = event.target as HTMLInputElement;
+    // Get the selected date value from the input field
+    const dueDate = target.value;
+    // Update the dueDate property in the component
+    this.dueDate = dueDate;
+  }
 
   @action
   updateContributors(contributors: HermesUser[]) {