From 4f44660cfdb0136cd9f9031c70c8046b3bbcf19e Mon Sep 17 00:00:00 2001 From: Bryan Goldstein Date: Wed, 22 Mar 2017 03:25:22 +0000 Subject: [PATCH] Pass down gun instance so things don't break --- examples/react/src/App.js | 11 ++++++++--- examples/react/src/Chat.js | 8 ++++---- examples/react/src/Json.js | 11 +++++------ examples/react/src/Todos.js | 10 +++++----- 4 files changed, 22 insertions(+), 18 deletions(-) diff --git a/examples/react/src/App.js b/examples/react/src/App.js index fb424d44..d659fda6 100644 --- a/examples/react/src/App.js +++ b/examples/react/src/App.js @@ -4,20 +4,25 @@ import Chat from './Chat' import Json from './Json' class App extends Component { + constructor() { + super(); + this.gun = Gun(location.origin + '/gun') + } + render() { return (

React Examples

Todo

- +

Chat

- +

Json

- +
); } diff --git a/examples/react/src/Chat.js b/examples/react/src/Chat.js index 1a3accbc..6f01989b 100644 --- a/examples/react/src/Chat.js +++ b/examples/react/src/Chat.js @@ -1,7 +1,6 @@ import React, { Component } from 'react' import Gun from 'gun' -const gun = Gun(location.origin + '/gun').get('chat') const formatMsgs = msgs => Object.keys(msgs) .map(key => ({ key, ...msgs[key] })) .filter(m => Boolean(m.when) && m.key !== '_') @@ -9,8 +8,9 @@ const formatMsgs = msgs => Object.keys(msgs) .map(m => ((m.whenFmt = new Date(m.when).toLocaleString().toLowerCase()), m)) export default class Chat extends Component { - constructor() { + constructor({gun}) { super() + this.gun = gun.get('chat'); this.state = { newMsg: '', name: (document.cookie.match(/alias\=(.*?)(\&|$|\;)/i)||[])[1]||'', @@ -19,7 +19,7 @@ export default class Chat extends Component { } componentWillMount() { const tmpState = {} - gun.map().val((msg, key) => { + this.gun.map().val((msg, key) => { tmpState[key] = msg this.setState({msgs: Object.assign({}, this.state.msgs, tmpState)}) }) @@ -32,7 +32,7 @@ export default class Chat extends Component { document.cookie = ('alias=' + who) const when = Gun.time.is() const key = `${when}_${Gun.text.random(4)}` - gun.path(key).put({ + this.gun.path(key).put({ who, when, what: this.state.newMsg, diff --git a/examples/react/src/Json.js b/examples/react/src/Json.js index 00947e28..748b853e 100644 --- a/examples/react/src/Json.js +++ b/examples/react/src/Json.js @@ -1,30 +1,29 @@ import React, { Component } from 'react' -import Gun from 'gun' -const gun = Gun(location.origin + '/gun').get('json') const formatJson = json => Object.keys(json) .map(key => ({ key, val: json[key]})) .filter(el => el.key !== '_') export default class Json extends Component { - constructor() { + constructor({gun}) { super() + this.gun = gun.get('json'); this.state = { newField: '', json: [] } } componentWillMount() { - gun.on(json => this.setState({ json: formatJson(json) })) + this.gun.on(json => this.setState({ json: formatJson(json) })) } edit = key => e => { e.preventDefault() - gun.path(key).put(e.target.value) + this.gun.path(key).put(e.target.value) } add = e => { e.preventDefault() - gun.path(this.state.newField).put('value') + this.gun.path(this.state.newField).put('value') this.setState({newField: ''}) } diff --git a/examples/react/src/Todos.js b/examples/react/src/Todos.js index 7193959b..f9b18b88 100644 --- a/examples/react/src/Todos.js +++ b/examples/react/src/Todos.js @@ -2,27 +2,27 @@ import './style.css' import React, { Component } from 'react' import Gun from 'gun' -const gun = Gun(location.origin + '/gun').get('todos') const formatTodos = todos => Object.keys(todos) .map(key => ({ key, val: todos[key] })) .filter(t => Boolean(t.val) && t.key !== '_') export default class Todos extends Component { - constructor() { + constructor({gun}) { super() + this.gun = gun.get('todos'); this.state = {newTodo: '', todos: []} } componentWillMount() { - gun.on(todos => this.setState({ + this.gun.on(todos => this.setState({ todos: formatTodos(todos) })) } add = e => { e.preventDefault() - gun.path(Gun.text.random()).put(this.state.newTodo) + this.gun.path(Gun.text.random()).put(this.state.newTodo) this.setState({newTodo: ''}) } - del = key => gun.path(key).put(null) + del = key => this.gun.path(key).put(null) handleChange = e => this.setState({ newTodo: e.target.value}) render() { return