diff --git a/cabal.project b/cabal.project index b67d038..5b99398 100644 --- a/cabal.project +++ b/cabal.project @@ -9,4 +9,4 @@ flags: +template-haskell source-repository-package type: git location: https://github.com/dmjio/miso - tag: cd98dc522027b150397a51d95055892dfa5a624e + tag: 7d48d27283283e0dbdea85bc68d2fe208ad68e3f diff --git a/flake.lock b/flake.lock index cf83e43..1c17783 100644 --- a/flake.lock +++ b/flake.lock @@ -196,11 +196,11 @@ }, "locked": { "host": "gitlab.haskell.org", - "lastModified": 1751372331, - "narHash": "sha256-1bBo0DJ8SBmKkJJAHpJedwgayvEIJK7DHrLt2bN4+q4=", + "lastModified": 1756685280, + "narHash": "sha256-XXi1OmL9SeS4a+dwtjr9waBf1rwQNRpi2RcBp4sNSTc=", "owner": "haskell-wasm", "repo": "ghc-wasm-meta", - "rev": "7927129e42bcd6a54b9e06e26455803fa4878261", + "rev": "a3d155c399021c8bf387f52c8f902f3c6633fb30", "type": "gitlab" }, "original": { @@ -561,17 +561,17 @@ ] }, "locked": { - "lastModified": 1748063550, - "narHash": "sha256-xJ3BLiFtQmH92Y0jqIgdzJqidQHm3M1ZKHRAUEgNZF0=", + "lastModified": 1756701389, + "narHash": "sha256-WUXl+5QfhsZKf6V+h0qhl6Jgy6SzR3HzMQsfbWL0jkE=", "owner": "ghcjs", "repo": "jsaddle", - "rev": "2513cd19184376ac8a2f0e3797a1ae7d2e522e87", + "rev": "0fb7260ad02592546c9f180078d770256fb1f0f6", "type": "github" }, "original": { "owner": "ghcjs", "repo": "jsaddle", - "rev": "2513cd19184376ac8a2f0e3797a1ae7d2e522e87", + "rev": "0fb7260ad02592546c9f180078d770256fb1f0f6", "type": "github" } }, @@ -584,11 +584,11 @@ "servant": "servant" }, "locked": { - "lastModified": 1755722346, - "narHash": "sha256-ly7GR1etBrbbGNuvs4OfEHlvwEMrRqdxsGrqj5dI6T8=", + "lastModified": 1757123579, + "narHash": "sha256-Hzzj56NrollIdrcIOObXB7zW57GPhEpw1suq6NuOif4=", "owner": "dmjio", "repo": "miso", - "rev": "cd98dc522027b150397a51d95055892dfa5a624e", + "rev": "42b73e102a54241095de28cf340a8a684edb9824", "type": "github" }, "original": { @@ -599,11 +599,11 @@ }, "nixpkgs": { "locked": { - "lastModified": 1750731501, - "narHash": "sha256-Ah4qq+SbwMaGkuXCibyg+Fwn00el4KmI3XFX6htfDuk=", + "lastModified": 1755767206, + "narHash": "sha256-yi+50PemAF64H5sA4Bl3RYzz3Yniw0538SPLl3DxGU0=", "owner": "NixOS", "repo": "nixpkgs", - "rev": "69dfebb3d175bde602f612915c5576a41b18486b", + "rev": "f90bda01c396f058bfe42d0cecb4ba776160a953", "type": "github" }, "original": { diff --git a/src/Main.hs b/src/Main.hs index cfe263f..4dbabe1 100644 --- a/src/Main.hs +++ b/src/Main.hs @@ -22,6 +22,9 @@ import Data.Maybe import GHC.Generics ---------------------------------------------------------------------------- import Miso hiding (defaultOptions) +import qualified Miso.Html.Event as E +import qualified Miso.Html.Element as H +import qualified Miso.Html.Property as P import Miso.String import Miso.Lens import qualified Miso.CSS as CSS @@ -46,9 +49,8 @@ info = lens _info $ \r x -> r { _info = x } -- | Action data Action = FetchGitHub - | SetGitHub GitHub - | ErrorHandler MisoString - deriving (Show, Eq) + | SetGitHub (Response GitHub) + | ErrorHandler (Response (Maybe MisoString)) ---------------------------------------------------------------------------- app :: App Model Action app = (component emptyModel updateModel viewModel) @@ -66,54 +68,57 @@ emptyModel = Model Nothing updateModel :: Action -> Transition Model Action updateModel FetchGitHub = getJSON "https://api.github.com" [] SetGitHub ErrorHandler -updateModel (SetGitHub apiInfo) = - info ?= apiInfo -updateModel (ErrorHandler msg) = - io_ (consoleError msg) +updateModel (SetGitHub Response {..}) = + info ?= body +updateModel (ErrorHandler Response {..}) = + case errorMessage of + Nothing -> pure () + Just errMsg -> + io_ (consoleError errMsg) ---------------------------------------------------------------------------- -- | View function, with routing viewModel :: Model -> View Model Action -viewModel m = div_ +viewModel m = H.div_ [ CSS.style_ [ CSS.textAlign "center" , CSS.margin "200px" ] ] - [ h1_ - [ class_ $ pack "title" + [ H.h1_ + [ P.class_ $ pack "title" ] [ "🍜 Miso Fetch API" ] , optionalAttrs - button_ - [ onClick FetchGitHub - , class_ (pack "button is-large is-outlined") + H.button_ + [ E.onClick FetchGitHub + , P.class_ (pack "button is-large is-outlined") ] (isJust (m ^. info)) - [ disabled_ + [ P.disabled_ ] [ "Fetch JSON from https://api.github.com" ] , case m ^. info of Nothing -> - div_ + H.div_ [] [ "No data" ] Just GitHub {..} -> - table_ - [ class_ "table is-striped" ] - [ thead_ + H.table_ + [ P.class_ "table is-striped" ] + [ H.thead_ [] - [ tr_ + [ H.tr_ [] - [ th_ + [ H.th_ [] [ text "URLs" ] ] ] - , tbody_ + , H.tbody_ [] [ tr currentUserUrl , tr emojisUrl @@ -128,7 +133,7 @@ viewModel m = div_ ] where tr :: MisoString -> View Model action - tr x = tr_ [] [ td_ [] [ text x ] ] + tr x = H.tr_ [] [ H.td_ [] [ text x ] ] ---------------------------------------------------------------------------- -- | Structure to capture the JSON returned from https://api.github.com data GitHub