28. EPMO Open Source Coordination Office Redaction File Detail Report

Produced by Araxis Merge on 9/24/2019 1:37:43 PM Eastern Daylight Time. See www.araxis.com for information about Merge. This report uses XHTML and CSS2, and is best viewed with a modern standards-compliant browser. For optimum results when printing this report, use landscape orientation and enable printing of background images and colours in your browser.

28.1 Files compared

# Location File Last Modified
1 PCL-5_v1_build_8.zip\v1_build 8\Unredacted\spp_form_builder-dev.zip\spp_form_builder-dev\source\frontend\src\app Login.js Wed Jul 31 18:47:01 2019 UTC
2 PCL-5_v1_build_8.zip\v1_build 8\Unredacted\spp_form_builder-dev.zip\spp_form_builder-dev\source\frontend\src\app Login.js Fri Sep 20 17:11:21 2019 UTC

28.2 Comparison summary

Description Between
Files 1 and 2
Text Blocks Lines
Unchanged 2 450
Changed 1 2
Inserted 0 0
Removed 0 0

28.3 Comparison options

Whitespace
Character case Differences in character case are significant
Line endings Differences in line endings (CR and LF characters) are ignored
CR/LF characters Not shown in the comparison detail

28.4 Active regular expressions

No regular expressions were active.

