Merge pull request #7 from rich-id/feature/t52285

Feature/t52285

elm/CookiesRegulation.elm

@@ -2,7 +2,7 @@ port module CookiesRegulation exposing (main)
 
 import Bool.Extra as Bool
 import Browser
-import Browser.Dom exposing (Error, Viewport, getViewportOf)
+import Browser.Dom as Dom exposing (Error, Viewport, getViewportOf)
 import Browser.Events exposing (onResize)
 import Dict exposing (Dict)
 import Html exposing (Attribute, Html, div)
@@ -90,7 +90,13 @@ init flags =
             needUserAction notMandatoryServices flags.preferences
 
         initialBannerState =
-            if needUserAction_ then
+            if not (Dict.isEmpty notMandatoryServices) && needUserAction_ then
+                BannerNeedOpen
+
+            else if not (Dict.isEmpty notMandatoryServices) && not needUserAction_ then
+                BannerClosed
+
+            else if Dict.isEmpty notMandatoryServices && not flags.isCookiePresent then
                 BannerNeedOpen
 
             else
@@ -108,6 +114,8 @@ init flags =
       , modalBodyScrollable = False
       , locale = decodeLocale flags.config.locale
       , lastDecisionMetadata = flags.decisionMetadata
+      , noConsent = Dict.isEmpty notMandatoryServices
+      , isCookiePresent = flags.isCookiePresent
       }
     , initializeServices services enabledNotMandatoryServices
     )
@@ -160,10 +168,13 @@ needUserAction services preferences =
 update : Msg -> Model -> ( Model, Cmd Msg )
 update msg model =
     case msg of
+        MsgFocus _ ->
+            ( model, Cmd.none )
+
         MsgOpenModal ->
             ( model
                 |> openModalAction
-            , Cmd.batch [ modalOpened (), modalBodySizeCmd ]
+            , Cmd.batch [ modalOpened (), modalBodySizeCmd, Dom.focus "cookies-regulation-modal" |> Task.attempt MsgFocus ]
             )
 
         MsgCloseModal ->
@@ -250,6 +261,11 @@ resetNeedUserAction model =
     { model | needUserAction = False }
 
 
+addCookie : Model -> Model
+addCookie model =
+    { model | isCookiePresent = True }
+
+
 setAllServicesEnabledAction : Model -> Model
 setAllServicesEnabledAction model =
     { model | notMandatoryServices = Dict.map (\_ service -> { service | enabled = True }) model.notMandatoryServices }
