Schema.elm

module Schema exposing (school)

import PostgRest exposing (Attribute, Schema, schema, string)


type School
    = School School


school :
    Schema School
        { id : Attribute String
        , name : Attribute String
        , address : Attribute String
        , city : Attribute String
        , state : Attribute String
        , zip : Attribute String
        , web : Attribute String
        , longitude : Attribute String
        , latitude : Attribute String
        }
school =
    schema "schools"
        { id = string "unitid"
        , name = string "instnm"
        , address = string "addr"
        , city = string "city"
        , state = string "stabbr"
        , zip = string "zip"
        , web = string "webaddr"
        , longitude = string "longitud"
        , latitude = string "latitude"
        }

SchemaDiagram.elm

module BasicExample exposing (..)

import Browser
import Element
import Element.Background as Background
import Element.Border as Border
import Element.Font as Font
import Html exposing (Html)
import Http
import PostgRest as Rest exposing (Attribute, Selection)
import Schema


type alias School =
    { id : String
    , name : String
    , address : String
    , city : String
    , state : String
    , zip : String
    , web : String
    , longitude : String
    , latitude : String
    }


request : Rest.Request (List School)
request =
    Rest.readMany Schema.school
        { select = selection
        , where_ = Rest.like "University of California%" .name
        , order = [ Rest.asc .name ]
        , limit = Nothing
        , offset = Nothing
        }


selection :
    Selection
        { a
            | address : Attribute String
            , city : Attribute String
            , id : Attribute String
            , latitude : Attribute String
            , longitude : Attribute String
            , name : Attribute String
            , state : Attribute String
            , web : Attribute String
            , zip : Attribute String
        }
        School
selection =
    Rest.succeed School
        |> select .id
        |> select .name
        |> select .address
        |> select .city
        |> select .state
        |> select .zip
        |> select .web
        |> select .longitude
        |> select .latitude


type alias Model =
    List School


type Msg
    = Fetch (Result Http.Error (List School))


update : Msg -> Model -> ( Model, Cmd Msg )
update msg model =
    case msg of
        Fetch (Ok schools) ->
            ( schools, Cmd.none )

        _ ->
            ( model, Cmd.none )


cell s =
    Element.el
        [ Element.padding 15
        , Element.scrollbarX
        , Font.size 12
        , Background.color white
        , Border.color lightGrey
        , Border.widthEach
            { bottom = 0
            , left = 0
            , right = 0
            , top = 5
            }
        ]
        (Element.text s)


viewSchools schools =
    Element.table
        [ Element.centerX
        , Element.centerY
        , Element.width Element.shrink
        , Element.height Element.shrink
        ]
        { data = schools
        , columns =
            [ { header = cell "id: String"
              , width = Element.fillPortion 1
              , view = .id >> cell
              }
            , { header = cell "name: String"
              , width = Element.fillPortion 1
              , view = .name >> String.dropLeft (String.length "University of California-") >> cell
              }
            , { width = Element.fillPortion 1
              , header = cell "address: String"
              , view = .address >> cell
              }
            , { width = Element.fillPortion 1
              , header = cell "city: String"
              , view = .city >> cell
              }
            , { width = Element.fillPortion 1
              , header = cell "state: String"
              , view = .state >> cell
              }
            , { width = Element.fillPortion 1
              , header = cell "zip: String"
              , view = .zip >> cell
              }
            , { width = Element.fillPortion 1
              , header = cell "web: String"
              , view = .web >> String.toLower >> cell
              }
            , { width = Element.fillPortion 1
              , header = cell "longitude: String"
              , view = .longitude >> cell
              }
            , { width = Element.fillPortion 1
              , header = cell "latitude: String"
              , view = .latitude >> cell
              }
            ]
        }


tableHeader =
    Element.el
        [ Element.centerX
        , Element.centerY
        , Element.width Element.fill
        , Element.padding 15
        , Element.height Element.shrink
        , Font.size 12
        , Background.color white
        ]
        (Element.el [ Element.centerX ] (Element.text "name: schools"))


view : Model -> Html Msg
view model =
    Element.layout
        [ Background.color lightGrey
        , Font.family [ Font.monospace ]
        , Element.padding 20
        ]
        (Element.column [] [ tableHeader, viewSchools model ])


page : Model -> { title : String, body : List (Html Msg) }
page model =
    { title = "Schema Diagram"
    , body = [ view model ]
    }


main : Program () Model Msg
main =
    Browser.document
        { init = \_ -> ( [], getSchools )
        , view = page
        , update = update
        , subscriptions = \_ -> Sub.none
        }


lightGrey : Element.Color
lightGrey =
    Element.rgb 0.95 0.95 0.95


grey : Element.Color
grey =
    Element.rgb 0.75 0.75 0.75


white : Element.Color
white =
    Element.rgb 1 1 1


getSchools : Cmd Msg
getSchools =
    Http.send Fetch (Rest.toHttpRequest { timeout = Nothing, token = Nothing, url = "http://localhost:3000" } request)


andMap : Selection attributes a -> Selection attributes (a -> b) -> Selection attributes b
andMap =
    Rest.map2 (|>)


select : (attributes -> Attribute a) -> Selection attributes (a -> b) -> Selection attributes b
select getAttribute selectionFn =
    andMap (Rest.field getAttribute) selectionFn