From d8f3637839df81b4a5b53b982d29d72d93e4d66a Mon Sep 17 00:00:00 2001 From: towards-a-new-leftypol Date: Fri, 22 Dec 2023 06:06:52 -0500 Subject: [PATCH] Example sub-component (Catalog Grid) --- chandlr.cabal | 5 +-- default.nix | 14 ++++--- html/example.html | 8 ++++ html/grid.html | 3 ++ html/grid_item.html | 16 ++++++++ nixpkgs.nix | 37 ----------------- src/Component/CatalogGrid.hs | 77 ++++++++++++++++++++++++++++++++++++ src/Main.hs | 52 +++++++++++++----------- 8 files changed, 144 insertions(+), 68 deletions(-) create mode 100644 html/example.html create mode 100644 html/grid.html create mode 100644 html/grid_item.html delete mode 100644 nixpkgs.nix create mode 100644 src/Component/CatalogGrid.hs diff --git a/chandlr.cabal b/chandlr.cabal index cb04735..c82332d 100644 --- a/chandlr.cabal +++ b/chandlr.cabal @@ -1,4 +1,3 @@ --- cabal-version: 2.4 cabal-version: >=1.10 -- The cabal-version field refers to the version of the .cabal specification, -- and can be different from the cabal-install (the tool) version and the @@ -47,7 +46,7 @@ category: Web build-type: Simple -- Extra doc files to be distributed with the package, such as a CHANGELOG or a README. -extra-doc-files: CHANGELOG.md +-- extra-doc-files: CHANGELOG.md -- Extra source files to be distributed with the package, such as examples, or a tutorial module. -- extra-source-files: @@ -63,7 +62,7 @@ executable chandlr ghcjs-options: -dedupe -- Modules included in this executable, other than Main. - -- other-modules: + other-modules: Component.CatalogGrid -- LANGUAGE extensions used by modules in this package. -- other-extensions: diff --git a/default.nix b/default.nix index 72d2c39..be0fcb5 100644 --- a/default.nix +++ b/default.nix @@ -1,15 +1,17 @@ -{ nixpkgs ? import {}, }: +{ new_pkgs ? import {}, }: + +with (import (builtins.fetchTarball { + url = "https://github.com/dmjio/miso/archive/refs/tags/1.8.tar.gz"; +}) {}); let - pkgs = import ./nixpkgs.nix { nixpkgs = nixpkgs; } ; - inherit (pkgs.haskell.packages) ghcjs; - drv = ghcjs.callCabal2nix "chandlr" ./. {}; + drv = pkgs.haskell.packages.ghcjs.callCabal2nix "chandlr" ./. {}; env = drv.env.overrideAttrs (oldAttrs: { buildInputs = oldAttrs.buildInputs ++ [ - pkgs.haskell.packages.ghc.cabal-install - nixpkgs.haskellPackages.miso-from-html + pkgs.haskellPackages.cabal-install + new_pkgs.haskellPackages.miso-from-html ]; }); diff --git a/html/example.html b/html/example.html new file mode 100644 index 0000000..1c06bc2 --- /dev/null +++ b/html/example.html @@ -0,0 +1,8 @@ + diff --git a/html/grid.html b/html/grid.html new file mode 100644 index 0000000..0581ac7 --- /dev/null +++ b/html/grid.html @@ -0,0 +1,3 @@ +
+
+
diff --git a/html/grid_item.html b/html/grid_item.html new file mode 100644 index 0000000..d5831e8 --- /dev/null +++ b/html/grid_item.html @@ -0,0 +1,16 @@ +
+
+ + Opening post image + +
+ R: 517 / I: 204 +

+ This is the thread subject, usually a brief description. +

