@blaze-cms/nextjs-tools 0.146.0-node18-tooltips.21 → 0.146.0-node18-tooltips.23
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/CHANGELOG.md +16 -0
- package/lib/components/DebugSidebar/DebugSidebar.js +140 -0
- package/lib/components/DebugSidebar/DebugSidebar.js.map +1 -0
- package/lib/components/DebugSidebar/DebugSidebarRender.js +84 -0
- package/lib/components/DebugSidebar/DebugSidebarRender.js.map +1 -0
- package/lib/components/DebugSidebar/index.js +2 -155
- package/lib/components/DebugSidebar/index.js.map +1 -1
- package/lib/helpers/index.js +7 -0
- package/lib/helpers/index.js.map +1 -1
- package/lib-es/components/DebugSidebar/DebugSidebar.js +107 -0
- package/lib-es/components/DebugSidebar/DebugSidebar.js.map +1 -0
- package/lib-es/components/DebugSidebar/DebugSidebarRender.js +57 -0
- package/lib-es/components/DebugSidebar/DebugSidebarRender.js.map +1 -0
- package/lib-es/components/DebugSidebar/index.js +2 -125
- package/lib-es/components/DebugSidebar/index.js.map +1 -1
- package/lib-es/helpers/index.js +2 -1
- package/lib-es/helpers/index.js.map +1 -1
- package/package.json +9 -8
- package/src/components/DebugSidebar/DebugSidebar.js +110 -0
- package/src/components/DebugSidebar/DebugSidebarRender.js +67 -0
- package/src/components/DebugSidebar/index.js +2 -136
- package/src/helpers/index.js +2 -0
- package/tests/unit/src/components/DebugSidebar/DebugSidebar.test.js +0 -4
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"DebugSidebar.js","names":["React","useState","createPortal","PropTypes","classnames","IoCloseOutline","useRouter","MdKeyboardArrowLeft","MdEdit","Link","Switches","buildAdminHref","setBlazeDebug","DEBUG_LOGO","BLAZE_DEBUG","DebugSidebar","itemEntity","itemId","updatedDebugOptions","debugMode","setIsDebugMode","router","isEditorMode","setIsEditorMode","isOpen","setIsOpen","divClass","toggleEditorMode","editorModeEnabled","adminHref","href","closeDebug","window","blaze","debug","pathname","search","asPath","split","params","URLSearchParams","delete","newUrl","toString","push","shallow","createElement","className","target","src","SRC","alt","ALT","role","onClick","onChange","name","icon","alignVertically","returnBoolean","onText","offText","options","id","checked","document","body","propTypes","func","isRequired","string","bool","defaultProps"],"sources":["../../../src/components/DebugSidebar/DebugSidebar.js"],"sourcesContent":["import React, { useState } from 'react';\nimport { createPortal } from 'react-dom';\nimport PropTypes from 'prop-types';\nimport classnames from 'classnames';\nimport { IoCloseOutline } from 'react-icons/io5';\nimport { useRouter } from 'next/router';\nimport { MdKeyboardArrowLeft, MdEdit } from 'react-icons/md';\nimport { Link } from '@blaze-cms/nextjs-components';\nimport Switches from '@blaze-react/switches';\nimport { buildAdminHref, setBlazeDebug } from '../../helpers';\nimport { DEBUG_LOGO, BLAZE_DEBUG } from '../../constants';\n\nconst DebugSidebar = ({ itemEntity, itemId, updatedDebugOptions, debugMode, setIsDebugMode }) => {\n const router = useRouter();\n const [isEditorMode, setIsEditorMode] = useState(false);\n const [isOpen, setIsOpen] = useState(true);\n\n const divClass = classnames('debug-sidebar', {\n 'debug-sidebar--open': isOpen,\n 'debug-sidebar--close': !isOpen\n });\n\n const toggleEditorMode = () => {\n // todo: persist editor mode in local storage\n // const currentEditorMode = getFromLocal(BLAZE_PB_EDITOR_MODE);\n // if (currentEditorMode) {\n // window.localStorage.removeItem(BLAZE_PB_EDITOR_MODE);\n // } else {\n // window.localStorage.setItem(BLAZE_PB_EDITOR_MODE, true);\n // }\n updatedDebugOptions('editorModeEnabled', !isEditorMode);\n updatedDebugOptions({\n editorModeEnabled: !isEditorMode,\n adminHref: buildAdminHref({ itemEntity, itemId })\n });\n setIsEditorMode(!isEditorMode);\n };\n\n const href = buildAdminHref({ itemEntity, itemId });\n\n const closeDebug = () => {\n setBlazeDebug(setIsDebugMode);\n window.blaze.debug();\n\n const [pathname, search = ''] = router.asPath.split('?');\n const params = new URLSearchParams(search);\n params.delete(BLAZE_DEBUG);\n const newUrl = params.toString() ? `${pathname}?${params.toString()}` : pathname;\n\n router.push('/Resolver', newUrl, {\n shallow: true\n });\n };\n\n return createPortal(\n <div className={divClass} data-testid=\"debug-sidebar\">\n <Link href={href} target=\"_blank\">\n <img src={DEBUG_LOGO.SRC} alt={DEBUG_LOGO.ALT} />\n </Link>\n <div\n role=\"button\"\n className=\"debug-sidebar__button debug-sidebar__button--close\"\n data-testid=\"debug-sidebar-close\"\n aria-label=\"Close debug sidebar\"\n onClick={closeDebug}>\n <IoCloseOutline />\n </div>\n <Switches\n onChange={toggleEditorMode}\n name=\"debug-sidebar-switch\"\n icon={<MdEdit />}\n alignVertically\n returnBoolean\n onText=\"ON\"\n offText=\"OFF\"\n options={{\n id: 'debug-sidebar-switch',\n checked: isEditorMode\n }}\n />\n <div\n role=\"button\"\n className=\"debug-sidebar__button open\"\n data-testid=\"debug-sidebar-button\"\n id=\"debug-sidebar-button\"\n onClick={() => setIsOpen(!isOpen)}>\n <i>\n <MdKeyboardArrowLeft />\n </i>\n </div>\n </div>,\n document.body\n );\n};\n\nDebugSidebar.propTypes = {\n updatedDebugOptions: PropTypes.func.isRequired,\n itemEntity: PropTypes.string,\n itemId: PropTypes.string,\n debugMode: PropTypes.bool,\n setIsDebugMode: PropTypes.func.isRequired\n};\n\nDebugSidebar.defaultProps = {\n itemEntity: '',\n itemId: '',\n debugMode: false\n};\n\nexport default DebugSidebar;\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -0,0 +1,57 @@
|
|
|
1
|
+
import React, { useState, useEffect } from 'react';
|
|
2
|
+
import dynamic from 'next/dynamic';
|
|
3
|
+
import PropTypes from 'prop-types';
|
|
4
|
+
import { useRouter } from 'next/router';
|
|
5
|
+
import { setBlazeDebug, getFromLocal } from '../../helpers';
|
|
6
|
+
import { BLAZE_DEBUG } from '../../constants';
|
|
7
|
+
const DebugSidebar = dynamic(() => import('./DebugSidebar'));
|
|
8
|
+
const DebugSidebarRender = ({
|
|
9
|
+
itemEntity,
|
|
10
|
+
itemId,
|
|
11
|
+
updatedDebugOptions,
|
|
12
|
+
debugMode
|
|
13
|
+
}) => {
|
|
14
|
+
const [isDebugMode, setIsDebugMode] = useState(debugMode);
|
|
15
|
+
const router = useRouter();
|
|
16
|
+
useEffect(() => {
|
|
17
|
+
const currentDebugValue = getFromLocal(BLAZE_DEBUG);
|
|
18
|
+
setIsDebugMode(currentDebugValue);
|
|
19
|
+
setBlazeDebug(setIsDebugMode);
|
|
20
|
+
}, []);
|
|
21
|
+
useEffect(() => {
|
|
22
|
+
const handleRouteChange = url => {
|
|
23
|
+
const hasDebug = url.includes(`${BLAZE_DEBUG}=1`);
|
|
24
|
+
if (hasDebug) {
|
|
25
|
+
setBlazeDebug(setIsDebugMode);
|
|
26
|
+
}
|
|
27
|
+
};
|
|
28
|
+
if (router.asPath.includes(`${BLAZE_DEBUG}=1`)) {
|
|
29
|
+
handleRouteChange(router.asPath);
|
|
30
|
+
}
|
|
31
|
+
router.events.on('routeChangeComplete', handleRouteChange);
|
|
32
|
+
return () => {
|
|
33
|
+
router.events.off('routeChangeComplete', handleRouteChange);
|
|
34
|
+
};
|
|
35
|
+
}, [router.events, router.asPath]);
|
|
36
|
+
if (!isDebugMode) return null;
|
|
37
|
+
return /*#__PURE__*/React.createElement(DebugSidebar, {
|
|
38
|
+
itemEntity: itemEntity,
|
|
39
|
+
itemId: itemId,
|
|
40
|
+
updatedDebugOptions: updatedDebugOptions,
|
|
41
|
+
debugMode: debugMode,
|
|
42
|
+
setIsDebugMode: setIsDebugMode
|
|
43
|
+
});
|
|
44
|
+
};
|
|
45
|
+
DebugSidebarRender.propTypes = {
|
|
46
|
+
updatedDebugOptions: PropTypes.func.isRequired,
|
|
47
|
+
itemEntity: PropTypes.string,
|
|
48
|
+
itemId: PropTypes.string,
|
|
49
|
+
debugMode: PropTypes.bool
|
|
50
|
+
};
|
|
51
|
+
DebugSidebarRender.defaultProps = {
|
|
52
|
+
itemEntity: '',
|
|
53
|
+
itemId: '',
|
|
54
|
+
debugMode: false
|
|
55
|
+
};
|
|
56
|
+
export default DebugSidebarRender;
|
|
57
|
+
//# sourceMappingURL=DebugSidebarRender.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"DebugSidebarRender.js","names":["React","useState","useEffect","dynamic","PropTypes","useRouter","setBlazeDebug","getFromLocal","BLAZE_DEBUG","DebugSidebar","DebugSidebarRender","itemEntity","itemId","updatedDebugOptions","debugMode","isDebugMode","setIsDebugMode","router","currentDebugValue","handleRouteChange","url","hasDebug","includes","asPath","events","on","off","createElement","propTypes","func","isRequired","string","bool","defaultProps"],"sources":["../../../src/components/DebugSidebar/DebugSidebarRender.js"],"sourcesContent":["import React, { useState, useEffect } from 'react';\nimport dynamic from 'next/dynamic';\nimport PropTypes from 'prop-types';\nimport { useRouter } from 'next/router';\nimport { setBlazeDebug, getFromLocal } from '../../helpers';\nimport { BLAZE_DEBUG } from '../../constants';\n\nconst DebugSidebar = dynamic(() => import('./DebugSidebar'));\n\nconst DebugSidebarRender = ({ itemEntity, itemId, updatedDebugOptions, debugMode }) => {\n const [isDebugMode, setIsDebugMode] = useState(debugMode);\n const router = useRouter();\n\n useEffect(() => {\n const currentDebugValue = getFromLocal(BLAZE_DEBUG);\n setIsDebugMode(currentDebugValue);\n setBlazeDebug(setIsDebugMode);\n }, []);\n\n useEffect(\n () => {\n const handleRouteChange = url => {\n const hasDebug = url.includes(`${BLAZE_DEBUG}=1`);\n if (hasDebug) {\n setBlazeDebug(setIsDebugMode);\n }\n };\n\n if (router.asPath.includes(`${BLAZE_DEBUG}=1`)) {\n handleRouteChange(router.asPath);\n }\n\n router.events.on('routeChangeComplete', handleRouteChange);\n return () => {\n router.events.off('routeChangeComplete', handleRouteChange);\n };\n },\n [router.events, router.asPath]\n );\n\n if (!isDebugMode) return null;\n\n return (\n <DebugSidebar\n itemEntity={itemEntity}\n itemId={itemId}\n updatedDebugOptions={updatedDebugOptions}\n debugMode={debugMode}\n setIsDebugMode={setIsDebugMode}\n />\n );\n};\n\nDebugSidebarRender.propTypes = {\n updatedDebugOptions: PropTypes.func.isRequired,\n itemEntity: PropTypes.string,\n itemId: PropTypes.string,\n debugMode: PropTypes.bool\n};\n\nDebugSidebarRender.defaultProps = {\n itemEntity: '',\n itemId: '',\n debugMode: false\n};\n\nexport default DebugSidebarRender;\n"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,QAAQ,EAAEC,SAAS,QAAQ,OAAO;AAClD,OAAOC,OAAO,MAAM,cAAc;AAClC,OAAOC,SAAS,MAAM,YAAY;AAClC,SAASC,SAAS,QAAQ,aAAa;AACvC,SAASC,aAAa,EAAEC,YAAY,QAAQ,eAAe;AAC3D,SAASC,WAAW,QAAQ,iBAAiB;AAE7C,MAAMC,YAAY,GAAGN,OAAO,CAAC,MAAM,MAAM,CAAC,gBAAgB,CAAC,CAAC;AAE5D,MAAMO,kBAAkB,GAAGA,CAAC;EAAEC,UAAU;EAAEC,MAAM;EAAEC,mBAAmB;EAAEC;AAAU,CAAC,KAAK;EACrF,MAAM,CAACC,WAAW,EAAEC,cAAc,CAAC,GAAGf,QAAQ,CAACa,SAAS,CAAC;EACzD,MAAMG,MAAM,GAAGZ,SAAS,CAAC,CAAC;EAE1BH,SAAS,CAAC,MAAM;IACd,MAAMgB,iBAAiB,GAAGX,YAAY,CAACC,WAAW,CAAC;IACnDQ,cAAc,CAACE,iBAAiB,CAAC;IACjCZ,aAAa,CAACU,cAAc,CAAC;EAC/B,CAAC,EAAE,EAAE,CAAC;EAENd,SAAS,CACP,MAAM;IACJ,MAAMiB,iBAAiB,GAAGC,GAAG,IAAI;MAC/B,MAAMC,QAAQ,GAAGD,GAAG,CAACE,QAAQ,CAAC,GAAGd,WAAW,IAAI,CAAC;MACjD,IAAIa,QAAQ,EAAE;QACZf,aAAa,CAACU,cAAc,CAAC;MAC/B;IACF,CAAC;IAED,IAAIC,MAAM,CAACM,MAAM,CAACD,QAAQ,CAAC,GAAGd,WAAW,IAAI,CAAC,EAAE;MAC9CW,iBAAiB,CAACF,MAAM,CAACM,MAAM,CAAC;IAClC;IAEAN,MAAM,CAACO,MAAM,CAACC,EAAE,CAAC,qBAAqB,EAAEN,iBAAiB,CAAC;IAC1D,OAAO,MAAM;MACXF,MAAM,CAACO,MAAM,CAACE,GAAG,CAAC,qBAAqB,EAAEP,iBAAiB,CAAC;IAC7D,CAAC;EACH,CAAC,EACD,CAACF,MAAM,CAACO,MAAM,EAAEP,MAAM,CAACM,MAAM,CAC/B,CAAC;EAED,IAAI,CAACR,WAAW,EAAE,OAAO,IAAI;EAE7B,oBACEf,KAAA,CAAA2B,aAAA,CAAClB,YAAY;IACXE,UAAU,EAAEA,UAAW;IACvBC,MAAM,EAAEA,MAAO;IACfC,mBAAmB,EAAEA,mBAAoB;IACzCC,SAAS,EAAEA,SAAU;IACrBE,cAAc,EAAEA;EAAe,CAChC,CAAC;AAEN,CAAC;AAEDN,kBAAkB,CAACkB,SAAS,GAAG;EAC7Bf,mBAAmB,EAAET,SAAS,CAACyB,IAAI,CAACC,UAAU;EAC9CnB,UAAU,EAAEP,SAAS,CAAC2B,MAAM;EAC5BnB,MAAM,EAAER,SAAS,CAAC2B,MAAM;EACxBjB,SAAS,EAAEV,SAAS,CAAC4B;AACvB,CAAC;AAEDtB,kBAAkB,CAACuB,YAAY,GAAG;EAChCtB,UAAU,EAAE,EAAE;EACdC,MAAM,EAAE,EAAE;EACVE,SAAS,EAAE;AACb,CAAC;AAED,eAAeJ,kBAAkB","ignoreList":[]}
|
|
@@ -1,126 +1,3 @@
|
|
|
1
|
-
import
|
|
2
|
-
|
|
3
|
-
import PropTypes from 'prop-types';
|
|
4
|
-
import classnames from 'classnames';
|
|
5
|
-
import { Link } from '@blaze-cms/nextjs-components';
|
|
6
|
-
import { MdKeyboardArrowLeft, MdEdit, MdEditOff } from 'react-icons/md';
|
|
7
|
-
import { useRouter } from 'next/router';
|
|
8
|
-
import { IoCloseOutline } from 'react-icons/io5';
|
|
9
|
-
import { buildAdminHref, setBlazeDebug } from '../../helpers';
|
|
10
|
-
import { BLAZE_DEBUG, DEBUG_LOGO } from '../../constants';
|
|
11
|
-
import getFromLocal from '../../helpers/get-from-local';
|
|
12
|
-
const DebugSidebar = ({
|
|
13
|
-
itemEntity,
|
|
14
|
-
itemId,
|
|
15
|
-
updatedDebugOptions,
|
|
16
|
-
debugMode
|
|
17
|
-
}) => {
|
|
18
|
-
const [isDebugMode, setIsDebugMode] = useState(debugMode);
|
|
19
|
-
const [isEditorMode, setIsEditorMode] = useState(false);
|
|
20
|
-
const [isOpen, setIsOpen] = useState(true);
|
|
21
|
-
const router = useRouter();
|
|
22
|
-
useEffect(() => {
|
|
23
|
-
// const currentEditorMode = getFromLocal(BLAZE_PB_EDITOR_MODE);
|
|
24
|
-
const currentDebugValue = getFromLocal(BLAZE_DEBUG);
|
|
25
|
-
setIsDebugMode(currentDebugValue);
|
|
26
|
-
setIsOpen(currentDebugValue);
|
|
27
|
-
setBlazeDebug(setIsDebugMode);
|
|
28
|
-
// setIsEditorMode(!!currentEditorMode); // todo: initilize on load
|
|
29
|
-
}, []);
|
|
30
|
-
useEffect(() => {
|
|
31
|
-
const handleRouteChange = url => {
|
|
32
|
-
const hasDebug = url.includes(`${BLAZE_DEBUG}=1`);
|
|
33
|
-
if (hasDebug) {
|
|
34
|
-
setBlazeDebug(setIsDebugMode);
|
|
35
|
-
setIsOpen(true);
|
|
36
|
-
}
|
|
37
|
-
};
|
|
38
|
-
if (router.asPath.includes(`${BLAZE_DEBUG}=1`)) {
|
|
39
|
-
handleRouteChange(router.asPath);
|
|
40
|
-
}
|
|
41
|
-
router.events.on('routeChangeComplete', handleRouteChange);
|
|
42
|
-
return () => {
|
|
43
|
-
router.events.off('routeChangeComplete', handleRouteChange);
|
|
44
|
-
};
|
|
45
|
-
}, [router.events, router.asPath]);
|
|
46
|
-
const divClass = classnames('debug-sidebar', {
|
|
47
|
-
'debug-sidebar--open': isOpen,
|
|
48
|
-
'debug-sidebar--close': !isOpen
|
|
49
|
-
});
|
|
50
|
-
const toggleEditorMode = () => {
|
|
51
|
-
// todo: persist editor mode in local storage
|
|
52
|
-
// const currentEditorMode = getFromLocal(BLAZE_PB_EDITOR_MODE);
|
|
53
|
-
// if (currentEditorMode) {
|
|
54
|
-
// window.localStorage.removeItem(BLAZE_PB_EDITOR_MODE);
|
|
55
|
-
// } else {
|
|
56
|
-
// window.localStorage.setItem(BLAZE_PB_EDITOR_MODE, true);
|
|
57
|
-
// }
|
|
58
|
-
updatedDebugOptions('editorModeEnabled', !isEditorMode);
|
|
59
|
-
updatedDebugOptions({
|
|
60
|
-
editorModeEnabled: !isEditorMode,
|
|
61
|
-
adminHref: buildAdminHref({
|
|
62
|
-
itemEntity,
|
|
63
|
-
itemId
|
|
64
|
-
})
|
|
65
|
-
});
|
|
66
|
-
setIsEditorMode(!isEditorMode);
|
|
67
|
-
};
|
|
68
|
-
const href = buildAdminHref({
|
|
69
|
-
itemEntity,
|
|
70
|
-
itemId
|
|
71
|
-
});
|
|
72
|
-
if (!isDebugMode) return null;
|
|
73
|
-
const closeDebug = () => {
|
|
74
|
-
setBlazeDebug(setIsDebugMode);
|
|
75
|
-
window.blaze.debug();
|
|
76
|
-
const [pathname, search = ''] = router.asPath.split('?');
|
|
77
|
-
const params = new URLSearchParams(search);
|
|
78
|
-
params.delete(BLAZE_DEBUG);
|
|
79
|
-
const newUrl = params.toString() ? `${pathname}?${params.toString()}` : pathname;
|
|
80
|
-
router.push('/Resolver', newUrl, {
|
|
81
|
-
shallow: true
|
|
82
|
-
});
|
|
83
|
-
};
|
|
84
|
-
return createPortal(/*#__PURE__*/React.createElement("div", {
|
|
85
|
-
className: divClass,
|
|
86
|
-
"data-testid": "debug-sidebar"
|
|
87
|
-
}, /*#__PURE__*/React.createElement(Link, {
|
|
88
|
-
href: href,
|
|
89
|
-
target: "_blank"
|
|
90
|
-
}, /*#__PURE__*/React.createElement("img", {
|
|
91
|
-
src: DEBUG_LOGO.SRC,
|
|
92
|
-
alt: DEBUG_LOGO.ALT
|
|
93
|
-
}), /*#__PURE__*/React.createElement("span", null, "Blaze admin")), /*#__PURE__*/React.createElement("div", {
|
|
94
|
-
role: "button",
|
|
95
|
-
className: "debug-sidebar__button debug-sidebar__button--close",
|
|
96
|
-
"data-testid": "debug-sidebar-close",
|
|
97
|
-
"aria-label": "Close debug sidebar",
|
|
98
|
-
onClick: closeDebug
|
|
99
|
-
}, /*#__PURE__*/React.createElement(IoCloseOutline, null)), /*#__PURE__*/React.createElement("div", {
|
|
100
|
-
role: "button",
|
|
101
|
-
className: "debug-sidebar__button debug-sidebar__button--editor",
|
|
102
|
-
"data-testid": "debug-sidebar-editor-button",
|
|
103
|
-
id: "debug-sidebar-editor-button",
|
|
104
|
-
"aria-label": "Editor mode",
|
|
105
|
-
onClick: toggleEditorMode
|
|
106
|
-
}, /*#__PURE__*/React.createElement("i", null, isEditorMode ? /*#__PURE__*/React.createElement(MdEditOff, null) : /*#__PURE__*/React.createElement(MdEdit, null))), /*#__PURE__*/React.createElement("div", {
|
|
107
|
-
role: "button",
|
|
108
|
-
className: "debug-sidebar__button open",
|
|
109
|
-
"data-testid": "debug-sidebar-button",
|
|
110
|
-
id: "debug-sidebar-button",
|
|
111
|
-
onClick: () => setIsOpen(!isOpen)
|
|
112
|
-
}, /*#__PURE__*/React.createElement("i", null, /*#__PURE__*/React.createElement(MdKeyboardArrowLeft, null)))), document.body);
|
|
113
|
-
};
|
|
114
|
-
DebugSidebar.propTypes = {
|
|
115
|
-
updatedDebugOptions: PropTypes.func.isRequired,
|
|
116
|
-
itemEntity: PropTypes.string,
|
|
117
|
-
itemId: PropTypes.string,
|
|
118
|
-
debugMode: PropTypes.bool
|
|
119
|
-
};
|
|
120
|
-
DebugSidebar.defaultProps = {
|
|
121
|
-
itemEntity: '',
|
|
122
|
-
itemId: '',
|
|
123
|
-
debugMode: false
|
|
124
|
-
};
|
|
125
|
-
export default DebugSidebar;
|
|
1
|
+
import DebugSidebarRender from './DebugSidebarRender';
|
|
2
|
+
export default DebugSidebarRender;
|
|
126
3
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["
|
|
1
|
+
{"version":3,"file":"index.js","names":["DebugSidebarRender"],"sources":["../../../src/components/DebugSidebar/index.js"],"sourcesContent":["import DebugSidebarRender from './DebugSidebarRender';\n\nexport default DebugSidebarRender;\n"],"mappings":"AAAA,OAAOA,kBAAkB,MAAM,sBAAsB;AAErD,eAAeA,kBAAkB","ignoreList":[]}
|
package/lib-es/helpers/index.js
CHANGED
|
@@ -9,5 +9,6 @@ import renderAppleTags from './render-apple-tags';
|
|
|
9
9
|
import getPageData from './get-page-data';
|
|
10
10
|
import getErrorMessage from './get-error-message';
|
|
11
11
|
import getRootSelectorClasses from './get-root-selector-classes';
|
|
12
|
-
|
|
12
|
+
import getFromLocal from './get-from-local';
|
|
13
|
+
export { buildAdminHref, checkForGtm, checkParent, checkUrl, getEntitysActions, getFromLocal, getSearchFilter, getPageData, getErrorMessage, renderAppleTags, setBlazeDebug, getRootSelectorClasses };
|
|
13
14
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["checkUrl","getEntitysActions","getSearchFilter","checkParent","buildAdminHref","setBlazeDebug","checkForGtm","renderAppleTags","getPageData","getErrorMessage","getRootSelectorClasses"],"sources":["../../src/helpers/index.js"],"sourcesContent":["import checkUrl from './check-url';\nimport getEntitysActions from './get-entitys-actions';\nimport getSearchFilter from './get-search-filter';\nimport checkParent from './check-parent';\nimport buildAdminHref from './build-admin-href';\nimport setBlazeDebug from './set-blaze-debug';\nimport checkForGtm from './check-for-gtm';\nimport renderAppleTags from './render-apple-tags';\nimport getPageData from './get-page-data';\nimport getErrorMessage from './get-error-message';\nimport getRootSelectorClasses from './get-root-selector-classes';\n\nexport {\n buildAdminHref,\n checkForGtm,\n checkParent,\n checkUrl,\n getEntitysActions,\n getSearchFilter,\n getPageData,\n getErrorMessage,\n renderAppleTags,\n setBlazeDebug,\n getRootSelectorClasses\n};\n"],"mappings":"AAAA,OAAOA,QAAQ,MAAM,aAAa;AAClC,OAAOC,iBAAiB,MAAM,uBAAuB;AACrD,OAAOC,eAAe,MAAM,qBAAqB;AACjD,OAAOC,WAAW,MAAM,gBAAgB;AACxC,OAAOC,cAAc,MAAM,oBAAoB;AAC/C,OAAOC,aAAa,MAAM,mBAAmB;AAC7C,OAAOC,WAAW,MAAM,iBAAiB;AACzC,OAAOC,eAAe,MAAM,qBAAqB;AACjD,OAAOC,WAAW,MAAM,iBAAiB;AACzC,OAAOC,eAAe,MAAM,qBAAqB;AACjD,OAAOC,sBAAsB,MAAM,6BAA6B;
|
|
1
|
+
{"version":3,"file":"index.js","names":["checkUrl","getEntitysActions","getSearchFilter","checkParent","buildAdminHref","setBlazeDebug","checkForGtm","renderAppleTags","getPageData","getErrorMessage","getRootSelectorClasses","getFromLocal"],"sources":["../../src/helpers/index.js"],"sourcesContent":["import checkUrl from './check-url';\nimport getEntitysActions from './get-entitys-actions';\nimport getSearchFilter from './get-search-filter';\nimport checkParent from './check-parent';\nimport buildAdminHref from './build-admin-href';\nimport setBlazeDebug from './set-blaze-debug';\nimport checkForGtm from './check-for-gtm';\nimport renderAppleTags from './render-apple-tags';\nimport getPageData from './get-page-data';\nimport getErrorMessage from './get-error-message';\nimport getRootSelectorClasses from './get-root-selector-classes';\nimport getFromLocal from './get-from-local';\n\nexport {\n buildAdminHref,\n checkForGtm,\n checkParent,\n checkUrl,\n getEntitysActions,\n getFromLocal,\n getSearchFilter,\n getPageData,\n getErrorMessage,\n renderAppleTags,\n setBlazeDebug,\n getRootSelectorClasses\n};\n"],"mappings":"AAAA,OAAOA,QAAQ,MAAM,aAAa;AAClC,OAAOC,iBAAiB,MAAM,uBAAuB;AACrD,OAAOC,eAAe,MAAM,qBAAqB;AACjD,OAAOC,WAAW,MAAM,gBAAgB;AACxC,OAAOC,cAAc,MAAM,oBAAoB;AAC/C,OAAOC,aAAa,MAAM,mBAAmB;AAC7C,OAAOC,WAAW,MAAM,iBAAiB;AACzC,OAAOC,eAAe,MAAM,qBAAqB;AACjD,OAAOC,WAAW,MAAM,iBAAiB;AACzC,OAAOC,eAAe,MAAM,qBAAqB;AACjD,OAAOC,sBAAsB,MAAM,6BAA6B;AAChE,OAAOC,YAAY,MAAM,kBAAkB;AAE3C,SACEP,cAAc,EACdE,WAAW,EACXH,WAAW,EACXH,QAAQ,EACRC,iBAAiB,EACjBU,YAAY,EACZT,eAAe,EACfM,WAAW,EACXC,eAAe,EACfF,eAAe,EACfF,aAAa,EACbK,sBAAsB","ignoreList":[]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@blaze-cms/nextjs-tools",
|
|
3
|
-
"version": "0.146.0-node18-tooltips.
|
|
3
|
+
"version": "0.146.0-node18-tooltips.23",
|
|
4
4
|
"description": "Blaze nextjs tools",
|
|
5
5
|
"main": "lib/index.js",
|
|
6
6
|
"module": "lib-es/index.js",
|
|
@@ -34,16 +34,17 @@
|
|
|
34
34
|
"@blaze-cms/core-ui": "0.146.0-node18-tooltips.11",
|
|
35
35
|
"@blaze-cms/nextjs-components": "0.146.0-node18-tooltips.0",
|
|
36
36
|
"@blaze-cms/plugin-auth-fe": "0.146.0-node18-tooltips.11",
|
|
37
|
-
"@blaze-cms/plugin-auth-local-fe": "0.146.0-node18-tooltips.
|
|
37
|
+
"@blaze-cms/plugin-auth-local-fe": "0.146.0-node18-tooltips.22",
|
|
38
38
|
"@blaze-cms/plugin-chart": "0.146.0-node18-tooltips.19",
|
|
39
|
-
"@blaze-cms/plugin-google-maps-fe": "0.146.0-node18-tooltips.
|
|
40
|
-
"@blaze-cms/plugin-gtm-fe": "0.146.0-node18-tooltips.
|
|
41
|
-
"@blaze-cms/plugin-page-builder-fe": "0.146.0-node18-tooltips.
|
|
39
|
+
"@blaze-cms/plugin-google-maps-fe": "0.146.0-node18-tooltips.23",
|
|
40
|
+
"@blaze-cms/plugin-gtm-fe": "0.146.0-node18-tooltips.23",
|
|
41
|
+
"@blaze-cms/plugin-page-builder-fe": "0.146.0-node18-tooltips.23",
|
|
42
42
|
"@blaze-cms/plugin-preview-fe": "0.146.0-node18-tooltips.11",
|
|
43
|
-
"@blaze-cms/plugin-search-ui": "0.146.0-node18-tooltips.
|
|
43
|
+
"@blaze-cms/plugin-search-ui": "0.146.0-node18-tooltips.22",
|
|
44
44
|
"@blaze-cms/plugin-structured-data-fe": "0.146.0-node18-tooltips.18",
|
|
45
|
-
"@blaze-cms/react-page-builder": "0.146.0-node18-tooltips.
|
|
45
|
+
"@blaze-cms/react-page-builder": "0.146.0-node18-tooltips.23",
|
|
46
46
|
"@blaze-cms/setup-ui": "0.146.0-node18-tooltips.0",
|
|
47
|
+
"@blaze-react/switches": "0.8.0-alpha.112",
|
|
47
48
|
"autoprefixer": "^10.2.3",
|
|
48
49
|
"core-js": "^3.2.1",
|
|
49
50
|
"cross-fetch": "^3.0.2",
|
|
@@ -70,5 +71,5 @@
|
|
|
70
71
|
"lib/*",
|
|
71
72
|
"lib-es/*"
|
|
72
73
|
],
|
|
73
|
-
"gitHead": "
|
|
74
|
+
"gitHead": "b2247e324c855cff8a8c745e848948b104fbc3d8"
|
|
74
75
|
}
|
|
@@ -0,0 +1,110 @@
|
|
|
1
|
+
import React, { useState } from 'react';
|
|
2
|
+
import { createPortal } from 'react-dom';
|
|
3
|
+
import PropTypes from 'prop-types';
|
|
4
|
+
import classnames from 'classnames';
|
|
5
|
+
import { IoCloseOutline } from 'react-icons/io5';
|
|
6
|
+
import { useRouter } from 'next/router';
|
|
7
|
+
import { MdKeyboardArrowLeft, MdEdit } from 'react-icons/md';
|
|
8
|
+
import { Link } from '@blaze-cms/nextjs-components';
|
|
9
|
+
import Switches from '@blaze-react/switches';
|
|
10
|
+
import { buildAdminHref, setBlazeDebug } from '../../helpers';
|
|
11
|
+
import { DEBUG_LOGO, BLAZE_DEBUG } from '../../constants';
|
|
12
|
+
|
|
13
|
+
const DebugSidebar = ({ itemEntity, itemId, updatedDebugOptions, debugMode, setIsDebugMode }) => {
|
|
14
|
+
const router = useRouter();
|
|
15
|
+
const [isEditorMode, setIsEditorMode] = useState(false);
|
|
16
|
+
const [isOpen, setIsOpen] = useState(true);
|
|
17
|
+
|
|
18
|
+
const divClass = classnames('debug-sidebar', {
|
|
19
|
+
'debug-sidebar--open': isOpen,
|
|
20
|
+
'debug-sidebar--close': !isOpen
|
|
21
|
+
});
|
|
22
|
+
|
|
23
|
+
const toggleEditorMode = () => {
|
|
24
|
+
// todo: persist editor mode in local storage
|
|
25
|
+
// const currentEditorMode = getFromLocal(BLAZE_PB_EDITOR_MODE);
|
|
26
|
+
// if (currentEditorMode) {
|
|
27
|
+
// window.localStorage.removeItem(BLAZE_PB_EDITOR_MODE);
|
|
28
|
+
// } else {
|
|
29
|
+
// window.localStorage.setItem(BLAZE_PB_EDITOR_MODE, true);
|
|
30
|
+
// }
|
|
31
|
+
updatedDebugOptions('editorModeEnabled', !isEditorMode);
|
|
32
|
+
updatedDebugOptions({
|
|
33
|
+
editorModeEnabled: !isEditorMode,
|
|
34
|
+
adminHref: buildAdminHref({ itemEntity, itemId })
|
|
35
|
+
});
|
|
36
|
+
setIsEditorMode(!isEditorMode);
|
|
37
|
+
};
|
|
38
|
+
|
|
39
|
+
const href = buildAdminHref({ itemEntity, itemId });
|
|
40
|
+
|
|
41
|
+
const closeDebug = () => {
|
|
42
|
+
setBlazeDebug(setIsDebugMode);
|
|
43
|
+
window.blaze.debug();
|
|
44
|
+
|
|
45
|
+
const [pathname, search = ''] = router.asPath.split('?');
|
|
46
|
+
const params = new URLSearchParams(search);
|
|
47
|
+
params.delete(BLAZE_DEBUG);
|
|
48
|
+
const newUrl = params.toString() ? `${pathname}?${params.toString()}` : pathname;
|
|
49
|
+
|
|
50
|
+
router.push('/Resolver', newUrl, {
|
|
51
|
+
shallow: true
|
|
52
|
+
});
|
|
53
|
+
};
|
|
54
|
+
|
|
55
|
+
return createPortal(
|
|
56
|
+
<div className={divClass} data-testid="debug-sidebar">
|
|
57
|
+
<Link href={href} target="_blank">
|
|
58
|
+
<img src={DEBUG_LOGO.SRC} alt={DEBUG_LOGO.ALT} />
|
|
59
|
+
</Link>
|
|
60
|
+
<div
|
|
61
|
+
role="button"
|
|
62
|
+
className="debug-sidebar__button debug-sidebar__button--close"
|
|
63
|
+
data-testid="debug-sidebar-close"
|
|
64
|
+
aria-label="Close debug sidebar"
|
|
65
|
+
onClick={closeDebug}>
|
|
66
|
+
<IoCloseOutline />
|
|
67
|
+
</div>
|
|
68
|
+
<Switches
|
|
69
|
+
onChange={toggleEditorMode}
|
|
70
|
+
name="debug-sidebar-switch"
|
|
71
|
+
icon={<MdEdit />}
|
|
72
|
+
alignVertically
|
|
73
|
+
returnBoolean
|
|
74
|
+
onText="ON"
|
|
75
|
+
offText="OFF"
|
|
76
|
+
options={{
|
|
77
|
+
id: 'debug-sidebar-switch',
|
|
78
|
+
checked: isEditorMode
|
|
79
|
+
}}
|
|
80
|
+
/>
|
|
81
|
+
<div
|
|
82
|
+
role="button"
|
|
83
|
+
className="debug-sidebar__button open"
|
|
84
|
+
data-testid="debug-sidebar-button"
|
|
85
|
+
id="debug-sidebar-button"
|
|
86
|
+
onClick={() => setIsOpen(!isOpen)}>
|
|
87
|
+
<i>
|
|
88
|
+
<MdKeyboardArrowLeft />
|
|
89
|
+
</i>
|
|
90
|
+
</div>
|
|
91
|
+
</div>,
|
|
92
|
+
document.body
|
|
93
|
+
);
|
|
94
|
+
};
|
|
95
|
+
|
|
96
|
+
DebugSidebar.propTypes = {
|
|
97
|
+
updatedDebugOptions: PropTypes.func.isRequired,
|
|
98
|
+
itemEntity: PropTypes.string,
|
|
99
|
+
itemId: PropTypes.string,
|
|
100
|
+
debugMode: PropTypes.bool,
|
|
101
|
+
setIsDebugMode: PropTypes.func.isRequired
|
|
102
|
+
};
|
|
103
|
+
|
|
104
|
+
DebugSidebar.defaultProps = {
|
|
105
|
+
itemEntity: '',
|
|
106
|
+
itemId: '',
|
|
107
|
+
debugMode: false
|
|
108
|
+
};
|
|
109
|
+
|
|
110
|
+
export default DebugSidebar;
|
|
@@ -0,0 +1,67 @@
|
|
|
1
|
+
import React, { useState, useEffect } from 'react';
|
|
2
|
+
import dynamic from 'next/dynamic';
|
|
3
|
+
import PropTypes from 'prop-types';
|
|
4
|
+
import { useRouter } from 'next/router';
|
|
5
|
+
import { setBlazeDebug, getFromLocal } from '../../helpers';
|
|
6
|
+
import { BLAZE_DEBUG } from '../../constants';
|
|
7
|
+
|
|
8
|
+
const DebugSidebar = dynamic(() => import('./DebugSidebar'));
|
|
9
|
+
|
|
10
|
+
const DebugSidebarRender = ({ itemEntity, itemId, updatedDebugOptions, debugMode }) => {
|
|
11
|
+
const [isDebugMode, setIsDebugMode] = useState(debugMode);
|
|
12
|
+
const router = useRouter();
|
|
13
|
+
|
|
14
|
+
useEffect(() => {
|
|
15
|
+
const currentDebugValue = getFromLocal(BLAZE_DEBUG);
|
|
16
|
+
setIsDebugMode(currentDebugValue);
|
|
17
|
+
setBlazeDebug(setIsDebugMode);
|
|
18
|
+
}, []);
|
|
19
|
+
|
|
20
|
+
useEffect(
|
|
21
|
+
() => {
|
|
22
|
+
const handleRouteChange = url => {
|
|
23
|
+
const hasDebug = url.includes(`${BLAZE_DEBUG}=1`);
|
|
24
|
+
if (hasDebug) {
|
|
25
|
+
setBlazeDebug(setIsDebugMode);
|
|
26
|
+
}
|
|
27
|
+
};
|
|
28
|
+
|
|
29
|
+
if (router.asPath.includes(`${BLAZE_DEBUG}=1`)) {
|
|
30
|
+
handleRouteChange(router.asPath);
|
|
31
|
+
}
|
|
32
|
+
|
|
33
|
+
router.events.on('routeChangeComplete', handleRouteChange);
|
|
34
|
+
return () => {
|
|
35
|
+
router.events.off('routeChangeComplete', handleRouteChange);
|
|
36
|
+
};
|
|
37
|
+
},
|
|
38
|
+
[router.events, router.asPath]
|
|
39
|
+
);
|
|
40
|
+
|
|
41
|
+
if (!isDebugMode) return null;
|
|
42
|
+
|
|
43
|
+
return (
|
|
44
|
+
<DebugSidebar
|
|
45
|
+
itemEntity={itemEntity}
|
|
46
|
+
itemId={itemId}
|
|
47
|
+
updatedDebugOptions={updatedDebugOptions}
|
|
48
|
+
debugMode={debugMode}
|
|
49
|
+
setIsDebugMode={setIsDebugMode}
|
|
50
|
+
/>
|
|
51
|
+
);
|
|
52
|
+
};
|
|
53
|
+
|
|
54
|
+
DebugSidebarRender.propTypes = {
|
|
55
|
+
updatedDebugOptions: PropTypes.func.isRequired,
|
|
56
|
+
itemEntity: PropTypes.string,
|
|
57
|
+
itemId: PropTypes.string,
|
|
58
|
+
debugMode: PropTypes.bool
|
|
59
|
+
};
|
|
60
|
+
|
|
61
|
+
DebugSidebarRender.defaultProps = {
|
|
62
|
+
itemEntity: '',
|
|
63
|
+
itemId: '',
|
|
64
|
+
debugMode: false
|
|
65
|
+
};
|
|
66
|
+
|
|
67
|
+
export default DebugSidebarRender;
|
|
@@ -1,137 +1,3 @@
|
|
|
1
|
-
import
|
|
2
|
-
import { createPortal } from 'react-dom';
|
|
3
|
-
import PropTypes from 'prop-types';
|
|
4
|
-
import classnames from 'classnames';
|
|
5
|
-
import { Link } from '@blaze-cms/nextjs-components';
|
|
6
|
-
import { MdKeyboardArrowLeft, MdEdit, MdEditOff } from 'react-icons/md';
|
|
7
|
-
import { useRouter } from 'next/router';
|
|
8
|
-
import { IoCloseOutline } from 'react-icons/io5';
|
|
9
|
-
import { buildAdminHref, setBlazeDebug } from '../../helpers';
|
|
10
|
-
import { BLAZE_DEBUG, DEBUG_LOGO } from '../../constants';
|
|
11
|
-
import getFromLocal from '../../helpers/get-from-local';
|
|
1
|
+
import DebugSidebarRender from './DebugSidebarRender';
|
|
12
2
|
|
|
13
|
-
|
|
14
|
-
const [isDebugMode, setIsDebugMode] = useState(debugMode);
|
|
15
|
-
const [isEditorMode, setIsEditorMode] = useState(false);
|
|
16
|
-
const [isOpen, setIsOpen] = useState(true);
|
|
17
|
-
const router = useRouter();
|
|
18
|
-
|
|
19
|
-
useEffect(() => {
|
|
20
|
-
// const currentEditorMode = getFromLocal(BLAZE_PB_EDITOR_MODE);
|
|
21
|
-
const currentDebugValue = getFromLocal(BLAZE_DEBUG);
|
|
22
|
-
setIsDebugMode(currentDebugValue);
|
|
23
|
-
setIsOpen(currentDebugValue);
|
|
24
|
-
setBlazeDebug(setIsDebugMode);
|
|
25
|
-
// setIsEditorMode(!!currentEditorMode); // todo: initilize on load
|
|
26
|
-
}, []);
|
|
27
|
-
|
|
28
|
-
useEffect(() => {
|
|
29
|
-
const handleRouteChange = url => {
|
|
30
|
-
const hasDebug = url.includes(`${BLAZE_DEBUG}=1`);
|
|
31
|
-
if (hasDebug) {
|
|
32
|
-
setBlazeDebug(setIsDebugMode);
|
|
33
|
-
setIsOpen(true);
|
|
34
|
-
}
|
|
35
|
-
};
|
|
36
|
-
|
|
37
|
-
if (router.asPath.includes(`${BLAZE_DEBUG}=1`)) {
|
|
38
|
-
handleRouteChange(router.asPath);
|
|
39
|
-
}
|
|
40
|
-
|
|
41
|
-
router.events.on('routeChangeComplete', handleRouteChange);
|
|
42
|
-
return () => {
|
|
43
|
-
router.events.off('routeChangeComplete', handleRouteChange);
|
|
44
|
-
};
|
|
45
|
-
}, [router.events, router.asPath]);
|
|
46
|
-
|
|
47
|
-
const divClass = classnames('debug-sidebar', {
|
|
48
|
-
'debug-sidebar--open': isOpen,
|
|
49
|
-
'debug-sidebar--close': !isOpen
|
|
50
|
-
});
|
|
51
|
-
|
|
52
|
-
const toggleEditorMode = () => {
|
|
53
|
-
// todo: persist editor mode in local storage
|
|
54
|
-
// const currentEditorMode = getFromLocal(BLAZE_PB_EDITOR_MODE);
|
|
55
|
-
// if (currentEditorMode) {
|
|
56
|
-
// window.localStorage.removeItem(BLAZE_PB_EDITOR_MODE);
|
|
57
|
-
// } else {
|
|
58
|
-
// window.localStorage.setItem(BLAZE_PB_EDITOR_MODE, true);
|
|
59
|
-
// }
|
|
60
|
-
updatedDebugOptions('editorModeEnabled', !isEditorMode);
|
|
61
|
-
updatedDebugOptions({
|
|
62
|
-
editorModeEnabled: !isEditorMode,
|
|
63
|
-
adminHref: buildAdminHref({ itemEntity, itemId })
|
|
64
|
-
});
|
|
65
|
-
setIsEditorMode(!isEditorMode);
|
|
66
|
-
};
|
|
67
|
-
|
|
68
|
-
const href = buildAdminHref({ itemEntity, itemId });
|
|
69
|
-
if (!isDebugMode) return null;
|
|
70
|
-
|
|
71
|
-
const closeDebug = () => {
|
|
72
|
-
setBlazeDebug(setIsDebugMode);
|
|
73
|
-
window.blaze.debug();
|
|
74
|
-
|
|
75
|
-
const [pathname, search = ''] = router.asPath.split('?');
|
|
76
|
-
const params = new URLSearchParams(search);
|
|
77
|
-
params.delete(BLAZE_DEBUG);
|
|
78
|
-
const newUrl = params.toString() ? `${pathname}?${params.toString()}` : pathname;
|
|
79
|
-
|
|
80
|
-
router.push('/Resolver', newUrl, {
|
|
81
|
-
shallow: true
|
|
82
|
-
});
|
|
83
|
-
};
|
|
84
|
-
|
|
85
|
-
return createPortal(
|
|
86
|
-
<div className={divClass} data-testid="debug-sidebar">
|
|
87
|
-
<Link href={href} target="_blank">
|
|
88
|
-
<img src={DEBUG_LOGO.SRC} alt={DEBUG_LOGO.ALT} />
|
|
89
|
-
<span>Blaze admin</span>
|
|
90
|
-
</Link>
|
|
91
|
-
<div
|
|
92
|
-
role="button"
|
|
93
|
-
className="debug-sidebar__button debug-sidebar__button--close"
|
|
94
|
-
data-testid="debug-sidebar-close"
|
|
95
|
-
aria-label="Close debug sidebar"
|
|
96
|
-
onClick={closeDebug}>
|
|
97
|
-
<IoCloseOutline />
|
|
98
|
-
</div>
|
|
99
|
-
|
|
100
|
-
<div
|
|
101
|
-
role="button"
|
|
102
|
-
className="debug-sidebar__button debug-sidebar__button--editor"
|
|
103
|
-
data-testid="debug-sidebar-editor-button"
|
|
104
|
-
id="debug-sidebar-editor-button"
|
|
105
|
-
aria-label="Editor mode"
|
|
106
|
-
onClick={toggleEditorMode}>
|
|
107
|
-
<i>{isEditorMode ? <MdEditOff /> : <MdEdit />}</i>
|
|
108
|
-
</div>
|
|
109
|
-
<div
|
|
110
|
-
role="button"
|
|
111
|
-
className="debug-sidebar__button open"
|
|
112
|
-
data-testid="debug-sidebar-button"
|
|
113
|
-
id="debug-sidebar-button"
|
|
114
|
-
onClick={() => setIsOpen(!isOpen)}>
|
|
115
|
-
<i>
|
|
116
|
-
<MdKeyboardArrowLeft />
|
|
117
|
-
</i>
|
|
118
|
-
</div>
|
|
119
|
-
</div>,
|
|
120
|
-
document.body
|
|
121
|
-
);
|
|
122
|
-
};
|
|
123
|
-
|
|
124
|
-
DebugSidebar.propTypes = {
|
|
125
|
-
updatedDebugOptions: PropTypes.func.isRequired,
|
|
126
|
-
itemEntity: PropTypes.string,
|
|
127
|
-
itemId: PropTypes.string,
|
|
128
|
-
debugMode: PropTypes.bool
|
|
129
|
-
};
|
|
130
|
-
|
|
131
|
-
DebugSidebar.defaultProps = {
|
|
132
|
-
itemEntity: '',
|
|
133
|
-
itemId: '',
|
|
134
|
-
debugMode: false
|
|
135
|
-
};
|
|
136
|
-
|
|
137
|
-
export default DebugSidebar;
|
|
3
|
+
export default DebugSidebarRender;
|
package/src/helpers/index.js
CHANGED
|
@@ -9,6 +9,7 @@ import renderAppleTags from './render-apple-tags';
|
|
|
9
9
|
import getPageData from './get-page-data';
|
|
10
10
|
import getErrorMessage from './get-error-message';
|
|
11
11
|
import getRootSelectorClasses from './get-root-selector-classes';
|
|
12
|
+
import getFromLocal from './get-from-local';
|
|
12
13
|
|
|
13
14
|
export {
|
|
14
15
|
buildAdminHref,
|
|
@@ -16,6 +17,7 @@ export {
|
|
|
16
17
|
checkParent,
|
|
17
18
|
checkUrl,
|
|
18
19
|
getEntitysActions,
|
|
20
|
+
getFromLocal,
|
|
19
21
|
getSearchFilter,
|
|
20
22
|
getPageData,
|
|
21
23
|
getErrorMessage,
|
|
@@ -65,10 +65,6 @@ const setupTest = async debug => {
|
|
|
65
65
|
|
|
66
66
|
// todo: fix empty dom returned despite console showing rendering
|
|
67
67
|
describe.skip('DebugSidebar component', () => {
|
|
68
|
-
it('should be defined', () => {
|
|
69
|
-
expect(DebugSidebar).toBeDefined();
|
|
70
|
-
});
|
|
71
|
-
|
|
72
68
|
it('should render without throwing error (isDebugMode true)', async () => {
|
|
73
69
|
const { asFragment } = await setupTest(true);
|
|
74
70
|
expect(asFragment()).toMatchSnapshot();
|