Merge branch 'main' into NOREF/generic_typed_array

.github/workflows/mto_dev_deploy.yml

@@ -0,0 +1,35 @@
+name: Deploy MTO feature branch to DEV
+
+on:
+  push:
+    branches:
+      - feature/MINT-3175_mto
+
+concurrency:
+  group: mto-dev-deploy
+
+jobs:
+  run_tests:
+    uses: ./.github/workflows/run_tests.yml
+    secrets: inherit
+
+  build_frontend_assets:
+    strategy:
+      matrix:
+        env: [dev]
+    uses: ./.github/workflows/build_frontend_assets.yml
+    with:
+      env: ${{ matrix.env }}
+    secrets: inherit
+
+  build_application_images:
+    uses: ./.github/workflows/build_application_images.yml
+    needs: run_tests
+    secrets: inherit
+
+  deploy_dev:
+    needs: [build_application_images, build_frontend_assets]
+    uses: ./.github/workflows/deploy_to_environment.yml
+    with:
+      env: dev
+    secrets: inherit

go.mod

@@ -40,7 +40,7 @@ require (
 
 require (
 	github.com/andybalholm/brotli v1.1.0 // indirect
-	github.com/charmbracelet/x/ansi v0.4.0 // indirect
+	github.com/charmbracelet/x/ansi v0.4.2 // indirect
 	github.com/charmbracelet/x/term v0.2.0 // indirect
 	github.com/erikgeiser/coninput v0.0.0-20211004153227-1c3628e74d0f // indirect
 	github.com/graph-gophers/dataloader/v7 v7.1.0
@@ -53,7 +53,7 @@ require (
 require (
 	github.com/aymanbagabas/go-osc52/v2 v2.0.1 // indirect
 	github.com/aymerick/douceur v0.2.0 // indirect
-	github.com/charmbracelet/lipgloss v0.13.0
+	github.com/charmbracelet/lipgloss v1.0.0
 	github.com/go-jose/go-jose/v3 v3.0.3 // indirect
 	github.com/gorilla/css v1.0.1 // indirect
 	github.com/hashicorp/golang-lru/v2 v2.0.3 // indirect

go.sum

@@ -24,10 +24,10 @@ github.com/cenkalti/backoff/v4 v4.1.3 h1:cFAlzYUlVYDysBEH2T5hyJZMh3+5+WCBvSnK6Q8
 github.com/cenkalti/backoff/v4 v4.1.3/go.mod h1:scbssz8iZGpm3xbr14ovlUdkxfGXNInqkPWOWmG2CLw=
 github.com/charmbracelet/bubbletea v1.1.2 h1:naQXF2laRxyLyil/i7fxdpiz1/k06IKquhm4vBfHsIc=
 github.com/charmbracelet/bubbletea v1.1.2/go.mod h1:9HIU/hBV24qKjlehyj8z1r/tR9TYTQEag+cWZnuXo8E=
-github.com/charmbracelet/lipgloss v0.13.0 h1:4X3PPeoWEDCMvzDvGmTajSyYPcZM4+y8sCA/SsA3cjw=
-github.com/charmbracelet/lipgloss v0.13.0/go.mod h1:nw4zy0SBX/F/eAO1cWdcvy6qnkDUxr8Lw7dvFrAIbbY=
-github.com/charmbracelet/x/ansi v0.4.0 h1:NqwHA4B23VwsDn4H3VcNX1W1tOmgnvY1NDx5tOXdnOU=
-github.com/charmbracelet/x/ansi v0.4.0/go.mod h1:dk73KoMTT5AX5BsX0KrqhsTqAnhZZoCBjs7dGWp4Ktw=
+github.com/charmbracelet/lipgloss v1.0.0 h1:O7VkGDvqEdGi93X+DeqsQ7PKHDgtQfF8j8/O2qFMQNg=
+github.com/charmbracelet/lipgloss v1.0.0/go.mod h1:U5fy9Z+C38obMs+T+tJqst9VGzlOYGj4ri9reL3qUlo=
+github.com/charmbracelet/x/ansi v0.4.2 h1:0JM6Aj/g/KC154/gOP4vfxun0ff6itogDYk41kof+qk=
+github.com/charmbracelet/x/ansi v0.4.2/go.mod h1:dk73KoMTT5AX5BsX0KrqhsTqAnhZZoCBjs7dGWp4Ktw=
 github.com/charmbracelet/x/term v0.2.0 h1:cNB9Ot9q8I711MyZ7myUR5HFWL/lc3OpU8jZ4hwm0x0=
 github.com/charmbracelet/x/term v0.2.0/go.mod h1:GVxgxAbjUrmpvIINHIQnJJKpMlHiZ4cktEQCN6GWyF0=
 github.com/contribsys/faktory v1.9.1 h1:iHR54Kl4akiZPchVNRMQHxGGyUphr9g2lRNjBYssrvc=

package.json

@@ -3,14 +3,14 @@
   "version": "0.1.0",
   "private": true,
   "dependencies": {
-    "@apollo/client": "^3.11.8",
+    "@apollo/client": "^3.11.9",
     "@babel/plugin-syntax-class-properties": "^7.12.13",
     "@json2csv/formatters": "^7.0.6",
     "@json2csv/plainjs": "^7.0.6",
     "@json2csv/transforms": "^7.0.6",
     "@okta/okta-auth-js": "^6.1.0",
     "@okta/okta-react": "^6.9.0",
-    "@okta/okta-signin-widget": "^7.25.0",
+    "@okta/okta-signin-widget": "^7.25.1",
     "@tiptap/core": "^2.9.1",
     "@tiptap/extension-character-count": "^2.9.1",
     "@tiptap/extension-document": "^2.9.1",
@@ -52,10 +52,10 @@
     "formik": "^2.4.6",
     "graphql": "^15.8.0",
     "html-react-parser": "^5.1.18",
-    "i18next": "^23.16.4",
+    "i18next": "^23.16.5",
     "i18next-browser-languagedetector": "^5.0.0",
     "istanbul-lib-coverage": "^3.2.2",
-    "launchdarkly-react-client-sdk": "^3.5.0",
+    "launchdarkly-react-client-sdk": "^3.6.0",
     "lodash": "^4.17.21",
     "luxon": "^3.5.0",
     "no-scroll": "^2.1.1",
@@ -64,14 +64,14 @@
     "react-autosuggest": "^10.1.0",
     "react-dom": "^18.3.1",
     "react-ga4": "^2.1.0",
-    "react-hook-form": "^7.53.0",
+    "react-hook-form": "^7.53.2",
     "react-i18next": "^13.4.1",
     "react-idle-timer": "^5.7.2",
     "react-media": "^1.10.0",
     "react-modal": "^3.16.1",
     "react-redux": "^7.1.1",
     "react-router-dom": "^5.1.2",
-    "react-select": "^5.8.2",
+    "react-select": "^5.8.3",
     "react-table": "^7.8.0",
     "react-to-print": "^2.15.1",
     "redux": "^4.0.4",
@@ -130,7 +130,7 @@
   "devDependencies": {
     "@babel/core": "^7.26.0",
     "@babel/preset-env": "^7.26.0",
-    "@cypress/code-coverage": "^3.13.5",
+    "@cypress/code-coverage": "^3.13.6",
     "@cypress/webpack-preprocessor": "^6.0.1",
     "@graphql-codegen/cli": "5.0.3",
     "@graphql-codegen/client-preset": "^4.5.0",
@@ -154,7 +154,7 @@
     "apollo-link-error": "^1.1.13",
     "autoprefixer": "^10.4.20",
     "babel-loader": "^9.2.1",
-    "cypress": "^13.15.1",
+    "cypress": "^13.15.2",
     "cypress-otp": "^1.0.3",
     "eslint": "^8.57.0",
     "eslint-config-airbnb": "^18.0.1",

src/components/CRAndTDLSidePanel/__snapshots__/index.test.tsx.snap

@@ -26,12 +26,12 @@ exports[`The CRAndTDLSidePanel component > renders TDL without crashing (flag di
             Test Title
           </h1>
           <div
-            class="echimp-card__cr-status"
+            class="echimp-card__status"
           >
             <p
               class="text-bold"
             >
-              TDL Status
+              TDL Status:
             </p>
             <p>
               Test Status

src/components/CRAndTDLSidePanel/index.tsx

@@ -4,6 +4,7 @@ import { Grid, GridContainer, Icon } from '@trussworks/react-uswds';
 import i18n from 'config/i18n';
 import { useFlags } from 'launchdarkly-react-client-sdk';
 
+import { DataOrNoData } from 'components/EChimpCards/EChimpCard';
 import ExternalLink from 'components/ExternalLink';
 import TruncatedText from 'components/TruncatedText';
 
@@ -77,18 +78,15 @@ const CRAndTDLSidePanel = ({
               </div>
             )}
 
-            {crStatus && (
-              <div className="echimp-card__cr-status">
-                <p className="text-bold">{crtdlsT('echimpCard.crStatus')}:</p>
-                <p>{crStatus}</p>
-              </div>
-            )}
-            {status && (
-              <div className="echimp-card__cr-status">
-                <p className="text-bold">{crtdlsT('echimpCard.tdlStatus')}</p>
-                <p>{status}</p>
-              </div>
-            )}
+            <div className="echimp-card__status">
+              <p className="text-bold">
+                {isCR
+                  ? crtdlsT('echimpCard.crStatus')
+                  : crtdlsT('echimpCard.tdlStatus')}
+                :
+              </p>
+              <DataOrNoData data={crStatus ?? status} />
+            </div>
           </div>
           <div className="sidepanel__content">
             {isCR ? (
@@ -97,29 +95,29 @@ const CRAndTDLSidePanel = ({
                   <p className="text-bold">
                     {crtdlsT('echimpCard.implementationDate')}
                   </p>
-                  <p>{implementationDate}</p>
+                  <DataOrNoData data={implementationDate} />
                 </div>
-                {initiator && (
-                  <div>
-                    <p className="text-bold">
-                      {crtdlsT('echimpCard.initiator')}
-                    </p>
-                    {/* Currently initiator returns name in ALL CAPS */}
-                    <p>{properlyCapitalizeInitiator(initiator)}</p>
-                  </div>
-                )}
-                {crSummary && (
-                  <div className="sidepanel--full-width">
-                    <p className="text-bold">
-                      {crtdlsT('echimpCard.crSummary')}
-                    </p>
+                <div>
+                  <p className="text-bold">{crtdlsT('echimpCard.initiator')}</p>
+                  {/* Currently initiator returns name in ALL CAPS */}
+                  <DataOrNoData
+                    data={initiator && properlyCapitalizeInitiator(initiator)}
+                  />
+                </div>
+                <div className="sidepanel--full-width">
+                  <p className="text-bold">{crtdlsT('echimpCard.crSummary')}</p>
+                  {crSummary?.rawContent ? (
                     <TruncatedText
                       id={id}
                       text={crSummary?.rawContent}
                       lineClamp={5}
                     />
-                  </div>
-                )}
+                  ) : (
+                    <p className="text-base text-italic">
+                      {crtdlsT('echimpCard.noData')}
+                    </p>
+                  )}
+                </div>
 
                 <div>
                   <p className="text-bold">
@@ -147,15 +145,15 @@ const CRAndTDLSidePanel = ({
                   <p className="text-bold">
                     {crtdlsT('echimpCard.relatedCrTdl')}
                   </p>
-                  <p>{relatedCrTdlNumbers}</p>
+                  <DataOrNoData data={relatedCrTdlNumbers} />
                 </div>
               </>
             ) : (
               // If TDL, then render the following
               <div>
                 <p className="text-bold">{crtdlsT('echimpCard.issuedDate')}</p>
                 {/* Currently issuedDate returns '2024-07-24 00:00:00' */}
-                <p>{issuedDate?.split(' ')[0]}</p>
+                <DataOrNoData data={issuedDate} />
               </div>
             )}
 

src/components/EChimpCards/EChimpCard.tsx

@@ -29,6 +29,16 @@ export type EChimpCardProps = {
   isCR: boolean;
 };
 
+export const DataOrNoData = ({ data }: { data: string | null | undefined }) => {
+  const { t: crtdlsT } = useTranslation('crtdlsMisc');
+  if (!data) {
+    return (
+      <p className="text-base text-italic">{crtdlsT('echimpCard.noData')}</p>
+    );
+  }
+  return <p>{data}</p>;
+};
+
 const EChimpCard = ({
   id,
   title,
@@ -82,34 +92,24 @@ const EChimpCard = ({
           </div>
         )}
 
-        {crStatus && (
-          <div className="echimp-card__status">
-            <p className="text-bold">{crtdlsT('echimpCard.crStatus')}</p>
-            <p>{crStatus}</p>
-          </div>
-        )}
-        {status && (
-          <div className="echimp-card__status">
-            <p className="text-bold">{crtdlsT('echimpCard.tdlStatus')}</p>
-            <p>{status}</p>
-          </div>
-        )}
+        <div className="echimp-card__status">
+          <p className="text-bold">
+            {isCR
+              ? crtdlsT('echimpCard.crStatus')
+              : crtdlsT('echimpCard.tdlStatus')}
+          </p>
+          <DataOrNoData data={crStatus ?? status} />
+        </div>
         <div className="echimp-card__date">
-          {implementationDate && (
-            <>
-              <p className="text-bold">
-                {crtdlsT('echimpCard.implementationDate')}
-              </p>
-              <p>{implementationDate}</p>
-            </>
-          )}
-          {issuedDate && (
-            <>
-              <p className="text-bold">{crtdlsT('echimpCard.issuedDate')}</p>
-              {/* Currently issuedDate returns '2024-07-24 00:00:00' */}
-              <p>{issuedDate?.split(' ')[0]}</p>
-            </>
-          )}
+          <p className="text-bold">
+            {isCR
+              ? crtdlsT('echimpCard.implementationDate')
+              : crtdlsT('echimpCard.issuedDate')}
+          </p>
+          {/* At the time of writing, issuedDate returns '2024-07-24 00:00:00' */}
+          <DataOrNoData
+            data={implementationDate ?? issuedDate?.split(' ')[0]}
+          />
         </div>
       </CardBody>
 

src/components/EChimpCards/EChimpCardsTable.tsx

@@ -246,10 +246,10 @@ const EChimpCardsTable = ({
           <EChimpCard
             key={card.id}
             {...card}
+            isCR={isEChimpCR(card)}
             isInReadView={isInReadView}
             setShowCRorTDLWithId={setShowCRorTDLWithId}
             setIsSidepanelOpen={setIsSidepanelOpen}
-            isCR={isEChimpCR(card)}
           />
         ))}
       </CardGroup>

src/components/EChimpCards/__snapshots__/EChimpCardsTable.test.tsx.snap

@@ -234,6 +234,20 @@ exports[`EChimpCardsTable > matches snapshot 1`] = `
             class="usa-card__body"
             data-testid="CardBody"
           >
+            <div
+              class="echimp-card__status"
+            >
+              <p
+                class="text-bold"
+              >
+                TDL Status
+              </p>
+              <p
+                class="text-base text-italic"
+              >
+                No data available
+              </p>
+            </div>
             <div
               class="echimp-card__date"
             >

src/components/MultiSelect/index.tsx

@@ -295,7 +295,7 @@ const MultiSelect = ({
         hideSelectedOptions={false}
         closeMenuOnSelect={false}
         tabSelectsValue={false}
-        onChange={selectedOptions => {
+        onChange={(selectedOptions: MultiSelectOptionProps[]) => {
           setSelected(selectedOptions);
           onChange(selectedOptions.map(option => option.value));
         }}

src/components/OktaUserSelect/index.tsx

@@ -324,8 +324,13 @@ export default function OktaUserSelect({
           : undefined
       }
       value={value ? { value, label: formatLabel(value) } : undefined}
-      onChange={item => updateContact(item?.value || null)}
-      onInputChange={(newValue, { action }) => {
+      onChange={(item: OktaUserSelectOption) =>
+        updateContact(item?.value || null)
+      }
+      onInputChange={(
+        newValue: string | undefined,
+        { action }: { action: string }
+      ) => {
         if (action !== 'input-blur' && action !== 'menu-close') {
           // If user selected a value, no need to query and debounce again
           if (action === 'set-value') {