From ae072b49f1bc16b0f1bd069778b5ad41ef6b2a73 Mon Sep 17 00:00:00 2001 From: darktend Date: Sat, 19 Dec 2020 15:34:35 +0200 Subject: [PATCH] pesistState --- package.json | 282 +++++++++++++-------------- src/es6Remx/connect.js | 15 +- src/es6Remx/index.js | 3 +- src/es6Remx/parsistState.js | 10 + src/integrationTests/persistState.js | 0 5 files changed, 162 insertions(+), 148 deletions(-) create mode 100644 src/es6Remx/parsistState.js create mode 100644 src/integrationTests/persistState.js diff --git a/package.json b/package.json index 3e59f61..3b80751 100644 --- a/package.json +++ b/package.json @@ -1,146 +1,146 @@ { - "name": "remx", - "version": "4.0.0-rc.0", - "description": "Opinionated mobx", - "license": "MIT", - "keywords": [ - "React", - "Native", - "redux", - "mobx", - "Opinionated" - ], - "author": "Daniel Zlotin ", - "publishConfig": { - "registry": "https://registry.npmjs.org/" - }, - "repository": { - "type": "git", - "url": "https://github.com/wix/remx.git" - }, - "bugs": { - "url": "https://github.com/wix/remx/issues" - }, - "homepage": "https://github.com/wix/remx", - "main": "dist/index.js", - "scripts": { - "build": "rm -rf dist && babel src -d dist --ignore='**/*.test.js,__mocks__,integrationTests' && cp src/index.d.ts dist/", - "test": "xo 'src/**' 'scripts/**' && jest --coverage", - "test-watch": "jest --watch", - "release": "node ./scripts/release.js", - "start-watch": "watchman -- trigger ./src remx-copy-dist ./src '**' -- node ../scripts/copyDist.js", - "start": "node ./scripts/copyDist.js", - "clean": "watchman watch-del-all && rm -rf dist", - "snyk-protect": "snyk protect", - "prepublish": "npm run snyk-protect" - }, - "dependencies": { - "hoist-non-react-statics": "^2.5.5", - "lodash.isfunction": "^3.0.9", - "lodash.isobjectlike": "^4.0.0", - "mobx": "^6.0.1", - "mobx-react": "^7.0.0", - "snyk": "^1.192.3" - }, - "devDependencies": { - "babel-cli": "6.x.x", - "babel-core": "6.x.x", - "babel-jest": "22.x.x", - "babel-polyfill": "6.x.x", - "babel-preset-react-native": "4.x.x", - "babel-register": "6.x.x", - "eslint-config-xo": "0.18.x", - "eslint-config-xo-react": "0.15.x", - "eslint-plugin-react": "7.x.x", - "jest": "22.x.x", - "jest-cli": "22.x.x", - "react": "^16.9.0", - "react-dom": "^17.0.1", - "react-native": "0.51.0", - "react-test-renderer": "^16.9.0", - "semver": "5.x.x", - "shell-utils": "1.x.x", - "xo": "0.18.x" - }, - "peerDependencies": { - "react": "x" - }, - "babel": { - "presets": [ - "react-native" + "name": "remx", + "version": "4.0.0-rc.0", + "description": "Opinionated mobx", + "license": "MIT", + "keywords": [ + "React", + "Native", + "redux", + "mobx", + "Opinionated" ], - "retainLines": true - }, - "jest": { - "preset": "react-native", - "roots": [ - "/node_modules/", - "/src/" - ], - "resetModules": true, - "resetMocks": true, - "coverageThreshold": { - "global": { - "statements": 100, - "branches": 100, - "functions": 100, - "lines": 100 - } + "author": "Daniel Zlotin ", + "publishConfig": { + "registry": "https://registry.npmjs.org/" }, - "coveragePathIgnorePatterns": [ - "/node_modules/", - ".test.js" - ], - "coverageReporters": [ - "json", - "lcov", - "text", - "html" - ] - }, - "xo": { - "extends": "xo-react", - "space": true, - "env": [ - "node", - "jest", - "es6" - ], - "rules": { - "unicorn/filename-case": 0, - "unicorn/number-literal-case": 0, - "import/order": 0, - "import/named": 0, - "import/no-unassigned-import": 0, - "react/jsx-tag-spacing": 0, - "react/jsx-sort-props": 0, - "react/jsx-boolean-value": 0, - "react/prop-types": 0, - "react/jsx-no-bind": 0, - "react/jsx-handler-names": 0, - "react/forbid-component-props": 0, - "capitalized-comments": 0, - "max-nested-callbacks": 0, - "no-use-before-define": [ - 2, - { - "functions": false, - "variables": false + "repository": { + "type": "git", + "url": "https://github.com/wix/remx.git" + }, + "bugs": { + "url": "https://github.com/wix/remx/issues" + }, + "homepage": "https://github.com/wix/remx", + "main": "dist/index.js", + "scripts": { + "build": "rm -rf dist && babel src -d dist --ignore='**/*.test.js,__mocks__,integrationTests' && cp src/index.d.ts dist/", + "test": "xo 'src/**' 'scripts/**' && jest --coverage", + "test-watch": "jest --watch", + "release": "node ./scripts/release.js", + "start-watch": "watchman -- trigger ./src remx-copy-dist ./src '**' -- node ../scripts/copyDist.js", + "start": "node ./scripts/copyDist.js", + "clean": "watchman watch-del-all && rm -rf dist", + "snyk-protect": "snyk protect", + "prepublish": "npm run snyk-protect" + }, + "dependencies": { + "hoist-non-react-statics": "^2.5.5", + "lodash.isfunction": "^3.0.9", + "lodash.isobjectlike": "^4.0.0", + "mobx": "^6.0.1", + "mobx-react": "^7.0.0", + "snyk": "^1.192.3" + }, + "devDependencies": { + "babel-cli": "6.x.x", + "babel-core": "6.x.x", + "babel-jest": "23.x.x", + "babel-polyfill": "6.x.x", + "babel-preset-react-native": "4.x.x", + "babel-register": "6.x.x", + "eslint-config-xo": "0.18.x", + "eslint-config-xo-react": "0.15.x", + "eslint-plugin-react": "7.x.x", + "jest": "^23.6.0", + "jest-cli": "^23.6.0", + "react": "^16.9.0", + "react-dom": "^17.0.1", + "react-native": "^0.63.4", + "react-test-renderer": "^16.9.0", + "semver": "5.x.x", + "shell-utils": "1.x.x", + "xo": "0.18.x" + }, + "peerDependencies": { + "react": "x" + }, + "babel": { + "presets": [ + "react-native" + ], + "retainLines": true + }, + "jest": { + "preset": "react-native", + "roots": [ + "/node_modules/", + "/src/" + ], + "resetModules": true, + "resetMocks": true, + "coverageThreshold": { + "global": { + "statements": 100, + "branches": 100, + "functions": 100, + "lines": 100 + } + }, + "coveragePathIgnorePatterns": [ + "/node_modules/", + ".test.js" + ], + "coverageReporters": [ + "json", + "lcov", + "text", + "html" + ] + }, + "xo": { + "extends": "xo-react", + "space": true, + "env": [ + "node", + "jest", + "es6" + ], + "rules": { + "unicorn/filename-case": 0, + "unicorn/number-literal-case": 0, + "import/order": 0, + "import/named": 0, + "import/no-unassigned-import": 0, + "react/jsx-tag-spacing": 0, + "react/jsx-sort-props": 0, + "react/jsx-boolean-value": 0, + "react/prop-types": 0, + "react/jsx-no-bind": 0, + "react/jsx-handler-names": 0, + "react/forbid-component-props": 0, + "capitalized-comments": 0, + "max-nested-callbacks": 0, + "no-use-before-define": [ + 2, + { + "functions": false, + "variables": false + } + ], + "promise/param-names": 0, + "no-return-assign": 0, + "arrow-parens": [ + 2, + "always" + ], + "object-curly-spacing": [ + 2, + "always" + ], + "one-var": 0, + "react/destructuring-assignment": 0 } - ], - "promise/param-names": 0, - "no-return-assign": 0, - "arrow-parens": [ - 2, - "always" - ], - "object-curly-spacing": [ - 2, - "always" - ], - "one-var": 0, - "react/destructuring-assignment": 0 - } - }, - "snyk": true + }, + "snyk": true } diff --git a/src/es6Remx/connect.js b/src/es6Remx/connect.js index 17bad58..2fb122c 100644 --- a/src/es6Remx/connect.js +++ b/src/es6Remx/connect.js @@ -10,9 +10,9 @@ const connect = (mapStateToProps) => { return wrapWithObserverHigherOrderComponent(mapStateToProps); } warnOnceWithCode( - 'connect-without-mapstatetoprops', - '[remx] connect()(component) is deprecated, use observer(component) instead' - ); + 'connect-without-mapstatetoprops', + '[remx] connect()(component) is deprecated, use observer(component) instead' + ); return observer; }; @@ -28,7 +28,7 @@ function observerOnMapStateToProps(InnerComp, mapStateToProps) { class Hoc extends React.Component { constructor(props) { super(props); - // set the component name for the logger: + // set the component name for the logger: this.originalComponentName = InnerComp.name; } render() { @@ -37,10 +37,13 @@ function observerOnMapStateToProps(InnerComp, mapStateToProps) { Logger.endLoggingMapStateToProps(InnerComp.name, propsFromState); const ObservedInnerComp = InnerComp; return ( - + < + ObservedInnerComp {...this.props} + {...propsFromState} + /> ); } - } + } return observer(Hoc); } diff --git a/src/es6Remx/index.js b/src/es6Remx/index.js index 3c6bb91..fa5b6e9 100644 --- a/src/es6Remx/index.js +++ b/src/es6Remx/index.js @@ -2,5 +2,6 @@ module.exports = { ...require('./remx'), connect: require('./connect').connect, observer: require('./observer').observer, - useConnect: require('./useConnect').useConnect + useConnect: require('./useConnect').useConnect, + pesistState: require('./parsistState').parsistState }; diff --git a/src/es6Remx/parsistState.js b/src/es6Remx/parsistState.js new file mode 100644 index 0000000..ed52bd3 --- /dev/null +++ b/src/es6Remx/parsistState.js @@ -0,0 +1,10 @@ +import * as mobx from 'mobx'; + +export default null; +export function parsistState(params) { + const value = global.localStorage.getItem('123'); + params.rehydrate(value); + mobx.reaction(params.dehydrate, (value) => { + global.localStorage.setItem('123', JSON.stringify(value)); + }); +} diff --git a/src/integrationTests/persistState.js b/src/integrationTests/persistState.js new file mode 100644 index 0000000..e69de29