stg

.env

@@ -1,6 +1,6 @@
 SKIP_PREFLIGHT_CHECK=true
 EXTEND_ESLINT=true
-REACT_APP_VERSION=$npm_package_version
-REACT_APP_BUILT_AT=10/26/2020 - 1:33 PM
+REACT_APP_VERSION=$npm_package_version
+REACT_APP_BUILT_AT=12/29/2020 - 12:26 AM
 REACT_APP_BASE_URL=https://api-dev.allclear.app
 REACT_APP_ROBOTS_DIRECTIVE=noindex, nofollow

package.json

@@ -1,6 +1,6 @@
 {
   "name": "allclear-pwa-2",
-  "version": "1.11.0",
+  "version": "1.11.1",
   "license": "AGPL-3.0-only",
   "scripts": {
     "build": "node stampBuild.js && react-app-rewired build",
@@ -28,14 +28,14 @@
     "@material-ui/core": "latest",
     "@material-ui/icons": "latest",
     "@material-ui/lab": "^4.0.0-alpha.48",
-    "airtable": "^0.8.1",
+    "airtable": "^0.10.1",
     "autosuggest-highlight": "^3.1.1",
     "axios": "^0.19.2",
     "clipboardy": "^2.3.0",
     "clsx": "latest",
     "formik": "^2.1.4",
     "google-map-react": "^1.1.7",
-    "lodash": "^4.17.15",
+    "lodash": "^4.17.20",
     "logrocket": "^1.0.7",
     "logrocket-react": "^4.0.1",
     "material-ui-phone-number": "^2.2.6",

src/Router.js

@@ -34,6 +34,7 @@ import StateListPage from '@pages/state-list.page';
 import StatePage from '@pages/state.page';
 import CityPage from '@pages/city.page';
 import AddTestCenterPage from '@pages/add-test-center.page';
+import EditTestCenterPage from '@pages/edit-test-center.page';
 import MetadataService from '@services/metadata.service';
 
 export const history = createBrowserHistory();
@@ -113,6 +114,7 @@ export default function Router() {
           <Route path="/test-centers/:id" component={TestCenterPage} />
           {/* /:city/:test-center-name */}
           <Route path="/add-test-center" component={AddTestCenterPage} />
+          <Route path="/edit-test-center/:id" component={EditTestCenterPage} />
 
           {/* SEO */}
           <Route path="/state-list" component={StateListPage} />

src/components/experiences/feedback-experiences.js

@@ -90,10 +90,10 @@ export default function FeedbackExperiences(props) {
 
 const Content = styled(DialogContent)`
   overflow-y: visible;
-  padding: 0 24px;
+  padding: ${((window.innerWidth < 960) ? '0px' : '0 24px')};
   text-align: center;
   letter-spacing: -0.41px;
-  font-size: 20px;
+  font-size: ${((window.innerWidth < 960) ? '16px' : '20px')};
 `;  
 
 const Actions = styled(DialogActions)`
@@ -106,15 +106,18 @@ const Actions = styled(DialogActions)`
 const Box = styled(DialogActions)`
   flex-direction: row; 
   align-self: center;  
+  ${((window.innerWidth < 960) ? 'margin: 3px' : '')}
 `; 
 
 const TagButton = styled(PrimaryButton)` 
   border-color: #007AFF;  
   border-radius: 20px;  
-  height: 60%; 
-  width: 50%;
+  ${((window.innerWidth < 960) ? 'font-size: 10px' : '')}; 
+  height: ${((window.innerWidth) < 960 ? '100%' : '65%')};
+  ${((window.innerWidth < 960) ? 'min-width: 127px' : '')};
+  ${((window.innerWidth < 960) ? 'height: 40px' : '')};
+  ${((window.innerWidth < 960) ? 'padding: 3px' : '')};
   .MuiButton-label { 
-    width: 100%; 
     align-items: center;  
     justify-content: center; 
     display: flex; 
@@ -130,7 +133,7 @@ const NextButton = styled(PrimaryButton)`
 `; 
 
 const SpaceButton = styled(PrimaryButton)`
-  margin-top: 15px;  
+  margin-top: 20px;  
   align-self: center;
   width: 30%;
 `;

src/components/experiences/initial-experiences.js

@@ -33,11 +33,11 @@ export default function InitialExperiences(props) {
     </Content>
      <Actions>
      <RateButton color={'primary'} variant={isPosSelected(true)} onClick={() => handleFeedback(true)}> 
-       <ThumbUpIcon style={{margin: '5%'}} fontSize={'large'}/> 
+       <ThumbUpIcon style={{margin: '5%'}} fontSize={((window.innerWidth < 960) ? 'medium' : 'large')}/> 
        Positive  
      </RateButton>  
      <RateButton color={'primary'} variant={isPosSelected(false)} onClick={() => handleFeedback(false)}>
-       <ThumbDownIcon style={{margin: '5%'}} fontSize={'large'}/> 
+       <ThumbDownIcon style={{margin: '5%'}} fontSize={((window.innerWidth < 960) ? 'medium' : 'large')}/> 
        Negative
      </RateButton> 
     </Actions>   
@@ -59,10 +59,10 @@ export default function InitialExperiences(props) {
 
 const Content = styled(DialogContent)`
   overflow-y: visible;
-  padding: 0 24px;
+  padding: ${((window.innerWidth < 960) ? '0px' : '0 24px')};
   text-align: center;
   letter-spacing: -0.41px;
-  font-size: 20px;
+  font-size: ${((window.innerWidth < 960) ? '16px' : '20px')};
 `;  
 
 const Actions = styled(DialogActions)`
@@ -72,6 +72,7 @@ const Actions = styled(DialogActions)`
 
 const RateButton = styled(PrimaryButton)` 
   border-color: #007AFF;     
+  ${((window.innerWidth < 960) ? 'min-width: 110px' : '')};  
   .MuiButton-label { 
     width: 100%;
     height: 55%;
@@ -92,7 +93,7 @@ const NextButton = styled(PrimaryButton)`
 `;
 
 const SpaceButton = styled(PrimaryButton)`
-  margin-top: 40px;
+  margin-top: 30px;
   align-self: center;
   width: 30%;
 `;

src/components/experiences/submit-experiences.js

@@ -34,10 +34,10 @@ export default function SubmitExperiences(props) {
 const Content = styled(DialogContent)`
   overflow-y: hidden;
   margin-bottom: 15px;
-  padding: 0 24px;
+  padding: ${((window.innerWidth < 960) ? '0px' : '0 24px')};
   text-align: center;
   letter-spacing: -0.41px;
-  font-size: 20px; 
+  font-size:  ${((window.innerWidth < 960) ? '16px' : '20px')}; 
 `;  
 
 const Actions = styled(DialogActions)`
@@ -47,7 +47,7 @@ const Actions = styled(DialogActions)`
 
 const DoneButton = styled(PrimaryButton)` 
   border-color: #007AFF;  
-  margin-bottom: 30%;
+  margin-bottom:  ${((window.innerWidth < 960) ? '0%' : '30%')};
 `;  
 
 const Title = styled(DialogTitle)`
@@ -56,7 +56,7 @@ const Title = styled(DialogTitle)`
     flex-direction: column;
     align-items: center;
     text-align: center;
-    font-size: 24px;
-    margin: 15px;
+    font-size: ${((window.innerWidth < 960) ? '18px' : '24px')};
+    margin:  ${((window.innerWidth < 960) ? '0px' : '15px')}; 
   }
 `; 

src/components/general/modals/form-modal.js

@@ -1,16 +1,13 @@
 import React, { useState } from 'react';
-import { useHistory } from 'react-router-dom';
 import styled from 'styled-components';
 
 import { Dialog, DialogTitle, DialogContent, DialogActions, IconButton } from '@material-ui/core';
 import CloseIcon from '@material-ui/icons/Close';
 import { isNullOrUndefined } from '@util/general.helpers';
 
-import PrimaryButton from '@general/buttons/primary-button';
 import ModalService from '@services/modal.service';
 
 export default function FormModal(props) {
-  const history = useHistory();
   const modalService = ModalService.getInstance();
   modalService.registerModal(props.modalName, toggleModal);
 
@@ -48,12 +45,7 @@ export default function FormModal(props) {
           </Content>
         )}
         <Actions disableSpacing={true}>
-          <LoginButton color={'primary'} variant={'contained'} onClick={() => history.push('/sign-in')}>
-            Login
-          </LoginButton>
-          <CreateAccountButton style={{ marginTop: 10 }} onClick={() => history.push('/sign-up')}>
-            Create Account
-          </CreateAccountButton>
+          {props.actions}
         </Actions>
       </Modal>
     </>
@@ -87,7 +79,7 @@ const Content = styled(DialogContent)`
   padding: 0 24px;
   text-align: center;
   letter-spacing: -0.41px;
-  font-size: 16px;
+  font-size: 18px;
 `;
 
 const Actions = styled(DialogActions)`
@@ -101,11 +93,3 @@ const CloseButton = styled(IconButton)`
   margin: 20px;
 `;
 
-const LoginButton = styled(PrimaryButton)`
-  box-shadow: 0px 0px 10px 5px lightGrey;
-`;    
-
-const CreateAccountButton = styled(PrimaryButton)`
-  box-shadow: 0px 0px 10px 5px lightGrey; 
-  margin-top: 10px;
-`; 

src/components/general/modals/share-experiences-modal.js

@@ -59,6 +59,8 @@ export default function ShareExperiencesModal(props) {
     setOpen(isOpen);
     if (isOpen === true) {
       setScroll(scrollType);
+    } else if(currentScreen === 3){
+      window.location.reload();
     }
   }
 
@@ -83,9 +85,9 @@ export default function ShareExperiencesModal(props) {
       })
       .catch((err) => {
         setExperienceResult({
-          title: 'Please try again tomorrow.', 
-          content: `To help ensure authenticity, you'll need to wait until tomorrow
-                    to share your Experience at ${props.testTitle} again. Thank you!`
+          title: 'An error has occured.', 
+          content: `An error has occured while trying to share your Experience.
+                    Please try again later.`
         });
         setCurrentScreen(3);
       });
@@ -144,10 +146,9 @@ const ShareExperienceContainer = styled(Dialog)`
   .MuiPaper-rounded {
     border-radius: 30px;
     padding: 25px;  
-    width: 70%; 
-    height: 60%;
+    height: ${((window.innerWidth < 960) ? '450px' : '70%')};
     flex: 1; 
-    justify-content: space-between;
+    justify-content: ${((window.innerWidth < 960) ? 'space-evenly' : 'space-between')};
   }
 `;
 
@@ -157,21 +158,22 @@ const Title = styled(DialogTitle)`
     flex-direction: column;
     align-items: center;
     text-align: center;
-    font-size: 24px;
-    margin: 15px;
+    font-size: ${((window.innerWidth < 960) ? '18px' : '24px')};
+    margin: ${((window.innerWidth < 960) ? '5px' : '15px')};
   }
+  padding: 0px 20px;
 `; 
 
 const CloseButton = styled(IconButton)`
   position: absolute;
   top: 0;
   right: 0;
-  margin: 20px;
+  margin:${((window.innerWidth < 960) ? '10px' : '20px')};
 `;   
 
 const BackButton = styled(IconButton)`
   position: absolute;
   top: 0;
   left: 0;
-  margin: 20px;
+  margin: ${((window.innerWidth < 960) ? '10px' : '20px')};
 `; 

src/components/general/pin-location.js

@@ -1,4 +1,5 @@
 import React, { useState } from 'react';
+import { useHistory } from 'react-router-dom';
 import styled, { css, keyframes } from 'styled-components';
 import { IconButton } from '@material-ui/core';
 
@@ -8,10 +9,12 @@ import FormModal from '@general/modals/form-modal';
 
 import PeopleService from '@services/people.service';
 import ModalService from '@services/modal.service';
+import PrimaryButton from '@general/buttons/primary-button';
 
 export default function PinLocation({ location }) {
   const peopleService = PeopleService.getInstance();
   const modalService = ModalService.getInstance();
+  const history = useHistory();
 
   const initialLocationState = {
     location,
@@ -49,6 +52,16 @@ export default function PinLocation({ location }) {
         modalName="promptLogin"
         contentText="You need to be logged in to AllClear to save pinned locations. Please login or create an account to continue."
         icon={<LockIcon />}
+        actions = {
+          <>
+              <LoginButton color={'primary'} variant={'contained'} onClick={() => history.push('/sign-in')}>
+                  Login
+              </LoginButton>
+              <CreateAccountButton style={{ marginTop: 10 }} onClick={() => history.push('/sign-up')}>
+                  Create Account
+              </CreateAccountButton>  
+          </>
+      }
       />
     </>
   );
@@ -106,3 +119,12 @@ const pinAnimation = keyframes`
     transform: scale(1, 1) rotate(-15deg) translateY(0);
   }
 `;
+
+const LoginButton = styled(PrimaryButton)`
+  box-shadow: 0px 0px 10px 5px lightGrey;
+`;    
+
+const CreateAccountButton = styled(PrimaryButton)`
+  box-shadow: 0px 0px 10px 5px lightGrey; 
+  margin-top: 10px;
+`;