+ Hello World +
+ Hello World2 +
+
+
diff --git a/nixpkgs.nix b/nixpkgs.nix deleted file mode 100644 index 0abc60b..0000000 --- a/nixpkgs.nix +++ /dev/null @@ -1,37 +0,0 @@ -{ nixpkgs }: -let - nixpkgs-src = nixpkgs.fetchFromGitHub { - owner = "NixOS"; - repo = "nixpkgs"; - rev = "3fd87ad0073fd1ef71a8fcd1a1d1a89392c33d0a"; - sha256 = "0n4ffwwfdybphx1iyqz1p7npk8w4n78f8jr5nq8ldnx2amrkfwhl"; - }; - - config = { - packageOverrides = pkgs: rec { - haskell = pkgs.haskell // { - packages = pkgs.haskell.packages // { - ghc = pkgs.haskell.packages.ghc844; - } // { - - # Many packages don't build on ghcjs because of a dependency on doctest - # (which doesn't build), or because of a runtime error during the test run. - # See: https://github.com/ghcjs/ghcjs/issues/711 - ghcjs = pkgs.haskell.packages.ghcjs84.override { - overrides = self: super: with pkgs.haskell.lib; { - tasty-quickcheck = dontCheck super.tasty-quickcheck; - http-types = dontCheck super.http-types; - comonad = dontCheck super.comonad; - semigroupoids = dontCheck super.semigroupoids; - lens = dontCheck super.lens; - servant = dontCheck super.servant; - }; - }; - }; - - }; - }; - }; - -in - import nixpkgs-src { inherit config; } diff --git a/src/Component/CatalogGrid.hs b/src/Component/CatalogGrid.hs new file mode 100644 index 0000000..3fc6b1d --- /dev/null +++ b/src/Component/CatalogGrid.hs @@ -0,0 +1,77 @@ +{-# LANGUAGE OverloadedStrings #-} + +module Component.CatalogGrid +( Model +, initialModel +, Action +, Interface (..) +, view +) where + +import Miso + ( View + , div_ + , class_ + , img_ + , href_ + , a_ + , src_ + , alt_ + , title_ + , strong_ + , span_ + , p_ + , br_ + , id_ + ) + +type Model = () + +initialModel :: Model +initialModel = () + +type Action = () + +data Interface a = Interface + { passAction :: Action -> a + , selectThread :: () + } + +view :: Interface a -> Model -> View a +view iface model = + div_ + [ class_ "threads" ] + [ div_ + [ id_ "Grid" ] + [ gridItem | _ <- [0..10] ] + ] + +gridItem :: View a +gridItem = + div_ + [ class_ "mix" ] + [ div_ + [ class_ "thread grid-li grid-size-small" ] + [ a_ + [ href_ "/a/res/1.html" ] + [ img_ + [ class_ "thread-image" + , src_ "/a/thumb/1111111111111.png" + , alt_ "Opening post image" + , title_ "Dec 18 23:12" + ] + ] + , div_ + [ class_ "replies" ] + [ strong_ [][ "R: 517 / I: 204" ] + , p_ + [ class_ "intro" ] + [ span_ + [ class_ "subject" ][ "This is the thread subject, usually a brief description." ] + ] + , "Hello World" + , br_ [] + , "Hello World2" + ] + ] + ] diff --git a/src/Main.hs b/src/Main.hs index 39a9d58..146ae15 100644 --- a/src/Main.hs +++ b/src/Main.hs @@ -7,53 +7,61 @@ import Miso , startApp , App (..) , h1_ + , div_ , text , Effect --, (#>) , noEff , defaultEvents + , LogLevel (Off) ) -data Unit = Unit - deriving Eq +import qualified Component.CatalogGrid as Grid -type Model = Unit +data Model = Model + { gridModel :: Grid.Model + } deriving Eq -type Action = Unit +data Action + = GridAction Grid.Action + | NoAction + +initialModel :: Model +initialModel = Model + { gridModel = Grid.initialModel + } main :: IO () main = startApp App - { model = Unit + { model = initialModel , update = mainUpdate , view = mainView , subs = [] , events = defaultEvents - , initialAction = Unit + , initialAction = NoAction , mountPoint = Nothing + , logLevel = Off } mainView :: Model -> View Action -mainView = const $ h1_ [] [ text "Hello World" ] +mainView model = + div_ [] + [ h1_ [] [ text "Hello World" ] + , Grid.view iGrid (gridModel model) + ] mainUpdate :: Action -> Model -> Effect Action Model --- mainUpdate = const $ (#>) (pure Unit) -- this is an infinite loop! mainUpdate = const noEff +iGrid :: Grid.Interface Action +iGrid = Grid.Interface + { Grid.passAction = GridAction + , Grid.selectThread = () + } + {- - TODO: - - Create Hello World page render ✓ - - - Create CatalogGrid component (static at first) - -} - -{- - - - - TODO: - - - Initial page just needs to display the search bar, fetch catalog and - - display it - - Make Model - - - single value representing that we need to go fetch the initial page - - - - maybe immediately create the CatalogGrid component with its own model? That - - would allow us to swap it out with a thread / overboard component later, and - - tell it what to render + - - Create CatalogGrid component (static at first) ✓ + - - Get postgrest url from page header and perform an initial xhr request -}