diff --git a/backend/api/services/supplemental_report.py b/backend/api/services/supplemental_report.py
index 3466d5160..587bcad74 100644
--- a/backend/api/services/supplemental_report.py
+++ b/backend/api/services/supplemental_report.py
@@ -22,6 +22,7 @@ def get_map_of_model_year_report_ids_to_latest_supplemental_ids(
 def get_ordered_list_of_supplemental_reports(model_year_report, *fields):
     reports = list(
         SupplementalReport.objects.filter(model_year_report=model_year_report)
+        .exclude(status=ModelYearReportStatuses.DELETED)
         .only("id", "supplemental_id", *fields)
         .order_by("create_timestamp")
     )
diff --git a/backend/api/viewsets/model_year_report.py b/backend/api/viewsets/model_year_report.py
index c06640de0..3966e287d 100644
--- a/backend/api/viewsets/model_year_report.py
+++ b/backend/api/viewsets/model_year_report.py
@@ -69,6 +69,7 @@
     SupplementalModelYearReportSerializer,
 )
 from api.models.organization import Organization
+from api.services.supplemental_report import get_ordered_list_of_supplemental_reports
 
 
 class ModelYearReportViewset(
@@ -1176,3 +1177,12 @@ def assessed_supplementals(self, request, pk):
             data, context={"request": request}, many=True
         )
         return Response(serializer.data)
+    
+    @action(detail=True, methods=["get"])
+    def latest_supplemental_status(self, request, pk):
+        result = None
+        supplementals = get_ordered_list_of_supplemental_reports(pk, "status")
+        if supplementals:
+            result = supplementals[-1].status.value
+        return Response(result)
+
diff --git a/frontend/src/app/routes/Compliance.js b/frontend/src/app/routes/Compliance.js
index e8e1ab82a..08c7b5f91 100644
--- a/frontend/src/app/routes/Compliance.js
+++ b/frontend/src/app/routes/Compliance.js
@@ -28,7 +28,8 @@ const COMPLIANCE = {
   MAKES: `${API_BASE_PATH}/reports/:id/makes`,
   SUPPLEMENTAL_CREATE: `${API_BASE_PATH}/reports/:id/supplemental_save`,
   NOA_HISTORY: `${API_BASE_PATH}/reports/:id/noa_history`,
-  SUPPLEMENTAL_HISTORY: `${API_BASE_PATH}/reports/:id/supplemental_history`
+  SUPPLEMENTAL_HISTORY: `${API_BASE_PATH}/reports/:id/supplemental_history`,
+  LATEST_SUPPLEMENTAL_STATUS: `${API_BASE_PATH}/reports/:id/latest_supplemental_status`
 }
 
 export default COMPLIANCE