@@ -288,6 +304,7 @@ applyServiceStatusChanges model =
     in
     ( model
         |> resetNeedUserAction
+        |> addCookie
         |> recomputeEnabledNotMandatoryServicesAction
         |> closeBannerAction
         |> closeModalAction

elm/Internal/Button.elm

@@ -1,7 +1,7 @@
 module Internal.Button exposing (ButtonType(..), view)
 
 import Html exposing (Attribute, Html, button, text)
-import Html.Attributes exposing (class)
+import Html.Attributes exposing (class, type_)
 import Html.Events exposing (onClick)
 import Internal.CookiesRegulationData exposing (Model, Msg)
 import Internal.Helpers exposing (..)
@@ -23,9 +23,10 @@ type ButtonType
 view : ButtonConfig Msg -> Html Msg
 view config =
     button
-        [ class "cookies-regulation-button"
+        [ type_ "button"
+        , class "cookies-regulation-button"
         , class "cookies-regulation-button-secondary" |> attrWhen (config.type_ == Secondary)
         , class "cookies-regulation-button-disabled" |> attrWhen config.disabled
-        , onClick config.msg
+        , onClick config.msg |> attrWhen (not config.disabled)
         ]
         [ text config.label ]

elm/Internal/CookiesRegulationBanner.elm

@@ -1,11 +1,12 @@
 module Internal.CookiesRegulationBanner exposing (view)
 
-import Html exposing (Attribute, Html, a, div, span, text)
-import Html.Attributes exposing (class, href, target)
-import Html.Events as Events
+import Html exposing (Attribute, Html, a, button, div, span, text)
+import Html.Attributes exposing (attribute, class, href, id, target, type_)
+import Html.Events as Events exposing (onClick)
 import Internal.Button as Button
 import Internal.CookiesRegulationData exposing (BannerState(..), Model, Msg(..))
 import Internal.Helpers exposing (..)
+import Internal.Picto as Picto
 import Internal.Translations as Trans
 import Json.Decode as Decode
 
@@ -18,16 +19,43 @@ view model =
             , class "cookies-regulation-show" |> attrWhen (model.bannerState == BannerOpened)
             , Events.on "transitionend" (Decode.succeed InternalMsgCloseBanner) |> attrWhen (model.bannerState == BannerFadeClose)
             ]
-            [ div [ class "cookies-regulation-banner-contents" ]
-                [ span [ class "cookies-regulation-description" ] [ text <| Trans.banner_cookies_regulation model.locale ]
-                , Button.view { label = Trans.banner_customise model.locale, type_ = Button.Secondary, disabled = False, msg = MsgOpenModal }
-                , Button.view { label = Trans.modal_accept_all model.locale, type_ = Button.Primary, disabled = False, msg = MsgBannerAcceptAll }
-                , Button.view { label = Trans.modal_reject_all model.locale, type_ = Button.Primary, disabled = False, msg = MsgBannerRejectAll }
-                , a
-                    [ class "cookies-regulation-privacy-policy"
-                    , href model.privacyPolicy.url
-                    , target "_blank" |> attrWhen model.privacyPolicy.openInNewWindow
+            [ htmlWhen model.needUserAction <|
+                div [ class "cookies-regulation-banner-contents" ]
+                    [ span [ class "cookies-regulation-description" ] [ text <| Trans.banner_cookies_regulation model.locale ]
+                    , Button.view { label = Trans.banner_customise model.locale, type_ = Button.Secondary, disabled = False, msg = MsgOpenModal }
+                    , Button.view { label = Trans.modal_accept_all model.locale, type_ = Button.Primary, disabled = False, msg = MsgBannerAcceptAll }
+                    , Button.view { label = Trans.modal_reject_all model.locale, type_ = Button.Primary, disabled = False, msg = MsgBannerRejectAll }
+                    , a
+                        [ class "cookies-regulation-privacy-policy"
+                        , href model.privacyPolicy.url
+                        , target "_blank" |> attrWhen model.privacyPolicy.openInNewWindow
+                        ]
+                        [ text model.privacyPolicy.label ]
+                    ]
+            , htmlWhen model.noConsent <|
+                div [ class "cookies-regulation-banner-contents" ]
+                    [ span [ class "cookies-regulation-description" ] [ text <| Trans.banner_cookies_no_consent model.locale ]
+                    , Button.view { label = Trans.banner_cookies_button_details model.locale, type_ = Button.Secondary, disabled = False, msg = MsgOpenModal }
+                    , a
+                        [ class "cookies-regulation-privacy-policy"
+                        , href model.privacyPolicy.url
+                        , target "_blank" |> attrWhen model.privacyPolicy.openInNewWindow
+                        ]
+                        [ text model.privacyPolicy.label ]
+                    ]
+            , htmlWhen model.noConsent <|
+                button
+                    [ id "cookies-regulation-close-banner"
+                    , type_ "button"
+                    , attribute "aria-label" (Trans.banner_close model.locale)
+                    , onClick
+                        (if model.needUserAction then
+                            InternalMsgCloseBanner
+
+                         else
+                            MsgSave
+                        )
+                    ]
+                    [ Picto.close []
                     ]
-                    [ text model.privacyPolicy.label ]
-                ]
             ]

elm/Internal/CookiesRegulationData.elm

@@ -1,6 +1,6 @@
 module Internal.CookiesRegulationData exposing (BannerState(..), DecisionMetadata, Flags, FlagsConfiguration, ModalState(..), Model, Msg(..), Preferences, PrivacyPolicy, Service, ServiceId, Services, decodeLocale, serviceConfigurationDecoder)
 
-import Browser.Dom exposing (Error, Viewport)
+import Browser.Dom as Dom exposing (Error, Viewport)
 import Dict exposing (Dict)
 import Internal.Translations exposing (Locale(..))
 import Json.Decode as Decode
@@ -15,6 +15,7 @@ type alias Flags =
     { config : FlagsConfiguration
     , preferences : Preferences
     , decisionMetadata : Maybe DecisionMetadata
+    , isCookiePresent : Bool
     }
 
 
@@ -44,6 +45,8 @@ type alias Model =
     , modalBodyScrollable : Bool
     , locale : Locale
     , lastDecisionMetadata : Maybe DecisionMetadata
+    , noConsent : Bool
+    , isCookiePresent : Bool
     }
 
 
@@ -56,6 +59,7 @@ type alias PrivacyPolicy =
 
 type alias ModalConfiguration =
     { header : String
+    , headerWithoutConsent : String
     , relatedCompaniesCount : Int
     , relatedCompaniesPrivacyPolicyUrl : String
     }
@@ -111,7 +115,8 @@ type BannerState
 
 
 type Msg
-    = MsgOpenModal
+    = MsgFocus (Result Dom.Error ())
+    | MsgOpenModal
     | MsgCloseModal
     | MsgBannerAcceptAll
     | MsgBannerRejectAll

elm/Internal/CookiesRegulationModal.elm

@@ -1,7 +1,7 @@
 module Internal.CookiesRegulationModal exposing (view)
 
 import Dict exposing (Dict)
-import Html exposing (Attribute, Html, a, b, div, p, span, text)
+import Html exposing (Attribute, Html, a, b, button, div, p, span, text)
 import Html.Attributes exposing (class, href, id, style, tabindex, target)
 import Html.Events as Events exposing (onClick)
 import Internal.Button as Button
@@ -17,7 +17,8 @@ view : Model -> Html Msg
 view model =
     div []
         [ div
-            [ class "cookies-regulation-modal"
+            [ id "cookies-regulation-modal"
+            , class "cookies-regulation-modal"
             , class "cookies-regulation-show" |> attrWhen (model.modalState == ModalOpened)
             , style "height" "0" |> attrWhen (model.modalState == ModalClosed)
             , Events.on "transitionend" (Decode.succeed InternalMsgCloseModal) |> attrWhen (model.modalState == ModalFadeClose)
@@ -45,7 +46,18 @@ modalHeaderView model =
     div [ class "cookies-regulation-modal-header" ]
         [ div [ class "cookies-regulation-h3" ] [ text (Trans.modal_title model.locale) ]
         , htmlWhenNot model.needUserAction <|
-            Picto.close [ onClick MsgCloseModal ]
+            button
+                [ id "cookies-regulation-close"
+                , onClick
+                    (if model.isCookiePresent then
+                        MsgCloseModal
+
+                     else
+                        MsgSave
+                    )
+                ]
+                [ Picto.close []
+                ]
         ]
 
 
@@ -58,27 +70,50 @@ modalBodyView model =
         ]
         [ div [ class "cookies-regulation-modal-body-content" ]
             [ div [ class "cookies-regulation-modal-body-content-top" ]
-                [ p [ class "cookies-regulation-modal-body-content-header" ] [ text model.modal.header ]
+                [ p [ class "cookies-regulation-modal-body-content-header" ]
+                    [ if model.noConsent then
+                        text <| model.modal.headerWithoutConsent
+
+                      else
+                        text <| model.modal.header
+                    ]
                 , relatedCompaniesView model
-                , cookieDurationView model
+                , htmlWhen (not model.noConsent) <| cookieDurationView model
                 , privacyPolicyLinkView model
-                , globalActionButtonsView model
+                , htmlWhen (not model.noConsent) <| globalActionButtonsView model
                 ]
-            , servicesListView model.locale (Trans.modal_cookies_with_agreement model.locale) model.notMandatoryServices
+            , htmlWhen (not model.noConsent) <| servicesListView model.locale (Trans.modal_cookies_with_agreement model.locale) model.notMandatoryServices
             , servicesListView model.locale (Trans.modal_cookies_without_agreement model.locale) model.mandatoryServices
             ]
         ]
 
 
 modalFooterView : Model -> Html Msg
 modalFooterView model =
+    let
+        _ =
+            Debug.log "test" (not (hasAcceptationChange model) && not model.needUserAction)
+    in
     div [ class "cookies-regulation-modal-footer" ]
-        [ Button.view
-            { label = Trans.modal_save_my_choices model.locale
-            , type_ = Button.Primary
-            , disabled = not (hasAcceptationChange model) && not model.needUserAction
-            , msg = MsgSave
-            }
+        [ htmlWhen (not model.noConsent) <|
+            Button.view
+                { label = Trans.modal_save_my_choices model.locale
+                , type_ = Button.Primary
+                , disabled = not (hasAcceptationChange model) && not model.needUserAction
+                , msg = MsgSave
+                }
+        , htmlWhen model.noConsent <|
+            Button.view
+                { label = Trans.banner_cookies_modal_button_no_consent_close model.locale
+                , type_ = Button.Primary
+                , disabled = False
+                , msg =
+                    if model.isCookiePresent then
+                        MsgCloseModal
+
+                    else
+                        MsgSave
+                }
         , htmlJust model.lastDecisionMetadata <|
             decisionMetadataView
         ]

elm/Internal/Helpers.elm

@@ -73,7 +73,6 @@ buildPreferencesForSave model =
         |> Dict.map (\serviceId service -> ( serviceId, service.enabled ))
         |> Dict.values
 
-
 filterMandatoryServices : Services -> Services
 filterMandatoryServices services =
     Dict.filter (\_ service -> service.mandatory) services

elm/Internal/Picto.elm

@@ -20,7 +20,7 @@ clock =
 
 close : List (Attribute msg) -> Html msg
 close attrs =
-    svg ([ SvgAttr.width "16", SvgAttr.height "16", SvgAttr.viewBox "0 0 16 16", id "cookies-regulation-close" ] ++ attrs)
+    svg ([ SvgAttr.width "16", SvgAttr.height "16", SvgAttr.viewBox "0 0 16 16" ] ++ attrs)
         [ path
             [ SvgAttr.d "M15.18 15.984c.088-.01.174-.033.258-.07l.12-.06.114-.073c.083-.083.148-.177.195-.281.047-.104.07-.214.07-.328 0-.115-.018-.216-.054-.305-.024-.059-.055-.114-.09-.166l-.059-.076L9.156 8l6.61-6.594c.073-.083.13-.174.171-.273.042-.1.063-.206.063-.32 0-.105-.02-.206-.063-.305-.027-.066-.062-.129-.104-.188l-.067-.086c-.073-.073-.162-.13-.266-.172C15.396.021 15.292 0 15.187 0c-.114 0-.22.02-.32.063-.099.041-.19.098-.273.171L8 6.844 1.406.234c-.083-.073-.174-.13-.273-.172C1.033.021.927 0 .813 0 .708 0 .604.02.5.063.43.09.368.124.312.166L.234.234C.161.318.104.41.062.508.021.607 0 .708 0 .812c0 .115.02.222.063.32.027.067.062.13.104.188l.067.086L6.86 8 .25 14.625c-.052.063-.096.138-.133.227-.024.059-.043.119-.055.18l-.015.093v.063c0 .218.075.406.226.562.121.125.264.203.428.235L.828 16c.115 0 .221-.02.32-.063.066-.027.129-.064.188-.11l.086-.077L8 9.14l6.625 6.594c.073.084.159.146.258.188.066.028.135.046.208.055l.089.007z"
             , SvgAttr.transform "translate(-1055 -86) translate(345 62) translate(710 24)"

elm/Internal/Translations.elm

@@ -1,4 +1,4 @@
-module Internal.Translations exposing (Locale(..), banner_cookies_regulation, banner_customise, modal_accept_all, modal_cookie_conservation, modal_cookies_with_agreement, modal_cookies_without_agreement, modal_reject_all, modal_related_companies_link_label, modal_related_companies_use_cookies, modal_save_my_choices, modal_title, modal_user_choices_change, modal_user_choices_conservation_duration)
+module Internal.Translations exposing (Locale(..), banner_close, banner_cookies_button_details, banner_cookies_modal_button_no_consent_close, banner_cookies_no_consent, banner_cookies_regulation, banner_customise, modal_accept_all, modal_cookie_conservation, modal_cookies_with_agreement, modal_cookies_without_agreement, modal_reject_all, modal_related_companies_link_label, modal_related_companies_use_cookies, modal_save_my_choices, modal_title, modal_user_choices_change, modal_user_choices_conservation_duration)
 
 
 type Locale
@@ -16,6 +16,16 @@ banner_cookies_regulation locale =
             "Contrôlez les cookies que nous utilisons pour ce site..."
 
 
+banner_close : Locale -> String
+banner_close locale =
+    case locale of
+        En ->
+            "Close banner"
+
+        Fr ->
+            "Fermer"
+
+
 banner_customise : Locale -> String
 banner_customise locale =
     case locale of
@@ -158,3 +168,33 @@ modal_user_choices_conservation_duration locale =
 
         Fr ->
             "Nous conservons vos choix pendant 6 mois."
+
+
+banner_cookies_no_consent : Locale -> String
+banner_cookies_no_consent locale =
+    case locale of
+        En ->
+            "Your privacy is important ! We do not use any cookie requiring your consent."
+
+        Fr ->
+            "Votre vie privée nous importe ! Nous n’utilisons aucun cookie indiscret nécessitant votre consentement."
+
+
+banner_cookies_button_details : Locale -> String
+banner_cookies_button_details locale =
+    case locale of
+        En ->
+            "Cookies details"
+
+        Fr ->
+            "Détails des cookies"
+
+
+banner_cookies_modal_button_no_consent_close : Locale -> String
+banner_cookies_modal_button_no_consent_close locale =
+    case locale of
+        En ->
+            "Close"
+
+        Fr ->
+            "Fermer"