Improve share email form

modules/webapp/src/main/elm/Comp/ItemMail.elm

@@ -10,6 +10,7 @@ module Comp.ItemMail exposing
     , Model
     , Msg
     , clear
+    , clearRecipients
     , emptyModel
     , init
     , setMailInfo
@@ -115,6 +116,15 @@ clear model =
     }
 
 
+clearRecipients : Model -> Model
+clearRecipients model =
+    { model
+        | recipients = []
+        , ccRecipients = []
+        , bccRecipients = []
+    }
+
+
 setMailInfo : String -> String -> Msg
 setMailInfo subject body =
     SetSubjectBody subject body

modules/webapp/src/main/elm/Comp/PublishItems.elm

@@ -29,6 +29,7 @@ import Data.ItemQuery exposing (ItemQuery)
 import Data.UiSettings exposing (UiSettings)
 import Html exposing (..)
 import Html.Attributes exposing (..)
+import Html.Events exposing (onClick)
 import Http
 import Messages.Comp.PublishItems exposing (Texts)
 import Ports
@@ -57,6 +58,7 @@ type alias Model =
     , viewMode : ViewMode
     , formError : FormError
     , loading : Bool
+    , mailVisible : Bool
     }
 
 
@@ -74,6 +76,7 @@ init flags =
       , viewMode = ViewModeEdit
       , formError = FormErrorNone
       , loading = False
+      , mailVisible = False
       }
     , Cmd.batch
         [ Cmd.map FormMsg fc
@@ -96,6 +99,7 @@ initQuery flags query =
       , viewMode = ViewModeEdit
       , formError = FormErrorNone
       , loading = False
+      , mailVisible = False
       }
     , Cmd.batch
         [ Cmd.map FormMsg fc
@@ -115,6 +119,7 @@ type Msg
     | SubmitPublish
     | PublishResp (Result Http.Error IdResult)
     | GetShareResp (Result Http.Error ShareDetail)
+    | ToggleMailVisible
 
 
 type Outcome
@@ -210,6 +215,7 @@ update texts flags msg model =
                     | formError = FormErrorNone
                     , loading = False
                     , viewMode = ViewModeInfo share
+                    , mailVisible = False
                     , mailModel = mm
                 }
             , cmd =
@@ -228,6 +234,13 @@ update texts flags msg model =
             , outcome = OutcomeInProgress
             }
 
+        ToggleMailVisible ->
+            { model = { model | mailVisible = not model.mailVisible }
+            , cmd = Cmd.none
+            , sub = Sub.none
+            , outcome = OutcomeInProgress
+            }
+
 
 
 --- View
@@ -281,16 +294,28 @@ viewInfo texts settings flags model share =
         , div []
             [ Comp.ShareView.view cfg texts.shareView flags share
             ]