diff --git a/frontend/src/compliance/components/AssessmentDetailsPage.js b/frontend/src/compliance/components/AssessmentDetailsPage.js
index 182660498..833e559b2 100644
--- a/frontend/src/compliance/components/AssessmentDetailsPage.js
+++ b/frontend/src/compliance/components/AssessmentDetailsPage.js
@@ -322,56 +322,6 @@ const AssessmentDetailsPage = (props) => {
         <div className="col-12">
           <div id="compliance-obligation-page">
             <span className="float-right d-print-none">
-              {CONFIG.FEATURES.SUPPLEMENTAL_REPORT.ENABLED &&
-                !user.isGovernment &&
-                statuses.assessment.status === 'ASSESSED' &&
-                ((!supplementaryId && supplementaryStatus === 'DRAFT') ||
-                  (supplementaryStatus === 'DRAFT' && createdByGov) ||
-                  supplementaryStatus === 'DELETED' ||
-                  supplementaryStatus === 'ASSESSED') && (
-                  <Button
-                    buttonTooltip={reassessmentTooltip}
-                    buttonType="submit"
-                    optionalClassname="btn button primary"
-                    optionalText="Create Supplementary Report"
-                    disabled={reassessmentExists}
-                    action={() => {
-                      history.push(
-                        `${ROUTES_SUPPLEMENTARY.CREATE.replace(
-                          /:id/g,
-                          id
-                        )}`
-                      )
-                    }}
-                  />
-              )}
-
-              {CONFIG.FEATURES.SUPPLEMENTAL_REPORT.ENABLED &&
-                user.isGovernment &&
-                user.hasPermission('RECOMMEND_COMPLIANCE_REPORT') &&
-                statuses.assessment.status === 'ASSESSED' &&
-                ((!supplementaryId && supplementaryStatus === 'DRAFT') ||
-                  (supplementaryStatus === 'DRAFT' && !createdByGov) ||
-                  supplementaryStatus === 'DELETED' ||
-                  supplementaryStatus === 'ASSESSED') && (
-                  <>
-                    <button
-                      className="btn button primary"
-                      onClick={() => {
-                        history.push(
-                          `${ROUTES_SUPPLEMENTARY.REASSESSMENT.replace(
-                            /:id/g,
-                            id
-                          )}`
-                        )
-                      }}
-                      type="button"
-                    >
-                      Create Reassessment Report
-                    </button>
-                  </>
-              )}
-
               {analystAction &&
                 ['RETURNED', 'SUBMITTED', 'UNSAVED'].indexOf(
                   statuses.assessment.status
@@ -388,14 +338,6 @@ const AssessmentDetailsPage = (props) => {
                     Edit
                   </button>
               )}
-              <Button
-                buttonType="button"
-                optionalClassname="ml-2 mr-2 button btn"
-                optionalText="Print Page"
-                action={() => {
-                  window.print()
-                }}
-              />
             </span>
 
             <NoticeOfAssessmentSection
diff --git a/frontend/src/compliance/components/ComplianceHistory.js b/frontend/src/compliance/components/ComplianceHistory.js
index e54d5a19b..3477dda81 100644
--- a/frontend/src/compliance/components/ComplianceHistory.js
+++ b/frontend/src/compliance/components/ComplianceHistory.js
@@ -7,6 +7,7 @@ import { useParams } from 'react-router-dom'
 import ROUTES_COMPLIANCE from '../../app/routes/Compliance'
 import ROUTES_SUPPLEMENTARY from '../../app/routes/SupplementaryReport'
 import history from '../../app/History'
+import CONFIG from '../../app/config'
 
 require('bootstrap/js/dist/collapse.js')
 
@@ -23,22 +24,41 @@ const ComplianceHistory = (props) => {
 
   const [supplementalReportHistory, setSupplementalReportHistory] = useState([])
   const [startedAsSupplemental, setStartedAsSupplemental] = useState(false)
+  const [canCreateSupplementalOrReassessment, setCanCreateSupplementalOrReassessment] = useState(false)
 
   useEffect(() => {
-    axios
-      .get(ROUTES_COMPLIANCE.SUPPLEMENTAL_HISTORY.replace(/:id/g, id))
-      .then((response) => {
-        setSupplementalReportHistory(response.data)
-        response.data.forEach((report) => {
-          if (report.isSupplementary === true) {
-            report.history.forEach((row) => {
-              if (row.isReassessment === false) {
-                setStartedAsSupplemental(true)
-              }
-            })
-          }
-        })
+    const getSupplementalHistory = axios.get(ROUTES_COMPLIANCE.SUPPLEMENTAL_HISTORY.replace(/:id/g, id))
+    const getLatestStatus = axios.get(ROUTES_COMPLIANCE.LATEST_SUPPLEMENTAL_STATUS.replace(/:id/g, id))
+    Promise.all([getSupplementalHistory, getLatestStatus]).then(([historyResponse, statusResponse]) => {
+      const historyData = historyResponse.data
+      setSupplementalReportHistory(historyData)
+      historyData.forEach((report) => {
+        if (report.isSupplementary === true) {
+          report.history.forEach((row) => {
+            if (row.isReassessment === false) {
+              setStartedAsSupplemental(true)
+            }
+          })
+        }
       })
+      let modelYearReportAssessed = false
+      let hasPermissionToSupplementOrReassess = false
+      let latestSupplementalIfAnyIsAssessed = false
+      const modelYearReport = historyData[historyData.length - 1]
+      if (modelYearReport.status === 'ASSESSED' || modelYearReport.status === 'REASSESSED') {
+        modelYearReportAssessed = true
+      }
+      if (!user.isGovernment || (user.isGovernment && user.hasPermission('RECOMMEND_COMPLIANCE_REPORT'))) {
+        hasPermissionToSupplementOrReassess = true
+      }
+      const latestStatus = statusResponse.data
+      if (!latestStatus || latestStatus === 'ASSESSED' || latestStatus === 'REASSESSED') {
+        latestSupplementalIfAnyIsAssessed = true
+      }
+      if (CONFIG.FEATURES.SUPPLEMENTAL_REPORT.ENABLED && modelYearReportAssessed && hasPermissionToSupplementOrReassess && latestSupplementalIfAnyIsAssessed) {
+        setCanCreateSupplementalOrReassessment(true)
+      }
+    })
   }, [])
 
   // assumes passed in history is in order from most recent to earliest
@@ -233,10 +253,42 @@ const ComplianceHistory = (props) => {
     return ''
   }
 
+  let supplementaryText = 'Supplementary'
+  let supplementaryRoute = ROUTES_SUPPLEMENTARY.CREATE
+  if (user.isGovernment) {
+    supplementaryText = 'Reassessment'
+    supplementaryRoute = ROUTES_SUPPLEMENTARY.REASSESSMENT
+  }
+
   return (
     Object.keys(supplementalReportHistory).length > 0 && (
       <div className="m-0 pt-2">
-        <h3>{reportYear} Model Year Reporting History</h3>
+        <div className='action-bar'>
+          <h3>{reportYear} Model Year Reporting History</h3>
+          <div>
+            {canCreateSupplementalOrReassessment && <button 
+                className='button primary ml-4'
+                onClick={() => {
+                  history.push(
+                    `${supplementaryRoute.replace(
+                      /:id/g,
+                      id
+                    )}`
+                  )
+                }}
+              >
+                {`Create ${supplementaryText} Report`}
+              </button>}
+            <button 
+              className='button ml-2'
+              onClick={() => {
+                window.print()
+              }}
+            >
+              Print Page
+            </button>
+          </div>
+        </div>
         <div className="mt-2" id="complianceHistory">
           {supplementalReportHistory &&
             supplementalReportHistory.map((item, index) => (