diff --git a/app/assets/stylesheets/base/variables.scss b/app/assets/stylesheets/base/variables.scss
index ab60d692c9..3aee370434 100644
--- a/app/assets/stylesheets/base/variables.scss
+++ b/app/assets/stylesheets/base/variables.scss
@@ -5,3 +5,9 @@ $red: #dc3545;
 $sidebar-inactive: #9AA4CA;
 $sidebar-active: #365CF5;
 $sidebar-dark: #1A2142;
+
+:root {
+  --dark: #262d3f; 
+  --gray: #5d657b;
+  --silver: #D9D9D9;
+}
diff --git a/app/assets/stylesheets/pages/casa_cases.scss b/app/assets/stylesheets/pages/casa_cases.scss
index 69ed2d9131..844301019c 100644
--- a/app/assets/stylesheets/pages/casa_cases.scss
+++ b/app/assets/stylesheets/pages/casa_cases.scss
@@ -113,3 +113,52 @@ body.casa_cases-show {
     display: block;
   }
 }
+
+#generate-docx-report-modal {
+  .dates-container {
+    display: flex;
+  }
+
+  .docx-report__modal-body {
+    display: flex;
+    flex-direction: column;
+    row-gap: 1rem;
+
+  }
+
+  .modal-footer {
+    [data-bs-dismiss="modal"] {
+      padding-block: 11px;
+    }
+  }
+}
+
+.generate-report-button {
+  display: flex;
+  flex-direction: row;
+  width: 100%;
+  border: solid 1px var(--silver);
+  padding: 1.2rem;
+  column-gap: 1.2rem;
+
+  &:hover {
+    border-color: black;
+  }
+
+  svg {
+    min-inline-size: 40px;
+    width: 40px;
+    height: auto;
+  }
+
+  div {
+    text-align: left;
+    h3 {
+      margin-block-end: .25rem;
+
+    }
+    p {
+
+    }
+  }
+}
diff --git a/app/assets/stylesheets/pages/case_court_reports.scss b/app/assets/stylesheets/pages/case_court_reports.scss
new file mode 100644
index 0000000000..e69de29bb2
diff --git a/app/assets/stylesheets/shared/typography.scss b/app/assets/stylesheets/shared/typography.scss
index fc5b781712..7a5ec90bb8 100644
--- a/app/assets/stylesheets/shared/typography.scss
+++ b/app/assets/stylesheets/shared/typography.scss
@@ -1,4 +1,5 @@
 // TODO check in css so tests can run without internet
