From 44986c7593c8f6af70926d97160e6397afdbcf49 Mon Sep 17 00:00:00 2001 From: Kevin Jackson <30411845+KevinJJackson@users.noreply.github.com> Date: Wed, 28 Aug 2024 13:16:25 -0400 Subject: [PATCH] feature/govt-consent-message (#237) --- package.json | 2 +- src/App.jsx | 42 +++++++++++++++++++++--------- src/app-pages/DeclinedConsent.jsx | 41 +++++++++++++++++++++++++++++ src/app-pages/DoDConsentNotice.jsx | 32 +++++++++++++++++++++++ src/css/index.scss | 41 +++++++++++++++++++++++++++++ src/userService.ts | 7 +++++ 6 files changed, 152 insertions(+), 13 deletions(-) create mode 100644 src/app-pages/DeclinedConsent.jsx create mode 100644 src/app-pages/DoDConsentNotice.jsx diff --git a/package.json b/package.json index 57acc488..859464a3 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "hhd-ui", - "version": "0.17.2", + "version": "0.17.3", "private": true, "dependencies": { "@ag-grid-community/client-side-row-model": "^30.0.3", diff --git a/src/App.jsx b/src/App.jsx index faadb311..2a5b1428 100644 --- a/src/App.jsx +++ b/src/App.jsx @@ -1,25 +1,43 @@ -import React from 'react'; +import React, { useEffect, useState } from 'react'; import { connect } from 'redux-bundler-react'; import { ToastContainer } from 'react-toastify'; +import DeclinedConsent from './app-pages/DeclinedConsent.jsx'; +import DoDConsentNotice from './app-pages/DoDConsentNotice.jsx'; import Modal from './app-components/modal'; import NavBar from './app-components/navigation'; import PageContent from './app-components/pageContent'; +import { getAcceptedValue, setUserAccepted } from './userService.ts'; import 'react-toastify/dist/ReactToastify.css'; import 'react-tooltip/dist/react-tooltip.css'; import './css/bootstrap/css/bootstrap.water.min.css'; - import './css/ms/css/mapskin.min.css'; import './css/index.scss'; -export default connect('selectRoute', ({ route: Route }) => ( - <> - - - - - - - -)); +export default connect('selectRoute', ({ route: Route }) => { + const [acceptedState, setAcceptedState] = useState(getAcceptedValue()); + + useEffect(() => { + setUserAccepted(acceptedState); + }, [acceptedState]); + + return ( + <> + {acceptedState === 'true' ? ( + <> + + + + + + + + ) : acceptedState === 'false' ? ( + + ) : ( + + )} + + ); +}); diff --git a/src/app-pages/DeclinedConsent.jsx b/src/app-pages/DeclinedConsent.jsx new file mode 100644 index 00000000..3f633ad5 --- /dev/null +++ b/src/app-pages/DeclinedConsent.jsx @@ -0,0 +1,41 @@ +import { Button } from '@mui/material'; +import React from 'react'; + +import bg1 from '../img/bg-1.jpg'; +import { Timeline } from '@mui/icons-material'; + +const DeclinedConsent = ({ setAcceptedState }) => { + + return ( + <> +
+
+

+ + MIDAS +

+

+ Monitoring Instrumentation Data Acquisition System +

+
+
+
+ You must agree to the prior terms to access this site. Click  + +  to go back or close this window. +
+ + ); +}; + +export default DeclinedConsent; diff --git a/src/app-pages/DoDConsentNotice.jsx b/src/app-pages/DoDConsentNotice.jsx new file mode 100644 index 00000000..dc698e4d --- /dev/null +++ b/src/app-pages/DoDConsentNotice.jsx @@ -0,0 +1,32 @@ +import React from 'react'; +import { Button } from '@mui/material'; + +const DoDConsentNotice = ({ setAcceptedState }) => { + return ( + +
+
+
You are accessing a U.S. Government (USG) Information System (IS) that is provided for USG-authorized use only.
+
By using this IS (which includes any device attached to this IS), you consent to the following conditions:
+
    +
  • The USG routinely intercepts and monitors communications on this IS for purposes including, but not limited to, penetration testing, COMSEC monitoring, network operations and defense, personnel misconduct (PM), law enforcement (LE), and counterintelligence (CI) investigations.
    • +
  • At any time, the USG may inspect and seize data stored on this IS.
    • +
  • Communications using, or data stored on, this IS are not private, are subject to routine monitoring, interception, and search, and may be disclosed or used for any USG-authorized purpose.
    • +
  • This IS includes security measures (e.g., authentication and access controls) to protect USG interests--not for your personal benefit or privacy.
    • +
  • Notwithstanding the above, using this IS does not constitute consent to PM, LE or CI investigative searching or monitoring of the content of privileged communications, or work product, related to personal representation or services by attorneys, psychotherapists, or clergy, and their assistants. Such communications and work product are private and confidential. See User Agreement for details.
    • +
+
+
+ + +
+
+ + ); +}; + +export default DoDConsentNotice; \ No newline at end of file diff --git a/src/css/index.scss b/src/css/index.scss index 5375249c..90935b67 100644 --- a/src/css/index.scss +++ b/src/css/index.scss @@ -177,3 +177,44 @@ footer.modal-footer { .text-dark { color: #222 !important; } + +.notice-background { + display: flex; + position: absolute; + left: 0; + top: 0; + background-color: #444; + height: 100vh; + width: 100vw; +} + +.notice-container { + padding: 1rem; + border-radius: 8px; + position: relative; + background-color: white; + margin: auto auto; + width: 600px; + height: 75%; + overflow: scroll; +} + +.notice-footer { + position: absolute; + bottom: 10px; + display: flex; + justify-content: space-between; + width: 95%; +} + +@media only screen and (max-width: 768px) { + /* For mobile phones: */ + .notice-container { + width: 90vw; + } + + .notice-footer { + width: 100%; + position: relative; + } +} \ No newline at end of file diff --git a/src/userService.ts b/src/userService.ts index 2183e4d9..203d6460 100644 --- a/src/userService.ts +++ b/src/userService.ts @@ -63,3 +63,10 @@ _kc.onAuthRefreshError = () => { console.error(err); } }; + +const acceptedKey = 'isUserAccepted'; + +export const getAcceptedValue = () => sessionStorage.getItem(acceptedKey); +export const setUserAccepted = (val: string) => { + sessionStorage.setItem(acceptedKey, val); +};