EREGCSC-2156 -- Refined policy repository results styling

.github/workflows/deploy-experimental.yml

@@ -315,14 +315,29 @@ jobs:
             [1]: ${{ env.django_url }}
           reactions: "+1"
   test-cypress:
-    needs: [deploy-go, deploy-django, build-and-deploy-vue]
+    environment:
+      name: "dev"
     runs-on: ubuntu-20.04
+    needs: [deploy-go, deploy-django, build-and-deploy-vue]
     steps:
       # Checkout the code
       - name: Checkout
         uses: actions/checkout@v3
         with:
           submodules: true
+      # Configure AWS credentials for GitHub Actions
+      - name: Configure AWS credentials for GitHub Actions
+        uses: aws-actions/configure-aws-credentials@v4
+        with:
+          role-to-assume: ${{ secrets.AWS_OIDC_ROLE_TO_ASSUME }}
+          aws-region: us-east-1
+      # Get test user credentials from AWS Parameter Store
+      - name: Get test user credentials
+        uses: dkershner6/aws-ssm-getparameters-action@v1
+        with:
+            parameterPairs: "/eregulations/http/user = CYPRESS_TEST_USERNAME,
+                /eregulations/http/password = CYPRESS_TEST_PASSWORD"
+            withDecryption: "true" # defaults to true
       # Setup node environment
       - name: Setup Node
         uses: actions/setup-node@v3

.github/workflows/deploy.yml

@@ -153,6 +153,13 @@ jobs:
         working-directory: ./solution/backend
         run: |
           pytest -vv
+      # Get test user credentials from AWS Parameter Store
+      - name: Get test user credentials
+        uses: dkershner6/aws-ssm-getparameters-action@v1
+        with:
+            parameterPairs: "/eregulations/http/test_user = CYPRESS_TEST_USERNAME,
+                /eregulations/http/test_password = CYPRESS_TEST_PASSWORD"
+            withDecryption: "true" # defaults to true
       - name: end-to-end tests
         uses: cypress-io/github-action@v5
         with:

.gitignore

@@ -4,6 +4,7 @@ node_modules
 __pycache__/
 e2e/cypress/videos
 solution/ui/e2e/cypress/videos
+cypress.env.json
 .env
 solution/backend/regulations/static/*
 solution/static-assets/regulations/*

solution/backend/regulations/templates/regulations/partials/footer.html

@@ -27,8 +27,8 @@ <h4 class="last-update-footer">
             Regulations up to date from <a href="https://www.ecfr.gov" target="_blank" class="external">
                 eCFR
             </a> as of
-                {% if '/search/' in request.path or '/resources/' in request.path or '/statutes' in request.path %}
-                <span class="last-updated-date">{{parser_last_success|parser_success_date_formatter}}</span>.
+                {% if spa_footer %}
+                    <span class="last-updated-date">{{parser_last_success|parser_success_date_formatter}}</span>.
                 {% else %}
                     <span class="last-updated-date">
                         <last-parser-success-date api-url={{ API_BASE }} ></last-parser-success-date>

solution/backend/regulations/templates/regulations/partials/login_indicator.html

@@ -2,11 +2,11 @@
 <div id="loginIndicator">
     <span class="span__login-lamp span__login-lamp--success"></span>
     <span class="span__login-greeting">Hello, <b>{{ user.username }}</b>!</span>
-    <a href="{% url 'logout' %}?next={{ request.path }}">Log Out</a>
+    <a id="logout" href="{% url 'logout' %}?next={{ request.path }}">Log Out</a>
 {% else %}
 <div id="loginIndicator" class="display-none">
     <span class="span__login-lamp span__login-lamp--error"></span>
     <span class="span__login-greeting">Hello, <b>Guest</b>!</span>
-    <a href="{% url 'login' %}?next={{ request.path }}">Log In</a>
+    <a id="login" href="{% url 'login' %}?next={{ request.path }}">Log In</a>
 {% endif %}
 </div>

solution/backend/regulations/templates/regulations/spa_base.html

@@ -1,6 +1,12 @@
 {% extends "regulations/base.html" %}
 {% load static %}
 
+{% block footer %}
+    <footer>
+        {% include "regulations/partials/footer.html" with spa_footer=True %}
+    </footer>
+{% endblock %}
+
 {% block post_footer %}
     <script src="{% static '/vite/index.js' %}?{{ DEPLOY_NUMBER }}"></script>
 {% endblock %}

solution/backend/regulations/views/reader.py

@@ -113,6 +113,15 @@ def get_context_data(self, **kwargs):
 
         return {**context, **c, **version_info}
 
+    def get(self, request, *args, **kwargs):
+        if kwargs.get('version') is None:
+            versions = Part.objects.versions(kwargs.get("title"), kwargs.get('part'))
+            if versions is None:
+                raise Http404
+            kwargs['version'] = versions[0]['date']
+            return HttpResponseRedirect(reverse('reader_view', kwargs=kwargs))
+        return super().get(request, *args, **kwargs)
+
     def get_view_type(self):
         raise NotImplementedError()
 

solution/ui/e2e/cypress.env.json.template

@@ -0,0 +1,4 @@
+{
+  "TEST_USERNAME": "Use this template to create your own local cypress.env.json file.  Replace these values with a test username and test password that you have created locally using Django Admin.",
+  "TEST_PASSWORD": "Once you save this file as cypress.env.json, it will be ignored by Github."
+}

solution/ui/e2e/cypress/e2e/policy-repository.spec.cy.js

@@ -0,0 +1,45 @@
+const TITLE_42 = 42;
+const TITLE_45 = 45;
+
+const username = Cypress.env("TEST_USERNAME");
+const password = Cypress.env("TEST_PASSWORD");
+
+describe("Policy Repository", () => {
+    beforeEach(() => {
+        cy.intercept("/**", (req) => {
+            req.headers["x-automated-test"] = Cypress.env("DEPLOYING");
+        });
+
+        cy.intercept("**/v3/titles", [TITLE_42, TITLE_45]).as("titles");
+
+        cy.intercept(`**/v3/title/${TITLE_42}/parts`, {
+            fixture: "parts-42.json",
+        }).as("parts42");
+
+        cy.intercept(`**/v3/title/${TITLE_45}/parts`, {
+            fixture: "parts-45.json",
+        }).as("parts45");
+    });
+
+    it("shows the login screen when you visit /policy-repository/ without logging in", () => {
+        cy.viewport("macbook-15");
+        cy.visit("/policy-repository/");
+        cy.url().should("include", "/admin/login");
+    });
+
+    it("show the policy repository page when logged in", () => {
+        cy.viewport("macbook-15");
+        cy.eregsLogin({ username, password });
+        cy.visit("/policy-repository");
+        cy.url().should("include", "/policy-repository/");
+        cy.get("#loginIndicator").should("be.visible");
+    });
+
+    it("returns you to the admin login page when you log out", () => {
+        cy.viewport("macbook-15");
+        cy.eregsLogin({ username, password });
+        cy.visit("/policy-repository");
+        cy.get("#logout").click();
+        cy.get("#login-form").should("be.visible");
+    });
+});

