use markdown in bookmark extended description

espial.cabal

@@ -1,8 +1,10 @@
--- This file has been generated from package.yaml by hpack version 0.28.2.
+cabal-version: 1.12
+
+-- This file has been generated from package.yaml by hpack version 0.31.1.
 --
 -- see: https://github.com/sol/hpack
 --
--- hash: c9ea5f2d822708beca3dc6ea7fdfd09698f9f2df05afb37ac16e204d89a528c2
+-- hash: ac9856c342ac9d7c05b18be91fb062e098dbf3575b2fbe7293f69df2d5b76cce
 
 name:           espial
 version:        0.0.8
@@ -21,8 +23,8 @@ copyright:      Copyright (c) 2018 Jon Schoning
 license:        AGPL-3
 license-file:   LICENSE
 build-type:     Simple
-cabal-version:  >= 1.10
 extra-source-files:
+    README.md
     changelog.md
     config/favicon.ico
     config/keter.yml
@@ -30,42 +32,6 @@ extra-source-files:
     config/routes
     config/settings.yml
     config/test-settings.yml
-    purs/Makefile
-    purs/packages.dhall
-    purs/spago.dhall
-    purs/src/App.purs
-    purs/src/Component/AccountSettings.purs
-    purs/src/Component/Add.purs
-    purs/src/Component/BList.purs
-    purs/src/Component/BMark.purs
-    purs/src/Component/Markdown.purs
-    purs/src/Component/NList.purs
-    purs/src/Component/NNote.purs
-    purs/src/Component/RawHtml.js
-    purs/src/Component/RawHtml.purs
-    purs/src/Globals.js
-    purs/src/Globals.purs
-    purs/src/Main.js
-    purs/src/Main.purs
-    purs/src/Marked.js
-    purs/src/Marked.purs
-    purs/src/Model.purs
-    purs/src/Util.purs
-    purs/test/Main.purs
-    README.md
-    static/css/main.css
-    static/css/popup.css
-    static/css/tachyons.min.css
-    static/css/tachyons.min.css.gz
-    static/images/bluepin.gif
-    static/js/app.min.js
-    static/js/app.min.js.gz
-    static/js/app.min.map
-    static/js/app.min.map.gz
-    static/js/html5shiv.min.js
-    static/js/html5shiv.min.js.gz
-    static/js/js.cookie-2.2.0.min.js
-    static/js/js.cookie-2.2.0.min.js.gz
     templates/change-password.hamlet
     templates/default-layout-wrapper.hamlet
     templates/default-layout.hamlet
@@ -79,6 +45,41 @@ extra-source-files:
     templates/search.hamlet
     templates/user-settings.hamlet
     templates/user.hamlet
+    static/css/main.css
+    static/css/popup.css
+    static/css/tachyons.min.css
+    static/css/tachyons.min.css.gz
+    static/images/bluepin.gif
+    static/js/app.min.js
+    static/js/app.min.js.gz
+    static/js/app.min.map
+    static/js/app.min.map.gz
+    static/js/html5shiv.min.js
+    static/js/html5shiv.min.js.gz
+    static/js/js.cookie-2.2.0.min.js
+    static/js/js.cookie-2.2.0.min.js.gz
+    purs/Makefile
+    purs/packages.dhall
+    purs/spago.dhall
+    purs/src/App.purs
+    purs/src/Globals.js
+    purs/src/Globals.purs
+    purs/src/Main.js
+    purs/src/Main.purs
+    purs/src/Marked.js
+    purs/src/Marked.purs
+    purs/src/Model.purs
+    purs/src/Util.purs
+    purs/src/Component/AccountSettings.purs
+    purs/src/Component/Add.purs
+    purs/src/Component/BList.purs
+    purs/src/Component/BMark.purs
+    purs/src/Component/Markdown.purs
+    purs/src/Component/NList.purs
+    purs/src/Component/NNote.purs
+    purs/src/Component/RawHtml.js
+    purs/src/Component/RawHtml.purs
+    purs/test/Main.purs
 
 source-repository head
   type: git

purs/packages.dhall

@@ -6,7 +6,7 @@ let upstream =
 
 let overrides =
 	  { halogen =
-		  upstream.halogen ⫽ { version = "v5.0.0-rc.1" }
+		  upstream.halogen ⫽ { version = "v5.0.0-rc.2" }
 	  , halogen-vdom =
 		  upstream.halogen-vdom ⫽ { version = "v5.1.0" }
 	  }

purs/src/Component/BMark.purs

@@ -3,6 +3,7 @@ module Component.BMark where
 import Prelude hiding (div)
 
 import App (StarAction(..), destroy, editBookmark, markRead, toggleStar)
