Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merging Back 1.0 #157

Merged
merged 119 commits into from
Aug 23, 2016
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
119 commits
Select commit Hold shift + click to select a range
477d847
Removes legacy stuff to a sub-directory.
skellock Jul 24, 2016
852e8c5
Moves the rest of the hidden files I forgot.
skellock Jul 24, 2016
670285a
Adds lerna to manage publishing and linking.
skellock Jul 30, 2016
7750270
Sets the lerna version to 0.1.0.
skellock Jul 30, 2016
e6f1964
Imports the new core client library. 🚀
skellock Jul 30, 2016
fb4165d
Imports the new core server. 🦄
skellock Jul 30, 2016
ce553be
Imports the start of the React Native client. 😻
skellock Jul 30, 2016
1b885ab
Adds the root package.json with the lerna dependency.
skellock Jul 30, 2016
fff313d
Adds build support to reactotron-core-server.
skellock Jul 30, 2016
0be91dd
Salvages the current server as a starting point.
skellock Jul 30, 2016
fb0770b
Bumps up a dependency to the correct version for dev.
skellock Jul 30, 2016
2adb9cb
Nukes the dist build of reactotron-react-native.
skellock Jul 30, 2016
5b62679
Ignores dist build of reactotron-react-native.
skellock Jul 30, 2016
9a0cda9
Plays nice with socket.io in both RN and node.
skellock Jul 30, 2016
6e0bd70
Sets the proper port for the reactotron-cli.
skellock Jul 30, 2016
e9a44e1
Starts on the React Native demo. Doesn't work. I'm sad. 😿
skellock Jul 30, 2016
6beb53b
Sidesteps React Native internal dependency issues. Good to go!
skellock Jul 30, 2016
3f18d23
Translates peerDependencies from French to English.
skellock Jul 30, 2016
c412574
Adds events for connect/disconnect to the core client.
skellock Jul 30, 2016
090a235
Removes the reactotron-core-client dist build.
skellock Jul 30, 2016
e88aa37
Ensures we never see dist again in git. 👋
skellock Jul 30, 2016
5469d49
Adds start, stop, connect, and disconnect events to core server.
skellock Jul 30, 2016
812c0f1
Allows events onConnect and onDisconnect in reactotron-react-native.
skellock Jul 30, 2016
163ca81
Hooks up the cli to connect/disconnect and start/stop. 🌟
skellock Jul 30, 2016
57ca750
Use the *real* source for demo-react-native's internal deps.
skellock Jul 30, 2016
bb80988
Switches to src in reactotron-core-server's package.json.
skellock Jul 30, 2016
4a4a590
Adds a plugin system to reactotron-core-client.
skellock Jul 31, 2016
8f54460
Adds the transports for socket.io back in.
skellock Jul 31, 2016
623ff7b
Guts the reactotron-react-native module. Gladly.
skellock Jul 31, 2016
4d3039b
Adds a logging plugin to the core client.
skellock Jul 31, 2016
67e0974
Hooks up the cli logging functionality.
skellock Jul 31, 2016
b4b7fb7
Adds a demo of sending 3 log types in React Native.
skellock Jul 31, 2016
7944504
Adds a stopwatch utility.
skellock Jul 31, 2016
38aceb9
Updates the plugin interface to accept a config object.
skellock Jul 31, 2016
89da618
Nicer plugins location and a new decorator plugin (#76)
skellock Jul 31, 2016
f37d3f7
Adds benchmark support. (#77)
skellock Jul 31, 2016
43cb9c1
Adds reactotron-redux plugin with action tracking. (#78)
skellock Aug 1, 2016
212f898
Adds a script that throws messages at the server for testing. (#81)
skellock Aug 4, 2016
2ce4a76
Adds state and api responses into core client. (#82)
skellock Aug 4, 2016
7302cd5
Renames addPlugin to use. (#83)
skellock Aug 4, 2016
b5b8083
Adds onCommand support to plugins. (#84)
skellock Aug 4, 2016
35b0680
Adds an apisauce plugin. (#85)
skellock Aug 4, 2016
0e9b442
Adds redux keys & values. (#86)
skellock Aug 4, 2016
6cd09ea
Standardizes the plugin's interface. (#87)
skellock Aug 4, 2016
0f5627f
Fixes the decorator functionality I just removed. (#88)
skellock Aug 4, 2016
5ddf959
Adds redux subscriptions. (#89)
skellock Aug 5, 2016
8b085af
Adds state.action.dispatch support. (#90)
skellock Aug 5, 2016
a857cbd
Updates the version numbers getting ready for 1.0. (#91)
skellock Aug 5, 2016
37dd14f
Bumps React Native deps to 0.31.0. (#92)
skellock Aug 6, 2016
17d420c
Resends the subscribed values when a fresh client connects. (#93)
skellock Aug 6, 2016
67e08cf
Refactors the CLI and moves much goodies into core-server. (#94)
skellock Aug 8, 2016
b12b65e
Client server identification (#95)
skellock Aug 8, 2016
4027206
Adds a react-js client with a create-react-app demo! (#97)
skellock Aug 9, 2016
90e9ae5
Electron Version Base Functionality (#99)
skellock Aug 11, 2016
8ced951
Adds a streaming mode. (#101)
skellock Aug 12, 2016
baa5830
Minimizes the UI footprint. (#102)
skellock Aug 12, 2016
0f82ddf
Adds client intro rendering. (#103)
skellock Aug 12, 2016
f3b7ae1
Adds benchmark rendering. (#104)
skellock Aug 12, 2016
a8b338e
Add a state modal to sample the workflow. (#105)
skellock Aug 12, 2016
bb4ec2f
Simplifies server code, gladly. (#106)
skellock Aug 13, 2016
9a3adc2
Fixes up some React warnings. (#107)
skellock Aug 13, 2016
943082f
Tidying up, delinting, and pruning. (#108)
skellock Aug 13, 2016
843e541
Adds a state values renderer. (#109)
skellock Aug 13, 2016
3171423
Adds pin-to-top, appearance animation, and perf boosts. (#110)
skellock Aug 13, 2016
bb93ffa
Cleans up the layout & lookup of our "tables". (#111)
skellock Aug 13, 2016
4954954
Hoists text to the top prepping for i18n. (#112)
skellock Aug 13, 2016
c647e91
Adds support for state.keys.response. (#113)
skellock Aug 13, 2016
f405063
Adds dispatch support. (#114)
skellock Aug 14, 2016
74075e7
Adds theme support. (#115)
skellock Aug 14, 2016
7977d4d
Adds more guts to the react js demo. (#116)
skellock Aug 14, 2016
d6b2d06
Adds an errors plugin (reactjs) and stack traces. (#117)
skellock Aug 14, 2016
78848cc
Adds collapse/expand mechanism. Tuning colours. (#118)
skellock Aug 15, 2016
dac2007
Adds state watching support. (#119)
skellock Aug 15, 2016
ee66fb8
Adds an app icon. (#120)
skellock Aug 15, 2016
f5deaae
Bumpity bump Lerna. (#121)
skellock Aug 15, 2016
77529bb
CLI fixes (#122)
skellock Aug 15, 2016
565eff1
Ports over secure mode from current Reactotron. (#123)
skellock Aug 15, 2016
4d11d05
Switch the app's dev port out of the way of the demo. (#124)
skellock Aug 16, 2016
0433627
Adds react native stack traces! Reworks the rn demo. (#125)
skellock Aug 16, 2016
a538436
Adds the icon to the footer. (#126)
skellock Aug 16, 2016
806bfbe
Updates the Help menu. (#127)
skellock Aug 16, 2016
c5494af
Addresses issues with package.json and other busy work. (#128)
skellock Aug 16, 2016
01d2a4d
Bumps version to 0.91.0.
skellock Aug 16, 2016
72713d1
v0.92.0
skellock Aug 16, 2016
1f2499f
Add help dialog with CMD + ? (#133)
GantMan Aug 18, 2016
6ede020
Adds an important flag to commands. (#134)
skellock Aug 18, 2016
84f2738
Adds a help icon and pushes a few pixels around. (#135)
skellock Aug 18, 2016
8067787
Adds a codesigning script. (#136)
skellock Aug 18, 2016
a6100b7
Adds a readme with a change log... rough for now.
skellock Aug 18, 2016
9621fec
v0.93.0
skellock Aug 18, 2016
e44af54
Bumps the cli because Lerna didn't. My fault.
skellock Aug 18, 2016
5a12468
Adds an always on top menu item. (#137)
skellock Aug 20, 2016
de81e39
Renders actions with flat data as a table instead of a tree. (#138)
skellock Aug 20, 2016
db216a3
Adds a replay action button. (#139)
skellock Aug 20, 2016
02b5b80
Adds subscriptions to the timeline (#140)
skellock Aug 20, 2016
a99a465
Shows the scrollbar permanently dodging janky reflows. (#141)
skellock Aug 20, 2016
27e4f63
Adds edit & dispatch support. (#142)
skellock Aug 20, 2016
f979dd2
Adds subscription diffs. (#143)
skellock Aug 20, 2016
3f536a8
Cleans up the tree. It's very noisy in there. (#144)
skellock Aug 20, 2016
3b0ae51
Organizes the api response. (#145)
skellock Aug 21, 2016
948afc6
Adds the display command type; for custom messages. (#146)
skellock Aug 21, 2016
a71d2bc
Adds tabs and help. (#147)
skellock Aug 22, 2016
448c442
v0.94.0
skellock Aug 22, 2016
1e1b46d
Updates the changelog.
skellock Aug 22, 2016
0a4384d
Adds a publish script.
skellock Aug 22, 2016
068ff36
Adds stringify-object to the app. Oops.
skellock Aug 22, 2016
56f9add
Changes the text colour on important actions so eyes stop bleeding. (…
skellock Aug 22, 2016
8c1a631
Fixes the codesigning script.
skellock Aug 23, 2016
17a2102
Adds a quick start guide for React JS. (#149)
skellock Aug 23, 2016
bafbc9a
Corrects some hyperlinking newbishness.
skellock Aug 23, 2016
c27ff37
Simplifies the readme in demo-react-js. (#150)
skellock Aug 23, 2016
36aed5b
Adds more substance to the quick start. (#151)
skellock Aug 23, 2016
3b1a1e8
Adds a quick start guide for React Native. (#152)
skellock Aug 23, 2016
4f18dfe
Adds a better readme + gif demos. (#153)
skellock Aug 23, 2016
4271c50
Adds docs for the trackGlobalErrors plugin. (#154)
skellock Aug 23, 2016
e868de2
Fixes a formatting issue with the error docs.
skellock Aug 23, 2016
95cfe32
Fixes and clarifies more with the error docs.
skellock Aug 23, 2016
9a31eac
Adds reactotron-redux documentation. (#155)
skellock Aug 23, 2016
1e7fa4f
Adds reactotron-apisauce documentation. (#156)
skellock Aug 23, 2016
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
The table of contents is too big for display.
Diff view
Diff view
  •  
  •  
  •  
8 changes: 3 additions & 5 deletions .gitignore
Original file line number Diff line number Diff line change
@@ -1,6 +1,4 @@
npm-debug.log
node_modules
docs
.tern-project
.tern-config

lerna-debug.log
npm-debug.log.*
npm-debug.log
56 changes: 56 additions & 0 deletions docs/contributing.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,56 @@
# Contributing

### Getting Started

Clone & switch to the right branch.

```
git clone git@github.com:skellock/reactotron.git
cd reactotron
git checkout next
```

Run the setup script to install the dependencies & run tests.

```
npm run welcome
```


### Code Style

We use [standard.js](https://github.com/feross/standard). It is passive-agressively enforced.
Stern looks will be handed out. For repeat offenders, there WILL be finger wagging.


### Monorepo & Lerna

This is a monorepo: multiple JS packages in 1 git repo.

We use [lerna](https://github.com/lerna/lerna) to help us.


### Funky internal dependencies

`demo-react-native` is a React Native sample app. It depends on
`reactotron-react-native` which in turn depends on both `socket.io` and
`reactotron-core-client`.

Usually npm handles this right?

So why am I typing this?

Well, React Native (<=0.30.0) makes this hard to link to the dependencies
within this repo.

How we current get around this is by:

1. adding `socket.io` to the deps of `demo-react-native` :(
1. copy built versions of `reactotron-core-client` and `reactotron-react-native` manually to `node_modules` :(

Many tears were shed and this is the least shitty solution I could muster.

In the root, you can run `npm copy-internal-deps` to make them copy over.

But since you're copying built dependencies, you'll need to run `npm run build` first
if you're doing this to bring forward changes in those dependency libraries.
Binary file added docs/images/apisauce/apisauce.jpg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added docs/images/quick-start-react-js/hello-1.jpg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added docs/images/quick-start-react-js/hello-2.jpg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added docs/images/quick-start-react-js/installing.jpg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added docs/images/quick-start-react-js/spammy.jpg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added docs/images/quick-start-react-native/hello-1.jpg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added docs/images/quick-start-react-native/hello-2.jpg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added docs/images/quick-start-react-native/spammy.jpg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added docs/images/readme/Reactotron-128.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added docs/images/readme/Reactotron-64.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added docs/images/readme/reactotron-demo-app.gif
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added docs/images/readme/reactotron-demo-cli.gif
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added docs/images/redux/dispatching.jpg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added docs/images/redux/redux-keys-values.jpg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added docs/images/redux/subscriptions.jpg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added docs/images/track-global-errors/stack-trace.jpg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
44 changes: 44 additions & 0 deletions docs/plugin-apisauce.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,44 @@
# reactotron-apisauce

[Apisauce](http://github.com/skellock/apisauce) is a lightweight wrapper around the fantastic [Axios](https://github.com/mzabriskie/axios) networking library.

![API Response](./images/apisauce/apisauce.jpg)

# Installing

`npm i --save-dev reactotron-apisauce`


# Configuring

In the place where you setup your reactotron configuration, you import `reactotron-apisauce` plugin and throw it at Reactotron.

```js
import apisaucePlugin from 'reactotron-apisauce' // <--- import

// then plug it in when you configure Reactotron.

Reactotron
.configure()
.use(apisaucePlugin()) // <-- here we go!!!
.connect()
```

Next, wherever you create your api for you application, bring in Reactotron and attach the monitor to your apisauce instance.

```js
import Reactotron from 'reactotron-react-js'
// import Reactotron from 'reactotron-react-native' // or use this for mobile

// Apisauce has a feature where you can attach a handler to watch
// all requests/response flowing through your api. You can hook this up:
api.addMonitor(Reactotron.apisauce)

// or ...

// if you just wanted to track on 500's
api.addMonitor(response => {
if (response.problem === 'SERVER_ERROR')
Reactotron.apisauce(response)
})
```
88 changes: 88 additions & 0 deletions docs/plugin-redux.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,88 @@
# reactotron-redux

[Redux](http://redux.js.org/) is library for managing global state. It's pretty damn awesome.

And everyone knows when you combine two great things, you get a super-awesome thing. Except for toothpaste & orange juice. Keep those separate.

![Keys and Values](./images/redux/redux-keys-values.jpg)

![Dispatching](./images/redux/dispatching.jpg)

![Subscriptions](./images/redux/subscriptions.jpg)


# Installing

`reactotron-redux` is a plugin which lives in a different npm package. You can install it by typing:

```
npm install --save-dev reactotron-redux
```

# Features

* track when actions are dispatch including timing
* subscribe to changes within the state tree
* pull values out on demand
* view list of keys
* dispatch actions from Reactotron

# Setting Up

This plugin connects Reactotron to Redux via Redux's [Store Enhancer](http://redux.js.org/docs/Glossary.html#store-enhancer) plugin system.

You'll configure where you setup your Redux store. In that file, we'll import both `reactotron-redux` and Reactotron.

```js
import Reactotron from 'reactotron-react-js'
// import Reactotron from 'reactotron-react-native' // if on mobile
import createReactotronEnhancer from 'reactotron-redux'
```

`createReactotronEnhancer` is a function that creates an enhancer ready to inject into Redux. There are 2 parameters.

1. `reactotronInstance` (required) - `Reactotron` itself. It's the object that came out of the import at the top.
2. `options` (optional) - An object providing configuration option to the store enhancer.

Use take the return value and put that into your call to `createStore()`.

**IMPORTANT: Your enhancer should go first if there are multiple enhancers.**

Here's a few examples in action:

```js
const reactotronEnhancer = createReactotronEnhancer(Reactotron)

// where there are no other enhancers
createStore(rootReducer, reactotronEnhancer)

// using Redux's compose() to bring together multiple enhancers
createStore(rootReducer, compose(reactotronEnhancer, applyMiddleware(logger, sagaMiddleware)))
```

See the demos for more examples.

# Options

`createReactotronEnhancer` supports options as the 2nd parameter.

`except` is an array of strings that match actions flowing through Redux.

If you have some actions you'd rather just not see (for example, `redux-saga`)
triggers a little bit of noise, you can suppress them:

```js
createReactotronEnhancer(Reactotron, {
except: ['EFFECT_TRIGGERED', 'EFFECT_RESOLVED', 'EFFECT_REJECTED']
})
```

`isActionImportant` is a way to mark certain actions as "important". Important messages are display in a bolder style that gets your attention within Reactotron.

It is a function that accepts the action and returns a `boolean`. `true` is important. `false` is normal.

```js
createReactotronEnhancer(Reactotron, {
isActionImportant: action => action.type === 'FORMAT_HARD_DRIVE'
})
```
84 changes: 84 additions & 0 deletions docs/plugin-track-global-errors.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,84 @@
# Track Global Errors

Both `reactotron-react-native` and `reactotron-react-js` ship with a plugin called `trackGlobalErrors`.

The goal of this plugin is to ensure all errors will get thrown over to Reactotron for display.

![Installing The App](./images/track-global-errors/stack-trace.jpg)


# Usage

Wherever you setup your Reactotron in your app, you also add the additional plugin on the `import` line.

```js
import Reactotron, { trackGlobalErrors } from 'reactotron-react-native'
```

or

```js
import Reactotron, { trackGlobalErrors } from 'reactotron-react-js'
```

Next, add it as a plugin to Reactotron.

```js
Reactotron
.configure()
.use(trackGlobalErrors()) // <--- here we go!
.connect()
```

One option `trackGlobalErrors()` supports is `veto`. Veto is function that allows you to some frames you would like to leave out of the stack trace passed along.

For example, on React Native, perhaps you'd like to leave off any frames sourced from React Native itself?

```js
Reactotron
.configure()
.use(trackGlobalErrors({
veto: frame => frame.fileName.indexOf('/node_modules/react-native/') >= 0
}))
.connect()
```

`veto` is a function that takes an `object` and returns a `boolean`. `true` = ditch it. `false` = keep it.

The frame object passed into `veto` has these properties.

```
functionName: the name of the function or null if an anonymous function
lineNumber: the line number of the error
columnNumber: the column number of the error
fileName: the name of the file
```

### React JS Source Maps

Source maps for projects in webpack need to have the `devtool` set to `source-map`. On `create-react-app`-based apps, they use `eval`, so this will not work. You will have to switch your development webpack configuration to support this.

You also have the option to not do source map lookups, but still pass errors along by going into offline mode.

```js
Reactotron
.configure()
.use(trackGlobalErrors({
offline: true
}))
.connect()
```


# How It Works Internally

### React JS

It hijacks the browser's `window.onerror` event, immediately calling the previous `onerror`, then attempts to resolve the source of the errors via a source-map lookup. If successful, it throws a message over to Reactotron.


### React Native

On React Native, it hooks `NativeModules.ExceptionsManager.updateExceptionMessage`. This is a message that occurs after the source map lookup for React Native. It always calls the original function so it won't break anything internally. Your Red Box will still show.

Because we're hooking a Facebook internal function, this is a bit fragile. I'll stay on top of any React Native upgrades that might cause problems should the API change.
Loading