githubGraphQL.elm

module Main exposing (..)

import Html exposing (Html, text, div, ul, li)
import Http
import Json.Decode as Decode
import Json.Decode.Pipeline as Pipeline


main =
    Html.program
        { init = init
        , view = view
        , update = update
        , subscriptions = \_ -> Sub.none
        }


type alias Model =
    { issues : List Issue
    , message : String
    }


type alias Issue =
    { id : Int
    , title : String
    }


type Msg
    = FetchGithubIssues (Result Http.Error (List Issue))


githubRepo : String
githubRepo =
    """
    {
      github {
        repo(ownerUsername: "nodejs", name: "node") {
          id
          name
          issues(limit: 1) {
            id
            state
            title
          }
        }
      }
    }
    """


issueDecoder : Decode.Decoder Issue
issueDecoder =
    Pipeline.decode Issue
        |> Pipeline.required "id" Decode.int
        |> Pipeline.required "title" Decode.string


request : Http.Request (List Issue)
request =
    let
        encoded =
            Http.encodeUri githubRepo

        decoder =
            Decode.at [ "data", "github", "repo", "issues" ] <|
                Decode.list issueDecoder
    in
        Http.get ("https://www.graphqlhub.com/graphql?query=" ++ encoded) decoder


init : ( Model, Cmd Msg )
init =
    { issues = []
    , message = "Waiting for a response... "
    }
        ! [ Http.send FetchGithubIssues request ]


update : Msg -> Model -> ( Model, Cmd Msg )
update msg model =
    case msg of
        FetchGithubIssues (Ok issues) ->
            { model | issues = issues, message = "Got issues!" } ! []

        FetchGithubIssues (Err res) ->
            { model | message = toString res } ! []


listItem : String -> Html Msg
listItem str =
    li [] [ text str ]


view : Model -> Html Msg
view model =
    let
        items =
            List.map (listItem << .title) model.issues

        issuesList =
            ul [] items
    in
        div [] [ text model.message, issuesList ]