Improve item detail view

- Separate page (permalink) for item details

- Use available space and hide search menu

- Disable item navigation links if there is nothing to go to

- Show notes more prominently and allow to hide them
This commit is contained in:
Eike Kettner
2019-12-31 00:56:41 +01:00
parent 36a6fdd746
commit c73cdd82ab
12 changed files with 342 additions and 183 deletions

View File

@@ -0,0 +1,22 @@
module Page.ItemDetail.Data exposing (Model, Msg(..), emptyModel)
import Api.Model.ItemDetail exposing (ItemDetail)
import Comp.ItemDetail
import Http
type alias Model =
{ detail : Comp.ItemDetail.Model
}
emptyModel : Model
emptyModel =
{ detail = Comp.ItemDetail.emptyModel
}
type Msg
= Init String
| ItemDetailMsg Comp.ItemDetail.Msg
| ItemResp (Result Http.Error ItemDetail)

View File

@@ -0,0 +1,39 @@
module Page.ItemDetail.Update exposing (update)
import Api
import Browser.Navigation as Nav
import Comp.ItemDetail
import Data.Flags exposing (Flags)
import Page.ItemDetail.Data exposing (Model, Msg(..))
update : Nav.Key -> Flags -> Maybe String -> Msg -> Model -> ( Model, Cmd Msg )
update key flags next msg model =
case msg of
Init id ->
let
( lm, lc ) =
Comp.ItemDetail.update key flags next Comp.ItemDetail.Init model.detail
in
( { model | detail = lm }
, Cmd.batch [ Api.itemDetail flags id ItemResp, Cmd.map ItemDetailMsg lc ]
)
ItemDetailMsg lmsg ->
let
( lm, lc ) =
Comp.ItemDetail.update key flags next lmsg model.detail
in
( { model | detail = lm }
, Cmd.map ItemDetailMsg lc
)
ItemResp (Ok item) ->
let
lmsg =
Comp.ItemDetail.SetItem item
in
update key flags next (ItemDetailMsg lmsg) model
ItemResp (Err err) ->
( model, Cmd.none )

View File

@@ -0,0 +1,19 @@
module Page.ItemDetail.View exposing (view)
import Comp.ItemDetail
import Html exposing (..)
import Html.Attributes exposing (..)
import Page.ItemDetail.Data exposing (Model, Msg(..))
type alias ItemNav =
{ prev : Maybe String
, next : Maybe String
}
view : ItemNav -> Model -> Html Msg
view inav model =
div [ class "ui fluid container item-detail-page" ]
[ Html.map ItemDetailMsg (Comp.ItemDetail.view inav model.detail)
]