+@use "../base/variables.scss" as globals;
 @import url(https://fonts.googleapis.com/css?family=Montserrat:400,700);
 
 body {
@@ -13,12 +14,16 @@ option {
   font-family: Inter;
   font-size: 16px;
   font-weight: 500;
+  line-height: 19px;
+  color: var(--dark);
 }
 
 .content-2 {
   font-family: Inter;
   font-size: 14px;
   font-weight: 500;
+  line-height: 22px;
+  color: var(--gray)
 }
 
 .content-3 {
diff --git a/app/components/modal/footer_component.html.erb b/app/components/modal/footer_component.html.erb
index 21320bd957..9675f4715a 100644
--- a/app/components/modal/footer_component.html.erb
+++ b/app/components/modal/footer_component.html.erb
@@ -1,4 +1,4 @@
 <div class="modal-footer <%= @class %>">
-  <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
+  <button type="button" class="btn btn-sm btn-secondary" data-bs-dismiss="modal">Close</button>
   <%= content %>
 </div>
diff --git a/app/components/modal/open_button_component.html.erb b/app/components/modal/open_button_component.html.erb
index e210fdaf8e..dfc1410b7b 100644
--- a/app/components/modal/open_button_component.html.erb
+++ b/app/components/modal/open_button_component.html.erb
@@ -1,4 +1,4 @@
-<button type="button" class="btn <%= @class %>" data-bs-toggle="modal" data-bs-target="<%= "##{@target}" %>">
+<button type="button" class="<%= @class %>" data-bs-toggle="modal" data-bs-target="<%= "##{@target}" %>">
   <% if @icon %>
     <i class="lni mr-10 lni-<%= @icon %>"></i>
   <% end %>
diff --git a/app/controllers/case_court_reports_controller.rb b/app/controllers/case_court_reports_controller.rb
index 54dc3df401..6338ad8283 100644
--- a/app/controllers/case_court_reports_controller.rb
+++ b/app/controllers/case_court_reports_controller.rb
@@ -28,11 +28,12 @@ def show
 
   def generate
     authorize CaseCourtReport
-    casa_case = CasaCase.find_by(case_params)
+    casa_case = CasaCase.find_by(case_number: case_params[:case_number])
+
     respond_to do |format|
       format.json do
         if casa_case
-          report_data = generate_report_to_string(casa_case, params[:time_zone])
+          report_data = generate_report_to_string(casa_case, date_range_params)
           save_report(report_data, casa_case)
 
           render json: {link: case_court_report_path(casa_case.case_number, format: "docx"), status: :ok}
@@ -53,6 +54,10 @@ def generate
 
   private
 
+  def date_range_params
+    params.permit(:time_zone, case_court_report: %i[start_date end_date])
+  end
+
   def case_params
     params.require(:case_court_report).permit(:case_number)
   end
@@ -69,7 +74,7 @@ def assigned_cases
     end
   end
 
-  def generate_report_to_string(casa_case, time_zone)
+  def generate_report_to_string(casa_case, time_range)
     return unless casa_case
 
     casa_case.casa_org.open_org_court_report_template do |template_docx_file|
@@ -77,7 +82,9 @@ def generate_report_to_string(casa_case, time_zone)
         volunteer_id: current_user.volunteer? ? current_user.id : casa_case.assigned_volunteers.first&.id,
         case_id: casa_case.id,
         path_to_template: template_docx_file.to_path,
-        time_zone: time_zone
+        time_zone: time_range[:time_zone],
+        start_date: time_range[:case_court_report][:start_date],
+        end_date: time_range[:case_court_report][:end_date]
       }
       context = CaseCourtReportContext.new(args).context
       court_report = CaseCourtReport.new(path_to_template: template_docx_file.to_path, context: context)
diff --git a/app/javascript/src/casa_case.js b/app/javascript/src/casa_case.js
index 3a8859e2fa..d0c39a679b 100644
--- a/app/javascript/src/casa_case.js
+++ b/app/javascript/src/casa_case.js
@@ -56,20 +56,24 @@ function copyOrdersFromCaseAction (id, caseNumber) {
 }
 
 function showBtn (el) {
+  if (!el) return
   el.classList.remove('d-none')
 }
 
 function hideBtn (el) {
+  if (!el) return
   el.classList.add('d-none')
 }
 
 function disableBtn (el) {
+  if (!el) return
   el.disabled = true
   el.classList.add('disabled')
   el.setAttribute('aria-disabled', true)
 }
 
 function enableBtn (el) {
+  if (!el) return
   el.disabled = false
   el.classList.remove('disabled')
   el.removeAttribute('aria-disabled')
@@ -101,6 +105,7 @@ function handleGenerateReport (e) {
     body: JSON.stringify(formData)
   }
   showBtn(spinner)
+  hideBtn($('#btnGenerateReport .lni-download')[0])
   window.fetch(url, options)
     .then(response => {
       return response.json()
@@ -113,6 +118,7 @@ function handleGenerateReport (e) {
         return
       }
       hideBtn(spinner)
+      showBtn($('#btnGenerateReport .lni-download')[0])
       enableBtn(generateBtn)
       window.open(data.link, '_blank')
     })
diff --git a/app/models/case_court_report_context.rb b/app/models/case_court_report_context.rb
index 9d10bb1637..2868cd4557 100644
--- a/app/models/case_court_report_context.rb
+++ b/app/models/case_court_report_context.rb
@@ -3,7 +3,7 @@
 require "date"
 
 class CaseCourtReportContext
-  attr_reader :report_path, :template
+  attr_reader :report_path, :template, :date_range
 
   def initialize(args = {})
     @casa_case = CasaCase.friendly.find(args[:case_id])
@@ -12,6 +12,7 @@ def initialize(args = {})
     @path_to_template = args[:path_to_template]
     @court_date = args[:court_date] || @casa_case.next_court_date
     @case_court_orders = args[:case_court_orders] || @casa_case.case_court_orders
+    @date_range = calculate_date_range(args)
   end
 
   def context
@@ -35,8 +36,7 @@ def context
   #   - :dates [Array<String>]
   #   - :dates_by_medium_type [Array<String>]
   def case_contacts
-    cccts = CaseContactContactType.includes(:case_contact, :contact_type).where("case_contacts.casa_case_id": @casa_case.id)
-    interviewees = filter_out_old_case_contacts(cccts)
+    interviewees = filtered_interviewees
     return [] unless interviewees.size.positive?
 
     CaseContactsContactDates.new(interviewees).contact_dates_details
@@ -56,13 +56,11 @@ def case_orders(orders)
     end
   end
 
-  def filter_out_old_case_contacts(interviewees)
-    most_recent_court_date = @casa_case.most_recent_past_court_date&.date
-    if most_recent_court_date
-      interviewees.where("occurred_at >= ?", most_recent_court_date)
-    else
-      interviewees
-    end
+  def filtered_interviewees
+    # this query is slow
+    CaseContactContactType.includes(:case_contact, :contact_type)
+      .where("case_contacts.casa_case_id": @casa_case.id)
+      .where("case_contacts.occurred_at": @date_range)
   end
 
   def case_details
@@ -89,4 +87,17 @@ def org_address(path_to_template)
     is_default_template = path_to_template.end_with?("default_report_template.docx")
     @volunteer.casa_org.address if @volunteer && is_default_template
   end
+
+  private
+
+  def calculate_date_range(args)
+    zone = args[:time_zone] ? ActiveSupport::TimeZone.new(args[:time_zone]) : Time.zone
+
+    start_date = @casa_case.most_recent_past_court_date&.date&.in_time_zone(zone)
+    start_date = zone.parse(args[:start_date]) if args[:start_date]&.present?
+
+    end_date = args[:end_date]&.present? ? zone.parse(args[:end_date]) : nil
+
+    start_date..end_date
+  end
 end
diff --git a/app/views/casa_cases/_generate_report_modal.html.erb b/app/views/casa_cases/_generate_report_modal.html.erb
new file mode 100644
index 0000000000..170aaa8c1e
--- /dev/null
+++ b/app/views/casa_cases/_generate_report_modal.html.erb
@@ -0,0 +1,56 @@
+<%= form_with url: generate_case_court_reports_path, local: false do |form| %>
+  <% id = "generate-docx-report-modal" %>
+  <%= render(Modal::OpenButtonComponent.new(
+    target: id, 
+    klass: "d-inline main-btn btn-hover btn-sm success-btn pull-right mb-2")) do %>
+    Generate Report
+  <% end %>
+  <%= render(Modal::GroupComponent.new(id: id)) do |component| %>
+    <% component.with_header(text: "Download Court Report as a .docx", id: id, klass: "content-1") %>
+    <% component.with_body do %>
+      <div class="docx-report__modal-body">
+      <p class="content-3 md-10">
+      To download a court report specify the date range.
+      </p>
+      <div class="input-style-1" id="case_select_body">
+        <%= form.hidden_field :case_number, value: @casa_case.case_number %>
+        <%= form.hidden_field :time_zone, id: "user-time-zone" %>
+        <h4 class="mb-10">Casa Case:</h4>
+        <p><%= @casa_case.decorate.court_report_select_option.first %></p>
+      </div>
+      <div class="dates-container">
+        <div class="field form-group mb-20">
+          <h6><label class="form-label" for="start_date">Starting From</label></h6>
+          <%= form.text_field :start_date,
+            value: Time.zone.now.strftime(::DateHelper::RUBY_MONTH_DAY_YEAR_FORMAT),
+            data: { provide: "datepicker",
+                    date_format: ::DateHelper::JQUERY_MONTH_DAY_YEAR_FORMAT },
+                    class: "form-control" %>
+        </div>
+
+        <div class="field form-group mb-20">
+          <h6><label class="form-label" for="end_date">Ending At</label></h6>
+          <%= form.text_field :end_date,
+            value: Time.zone.now.strftime(::DateHelper::RUBY_MONTH_DAY_YEAR_FORMAT),
+            data: { provide: "datepicker",
+                    date_format: ::DateHelper::JQUERY_MONTH_DAY_YEAR_FORMAT },
+                    class: "form-control" %>
+        </div>
+      </div>
+      </div>
+    <% end %>
+    <% component.with_footer do %>
+        <%= button_tag type: :submit,
+          data: {
+            button_name: "Generate Report"
+          },
+          id: "btnGenerateReport",
+          class: "main-btn primary-btn btn-hover btn-sm",
+          onclick: "setTimeZone()" do %>
+          <i class="lni lni-download mr-10"></i>
+          <i id="spinner" class='fas fa-spin d-none mr-10'>⏳</i>
+          Generate Report
+        <% end %>
+    <% end %>
+  <% end %>
+<% end %>
diff --git a/app/views/casa_cases/show.html.erb b/app/views/casa_cases/show.html.erb
index f18c2d1e4d..a95e2b51fb 100644
--- a/app/views/casa_cases/show.html.erb
+++ b/app/views/casa_cases/show.html.erb
@@ -23,14 +23,7 @@
                                       margin: false) %>
       <% end %>
     <% end %>
-    <%= form_with url: generate_case_court_reports_path, local: false, class: "d-inline" do |form| %>
-      <%= form.hidden_field :case_number, value: @casa_case.case_number %>
-      <%= button_tag "Generate Report", type: :submit,
-                     data: {button_name: "Generate Report"},
-                     id: "btnGenerateReport",
-                     class: "main-btn success-btn btn-hover btn-sm pull-right mb-2" %>
-      <i id="spinner" class='fas fa-spin d-none pull-right'>⏳</i>
-    <% end %>
+    <%= render "casa_cases/generate_report_modal" %>
     <% if @casa_case.casa_org.show_fund_request %>
       <%= link_to("New Fund Request", new_casa_case_fund_request_path(@casa_case),
 class: "btn btn-primary pull-left casa-case-button") %>
@@ -156,4 +149,39 @@ class: "btn btn-primary pull-left casa-case-button") %>
       window.localStorage.removeItem('casa-contact-form')
     }
   });
