Feature/204 swagger UI page

app/client/package.json

@@ -32,6 +32,7 @@
     "@types/node": "18.8.5",
     "@types/react": "18.0.21",
     "@types/react-dom": "18.0.6",
+    "@types/swagger-ui-react": "4.18.0",
     "web-vitals": "3.0.3"
   },
   "dependencies": {
@@ -48,6 +49,7 @@
     "react-scripts": "5.0.1",
     "react-select": "5.6.0",
     "remark-gfm": "3.0.1",
+    "swagger-ui-react": "4.18.2",
     "typescript": "4.8.4",
     "uswds": "2.13.3"
   },

app/client/src/components/app.tsx

@@ -4,6 +4,7 @@ import { BrowserRouter, Navigate, Routes, Route } from 'react-router-dom';
 import 'uswds/css/uswds.css';
 import 'bootstrap/dist/css/bootstrap-grid.min.css';
 // components
+import ApiDocs from 'routes/apiDocs';
 import { Home, QueryBuilder } from 'routes/home';
 import NationalDownloads from 'routes/nationalDownloads';
 import ErrorPage from 'routes/404';
@@ -110,7 +111,7 @@ function useDisclaimerBanner() {
 }
 
 // workaround to preserve the href in the url, without this
-// the ErrorPage will 
+// the ErrorPage will
 // redirect to http://localhost:9090/404.html?src=http://localhost:3000/404
 // instead of  http://localhost:9090/404.html?src=http://localhost:3000/some-url-doesnt-exist
 const href = window.location.href;
@@ -124,6 +125,7 @@ export function App() {
     <BrowserRouter basename={serverBasePath}>
       <Routes>
         <Route index element={<Navigate to="/attains" replace />} />
+        <Route path="/api-docs" element={<ApiDocs />} />
         <Route path="/attains" element={<Home />}>
           <Route path=":profile" element={<QueryBuilder />} />
         </Route>

app/client/src/config/profiles.ts

@@ -109,6 +109,7 @@ export const profiles = {
       'region',
       'reportingCycle',
       'sizeSource',
+      'sourceScale',
       'state',
       'useClassName',
       'waterSize',

app/client/src/routes/apiDocs.tsx

@@ -0,0 +1,27 @@
+import { useNavigate } from 'react-router-dom';
+import SwaggerUI from 'swagger-ui-react';
+import 'swagger-ui-react/swagger-ui.css';
+import { ReactComponent as Home } from 'uswds/img/usa-icons/home.svg';
+// components
+import { NavButton } from 'components/navButton';
+// config
+import { serverUrl } from 'config';
+
+export default ApiDocs;
+
+export function ApiDocs() {
+  const navigate = useNavigate();
+
+  return (
+    <>
+      <NavButton label="Home" icon={Home} onClick={() => navigate('/')} />
+      <div>
+        <SwaggerUI
+          url={`${serverUrl}/api/getFile?filepath=swagger/attains.json`}
+          deepLinking={true}
+          defaultModelsExpandDepth={-1}
+        />
+      </div>
+    </>
+  );
+}

app/client/src/routes/home.tsx

@@ -1162,7 +1162,7 @@ function filterDynamicOptions({
     inputValue: string,
     signal?: AbortSignal,
   ): Promise<Array<Option>> {
-    let url = `${serverUrl}/api/${profile}/values/${fieldName}?text=${inputValue}&direction=${direction}`;
+    let url = `${serverUrl}/api/profiles/${profile}/columns/${fieldName}/values?text=${inputValue}&direction=${direction}`;
     if (isNotEmpty(limit)) url += `&limit=${limit}`;
     if (isNotEmpty(sourceField) && isNotEmpty(sourceValue)) {
       url += `&${sourceField}=${sourceValue}`;

app/client/src/styles.css

@@ -142,3 +142,18 @@
 .glossary-term:hover svg {
   color: #1a4480;
 }
+
+/* --- SwaggerUI --- */
+.swagger-ui td,
+.swagger-ui th {
+  background-color: inherit;
+  border: none;
+}
+
+.swagger-ui .info {
+  margin-top: 0;
+}
+
+hgroup.main a.link {
+  display: none;
+}

app/server/app/routes/api.js

@@ -246,7 +246,7 @@ export default function (app, basePath) {
   });
 
   // create post requests
-  router.get('/:profile/values/:column', function (req, res) {
+  router.get('/profiles/:profile/columns/:column/values', function (req, res) {
     const profile = tableConfig[req.params.profile];
     if (!profile) {
       return res

etl/app/content-private/domainValueMappings.json

@@ -1,6 +1,7 @@
 {
   "actionAgency": {
     "domainName": "AgencyCode"
+    "valueField": "name"
   },
   "actionType": {
     "domainName": "ActionType",