From eb82c178ca059194429da2460d860c04e8ee06e5 Mon Sep 17 00:00:00 2001
From: John Wu <76966357+jwu-fisker@users.noreply.github.com>
Date: Mon, 28 Nov 2022 15:54:08 -0800
Subject: [PATCH] CEC-3243 email address warning (#242)

---
 .../App/__snapshots__/App.test.js.snap        | 60 +++++++++++++++++++
 .../__snapshots__/SSOForm.test.js.snap        |  5 ++
 src/components/SSOForm/index.jsx              |  3 +-
 3 files changed, 67 insertions(+), 1 deletion(-)

diff --git a/src/components/App/__snapshots__/App.test.js.snap b/src/components/App/__snapshots__/App.test.js.snap
index af9ea5e..f705258 100644
--- a/src/components/App/__snapshots__/App.test.js.snap
+++ b/src/components/App/__snapshots__/App.test.js.snap
@@ -587,6 +587,11 @@ exports[`App Route / unauthenticated 1`] = `
                 class="MuiTouchRipple-root"
               />
             </a>
+            <p>
+              <strong>
+                Note: Your email address will be used as the user id
+              </strong>
+            </p>
           </div>
         </main>
       </main>
@@ -1182,6 +1187,11 @@ exports[`App Route /home unauthenticated 1`] = `
                 class="MuiTouchRipple-root"
               />
             </a>
+            <p>
+              <strong>
+                Note: Your email address will be used as the user id
+              </strong>
+            </p>
           </div>
         </main>
       </main>
@@ -2161,6 +2171,11 @@ exports[`App Route /package-deploy unauthenticated 1`] = `
                 class="MuiTouchRipple-root"
               />
             </a>
+            <p>
+              <strong>
+                Note: Your email address will be used as the user id
+              </strong>
+            </p>
           </div>
         </main>
       </main>
@@ -2926,6 +2941,11 @@ exports[`App Route /package-status unauthenticated 1`] = `
                 class="MuiTouchRipple-root"
               />
             </a>
+            <p>
+              <strong>
+                Note: Your email address will be used as the user id
+              </strong>
+            </p>
           </div>
         </main>
       </main>
@@ -3849,6 +3869,11 @@ exports[`App Route /packages unauthenticated 1`] = `
                 class="MuiTouchRipple-root"
               />
             </a>
+            <p>
+              <strong>
+                Note: Your email address will be used as the user id
+              </strong>
+            </p>
           </div>
         </main>
       </main>
@@ -4369,6 +4394,11 @@ exports[`App Route /supplier/{email} unauthenticated 1`] = `
                 class="MuiTouchRipple-root"
               />
             </a>
+            <p>
+              <strong>
+                Note: Your email address will be used as the user id
+              </strong>
+            </p>
           </div>
         </main>
       </main>
@@ -5160,6 +5190,11 @@ exports[`App Route /tools/certificates/add unauthenticated 1`] = `
                 class="MuiTouchRipple-root"
               />
             </a>
+            <p>
+              <strong>
+                Note: Your email address will be used as the user id
+              </strong>
+            </p>
           </div>
         </main>
       </main>
@@ -5817,6 +5852,11 @@ exports[`App Route /tools/sms/send unauthenticated 1`] = `
                 class="MuiTouchRipple-root"
               />
             </a>
+            <p>
+              <strong>
+                Note: Your email address will be used as the user id
+              </strong>
+            </p>
           </div>
         </main>
       </main>
@@ -7032,6 +7072,11 @@ exports[`App Route /vehicle-add unauthenticated 1`] = `
                 class="MuiTouchRipple-root"
               />
             </a>
+            <p>
+              <strong>
+                Note: Your email address will be used as the user id
+              </strong>
+            </p>
           </div>
         </main>
       </main>
@@ -7838,6 +7883,11 @@ exports[`App Route /vehicle-status unauthenticated 1`] = `
                 class="MuiTouchRipple-root"
               />
             </a>
+            <p>
+              <strong>
+                Note: Your email address will be used as the user id
+              </strong>
+            </p>
           </div>
         </main>
       </main>
@@ -7894,6 +7944,11 @@ exports[`App Route /vehicle-status/vin/carupdateid unauthenticated 1`] = `
                 class="MuiTouchRipple-root"
               />
             </a>
+            <p>
+              <strong>
+                Note: Your email address will be used as the user id
+              </strong>
+            </p>
           </div>
         </main>
       </main>
@@ -8751,6 +8806,11 @@ exports[`App Route /vehicles unauthenticated 1`] = `
                 class="MuiTouchRipple-root"
               />
             </a>
+            <p>
+              <strong>
+                Note: Your email address will be used as the user id
+              </strong>
+            </p>
           </div>
         </main>
       </main>
diff --git a/src/components/SSOForm/__snapshots__/SSOForm.test.js.snap b/src/components/SSOForm/__snapshots__/SSOForm.test.js.snap
index f354852..d14bf49 100644
--- a/src/components/SSOForm/__snapshots__/SSOForm.test.js.snap
+++ b/src/components/SSOForm/__snapshots__/SSOForm.test.js.snap
@@ -20,6 +20,11 @@ exports[`Sign In Form Should render 1`] = `
         class="MuiTouchRipple-root"
       />
     </a>
+    <p>
+      <strong>
+        Note: Your email address will be used as the user id
+      </strong>
+    </p>
   </div>
 </div>
 `;
diff --git a/src/components/SSOForm/index.jsx b/src/components/SSOForm/index.jsx
index 10f5e8e..41a5193 100644
--- a/src/components/SSOForm/index.jsx
+++ b/src/components/SSOForm/index.jsx
@@ -1,6 +1,6 @@
-import React, { useEffect } from "react";
 import { Button } from "@material-ui/core";
 import clsx from "clsx";
+import React, { useEffect } from "react";
 
 import { useUserContext } from "../Contexts/UserContext";
 import useStyles from "../useStyles";
@@ -34,6 +34,7 @@ export default function SignInForm() {
       >
         {fetching ? "Please wait..." : "Sign In"}
       </Button>
+      <p><strong>Note: Your email address will be used as the user id</strong></p>
     </div>
   );
 }