28.5 Comparison detail

  1   import Rea ct, { useS tate } fro m 'react';
  2  
  3   import axi os from 'a xios';
  4   import Swa l from 'sw eetalert2' ;
  5   import wit hReactCont ent from ' sweetalert 2-react-co ntent';
  6  
  7   import sty led from ' styled-com ponents';
  8   import Lin earProgres s from '@m aterial-ui /core/Line arProgress ';
  9   import Car d from '@m aterial-ui /core/Card ';
  10   import Car dHeader fr om '@mater ial-ui/cor e/CardHead er';
  11   import Car dActions f rom '@mate rial-ui/co re/CardAct ions';
  12   import Car dContent f rom '@mate rial-ui/co re/CardCon tent';
  13   import But ton from ' @material- ui/core/Bu tton';
  14   import Tex tField fro m '@materi al-ui/core /TextField ';
  15   import Inp utAdornmen t from '@m aterial-ui /core/Inpu tAdornment ';
  16   import Com puter from  '@materia l-ui/icons /Computer' ;
  17   import Inp ut from '@ material-u i/icons/In put';
  18   import Ico nButton fr om '@mater ial-ui/cor e/IconButt on';
  19   import Vis ibility fr om '@mater ial-ui/ico ns/Visibil ity';
  20   import Vis ibilityOff  from '@ma terial-ui/ icons/Visi bilityOff' ;
  21   import Sen d from '@m aterial-ui /icons/Sen d';
  22  
  23   import { c onnect } f rom 'react -redux';
  24  
  25   const DivC ardWrapper  = styled. div`
  26     margin:  1.5rem;
  27     min-widt h: 420px;
  28     max-heig ht: 420px;
  29   `;
  30  
  31   const Card HeaderStyl e = styled (({ ...oth er }) => < CardHeader  {...other } />)`
  32     backgrou nd-color:  #347ab7;
  33  
  34     & .MuiCa rdHeader-t itle {
  35       color:  #fff;
  36       font-s ize: 1rem;
  37     }
  38   `;
  39  
  40   const Card ContentSty le = style d(CardCont ent)`
  41     && {
  42       displa y: flex;
  43       flex-d irection:  column;
  44       margin : auto;
  45       max-wi dth: 28vw;
  46     }
  47   `;
  48  
  49   const Card ActionsSty le = style d(CardActi ons)`
  50     && {
  51       displa y: flex;
  52       justif y-content:  center;
  53       margin -bottom: 1 rem;
  54     }
  55   `;
  56  
  57   const Text FieldStyle  = styled( TextField) `
  58     && {
  59       margin -top: 1rem ;
  60     }
  61   `;
  62  
  63   const Butt onStyle =  styled(But ton)`
  64     && {
  65       backgr ound: line ar-gradien t(45deg, # 01d1b2 30% , #01d1b2  90%);
  66       color:  #f8f8f8;
  67       text-t ransform:  capitalize ;
  68       font-s ize: 1rem;
  69     }
  70   `;
  71  
  72   const Send IconStyle  = styled(S end)`
  73     margin-l eft: 0.5re m;
  74   `;
  75  
  76   const Line arProgress Style = st yled(({ .. .other })  => (
  77     <LinearP rogress {. ..other} / >
  78   ))`
  79     & .MuiLi nearProgre ss-barColo rPrimary {
  80       backgr ound-color : #007bff;
  81     }
  82   `;
  83  
  84  
  85   const Logi n = ({ log in, loadin gData }) = > {
  86       const [ip,  setIp] =  useState(' IP           ');
  87     const [p ort, setPo rt] = useS tate('8083 ');
  88     const [a ccess, set Access] =  useState(' ');
  89     const [v erify, set Verify] =  useState(' ');
  90     const [s howPasswor d, setShow Password]  = useState (false);
  91     const [i sConnectin g, setIsCo nnecting]  = useState (false);
  92  
  93     const My Swal = wit hReactCont ent(Swal);
  94  
  95     async fu nction han dleConnect () {
  96       setIsC onnecting( true);
  97  
  98       var sh ortid = re quire('sho rtid');
  99       const  payload =  {
  100         ip,
  101         port ,
  102         acce ss,
  103         veri fy,
  104         sess ionId: sho rtid.gener ate()
  105       };
  106  
  107       try {
  108         cons t user = a wait axios .post(`/ap i/login`,  payload);
  109         cons t userData  = user.da ta;
  110         if ( userData.i sAuthentic ated) {
  111           lo gin({ ...u serData, s essionId:  payload.se ssionId }) ;
  112         } el se {
  113           My Swal.fire( {
  114              type: 'war ning',
  115              title: 'Co nnection f ailed!',
  116              html: `<p4 >Failed to  connect t o VistaLin k</p4>
  117                      <b r/><br/>
  118                      Pl ease doubl e check <b >server, p ort, acces s and veri fy code.</ b>`
  119           }) ;
  120           se tIsConnect ing(false) ;
  121         }
  122       } catc h (error)  {
  123         MySw al.fire({
  124           ty pe: 'error ',
  125           ti tle: 'Conn ection err or!',
  126           ht ml: `<p4>E rror in co nnecting t o VistaLin k</p4>`
  127         });
  128         setI sConnectin g(false);
  129       } fina lly {
  130         load ingData();
  131       }
  132     }
  133  
  134     return (
  135       <DivCa rdWrapper>
  136         <Car d>
  137           <C ardHeaderS tyle title ="Login" / >
  138           <C ardContent Style>
  139              <TextField Style
  140                id="ip"
  141                label="S erver"
  142                value={i p}
  143                onChange ={(event)  => setIp(e vent.targe t.value)}
  144                InputPro ps={{
  145                  endAdo rnment: (
  146                    <Inp utAdornmen t position ="start">
  147                      <C omputer />
  148                    </In putAdornme nt>
  149                  )
  150                }}
  151              />
  152              <TextField Style
  153                id="port "
  154                label="P ort"
  155                value={p ort}
  156                onChange ={(event)  => setPort (event.tar get.value) }
  157                InputPro ps={{
  158                  endAdo rnment: (
  159                    <Inp utAdornmen t position ="start">
  160                      <I nput />
  161                    </In putAdornme nt>
  162                  )
  163                }}
  164              />
  165              <TextField Style
  166                id="acce ss"
  167                label="A ccess Code "
  168                type={sh owPassword  ? 'text'  : 'passwor d'}
  169                value={a ccess}
  170                onChange ={(event)  => setAcce ss(event.t arget.valu e)}
  171                InputPro ps={{
  172                  endAdo rnment: (
  173                    <Inp utAdornmen t position ="start">
  174                      <I conButton
  175                         edge="end"
  176                         aria-label ="Toggle a ccess code  visibilit y"
  177                         onClick={( ) => setSh owPassword (!showPass word)}
  178                      >
  179                         {showPassw ord ? <Vis ibilityOff  /> : <Vis ibility /> }
  180                      </ IconButton >
  181                    </In putAdornme nt>
  182                  )
  183                }}
  184              />
  185              <TextField Style
  186                id="veri fy"
  187                label="V erify Code "
  188                type={sh owPassword  ? 'text'  : 'passwor d'}
  189                value={v erify}
  190                onChange ={(event)  => setVeri fy(event.t arget.valu e)}
  191                InputPro ps={{
  192                  endAdo rnment: (
  193                    <Inp utAdornmen t position ="start">
  194                      <I conButton
  195                         edge="end"
  196                         aria-label ="Toggle v erify code  visibilit y"
  197                         onClick={( ) => setSh owPassword (!showPass word)}
  198                      >
  199                         {showPassw ord ? <Vis ibilityOff  /> : <Vis ibility /> }
  200                      </ IconButton >
  201                    </In putAdornme nt>
  202                  )
  203                }}
  204              />
  205           </ CardConten tStyle>
  206           <C ardActions Style>
  207              <ButtonSty le variant ="containe d" onClick ={handleCo nnect}>
  208                Connect  <SendIconS tyle />
  209              </ButtonSt yle>
  210           </ CardAction sStyle>
  211         </Ca rd>
  212  
  213         {isC onnecting  && <Linear ProgressSt yle />}
  214       </DivC ardWrapper >
  215     );
  216   };
  217  
  218   export def ault conne ct(
  219     // ðŸ‘‡  Map to you r required  state
  220     null,
  221     // ðŸ‘‡  Map your r equired ac tions
  222     (dispatc h) => ({
  223       login:  dispatch. login,
  224       loadin gData: dis patch.load ingData
  225     })
  226   )(Login);