@etsoo/toolpad 1.0.32 → 1.0.33

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.
Files changed (4) hide show
  1. package/build/cjs/PageContainer/PageContainer.js +7 -13
  2. package/build/mjs/PageContainer/PageContainer.js +7 -13
  3. package/package.json +1 -1
  4. package/src/PageContainer/PageContainer.tsx +7 -14
package/build/cjs/PageContainer/PageContainer.js CHANGED
@@ -89,18 +89,12 @@ function PageDataContextProvider(props) {
89
89
  }
90
90
  function PageContainerBar(props) {
91
91
  const { slots, slotProps, titleBar } = props;
92
- const { state } = React.useContext(exports.PageDataContext);
93
- const stateRef = React.useRef(state);
94
- if (state !== stateRef.current)
95
- stateRef.current = state;
92
+ const { state, dispatch } = React.useContext(exports.PageDataContext);
96
93
  const activePage = (0, useActivePage_1.useActivePage)();
97
94
  React.useEffect(() => {
98
95
  return () => {
99
96
  // Reset the state when the component unmounts
100
- stateRef.current.breadcrumbs = undefined;
101
- stateRef.current.page = undefined;
102
- stateRef.current.pageHeader = undefined;
103
- stateRef.current.title = undefined;
97
+ dispatch({});
104
98
  };
105
99
  }, [activePage?.sourcePath]);
106
100
  const ToolbarComponent = slots?.toolbar ?? PageContainerToolbar_1.PageContainerToolbar;
@@ -110,17 +104,17 @@ function PageContainerBar(props) {
110
104
  externalSlotProps: slotProps?.toolbar,
111
105
  additionalProps: {}
112
106
  });
113
- const breadcrumbs = stateRef.current.breadcrumbs ?? activePage?.breadcrumbs ?? [];
114
- const title = stateRef.current.title ?? activePage?.title ?? "";
115
- const pageHeader = stateRef.current.pageHeader ?? activePage?.pageHeader ?? null;
107
+ const breadcrumbs = [...(state.breadcrumbs ?? activePage?.breadcrumbs ?? [])];
108
+ const title = state.title ?? activePage?.title ?? "";
109
+ const pageHeader = state.pageHeader ?? activePage?.pageHeader ?? null;
116
110
  // No page header
117
111
  if (pageHeader === false)
118
112
  return undefined;
119
113
  // Custom page header
120
114
  if (pageHeader != null)
121
115
  return pageHeader;
