add mechanism for initial modal display; fix financial verification modal display

atst/app.py

@@ -68,7 +68,7 @@ def make_flask_callbacks(app):
         )
         g.dev = os.getenv("FLASK_ENV", "dev") == "dev"
         g.matchesPath = lambda href: re.match("^" + href, request.path)
-        g.modalOpen = request.args.get("modal", False)
+        g.modal = request.args.get("modal", None)
         g.current_user = {
             "id": "cce17030-4109-4719-b958-ed109dbb87c8",
             "first_name": "Amanda",

atst/routes/requests/requests_form.py

@@ -4,6 +4,7 @@ from . import requests_bp
 from atst.domain.requests import Requests
 from atst.routes.requests.jedi_request_flow import JEDIRequestFlow
 from atst.models.permissions import Permissions
+from atst.models.request_status_event import RequestStatus
 from atst.domain.exceptions import UnauthorizedError
 
 
@@ -99,8 +100,8 @@ def requests_submit(request_id=None):
     request = Requests.get(request_id)
     Requests.submit(request)
 
-    if request.status == "approved":
+    if request.status == RequestStatus.PENDING_FINANCIAL_VERIFICATION:
-        return redirect("/requests?modal=True")
+        return redirect("/requests?modal=pendingFinancialVerification")
 
     else:
         return redirect("/requests")

js/index.js

@@ -20,7 +20,15 @@ const app = new Vue({
     return {
       modals: {
         styleguideModal: false,
+        pendingFinancialVerification: false,
       }
     }
+  },
+  mounted: function() {
+    const modalOpen = document.querySelector("#modalOpen");
+    if (modalOpen) {
+      const modal = modalOpen.getAttribute("data-modal");
+      this.modals[modal] = true;
+    }
   }
 })

templates/base.html

@@ -35,6 +35,11 @@
 
     {% include 'footer.html' %}
     {% block modal %}{% endblock %}
+
+    {% if g.modal %}
+      <div data-modal="{{ g.modal }}" id="modalOpen">
+      </div>
+    {% endif %}
   </div>
 
   {% assets "js_all" %}

templates/requests.html

@@ -4,37 +4,32 @@
 {% from "components/modal.html" import Modal %}
 {% from "components/empty_state.html" import EmptyState %}
 
-{% block modal %}
-  {% if g.modalOpen %}
-    {% call Modal() %}
-      <h1>Your request is now approved!</h1>
-
-      <p>
-        Your next step is to create a <b>Task Order (T.O.)</b> associated with
-        JEDI Cloud. Please consult a <b>Contracting Officer (KO)</b> or
-        <b>Contracting Officer Representative (COR)</b> to help with this step.
-      </p>
-
-      <p>
-        Once the Task Order (T.O.) has been created, we will need the following
-        details to create your account. These details will help keep your cloud
-        usage in sync with your budget.
-      </p>
-
-      {{ Alert("You'll need these details: ",
-        message="<p>Task Order Number</p><p>Contracting Officer: Name, E-mail and Office</p>"
-      ) }}
-
-
-      <div class='action-group'>
-        <a href='/requests' class='action-group__action usa-button'>Close</a>
-      </div>
-    {% endcall %}
-  {% endif %}
-{% endblock %}
-
 {% block content %}
 
+  {% call Modal(name='pendingFinancialVerification', dismissable=True) %}
+    <h1>Your request is now approved!</h1>
+
+    <p>
+      Your next step is to create a <b>Task Order (T.O.)</b> associated with
+      JEDI Cloud. Please consult a <b>Contracting Officer (KO)</b> or
+      <b>Contracting Officer Representative (COR)</b> to help with this step.
+    </p>
+
+    <p>
+      Once the Task Order (T.O.) has been created, we will need the following
+      details to create your account. These details will help keep your cloud
+      usage in sync with your budget.
+    </p>
+
+    {{ Alert("You'll need these details: ",
+      message="<p>Task Order Number</p><p>Contracting Officer: Name, E-mail and Office</p>"
+    ) }}
+
+    <div class='action-group'>
+      <a v-on:click="closeModal('pendingFinancialVerification')" class='action-group__action usa-button'>Close</a>
+    </div>
+  {% endcall %}
+
 {% if not requests %}
 
   {{ EmptyState(

tests/routes/test_request_submit.py

@@ -1,6 +1,7 @@
 import pytest
 from tests.mocks import MOCK_USER
 from tests.factories import RequestFactory
+from atst.models.request_status_event import RequestStatus
 
 
 def _mock_func(*args, **kwargs):
@@ -27,12 +28,11 @@ def test_submit_autoapproved_reviewed_request(monkeypatch, client, user_session)
     user_session()
     monkeypatch.setattr("atst.domain.requests.Requests.get", _mock_func)
     monkeypatch.setattr("atst.domain.requests.Requests.submit", _mock_func)
-    monkeypatch.setattr("atst.models.request.Request.status", "approved")
+    monkeypatch.setattr("atst.models.request.Request.status", RequestStatus.PENDING_FINANCIAL_VERIFICATION)
-    # this just needs to send a known invalid form value
     response = client.post(
         "/requests/submit/1",
         headers={"Content-Type": "application/x-www-form-urlencoded"},
         data="",
         follow_redirects=False,
     )
-    assert "/requests?modal=True" in response.headers["Location"]
+    assert "/requests?modal=" in response.headers["Location"]