-        , div [ class "flex flex-col mt-6" ]
+        , div
-            [ div
+            [ class "flex flex-col mt-6"
+            ]
+            [ a
                 [ class S.header2
+                , class "inline-block w-full"
+                , href "#"
+                , onClick ToggleMailVisible
                 ]
-                [ text texts.sendViaMail
+                [ if model.mailVisible then
+                    i [ class "fa fa-caret-down mr-2" ] []
+
+                  else
+                    i [ class "fa fa-caret-right mr-2" ] []
+                , text texts.sendViaMail
                 ]
-            , Html.map MailMsg
+            , div [ classList [ ( "hidden", not model.mailVisible ) ] ]
+                [ Html.map MailMsg
                     (Comp.ShareMail.view texts.shareMail flags settings model.mailModel)
                 ]
             ]
+        ]
 
 
 viewForm : Texts -> Model -> Html Msg

modules/webapp/src/main/elm/Comp/ShareMail.elm

@@ -120,7 +120,11 @@ update texts flags msg model =
                         (texts.bodyTemplate url)
 
                 nm =
-                    { model | share = share }
+                    { model
+                        | share = share
+                        , mailModel = Comp.ItemMail.clearRecipients model.mailModel
+                        , formState = FormStateNone
+                    }
             in
             update texts flags (MailMsg lm) nm
 
@@ -128,7 +132,7 @@ update texts flags msg model =
             if res.success then
                 ( { model
                     | formState = FormStateSent
-                    , mailModel = Comp.ItemMail.clear model.mailModel
+                    , mailModel = Comp.ItemMail.clearRecipients model.mailModel
                     , sending = False
                   }
                 , Cmd.none
@@ -176,7 +180,7 @@ view texts flags settings model =
 
             FormStateSent ->
                 div [ class S.successMessage ]
-                    [ text "Mail sent."
+                    [ text texts.mailSent
                     ]
         , Html.map MailMsg
             (Comp.ItemMail.view texts.itemMail settings cfg model.mailModel)

modules/webapp/src/main/elm/Comp/ShareManage.elm

@@ -58,6 +58,7 @@ type alias Model =
     , deleteConfirm : DeleteConfirm
     , query : String
     , owningOnly : Bool
+    , sendMailVisible : Bool
     }
 
 
@@ -79,6 +80,7 @@ init flags =
       , deleteConfirm = DeleteConfirmOff
       , query = ""
       , owningOnly = True
+      , sendMailVisible = False
       }
     , Cmd.batch
         [ Cmd.map FormMsg fc
@@ -96,6 +98,7 @@ type Msg
     | SetViewMode ViewMode
     | SetQuery String
     | ToggleOwningOnly
+    | ToggleSendMailVisible
     | Submit
     | RequestDelete
     | CancelDelete
@@ -260,6 +263,9 @@ update texts flags msg model =
             , Sub.none
             )
 
+        ToggleSendMailVisible ->
+            ( { model | sendMailVisible = not model.sendMailVisible }, Cmd.none, Sub.none )
+
 
 setShare : Texts -> ShareDetail -> Flags -> Model -> ( Model, Cmd Msg, Sub Msg )
 setShare texts share flags model =
@@ -268,7 +274,7 @@ setShare texts share flags model =
             flags.config.baseUrl ++ Page.pageToString (SharePage share.id)
 
         nextModel =
-            { model | formError = FormErrorNone, viewMode = Form, loading = False }
+            { model | formError = FormErrorNone, viewMode = Form, loading = False, sendMailVisible = False }
 
         initClipboard =
             Ports.initClipboard (Comp.ShareView.clipboardData share)
@@ -490,13 +496,23 @@ shareSendMail texts flags settings model =
         [ class "mt-8 mb-2"
         , classList [ ( "hidden", share.id == "" || not share.enabled || share.expired ) ]
         ]
-        [ h2
+        [ a
             [ class S.header2
-            , class "border-b-2 dark:border-bluegray-600"
+            , class "border-b-2 dark:border-bluegray-600 w-full inline-block"
+            , href "#"
+            , onClick ToggleSendMailVisible
             ]
-            [ text "Send via E-Mail"
+            [ if model.sendMailVisible then
+                i [ class "fa fa-caret-down mr-2" ] []
+
+              else
+                i [ class "fa fa-caret-right mr-2" ] []
+            , text texts.sendViaMail
+            ]
+        , div
+            [ class "px-2 py-2 dark:border-bluegray-600"
+            , classList [ ( "hidden", not model.sendMailVisible ) ]
             ]
-        , div [ class "px-2 py-2 dark:border-bluegray-600" ]
             [ Html.map MailMsg
                 (Comp.ShareMail.view texts.shareMail flags settings model.mailModel)
             ]

modules/webapp/src/main/elm/Messages/Comp/ShareMail.elm

@@ -23,6 +23,7 @@ type alias Texts =
     , httpError : Http.Error -> String
     , subjectTemplate : Maybe String -> String
     , bodyTemplate : String -> String
+    , mailSent : String
     }
 
 
@@ -40,6 +41,7 @@ you can find the documents here:
 
 Kind regards
 """
+    , mailSent = "Mail sent."
     }
 
 
@@ -57,4 +59,5 @@ die freigegebenen Dokumente befinden sich hier:
 
 Freundliche Grüße
 """
+    , mailSent = "E-Mail gesendet."
     }

modules/webapp/src/main/elm/Messages/Comp/ShareManage.elm

@@ -38,7 +38,7 @@ type alias Texts =
     , correctFormErrors : String
     , noName : String
     , shareInformation : String
-    , sendMail : String
+    , sendViaMail : String
     , notOwnerInfo : String
     , showOwningSharesOnly : String
     }
@@ -63,7 +63,7 @@ gb =
     , correctFormErrors = "Please correct the errors in the form."
     , noName = "No Name"
     , shareInformation = "Share Information"
-    , sendMail = "Send via E-Mail"
+    , sendViaMail = "Send via E-Mail"
     , notOwnerInfo = "Only the user who created this share can edit its properties."
     , showOwningSharesOnly = "Show my shares only"
     }
@@ -88,7 +88,7 @@ de =
     , correctFormErrors = "Bitte korrigiere die Fehler im Formular."
     , noName = "Ohne Name"
     , shareInformation = "Informationen zur Freigabe"
-    , sendMail = "Per E-Mail versenden"
+    , sendViaMail = "Per E-Mail versenden"
     , notOwnerInfo = "Nur der Benutzer, der diese Freigabe erstellt hat, kann diese auch ändern."
     , showOwningSharesOnly = "Nur meine Freigaben anzeigen"
     }