{"action":"created","issue":{"url":"https://api.github.com/repos/sheaivey/react-axios/issues/26","repository_url":"https://api.github.com/repos/sheaivey/react-axios","labels_url":"https://api.github.com/repos/sheaivey/react-axios/issues/26/labels{/name}","comments_url":"https://api.github.com/repos/sheaivey/react-axios/issues/26/comments","events_url":"https://api.github.com/repos/sheaivey/react-axios/issues/26/events","html_url":"https://github.com/sheaivey/react-axios/issues/26","id":364632599,"node_id":"MDU6SXNzdWUzNjQ2MzI1OTk=","number":26,"title":"Add refreshInterval","user":{"login":"charlax","id":120501,"node_id":"MDQ6VXNlcjEyMDUwMQ==","avatar_url":"https://avatars0.githubusercontent.com/u/120501?v=4","gravatar_id":"","url":"https://api.github.com/users/charlax","html_url":"https://github.com/charlax","followers_url":"https://api.github.com/users/charlax/followers","following_url":"https://api.github.com/users/charlax/following{/other_user}","gists_url":"https://api.github.com/users/charlax/gists{/gist_id}","starred_url":"https://api.github.com/users/charlax/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/charlax/subscriptions","organizations_url":"https://api.github.com/users/charlax/orgs","repos_url":"https://api.github.com/users/charlax/repos","events_url":"https://api.github.com/users/charlax/events{/privacy}","received_events_url":"https://api.github.com/users/charlax/received_events","type":"User","site_admin":false},"labels":[],"state":"open","locked":false,"assignee":null,"assignees":[],"milestone":null,"comments":1,"created_at":"2018-09-27T20:02:45Z","updated_at":"2018-10-12T04:57:27Z","closed_at":null,"author_association":"NONE","body":"Hey,\r\n\r\nThanks for `react-axios`!\r\n\r\nWhat would you think about adding a `refreshInterval` prop to refresh the data periodically? To let the child know that it's refreshing, there would another parameter `isRefreshing`.\r\n\r\nLike https://github.com/heroku/react-refetch#automatic-refreshing - we could even use the same behavior:\r\n\r\n> When refreshing, the PromiseState will be the same as a the previous fulfilled state, but with the refreshing attribute set. That is, pending will remain unset and the existing value will be left in tact. When the refresh completes, refreshing will be unset and the value will be updated with the latest data. If the refresh is rejected, the PromiseState will move into a rejected and not attempt to refresh again.\r\n\r\n"},"comment":{"url":"https://api.github.com/repos/sheaivey/react-axios/issues/comments/429204325","html_url":"https://github.com/sheaivey/react-axios/issues/26#issuecomment-429204325","issue_url":"https://api.github.com/repos/sheaivey/react-axios/issues/26","id":429204325,"node_id":"MDEyOklzc3VlQ29tbWVudDQyOTIwNDMyNQ==","user":{"login":"sheaivey","id":3945263,"node_id":"MDQ6VXNlcjM5NDUyNjM=","avatar_url":"https://avatars0.githubusercontent.com/u/3945263?v=4","gravatar_id":"","url":"https://api.github.com/users/sheaivey","html_url":"https://github.com/sheaivey","followers_url":"https://api.github.com/users/sheaivey/followers","following_url":"https://api.github.com/users/sheaivey/following{/other_user}","gists_url":"https://api.github.com/users/sheaivey/gists{/gist_id}","starred_url":"https://api.github.com/users/sheaivey/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/sheaivey/subscriptions","organizations_url":"https://api.github.com/users/sheaivey/orgs","repos_url":"https://api.github.com/users/sheaivey/repos","events_url":"https://api.github.com/users/sheaivey/events{/privacy}","received_events_url":"https://api.github.com/users/sheaivey/received_events","type":"User","site_admin":false},"created_at":"2018-10-12T04:57:27Z","updated_at":"2018-10-12T04:57:27Z","author_association":"OWNER","body":"Hello @charlax, sorry for the delay. I was looking over the react-refetch and I don't think this functionality needs to be built in explicitly to react-axios. \r\n\r\nThe simplest and most appropriate way I think to implement this would be would be to take advantage of the child call back function from react-axioss by adding your own setTimeout on success that will call the available helper method `onReload()`. This will continue to to call setTimeout every time the xhr resolves. You can even send new props to onReload(newProps) if you need each interval to call a different URL. It is also already scoped if you happen to have multiple instances of react-axios in your app.\r\n\r\nIf you need to do anything more complex or want to reuse code I would suggest crating a component that wraps what is described above and takes the an interval prop or anything else you want to make dynamic.\r\n\r\nI have tried this and it really is just this simple:\r\n```jsx\r\n<Get url=\"http://example.com/\"> {\r\n  (error, response, isLoading, onReload) {\r\n    if(error) {\r\n      // error\r\n      return (<div>Something bad happened: {error.message}</div>)\r\n    } else if(isLoading) {\r\n      // loading\r\n      return (<div className=\"loader\"></div>)\r\n    } else if(response !== null) { \r\n      // success\r\n      setTimeout(()=>{onReload()}, 2000) // the interval magic is here\r\n      return (<div>{response.data.message}</div>)\r\n    }\r\n    return null\r\n  }\r\n</Get>\r\n```\r\nHopefully this helps you accomplish your task."}}
{"actor":{"display_login":"sheaivey"}}