reflex navigation

{-# LANGUAGE DataKinds #-}
{-# LANGUAGE OverloadedStrings #-}
{-# LANGUAGE TypeApplications #-}

module Frontend where

import Control.Monad
import Control.Monad.Fix
import qualified Data.Text as T
import qualified Data.Text.Encoding as T
import Language.Javascript.JSaddle (eval, liftJSM)

import Obelisk.Frontend
import Obelisk.Configs
import Obelisk.Route
import Obelisk.Generated.Static

import Reflex.Dom.Core

import Common.Api
import Common.Route

content :: (DomBuilder t m
          , MonadHold t m
          , MonadFix m
          , PostBuild t m) =>
    Event t (T.Text -> T.Text) -> m ()
content navigation = do
    contentText <- foldDyn ($) ("click on a button" :: T.Text) navigation
    dynText contentText

navigation :: (DomBuilder t m) => Int -> m (Event t (T.Text -> T.Text))
navigation nPages = do
    n <- mapM mkNavBtn [1..nPages]
    return $ leftmost n

    where
        mkNavBtn i = do
          evt <- button $ pageNLabel i
          return $ addValue (pageNContentLabel i) evt
        pageNLabel i = ("Page " :: T.Text) <> (T.pack $ show i)
        pageNContentLabel i = T.pack $ "page " <> (show i) <> " content"

addValue :: Reflex t => a -> Event t () -> Event t (a -> a)
addValue val evt = fmap (\_ _ -> val) evt

-- This runs in a monad that can be run on the client or the server.
-- To run code in a pure client or pure server context, use one of the
-- `prerender` functions.
frontend :: Frontend (R FrontendRoute)
frontend = Frontend
  { _frontend_head = do
      el "title" $ text "Test"
      elAttr "link"
        (  "href" =: static @"main.css"
        <> "type" =: "text/css"
        <> "rel" =: "stylesheet") blank
  , _frontend_body = do

      n <- navigation 4
      el "div" $ content n
      return ()
  }