+  const ELEMENTS = {
+    'caseSelect': '#case-selection',
+    'generateBtn': '#btnGenerateReport',
+  }
+  const showBtn = el => el.classList.remove('d-none')
+  const enableBtn = (el) => {
+    el.disabled = false
+    el.classList.remove('disabled')
+    el.removeAttribute('aria-disabled')
+  }
+
+  const handleSelect = (e) => {
+    const selectEl = e.target
+    const generateBtn = selectEl.form.querySelector(ELEMENTS.generateBtn)
+
+    // when selecting a case, reset buttons to initial state
+    enableBtn(generateBtn)
+    showBtn(generateBtn)
+  }
+
+  const bindElements = () => {
+    const caseSelectEl = document.querySelector(ELEMENTS.caseSelect)
+
+    if (caseSelectEl)
+      caseSelectEl.addEventListener('change', handleSelect)
+  }
+
+  const setTimeZone = () => {
+    const timeZone = Intl.DateTimeFormat().resolvedOptions().timeZone
+    document.getElementById("user-time-zone").value = timeZone
+  }
+
+  window.onload = function () {
+    bindElements()
+  }
 </script>
diff --git a/app/views/case_court_reports/_generate_docx.html.erb b/app/views/case_court_reports/_generate_docx.html.erb
new file mode 100644
index 0000000000..87d3ffc1f7
--- /dev/null
+++ b/app/views/case_court_reports/_generate_docx.html.erb
@@ -0,0 +1,75 @@
+<%= form_with url: generate_case_court_reports_path, local: false do |form| %>
+  <% id = "generate-docx-report-modal" %>
+  <%= render(Modal::OpenButtonComponent.new(target: id, klass: "btn generate-report-button")) do %>
+    <svg viewBox="0 0 40 50" fill="none" xmlns="http://www.w3.org/2000/svg">
+      <title>Word Document Logo</title>
+      <path d="M25 0H5C3.67392 0 2.40215 0.526784 1.46447 1.46447C0.526784 2.40215 0 3.67392 0 5V45C0 46.3261 0.526784 47.5979 1.46447 48.5355C2.40215 49.4732 3.67392 50 5 50H35C36.3261 50 37.5979 49.4732 38.5355 48.5355C39.4732 47.5979 40 46.3261 40 45V15L25 0ZM28 45H24.5L20 28L15.5 45H12L6.5 22.5H10.25L13.75 39.5L18.25 22.5H21.5L26 39.5L29.5 22.5H33.25L28 45ZM22.5 17.5V3.75L36.25 17.5H22.5Z" fill="#4A6CF7" />
+    </svg>
+    <div>
+      <h3 class="content-1">Download Court Report as .docx</h3>
+      <p class="content-2">
+      The Court Report is pre-filled with information for your case. You can select among currently active cases assigned to you. The document is in Microsoft Word format (.docx).
+      </p>
+    </div>
+  <% end %>
+  <%= render(Modal::GroupComponent.new(id: id)) do |component| %>
+    <% component.with_header(text: "Download Court Report as a .docx", id: id, klass: "content-1") %>
+    <% component.with_body do %>
+      <div class="docx-report__modal-body">
+      <p class="content-3 md-10">
+      To download a court report, choose an active case and specify the date range.
+      </p>
+      <div class="input-style-1" id="case_select_body">
+        <%= form.label :case_selection, "Case" %>
+        <% select_options = @assigned_cases.map { |casa_case| casa_case.decorate.court_report_select_option } %>
+
+        <% show_search = !current_user.volunteer? %>
+
+        <% select_case_prompt = show_search ? "Search by volunteer name or case number" : "Select case number" %>
+        <% select2_class = show_search ? " select2" : "" %>
+        <%= select_tag :case_number,
+          options_for_select(select_options),
+          prompt: select_case_prompt,
+          include_blank: false,
+          id: "case-selection",
+          class: "custom-select#{select2_class}",
+          data: { dropdown_parent: "##{id}" } %>
+
+      <%= form.hidden_field :time_zone, id: "user-time-zone" %>
+      </div>
+      <div class="dates-container">
+        <div class="field form-group mb-20">
+          <h6><label class="form-label" for="start_date">Starting From</label></h6>
+          <%= form.text_field :start_date,
+            value: Time.zone.now.strftime(::DateHelper::RUBY_MONTH_DAY_YEAR_FORMAT),
+            data: { provide: "datepicker",
+                    date_format: ::DateHelper::JQUERY_MONTH_DAY_YEAR_FORMAT },
+                    class: "form-control" %>
+        </div>
+
+        <div class="field form-group mb-20">
+          <h6><label class="form-label" for="end_date">Ending At</label></h6>
+          <%= form.text_field :end_date,
+            value: Time.zone.now.strftime(::DateHelper::RUBY_MONTH_DAY_YEAR_FORMAT),
+            data: { provide: "datepicker",
+                    date_format: ::DateHelper::JQUERY_MONTH_DAY_YEAR_FORMAT },
+                    class: "form-control" %>
+        </div>
+      </div>
+      </div>
+    <% end %>
+    <% component.with_footer do %>
+        <%= button_tag type: :submit,
+          data: {
+            button_name: "Generate Report"
+          },
+          id: "btnGenerateReport",
+          class: "main-btn primary-btn btn-hover btn-sm",
+          onclick: "setTimeZone()" do %>
+          <i class="lni lni-download mr-10"></i>
+          <i id="spinner" class='fas fa-spin d-none mr-10'>⏳</i>
+          Generate Report
+        <% end %>
+    <% end %>
+  <% end %>
+<% end %>
diff --git a/app/views/case_court_reports/index.html.erb b/app/views/case_court_reports/index.html.erb
index 4ab06e896e..6b6ecbd2e8 100644
--- a/app/views/case_court_reports/index.html.erb
+++ b/app/views/case_court_reports/index.html.erb
@@ -2,7 +2,7 @@
   <div class="row align-items-center">
     <div class="col-md-6">
       <div class="title mb-30">
-        <h1>Report Categories</h1>
+        <h1>Generate Reports</h1>
       </div>
     </div>
   </div>
@@ -11,42 +11,8 @@
   <div class="row">
     <div class="col-lg-12">
       <div class="card-style mb-30">
-        <h6 class="mb-10">Generate Court Report</h6>
-        <p class="text-sm mb-25">
-          The Court Report is pre-filled with information for your case. You can select among currently active cases assigned to you. The document is in Microsoft Word format (.docx).
-        </p>
-        <%= form_with url: generate_case_court_reports_path, local: false do |form| %>
-          <div class="input-style-1">
-            <%= form.label :case_selection, "Case Number:" %>
-            <% select_options = @assigned_cases.map { |casa_case| casa_case.decorate.court_report_select_option } %>
-
-            <% show_search = !current_user.volunteer? %>
-
-            <% select_case_prompt = show_search ? "Search by volunteer name or case number" : "Select case number" %>
-            <% select2_class = show_search ? "select2" : "" %>
-
-            <%= select_tag :case_number,
-                          options_for_select(select_options),
-                          prompt: select_case_prompt,
-                          include_blank: false,
-                          id: "case-selection",
-                          class: "custom-select #{select2_class}" %>
-
-            <%= form.hidden_field :time_zone, id: "user-time-zone" %>
-          </div>
-          <div class="input-style-1">
-            <%= button_tag type: :submit,
-                           data: {
-                             button_name: "Generate Report"
-                           },
-                           id: "btnGenerateReport",
-                           class: "main-btn primary-btn btn-hover btn-sm",
-                           onclick: "setTimeZone()" do %>
-              <i class="lni lni-download mr-10"></i> Generate Report
-            <% end %>
-            <i id="spinner" class='fas fa-spin d-none'>⏳</i>
-          </div>
-        <% end %>
+        <h6 class="mb-10">Court Reports</h6>
+        <%= render "case_court_reports/generate_docx" %>
       </div>
     </div>
   </div>
diff --git a/spec/components/modal/open_button_component_spec.rb b/spec/components/modal/open_button_component_spec.rb
index 6052e9f70c..c8172c7273 100644
--- a/spec/components/modal/open_button_component_spec.rb
+++ b/spec/components/modal/open_button_component_spec.rb
@@ -8,7 +8,7 @@
   it "renders the button with text and icon" do
     render_inline(Modal::OpenButtonComponent.new(target: "myModal", text: "Example Text", icon: "example-icon", klass: "example-class"))
 
-    expect(page).to have_css("button[type='button'][class='btn example-class'][data-bs-toggle='modal'][data-bs-target='#myModal']")
+    expect(page).to have_css("button[type='button'][class='example-class'][data-bs-toggle='modal'][data-bs-target='#myModal']")
     expect(page).to have_css("button i.lni.mr-10.lni-example-icon")
     expect(page).to have_text("Example Text")
   end
@@ -16,7 +16,7 @@
   it "renders the button with only text" do
     render_inline(Modal::OpenButtonComponent.new(target: "myModal", text: "Example Text"))
 
-    expect(page).to have_css("button[type='button'][class='btn '][data-bs-toggle='modal'][data-bs-target='#myModal']")
+    expect(page).to have_css("button[type='button'][class=''][data-bs-toggle='modal'][data-bs-target='#myModal']")
     expect(page).not_to have_css("button i")
     expect(page).to have_text("Example Text")
   end
@@ -26,7 +26,7 @@
       "Example Text"
     end
 
-    expect(page).to have_css("button[type='button'][class='btn '][data-bs-toggle='modal'][data-bs-target='#myModal']")
+    expect(page).to have_css("button[type='button'][class=''][data-bs-toggle='modal'][data-bs-target='#myModal']")
     expect(page).not_to have_css("button i")
     expect(page).to have_text("Example Text")
   end
@@ -36,7 +36,7 @@
       "Example Text"
     end
 
-    expect(page).to have_css("button[type='button'][class='btn '][data-bs-toggle='modal'][data-bs-target='#myModal']")
+    expect(page).to have_css("button[type='button'][class=''][data-bs-toggle='modal'][data-bs-target='#myModal']")
     expect(page).not_to have_css("button i")
     expect(page).to have_text("Example Text")
     expect(page).to_not have_text("Overwritten")
diff --git a/spec/factories/case_court_report_context.rb b/spec/factories/case_court_report_context.rb
index 1d0301a5f5..435b474fd1 100644
--- a/spec/factories/case_court_report_context.rb
+++ b/spec/factories/case_court_report_context.rb
@@ -9,6 +9,9 @@
       case_court_orders { nil }
       path_to_report { Rails.root.join("tmp", "test_report.docx").to_s }
       path_to_template { Rails.root.join("app", "documents", "templates", "default_report_template.docx").to_s }
+      start_date { nil }
+      end_date { nil }
+      time_zone { nil }
     end
 
     initialize_with {
@@ -25,7 +28,10 @@
         path_to_report: path_to_report,
         path_to_template: path_to_template,
         court_date: court_date,
-        case_court_orders: case_court_orders
+        case_court_orders: case_court_orders,
+        start_date: start_date,
+        end_date: end_date,
+        time_zone: time_zone
       )
     }
   end
diff --git a/spec/models/case_court_report_context_spec.rb b/spec/models/case_court_report_context_spec.rb
index 301f424e78..45ee767d1f 100644
--- a/spec/models/case_court_report_context_spec.rb
+++ b/spec/models/case_court_report_context_spec.rb
@@ -3,6 +3,8 @@
 require "rails_helper"
 require "sablon"
 
+A_TIMEZONE = "America/New_York"
+
 RSpec.describe CaseCourtReportContext, type: :model do
   let(:volunteer) { create(:volunteer, :with_casa_cases) }
   let(:path_to_template) { Rails.root.join("app", "documents", "templates", "default_report_template.docx").to_s }
@@ -106,85 +108,143 @@
         expect(instance.latest_hearing_date).to eq("___<LATEST HEARING DATE>____")
       end
     end
-  end
 
-  describe "#case_contacts" do
-    let(:casa_case) { create(:casa_case) }
-    let(:context) { build(:case_court_report_context, casa_case: casa_case) }
+    context "when there are multiple hearing dates" do
+      let(:casa_case_with_court_dates) {
+        casa_case = create(:casa_case)
 
-    it "returns an empty array if there are no interviewees" do
-      expect(context.case_contacts).to eq([])
-    end
+        casa_case.court_dates << build(:court_date, date: 9.months.ago)
+        casa_case.court_dates << build(:court_date, date: 3.months.ago)
+        casa_case.court_dates << build(:court_date, date: 15.months.ago)
 
-    # not sure how to test this without just restating the code
-    # context 'when there are interviewees' do
-    #   it 'it calls CaseContactsContactDates with filtered values' do
-    #     create_list(:case_contact_contact_type, 3, case_contact: create(:case_contact, casa_case: casa_case))
-    #     context.case_contacts
-    #   end
-    # end
+        casa_case
+      }
+
+      let(:court_report_context_with_latest_hearing_date) { build(:case_court_report_context, casa_case: casa_case_with_court_dates) }
+
+      it "sets latest_hearing_date as the latest past court date" do
+        expect(court_report_context_with_latest_hearing_date.latest_hearing_date).to eq("October 1, 2020")
+      end
+    end
   end
 
-  describe "#filter_out_old_case_contacts" do
-    let(:casa_case) { create(:casa_case) }
-    let(:court_date) { nil }
-    let(:court_report_context) { build(:case_court_report_context, casa_case: casa_case, court_date: court_date) }
+  describe "#calculate_date_range" do
+    context "when @time_zone is set" do
+      it "converts to provided timezone" do
+        context = build_context(start_date: 10.day.ago, end_date: 2.day.ago, court_date: nil, time_zone: A_TIMEZONE)
+        expect(context.date_range).to eq(zone_days_ago(10)..zone_days_ago(2))
+      end
+
+      it "uses current time if end_date not provided" do
+        context = build_context(start_date: 10.day.ago, end_date: nil, court_date: nil, time_zone: A_TIMEZONE)
+        expect(context.date_range).to eq(zone_days_ago(10)..nil)
+      end
+
+      it "uses court date if available if no start_date" do
+        context = build_context(start_date: nil, end_date: 2.day.ago, court_date: 6.day.ago, time_zone: A_TIMEZONE)
+        expect(context.date_range).to eq(zone_days_ago(6)..zone_days_ago(2))
+      end
+
+      it "uses nil(includes everything) if no court date or start_date" do
+        context = build_context(start_date: nil, end_date: 2.day.ago, court_date: nil, time_zone: A_TIMEZONE)
 
-    context "when there is no most recent court date" do
-      it "returns all interviewees" do
-        interviewees = build_list(:case_contact, 3)
-        expect(court_report_context.filter_out_old_case_contacts(interviewees)).to match_array(interviewees)
+        expect(context.date_range).to eq(nil..zone_days_ago(2))
       end
     end
 
-    context "when there is a most recent court date" do
-      let(:date) { 5.day.ago }
-      let(:court_date) { build(:court_date, date: date) }
-      let(:casa_case) { create(:casa_case, court_dates: [court_date]) }
+    context "when @time_zone is not set" do
+      it "uses server time zone" do
+        context = build_context(start_date: 10.day.ago, end_date: 2.day.ago, court_date: nil, time_zone: nil)
+        expect(context.date_range).to eq(days_ago(10)..days_ago(2))
+      end
+
+      it "uses nil if end_date not provided" do
+        context = build_context(start_date: 10.day.ago, end_date: nil, court_date: nil, time_zone: nil)
+        expect(context.date_range).to eq(days_ago(10)..nil)
+      end
 
-      it "filters out case contacts before the court date" do
-        create_list(:case_contact, 3, occurred_at: date - 1.day, casa_case: casa_case)
-        included_interviewee = create(:case_contact, occurred_at: date + 1.day, casa_case: casa_case)
+      it "uses court date if available if no start_date" do
+        context = build_context(start_date: nil, end_date: 2.day.ago, court_date: 6.day.ago, time_zone: nil)
+        expect(context.date_range).to eq(days_ago(6)..days_ago(2))
+      end
 
-        result = court_report_context.filter_out_old_case_contacts(CaseContact.all)
+      it "uses nil if no court date or start_date" do
+        context = build_context(start_date: nil, end_date: 2.day.ago, court_date: nil, time_zone: nil)
 
-        expect(result).to contain_exactly(included_interviewee)
+        expect(context.date_range).to eq(nil..days_ago(2))
       end
     end
   end
 
-  describe "#context" do
-    let(:court_report_context) { build(:case_court_report_context) }
+  describe "#filtered_interviewees" do
+    it "filters based on date range" do
+      casa_case = create(:casa_case)
+      court_report_context = build(:case_court_report_context, start_date: 5.day.ago.to_s, end_date: 5.day.ago.to_s, casa_case: casa_case)
 
-    describe ":created_date" do
-      it "has a created date equal to the current date" do
-        expect(court_report_context.context[:created_date]).to eq("January 1, 2021")
-      end
+      create_list(:case_contact, 3, occurred_at: 10.day.ago, casa_case: casa_case)
+      create_list(:case_contact, 3, occurred_at: 1.day.ago, casa_case: casa_case)
+      included_interviewee = create(:case_contact, occurred_at: 5.day.ago, casa_case: casa_case)
+
+      result = court_report_context.filtered_interviewees.map(&:case_contact)
+
+      expect(result).to contain_exactly(included_interviewee)
     end
 