solution/ui/e2e/cypress/fixtures/parts-42.json

@@ -0,0 +1,121 @@
+[
+    {
+        "id": 104,
+        "name": "400",
+        "date": "2023-01-01",
+        "last_updated": "2023-09-06 09:52:04.760846",
+        "depth": 3
+    },
+    {
+        "id": 5,
+        "name": "430",
+        "date": "2017-01-20",
+        "last_updated": "2023-09-06 09:47:03.292501",
+        "depth": 3
+    },
+    {
+        "id": 32,
+        "name": "431",
+        "date": "2023-01-01",
+        "last_updated": "2023-09-11 09:03:59.358576",
+        "depth": 3
+    },
+    {
+        "id": 6,
+        "name": "432",
+        "date": "2020-06-30",
+        "last_updated": "2023-09-11 09:02:54.341007",
+        "depth": 3
+    },
+    {
+        "id": 20,
+        "name": "433",
+        "date": "2023-08-31",
+        "last_updated": "2023-09-06 09:47:43.850806",
+        "depth": 3
+    },
+    {
+        "id": 9,
+        "name": "434",
+        "date": "2017-01-01",
+        "last_updated": "2023-09-11 09:02:56.476197",
+        "depth": 3
+    },
+    {
+        "id": 35,
+        "name": "435",
+        "date": "2023-01-01",
+        "last_updated": "2023-09-11 09:03:28.146819",
+        "depth": 3
+    },
+    {
+        "id": 22,
+        "name": "436",
+        "date": "2017-01-01",
+        "last_updated": "2023-09-11 09:03:14.240732",
+        "depth": 3
+    },
+    {
+        "id": 80,
+        "name": "438",
+        "date": "2021-07-01",
+        "last_updated": "2023-09-06 09:51:07.897257",
+        "depth": 3
+    },
+    {
+        "id": 56,
+        "name": "440",
+        "date": "2020-12-16",
+        "last_updated": "2023-09-11 09:04:12.992711",
+        "depth": 3
+    },
+    {
+        "id": 64,
+        "name": "441",
+        "date": "2023-08-04",
+        "last_updated": "2023-09-06 09:50:21.768508",
+        "depth": 3
+    },
+    {
+        "id": 59,
+        "name": "442",
+        "date": "2017-01-01",
+        "last_updated": "2023-09-11 09:04:17.312061",
+        "depth": 3
+    },
+    {
+        "id": 121,
+        "name": "447",
+        "date": "2023-01-01",
+        "last_updated": "2023-09-11 09:04:54.703021",
+        "depth": 3
+    },
+    {
+        "id": 95,
+        "name": "455",
+        "date": "2023-01-01",
+        "last_updated": "2023-09-11 09:04:45.057080",
+        "depth": 3
+    },
+    {
+        "id": 92,
+        "name": "456",
+        "date": "2021-03-01",
+        "last_updated": "2023-09-11 09:05:08.592712",
+        "depth": 3
+    },
+    {
+        "id": 135,
+        "name": "457",
+        "date": "2023-08-31",
+        "last_updated": "2023-09-11 09:05:59.349077",
+        "depth": 3
+    },
+    {
+        "id": 142,
+        "name": "460",
+        "date": "2023-08-04",
+        "last_updated": "2023-09-11 09:05:40.860734",
+        "depth": 3
+    }
+]

