@bundle-stats/ui 4.8.0 → 4.8.1-beta.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/app/app.js +9 -7
- package/lib/app/app.js.map +1 -1
- package/lib/query-state.js +10 -15
- package/lib/query-state.js.map +1 -1
- package/lib-esm/app/app.js +9 -7
- package/lib-esm/app/app.js.map +1 -1
- package/lib-esm/query-state.js +11 -16
- package/lib-esm/query-state.js.map +1 -1
- package/package.json +4 -4
- package/src/app/app.jsx +19 -18
- package/src/query-state.tsx +35 -0
- package/types/query-state.d.ts +6 -2
- package/src/query-state.jsx +0 -41
package/lib/app/app.js
CHANGED
|
@@ -33,24 +33,24 @@ const isEmpty_1 = __importDefault(require("lodash/isEmpty"));
|
|
|
33
33
|
const react_router_dom_1 = require("react-router-dom");
|
|
34
34
|
const utils_1 = require("@bundle-stats/utils");
|
|
35
35
|
const constants_1 = require("../constants");
|
|
36
|
-
const box_1 = require("../layout/box");
|
|
37
|
-
const container_1 = require("../ui/container");
|
|
38
36
|
const bundle_assets_1 = require("../components/bundle-assets");
|
|
39
37
|
const bundle_assets_totals_chart_bars_1 = require("../components/bundle-assets-totals-chart-bars");
|
|
40
|
-
const tabs_1 = require("../ui/tabs");
|
|
41
|
-
const footer_1 = require("../layout/footer");
|
|
42
|
-
const stack_1 = require("../layout/stack");
|
|
43
38
|
const bundle_assets_totals_table_1 = require("../components/bundle-assets-totals-table");
|
|
44
39
|
const bundle_modules_1 = require("../components/bundle-modules");
|
|
45
40
|
const bundle_packages_1 = require("../components/bundle-packages");
|
|
46
41
|
const insights_1 = require("../components/insights");
|
|
42
|
+
const components_1 = require("../components");
|
|
47
43
|
const summary_1 = require("../components/summary");
|
|
48
44
|
const total_size_type_title_1 = require("../components/total-size-type-title");
|
|
45
|
+
const box_1 = require("../layout/box");
|
|
46
|
+
const footer_1 = require("../layout/footer");
|
|
47
|
+
const stack_1 = require("../layout/stack");
|
|
48
|
+
const container_1 = require("../ui/container");
|
|
49
|
+
const tabs_1 = require("../ui/tabs");
|
|
49
50
|
const query_state_1 = require("../query-state");
|
|
50
51
|
const i18n_1 = __importDefault(require("../i18n"));
|
|
51
52
|
const header_1 = require("./header");
|
|
52
53
|
const app_module_css_1 = __importDefault(require("./app.module.css"));
|
|
53
|
-
const components_1 = require("../components");
|
|
54
54
|
const ScrollToTop = () => {
|
|
55
55
|
const { pathname } = (0, react_router_dom_1.useLocation)();
|
|
56
56
|
(0, react_1.useEffect)(() => {
|
|
@@ -86,7 +86,9 @@ const OverviewContent = () => {
|
|
|
86
86
|
return null;
|
|
87
87
|
}
|
|
88
88
|
const res = {
|
|
89
|
-
...(webpackInsights.duplicatePackagesV3 && {
|
|
89
|
+
...(webpackInsights.duplicatePackagesV3 && {
|
|
90
|
+
duplicatePackages: webpackInsights.duplicatePackagesV3,
|
|
91
|
+
}),
|
|
90
92
|
...(webpackInsights.newPackages && { newPackages: webpackInsights.newPackages }),
|
|
91
93
|
};
|
|
92
94
|
if ((0, isEmpty_1.default)(res)) {
|
package/lib/app/app.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"app.js","sourceRoot":"","sources":["../../src/app/app.jsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAA8D;AAC9D,4DAAmC;AACnC,6DAAqC;AACrC,uDAAmF;AACnF,+CAAgD;AAEhD,4CAAoC;AACpC
|
|
1
|
+
{"version":3,"file":"app.js","sourceRoot":"","sources":["../../src/app/app.jsx"],"names":[],"mappings":"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"}
|
package/lib/query-state.js
CHANGED
|
@@ -28,29 +28,24 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
28
28
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
29
29
|
exports.useComponentQueryState = exports.QueryStateProvider = void 0;
|
|
30
30
|
const react_1 = __importStar(require("react"));
|
|
31
|
+
const isEqual_1 = __importDefault(require("lodash/isEqual"));
|
|
31
32
|
const use_query_params_1 = require("use-query-params");
|
|
32
33
|
const react_router_5_1 = require("use-query-params/adapters/react-router-5");
|
|
33
|
-
const
|
|
34
|
-
const
|
|
35
|
-
const merge_1 = __importDefault(require("lodash/merge"));
|
|
36
|
-
const QueryStateProvider = (props) => (react_1.default.createElement(use_query_params_1.QueryParamProvider, { adapter: react_router_5_1.ReactRouter5Adapter, options: {
|
|
37
|
-
searchStringToObject: query_string_1.parse,
|
|
38
|
-
objectToSearchString: query_string_1.stringify,
|
|
39
|
-
}, ...props }));
|
|
34
|
+
const utils_1 = require("@bundle-stats/utils");
|
|
35
|
+
const QueryStateProvider = (props) => (react_1.default.createElement(use_query_params_1.QueryParamProvider, { adapter: react_router_5_1.ReactRouter5Adapter, ...props }));
|
|
40
36
|
exports.QueryStateProvider = QueryStateProvider;
|
|
41
37
|
const useComponentQueryState = (componentName) => {
|
|
42
|
-
const [
|
|
43
|
-
[componentName]:
|
|
38
|
+
const [queryState, setQueryState] = (0, use_query_params_1.useQueryParams)({
|
|
39
|
+
[componentName]: utils_1.COMPONENT_STATE_META[componentName],
|
|
44
40
|
});
|
|
45
|
-
const
|
|
41
|
+
const componentState = queryState[componentName];
|
|
46
42
|
const setState = (0, react_1.useCallback)((newState) => {
|
|
47
|
-
|
|
48
|
-
if ((0, isEqual_1.default)(newComponentState, state)) {
|
|
43
|
+
if ((0, isEqual_1.default)(componentState, newState)) {
|
|
49
44
|
return;
|
|
50
45
|
}
|
|
51
|
-
|
|
52
|
-
}, [
|
|
53
|
-
return [
|
|
46
|
+
setQueryState({ [componentName]: newState });
|
|
47
|
+
}, [componentState]);
|
|
48
|
+
return [componentState, setState];
|
|
54
49
|
};
|
|
55
50
|
exports.useComponentQueryState = useComponentQueryState;
|
|
56
51
|
//# sourceMappingURL=query-state.js.map
|
package/lib/query-state.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"query-state.js","sourceRoot":"","sources":["../src/query-state.
|
|
1
|
+
{"version":3,"file":"query-state.js","sourceRoot":"","sources":["../src/query-state.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAA2C;AAC3C,6DAAqC;AACrC,uDAAsE;AACtE,6EAA+E;AAC/E,+CAA2D;AAMpD,MAAM,kBAAkB,GAAG,CAAC,KAA8B,EAAE,EAAE,CAAC,CACpE,8BAAC,qCAAkB,IAAC,OAAO,EAAE,oCAAmB,KAAM,KAAK,GAAI,CAChE,CAAC;AAFW,QAAA,kBAAkB,sBAE7B;AAEK,MAAM,sBAAsB,GAAG,CAAC,aAAqB,EAAE,EAAE;IAC9D,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,IAAA,iCAAc,EAAC;QACjD,CAAC,aAAa,CAAC,EAAE,4BAAoB,CAAC,aAAa,CAAC;KACrD,CAAC,CAAC;IAEH,MAAM,cAAc,GAAG,UAAU,CAAC,aAAa,CAAC,CAAC;IAEjD,MAAM,QAAQ,GAAG,IAAA,mBAAW,EAC1B,CAAC,QAAiC,EAAE,EAAE;QAEpC,IAAI,IAAA,iBAAO,EAAC,cAAc,EAAE,QAAQ,CAAC,EAAE;YACrC,OAAO;SACR;QAED,aAAa,CAAC,EAAE,CAAC,aAAa,CAAC,EAAE,QAAQ,EAAE,CAAC,CAAC;IAC/C,CAAC,EACD,CAAC,cAAc,CAAC,CACjB,CAAC;IAEF,OAAO,CAAC,cAAc,EAAE,QAAQ,CAAC,CAAC;AACpC,CAAC,CAAC;AApBW,QAAA,sBAAsB,0BAoBjC"}
|
package/lib-esm/app/app.js
CHANGED
|
@@ -4,24 +4,24 @@ import isEmpty from 'lodash/isEmpty';
|
|
|
4
4
|
import { HashRouter, NavLink, Route, Switch, useLocation } from 'react-router-dom';
|
|
5
5
|
import { COMPONENT } from '@bundle-stats/utils';
|
|
6
6
|
import { URLS } from '../constants';
|
|
7
|
-
import { Box } from '../layout/box';
|
|
8
|
-
import { Container } from '../ui/container';
|
|
9
7
|
import { BundleAssets } from '../components/bundle-assets';
|
|
10
8
|
import { BundleAssetsTotalsChartBars } from '../components/bundle-assets-totals-chart-bars';
|
|
11
|
-
import { Tabs } from '../ui/tabs';
|
|
12
|
-
import { Footer } from '../layout/footer';
|
|
13
|
-
import { Stack } from '../layout/stack';
|
|
14
9
|
import { BundleAssetsTotalsTable } from '../components/bundle-assets-totals-table';
|
|
15
10
|
import { BundleModules } from '../components/bundle-modules';
|
|
16
11
|
import { BundlePackages } from '../components/bundle-packages';
|
|
17
12
|
import { Insights } from '../components/insights';
|
|
13
|
+
import { MetricsTableTitle } from '../components';
|
|
18
14
|
import { Summary } from '../components/summary';
|
|
19
15
|
import { TotalSizeTypeTitle } from '../components/total-size-type-title';
|
|
16
|
+
import { Box } from '../layout/box';
|
|
17
|
+
import { Footer } from '../layout/footer';
|
|
18
|
+
import { Stack } from '../layout/stack';
|
|
19
|
+
import { Container } from '../ui/container';
|
|
20
|
+
import { Tabs } from '../ui/tabs';
|
|
20
21
|
import { QueryStateProvider, useComponentQueryState } from '../query-state';
|
|
21
22
|
import I18N from '../i18n';
|
|
22
23
|
import { Header } from './header';
|
|
23
24
|
import css from './app.module.css';
|
|
24
|
-
import { MetricsTableTitle } from '../components';
|
|
25
25
|
const ScrollToTop = () => {
|
|
26
26
|
const { pathname } = useLocation();
|
|
27
27
|
useEffect(() => {
|
|
@@ -58,7 +58,9 @@ const OverviewContent = () => {
|
|
|
58
58
|
return null;
|
|
59
59
|
}
|
|
60
60
|
const res = {
|
|
61
|
-
...(webpackInsights.duplicatePackagesV3 && {
|
|
61
|
+
...(webpackInsights.duplicatePackagesV3 && {
|
|
62
|
+
duplicatePackages: webpackInsights.duplicatePackagesV3,
|
|
63
|
+
}),
|
|
62
64
|
...(webpackInsights.newPackages && { newPackages: webpackInsights.newPackages }),
|
|
63
65
|
};
|
|
64
66
|
if (isEmpty(res)) {
|
package/lib-esm/app/app.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"app.js","sourceRoot":"","sources":["../../src/app/app.jsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,SAAS,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AAC9D,OAAO,SAAS,MAAM,YAAY,CAAC;AACnC,OAAO,OAAO,MAAM,gBAAgB,CAAC;AACrC,OAAO,EAAE,UAAU,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;AACnF,OAAO,EAAE,SAAS,EAAE,MAAM,qBAAqB,CAAC;AAEhD,OAAO,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;AACpC,OAAO,EAAE,
|
|
1
|
+
{"version":3,"file":"app.js","sourceRoot":"","sources":["../../src/app/app.jsx"],"names":[],"mappings":"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"}
|
package/lib-esm/query-state.js
CHANGED
|
@@ -1,25 +1,20 @@
|
|
|
1
1
|
import React, { useCallback } from 'react';
|
|
2
|
-
import { JsonParam, QueryParamProvider, useQueryParams } from 'use-query-params';
|
|
3
|
-
import { ReactRouter5Adapter } from 'use-query-params/adapters/react-router-5';
|
|
4
|
-
import { parse, stringify } from 'query-string';
|
|
5
2
|
import isEqual from 'lodash/isEqual';
|
|
6
|
-
import
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
}, ...props }));
|
|
3
|
+
import { QueryParamProvider, useQueryParams } from 'use-query-params';
|
|
4
|
+
import { ReactRouter5Adapter } from 'use-query-params/adapters/react-router-5';
|
|
5
|
+
import { COMPONENT_STATE_META } from '@bundle-stats/utils';
|
|
6
|
+
export const QueryStateProvider = (props) => (React.createElement(QueryParamProvider, { adapter: ReactRouter5Adapter, ...props }));
|
|
11
7
|
export const useComponentQueryState = (componentName) => {
|
|
12
|
-
const [
|
|
13
|
-
[componentName]:
|
|
8
|
+
const [queryState, setQueryState] = useQueryParams({
|
|
9
|
+
[componentName]: COMPONENT_STATE_META[componentName],
|
|
14
10
|
});
|
|
15
|
-
const
|
|
11
|
+
const componentState = queryState[componentName];
|
|
16
12
|
const setState = useCallback((newState) => {
|
|
17
|
-
|
|
18
|
-
if (isEqual(newComponentState, state)) {
|
|
13
|
+
if (isEqual(componentState, newState)) {
|
|
19
14
|
return;
|
|
20
15
|
}
|
|
21
|
-
|
|
22
|
-
}, [
|
|
23
|
-
return [
|
|
16
|
+
setQueryState({ [componentName]: newState });
|
|
17
|
+
}, [componentState]);
|
|
18
|
+
return [componentState, setState];
|
|
24
19
|
};
|
|
25
20
|
//# sourceMappingURL=query-state.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"query-state.js","sourceRoot":"","sources":["../src/query-state.
|
|
1
|
+
{"version":3,"file":"query-state.js","sourceRoot":"","sources":["../src/query-state.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,WAAW,EAAE,MAAM,OAAO,CAAC;AAC3C,OAAO,OAAO,MAAM,gBAAgB,CAAC;AACrC,OAAO,EAAE,kBAAkB,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AACtE,OAAO,EAAE,mBAAmB,EAAE,MAAM,0CAA0C,CAAC;AAC/E,OAAO,EAAE,oBAAoB,EAAE,MAAM,qBAAqB,CAAC;AAM3D,MAAM,CAAC,MAAM,kBAAkB,GAAG,CAAC,KAA8B,EAAE,EAAE,CAAC,CACpE,oBAAC,kBAAkB,IAAC,OAAO,EAAE,mBAAmB,KAAM,KAAK,GAAI,CAChE,CAAC;AAEF,MAAM,CAAC,MAAM,sBAAsB,GAAG,CAAC,aAAqB,EAAE,EAAE;IAC9D,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,cAAc,CAAC;QACjD,CAAC,aAAa,CAAC,EAAE,oBAAoB,CAAC,aAAa,CAAC;KACrD,CAAC,CAAC;IAEH,MAAM,cAAc,GAAG,UAAU,CAAC,aAAa,CAAC,CAAC;IAEjD,MAAM,QAAQ,GAAG,WAAW,CAC1B,CAAC,QAAiC,EAAE,EAAE;QAEpC,IAAI,OAAO,CAAC,cAAc,EAAE,QAAQ,CAAC,EAAE;YACrC,OAAO;SACR;QAED,aAAa,CAAC,EAAE,CAAC,aAAa,CAAC,EAAE,QAAQ,EAAE,CAAC,CAAC;IAC/C,CAAC,EACD,CAAC,cAAc,CAAC,CACjB,CAAC;IAEF,OAAO,CAAC,cAAc,EAAE,QAAQ,CAAC,CAAC;AACpC,CAAC,CAAC"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@bundle-stats/ui",
|
|
3
|
-
"version": "4.8.0",
|
|
3
|
+
"version": "4.8.1-beta.0",
|
|
4
4
|
"description": "UI components for BundleStats projects.",
|
|
5
5
|
"main": "lib/index.js",
|
|
6
6
|
"module": "lib-esm/index.js",
|
|
@@ -44,6 +44,7 @@
|
|
|
44
44
|
"@storybook/react": "7.5.3",
|
|
45
45
|
"@storybook/react-webpack5": "7.5.3",
|
|
46
46
|
"@types/react": "18.2.37",
|
|
47
|
+
"@types/react-router-dom": "5.3.3",
|
|
47
48
|
"babel-plugin-require-context-hook": "1.0.0",
|
|
48
49
|
"classnames": "2.3.2",
|
|
49
50
|
"colormap": "2.3.2",
|
|
@@ -72,11 +73,10 @@
|
|
|
72
73
|
"react-router-dom": "^5.0.0"
|
|
73
74
|
},
|
|
74
75
|
"dependencies": {
|
|
75
|
-
"@bundle-stats/utils": "
|
|
76
|
+
"@bundle-stats/utils": "4.8.1-beta.0",
|
|
76
77
|
"ariakit": "2.0.0-next.44",
|
|
77
78
|
"modern-css-reset": "1.4.0",
|
|
78
|
-
"query-string": "7.1.3",
|
|
79
79
|
"use-query-params": "2.2.1"
|
|
80
80
|
},
|
|
81
|
-
"gitHead": "
|
|
81
|
+
"gitHead": "5edfa58529d1f99b46e53ca19bc5cd5d530dc76b"
|
|
82
82
|
}
|
package/src/app/app.jsx
CHANGED
|
@@ -5,24 +5,24 @@ import { HashRouter, NavLink, Route, Switch, useLocation } from 'react-router-do
|
|
|
5
5
|
import { COMPONENT } from '@bundle-stats/utils';
|
|
6
6
|
|
|
7
7
|
import { URLS } from '../constants';
|
|
8
|
-
import { Box } from '../layout/box';
|
|
9
|
-
import { Container } from '../ui/container';
|
|
10
8
|
import { BundleAssets } from '../components/bundle-assets';
|
|
11
9
|
import { BundleAssetsTotalsChartBars } from '../components/bundle-assets-totals-chart-bars';
|
|
12
|
-
import { Tabs } from '../ui/tabs';
|
|
13
|
-
import { Footer } from '../layout/footer';
|
|
14
|
-
import { Stack } from '../layout/stack';
|
|
15
10
|
import { BundleAssetsTotalsTable } from '../components/bundle-assets-totals-table';
|
|
16
11
|
import { BundleModules } from '../components/bundle-modules';
|
|
17
12
|
import { BundlePackages } from '../components/bundle-packages';
|
|
18
13
|
import { Insights } from '../components/insights';
|
|
14
|
+
import { MetricsTableTitle } from '../components';
|
|
19
15
|
import { Summary } from '../components/summary';
|
|
20
16
|
import { TotalSizeTypeTitle } from '../components/total-size-type-title';
|
|
17
|
+
import { Box } from '../layout/box';
|
|
18
|
+
import { Footer } from '../layout/footer';
|
|
19
|
+
import { Stack } from '../layout/stack';
|
|
20
|
+
import { Container } from '../ui/container';
|
|
21
|
+
import { Tabs } from '../ui/tabs';
|
|
21
22
|
import { QueryStateProvider, useComponentQueryState } from '../query-state';
|
|
22
23
|
import I18N from '../i18n';
|
|
23
24
|
import { Header } from './header';
|
|
24
25
|
import css from './app.module.css';
|
|
25
|
-
import { MetricsTableTitle } from '../components';
|
|
26
26
|
|
|
27
27
|
const ScrollToTop = () => {
|
|
28
28
|
const { pathname } = useLocation();
|
|
@@ -69,11 +69,13 @@ const OverviewContent = () => {
|
|
|
69
69
|
const webpackInsights = jobs?.[0]?.insights?.webpack;
|
|
70
70
|
|
|
71
71
|
if (!webpackInsights) {
|
|
72
|
-
return null
|
|
72
|
+
return null;
|
|
73
73
|
}
|
|
74
74
|
|
|
75
75
|
const res = {
|
|
76
|
-
...(webpackInsights.duplicatePackagesV3 && {
|
|
76
|
+
...(webpackInsights.duplicatePackagesV3 && {
|
|
77
|
+
duplicatePackages: webpackInsights.duplicatePackagesV3,
|
|
78
|
+
}),
|
|
77
79
|
...(webpackInsights.newPackages && { newPackages: webpackInsights.newPackages }),
|
|
78
80
|
};
|
|
79
81
|
|
|
@@ -84,7 +86,6 @@ const OverviewContent = () => {
|
|
|
84
86
|
return res;
|
|
85
87
|
}, [jobs]);
|
|
86
88
|
|
|
87
|
-
|
|
88
89
|
return (
|
|
89
90
|
<Stack space="medium">
|
|
90
91
|
{insightsByName && (
|
|
@@ -114,9 +115,9 @@ const AssetsContent = () => {
|
|
|
114
115
|
|
|
115
116
|
return (
|
|
116
117
|
<Container>
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
118
|
+
<Box outline>
|
|
119
|
+
<BundleAssets jobs={jobs} setState={bundleStatsSetState} {...bundleStatsState} />
|
|
120
|
+
</Box>
|
|
120
121
|
</Container>
|
|
121
122
|
);
|
|
122
123
|
};
|
|
@@ -129,9 +130,9 @@ const ModulesContent = () => {
|
|
|
129
130
|
|
|
130
131
|
return (
|
|
131
132
|
<Container>
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
133
|
+
<Box outline>
|
|
134
|
+
<BundleModules jobs={jobs} setState={bundleModulesSetState} {...bundleModulesState} />
|
|
135
|
+
</Box>
|
|
135
136
|
</Container>
|
|
136
137
|
);
|
|
137
138
|
};
|
|
@@ -144,9 +145,9 @@ const PackagesContent = () => {
|
|
|
144
145
|
|
|
145
146
|
return (
|
|
146
147
|
<Container>
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
148
|
+
<Box outline>
|
|
149
|
+
<BundlePackages jobs={jobs} {...bundlePackagesState} setState={bundlePackagesSetState} />
|
|
150
|
+
</Box>
|
|
150
151
|
</Container>
|
|
151
152
|
);
|
|
152
153
|
};
|
|
@@ -0,0 +1,35 @@
|
|
|
1
|
+
import React, { useCallback } from 'react';
|
|
2
|
+
import isEqual from 'lodash/isEqual';
|
|
3
|
+
import { QueryParamProvider, useQueryParams } from 'use-query-params';
|
|
4
|
+
import { ReactRouter5Adapter } from 'use-query-params/adapters/react-router-5';
|
|
5
|
+
import { COMPONENT_STATE_META } from '@bundle-stats/utils';
|
|
6
|
+
|
|
7
|
+
interface QueryStateProviderProps {
|
|
8
|
+
children: React.ReactNode;
|
|
9
|
+
}
|
|
10
|
+
|
|
11
|
+
export const QueryStateProvider = (props: QueryStateProviderProps) => (
|
|
12
|
+
<QueryParamProvider adapter={ReactRouter5Adapter} {...props} />
|
|
13
|
+
);
|
|
14
|
+
|
|
15
|
+
export const useComponentQueryState = (componentName: string) => {
|
|
16
|
+
const [queryState, setQueryState] = useQueryParams({
|
|
17
|
+
[componentName]: COMPONENT_STATE_META[componentName],
|
|
18
|
+
});
|
|
19
|
+
|
|
20
|
+
const componentState = queryState[componentName];
|
|
21
|
+
|
|
22
|
+
const setState = useCallback(
|
|
23
|
+
(newState: Record<string, unknown>) => {
|
|
24
|
+
// Deep check to prevent unnecessary state changes
|
|
25
|
+
if (isEqual(componentState, newState)) {
|
|
26
|
+
return;
|
|
27
|
+
}
|
|
28
|
+
|
|
29
|
+
setQueryState({ [componentName]: newState });
|
|
30
|
+
},
|
|
31
|
+
[componentState],
|
|
32
|
+
);
|
|
33
|
+
|
|
34
|
+
return [componentState, setState];
|
|
35
|
+
};
|
package/types/query-state.d.ts
CHANGED
|
@@ -1,3 +1,7 @@
|
|
|
1
|
-
export function QueryStateProvider(props: any): React.JSX.Element;
|
|
2
|
-
export function useComponentQueryState(componentName: any): any[];
|
|
3
1
|
import React from 'react';
|
|
2
|
+
interface QueryStateProviderProps {
|
|
3
|
+
children: React.ReactNode;
|
|
4
|
+
}
|
|
5
|
+
export declare const QueryStateProvider: (props: QueryStateProviderProps) => React.JSX.Element;
|
|
6
|
+
export declare const useComponentQueryState: (componentName: string) => any[];
|
|
7
|
+
export {};
|
package/src/query-state.jsx
DELETED
|
@@ -1,41 +0,0 @@
|
|
|
1
|
-
import React, { useCallback } from 'react';
|
|
2
|
-
import { JsonParam, QueryParamProvider, useQueryParams } from 'use-query-params';
|
|
3
|
-
import { ReactRouter5Adapter } from 'use-query-params/adapters/react-router-5'
|
|
4
|
-
import { parse, stringify } from 'query-string'
|
|
5
|
-
import isEqual from 'lodash/isEqual';
|
|
6
|
-
import merge from 'lodash/merge';
|
|
7
|
-
|
|
8
|
-
export const QueryStateProvider = (props) => (
|
|
9
|
-
<QueryParamProvider
|
|
10
|
-
adapter={ReactRouter5Adapter}
|
|
11
|
-
options={{
|
|
12
|
-
searchStringToObject: parse,
|
|
13
|
-
objectToSearchString: stringify,
|
|
14
|
-
}}
|
|
15
|
-
{...props}
|
|
16
|
-
/>
|
|
17
|
-
);
|
|
18
|
-
|
|
19
|
-
export const useComponentQueryState = (componentName) => {
|
|
20
|
-
const [search, setSearch] = useQueryParams({
|
|
21
|
-
[componentName]: JsonParam,
|
|
22
|
-
});
|
|
23
|
-
|
|
24
|
-
const state = search[componentName];
|
|
25
|
-
|
|
26
|
-
const setState = useCallback(
|
|
27
|
-
(newState) => {
|
|
28
|
-
const newComponentState = merge({}, state, newState);
|
|
29
|
-
|
|
30
|
-
// Deep check to prevent unnecessary state changes
|
|
31
|
-
if (isEqual(newComponentState, state)) {
|
|
32
|
-
return;
|
|
33
|
-
}
|
|
34
|
-
|
|
35
|
-
setSearch({ [componentName]: newComponentState });
|
|
36
|
-
},
|
|
37
|
-
[state],
|
|
38
|
-
);
|
|
39
|
-
|
|
40
|
-
return [state, setState];
|
|
41
|
-
};
|