-    describe ":latest_hearing_date" do
-      context "when there are no hearing dates" do
-        it "contains text prompting the reader to enter a hearing date" do
-          expect(court_report_context.context[:latest_hearing_date]).to eq("___<LATEST HEARING DATE>____")
-        end
-      end
+    it "filters if start of date range is nil" do
+      casa_case = create(:casa_case)
+      court_report_context = build(:case_court_report_context, start_date: nil, end_date: 5.day.ago.to_s, casa_case: casa_case)
+
+      create_list(:case_contact, 3, occurred_at: 1.day.ago, casa_case: casa_case)
+      interviewees = create_list(:case_contact, 3, occurred_at: 10.day.ago, casa_case: casa_case)
+      interviewees.append(create(:case_contact, occurred_at: 5.day.ago, casa_case: casa_case))
 
-      context "when there are multiple hearing dates" do
-        let(:casa_case_with_court_dates) {
-          casa_case = create(:casa_case)
+      result = court_report_context.filtered_interviewees.map(&:case_contact)
 
-          casa_case.court_dates << build(:court_date, date: 9.months.ago)
-          casa_case.court_dates << build(:court_date, date: 3.months.ago)
-          casa_case.court_dates << build(:court_date, date: 15.months.ago)
+      expect(result).to match_array(interviewees)
+    end
+
+    it "filters if end of date range is nil" do
+      casa_case = create(:casa_case)
+      court_report_context = build(:case_court_report_context, start_date: 5.day.ago.to_s, end_date: nil, casa_case: casa_case)
+
+      create_list(:case_contact, 3, occurred_at: 10.day.ago, casa_case: casa_case)
+      interviewees = create_list(:case_contact, 3, occurred_at: 1.day.ago, casa_case: casa_case)
+      interviewees.append(create(:case_contact, occurred_at: 5.day.ago, casa_case: casa_case))
+
+      result = court_report_context.filtered_interviewees.map(&:case_contact)
+
+      expect(result).to match_array(interviewees)
+    end
+
+    it "does not filter if both start and end of date range are nil" do
+      casa_case = create(:casa_case)
+      court_report_context = build(:case_court_report_context, start_date: nil, end_date: nil, casa_case: casa_case)
+
+      create_list(:case_contact, 3, occurred_at: 10.day.ago, casa_case: casa_case)
+      create_list(:case_contact, 3, occurred_at: 1.day.ago, casa_case: casa_case)
+      create(:case_contact, occurred_at: 5.day.ago, casa_case: casa_case)
 
-          casa_case
-        }
+      result = court_report_context.filtered_interviewees.map(&:case_contact)
+
+      expect(result).to match_array(CaseContact.all)
+    end
+
+    it "returns an empty array if there are no interviewees" do
+      casa_case = create(:casa_case)
+      court_report_context = build(:case_court_report_context, start_date: 5.day.ago.to_s, end_date: nil, casa_case: casa_case)
+
+      result = court_report_context.filtered_interviewees.map(&:case_contact)
+
+      expect(result).to match_array([])
+    end
+  end
 
-        let(:court_report_context_with_latest_hearing_date) { build(:case_court_report_context, casa_case: casa_case_with_court_dates) }
+  describe "#context" do
+    let(:court_report_context) { build(:case_court_report_context) }
 
-        it "sets latest_hearing_date as the latest past court date" do
-          expect(court_report_context_with_latest_hearing_date.context[:latest_hearing_date]).to eq("October 1, 2020")
-        end
+    describe ":created_date" do
+      it "has a created date equal to the current date" do
+        expect(court_report_context.context[:created_date]).to eq("January 1, 2021")
       end
     end
   end
@@ -204,3 +264,23 @@
     end
   end
 end
+
+def build_context(start_date:, end_date:, court_date:, time_zone:)
+  args = {time_zone: time_zone, start_date: start_date.to_s, end_date: end_date.to_s}
+
+  if court_date
+    court_date_object = build(:court_date, date: court_date)
+    court_case = create(:casa_case, court_dates: [court_date_object])
+    args[:casa_case] = court_case if court_date
+  end
+
+  build(:case_court_report_context, **args)
+end
+
+def zone_days_ago(days)
+  ActiveSupport::TimeZone.new(A_TIMEZONE).now - days.days
+end
+
+def days_ago(days)
+  days.days.ago
+end
diff --git a/spec/models/case_court_report_spec.rb b/spec/models/case_court_report_spec.rb
index 1c747c4f19..17783455dd 100644
--- a/spec/models/case_court_report_spec.rb
+++ b/spec/models/case_court_report_spec.rb
@@ -32,30 +32,6 @@
         end
       end
 
-      describe "with court date in the future" do
-        let!(:far_past_case_contact) { create :case_contact, occurred_at: 5.days.ago, casa_case_id: casa_case_with_contacts.id }
-
-        before do
-          create(:court_date, casa_case: casa_case_with_contacts, date: 1.day.from_now)
-        end
-
-        describe "without past court date" do
-          it "has all case contacts ever created for the youth" do
-            expect(report.context[:case_contacts].length).to eq(5)
-          end
-        end
-
-        describe "with past court date" do
-          let!(:court_date) { create(:court_date, date: 2.days.ago, casa_case_id: casa_case_with_contacts.id) }
-
-          it "has all case contacts created since the previous court date including case contact created on the court date" do
-            create(:case_contact, casa_case: casa_case_with_contacts, created_at: court_date.date, notes: "created ON most recent court date")
-            expect(casa_case_with_contacts.court_dates.length).to eq(2)
-            expect(report.context[:case_contacts].length).to eq(5)
-          end
-        end
-      end
-
       describe "has valid @context" do
         subject { report.context }
 
diff --git a/spec/requests/case_court_reports_spec.rb b/spec/requests/case_court_reports_spec.rb
index efafbba821..6eb22f5fb4 100644
--- a/spec/requests/case_court_reports_spec.rb
+++ b/spec/requests/case_court_reports_spec.rb
@@ -99,7 +99,15 @@
   # case_court_reports#generate
   describe "POST /case_court_reports" do
     let(:casa_case) { volunteer.casa_cases.first }
-    let(:params) { {case_court_report: {case_number: casa_case.case_number.to_s}} }
+    let(:params) {
+      {
+        case_court_report: {
+          case_number: casa_case.case_number.to_s,
+          start_date: "January 1, 2020",
+          end_date: "January 1, 2021"
+        }
+      }
+    }
 
     subject(:request) do
       post generate_case_court_reports_path, params: params, headers: {ACCEPT: "application/json"}
@@ -175,7 +183,9 @@
 
         docx_response = Docx::Document.open(StringIO.new(followed_link_response.body))
 
-        expect(docx_response.paragraphs.map(&:to_s)).to include("Date Written: #{I18n.l(user_different_timezone.at(server_time).to_date, format: :full, default: nil)}")
+        expect(docx_response.paragraphs.map(&:to_s))
+          .to include("Date Written: #{I18n.l(user_different_timezone.at(server_time)
+            .to_date, format: :full, default: nil)}")
       end
     end
 
diff --git a/spec/system/casa_cases/show_spec.rb b/spec/system/casa_cases/show_spec.rb
index f48c6f570d..ba7b45188c 100644
--- a/spec/system/casa_cases/show_spec.rb
+++ b/spec/system/casa_cases/show_spec.rb
@@ -41,6 +41,58 @@
     end
   end
 
+  describe "Report Generation", js: true do
+    let(:modal_selector) { '[data-bs-target="#generate-docx-report-modal"]' }
+    let(:user) { volunteer }
+
+    before do
+      travel_to Date.new(2021, 1, 1)
+      sign_in user
+      visit casa_case_path(casa_case.id)
+    end
+
+    context "when first arriving to 'Generate Court Report' page" do
+      it "generation modal hidden" do
+        expect(page).to have_selector "#btnGenerateReport", text: "Generate Report", visible: false
+        expect(page).not_to have_selector ".select2"
+      end
+    end
+
+    context "after opening 'Download Court Report' modal" do
+      before do
+        page.find(modal_selector).click
+      end
+
+      # putting all this in the same system test shaves 3 seconds off the test suite
+      it "modal has correct contents" do
+        start_date = page.find("#start_date").value
+        expect(start_date).to eq("January 01, 2021") # default date
+
+        end_date = page.find("#end_date").value
+        expect(end_date).to eq("January 01, 2021") # default date
+
+        expect(page).to have_selector "#btnGenerateReport", text: "Generate Report", visible: true
+        expect(page).to_not have_selector ".select2"
+
+        expect(page).to have_selector("#btnGenerateReport .lni-download", visible: true)
+        expect(page).to_not have_selector("#btnGenerateReport[disabled]")
+        expect(page).to have_selector("#spinner", visible: :hidden)
+
+        within("#generate-docx-report-modal") do
+          expect(page).to have_content(casa_case.case_number)
+
+        # when choosing the prompt option (value is empty) and click on 'Generate Report' button, nothing should happen"
+        # should have disabled generate button, download icon and no spinner
+          click_button "Generate Report"
+        end
+
+        expect(page).to have_selector("#btnGenerateReport .lni-download", visible: :hidden)
+        expect(page).to have_selector("#btnGenerateReport[disabled]")
+        expect(page).to have_selector("#spinner", visible: true)
+      end
+    end
+  end
+
   context "admin user" do
     let(:user) { admin }
 
@@ -137,28 +189,6 @@
       expect(page).to have_content(casa_case.case_court_orders[0].implementation_status_symbol)
     end
 
-    context "when generating a report, supervisor sees waiting page", js: true do
-      before do
-        click_button "Generate Report"
-      end
-
-      describe "'Generate Report' button" do
-        it "has been disabled" do
-          options = {visible: :visible}
-
-          expect(page).to have_selector "#btnGenerateReport[disabled]", **options
-        end
-      end
-
-      describe "Spinner" do
-        it "becomes visible" do
-          options = {visible: :visible}
-
-          expect(page).to have_selector "#spinner", **options
-        end
-      end
-    end
-
     context "when old case contacts are hidden" do
       it "should display all case contacts to supervisor", js: true do
         casa_case = create(:casa_case, casa_org: organization)
diff --git a/spec/system/case_court_reports/index_spec.rb b/spec/system/case_court_reports/index_spec.rb
index 249c5e5e7f..bb2a9d2745 100644
--- a/spec/system/case_court_reports/index_spec.rb
+++ b/spec/system/case_court_reports/index_spec.rb
@@ -6,79 +6,71 @@
   let(:casa_cases) { CasaCase.actively_assigned_to(volunteer) }
   let(:younger_than_transition_age) { volunteer.casa_cases.reject(&:in_transition_age?).first }
   let(:at_least_transition_age) { volunteer.casa_cases.find(&:in_transition_age?) }
+  let(:modal_selector) { '[data-bs-target="#generate-docx-report-modal"]' }
 
   before do
+    travel_to Date.new(2021, 1, 1)
     sign_in volunteer
     visit case_court_reports_path
   end
 
-  context "when first arriving to 'Generate Court Report' page" do
-    it "sees 'Generate Report' button" do
-      options = {text: "Generate Report", visible: true}
+  context "when first arriving to 'Generate Court Report' page", js: true do
+    it "generation modal hidden" do
+      expect(page).to have_selector "#btnGenerateReport", text: "Generate Report", visible: false
+      expect(page).to have_selector "#case-selection", visible: false
+      expect(page).not_to have_selector ".select2"
+    end
+  end
 
-      expect(page).to have_selector "#btnGenerateReport", **options
+  context "after opening 'Download Court Report' modal", js: true do
+    before do
+      page.find(modal_selector).click
     end
 
-    it { expect(page).not_to have_selector ".select2" }
+    # putting all this in the same system test shaves 3 seconds off the test suite
+    it "modal has correct contents" do
+      start_date = page.find("#start_date").value
+      expect(start_date).to eq("January 01, 2021") # default date
 
-    it "shows a select element with default selection 'Select case number'" do
-      expected_text = "Select case number"
-      find("#case-selection").click.first("option", text: expected_text).select_option
+      end_date = page.find("#end_date").value
+      expect(end_date).to eq("January 01, 2021") # default date
 
-      expect(page).to have_selector "#case-selection option:first-of-type", text: expected_text
-      expect(page).to have_select "case-selection", selected: expected_text
-    end
+      expect(page).to have_selector "#btnGenerateReport", text: "Generate Report", visible: true
+      expect(page).to_not have_selector ".select2"
 
-    it "shows n+1 options in total, e.g 3 options <- 2 assigned cases + 1 prompt text" do
+      # shows n+1 options in total, e.g 3 options <- 2 assigned cases + 1 prompt text
       expected_number_of_options = casa_cases.size + 1
