Remove external link

This commit is contained in:
Tessa Kelly 2021-12-03 09:40:45 -08:00
parent e012dc1f91
commit 925c4ea64a
2 changed files with 67 additions and 65 deletions

View File

@ -1,14 +1,13 @@
module Nri.Ui.SideNav.V1 exposing
( view, Config, SidebarEntry
, link, LinkConfig
, externalLink, ExternalLinkConfig
, withBorderStyles
)
{-|
@docs view, Config, SidebarEntry
@docs link, LinkConfig
@docs externalLink, ExternalLinkConfig
-}
@ -22,22 +21,23 @@ import Nri.Ui.ClickableText.V3 as ClickableText
import Nri.Ui.Colors.V1 as Colors
import Nri.Ui.Data.PremiumLevel as PremiumLevel exposing (PremiumLevel)
import Nri.Ui.Fonts.V1 as Fonts
import Nri.Ui.Html.V3 exposing (viewJust)
import Nri.Ui.Svg.V1 as Svg exposing (Svg)
import Nri.Ui.UiIcon.V1 as UiIcon
import String exposing (toLower)
import String.Extra exposing (dasherize)
{-| Use `link` or `externalLink` to create a sidebar link.
{-| Use `link` to create a sidebar link.
-}
type SidebarEntry route msg
= Link (LinkConfig route msg)
| ExternalLink ExternalLinkConfig
{-| -}
type alias LinkConfig route msg =
{ title : String
{ icon : Maybe Svg
, title : String
, route : route
, attributes : List (Html.Styled.Attribute msg)
, children : List (SidebarEntry route msg)
@ -51,20 +51,6 @@ link =
Link
{-| -}
type alias ExternalLinkConfig =
{ icon : Svg
, plaintext : String
, url : String
}
{-| -}
externalLink : ExternalLinkConfig -> SidebarEntry route msg
externalLink =
ExternalLink
{-| -}
type alias Config route msg =
{ userPremiumLevel : PremiumLevel
@ -119,25 +105,6 @@ viewSkipLink onSkip =
viewSidebarEntry : Config route msg -> List Css.Style -> SidebarEntry route msg -> Html msg
viewSidebarEntry config extraStyles sidebarEntry =
case sidebarEntry of
ExternalLink { plaintext, icon, url } ->
styled a
(sharedEntryStyles
++ extraStyles
++ [ backgroundColor Colors.white
, boxShadow3 zero (px 2) Colors.gray75
, border3 (px 1) solid Colors.gray75
, marginBottom (px 10)
]
)
[ Attributes.href url ]
[ icon
|> Svg.withWidth (px 20)
|> Svg.withHeight (px 20)
|> Svg.withCss [ marginRight (px 5) ]
|> Svg.toHtml
, text plaintext
]
Link entry ->
if PremiumLevel.allowedFor entry.premiumLevel config.userPremiumLevel then
if anyLinkDescendants (.route >> config.isCurrentRoute) entry then
@ -166,16 +133,7 @@ viewSidebarEntry config extraStyles sidebarEntry =
anyLinkDescendants : (LinkConfig route msg -> Bool) -> LinkConfig route msg -> Bool
anyLinkDescendants f { children } =
List.any
(\child ->
case child of
Link entry ->
f entry || anyLinkDescendants f entry
ExternalLink _ ->
False
)
children
List.any (\(Link entry) -> f entry || anyLinkDescendants f entry) children
viewSidebarLeaf :
@ -183,7 +141,7 @@ viewSidebarLeaf :
-> List Style
-> LinkConfig route msg
-> Html msg
viewSidebarLeaf config extraStyles { title, route, attributes } =
viewSidebarLeaf config extraStyles { icon, title, route, attributes } =
styled Html.Styled.a
(sharedEntryStyles
++ extraStyles
@ -199,7 +157,17 @@ viewSidebarLeaf config extraStyles { title, route, attributes } =
)
)
attributes
[ text title ]
[ viewJust
(\icon_ ->
icon_
|> Svg.withWidth (px 20)
|> Svg.withHeight (px 20)
|> Svg.withCss [ marginRight (px 5) ]
|> Svg.toHtml
)
icon
, text title
]
viewLockedEntry : String -> List Style -> Html msg
@ -210,18 +178,9 @@ viewLockedEntry title extraStyles =
"browse-and-assign-locked-entry__" ++ dasherize (toLower title)
in
styled Html.Styled.button
[ paddingLeft (px 20)
, paddingRight (px 20)
, displayFlex
, alignItems center
, Fonts.baseFont
, fontSize (px 15)
, textDecoration none
, color Colors.gray45
, height (px 45)
, borderStyle none
, backgroundColor Colors.gray96
, textAlign left
[ batch sharedEntryStyles
, important (color Colors.gray45)
, borderWidth zero
, batch extraStyles
]
[ -- TODO: reimplement lock click behavior!
@ -237,7 +196,7 @@ viewLockedEntry title extraStyles =
]
sharedEntryStyles : List Css.Style
sharedEntryStyles : List Style
sharedEntryStyles =
[ paddingLeft (px 20)
, paddingRight (px 20)
@ -247,7 +206,18 @@ sharedEntryStyles =
, alignItems center
, Fonts.baseFont
, color Colors.navy
, backgroundColor transparent
, textDecoration none
, fontSize (px 15)
, fontWeight (int 600)
, marginBottom (px 10)
]
withBorderStyles : List Style
withBorderStyles =
-- TODO: add a convenient way to use these styels
[ backgroundColor Colors.white
, boxShadow3 zero (px 2) Colors.gray75
, border3 (px 1) solid Colors.gray75
]

View File

@ -22,6 +22,7 @@ import Nri.Ui.Heading.V2 as Heading
import Nri.Ui.MediaQuery.V1 exposing (mobile, notMobile)
import Nri.Ui.Page.V3 as Page
import Nri.Ui.SideNav.V1 as SideNav
import Nri.Ui.UiIcon.V1 as UiIcon
import Routes as Routes exposing (Route(..))
import Sort.Set as Set exposing (Set)
import Task
@ -227,7 +228,8 @@ navigation currentRoute =
let
toNavLinkConfig : Category -> SideNav.LinkConfig Route Msg
toNavLinkConfig category =
{ title = Category.forDisplay category
{ icon = Nothing
, title = Category.forDisplay category
, route = Routes.Category category
, attributes = [ href (Routes.toString (Routes.Category category)) ]
, children = []
@ -237,13 +239,43 @@ navigation currentRoute =
navLinks : List (SideNav.SidebarEntry Route Msg)
navLinks =
SideNav.link
{ title = "All"
{ icon = Nothing
, title = "All"
, route = Routes.All
, attributes = [ href (Routes.toString Routes.All) ]
, children = []
, premiumLevel = PremiumLevel.Free
}
:: List.map (toNavLinkConfig >> SideNav.link) Category.all
++ [ SideNav.link
{ icon = Nothing
, title = "Special Examples"
, route = Routes.All
, attributes = []
, children =
[ SideNav.link
{ icon = Nothing
, title = "Example of Locked Premium content"
, route = Routes.All
, attributes = [ href (Routes.toString Routes.All) ]
, children = []
, premiumLevel = PremiumLevel.PremiumWithWriting
}
, SideNav.link
{ icon = Just UiIcon.gear
, title = "Create your own"
, route = Routes.All
, attributes =
[ href (Routes.toString Routes.All)
, css SideNav.withBorderStyles
]
, children = []
, premiumLevel = PremiumLevel.Free
}
]
, premiumLevel = PremiumLevel.Free
}
]
in
SideNav.view
{ userPremiumLevel = PremiumLevel.Free