solution/ui/e2e/cypress/fixtures/parts-45.json

@@ -0,0 +1,16 @@
+[
+    {
+        "id": 146,
+        "name": "95",
+        "date": "2019-11-05",
+        "last_updated": "2023-09-06 09:54:50.168999",
+        "depth": 3
+    },
+    {
+        "id": 183,
+        "name": "155",
+        "date": "2023-06-18",
+        "last_updated": "2023-09-06 09:58:34.319879",
+        "depth": 3
+    }
+]

solution/ui/e2e/cypress/support/common-commands/login.js

@@ -0,0 +1,9 @@
+// login via policy repository page for now
+export const eregsLogin = ({ username, password }) => {
+    cy.session([username, password], () => {
+        cy.visit("/policy-repository/");
+        cy.get("#id_username").type(username);
+        cy.get("#id_password").type(password);
+        cy.get("#login-form").submit();
+    });
+};

solution/ui/e2e/cypress/support/e2e.js

@@ -28,8 +28,17 @@ import "cypress-axe";
 import "cypress-plugin-tab";
 
 import { getResources, getSearchGovResources } from "./api-request-commands";
-import { checkBlockingModal, checkFlashBanner, clickHeaderLink, goHome } from"./common-commands/header";
-import { jumpToRegulationPart, jumpToRegulationPartSection } from "./common-commands/jumpTo";
+import {
+    checkBlockingModal,
+    checkFlashBanner,
+    clickHeaderLink,
+    goHome,
+} from "./common-commands/header";
+import {
+    jumpToRegulationPart,
+    jumpToRegulationPartSection,
+} from "./common-commands/jumpTo";
+import { eregsLogin } from "./common-commands/login";
 import { clickStatuteLink } from "./common-commands/statutes";
 import { validateSchema } from "./validate-schema-command";
 
@@ -41,7 +50,11 @@ Cypress.Commands.add("getResources", getResources);
 Cypress.Commands.add("getSearchGovResources", getSearchGovResources);
 Cypress.Commands.add("goHome", goHome);
 Cypress.Commands.add("jumpToRegulationPart", jumpToRegulationPart);
-Cypress.Commands.add("jumpToRegulationPartSection", jumpToRegulationPartSection);
+Cypress.Commands.add(
+    "jumpToRegulationPartSection",
+    jumpToRegulationPartSection
+);
+Cypress.Commands.add("eregsLogin", eregsLogin);
 Cypress.Commands.add("validateSchema", validateSchema);
 
 // Print cypress-axe violations to the terminal

solution/ui/regulations/.eslintrc.json

@@ -15,6 +15,7 @@
     },
     "plugins": ["vue"],
     "rules": {
+        "no-console": ["error", { "allow": ["warn", "error"] }],
         "vue/order-in-components": "off",
         "vue/no-unsupported-features": [
             "error",

solution/ui/regulations/css/scss/_application_settings.scss

@@ -129,6 +129,8 @@ $jump_to_submit_disabled: $mid_gray_3;
 $jump_to_submit_active: $mid_blue;
 $jump_to_submit_active_focus: $dark_blue;
 
+$policy_subject_chip_background: $light_blue_2;
+
 // Borders
 
 $border_color: $light_gray;
@@ -142,6 +144,7 @@ $formula_left_border: $light_blue;
 $primary_text_color: $dark_gray;
 $secondary_text_color: $mid_gray;
 $reverse_text_color: $white;
+$policy_subject_chip_text: $mid_blue;
 
 // Indicators
 
@@ -515,3 +518,16 @@ select {
         scroll-margin-top: $header_height + $view_compare_height + 37px;
     }
 }
+
+// -------------------------
+// Other Common Settings
+// -------------------------
+
+// Related Sections styles
+// used across Search Results and Policy Repository
+@mixin common-context-related-sections {
+    color: $mid_gray;
+    font-size: $font-size-sm;
+    font-weight: 400;
+    line-height: 22px;
+}

solution/ui/regulations/css/scss/main.scss

@@ -22,6 +22,7 @@ $eregs-image-path: "../images" !default;
 @import 'application_settings';
 @import 'layout';
 @import "partials/typography";
+@import "partials/related_sections";
 @import "partials/site_homepage";
 @import "partials/search";
 @import "partials/statutes";