-
       expect(page).to have_selector "#case-selection option", count: expected_number_of_options
-    end
 
-    it "shows transition stamp for transitioned case" do
+      # shows transition stamp for transitioned case
       expected_text = "#{at_least_transition_age.case_number} - transition"
-
-      expect(page).to have_selector "#case-selection option", text: expected_text
-    end
-
-    it "shows non-transition stamp for non-transitioned case" do
-      expected_text = "#{younger_than_transition_age.case_number} - non-transition"
-
       expect(page).to have_selector "#case-selection option", text: expected_text
-    end
 
-    it "adds data-lookup attribute for searching by volunteer name" do
+      # adds data-lookup attribute for searching by volunteer name
       casa_cases.each do |casa_case|
         lookup = casa_case.assigned_volunteers.map(&:display_name).join(",")
         expect(page).to have_selector "#case-selection option[data-lookup='#{lookup}']"
       end
-    end
-  end
 
-  context "when choosing the prompt option (value is empty) and click on 'Generate Report' button, nothing should happen", js: true do
-    let(:option_text) { "Select case number" }
+      # shows non-transition stamp for non-transitioned case
+      expected_text = "#{younger_than_transition_age.case_number} - non-transition"
+      expect(page).to have_selector "#case-selection option", text: expected_text
 
-    before do
-      # to find the select element, use either 'name' or 'id' attribute
-      # in this case, id = "case-selection", name = "case_number"
-      page.select "Select case number", from: "case-selection"
-      # the above will have the same effect as the below
-      # find("#case-selection").select "Select case number"
-      click_button "Generate Report"
-    end
+      # shows a select element with default selection 'Select case number'
+      expected_text = "Select case number"
+      find("#case-selection").click.first("option", text: expected_text).select_option
 
-    describe "'Generate Report' button" do
-      it "does not become disabled" do
-        expect(page).not_to have_selector "#btnGenerateReport[disabled]"
-      end
-    end
+      expect(page).to have_selector "#case-selection option:first-of-type", text: expected_text
+      expect(page).to have_select "case-selection", selected: expected_text
 
-    describe "Spinner" do
-      it "does not become visible" do
-        options = {visible: :hidden}
+      # when choosing the prompt option (value is empty) and click on 'Generate Report' button, nothing should happen"
+      # should have disabled generate button, download icon and no spinner
+      page.select "Select case number", from: "case-selection"
+      click_button "Generate Report"
 
-        expect(page).to have_selector "#spinner", **options
-      end
+      expect(page).to have_selector("#btnGenerateReport .lni-download", visible: true)
+      expect(page).to_not have_selector("#btnGenerateReport[disabled]")
+      expect(page).to have_selector("#spinner", visible: :hidden)
     end
   end
 
@@ -89,6 +81,7 @@
     let(:non_transitioned_option_text) { "#{non_transitioned_case_number} - non-transition(assigned to Name Last)" }
 
     it "has transition case option selected" do
+      page.find(modal_selector).click
       page.select transitioned_option_text, from: "case-selection"
 
       click_button "Generate Report"
@@ -97,6 +90,7 @@
     end
 
     it "has non-transitioned case option selected" do
+      page.find(modal_selector).click
       page.select non_transitioned_option_text, from: "case-selection"
 
       click_button "Generate Report"
@@ -105,39 +99,12 @@
     end
   end
 
-  context "when generating a report, volunteer sees waiting page", js: true do
-    let(:casa_case) { casa_cases.find(&:in_transition_age?) }
-    let(:option_text) { "#{casa_case.case_number} - transition" }
-
-    before do
-      # to find the select element, use either 'name' or 'id' attribute
-      # in this case, id = "case-selection", name = "case_number"
-      page.select option_text, from: "case-selection"
-      click_button "Generate Report"
-    end
-
-    describe "'Generate Report' button" do
-      it "has been disabled" do
-        options = {visible: :visible}
-
-        expect(page).to have_selector "#btnGenerateReport[disabled]", **options
-      end
-    end
-
-    describe "Spinner" do
-      it "becomes visible" do
-        options = {visible: :visible}
-
-        expect(page).to have_selector "#spinner", **options
-      end
-    end
-  end
-
   context "when selecting a case, volunteer can generate and download a report", js: true do
     let(:casa_case) { casa_cases.find(&:in_transition_age?) }
     let(:option_text) { "#{casa_case.case_number} - transition" }
 
     before do
+      page.find(modal_selector).click
       # to find the select element, use either 'name' or 'id' attribute
       # in this case, id = "case-selection", name = "case_number"
       page.select option_text, from: "case-selection"
@@ -204,6 +171,7 @@
     end
   end
 
+  # TODO: make this a request spec
   describe "as a supervisor" do
     before do
       sign_in supervisor
diff --git a/spec/views/case_court_reports/index.html.erb_spec.rb b/spec/views/case_court_reports/index.html.erb_spec.rb
index 5fbc26a429..ed3fba8f3e 100644
--- a/spec/views/case_court_reports/index.html.erb_spec.rb
+++ b/spec/views/case_court_reports/index.html.erb_spec.rb
@@ -16,28 +16,16 @@
     end
 
     it "has a card with card title 'Generate Court Report'", :aggregate_failures do
+      expect(rendered).to have_selector("h6", text: "Court Reports", count: 1)
       expect(rendered).to have_selector("div", class: "card-style", count: 1)
-      expect(rendered).to have_selector("h6", text: "Generate Court Report", count: 1)
     end
 
-    it "displays a form" do
-      expect(rendered).to have_selector("form", count: 1)
+    it "page has title 'Gererate Reports'" do
+      expect(rendered).to have_selector("h1", text: "Generate Reports", count: 1)
     end
 
-    it "has a dropdown select with shows 2 options" do
-      expect(rendered).to have_selector("select#case-selection option", count: 3)
-    end
-
-    it "has a drowndown select element for CASA case" do
-      expect(rendered).to have_selector("select#case-selection")
-    end
-
-    it "has a 'Generate Report' button" do
-      expect(rendered).to have_selector("button[@type='submit']", text: "Generate Report", id: "btnGenerateReport")
-    end
-
-    it "has a 'Spinner' button" do
-      expect(rendered).to have_selector("i#spinner")
+    it "has button with 'Download Court Report as .docx' text" do
+      expect(rendered).to have_selector("button", text: /Download Court Report as \.docx/i, count: 1)
     end
   end
 end