From a9b17cbfeb89c8181fc400f673638bf1aa9a29db Mon Sep 17 00:00:00 2001 From: Amitai Burstein Date: Tue, 19 Oct 2021 21:37:19 +0300 Subject: [PATCH 01/28] Move Pagination View to CSS framework --- IHP/View/CSSFramework.hs | 3 +++ IHP/View/Types.hs | 15 +++++++++++++++ Main.hs | 10 ++++++++++ 3 files changed, 28 insertions(+) diff --git a/IHP/View/CSSFramework.hs b/IHP/View/CSSFramework.hs index 795caf016..88972ab0a 100644 --- a/IHP/View/CSSFramework.hs +++ b/IHP/View/CSSFramework.hs @@ -37,6 +37,7 @@ instance Default CSSFramework where , styledFormGroupClass , styledValidationResult , styledValidationResultClass + , styledPagination } where styledFlashMessages cssFramework flashMessages = forEach flashMessages (styledFlashMessage cssFramework cssFramework) @@ -155,6 +156,8 @@ instance Default CSSFramework where styledSubmitButtonClass = "" + styledPagination _ _ = mempty + bootstrap :: CSSFramework bootstrap = def { styledFlashMessage, styledSubmitButtonClass, styledFormGroupClass, styledFormFieldHelp, styledInputClass, styledInputInvalidClass, styledValidationResultClass } where diff --git a/IHP/View/Types.hs b/IHP/View/Types.hs index b32b3d6c0..4d34d00b4 100644 --- a/IHP/View/Types.hs +++ b/IHP/View/Types.hs @@ -21,6 +21,9 @@ import qualified Text.Blaze.Html5 as Blaze import IHP.FlashMessages.Types import IHP.ModelSupport (Violation) +-- @todo: Move PaginationView to IHP.Pagination.Types? +import IHP.Pagination.Types + type HtmlWithContext context = (?context :: context) => Blaze.Html @@ -97,6 +100,16 @@ data InputType | FileInput +-- | Options for customizing the render of a pagination +data PaginationView = + PaginationView + { cssFramework :: !CSSFramework + , pagination :: Pagination -> Blaze.Html -- The main function to be called, but below + -- could be changed to customize smaller parts. + , liPrevious :: Pagination -> Blaze.Html --
  • of previous item + , liNext :: Pagination -> Blaze.Html --
  • of next item + } + -- | Render functions to render with bootstrap etc. -- -- We call this functions with the cssFramework passed to have late binding (like from OOP languages) @@ -121,4 +134,6 @@ data CSSFramework = CSSFramework , styledValidationResult :: CSSFramework -> FormField -> Blaze.Html -- | Class name for container of validation error message , styledValidationResultClass :: Text + -- | Renders a pager + , styledPagination :: CSSFramework -> PaginationView -> Blaze.Html } diff --git a/Main.hs b/Main.hs index 1be7bb9b7..25f31d382 100644 --- a/Main.hs +++ b/Main.hs @@ -22,6 +22,16 @@ instance FrontController RootApplication where instance Controller DemoController where action DemoAction = renderPlain "Hello World!" +-- @todo: Without this I got an error +-- * No instance for (Worker RootApplication) +-- arising from a use of `IHP.Server.run' +-- * In the expression: IHP.Server.run config +-- In an equation for `main': main = IHP.Server.run config +-- | +-- 31 | main = IHP.Server.run config +instance Worker RootApplication where + workers _ = [] + config :: ConfigBuilder config = do option Development From 330539fc2b57700245b55fca14a8118efd26945f Mon Sep 17 00:00:00 2001 From: Amitai Burstein Date: Tue, 19 Oct 2021 22:02:54 +0300 Subject: [PATCH 02/28] More info --- IHP/Pagination/ViewFunctions.hs | 5 ++--- IHP/View/CSSFramework.hs | 22 +++++++++++++++++++++- IHP/View/Types.hs | 6 ++++++ 3 files changed, 29 insertions(+), 4 deletions(-) diff --git a/IHP/Pagination/ViewFunctions.hs b/IHP/Pagination/ViewFunctions.hs index 5590dd3ed..6a25f0e29 100644 --- a/IHP/Pagination/ViewFunctions.hs +++ b/IHP/Pagination/ViewFunctions.hs @@ -22,7 +22,7 @@ import IHP.ViewSupport (theRequest) import qualified Data.Containers.ListUtils as List --- | Render a navigation for your pagination. This is to be used in your view whenever +-- | Render a navigation for your pagination. This is to be used in your view whenever -- to allow users to change pages, including "Next" and "Previous". renderPagination :: (?context::ControllerContext) => Pagination -> Html renderPagination pagination@Pagination {currentPage, window, pageSize} = @@ -53,7 +53,6 @@ renderPagination pagination@Pagination {currentPage, window, pageSize} = - |] where maxItemsGenerator = let @@ -61,7 +60,7 @@ renderPagination pagination@Pagination {currentPage, window, pageSize} = oneOption n = [hsx||] in [hsx|{forEach [10,20,50,100,200] oneOption}|] - + nextClass = classes ["page-item", ("disabled", not $ hasNextPage pagination)] prevClass = classes ["page-item", ("disabled", not $ hasPreviousPage pagination)] diff --git a/IHP/View/CSSFramework.hs b/IHP/View/CSSFramework.hs index 88972ab0a..a17237ebf 100644 --- a/IHP/View/CSSFramework.hs +++ b/IHP/View/CSSFramework.hs @@ -17,6 +17,8 @@ import qualified Text.Blaze.Html5 as H import Text.Blaze.Html5 ((!), (!?)) import qualified Text.Blaze.Html5.Attributes as A import IHP.ModelSupport +import IHP.Pagination.Helpers + -- | Provides an unstyled CSSFramework -- @@ -156,7 +158,25 @@ instance Default CSSFramework where styledSubmitButtonClass = "" - styledPagination _ _ = mempty + styledPagination cssFramework paginationView = + [hsx|
    |] + where + pagination = paginationView |> get #pagination + pageUrl = paginationView |> get #pageUrl + currentPage = paginationView |> get #currentPage + nextClass = classes ["page-item", ("disabled", not $ hasNextPage pagination)] + prevClass = classes ["page-item", ("disabled", not $ hasPreviousPage pagination)] + + liPrevious :: Blaze.Html + liPrevious = [hsx| +
  • + + + Previous + +
    • + |] + bootstrap :: CSSFramework bootstrap = def { styledFlashMessage, styledSubmitButtonClass, styledFormGroupClass, styledFormFieldHelp, styledInputClass, styledInputInvalidClass, styledValidationResultClass } diff --git a/IHP/View/Types.hs b/IHP/View/Types.hs index 4d34d00b4..313414bb2 100644 --- a/IHP/View/Types.hs +++ b/IHP/View/Types.hs @@ -11,6 +11,7 @@ module IHP.View.Types , FormContext (..) , InputType (..) , CSSFramework (..) +, PaginationView(..) , HtmlWithContext , Layout ) @@ -106,6 +107,11 @@ data PaginationView = { cssFramework :: !CSSFramework , pagination :: Pagination -> Blaze.Html -- The main function to be called, but below -- could be changed to customize smaller parts. + + , pageUrl :: ByteString + , currentPage :: Int + , liPreviousClass :: Pagination -> Text + , liNextClass :: Pagination -> Text , liPrevious :: Pagination -> Blaze.Html --
  • of previous item , liNext :: Pagination -> Blaze.Html --
  • of next item } From d112ead2859ea49ca49e691a50b76ca3a1d916bb Mon Sep 17 00:00:00 2001 From: Amitai Burstein Date: Tue, 19 Oct 2021 23:29:55 +0300 Subject: [PATCH 03/28] Simmplify types --- IHP/View/CSSFramework.hs | 24 +++++++++++++++++------- IHP/View/Types.hs | 10 +--------- 2 files changed, 18 insertions(+), 16 deletions(-) diff --git a/IHP/View/CSSFramework.hs b/IHP/View/CSSFramework.hs index a17237ebf..18307b8ad 100644 --- a/IHP/View/CSSFramework.hs +++ b/IHP/View/CSSFramework.hs @@ -18,6 +18,7 @@ import Text.Blaze.Html5 ((!), (!?)) import qualified Text.Blaze.Html5.Attributes as A import IHP.ModelSupport import IHP.Pagination.Helpers +import IHP.Pagination.Types -- | Provides an unstyled CSSFramework @@ -158,23 +159,32 @@ instance Default CSSFramework where styledSubmitButtonClass = "" - styledPagination cssFramework paginationView = + styledPagination :: CSSFramework -> PaginationView -> Blaze.Html + styledPagination _ paginationView = [hsx|
    |] where - pagination = paginationView |> get #pagination - pageUrl = paginationView |> get #pageUrl - currentPage = paginationView |> get #currentPage - nextClass = classes ["page-item", ("disabled", not $ hasNextPage pagination)] + pagination@Pagination {currentPage} = get #pagination paginationView prevClass = classes ["page-item", ("disabled", not $ hasPreviousPage pagination)] + nextClass = classes ["page-item", ("disabled", not $ hasNextPage pagination)] + -- @todo: Re-add href={pageUrl $ currentPage - 1} liPrevious :: Blaze.Html liPrevious = [hsx|
  • - + Previous -
    • + + |] + + liNext = [hsx| +
  • + + + Next + +
    • |] diff --git a/IHP/View/Types.hs b/IHP/View/Types.hs index 313414bb2..ca3f7a04a 100644 --- a/IHP/View/Types.hs +++ b/IHP/View/Types.hs @@ -105,15 +105,7 @@ data InputType data PaginationView = PaginationView { cssFramework :: !CSSFramework - , pagination :: Pagination -> Blaze.Html -- The main function to be called, but below - -- could be changed to customize smaller parts. - - , pageUrl :: ByteString - , currentPage :: Int - , liPreviousClass :: Pagination -> Text - , liNextClass :: Pagination -> Text - , liPrevious :: Pagination -> Blaze.Html --
  • of previous item - , liNext :: Pagination -> Blaze.Html --
  • of next item + , pagination :: !Pagination } -- | Render functions to render with bootstrap etc. From a11e39b5cc48b15579d282224886f1ab6db6b1db Mon Sep 17 00:00:00 2001 From: Amitai Burstein Date: Tue, 19 Oct 2021 23:47:06 +0300 Subject: [PATCH 04/28] More work --- IHP/Pagination/ViewFunctions.hs | 15 ++++++++++++--- IHP/View/CSSFramework.hs | 11 ++++++++++- 2 files changed, 22 insertions(+), 4 deletions(-) diff --git a/IHP/Pagination/ViewFunctions.hs b/IHP/Pagination/ViewFunctions.hs index 6a25f0e29..709a57020 100644 --- a/IHP/Pagination/ViewFunctions.hs +++ b/IHP/Pagination/ViewFunctions.hs @@ -18,8 +18,10 @@ import IHP.Controller.Param (paramOrNothing) import IHP.View.Classes import qualified Network.Wai as Wai import qualified Network.HTTP.Types.URI as Query -import IHP.ViewSupport (theRequest) +import IHP.ViewSupport (theRequest, theCSSFramework) import qualified Data.Containers.ListUtils as List +import IHP.View.Types (PaginationView(..), styledPagination) +import IHP.View.CSSFramework -- | Render a navigation for your pagination. This is to be used in your view whenever @@ -55,6 +57,13 @@ renderPagination pagination@Pagination {currentPage, window, pageSize} = |] where + paginationView = PaginationView + { cssFramework = theCSSFramework + , pagination = pagination + } + + renderedHtml = styledPagination theCSSFramework paginationView + maxItemsGenerator = let oneOption :: Int -> Html oneOption n = [hsx||] @@ -197,10 +206,10 @@ setQueryValue name value queryString = ) Nothing -> queryString <> [(name, Just value)] --- | Removes a query item, specificed by the name +-- | Removes a query item, specified by the name -- -- >>> removeQueryItem "filter" [("filter", Just "test")] -- [] -- removeQueryItem :: ByteString -> Query.Query -> Query.Query -removeQueryItem name queryString = queryString |> filter (\(queryItemName, _) -> queryItemName /= name) \ No newline at end of file +removeQueryItem name queryString = queryString |> filter (\(queryItemName, _) -> queryItemName /= name) diff --git a/IHP/View/CSSFramework.hs b/IHP/View/CSSFramework.hs index 18307b8ad..9d0359cf6 100644 --- a/IHP/View/CSSFramework.hs +++ b/IHP/View/CSSFramework.hs @@ -161,7 +161,16 @@ instance Default CSSFramework where styledPagination :: CSSFramework -> PaginationView -> Blaze.Html styledPagination _ paginationView = - [hsx|
    |] + [hsx|
    + {liPrevious} + +
    + + {liNext} + + + +
    |] where pagination@Pagination {currentPage} = get #pagination paginationView prevClass = classes ["page-item", ("disabled", not $ hasPreviousPage pagination)] From 9fae1cd27bc300b95ad35d8a7f6440534cadb5b1 Mon Sep 17 00:00:00 2001 From: Amitai Burstein Date: Wed, 20 Oct 2021 12:25:00 +0300 Subject: [PATCH 05/28] Pase the pageUrl --- IHP/View/CSSFramework.hs | 7 ++++--- IHP/View/Types.hs | 2 ++ 2 files changed, 6 insertions(+), 3 deletions(-) diff --git a/IHP/View/CSSFramework.hs b/IHP/View/CSSFramework.hs index 9d0359cf6..833d71de2 100644 --- a/IHP/View/CSSFramework.hs +++ b/IHP/View/CSSFramework.hs @@ -173,14 +173,15 @@ instance Default CSSFramework where |] where pagination@Pagination {currentPage} = get #pagination paginationView + previousPageUrl = get #previousPageUrl paginationView + nextPageUrl = get #nextPageUrl paginationView prevClass = classes ["page-item", ("disabled", not $ hasPreviousPage pagination)] nextClass = classes ["page-item", ("disabled", not $ hasNextPage pagination)] - -- @todo: Re-add href={pageUrl $ currentPage - 1} liPrevious :: Blaze.Html liPrevious = [hsx|
  • - + Previous @@ -189,7 +190,7 @@ instance Default CSSFramework where liNext = [hsx|
  • - + Next diff --git a/IHP/View/Types.hs b/IHP/View/Types.hs index ca3f7a04a..db5203ad3 100644 --- a/IHP/View/Types.hs +++ b/IHP/View/Types.hs @@ -106,6 +106,8 @@ data PaginationView = PaginationView { cssFramework :: !CSSFramework , pagination :: !Pagination + , previousPageUrl :: !ByteString + , nextPageUrl :: !ByteString } -- | Render functions to render with bootstrap etc. From 12fac8b717f899ddb208bf518528bf243a84436b Mon Sep 17 00:00:00 2001 From: Amitai Burstein Date: Wed, 20 Oct 2021 12:42:27 +0300 Subject: [PATCH 06/28] Pass page URL --- IHP/Pagination/ViewFunctions.hs | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/IHP/Pagination/ViewFunctions.hs b/IHP/Pagination/ViewFunctions.hs index 709a57020..c9e6588af 100644 --- a/IHP/Pagination/ViewFunctions.hs +++ b/IHP/Pagination/ViewFunctions.hs @@ -60,9 +60,11 @@ renderPagination pagination@Pagination {currentPage, window, pageSize} = paginationView = PaginationView { cssFramework = theCSSFramework , pagination = pagination + , previousPageUrl = pageUrl $ currentPage - 1 + , nextPageUrl = pageUrl $ currentPage + 1 } - renderedHtml = styledPagination theCSSFramework paginationView + renderedHtml = styledPagination theCSSFramework theCSSFramework paginationView maxItemsGenerator = let oneOption :: Int -> Html From 21d8def7bf3876802e03ce0cf50c32bb02cd2cd2 Mon Sep 17 00:00:00 2001 From: Amitai Burstein Date: Thu, 21 Oct 2021 09:51:06 +0300 Subject: [PATCH 07/28] Start adding paginatin links render --- IHP/Pagination/ViewFunctions.hs | 19 +++++++++++++++---- IHP/View/CSSFramework.hs | 7 +++++++ IHP/View/Types.hs | 4 ++++ 3 files changed, 26 insertions(+), 4 deletions(-) diff --git a/IHP/Pagination/ViewFunctions.hs b/IHP/Pagination/ViewFunctions.hs index c9e6588af..0c8ce30ec 100644 --- a/IHP/Pagination/ViewFunctions.hs +++ b/IHP/Pagination/ViewFunctions.hs @@ -20,7 +20,7 @@ import qualified Network.Wai as Wai import qualified Network.HTTP.Types.URI as Query import IHP.ViewSupport (theRequest, theCSSFramework) import qualified Data.Containers.ListUtils as List -import IHP.View.Types (PaginationView(..), styledPagination) +import IHP.View.Types (PaginationView(..), styledPagination, styledPaginationPageLink, styledPaginationDotDot) import IHP.View.CSSFramework @@ -75,13 +75,24 @@ renderPagination pagination@Pagination {currentPage, window, pageSize} = nextClass = classes ["page-item", ("disabled", not $ hasNextPage pagination)] prevClass = classes ["page-item", ("disabled", not $ hasPreviousPage pagination)] + -- renderItem pg = + -- case pg of + -- Page n -> + -- [hsx|
  • {show n}
    • |] + -- DotDot n -> + -- [hsx|
  • …
    • |] + + -- @todo: + -- linkClass n = classes ["page-item", ("active", n == currentPage)] + renderItem pg = case pg of Page n -> - [hsx|
  • {show n}
    • |] + styledPaginationPageLink theCSSFramework theCSSFramework paginationView (pageUrl n) n DotDot n -> - [hsx|
  • …
    • |] - linkClass n = classes ["page-item", ("active", n == currentPage)] + styledPaginationDotDot theCSSFramework theCSSFramework paginationView (pageUrl n) n + + pageUrl n = path <> Query.renderQuery True newQueryString where diff --git a/IHP/View/CSSFramework.hs b/IHP/View/CSSFramework.hs index 833d71de2..5e8bfe9a1 100644 --- a/IHP/View/CSSFramework.hs +++ b/IHP/View/CSSFramework.hs @@ -41,6 +41,8 @@ instance Default CSSFramework where , styledValidationResult , styledValidationResultClass , styledPagination + , styledPaginationPageLink + , styledPaginationDotDot } where styledFlashMessages cssFramework flashMessages = forEach flashMessages (styledFlashMessage cssFramework cssFramework) @@ -197,6 +199,11 @@ instance Default CSSFramework where |] + styledPaginationPageLink :: CSSFramework -> PaginationView -> ByteString -> Int -> Blaze.Html + styledPaginationPageLink _ _ _ = mempty + + styledPaginationDotDot :: CSSFramework -> PaginationView -> ByteString -> Int -> Blaze.Html + styledPaginationDotDot _ _ _ = mempty bootstrap :: CSSFramework bootstrap = def { styledFlashMessage, styledSubmitButtonClass, styledFormGroupClass, styledFormFieldHelp, styledInputClass, styledInputInvalidClass, styledValidationResultClass } diff --git a/IHP/View/Types.hs b/IHP/View/Types.hs index db5203ad3..705c8dc63 100644 --- a/IHP/View/Types.hs +++ b/IHP/View/Types.hs @@ -136,4 +136,8 @@ data CSSFramework = CSSFramework , styledValidationResultClass :: Text -- | Renders a pager , styledPagination :: CSSFramework -> PaginationView -> Blaze.Html + -- | Render the pagination links + , styledPaginationPageLink :: CSSFramework -> PaginationView -> ByteString -> Int -> Blaze.Html + -- | Render the dots between pagination numbers (e.g. 5 6 ... 7 8) + , styledPaginationDotDot :: CSSFramework -> PaginationView -> ByteString -> Int -> Blaze.Html } From 6438973209f88802cf54764995192472ac8b801f Mon Sep 17 00:00:00 2001 From: Amitai Burstein Date: Thu, 21 Oct 2021 09:57:33 +0300 Subject: [PATCH 08/28] Add HTML --- IHP/View/CSSFramework.hs | 16 ++++++++++++++-- 1 file changed, 14 insertions(+), 2 deletions(-) diff --git a/IHP/View/CSSFramework.hs b/IHP/View/CSSFramework.hs index 5e8bfe9a1..746fad67a 100644 --- a/IHP/View/CSSFramework.hs +++ b/IHP/View/CSSFramework.hs @@ -200,10 +200,22 @@ instance Default CSSFramework where |] styledPaginationPageLink :: CSSFramework -> PaginationView -> ByteString -> Int -> Blaze.Html - styledPaginationPageLink _ _ _ = mempty + styledPaginationPageLink _ paginationView pageUrl pageNumber = + let + pagination@Pagination {currentPage} = get #pagination paginationView + linkClass = classes ["page-item", ("active", pageNumber == currentPage)] + in + [hsx|
  • {show pageNumber}
    • |] + styledPaginationDotDot :: CSSFramework -> PaginationView -> ByteString -> Int -> Blaze.Html - styledPaginationDotDot _ _ _ = mempty + styledPaginationDotDot _ paginationView pageUrl pageNumber = + let + pagination@Pagination {currentPage} = get #pagination paginationView + in + [hsx|
  • …
    • |] + + bootstrap :: CSSFramework bootstrap = def { styledFlashMessage, styledSubmitButtonClass, styledFormGroupClass, styledFormFieldHelp, styledInputClass, styledInputInvalidClass, styledValidationResultClass } From ac5e6c98a0ab777926de0f2b74e894718dbaa9a9 Mon Sep 17 00:00:00 2001 From: Amitai Burstein Date: Thu, 21 Oct 2021 10:08:25 +0300 Subject: [PATCH 09/28] More wiring --- IHP/Pagination/ViewFunctions.hs | 25 ++++++++++-------------- IHP/View/CSSFramework.hs | 34 +++++++++++++++++---------------- IHP/View/Types.hs | 6 ++++-- 3 files changed, 32 insertions(+), 33 deletions(-) diff --git a/IHP/Pagination/ViewFunctions.hs b/IHP/Pagination/ViewFunctions.hs index 0c8ce30ec..ed88945eb 100644 --- a/IHP/Pagination/ViewFunctions.hs +++ b/IHP/Pagination/ViewFunctions.hs @@ -38,7 +38,7 @@ renderPagination pagination@Pagination {currentPage, window, pageSize} = Previous - {renderItems} + {pageDotDotItems}
  • @@ -55,6 +55,10 @@ renderPagination pagination@Pagination {currentPage, window, pageSize} = + +
    + {renderedHtml} +
    |] where paginationView = PaginationView @@ -62,6 +66,7 @@ renderPagination pagination@Pagination {currentPage, window, pageSize} = , pagination = pagination , previousPageUrl = pageUrl $ currentPage - 1 , nextPageUrl = pageUrl $ currentPage + 1 + , pageDotDotItems = pageDotDotItems } renderedHtml = styledPagination theCSSFramework theCSSFramework paginationView @@ -75,22 +80,14 @@ renderPagination pagination@Pagination {currentPage, window, pageSize} = nextClass = classes ["page-item", ("disabled", not $ hasNextPage pagination)] prevClass = classes ["page-item", ("disabled", not $ hasPreviousPage pagination)] - -- renderItem pg = - -- case pg of - -- Page n -> - -- [hsx|
  • {show n}
    • |] - -- DotDot n -> - -- [hsx|
  • …
    • |] + pageDotDotItems = [hsx|{forEach (processedPages pages) pageDotDotItem}|] - -- @todo: - -- linkClass n = classes ["page-item", ("active", n == currentPage)] - - renderItem pg = + pageDotDotItem pg = case pg of Page n -> - styledPaginationPageLink theCSSFramework theCSSFramework paginationView (pageUrl n) n + styledPaginationPageLink theCSSFramework theCSSFramework pagination (pageUrl n) n DotDot n -> - styledPaginationDotDot theCSSFramework theCSSFramework paginationView (pageUrl n) n + styledPaginationDotDot theCSSFramework theCSSFramework pagination (pageUrl n) n @@ -122,8 +119,6 @@ renderPagination pagination@Pagination {currentPage, window, pageSize} = Nothing -> queryString Just m -> queryString |> setQueryValue "maxItems" (cs $ tshow m) - renderItems = [hsx|{forEach (processedPages pages) renderItem}|] - processedPages (pg0:pg1:rest) = if pg1 == pg0 + 1 then Page pg0 : processedPages (pg1:rest) diff --git a/IHP/View/CSSFramework.hs b/IHP/View/CSSFramework.hs index 746fad67a..2ab2b1758 100644 --- a/IHP/View/CSSFramework.hs +++ b/IHP/View/CSSFramework.hs @@ -163,22 +163,28 @@ instance Default CSSFramework where styledPagination :: CSSFramework -> PaginationView -> Blaze.Html styledPagination _ paginationView = - [hsx|
    - {liPrevious} + [hsx| -
    +
    + - {liNext} - - -
    |] +
    + |] where pagination@Pagination {currentPage} = get #pagination paginationView previousPageUrl = get #previousPageUrl paginationView nextPageUrl = get #nextPageUrl paginationView prevClass = classes ["page-item", ("disabled", not $ hasPreviousPage pagination)] nextClass = classes ["page-item", ("disabled", not $ hasNextPage pagination)] + pageDotDotItems = get #pageDotDotItems paginationView + liPrevious :: Blaze.Html liPrevious = [hsx| @@ -199,21 +205,17 @@ instance Default CSSFramework where |] - styledPaginationPageLink :: CSSFramework -> PaginationView -> ByteString -> Int -> Blaze.Html - styledPaginationPageLink _ paginationView pageUrl pageNumber = + styledPaginationPageLink :: CSSFramework -> Pagination -> ByteString -> Int -> Blaze.Html + styledPaginationPageLink _ pagination@Pagination {currentPage} pageUrl pageNumber = let - pagination@Pagination {currentPage} = get #pagination paginationView linkClass = classes ["page-item", ("active", pageNumber == currentPage)] in [hsx|
  • {show pageNumber}
    • |] - styledPaginationDotDot :: CSSFramework -> PaginationView -> ByteString -> Int -> Blaze.Html - styledPaginationDotDot _ paginationView pageUrl pageNumber = - let - pagination@Pagination {currentPage} = get #pagination paginationView - in - [hsx|
  • …
    • |] + styledPaginationDotDot :: CSSFramework -> Pagination -> ByteString -> Int -> Blaze.Html + styledPaginationDotDot _ pagination@Pagination {currentPage} pageUrl pageNumber = + [hsx|
  • …
    • |] diff --git a/IHP/View/Types.hs b/IHP/View/Types.hs index 705c8dc63..d2a8ae329 100644 --- a/IHP/View/Types.hs +++ b/IHP/View/Types.hs @@ -108,6 +108,8 @@ data PaginationView = , pagination :: !Pagination , previousPageUrl :: !ByteString , nextPageUrl :: !ByteString + -- The page and dot dot as rendered by `styledPaginationPageLink` and `styledPaginationDotDot`. + , pageDotDotItems :: !Blaze.Html } -- | Render functions to render with bootstrap etc. @@ -137,7 +139,7 @@ data CSSFramework = CSSFramework -- | Renders a pager , styledPagination :: CSSFramework -> PaginationView -> Blaze.Html -- | Render the pagination links - , styledPaginationPageLink :: CSSFramework -> PaginationView -> ByteString -> Int -> Blaze.Html + , styledPaginationPageLink :: CSSFramework -> Pagination -> ByteString -> Int -> Blaze.Html -- | Render the dots between pagination numbers (e.g. 5 6 ... 7 8) - , styledPaginationDotDot :: CSSFramework -> PaginationView -> ByteString -> Int -> Blaze.Html + , styledPaginationDotDot :: CSSFramework -> Pagination -> ByteString -> Int -> Blaze.Html } From 946ac4bded40b9133d399c81f25a507469043df1 Mon Sep 17 00:00:00 2001 From: Amitai Burstein Date: Thu, 21 Oct 2021 10:22:16 +0300 Subject: [PATCH 10/28] Wokring pager --- IHP/Pagination/ViewFunctions.hs | 12 +++++------- IHP/View/CSSFramework.hs | 18 +++++++++++++++++- IHP/View/Types.hs | 4 ++++ 3 files changed, 26 insertions(+), 8 deletions(-) diff --git a/IHP/Pagination/ViewFunctions.hs b/IHP/Pagination/ViewFunctions.hs index ed88945eb..c4917f5a8 100644 --- a/IHP/Pagination/ViewFunctions.hs +++ b/IHP/Pagination/ViewFunctions.hs @@ -20,7 +20,7 @@ import qualified Network.Wai as Wai import qualified Network.HTTP.Types.URI as Query import IHP.ViewSupport (theRequest, theCSSFramework) import qualified Data.Containers.ListUtils as List -import IHP.View.Types (PaginationView(..), styledPagination, styledPaginationPageLink, styledPaginationDotDot) +import IHP.View.Types (PaginationView(..), styledPagination, styledPaginationPageLink, styledPaginationDotDot, stylePaginationItemsPerPageSelector) import IHP.View.CSSFramework @@ -50,7 +50,7 @@ renderPagination pagination@Pagination {currentPage, window, pageSize} =
    @@ -67,15 +67,13 @@ renderPagination pagination@Pagination {currentPage, window, pageSize} = , previousPageUrl = pageUrl $ currentPage - 1 , nextPageUrl = pageUrl $ currentPage + 1 , pageDotDotItems = pageDotDotItems + , itemsPerPageSelector = itemsPerPageSelector } renderedHtml = styledPagination theCSSFramework theCSSFramework paginationView - maxItemsGenerator = let - oneOption :: Int -> Html - oneOption n = [hsx||] - in - [hsx|{forEach [10,20,50,100,200] oneOption}|] + itemsPerPageSelector = + stylePaginationItemsPerPageSelector theCSSFramework theCSSFramework pagination itemsPerPageUrl nextClass = classes ["page-item", ("disabled", not $ hasNextPage pagination)] prevClass = classes ["page-item", ("disabled", not $ hasPreviousPage pagination)] diff --git a/IHP/View/CSSFramework.hs b/IHP/View/CSSFramework.hs index 2ab2b1758..072607852 100644 --- a/IHP/View/CSSFramework.hs +++ b/IHP/View/CSSFramework.hs @@ -43,6 +43,7 @@ instance Default CSSFramework where , styledPagination , styledPaginationPageLink , styledPaginationDotDot + , stylePaginationItemsPerPageSelector } where styledFlashMessages cssFramework flashMessages = forEach flashMessages (styledFlashMessage cssFramework cssFramework) @@ -174,6 +175,13 @@ instance Default CSSFramework where +
    +
    + +
    +
    |] @@ -184,7 +192,7 @@ instance Default CSSFramework where prevClass = classes ["page-item", ("disabled", not $ hasPreviousPage pagination)] nextClass = classes ["page-item", ("disabled", not $ hasNextPage pagination)] pageDotDotItems = get #pageDotDotItems paginationView - + itemsPerPageSelector = get #itemsPerPageSelector paginationView liPrevious :: Blaze.Html liPrevious = [hsx| @@ -217,6 +225,14 @@ instance Default CSSFramework where styledPaginationDotDot _ pagination@Pagination {currentPage} pageUrl pageNumber = [hsx|
  • …
    • |] + stylePaginationItemsPerPageSelector :: CSSFramework -> Pagination -> (Int -> ByteString) -> Blaze.Html + stylePaginationItemsPerPageSelector _ pagination@Pagination {pageSize} itemsPerPageUrl = + let + oneOption :: Int -> Blaze.Html + oneOption n = [hsx||] + in + [hsx|{forEach [10,20,50,100,200] oneOption}|] + bootstrap :: CSSFramework diff --git a/IHP/View/Types.hs b/IHP/View/Types.hs index d2a8ae329..40d7cf9a1 100644 --- a/IHP/View/Types.hs +++ b/IHP/View/Types.hs @@ -110,6 +110,8 @@ data PaginationView = , nextPageUrl :: !ByteString -- The page and dot dot as rendered by `styledPaginationPageLink` and `styledPaginationDotDot`. , pageDotDotItems :: !Blaze.Html + -- Selector changing the number of allowed items per page. + , itemsPerPageSelector :: !Blaze.Html } -- | Render functions to render with bootstrap etc. @@ -142,4 +144,6 @@ data CSSFramework = CSSFramework , styledPaginationPageLink :: CSSFramework -> Pagination -> ByteString -> Int -> Blaze.Html -- | Render the dots between pagination numbers (e.g. 5 6 ... 7 8) , styledPaginationDotDot :: CSSFramework -> Pagination -> ByteString -> Int -> Blaze.Html + -- | Render the items per page selector for pagination. + , stylePaginationItemsPerPageSelector :: CSSFramework -> Pagination -> (Int -> ByteString) -> Blaze.Html } From dac493213aa460cf03f1e47abaada2c25c828adb Mon Sep 17 00:00:00 2001 From: Amitai Burstein Date: Thu, 21 Oct 2021 10:28:30 +0300 Subject: [PATCH 11/28] Remove older render --- IHP/Pagination/ViewFunctions.hs | 39 +-------------------------------- IHP/View/Types.hs | 2 ++ 2 files changed, 3 insertions(+), 38 deletions(-) diff --git a/IHP/Pagination/ViewFunctions.hs b/IHP/Pagination/ViewFunctions.hs index c4917f5a8..1e068adf3 100644 --- a/IHP/Pagination/ViewFunctions.hs +++ b/IHP/Pagination/ViewFunctions.hs @@ -27,39 +27,7 @@ import IHP.View.CSSFramework -- | Render a navigation for your pagination. This is to be used in your view whenever -- to allow users to change pages, including "Next" and "Previous". renderPagination :: (?context::ControllerContext) => Pagination -> Html -renderPagination pagination@Pagination {currentPage, window, pageSize} = - [hsx| -
    - -
    -
    - -
    -
    -
    - -
    - {renderedHtml} -
    - |] +renderPagination pagination@Pagination {currentPage, window, pageSize} = [hsx| {renderedHtml} |] where paginationView = PaginationView { cssFramework = theCSSFramework @@ -75,9 +43,6 @@ renderPagination pagination@Pagination {currentPage, window, pageSize} = itemsPerPageSelector = stylePaginationItemsPerPageSelector theCSSFramework theCSSFramework pagination itemsPerPageUrl - nextClass = classes ["page-item", ("disabled", not $ hasNextPage pagination)] - prevClass = classes ["page-item", ("disabled", not $ hasPreviousPage pagination)] - pageDotDotItems = [hsx|{forEach (processedPages pages) pageDotDotItem}|] pageDotDotItem pg = @@ -87,8 +52,6 @@ renderPagination pagination@Pagination {currentPage, window, pageSize} = DotDot n -> styledPaginationDotDot theCSSFramework theCSSFramework pagination (pageUrl n) n - - pageUrl n = path <> Query.renderQuery True newQueryString where -- "?page=" ++ show n ++ maybeFilter ++ maybeMaxItems diff --git a/IHP/View/Types.hs b/IHP/View/Types.hs index 40d7cf9a1..b6b1ff3ec 100644 --- a/IHP/View/Types.hs +++ b/IHP/View/Types.hs @@ -145,5 +145,7 @@ data CSSFramework = CSSFramework -- | Render the dots between pagination numbers (e.g. 5 6 ... 7 8) , styledPaginationDotDot :: CSSFramework -> Pagination -> ByteString -> Int -> Blaze.Html -- | Render the items per page selector for pagination. + -- Note the (Int -> ByteString), we are passing the pageUrl function, so anyone that would like to override + -- it the selector with different items per page could still use the pageUrl function to get the correct URL. , stylePaginationItemsPerPageSelector :: CSSFramework -> Pagination -> (Int -> ByteString) -> Blaze.Html } From 1956397a9b11e2da7a656794a861052887b4c8b4 Mon Sep 17 00:00:00 2001 From: Amitai Burstein Date: Thu, 21 Oct 2021 10:29:15 +0300 Subject: [PATCH 12/28] Remove todo --- Main.hs | 7 ------- 1 file changed, 7 deletions(-) diff --git a/Main.hs b/Main.hs index 25f31d382..0442bc236 100644 --- a/Main.hs +++ b/Main.hs @@ -22,13 +22,6 @@ instance FrontController RootApplication where instance Controller DemoController where action DemoAction = renderPlain "Hello World!" --- @todo: Without this I got an error --- * No instance for (Worker RootApplication) --- arising from a use of `IHP.Server.run' --- * In the expression: IHP.Server.run config --- In an equation for `main': main = IHP.Server.run config --- | --- 31 | main = IHP.Server.run config instance Worker RootApplication where workers _ = [] From 6f235c24351f853dc7a8ecafc0b2319a09f4a985 Mon Sep 17 00:00:00 2001 From: Amitai Burstein Date: Thu, 21 Oct 2021 10:33:08 +0300 Subject: [PATCH 13/28] On items change, go to first page --- IHP/Pagination/ViewFunctions.hs | 3 +++ 1 file changed, 3 insertions(+) diff --git a/IHP/Pagination/ViewFunctions.hs b/IHP/Pagination/ViewFunctions.hs index 1e068adf3..cf8981dd5 100644 --- a/IHP/Pagination/ViewFunctions.hs +++ b/IHP/Pagination/ViewFunctions.hs @@ -68,6 +68,9 @@ renderPagination pagination@Pagination {currentPage, window, pageSize} = [hsx| { queryString = Wai.queryString theRequest newQueryString = queryString |> setQueryValue "maxItems" (cs $ tshow n) + -- If we change the number of items, we should jump back to the first page + -- so we are not out of the items bound. + |> setQueryValue "page" (cs $ show 1) maybeFilter queryString = case paramOrNothing @Text "filter" of From d3827b3acf8ab94c3c17ff3771bb6180526deda2 Mon Sep 17 00:00:00 2001 From: Amitai Burstein Date: Thu, 21 Oct 2021 10:46:23 +0300 Subject: [PATCH 14/28] Make it easier to override pervious and next links --- IHP/Pagination/ViewFunctions.hs | 12 ++++++-- IHP/View/CSSFramework.hs | 52 ++++++++++++++++++++------------- IHP/View/Types.hs | 12 ++++++-- 3 files changed, 49 insertions(+), 27 deletions(-) diff --git a/IHP/Pagination/ViewFunctions.hs b/IHP/Pagination/ViewFunctions.hs index cf8981dd5..48f7090bf 100644 --- a/IHP/Pagination/ViewFunctions.hs +++ b/IHP/Pagination/ViewFunctions.hs @@ -20,7 +20,7 @@ import qualified Network.Wai as Wai import qualified Network.HTTP.Types.URI as Query import IHP.ViewSupport (theRequest, theCSSFramework) import qualified Data.Containers.ListUtils as List -import IHP.View.Types (PaginationView(..), styledPagination, styledPaginationPageLink, styledPaginationDotDot, stylePaginationItemsPerPageSelector) +import IHP.View.Types (PaginationView(..), styledPagination, styledPaginationPageLink, styledPaginationDotDot, stylePaginationItemsPerPageSelector, styledPaginationLiPrevious, styledPaginationLiNext) import IHP.View.CSSFramework @@ -32,14 +32,20 @@ renderPagination pagination@Pagination {currentPage, window, pageSize} = [hsx| { paginationView = PaginationView { cssFramework = theCSSFramework , pagination = pagination - , previousPageUrl = pageUrl $ currentPage - 1 - , nextPageUrl = pageUrl $ currentPage + 1 + , liPrevious = liPrevious + , liNext = liNext , pageDotDotItems = pageDotDotItems , itemsPerPageSelector = itemsPerPageSelector } renderedHtml = styledPagination theCSSFramework theCSSFramework paginationView + liPrevious = + styledPaginationLiPrevious theCSSFramework theCSSFramework pagination (pageUrl $ currentPage - 1) + + liNext = + styledPaginationLiNext theCSSFramework theCSSFramework pagination (pageUrl $ currentPage + 1) + itemsPerPageSelector = stylePaginationItemsPerPageSelector theCSSFramework theCSSFramework pagination itemsPerPageUrl diff --git a/IHP/View/CSSFramework.hs b/IHP/View/CSSFramework.hs index 072607852..9a16e1464 100644 --- a/IHP/View/CSSFramework.hs +++ b/IHP/View/CSSFramework.hs @@ -44,6 +44,8 @@ instance Default CSSFramework where , styledPaginationPageLink , styledPaginationDotDot , stylePaginationItemsPerPageSelector + , styledPaginationLiPrevious + , styledPaginationLiNext } where styledFlashMessages cssFramework flashMessages = forEach flashMessages (styledFlashMessage cssFramework cssFramework) @@ -187,31 +189,12 @@ instance Default CSSFramework where |] where pagination@Pagination {currentPage} = get #pagination paginationView - previousPageUrl = get #previousPageUrl paginationView - nextPageUrl = get #nextPageUrl paginationView - prevClass = classes ["page-item", ("disabled", not $ hasPreviousPage pagination)] - nextClass = classes ["page-item", ("disabled", not $ hasNextPage pagination)] + liPrevious = get #liPrevious paginationView + liNext = get #liNext paginationView pageDotDotItems = get #pageDotDotItems paginationView itemsPerPageSelector = get #itemsPerPageSelector paginationView - liPrevious :: Blaze.Html - liPrevious = [hsx| -
  • - - - Previous - -
    • - |] - liNext = [hsx| -
  • - - - Next - -
    • - |] styledPaginationPageLink :: CSSFramework -> Pagination -> ByteString -> Int -> Blaze.Html styledPaginationPageLink _ pagination@Pagination {currentPage} pageUrl pageNumber = @@ -233,6 +216,33 @@ instance Default CSSFramework where in [hsx|{forEach [10,20,50,100,200] oneOption}|] + styledPaginationLiPrevious :: CSSFramework -> Pagination -> ByteString -> Blaze.Html + styledPaginationLiPrevious _ pagination@Pagination {currentPage} pageUrl = + let + prevClass = classes ["page-item", ("disabled", not $ hasPreviousPage pagination)] + in + [hsx| +
  • + + + Previous + +
    • + |] + + styledPaginationLiNext :: CSSFramework -> Pagination -> ByteString -> Blaze.Html + styledPaginationLiNext _ pagination@Pagination {currentPage} pageUrl = + let + nextClass = classes ["page-item", ("disabled", not $ hasNextPage pagination)] + in + [hsx| +
  • + + + Next + +
    • + |] bootstrap :: CSSFramework diff --git a/IHP/View/Types.hs b/IHP/View/Types.hs index b6b1ff3ec..af330ba75 100644 --- a/IHP/View/Types.hs +++ b/IHP/View/Types.hs @@ -106,8 +106,10 @@ data PaginationView = PaginationView { cssFramework :: !CSSFramework , pagination :: !Pagination - , previousPageUrl :: !ByteString - , nextPageUrl :: !ByteString + -- Previous page
  • + , liPrevious :: !Blaze.Html + -- Next page
  • + , liNext :: !Blaze.Html -- The page and dot dot as rendered by `styledPaginationPageLink` and `styledPaginationDotDot`. , pageDotDotItems :: !Blaze.Html -- Selector changing the number of allowed items per page. @@ -138,8 +140,12 @@ data CSSFramework = CSSFramework , styledValidationResult :: CSSFramework -> FormField -> Blaze.Html -- | Class name for container of validation error message , styledValidationResultClass :: Text - -- | Renders a pager + -- | Renders a the entire pager, with all its elements. , styledPagination :: CSSFramework -> PaginationView -> Blaze.Html + -- | The pagination's previous link + , styledPaginationLiPrevious :: CSSFramework -> Pagination -> ByteString -> Blaze.Html + -- | The pagination's next link + , styledPaginationLiNext :: CSSFramework -> Pagination -> ByteString -> Blaze.Html -- | Render the pagination links , styledPaginationPageLink :: CSSFramework -> Pagination -> ByteString -> Int -> Blaze.Html -- | Render the dots between pagination numbers (e.g. 5 6 ... 7 8) From 4b7bc63a7390904e6f399a3ad4025c578b9abeaf Mon Sep 17 00:00:00 2001 From: Amitai Burstein Date: Thu, 21 Oct 2021 10:51:09 +0300 Subject: [PATCH 15/28] Cleanup arguments --- IHP/View/CSSFramework.hs | 16 ++++------------ 1 file changed, 4 insertions(+), 12 deletions(-) diff --git a/IHP/View/CSSFramework.hs b/IHP/View/CSSFramework.hs index 9a16e1464..6b780e556 100644 --- a/IHP/View/CSSFramework.hs +++ b/IHP/View/CSSFramework.hs @@ -171,30 +171,22 @@ instance Default CSSFramework where
    |] - where - pagination@Pagination {currentPage} = get #pagination paginationView - liPrevious = get #liPrevious paginationView - liNext = get #liNext paginationView - pageDotDotItems = get #pageDotDotItems paginationView - itemsPerPageSelector = get #itemsPerPageSelector paginationView - - styledPaginationPageLink :: CSSFramework -> Pagination -> ByteString -> Int -> Blaze.Html styledPaginationPageLink _ pagination@Pagination {currentPage} pageUrl pageNumber = From 7bb1df8b8acd28612cb3a1e295bb404711f1f5d0 Mon Sep 17 00:00:00 2001 From: Amitai Burstein Date: Thu, 21 Oct 2021 12:35:52 +0300 Subject: [PATCH 16/28] Rename property --- IHP/Pagination/ViewFunctions.hs | 8 ++++---- IHP/View/CSSFramework.hs | 4 ++-- IHP/View/Types.hs | 10 +++++----- 3 files changed, 11 insertions(+), 11 deletions(-) diff --git a/IHP/Pagination/ViewFunctions.hs b/IHP/Pagination/ViewFunctions.hs index 48f7090bf..6f102b1d2 100644 --- a/IHP/Pagination/ViewFunctions.hs +++ b/IHP/Pagination/ViewFunctions.hs @@ -32,18 +32,18 @@ renderPagination pagination@Pagination {currentPage, window, pageSize} = [hsx| { paginationView = PaginationView { cssFramework = theCSSFramework , pagination = pagination - , liPrevious = liPrevious - , liNext = liNext + , linkPrevious = linkPrevious + , linkNext = linkNext , pageDotDotItems = pageDotDotItems , itemsPerPageSelector = itemsPerPageSelector } renderedHtml = styledPagination theCSSFramework theCSSFramework paginationView - liPrevious = + linkPrevious = styledPaginationLiPrevious theCSSFramework theCSSFramework pagination (pageUrl $ currentPage - 1) - liNext = + linkNext = styledPaginationLiNext theCSSFramework theCSSFramework pagination (pageUrl $ currentPage + 1) itemsPerPageSelector = diff --git a/IHP/View/CSSFramework.hs b/IHP/View/CSSFramework.hs index 6b780e556..4bc2f006e 100644 --- a/IHP/View/CSSFramework.hs +++ b/IHP/View/CSSFramework.hs @@ -171,9 +171,9 @@ instance Default CSSFramework where
    diff --git a/IHP/View/Types.hs b/IHP/View/Types.hs index af330ba75..ce3f5aead 100644 --- a/IHP/View/Types.hs +++ b/IHP/View/Types.hs @@ -106,17 +106,17 @@ data PaginationView = PaginationView { cssFramework :: !CSSFramework , pagination :: !Pagination - -- Previous page
  • - , liPrevious :: !Blaze.Html - -- Next page
  • - , liNext :: !Blaze.Html + -- Previous page link + , linkPrevious :: !Blaze.Html + -- Next page link + , linkNext :: !Blaze.Html -- The page and dot dot as rendered by `styledPaginationPageLink` and `styledPaginationDotDot`. , pageDotDotItems :: !Blaze.Html -- Selector changing the number of allowed items per page. , itemsPerPageSelector :: !Blaze.Html } --- | Render functions to render with bootstrap etc. +-- | Render functions to render with Bootstrap, Tailwind CSS etc. -- -- We call this functions with the cssFramework passed to have late binding (like from OOP languages) data CSSFramework = CSSFramework From 7dcfd601e0e71b2ccda681960af712fa137422fd Mon Sep 17 00:00:00 2001 From: Amitai Burstein Date: Thu, 21 Oct 2021 12:39:03 +0300 Subject: [PATCH 17/28] Start wiring TW --- IHP/View/CSSFramework.hs | 44 ++++++++++++++++++++++++++++++++++++++-- 1 file changed, 42 insertions(+), 2 deletions(-) diff --git a/IHP/View/CSSFramework.hs b/IHP/View/CSSFramework.hs index 4bc2f006e..278d79ef9 100644 --- a/IHP/View/CSSFramework.hs +++ b/IHP/View/CSSFramework.hs @@ -238,7 +238,15 @@ instance Default CSSFramework where bootstrap :: CSSFramework -bootstrap = def { styledFlashMessage, styledSubmitButtonClass, styledFormGroupClass, styledFormFieldHelp, styledInputClass, styledInputInvalidClass, styledValidationResultClass } +bootstrap = def + { styledFlashMessage + , styledSubmitButtonClass + , styledFormGroupClass + , styledFormFieldHelp + , styledInputClass + , styledInputInvalidClass + , styledValidationResultClass + } where styledFlashMessage _ (SuccessFlashMessage message) = [hsx|
    {message}
    |] styledFlashMessage _ (ErrorFlashMessage message) = [hsx|
    {message}
    |] @@ -257,7 +265,21 @@ bootstrap = def { styledFlashMessage, styledSubmitButtonClass, styledFormGroupCl styledSubmitButtonClass = "btn btn-primary" tailwind :: CSSFramework -tailwind = def { styledFlashMessage, styledSubmitButtonClass, styledFormGroupClass, styledFormFieldHelp, styledInputClass, styledInputInvalidClass, styledValidationResultClass } +tailwind = def + { styledFlashMessage + , styledSubmitButtonClass + , styledFormGroupClass + , styledFormFieldHelp + , styledInputClass + , styledInputInvalidClass + , styledValidationResultClass + , styledPagination + , styledPaginationLiPrevious + , styledPaginationLiNext + , styledPaginationPageLink + , styledPaginationDotDot + , stylePaginationItemsPerPageSelector + } where styledFlashMessage _ (SuccessFlashMessage message) = [hsx|
    {message}
    |] styledFlashMessage _ (ErrorFlashMessage message) = [hsx|
    {message}
    |] @@ -273,3 +295,21 @@ tailwind = def { styledFlashMessage, styledSubmitButtonClass, styledFormGroupCla styledFormGroupClass = "flex flex-wrap -mx-3 mb-6" styledValidationResultClass = "text-red-500 text-xs italic" + + styledPagination :: CSSFramework -> PaginationView -> Blaze.Html + styledPagination _ _ = mempty + + styledPaginationLiPrevious :: CSSFramework -> Pagination -> ByteString -> Blaze.Html + styledPaginationLiPrevious _ _ _ = mempty + + styledPaginationLiNext :: CSSFramework -> Pagination -> ByteString -> Blaze.Html + styledPaginationLiNext _ _ _ = mempty + + styledPaginationPageLink :: CSSFramework -> Pagination -> ByteString -> Int -> Blaze.Html + styledPaginationPageLink _ _ _ _ = mempty + + styledPaginationDotDot :: CSSFramework -> Pagination -> ByteString -> Int -> Blaze.Html + styledPaginationDotDot _ _ _ _ = mempty + + stylePaginationItemsPerPageSelector :: CSSFramework -> Pagination -> (Int -> ByteString) -> Blaze.Html + stylePaginationItemsPerPageSelector _ _ _ = mempty \ No newline at end of file From 12968534b0190aec412f3bc63f2d0d098a869224 Mon Sep 17 00:00:00 2001 From: Amitai Burstein Date: Thu, 21 Oct 2021 13:28:47 +0300 Subject: [PATCH 18/28] TW wiring --- IHP/Pagination/ViewFunctions.hs | 8 +- IHP/View/CSSFramework.hs | 136 +++++++++++++++++++++++++++----- IHP/View/Types.hs | 6 +- 3 files changed, 122 insertions(+), 28 deletions(-) diff --git a/IHP/Pagination/ViewFunctions.hs b/IHP/Pagination/ViewFunctions.hs index 6f102b1d2..2299eb843 100644 --- a/IHP/Pagination/ViewFunctions.hs +++ b/IHP/Pagination/ViewFunctions.hs @@ -20,7 +20,7 @@ import qualified Network.Wai as Wai import qualified Network.HTTP.Types.URI as Query import IHP.ViewSupport (theRequest, theCSSFramework) import qualified Data.Containers.ListUtils as List -import IHP.View.Types (PaginationView(..), styledPagination, styledPaginationPageLink, styledPaginationDotDot, stylePaginationItemsPerPageSelector, styledPaginationLiPrevious, styledPaginationLiNext) +import IHP.View.Types (PaginationView(..), styledPagination, styledPaginationPageLink, styledPaginationDotDot, stylePaginationItemsPerPageSelector, styledPaginationLinkPrevious, styledPaginationLinkNext) import IHP.View.CSSFramework @@ -41,10 +41,10 @@ renderPagination pagination@Pagination {currentPage, window, pageSize} = [hsx| { renderedHtml = styledPagination theCSSFramework theCSSFramework paginationView linkPrevious = - styledPaginationLiPrevious theCSSFramework theCSSFramework pagination (pageUrl $ currentPage - 1) + styledPaginationLinkPrevious theCSSFramework theCSSFramework pagination (pageUrl $ currentPage - 1) linkNext = - styledPaginationLiNext theCSSFramework theCSSFramework pagination (pageUrl $ currentPage + 1) + styledPaginationLinkNext theCSSFramework theCSSFramework pagination (pageUrl $ currentPage + 1) itemsPerPageSelector = stylePaginationItemsPerPageSelector theCSSFramework theCSSFramework pagination itemsPerPageUrl @@ -56,7 +56,7 @@ renderPagination pagination@Pagination {currentPage, window, pageSize} = [hsx| { Page n -> styledPaginationPageLink theCSSFramework theCSSFramework pagination (pageUrl n) n DotDot n -> - styledPaginationDotDot theCSSFramework theCSSFramework pagination (pageUrl n) n + styledPaginationDotDot theCSSFramework theCSSFramework pagination pageUrl n = path <> Query.renderQuery True newQueryString where diff --git a/IHP/View/CSSFramework.hs b/IHP/View/CSSFramework.hs index 278d79ef9..b3768689d 100644 --- a/IHP/View/CSSFramework.hs +++ b/IHP/View/CSSFramework.hs @@ -19,6 +19,7 @@ import qualified Text.Blaze.Html5.Attributes as A import IHP.ModelSupport import IHP.Pagination.Helpers import IHP.Pagination.Types +import IHP.View.Types (PaginationView(linkPrevious)) -- | Provides an unstyled CSSFramework @@ -44,8 +45,8 @@ instance Default CSSFramework where , styledPaginationPageLink , styledPaginationDotDot , stylePaginationItemsPerPageSelector - , styledPaginationLiPrevious - , styledPaginationLiNext + , styledPaginationLinkPrevious + , styledPaginationLinkNext } where styledFlashMessages cssFramework flashMessages = forEach flashMessages (styledFlashMessage cssFramework cssFramework) @@ -196,9 +197,9 @@ instance Default CSSFramework where [hsx|
  • {show pageNumber}
    • |] - styledPaginationDotDot :: CSSFramework -> Pagination -> ByteString -> Int -> Blaze.Html - styledPaginationDotDot _ pagination@Pagination {currentPage} pageUrl pageNumber = - [hsx|
  • …
    • |] + styledPaginationDotDot :: CSSFramework -> Pagination -> Blaze.Html + styledPaginationDotDot _ _ = + [hsx|
  • …
    • |] stylePaginationItemsPerPageSelector :: CSSFramework -> Pagination -> (Int -> ByteString) -> Blaze.Html stylePaginationItemsPerPageSelector _ pagination@Pagination {pageSize} itemsPerPageUrl = @@ -208,8 +209,8 @@ instance Default CSSFramework where in [hsx|{forEach [10,20,50,100,200] oneOption}|] - styledPaginationLiPrevious :: CSSFramework -> Pagination -> ByteString -> Blaze.Html - styledPaginationLiPrevious _ pagination@Pagination {currentPage} pageUrl = + styledPaginationLinkPrevious :: CSSFramework -> Pagination -> ByteString -> Blaze.Html + styledPaginationLinkPrevious _ pagination@Pagination {currentPage} pageUrl = let prevClass = classes ["page-item", ("disabled", not $ hasPreviousPage pagination)] in @@ -222,14 +223,14 @@ instance Default CSSFramework where |] - styledPaginationLiNext :: CSSFramework -> Pagination -> ByteString -> Blaze.Html - styledPaginationLiNext _ pagination@Pagination {currentPage} pageUrl = + styledPaginationLinkNext :: CSSFramework -> Pagination -> ByteString -> Blaze.Html + styledPaginationLinkNext _ pagination@Pagination {currentPage} pageUrl = let nextClass = classes ["page-item", ("disabled", not $ hasNextPage pagination)] in [hsx|
  • - + Next @@ -274,8 +275,8 @@ tailwind = def , styledInputInvalidClass , styledValidationResultClass , styledPagination - , styledPaginationLiPrevious - , styledPaginationLiNext + , styledPaginationLinkPrevious + , styledPaginationLinkNext , styledPaginationPageLink , styledPaginationDotDot , stylePaginationItemsPerPageSelector @@ -297,19 +298,112 @@ tailwind = def styledValidationResultClass = "text-red-500 text-xs italic" styledPagination :: CSSFramework -> PaginationView -> Blaze.Html - styledPagination _ _ = mempty + styledPagination _ paginationView = [hsx| +
    +
    + {get #linkPrevious paginationView} + {get #linkNext paginationView} +
    + +
    + |] + + styledPaginationLinkPrevious :: CSSFramework -> Pagination -> ByteString -> Blaze.Html + styledPaginationLinkPrevious _ pagination@Pagination {currentPage} pageUrl = + let + prevClass = classes + [ "relative inline-flex items-center px-2 py-2 rounded-l-md border border-gray-300 bg-white text-sm font-medium text-gray-500 hover:bg-gray-50" + , ("disabled", not $ hasPreviousPage pagination) + ] + in + [hsx| + + Previous + + + + |] - styledPaginationLiPrevious :: CSSFramework -> Pagination -> ByteString -> Blaze.Html - styledPaginationLiPrevious _ _ _ = mempty + styledPaginationLinkNext :: CSSFramework -> Pagination -> ByteString -> Blaze.Html + styledPaginationLinkNext _ pagination@Pagination {currentPage} pageUrl = + let + nextClass = classes + [ "relative inline-flex items-center px-2 py-2 rounded-r-md border border-gray-300 bg-white text-sm font-medium text-gray-500 hover:bg-gray-50" + , ("disabled", not $ hasNextPage pagination) + ] + in + [hsx| + + Next + + + - styledPaginationLiNext :: CSSFramework -> Pagination -> ByteString -> Blaze.Html - styledPaginationLiNext _ _ _ = mempty + |] styledPaginationPageLink :: CSSFramework -> Pagination -> ByteString -> Int -> Blaze.Html - styledPaginationPageLink _ _ _ _ = mempty + styledPaginationPageLink _ pagination@Pagination {currentPage} pageUrl pageNumber = + let + linkClass = classes + [ "relative inline-flex items-center px-4 py-2 border text-sm font-medium" + -- Current page + , ("z-10 bg-indigo-50 border-indigo-500 text-indigo-600", pageNumber == currentPage) + -- Not current page + , ("bg-white border-gray-300 text-gray-500 hover:bg-gray-50", pageNumber /= currentPage) + ] + in + [hsx| + + {show pageNumber} + + |] + + + styledPaginationDotDot :: CSSFramework -> Pagination -> Blaze.Html + styledPaginationDotDot _ _ = + [hsx| + + ... + + |] - styledPaginationDotDot :: CSSFramework -> Pagination -> ByteString -> Int -> Blaze.Html - styledPaginationDotDot _ _ _ _ = mempty stylePaginationItemsPerPageSelector :: CSSFramework -> Pagination -> (Int -> ByteString) -> Blaze.Html - stylePaginationItemsPerPageSelector _ _ _ = mempty \ No newline at end of file + stylePaginationItemsPerPageSelector _ pagination@Pagination {pageSize} itemsPerPageUrl = + let + oneOption :: Int -> Blaze.Html + oneOption n = [hsx||] + in + [hsx|{forEach [10,20,50,100,200] oneOption}|] diff --git a/IHP/View/Types.hs b/IHP/View/Types.hs index ce3f5aead..d82a4ef14 100644 --- a/IHP/View/Types.hs +++ b/IHP/View/Types.hs @@ -143,13 +143,13 @@ data CSSFramework = CSSFramework -- | Renders a the entire pager, with all its elements. , styledPagination :: CSSFramework -> PaginationView -> Blaze.Html -- | The pagination's previous link - , styledPaginationLiPrevious :: CSSFramework -> Pagination -> ByteString -> Blaze.Html + , styledPaginationLinkPrevious :: CSSFramework -> Pagination -> ByteString -> Blaze.Html -- | The pagination's next link - , styledPaginationLiNext :: CSSFramework -> Pagination -> ByteString -> Blaze.Html + , styledPaginationLinkNext :: CSSFramework -> Pagination -> ByteString -> Blaze.Html -- | Render the pagination links , styledPaginationPageLink :: CSSFramework -> Pagination -> ByteString -> Int -> Blaze.Html -- | Render the dots between pagination numbers (e.g. 5 6 ... 7 8) - , styledPaginationDotDot :: CSSFramework -> Pagination -> ByteString -> Int -> Blaze.Html + , styledPaginationDotDot :: CSSFramework -> Pagination -> Blaze.Html -- | Render the items per page selector for pagination. -- Note the (Int -> ByteString), we are passing the pageUrl function, so anyone that would like to override -- it the selector with different items per page could still use the pageUrl function to get the correct URL. From d763d8c1db9b1d4366c737899c0d03e7bfd899ef Mon Sep 17 00:00:00 2001 From: Amitai Burstein Date: Thu, 21 Oct 2021 13:44:01 +0300 Subject: [PATCH 19/28] Mobile TW wire --- IHP/Pagination/ViewFunctions.hs | 1 + IHP/View/CSSFramework.hs | 87 ++++++++++++++++++++------------- IHP/View/Types.hs | 7 +-- 3 files changed, 59 insertions(+), 36 deletions(-) diff --git a/IHP/Pagination/ViewFunctions.hs b/IHP/Pagination/ViewFunctions.hs index 2299eb843..692c8b0c4 100644 --- a/IHP/Pagination/ViewFunctions.hs +++ b/IHP/Pagination/ViewFunctions.hs @@ -32,6 +32,7 @@ renderPagination pagination@Pagination {currentPage, window, pageSize} = [hsx| { paginationView = PaginationView { cssFramework = theCSSFramework , pagination = pagination + , pageUrl = pageUrl , linkPrevious = linkPrevious , linkNext = linkNext , pageDotDotItems = pageDotDotItems diff --git a/IHP/View/CSSFramework.hs b/IHP/View/CSSFramework.hs index b3768689d..29534315e 100644 --- a/IHP/View/CSSFramework.hs +++ b/IHP/View/CSSFramework.hs @@ -19,7 +19,7 @@ import qualified Text.Blaze.Html5.Attributes as A import IHP.ModelSupport import IHP.Pagination.Helpers import IHP.Pagination.Types -import IHP.View.Types (PaginationView(linkPrevious)) +import IHP.View.Types (PaginationView(linkPrevious, pagination)) -- | Provides an unstyled CSSFramework @@ -298,43 +298,64 @@ tailwind = def styledValidationResultClass = "text-red-500 text-xs italic" styledPagination :: CSSFramework -> PaginationView -> Blaze.Html - styledPagination _ paginationView = [hsx| -
    -
    - {get #linkPrevious paginationView} - {get #linkNext paginationView} -
    -
  • - + Previous @@ -227,10 +228,11 @@ instance Default CSSFramework where styledPaginationLinkNext _ pagination@Pagination {currentPage} pageUrl = let nextClass = classes ["page-item", ("disabled", not $ hasNextPage pagination)] + url = if hasNextPage pagination then pageUrl else "#" in [hsx|
  • - + Next @@ -347,7 +349,6 @@ tailwind = def