EES-4996 add api info to data set page

Author: amyb-hiveit

src/explore-education-statistics-admin/src/pages/methodology/edit-methodology/status/MethodologyStatusPage.tsx

@@ -93,12 +93,11 @@ const MethodologyStatusPage = () => {
                 The <strong>public methodology</strong> will be accessible at:
               </p>
 
-              <p>
-                <UrlContainer
-                  data-testid="public-methodology-url"
-                  url={`${publicAppUrl}/methodology/${currentMethodology.slug}`}
-                />
-              </p>
+              <UrlContainer
+                className="govuk-!-margin-bottom-4"
+                testId="public-methodology-url"
+                url={`${publicAppUrl}/methodology/${currentMethodology.slug}`}
+              />
 
               <SummaryList>
                 <SummaryListItem term="Status">

src/explore-education-statistics-admin/src/pages/publication/components/PublicationUpdateConfirmModal.tsx

@@ -48,12 +48,12 @@ export default function PublicationUpdateConfirmModal({
         <>
           <p>The URL for this publication will change from</p>
           <UrlContainer
-            data-testid="before-url"
+            testId="before-url"
             url={`${publicAppUrl}/find-statistics/${initialPublicationSlug}`}
           />{' '}
           to{' '}
           <UrlContainer
-            data-testid="after-url"
+            testId="after-url"
             url={`${publicAppUrl}/find-statistics/${newPublicationSlug}`}
           />
         </>

src/explore-education-statistics-admin/src/pages/release/ReleaseStatusPage.tsx

@@ -94,12 +94,11 @@ const ReleaseStatusPage = () => {
         The <strong>public release</strong> will be accessible at:
       </p>
 
-      <p>
-        <UrlContainer
-          data-testid="public-release-url"
-          url={`${publicAppUrl}/find-statistics/${release.publicationSlug}/${release.slug}`}
-        />
-      </p>
+      <UrlContainer
+        className="govuk-!-margin-bottom-4"
+        testId="public-release-url"
+        url={`${publicAppUrl}/find-statistics/${release.publicationSlug}/${release.slug}`}
+      />
 
       <SummaryList>
         <SummaryListItem term="Current status">

src/explore-education-statistics-admin/src/pages/release/pre-release/ReleasePreReleaseAccessPage.tsx

@@ -73,20 +73,19 @@ const ReleasePreReleaseAccessPage = () => {
                   The <strong>pre-release</strong> will be accessible at:
                 </p>
 
-                <p>
-                  <UrlContainer
-                    data-testid="prerelease-url"
-                    url={`${
-                      window.location.origin
-                    }${generatePath<ReleaseRouteParams>(
-                      preReleaseContentRoute.path,
-                      {
-                        publicationId: release.publicationId,
-                        releaseId: release.id,
-                      },
-                    )}`}
-                  />
-                </p>
+                <UrlContainer
+                  className="govuk-!-margin-bottom-4"
+                  testId="prerelease-url"
+                  url={`${
+                    window.location.origin
+                  }${generatePath<ReleaseRouteParams>(
+                    preReleaseContentRoute.path,
+                    {
+                      publicationId: release.publicationId,
+                      releaseId: release.id,
+                    },
+                  )}`}
+                />
               </>
             )}
 

src/explore-education-statistics-common/src/components/UrlContainer.tsx

@@ -1,35 +1,49 @@
+import styles from '@common/components/UrlContainer.module.scss';
 import classNames from 'classnames';
-import React from 'react';
-import styles from './UrlContainer.module.scss';
+import React, { ReactNode } from 'react';
 
 interface Props {
-  'data-testid'?: string;
   className?: string;
+  label?: string | ReactNode;
+  labelHidden?: boolean;
+  testId?: string;
   url: string;
 }
 
 const UrlContainer = ({
-  'data-testid': dataTestId = 'url',
   className,
+  label = 'Url',
+  labelHidden = true,
+  testId = 'url',
   url,
 }: Props) => {
   const handleFocus = (event: React.FocusEvent<HTMLInputElement>) =>
     event.target.select();
   return (
-    <>
-      <label htmlFor={dataTestId} className="govuk-visually-hidden">
-        Url
+    <div
+      className={classNames(className, {
+        'dfe-flex dfe-align-items--center': !labelHidden,
+      })}
+    >
+      <label
+        htmlFor={testId}
+        className={classNames({
+          'govuk-visually-hidden': labelHidden,
+          'govuk-!-margin-right-2': !labelHidden,
+        })}
+      >
+        {label}
       </label>
       <input
         type="text"
         value={url}
-        id={dataTestId}
-        className={classNames(styles.url, className)}
-        data-testid={dataTestId}
+        id={testId}
+        className={styles.url}
+        data-testid={testId}
         onFocus={handleFocus}
         readOnly
       />
-    </>
+    </div>
   );
 };
 

src/explore-education-statistics-common/src/services/api/index.ts

@@ -15,3 +15,9 @@ export const dataApi = new Client({
   requestInterceptors: [networkActivityRequestInterceptor],
   responseInterceptors: [networkActivityResponseInterceptor],
 });
+
+export const publicApi = new Client({
+  baseURL: `${process.env.PUBLIC_API_BASE_URL}/v${process.env.PUBLIC_API_VERSION}`,
+  requestInterceptors: [networkActivityRequestInterceptor],
+  responseInterceptors: [networkActivityResponseInterceptor],
+});

src/explore-education-statistics-frontend/.env

@@ -1,5 +1,8 @@
 CONTENT_API_BASE_URL=http://localhost:5010/api
 DATA_API_BASE_URL=http://localhost:5000/api
+PUBLIC_API_BASE_URL=https://localhost:5031/api
+PUBLIC_API_VERSION=1.0
+PUBLIC_API_DOCUMENTATION_URL=TODO-GUIDANCE-URL
 NOTIFICATION_API_BASE_URL=http://localhost:7073/api
 GA_TRACKING_ID=
 PUBLIC_URL=http://localhost:3000/

src/explore-education-statistics-frontend/next.config.js

@@ -16,6 +16,9 @@ const nextConfig = {
     APP_ENV: process.env.APP_ENV,
     CONTENT_API_BASE_URL: process.env.CONTENT_API_BASE_URL,
     DATA_API_BASE_URL: process.env.DATA_API_BASE_URL,
+    PUBLIC_API_BASE_URL: process.env.PUBLIC_API_BASE_URL,
+    PUBLIC_API_VERSION: process.env.PUBLIC_API_VERSION,
+    PUBLIC_API_DOCUMENTATION_URL: process.env.PUBLIC_API_DOCUMENTATION_URL,
     NOTIFICATION_API_BASE_URL: process.env.NOTIFICATION_API_BASE_URL,
     APPINSIGHTS_INSTRUMENTATIONKEY: process.env.APPINSIGHTS_INSTRUMENTATIONKEY,
     GA_TRACKING_ID: process.env.GA_TRACKING_ID,