122
- if (stateRef.current.page) {
123
- breadcrumbs.push({ title: stateRef.current.page, path: "#" });
116
+ if (state.page) {
117
+ breadcrumbs.push({ title: state.page, path: "#" });
124
118
  }
125
119
  return ((0, jsx_runtime_1.jsxs)(Stack_1.default, { children: [breadcrumbs && ((0, jsx_runtime_1.jsx)(Breadcrumbs_1.default, { "aria-label": "breadcrumb", children: breadcrumbs.map((item, index) => {
126
120
  return index < breadcrumbs.length - 1 ? ((0, jsx_runtime_1.jsx)(Link_1.default, { component: Link_2.Link, underline: "hover", color: "inherit", href: item.path, children: (0, navigation_1.getItemTitle)(item) }, item.path)) : ((0, jsx_runtime_1.jsx)(Typography_1.default, { color: "text.primary", children: (0, navigation_1.getItemTitle)(item) }, item.path));
package/build/mjs/PageContainer/PageContainer.js CHANGED
@@ -48,18 +48,12 @@ export function PageDataContextProvider(props) {
48
48
  }
49
49
  function PageContainerBar(props) {
50
50
  const { slots, slotProps, titleBar } = props;
51
- const { state } = React.useContext(PageDataContext);
52
- const stateRef = React.useRef(state);
53
- if (state !== stateRef.current)
54
- stateRef.current = state;
51
+ const { state, dispatch } = React.useContext(PageDataContext);
55
52
  const activePage = useActivePage();
56
53
  React.useEffect(() => {
57
54
  return () => {
58
55
  // Reset the state when the component unmounts
59
- stateRef.current.breadcrumbs = undefined;
60
- stateRef.current.page = undefined;
61
- stateRef.current.pageHeader = undefined;
62
- stateRef.current.title = undefined;
56
+ dispatch({});
63
57
  };
64
58
  }, [activePage?.sourcePath]);
65
59
  const ToolbarComponent = slots?.toolbar ?? PageContainerToolbar;
@@ -69,17 +63,17 @@ function PageContainerBar(props) {
69
63
  externalSlotProps: slotProps?.toolbar,
70
64
  additionalProps: {}
71
65
  });
72
- const breadcrumbs = stateRef.current.breadcrumbs ?? activePage?.breadcrumbs ?? [];
73
- const title = stateRef.current.title ?? activePage?.title ?? "";
74
- const pageHeader = stateRef.current.pageHeader ?? activePage?.pageHeader ?? null;
66
+ const breadcrumbs = [...(state.breadcrumbs ?? activePage?.breadcrumbs ?? [])];
67
+ const title = state.title ?? activePage?.title ?? "";
68
+ const pageHeader = state.pageHeader ?? activePage?.pageHeader ?? null;
75
69
  // No page header
76
70
  if (pageHeader === false)
77
71
  return undefined;
78
72
  // Custom page header
79
73
  if (pageHeader != null)
80
74
  return pageHeader;
81
- if (stateRef.current.page) {
82
- breadcrumbs.push({ title: stateRef.current.page, path: "#" });
75
+ if (state.page) {
76
+ breadcrumbs.push({ title: state.page, path: "#" });
83
77
  }
84
78
  return (_jsxs(Stack, { children: [breadcrumbs && (_jsx(Breadcrumbs, { "aria-label": "breadcrumb", children: breadcrumbs.map((item, index) => {
85
79
  return index < breadcrumbs.length - 1 ? (_jsx(Link, { component: ToolpadLink, underline: "hover", color: "inherit", href: item.path, children: getItemTitle(item) }, item.path)) : (_jsx(Typography, { color: "text.primary", children: getItemTitle(item) }, item.path));
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@etsoo/toolpad",
3
- "version": "1.0.32",
3
+ "version": "1.0.33",
4
4
  "author": "ETSOO",
5
5
  "description": "Dashboard framework extention based on Toolpad Core",
6
6
  "main": "build/cjs/index.js",
package/src/PageContainer/PageContainer.tsx CHANGED
@@ -114,19 +114,14 @@ type PageContainerBarProps = {
114
114
  function PageContainerBar(props: PageContainerBarProps) {
115
115
  const { slots, slotProps, titleBar } = props;
116
116
 
117
- const { state } = React.useContext(PageDataContext);
118
- const stateRef = React.useRef(state);
119
- if (state !== stateRef.current) stateRef.current = state;
117
+ const { state, dispatch } = React.useContext(PageDataContext);
120
118
 
121
119
  const activePage = useActivePage();
122
120
 
123
121
  React.useEffect(() => {
124
122
  return () => {
125
123
  // Reset the state when the component unmounts
126
- stateRef.current.breadcrumbs = undefined;
127
- stateRef.current.page = undefined;
128
- stateRef.current.pageHeader = undefined;
129
- stateRef.current.title = undefined;
124
+ dispatch({});
130
125
  };
131
126
  }, [activePage?.sourcePath]);
132
127
 
@@ -138,11 +133,9 @@ function PageContainerBar(props: PageContainerBarProps) {
138
133
  additionalProps: {}
139
134
  });
140
135
 
141
- const breadcrumbs =
142
- stateRef.current.breadcrumbs ?? activePage?.breadcrumbs ?? [];
143
- const title = stateRef.current.title ?? activePage?.title ?? "";
144
- const pageHeader =
145
- stateRef.current.pageHeader ?? activePage?.pageHeader ?? null;
136
+ const breadcrumbs = [...(state.breadcrumbs ?? activePage?.breadcrumbs ?? [])];
137
+ const title = state.title ?? activePage?.title ?? "";
138
+ const pageHeader = state.pageHeader ?? activePage?.pageHeader ?? null;
146
139
 
147
140
  // No page header
148
141
  if (pageHeader === false) return undefined;
@@ -150,8 +143,8 @@ function PageContainerBar(props: PageContainerBarProps) {
150
143
  // Custom page header
151
144
  if (pageHeader != null) return pageHeader;
152
145
 
153
- if (stateRef.current.page) {
154
- breadcrumbs.push({ title: stateRef.current.page, path: "#" });
146
+ if (state.page) {
147
+ breadcrumbs.push({ title: state.page, path: "#" });
155
148
  }
156
149
 
157
150
  return (