2 files changed, 48 insertions, 1 deletions
diff --git a/client/src/View/Payment.hs b/client/src/View/Payment.hs
index e80790b..d1430c9 100644
--- a/client/src/View/Payment.hs
+++ b/client/src/View/Payment.hs
@@ -11,8 +11,10 @@ module View.Payment
 import Reflex.Dom (MonadWidget)
 import qualified Reflex.Dom as R
 
-import Common.Model (Init)
+import Common.Model (Init(..))
 
+import View.Payment.Pages (PagesIn(..))
+import qualified View.Payment.Pages as Pages
 import View.Payment.Table (TableIn(..))
 import qualified View.Payment.Table as Table
 
@@ -30,4 +32,7 @@ widget paymentIn = do
     _ <- Table.widget $ TableIn
       { _tableIn_init = _paymentIn_init paymentIn
       }
+    _ <- Pages.widget $ PagesIn
+      { _pagesIn_payments = _init_payments . _paymentIn_init $ paymentIn
+      }
     return $ PaymentOut {}
diff --git a/client/src/View/Payment/Pages.hs b/client/src/View/Payment/Pages.hs
new file mode 100644
index 0000000..f9a2b4e
--- /dev/null
+++ b/client/src/View/Payment/Pages.hs
@@ -0,0 +1,42 @@
+{-# LANGUAGE ExistentialQuantification #-}
+{-# LANGUAGE OverloadedStrings         #-}
+{-# LANGUAGE RecursiveDo               #-}
+
+module View.Payment.Pages
+  ( widget
+  , PagesIn(..)
+  , PagesOut(..)
+  ) where
+
+import qualified Data.Text as T
+import Reflex.Dom (MonadWidget)
+import qualified Reflex.Dom as R
+
+import Common.Model (Payment(..))
+
+import qualified Icon
+
+data PagesIn = PagesIn
+  { _pagesIn_payments :: [Payment]
+  }
+
+data PagesOut = PagesOut
+  {
+  }
+
+widget :: forall t m. MonadWidget t m => PagesIn -> m PagesOut
+widget _ = do
+  R.divClass "pages" $ do
+    page Icon.doubleLeftBar
+    page Icon.doubleLeft
+    page (R.text . T.pack . show $ (1 :: Integer))
+    page (R.text . T.pack . show $ (2 :: Integer))
+    page (R.text . T.pack . show $ (3 :: Integer))
+    page (R.text . T.pack . show $ (4 :: Integer))
+    page (R.text . T.pack . show $ (5 :: Integer))
+    page Icon.doubleRight
+    page Icon.doubleRightBar
+  return $ PagesOut {}
+
+page :: forall t m. MonadWidget t m => m () -> m ()
+page content = R.elClass "button" "page" $ content