+import Component.Markdown as Markdown
 import Data.Array (drop, foldMap)
 import Data.Lens (Lens', lens, use, (%=), (.=))
 import Data.Maybe (Maybe(..), fromMaybe, isJust, maybe)
@@ -14,10 +15,12 @@ import Data.Tuple (fst, snd)
 import Effect.Aff (Aff)
 import Globals (app', mmoment8601)
 import Halogen as H
+import Halogen.HTML as HH
 import Halogen.HTML (HTML, a, br_, button, div, div_, form, input, label, span, text, textarea)
 import Halogen.HTML.Events (onSubmit, onValueChange, onChecked, onClick)
 import Halogen.HTML.Properties (ButtonType(..), InputType(..), autocomplete, checked, for, href, id_, name, required, rows, target, title, type_, value)
 import Model (Bookmark)
+import Data.Symbol (SProxy(..))
 import Util (class_, attr, fromNullableStr)
 import Web.Event.Event (Event, preventDefault)
 import Data.Const (Const)
@@ -52,6 +55,7 @@ type BState =
   , edit_bm :: Bookmark
   , deleteAsk:: Boolean
   , edit :: Boolean
+  , isMarkdown :: Boolean
   }
 
 _bm :: Lens' BState Bookmark
@@ -63,6 +67,12 @@ _edit_bm = lens _.edit_bm (_ { edit_bm = _ })
 _edit :: Lens' BState Boolean
 _edit = lens _.edit (_ { edit = _ })
 
+_markdown = SProxy :: SProxy "markdown"
+
+type ChildSlots =
+  ( markdown :: Markdown.Slot Unit
+  )
+
 bmark :: forall q i. Bookmark -> H.Component HTML q i BMessage Aff
 bmark b' =
   H.mkComponent
@@ -78,9 +88,10 @@ bmark b' =
     , edit_bm: b
     , deleteAsk: false
     , edit: false
+    , isMarkdown: true
     }
 
-  render :: forall m. BState -> H.ComponentHTML BAction () m
+  render :: BState -> H.ComponentHTML BAction ChildSlots Aff
   render s@{ bm, edit_bm } =
     div [ id_ (show bm.bid) , class_ ("bookmark w-100 mw7 pa1 mb3" <> guard bm.private " private")] $
       star <>
@@ -107,7 +118,9 @@ bmark b' =
              [ if isJust (toMaybe bm.archiveUrl) then text "☑" else text "☐" ]
          , br_
            -- 
-         , div [ class_ "description mt1 mid-gray" ] (toTextarea bm.description)
+         , if s.isMarkdown
+           then div [ class_ "description mt1 mid-gray" ] [ HH.slot _markdown unit Markdown.component bm.description absurd ]
+           else div [ class_ "description mt1 mid-gray" ] (toTextarea bm.description)
          , div [ class_ "tags" ] $
              guard (not (S.null bm.tags))
                map (\tag -> a [ class_ ("link tag mr1" <> guard (S.take 1 tag == ".") " private")
@@ -191,7 +204,7 @@ bmark b' =
        # foldMap (\x -> [br_, text x])
        # drop 1
 
-  handleAction :: BAction -> H.HalogenM BState BAction () BMessage Aff Unit
+  handleAction :: BAction -> H.HalogenM BState BAction ChildSlots BMessage Aff Unit
 
   -- | Star
   handleAction (BStar e) = do

purs/src/Component/Markdown.purs

@@ -1,10 +1,14 @@
-module Component.Markdown (component) where
+module Component.Markdown (component, Slot) where
 
 import Component.RawHtml as RH
+import Data.Const (Const)
 import Effect.Aff (Aff)
 import Foreign.Marked (marked)
 import Halogen as H
 import Halogen.HTML as HH
+import Prelude (Void)
+
+type Slot = H.Slot (Const Void) Void
 
 component :: forall q o. H.Component HH.HTML q String o Aff
 component = RH.mkComponent marked

purs/src/Component/NNote.purs

@@ -25,7 +25,6 @@ import Util (_loc, class_, fromNullableStr)
 import Web.Event.Event (Event, preventDefault)
 import Web.HTML.Location (setHref)
 import Data.Symbol (SProxy(..))
-import Data.Const (Const)
 
 data NAction
   = NNop
@@ -52,7 +51,7 @@ _edit_note = lens _.edit_note (_ { edit_note = _ })
 _edit :: Lens' NState Boolean
 _edit = lens _.edit (_ { edit = _ })
 
--- | FormField Edits
+-- | FormField Edits 
 data EditField
   = Etitle String
   | Etext String
@@ -61,7 +60,7 @@ data EditField
 _markdown = SProxy :: SProxy "markdown"
 
 type ChildSlots =
-  ( markdown :: H.Slot (Const Void) Void Unit
+  ( markdown :: Markdown.Slot Unit
   )
 
 nnote :: forall q i o. Note -> H.Component HH.HTML q i o Aff

static/css/main.css

@@ -159,3 +159,32 @@ label {
   opacity: 1;
   transition: all .15s ease-in;
 }
+.display .description > div p,
+.display .description > div pre
+{
+  margin-top: 9px;
+  margin-bottom: 9px;
+}
+.display .description > div > *:first-child {
+  margin-top: 2px;
+}
+.display .description > div > *:last-child {
+  margin-bottom: 2px;
+}
+.display .description > div > ol li p {
+  margin-top: 0;
+  margin-bottom: 0;
+}
+.display .description > div > ul li p {
+  margin-top: 0;
+  margin-bottom: 0;
+}
+.display .description > div ol {
+  padding-left: 23px; 
+}
+.display .description > div ul {
+  padding-left: 23px; 
+}
+code, pre {
+    font-size:13px;
+}