Merge pull request #392 from DTS-STN/date-component

Removing DS Date.

.env.example

@@ -1,4 +1,3 @@
-NEXT_PUBLIC_BUILD_DATE = 12345
 AEM_GRAPHQL_ENDPOINT = "test.com"
 LOGGING_LEVEL = " info or debug" 
 MSCA_BASE_URL = "MSCA base url"

.teamcity/settings.kts

@@ -85,7 +85,7 @@ object Build_Main: BuildType({
                     path = "Dockerfile"
                 }
                 namesAndTags = "%env.ACR_DOMAIN%/%env.PROJECT%:%env.DOCKER_TAG%"
-                commandArgs = "--pull --build-arg BUILD_DATE=%system.build.start.date% --build-arg ENV_EXAMPLE=%env.ENV_EXAMPLE% --build-arg NEXT_PUBLIC_ENV_EXAMPLE=%env.PUBLIC_ENV_EXAMPLE%"
+                commandArgs = "--pull --build-arg ENV_EXAMPLE=%env.ENV_EXAMPLE% --build-arg NEXT_PUBLIC_ENV_EXAMPLE=%env.PUBLIC_ENV_EXAMPLE%"
             }
         }
         script {
@@ -147,7 +147,7 @@ object Build_Performance: BuildType({
                     path = "Dockerfile"
                 }
                 namesAndTags = "%env.ACR_DOMAIN%/%env.PROJECT%:%env.DOCKER_TAG%"
-                commandArgs = "--pull --build-arg BUILD_DATE=%system.build.start.date% --build-arg ENV_EXAMPLE=%env.ENV_EXAMPLE% --build-arg NEXT_PUBLIC_ENV_EXAMPLE=%env.PUBLIC_ENV_EXAMPLE%"
+                commandArgs = "--pull --build-arg ENV_EXAMPLE=%env.ENV_EXAMPLE% --build-arg NEXT_PUBLIC_ENV_EXAMPLE=%env.PUBLIC_ENV_EXAMPLE%"
             }
         }
         script {
@@ -208,7 +208,7 @@ object Build_Dynamic: BuildType({
                     path = "Dockerfile"
                 }
                 namesAndTags = "%env.ACR_DOMAIN%/%env.PROJECT%:%env.DOCKER_TAG%"
-                commandArgs = "--pull --build-arg BUILD_DATE=%system.build.start.date% --build-arg ENV_EXAMPLE=%env.ENV_EXAMPLE% --build-arg NEXT_PUBLIC_ENV_EXAMPLE=%env.PUBLIC_ENV_EXAMPLE%"
+                commandArgs = "--pull --build-arg ENV_EXAMPLE=%env.ENV_EXAMPLE% --build-arg NEXT_PUBLIC_ENV_EXAMPLE=%env.PUBLIC_ENV_EXAMPLE%"
             }
         }
         script {

Dockerfile

@@ -7,8 +7,6 @@ COPY . .
 FROM base AS build
 
 # Build envs
-ARG BUILD_DATE
-ENV BUILD_DATE=$BUILD_DATE
 ARG AEM_GRAPHQL_ENDPOINT
 ENV AEM_GRAPHQL_ENDPOINT=$AEM_GRAPHQL_ENDPOINT
 ARG AUTH_ECAS_BASE_URL

__tests__/components/Date.test.js

@@ -0,0 +1,24 @@
+import { render, screen } from '@testing-library/react'
+import '@testing-library/jest-dom/extend-expect'
+import { axe, toHaveNoViolations } from 'jest-axe'
+import { Date } from '../../components/Date'
+
+expect.extend(toHaveNoViolations)
+
+describe('Date', () => {
+  it('renders Date', () => {
+    render(<Date id="testID" date="20230331T00001" label="label" />)
+    const title = screen.getByTestId('testID')
+    const caption = screen.getByText('20230331')
+    const label = screen.getByText('label')
+    expect(title).toBeInTheDocument()
+    expect(caption).toBeInTheDocument()
+    expect(label).toBeInTheDocument()
+  })
+
+  it('has no a11y viollations', async () => {
+    const { container } = render(<Date id="testID" date="20230331" />)
+    const results = await axe(container)
+    expect(results).toHaveNoViolations()
+  })
+})

components/Date.js

@@ -0,0 +1,35 @@
+import PropTypes from 'prop-types'
+
+export function Date(props) {
+  const { id, label, date } = props
+  const dateFormatted = date ? date.split('T')[0] : 'NA'
+  return (
+    <dl id={id} data-testid={id} className="mt-8 py-2 font-body">
+      <dt className="inline">{label}</dt>
+      <dd className="inline">
+        {dateFormatted === 'NA' ? (
+          <time>{` ${dateFormatted}`}</time>
+        ) : (
+          <time dateTime={dateFormatted}>{` ${dateFormatted}`}</time>
+        )}
+      </dd>
+    </dl>
+  )
+}
+
+Date.propTypes = {
+  /**
+   * component id
+   */
+  id: PropTypes.string,
+
+  /**
+   * Text to show before date, defaults to "Date Modified: "
+   */
+  label: PropTypes.string,
+
+  /**
+   * Date string in format yyyyMMdd
+   */
+  date: PropTypes.string,
+}

graphql/mappers/privacy-notice-terms-conditions.js

@@ -17,6 +17,7 @@ export async function getPrivacyConditionContent() {
   const mappedPrivacyConditions = {
     en: {
       id: response.data.schPagev1ByPath.item.scId,
+      dateModified: response.data.schPagev1ByPath.item.scDateModifiedOverwrite,
       breadcrumb:
         response.data.schPagev1ByPath.item.scBreadcrumbParentPages.map(
           (level) => {
@@ -37,6 +38,7 @@ export async function getPrivacyConditionContent() {
     },
     fr: {
       id: response.data.schPagev1ByPath.item.scId,
+      dateModified: response.data.schPagev1ByPath.item.scDateModifiedOverwrite,
       breadcrumb:
         response.data.schPagev1ByPath.item.scBreadcrumbParentPages.map(
           (level) => {

graphql/queries/privacy-notice-terms-conditions.graphql

@@ -8,6 +8,7 @@
     scPageNameFr
     scTitleEn
     scTitleFr
+    scDateModifiedOverwrite
     scBreadcrumbParentPages{
         ... on SCHPagev1Model {
               scId

next.config.js

@@ -1,12 +1,3 @@
-//formatting TC Date
-const builddate = process.env.BUILD_DATE
-  ? process.env.BUILD_DATE.substring(0, 4) +
-    '-' +
-    process.env.BUILD_DATE.substring(4, 6) +
-    '-' +
-    process.env.BUILD_DATE.substring(6, 8)
-  : 'DATE-NA'
-
 const REWRITES = [
   {
     source: '/contactez-nous',
@@ -80,7 +71,6 @@ const securityHeaders = [
 
 module.exports = {
   env: {
-    NEXT_PUBLIC_BUILD_DATE: builddate,
     LOGGING_LEVEL: process.env.LOGGING_LEVEL,
   },
   reactStrictMode: true,

pages/privacy-notice-terms-conditions.js

@@ -1,5 +1,5 @@
 import PropTypes from 'prop-types'
-import { Date } from '@dts-stn/service-canada-design-system'
+import { Date } from '../components/Date'
 import Heading from '../components/Heading'
 import ContextualAlert from '../components/ContextualAlert'
 import en from '../locales/en'
@@ -15,7 +15,6 @@ import { getAuthModalsContent } from '../graphql/mappers/auth-modals'
 
 export default function PrivacyCondition(props) {
   const t = props.locale === 'en' ? en : fr
-
   const pageContent = props.content.content
   const [privacy, ...termsAndConditions] = pageContent.split(
     props.locale === 'en'
@@ -107,7 +106,11 @@ export default function PrivacyCondition(props) {
         refPageAA={props.aaPrefix}
         id={t.id_dashboard}
       />
-      <Date id="termsConditionsDateModified" date="20230331" />
+      <Date
+        id="termsConditionsDateModified"
+        date={props.content.dateModified}
+        label={t.dateModified}
+      />
     </div>
   )
 }