Merge pull request #2540 from fedspendingtransparency/qat

Sprint 131 Production Deployment (Agency Stats 🚀 🚀 🚀 )
fedspendingtransparency · May 4, 2021 · 1d2b9d3 · 1d2b9d3
2 parents d4b2e73 + 1845f0e
commit 1d2b9d3
Show file tree

Hide file tree

Showing 89 changed files with 1,814 additions and 2,410 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -92,7 +92,6 @@
         "d3-sankey": "0.7.1",
         "d3-sankey0.12.3": "npm:d3-sankey@0.12.3",
         "d3-scale": "^1.0.4",
-        "d3-time": "^1.0.11",
         "data-transparency-ui": "github:fedspendingtransparency/data-transparency-ui#v2.2.1",
         "date-fns": "^2.16.1",
         "file-loader": "^3.0.1",

diff --git a/scripts/sitemaps/pages.js b/scripts/sitemaps/pages.js
@@ -21,7 +21,8 @@ const routes = [
     '/state',
     '/recipient',
     '/disaster/covid-19',
-    '/disaster/covid-19/data-sources'
+    '/disaster/covid-19/data-sources',
+    '/data-dictionary'
 ];
 
 const recipientRequestObject = {

diff --git a/src/_scss/pages/agencyV2/index.scss b/src/_scss/pages/agencyV2/index.scss
@@ -76,7 +76,7 @@
             .usda-section__container {
                 @import './tabs';
                 @include display(flex);
-                @import './overview';
+                @import './overview/overview';
                 hr {
                     height: rem(2)
                 }

diff --git a/src/_scss/pages/agencyV2/overview/_fySummary.scss b/src/_scss/pages/agencyV2/overview/_fySummary.scss
@@ -0,0 +1,38 @@
+.fy-summary {
+    padding-top: rem(50);
+    .fy-summary__heading {
+        font-size: rem(14);
+        line-height: rem(16);
+        margin: 0;
+        @include media($medium-screen) { // Desktop
+            font-size: rem(18);
+            font-weight: $font-semibold;
+            line-height: rem(23);
+        }
+    }
+    hr {
+        height: rem(1);
+        background-color: $color-gray-light;
+        margin-top: rem(5);
+    }
+    .fy-summary__row { // Desktop
+        @include display(flex);
+        padding: rem(30) 0 rem(22);
+        .fy-summary__col {
+            @include flex (1 1 25%);
+            padding: 0 rem(10);
+            border-right: solid rem(1) $color-gray-lighter;
+            &:first-of-type {
+                padding-left: 0;
+            }
+            &:last-of-type {
+                padding-right: 0;
+                border-right: 0;
+            }
+        }
+    }
+    .usa-dt-carousel { // Mobile
+        padding-top: rem(25);
+    }
+    @import './visualizationSection';
+}
diff --git a/src/_scss/pages/agencyV2/_overview.scss → ...ss/pages/agencyV2/overview/_overview.scss b/src/_scss/pages/agencyV2/_overview.scss → ...ss/pages/agencyV2/overview/_overview.scss
@@ -1,4 +1,5 @@
 .agency-overview {
+    @import './fySummary';
     width: 100%; // fix for IE
     .agency-overview__top {
         @include display(flex);
@@ -72,4 +73,5 @@
         @include button-link;
         margin-top: 0.5rem;
     }
-}
+    @import './visualizations/totalObligationsOverTime';
+}
diff --git a/src/_scss/pages/agencyV2/overview/_visualizationSection.scss b/src/_scss/pages/agencyV2/overview/_visualizationSection.scss
@@ -0,0 +1,39 @@
+.visualization-section {
+    text-align: center;
+    height: 100%;
+    .visualization-section__subtitle {
+        padding-bottom: rem(8);
+    }
+    .visualization-section__data {
+        font-size: rem(27);
+        font-weight: $font-semibold;
+        line-height: rem(34);
+        padding-bottom: rem(5);
+    }
+    .visualization-section__secondary-data {
+        font-size: $small-font-size;
+        padding-bottom: rem(12);
+    }
+    .visualization-section__viz-wrapper {
+        height: rem(208);
+        @include display(flex);
+        @include align-items(center);
+        @include justify-content(center);
+        /* TODO - remove placeholder styling once all four
+        visualizations are implemented */
+        .viz-placeholder {
+            padding: rem(40) 0;
+        }
+    }
+    .visualization-section__label {
+        padding-top: rem(15);
+    }
+    @include media($medium-screen) {
+        // Desktop
+        .visualization-section__data {
+            font-size: rem(30);
+            line-height: rem(38);
+            padding-bottom: rem(10);
+        }
+    }
+}
diff --git a/src/_scss/pages/agencyV2/visualizations/_totalObligationsOverTime.scss b/src/_scss/pages/agencyV2/visualizations/_totalObligationsOverTime.scss
@@ -0,0 +1,39 @@
+.total-obligations-over-time-visualization-container {
+  .usda-message {
+    padding: 0;
+    margin-bottom: rem(100);
+  }
+  .total-obligations-over-time-svg {
+    .total-obligations-over-time-svg-body {
+      .paths {
+        .path {
+          stroke: $color-cool-blue;
+          stroke-width: 1;
+          fill: none;
+        }
+        .area-path {
+          fill: $color-cool-blue-lightest;
+          &.jon {
+            stroke: $color-cool-blue;
+            stroke-width: 1;
+            fill: none;
+          }
+        }
+      }
+      .total-obligations-over-time-svg-axis {
+        line {
+          stroke: $color-gray-light;
+          stroke-width: 1;
+        }
+        .x-axis {
+          .x-axis-labels {
+            text {
+              font-size: rem(14);
+              text-anchor: middle;
+            }
+          }
+        }
+      }
+    }
+  }
+}
diff --git a/src/_scss/pages/bulkDownload/bulkDownloadPage.scss b/src/_scss/pages/bulkDownload/bulkDownloadPage.scss
@@ -26,7 +26,6 @@
         .bulk-download__data {
             @import "downloadData";
             @import "archive/archive";
-            @import "dictionary/dictionary";
             @import "defCheckbox";
             @import "metadataPage";
             @include span-columns(16);

diff --git a/src/_scss/pages/bulkDownload/dictionary/dictionary.scss b/src/_scss/pages/bulkDownload/dictionary/dictionary.scss
diff --git a/src/_scss/pages/data-sources/index.scss b/src/_scss/pages/data-sources/index.scss
@@ -22,8 +22,6 @@
         .about-content-wrapper {
             @media(min-width: $medium-screen) {
                 margin: rem(20) rem(20) rem(20) 0;
-            }
-            @media(min-width: $tablet-screen) {
                 width: 70%;
             }
             .about-padded-content {
@@ -39,6 +37,7 @@
                     }
                 }
                 .about-section-content ol {
+                    font-size: rem(18);
                     &.about-instructions {
                         font-family: monospace;
                         padding: 3rem 5rem;
@@ -54,6 +53,11 @@
                 .about-section-content ul li ul{
                     margin-bottom: 3rem;
                 }
+                .about-section-content_custom-list {
+                    list-style-type: none;
+                    padding-left: 1.5rem;
+                    font-style: italic;
+                }
             }
             .about-content {
                 width: 100%;

diff --git a/...Download/dictionary/_dictionaryTable.scss → ...ages/dataDictionary/_dictionaryTable.scss b/...Download/dictionary/_dictionaryTable.scss → ...ages/dataDictionary/_dictionaryTable.scss
diff --git a/...ages/bulkDownload/dictionary/_header.scss → src/_scss/pages/dataDictionary/_header.scss b/...ages/bulkDownload/dictionary/_header.scss → src/_scss/pages/dataDictionary/_header.scss
diff --git a/...s/bulkDownload/dictionary/_searchBar.scss → ...scss/pages/dataDictionary/_searchBar.scss b/...s/bulkDownload/dictionary/_searchBar.scss → ...scss/pages/dataDictionary/_searchBar.scss
diff --git a/...ages/bulkDownload/dictionary/_sorter.scss → src/_scss/pages/dataDictionary/_sorter.scss b/...ages/bulkDownload/dictionary/_sorter.scss → src/_scss/pages/dataDictionary/_sorter.scss
diff --git a/src/_scss/pages/dataDictionary/dataDictionaryPage.scss b/src/_scss/pages/dataDictionary/dataDictionaryPage.scss
@@ -0,0 +1,60 @@
+.usa-da-data-dictionary-page {
+	@import 'all';
+	@import 'layouts/default/default';
+	@import 'layouts/default/stickyHeader/header';
+
+	#main-content {
+		@import '../../mixins/fullSectionWrap';
+		@import '../../components/pageLoading';
+		@include fullSectionWrap(($global-mrg * 2), ($global-mrg * 2));
+
+		background-color: $color-white;
+		box-shadow: $container-shadow;
+		border-top: 1px solid $color-gray-border;
+		border-right: 1px solid $color-gray-border;
+		border-bottom: 1px solid $color-gray-border;
+		padding: rem(30) rem(20);
+
+		.data-dictionary {
+			@include media($medium-screen) {
+				padding: 0 rem(30);
+			}
+			.data-dictionary__title {
+				margin-top: 0;
+				font-weight: 400;
+			}
+			.data-dictionary__intro {
+				font-size: $small-font-size;
+			}
+			.data-dictionary__search-download {
+				@include display(flex);
+				@include justify-content(space-between);
+			}
+			.data-dictionary__download {
+				@include align-self(center);
+				padding-bottom: rem(5);
+				.data-dictionary__download-link {
+					@include display(flex);
+					@include align-items(center);
+					.data-dictionary__download-icon {
+						@include display(flex);
+						@include flex(0 0 auto);
+						height: rem(15);
+						width: rem(15);
+						padding-right: rem(5);
+						.usa-da-spreadsheet {
+							height: rem(15);
+							width: rem(15);
+						}
+					}
+					font-size: $small-font-size;
+				}
+			}
+
+			.data-dictionary__table-wrapper {
+				@import './_dictionaryTable';
+			}
+			@import './_searchBar';
+		}
+	}
+}
diff --git a/src/_scss/pages/search/results/visualizations/geo/geoVisualization.scss b/src/_scss/pages/search/results/visualizations/geo/geoVisualization.scss
@@ -22,4 +22,8 @@
 
     @import "./_disclaimer";
     @import "./_message";
+    @import 'components/Note';
+    .default-note {
+      padding-top: 0;
+    }
 }
diff --git a/src/data/data-limitations.pdf b/src/data/data-limitations.pdf
diff --git a/src/js/helpers/agencyV2Helper.js → src/js/apis/agencyV2APIs.js b/src/js/helpers/agencyV2Helper.js → src/js/apis/agencyV2APIs.js
@@ -1,9 +1,9 @@
 /**
- * agencyV2Helper.js
+ * agencyV2APIs.js
  * Created by Lizzie Salita 5/26/20
  */
 
-import { apiRequest } from './apiRequest';
+import { apiRequest } from '../helpers/apiRequest';
 
 export const fetchSpendingCount = (agencyId, fy, type) => apiRequest({
     url: `v2/agency/${agencyId}/${type}/count/`,
@@ -18,7 +18,7 @@ export const fetchSpendingByCategory = (agencyId, type, params) => apiRequest({
 });
 
 export const fetchBudgetaryResources = (agencyId) => apiRequest({
-    url: `v2/agency/${agencyId}/budgetary_resources/?fiscal_year=2020`
+    url: `v2/agency/${agencyId}/budgetary_resources/`
 });
 
 export const fetchAgencyOverview = (code, fy) => apiRequest({

diff --git a/src/js/apis/dataDictionary.js b/src/js/apis/dataDictionary.js
@@ -0,0 +1,5 @@
+import { apiRequest } from '../helpers/apiRequest';
+
+export const fetchDataDictionary = () => apiRequest({
+    url: 'v2/references/data_dictionary/'
+});
diff --git a/src/js/components/about/MoreInfo.jsx b/src/js/components/about/MoreInfo.jsx
@@ -24,7 +24,7 @@ const MoreInfo = () => (
                     FAQs
                 </a>
                 &nbsp;and the&nbsp;
-                <Link to="/download_center/data_dictionary">
+                <Link to="/data-dictionary">
                     Data Dictionary
                 </Link>
                 .

diff --git a/src/js/components/aboutTheData/AboutTheDataPage.jsx b/src/js/components/aboutTheData/AboutTheDataPage.jsx
@@ -11,9 +11,11 @@ import { Link, useLocation } from "react-router-dom";
 import Header from "containers/shared/HeaderContainer";
 import Footer from "containers/Footer";
 import { getAllAgenciesEmail } from "helpers/aboutTheDataHelper";
+import { aboutTheDataMetaTags } from 'helpers/metaTagHelper';
 import { getBaseUrl, handleShareOptionClick } from 'helpers/socialShare';
 import { getStickyBreakPointForSidebar } from 'helpers/stickyHeaderHelper';
 
+import MetaTags from 'components/sharedComponents/metaTags/MetaTags';
 import AboutTheDataModal from "components/aboutTheData/AboutTheDataModal";
 import { LoadingWrapper } from "components/sharedComponents/Loading";
 import AgenciesContainer from 'containers/aboutTheData/AgenciesContainer';
@@ -72,6 +74,7 @@ const AboutTheDataPage = ({ history }) => {
 
     return (
         <div className="about-the-data about-the-data_agencies-page">
+            <MetaTags {...aboutTheDataMetaTags} />
             <Header />
             <PageHeader
                 title="Agency Submission Statistics"
@@ -85,7 +88,7 @@ const AboutTheDataPage = ({ history }) => {
                             on a quarterly and/or monthly basis to USAspending.gov. The table below
                             shows information about the status and content of these submissions. It will
                             be updated as agencies publish/certify new submissions or
-                            republish/recertify existing submissions. For more information about the data in this table, visit <Link to="data-sources">the Data Sources and Methodology page.</Link>
+                            republish/recertify existing submissions. For more information about the data in this table, visit <Link to="/submission-statistics/data-sources">the Data Sources and Methodology page.</Link>
                         </p>
                     </div>
                     <LoadingWrapper isLoading={!activeTab}>