Add imap settings

modules/webapp/src/main/elm/Api.elm

@@ -2,9 +2,11 @@ module Api exposing
     ( cancelJob
     , changePassword
     , checkCalEvent
+    , createImapSettings
     , createMailSettings
     , deleteAttachment
     , deleteEquip
+    , deleteImapSettings
     , deleteItem
     , deleteMailSettings
     , deleteOrg
@@ -17,6 +19,7 @@ module Api exposing
     , getCollectiveSettings
     , getContacts
     , getEquipments
+    , getImapSettings
     , getInsights
     , getItemProposals
     , getJobQueueState
@@ -81,6 +84,8 @@ import Api.Model.EmailSettingsList exposing (EmailSettingsList)
 import Api.Model.Equipment exposing (Equipment)
 import Api.Model.EquipmentList exposing (EquipmentList)
 import Api.Model.GenInvite exposing (GenInvite)
+import Api.Model.ImapSettings exposing (ImapSettings)
+import Api.Model.ImapSettingsList exposing (ImapSettingsList)
 import Api.Model.InviteResult exposing (InviteResult)
 import Api.Model.ItemDetail exposing (ItemDetail)
 import Api.Model.ItemInsights exposing (ItemInsights)
@@ -259,7 +264,16 @@ sendMail flags opts receive =
 deleteMailSettings : Flags -> String -> (Result Http.Error BasicResult -> msg) -> Cmd msg
 deleteMailSettings flags name receive =
     Http2.authDelete
-        { url = flags.config.baseUrl ++ "/api/v1/sec/email/settings/" ++ name
+        { url = flags.config.baseUrl ++ "/api/v1/sec/email/settings/smtp/" ++ name
+        , account = getAccount flags
+        , expect = Http.expectJson receive Api.Model.BasicResult.decoder
+        }
+
+
+deleteImapSettings : Flags -> String -> (Result Http.Error BasicResult -> msg) -> Cmd msg
+deleteImapSettings flags name receive =
+    Http2.authDelete
+        { url = flags.config.baseUrl ++ "/api/v1/sec/email/settings/imap/" ++ name
         , account = getAccount flags
         , expect = Http.expectJson receive Api.Model.BasicResult.decoder
         }
@@ -268,12 +282,21 @@ deleteMailSettings flags name receive =
 getMailSettings : Flags -> String -> (Result Http.Error EmailSettingsList -> msg) -> Cmd msg
 getMailSettings flags query receive =
     Http2.authGet
-        { url = flags.config.baseUrl ++ "/api/v1/sec/email/settings?q=" ++ Url.percentEncode query
+        { url = flags.config.baseUrl ++ "/api/v1/sec/email/settings/smtp?q=" ++ Url.percentEncode query
         , account = getAccount flags
         , expect = Http.expectJson receive Api.Model.EmailSettingsList.decoder
         }
 
 
+getImapSettings : Flags -> String -> (Result Http.Error ImapSettingsList -> msg) -> Cmd msg
+getImapSettings flags query receive =
+    Http2.authGet
+        { url = flags.config.baseUrl ++ "/api/v1/sec/email/settings/imap?q=" ++ Url.percentEncode query
+        , account = getAccount flags
+        , expect = Http.expectJson receive Api.Model.ImapSettingsList.decoder
+        }
+
+
 createMailSettings :
     Flags
     -> Maybe String
@@ -284,7 +307,7 @@ createMailSettings flags mname ems receive =
     case mname of
         Just en ->
             Http2.authPut
-                { url = flags.config.baseUrl ++ "/api/v1/sec/email/settings/" ++ en
+                { url = flags.config.baseUrl ++ "/api/v1/sec/email/settings/smtp/" ++ en
                 , account = getAccount flags
                 , body = Http.jsonBody (Api.Model.EmailSettings.encode ems)
                 , expect = Http.expectJson receive Api.Model.BasicResult.decoder
@@ -292,13 +315,38 @@ createMailSettings flags mname ems receive =
 
         Nothing ->
             Http2.authPost
-                { url = flags.config.baseUrl ++ "/api/v1/sec/email/settings"
+                { url = flags.config.baseUrl ++ "/api/v1/sec/email/settings/smtp"
                 , account = getAccount flags
                 , body = Http.jsonBody (Api.Model.EmailSettings.encode ems)
                 , expect = Http.expectJson receive Api.Model.BasicResult.decoder
                 }
 
 
+createImapSettings :
+    Flags
+    -> Maybe String
+    -> ImapSettings
+    -> (Result Http.Error BasicResult -> msg)
+    -> Cmd msg
+createImapSettings flags mname ems receive =
+    case mname of
+        Just en ->
+            Http2.authPut
+                { url = flags.config.baseUrl ++ "/api/v1/sec/email/settings/imap/" ++ en
+                , account = getAccount flags
+                , body = Http.jsonBody (Api.Model.ImapSettings.encode ems)
+                , expect = Http.expectJson receive Api.Model.BasicResult.decoder
+                }
+
+        Nothing ->
+            Http2.authPost
+                { url = flags.config.baseUrl ++ "/api/v1/sec/email/settings/imap"
+                , account = getAccount flags
+                , body = Http.jsonBody (Api.Model.ImapSettings.encode ems)
+                , expect = Http.expectJson receive Api.Model.BasicResult.decoder
+                }
+
+
 
 --- Upload
 

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

@@ -0,0 +1,226 @@
+module Comp.ImapSettingsForm exposing
+    ( Model
+    , Msg
+    , emptyModel
+    , getSettings
+    , init
+    , isValid
+    , update
+    , view
+    )
+
+import Api.Model.ImapSettings exposing (ImapSettings)
+import Comp.Dropdown
+import Comp.IntField
+import Comp.PasswordInput
+import Data.SSLType exposing (SSLType)
+import Html exposing (..)
+import Html.Attributes exposing (..)
+import Html.Events exposing (onCheck, onInput)
+import Util.Maybe
+
+
+type alias Model =
+    { settings : ImapSettings
+    , name : String
+    , host : String
+    , portField : Comp.IntField.Model
+    , portNum : Maybe Int
+    , user : Maybe String
+    , passField : Comp.PasswordInput.Model
+    , password : Maybe String
+    , sslType : Comp.Dropdown.Model SSLType
+    , ignoreCertificates : Bool
+    }
+
+
+emptyModel : Model
+emptyModel =
+    { settings = Api.Model.ImapSettings.empty
+    , name = ""
+    , host = ""
+    , portField = Comp.IntField.init (Just 0) Nothing True "IMAP Port"
+    , portNum = Nothing
+    , user = Nothing
+    , passField = Comp.PasswordInput.init
+    , password = Nothing
+    , sslType =
+        Comp.Dropdown.makeSingleList
+            { makeOption = \s -> { value = Data.SSLType.toString s, text = Data.SSLType.label s }
+            , placeholder = ""
+            , options = Data.SSLType.all
+            , selected = Just Data.SSLType.None
+            }
+    , ignoreCertificates = False
+    }
+
+
+init : ImapSettings -> Model
+init ems =
+    { settings = ems
+    , name = ems.name
+    , host = ems.imapHost
+    , portField = Comp.IntField.init (Just 0) Nothing True "IMAP Port"
+    , portNum = ems.imapPort
+    , user = ems.imapUser
+    , passField = Comp.PasswordInput.init
+    , password = ems.imapPassword
+    , sslType =
+        Comp.Dropdown.makeSingleList
+            { makeOption = \s -> { value = Data.SSLType.toString s, text = Data.SSLType.label s }
+            , placeholder = ""
+            , options = Data.SSLType.all
+            , selected =
+                Data.SSLType.fromString ems.sslType
+                    |> Maybe.withDefault Data.SSLType.None
+                    |> Just
+            }
+    , ignoreCertificates = ems.ignoreCertificates
+    }
+
+
+getSettings : Model -> ( Maybe String, ImapSettings )
+getSettings model =
+    ( Util.Maybe.fromString model.settings.name
+    , { name = model.name
+      , imapHost = model.host
+      , imapUser = model.user
+      , imapPort = model.portNum
+      , imapPassword = model.password
+      , sslType =
+            Comp.Dropdown.getSelected model.sslType
+                |> List.head
+                |> Maybe.withDefault Data.SSLType.None
+                |> Data.SSLType.toString
+      , ignoreCertificates = model.ignoreCertificates
+      }
+    )
+
+
+type Msg
+    = SetName String
+    | SetHost String
+    | PortMsg Comp.IntField.Msg
+    | SetUser String
+    | PassMsg Comp.PasswordInput.Msg
+    | SSLTypeMsg (Comp.Dropdown.Msg SSLType)
+    | ToggleCheckCert
+
+
+isValid : Model -> Bool
+isValid model =
+    model.host /= "" && model.name /= ""
+
+
+update : Msg -> Model -> ( Model, Cmd Msg )
+update msg model =
+    case msg of
+        SetName str ->
+            ( { model | name = str }, Cmd.none )
+
+        SetHost str ->
+            ( { model | host = str }, Cmd.none )
+
+        PortMsg m ->
+            let
+                ( pm, val ) =
+                    Comp.IntField.update m model.portField
+            in
+            ( { model | portField = pm, portNum = val }, Cmd.none )
+
+        SetUser str ->
+            ( { model | user = Util.Maybe.fromString str }, Cmd.none )
+
+        PassMsg m ->
+            let
+                ( pm, val ) =
+                    Comp.PasswordInput.update m model.passField
+            in
+            ( { model | passField = pm, password = val }, Cmd.none )
+
+        SSLTypeMsg m ->
+            let
+                ( sm, sc ) =
+                    Comp.Dropdown.update m model.sslType
+            in
+            ( { model | sslType = sm }, Cmd.map SSLTypeMsg sc )
+
+        ToggleCheckCert ->
+            ( { model | ignoreCertificates = not model.ignoreCertificates }, Cmd.none )
+
+
+view : Model -> Html Msg
+view model =
+    div
+        [ classList
+            [ ( "ui form", True )
+            , ( "error", not (isValid model) )
+            , ( "success", isValid model )
+            ]
+        ]
+        [ div [ class "required field" ]
+            [ label [] [ text "Name" ]
+            , input
+                [ type_ "text"
+                , value model.name
+                , onInput SetName
+                , placeholder "Connection name, e.g. 'gmail.com'"
+                ]
+                []
+            , div [ class "ui info message" ]
+                [ text "The connection name must not contain whitespace or special characters."
+                ]
+            ]
+        , div [ class "fields" ]
+            [ div [ class "thirteen wide required field" ]
+                [ label [] [ text "IMAP Host" ]
+                , input
+                    [ type_ "text"
+                    , placeholder "IMAP host name, e.g. 'mail.gmail.com'"
+                    , value model.host
+                    , onInput SetHost
+                    ]
+                    []
+                ]
+            , Html.map PortMsg
+                (Comp.IntField.view model.portNum
+                    "three wide field"
+                    model.portField
+                )
+            ]
+        , div [ class "two fields" ]
+            [ div [ class "field" ]
+                [ label [] [ text "IMAP User" ]
+                , input
+                    [ type_ "text"
+                    , placeholder "IMAP Username, e.g. 'your.name@gmail.com'"
+                    , Maybe.withDefault "" model.user |> value
+                    , onInput SetUser
+                    ]
+                    []
+                ]
+            , div [ class "field" ]
+                [ label [] [ text "IMAP Password" ]
+                , Html.map PassMsg (Comp.PasswordInput.view model.password model.passField)
+                ]
+            ]
+        , div [ class "two fields" ]
+            [ div [ class "inline field" ]
+                [ div [ class "ui checkbox" ]
+                    [ input
+                        [ type_ "checkbox"
+                        , checked model.ignoreCertificates
+                        , onCheck (\_ -> ToggleCheckCert)
+                        ]
+                        []
+                    , label [] [ text "Ignore certificate check" ]
+                    ]
+                ]
+            ]
+        , div [ class "two fields" ]
+            [ div [ class "field" ]
+                [ label [] [ text "SSL" ]
+                , Html.map SSLTypeMsg (Comp.Dropdown.view model.sslType)
+                ]
+            ]
+        ]

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

@@ -0,0 +1,288 @@
+module Comp.ImapSettingsManage exposing
+    ( Model
+    , Msg
+    , emptyModel
+    , init
+    , update
+    , view
+    )
+
+import Api
+import Api.Model.BasicResult exposing (BasicResult)
+import Api.Model.ImapSettings
+import Api.Model.ImapSettingsList exposing (ImapSettingsList)
+import Comp.ImapSettingsForm
+import Comp.ImapSettingsTable
+import Comp.YesNoDimmer
+import Data.Flags exposing (Flags)
+import Html exposing (..)
+import Html.Attributes exposing (..)
+import Html.Events exposing (onClick, onInput)
+import Http
+import Util.Http
+
+
+type alias Model =
+    { tableModel : Comp.ImapSettingsTable.Model
+    , formModel : Comp.ImapSettingsForm.Model
+    , viewMode : ViewMode
+    , formError : Maybe String
+    , loading : Bool
+    , query : String
+    , deleteConfirm : Comp.YesNoDimmer.Model
+    }
+
+
+emptyModel : Model
+emptyModel =
+    { tableModel = Comp.ImapSettingsTable.emptyModel
+    , formModel = Comp.ImapSettingsForm.emptyModel
+    , viewMode = Table
+    , formError = Nothing
+    , loading = False
+    , query = ""
+    , deleteConfirm = Comp.YesNoDimmer.emptyModel
+    }
+
+
+init : Flags -> ( Model, Cmd Msg )
+init flags =
+    ( emptyModel, Api.getImapSettings flags "" MailSettingsResp )
+
+
+type ViewMode
+    = Table
+    | Form
+
+
+type Msg
+    = TableMsg Comp.ImapSettingsTable.Msg
+    | FormMsg Comp.ImapSettingsForm.Msg
+    | SetQuery String
+    | InitNew
+    | YesNoMsg Comp.YesNoDimmer.Msg
+    | RequestDelete
+    | SetViewMode ViewMode
+    | Submit
+    | SubmitResp (Result Http.Error BasicResult)
+    | LoadSettings
+    | MailSettingsResp (Result Http.Error ImapSettingsList)
+
+
+update : Flags -> Msg -> Model -> ( Model, Cmd Msg )
+update flags msg model =
+    case msg of
+        InitNew ->
+            let
+                ems =
+                    Api.Model.ImapSettings.empty
+
+                nm =
+                    { model
+                        | viewMode = Form
+                        , formError = Nothing
+                        , formModel = Comp.ImapSettingsForm.init ems
+                    }
+            in
+            ( nm, Cmd.none )
+
+        TableMsg m ->
+            let
+                ( tm, tc ) =
+                    Comp.ImapSettingsTable.update m model.tableModel
+
+                m2 =
+                    { model
+                        | tableModel = tm
+                        , viewMode = Maybe.map (\_ -> Form) tm.selected |> Maybe.withDefault Table
+                        , formError =
+                            if tm.selected /= Nothing then
+                                Nothing
+
+                            else
+                                model.formError
+                        , formModel =
+                            case tm.selected of
+                                Just ems ->
+                                    Comp.ImapSettingsForm.init ems
+
+                                Nothing ->
+                                    model.formModel
+                    }
+            in
+            ( m2, Cmd.map TableMsg tc )
+
+        FormMsg m ->
+            let
+                ( fm, fc ) =
+                    Comp.ImapSettingsForm.update m model.formModel
+            in
+            ( { model | formModel = fm }, Cmd.map FormMsg fc )
+
+        SetQuery str ->
+            let
+                m =
+                    { model | query = str }
+            in
+            ( m, Api.getImapSettings flags str MailSettingsResp )
+
+        YesNoMsg m ->
+            let
+                ( dm, flag ) =
+                    Comp.YesNoDimmer.update m model.deleteConfirm
+
+                ( mid, _ ) =
+                    Comp.ImapSettingsForm.getSettings model.formModel
+
+                cmd =
+                    case ( flag, mid ) of
+                        ( True, Just name ) ->
+                            Api.deleteImapSettings flags name SubmitResp
+
+                        _ ->
+                            Cmd.none
+            in
+            ( { model | deleteConfirm = dm }, cmd )
+
+        RequestDelete ->
+            update flags (YesNoMsg Comp.YesNoDimmer.activate) model
+
+        SetViewMode m ->
+            ( { model | viewMode = m }, Cmd.none )
+
+        Submit ->
+            let
+                ( mid, ems ) =
+                    Comp.ImapSettingsForm.getSettings model.formModel
+
+                valid =
+                    Comp.ImapSettingsForm.isValid model.formModel
+            in
+            if valid then
+                ( { model | loading = True }, Api.createImapSettings flags mid ems SubmitResp )
+
+            else
+                ( { model | formError = Just "Please fill required fields." }, Cmd.none )
+
+        LoadSettings ->
+            ( { model | loading = True }, Api.getImapSettings flags model.query MailSettingsResp )
+
+        SubmitResp (Ok res) ->
+            if res.success then
+                let
+                    ( m2, c2 ) =
+                        update flags (SetViewMode Table) model
+
+                    ( m3, c3 ) =
+                        update flags LoadSettings m2
+                in
+                ( { m3 | loading = False }, Cmd.batch [ c2, c3 ] )
+
+            else
+                ( { model | formError = Just res.message, loading = False }, Cmd.none )
+
+        SubmitResp (Err err) ->
+            ( { model | formError = Just (Util.Http.errorToString err), loading = False }, Cmd.none )
+
+        MailSettingsResp (Ok ems) ->
+            let
+                m2 =
+                    { model
+                        | viewMode = Table
+                        , loading = False
+                        , tableModel = Comp.ImapSettingsTable.init ems.items
+                    }
+            in
+            ( m2, Cmd.none )
+
+        MailSettingsResp (Err _) ->
+            ( { model | loading = False }, Cmd.none )
+
+
+view : Model -> Html Msg
+view model =
+    case model.viewMode of
+        Table ->
+            viewTable model
+
+        Form ->
+            viewForm model
+
+
+viewTable : Model -> Html Msg
+viewTable model =
+    div []
+        [ div [ class "ui secondary menu" ]
+            [ div [ class "horizontally fitted item" ]
+                [ div [ class "ui icon input" ]
+                    [ input
+                        [ type_ "text"
+                        , onInput SetQuery
+                        , value model.query
+                        , placeholder "Search…"
+                        ]
+                        []
+                    , i [ class "ui search icon" ]
+                        []
+                    ]
+                ]
+            , div [ class "right menu" ]
+                [ div [ class "item" ]
+                    [ a
+                        [ class "ui primary button"
+                        , href "#"
+                        , onClick InitNew
+                        ]
+                        [ i [ class "plus icon" ] []
+                        , text "New Settings"
+                        ]
+                    ]
+                ]
+            ]
+        , Html.map TableMsg (Comp.ImapSettingsTable.view model.tableModel)
+        ]
+
+
+viewForm : Model -> Html Msg
+viewForm model =
+    div [ class "ui segment" ]
+        [ Html.map YesNoMsg (Comp.YesNoDimmer.view model.deleteConfirm)
+        , Html.map FormMsg (Comp.ImapSettingsForm.view model.formModel)
+        , div
+            [ classList
+                [ ( "ui error message", True )
+                , ( "invisible", model.formError == Nothing )
+                ]
+            ]
+            [ Maybe.withDefault "" model.formError |> text
+            ]
+        , div [ class "ui divider" ] []
+        , button
+            [ class "ui primary button"
+            , onClick Submit
+            , href "#"
+            ]
+            [ text "Submit"
+            ]
+        , a
+            [ class "ui secondary button"
+            , onClick (SetViewMode Table)
+            , href ""
+            ]
+            [ text "Cancel"
+            ]
+        , if model.formModel.settings.name /= "" then
+            a [ class "ui right floated red button", href "", onClick RequestDelete ]
+                [ text "Delete" ]
+
+          else
+            span [] []
+        , div
+            [ classList
+                [ ( "ui dimmer", True )
+                , ( "active", model.loading )
+                ]
+            ]
+            [ div [ class "ui loader" ] []
+            ]
+        ]

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

@@ -0,0 +1,74 @@
+module Comp.ImapSettingsTable exposing
+    ( Model
+    , Msg
+    , emptyModel
+    , init
+    , update
+    , view
+    )
+
+import Api.Model.ImapSettings exposing (ImapSettings)
+import Html exposing (..)
+import Html.Attributes exposing (..)
+import Html.Events exposing (onClick)
+
+
+type alias Model =
+    { emailSettings : List ImapSettings
+    , selected : Maybe ImapSettings
+    }
+
+
+emptyModel : Model
+emptyModel =
+    init []
+
+
+init : List ImapSettings -> Model
+init ems =
+    { emailSettings = ems
+    , selected = Nothing
+    }
+
+
+type Msg
+    = Select ImapSettings
+
+
+update : Msg -> Model -> ( Model, Cmd Msg )
+update msg model =
+    case msg of
+        Select ems ->
+            ( { model | selected = Just ems }, Cmd.none )
+
+
+view : Model -> Html Msg
+view model =
+    table [ class "ui selectable pointer table" ]
+        [ thead []
+            [ th [ class "collapsible" ] [ text "Name" ]
+            , th [] [ text "Host/Port" ]
+            ]
+        , tbody []
+            (List.map (renderLine model) model.emailSettings)
+        ]
+
+
+renderLine : Model -> ImapSettings -> Html Msg
+renderLine model ems =
+    let
+        hostport =
+            case ems.imapPort of
+                Just p ->
+                    ems.imapHost ++ ":" ++ String.fromInt p
+
+                Nothing ->
+                    ems.imapHost
+    in
+    tr
+        [ classList [ ( "active", model.selected == Just ems ) ]
+        , onClick (Select ems)
+        ]
+        [ td [ class "collapsible" ] [ text ems.name ]
+        , td [] [ text hostport ]
+        ]

modules/webapp/src/main/elm/Page/UserSettings/Data.elm

@@ -7,6 +7,7 @@ module Page.UserSettings.Data exposing
 
 import Comp.ChangePasswordForm
 import Comp.EmailSettingsManage
+import Comp.ImapSettingsManage
 import Comp.NotificationForm
 import Data.Flags exposing (Flags)
 
@@ -15,6 +16,7 @@ type alias Model =
     { currentTab : Maybe Tab
     , changePassModel : Comp.ChangePasswordForm.Model
     , emailSettingsModel : Comp.EmailSettingsManage.Model
+    , imapSettingsModel : Comp.ImapSettingsManage.Model
     , notificationModel : Comp.NotificationForm.Model
     }
 
@@ -24,6 +26,7 @@ emptyModel flags =
     { currentTab = Nothing
     , changePassModel = Comp.ChangePasswordForm.emptyModel
     , emailSettingsModel = Comp.EmailSettingsManage.emptyModel
+    , imapSettingsModel = Comp.ImapSettingsManage.emptyModel
     , notificationModel = Tuple.first (Comp.NotificationForm.init flags)
     }
 
@@ -31,6 +34,7 @@ emptyModel flags =
 type Tab
     = ChangePassTab
     | EmailSettingsTab
+    | ImapSettingsTab
     | NotificationTab
 
 
@@ -39,3 +43,4 @@ type Msg
     | ChangePassMsg Comp.ChangePasswordForm.Msg
     | EmailSettingsMsg Comp.EmailSettingsManage.Msg
     | NotificationMsg Comp.NotificationForm.Msg
+    | ImapSettingsMsg Comp.ImapSettingsManage.Msg

modules/webapp/src/main/elm/Page/UserSettings/Update.elm

@@ -2,6 +2,7 @@ module Page.UserSettings.Update exposing (update)
 
 import Comp.ChangePasswordForm
 import Comp.EmailSettingsManage
+import Comp.ImapSettingsManage
 import Comp.NotificationForm
 import Data.Flags exposing (Flags)
 import Page.UserSettings.Data exposing (..)
@@ -24,6 +25,13 @@ update flags msg model =
                             in
                             ( { m | emailSettingsModel = em }, Cmd.map EmailSettingsMsg c )
 
+                        ImapSettingsTab ->
+                            let
+                                ( em, c ) =
+                                    Comp.ImapSettingsManage.init flags
+                            in
+                            ( { m | imapSettingsModel = em }, Cmd.map ImapSettingsMsg c )
+
                         ChangePassTab ->
                             ( m, Cmd.none )
 
@@ -51,6 +59,13 @@ update flags msg model =
             in
             ( { model | emailSettingsModel = m2 }, Cmd.map EmailSettingsMsg c2 )
 
+        ImapSettingsMsg m ->
+            let
+                ( m2, c2 ) =
+                    Comp.ImapSettingsManage.update flags m model.imapSettingsModel
+            in
+            ( { model | imapSettingsModel = m2 }, Cmd.map ImapSettingsMsg c2 )
+
         NotificationMsg lm ->
             let
                 ( m2, c2 ) =

modules/webapp/src/main/elm/Page/UserSettings/View.elm

@@ -2,6 +2,7 @@ module Page.UserSettings.View exposing (view)
 
 import Comp.ChangePasswordForm
 import Comp.EmailSettingsManage
+import Comp.ImapSettingsManage
 import Comp.NotificationForm
 import Html exposing (..)
 import Html.Attributes exposing (..)
@@ -20,7 +21,8 @@ view model =
             , div [ class "ui attached fluid segment" ]
                 [ div [ class "ui fluid vertical secondary menu" ]
                     [ makeTab model ChangePassTab "Change Password" "user secret icon"
-                    , makeTab model EmailSettingsTab "E-Mail Settings" "mail icon"
+                    , makeTab model EmailSettingsTab "E-Mail Settings (SMTP)" "mail icon"
+                    , makeTab model ImapSettingsTab "E-Mail Settings (IMAP)" "mail icon"
                     , makeTab model NotificationTab "Notifications" "bullhorn icon"
                     ]
                 ]
@@ -37,6 +39,9 @@ view model =
                     Just NotificationTab ->
                         viewNotificationForm model
 
+                    Just ImapSettingsTab ->
+                        viewImapSettings model
+
                     Nothing ->
                         []
                 )
@@ -61,13 +66,25 @@ viewEmailSettings model =
     [ h2 [ class "ui header" ]
         [ i [ class "mail icon" ] []
         , div [ class "content" ]
-            [ text "E-Mail Settings"
+            [ text "E-Mail Settings (Smtp)"
             ]
         ]
     , Html.map EmailSettingsMsg (Comp.EmailSettingsManage.view model.emailSettingsModel)
     ]
 
 
+viewImapSettings : Model -> List (Html Msg)
+viewImapSettings model =
+    [ h2 [ class "ui header" ]
+        [ i [ class "mail icon" ] []
+        , div [ class "content" ]
+            [ text "E-Mail Settings (Imap)"
+            ]
+        ]
+    , Html.map ImapSettingsMsg (Comp.ImapSettingsManage.view model.imapSettingsModel)
+    ]
+
+
 viewChangePassword : Model -> List (Html Msg)
 viewChangePassword model =
     [ h2 [ class "ui header" ]