Skip to content

Data array not updating #5

@idkjs

Description

@idkjs

Another thing is that the examples using data array are showing "loading" in the browser but never update with the data. This is the code I have that is doing that:


type state = {repoData: option(array(RepoData.repo))};

type action =
  | Loaded(array(RepoData.repo));

let component = ReasonReact.reducerComponent("App");

/* make dummy repos an array using Reason array literal syntax,
define a string of JSON and use it with parseRepoJson() from RepoData.re.
`{js| ... |js}` is an alternative form of reason string literal syntax.
*/
 
let dummyRepos: array(RepoData.repo) = [|
  RepoData.parseRepoJson(
    Js.Json.parseExn(
      {js|
        {
          "stargazers_count": 93,
          "full_name": "reasonml/reason-tools",
          "html_url": "https://github.com/reasonml/reason-tools"
        }
      |js}
    )
  )
|];

/* use switch statement instead of render on initialState so that we can 
account for each result in our repo data option type, the render that arg
in the div. RepoItem module expects a repo, so Some gives us a repo, pass that
value to RepoItem ~repo named arg.
*/
let make = (_children) => {
  ...component,
  initialState: () => {
    repoData: None
  },
  reducer: (action, state) => {
    switch action {
      | Loaded(loadedRepo) =>
        ReasonReact.Update({
          repoData: Some(loadedRepo)
        })
    }
  },
  render: (self) => {
    let repoItem =
    switch (self.state.repoData) {
    | Some(repos) => ReasonReact.arrayToElement(
        Array.map(
          (repo: RepoData.repo) => <RepoItem key=repo.full_name repo=repo />,
          repos
        )
    )
    | None => ReasonReact.stringToElement("Loading")
    };
  
    <div className="App">
      <h1>{ReasonReact.stringToElement("Reason Projects")}</h1>
      {repoItem}
    </div>
  }
};

getting this warning in devtools

Warning number 27
  /Users/shingdev/code/REASON/reason-repo-list/src/app.re 38:21-25
  
  36 ┆   repoData: None
  37 ┆ },
  38 ┆ reducer: (action, state) => {
  39 ┆   switch action {
  40 ┆     | Loaded(loadedRepo) =>
  
  unused variable state.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions