UNPKG

2.32 kBJavaScriptView Raw
1const { Plugin } = require('@uppy/core')
2
3/**
4 * Add Redux DevTools support to Uppy
5 *
6 * See https://medium.com/@zalmoxis/redux-devtools-without-redux-or-how-to-have-a-predictable-state-with-any-architecture-61c5f5a7716f
7 * and https://github.com/zalmoxisus/mobx-remotedev/blob/master/src/monitorActions.js
8 */
9module.exports = class ReduxDevTools extends Plugin {
10 static VERSION = require('../package.json').version
11
12 constructor (uppy, opts) {
13 super(uppy, opts)
14 this.type = 'debugger'
15 this.id = this.opts.id || 'ReduxDevTools'
16 this.title = 'Redux DevTools'
17
18 // set default options
19 const defaultOptions = {}
20
21 // merge default options with the ones set by user
22 this.opts = Object.assign({}, defaultOptions, opts)
23
24 this.handleStateChange = this.handleStateChange.bind(this)
25 this.initDevTools = this.initDevTools.bind(this)
26 }
27
28 handleStateChange (prevState, nextState, patch) {
29 this.devTools.send('UPPY_STATE_UPDATE', nextState)
30 }
31
32 initDevTools () {
33 this.devTools = window.devToolsExtension.connect()
34 this.devToolsUnsubscribe = this.devTools.subscribe((message) => {
35 if (message.type === 'DISPATCH') {
36 console.log(message.payload.type)
37
38 // Implement monitors actions
39 switch (message.payload.type) {
40 case 'RESET':
41 this.uppy.reset()
42 return
43 case 'IMPORT_STATE': {
44 const computedStates = message.payload.nextLiftedState.computedStates
45 this.uppy.store.state = Object.assign({}, this.uppy.getState(), computedStates[computedStates.length - 1].state)
46 this.uppy.updateAll(this.uppy.getState())
47 return
48 }
49 case 'JUMP_TO_STATE':
50 case 'JUMP_TO_ACTION':
51 this.uppy.store.state = Object.assign({}, this.uppy.getState(), JSON.parse(message.state))
52 this.uppy.updateAll(this.uppy.getState())
53 }
54 }
55 })
56 }
57
58 install () {
59 this.withDevTools = typeof window !== 'undefined' && window.__REDUX_DEVTOOLS_EXTENSION__
60 if (this.withDevTools) {
61 this.initDevTools()
62 this.uppy.on('state-update', this.handleStateChange)
63 }
64 }
65
66 uninstall () {
67 if (this.withDevTools) {
68 this.devToolsUnsubscribe()
69 this.uppy.off('state-update', this.handleStateUpdate)
70 }
71 }
72}