Partially support federated login

Two things:
1. I've never attempted to support this before.
2. It seems surprisingly and perhaps deceptively simpler than what I
   expected. I'm unsure what to do once Google's API authenticates the user. I
   currently look-up the user's role, trips, etc. using their email address. The
   role is stored in the Accounts table alongside username, email, password. I
   will speak with the interviewer tomorrow about this.

3 files changed, 46 insertions, 4 deletions

diff --git a/client/src/Login.elm b/client/src/Login.elm
index 083c4705609d..b1a436098afd 100644
--- a/client/src/Login.elm
+++ b/client/src/Login.elm
@@ -10,6 +10,16 @@ import UI
 import Utils
 
 
+googleSignIn : Html State.Msg
+googleSignIn =
+    div
+        [ class "g-signin2"
+        , attribute "onsuccess" "onSignIn"
+        , onClick State.GoogleSignIn
+        ]
+        []
+
+
 loginForm : State.Model -> Html State.Msg
 loginForm model =
     div
@@ -111,11 +121,28 @@ loginForm model =
                 ]
             , case model.loginTab of
                 State.LoginForm ->
-                    UI.simpleButton { handleClick = State.AttemptLogin, label = "Login" }
+                    div [ [ "flex", "space-around" ] |> Tailwind.use |> class ]
+                        [ UI.simpleButton
+                            { handleClick = State.AttemptLogin
+                            , label = "Login"
+                            }
+                        , div [ [ "pl-4" ] |> Tailwind.use |> class ] [ googleSignIn ]
+                        ]
 
                 State.SignUpForm ->
-                    if String.length model.username > 0 && String.length model.email > 0 && String.length model.password > 0 then
-                        UI.simpleButton { handleClick = State.AttemptSignUp, label = "Sign up" }
+                    if
+                        List.all identity
+                            [ String.length model.username > 0
+                            , String.length model.email > 0
+                            , String.length model.password > 0
+                            ]
+                    then
+                        div []
+                            [ UI.simpleButton
+                                { handleClick = State.AttemptSignUp
+                                , label = "Sign up"
+                                }
+                            ]
 
                     else
                         UI.disabledButton { label = "Sign up" }
diff --git a/client/src/State.elm b/client/src/State.elm
index 110fb72a78ed..b3f78bb16980 100644
--- a/client/src/State.elm
+++ b/client/src/State.elm
@@ -43,6 +43,8 @@ type Msg
     | ClearErrors
     | ToggleLoginForm
     | PrintPage
+    | GoogleSignIn
+    | GoogleSignOut
     | UpdateInviteEmail String
     | UpdateInviteRole (Maybe Role)
     | ReceiveTodaysDate Date.Date
@@ -608,6 +610,12 @@ adminHome flags url key =
 port printPage : () -> Cmd msg
 
 
+port googleSignIn : () -> Cmd msg
+
+
+port googleSignOut : () -> Cmd msg
+
+
 {-| The initial state for the application.
 -}
 init : () -> Url.Url -> Nav.Key -> ( Model, Cmd Msg )
@@ -732,6 +740,12 @@ update msg model =
         PrintPage ->
             ( model, printPage () )
 
+        GoogleSignIn ->
+            ( model, googleSignIn () )
+
+        GoogleSignOut ->
+            ( model, googleSignOut () )
+
         UpdateInviteEmail x ->
             ( { model | inviteEmail = x }, Cmd.none )
 
diff --git a/client/src/UI.elm b/client/src/UI.elm
index f959b0cc7836..7f8f379795f7 100644
--- a/client/src/UI.elm
+++ b/client/src/UI.elm
@@ -98,7 +98,8 @@ baseButton { label, enabled, handleClick, extraClasses } =
                 "cursor-not-allowed"
           , "text-white"
           , "font-bold"
-          , "py-2"
+          , "py-1"
+          , "shadow-lg"
           , "px-4"
           , "rounded"
           , "focus:outline-none"