These are chat archives for chandu0101/scalajs-react-components

17th
Jun 2016
Raul Rodriguez
@raul782
Jun 17 2016 02:21
Hi guys, so I was able to to change the state, but still I’m getting a blank table.
val component = ReactComponentB[Unit](“PolicyList")
      .initialState(State(
        fixedHeader = false,
        fixedFooter = false,
        stripedRows = true,
        showRowHover = true,
        selectable = true,
        multiSelectable = false,
        enableSelectAll = false,
        deselectOnClickaway = true,
        height = "400px",
        selected = js.Array[Int](),
        policies = List()
      ))
      .renderBackend[Backend]
      .componentDidMount(_.backend.getPolicies)
      .buildU
def render(S: State) =
      <.div(
        MuiTable(
          key           = S.toString,
          height        = S.height,
          fixedHeader   = S.fixedHeader,
          fixedFooter         = S.fixedFooter,
          selectable          = S.selectable,
          multiSelectable     = S.multiSelectable
        )(
          MuiTableHeader(enableSelectAll = S.enableSelectAll)(
            MuiTableRow()(
              MuiTableHeaderColumn(
                tooltip = "Policies",
                style   = js.Dynamic.literal("textAlign" -> "center")
              )()
            ),
            columnNames
          ),

          MuiTableBody(
            deselectOnClickaway = S.deselectOnClickaway,
            showRowHover = S.showRowHover,
            stripedRows = S.stripedRows
          )(
            renderPolicies(S.selected, S.policies) : _*
          ),

          MuiTableFooter()(
            columnNames,
            MuiTableRow(style = js.Dynamic.literal("width" -> "300", "padding" -> "20px" ))()
          )
        )
      )
def renderPolicies(selecteds: String| js.Array[Int], policies: List[Policy]) : Seq[ReactNode] =
        policies.zipWithIndex.map {
          case (p, idx) =>
            val selected = selecteds match {
              case a: js.Array[_] => a.contains(idx)
              case all => true
            }

            MuiTableRow(selected = selected)(
              MuiTableRowColumn()(p.number),
              MuiTableRowColumn()(p.content)
            )
        }
Raul Rodriguez
@raul782
Jun 17 2016 15:28
hi guys, I’m trying to understand why this component gives me an error at run time.
val colNames = MuiTableRow() (
      MuiTableHeaderColumn(tooltip = “policy number") (“number"),
    )
material_ui-bundle.js:1 Uncaught TypeError: Cannot read property 'firstChild' of undefined
If I remove the tooltip, it works
Raul Rodriguez
@raul782
Jun 17 2016 15:44
I tried to re-compile the demo project but got this error today.
[error] (demo/compile:scalaJSIR) org.scalajs.core.ir.IRVersionNotSupportedException: Failed to deserialize info of file compiled with Scala.js 0.6.8 (supported: 0.6.0, 0.6.3, 0.6.4, 0.6.6, 0.6.5): /path/scalajs-react-components/demo/target/scala-2.11/classes/demo/components/materialui/MuiDrawerDemo$.sjsir
Raul Rodriguez
@raul782
Jun 17 2016 15:57
I’ll rebuild the project
Raul Rodriguez
@raul782
Jun 17 2016 16:03
somehow, scalajs 0..6.8 got into the build, don’t know why, maybe since I’m using another project with that version and I was testing both :worried: Cleaning and rebuilding fixed the issue.
humm, I wonder why in the demo the MuiTable works with the tooltip but not in my project :worried:
Chandra Sekhar Kode
@chandu0101
Jun 17 2016 16:05
same material-ui version ?
Raul Rodriguez
@raul782
Jun 17 2016 16:05
yep, same "material-ui": "v0.14.4",
Chandra Sekhar Kode
@chandu0101
Jun 17 2016 16:28
wish i could help more!
Raul Rodriguez
@raul782
Jun 17 2016 16:29
Well I guess I could live without tooltips for now :smile:
Øyvind Raddum Berg
@oyvindberg
Jun 17 2016 18:11
@raul782 i dont know about that tooltip case specifically, but in general the best way to debug these things is to just lookup what the javascript tries to do when it fails
there are some times some weird dependencies that are not clearly expressed
Raul Rodriguez
@raul782
Jun 17 2016 18:20
@oyvindberg thanks for the advice, I’ll dig into this later today.