redux-connected-devtools 0.0.13 → 1.0.2

Sign up to get free protection for your applications and to get access to all the features.
Files changed (314) hide show
  1. package/.env +2 -0
  2. package/.prettierrc.js +10 -0
  3. package/.vscode/settings.json +12 -0
  4. package/.vscode/tasks.json +33 -0
  5. package/LICENSE +21 -0
  6. package/README.md +5 -0
  7. package/index.html +58 -0
  8. package/jest.config.js +8 -0
  9. package/package.json +47 -62
  10. package/public/devtools.html +8 -0
  11. package/public/icon.png +0 -0
  12. package/public/manifest.json +29 -0
  13. package/public/options.html +12 -0
  14. package/public/panel.html +39 -0
  15. package/public/popup.html +12 -0
  16. package/src/__tests__/sum.ts +9 -0
  17. package/src/background.ts +49 -0
  18. package/src/components/DevInspector/DevInspector.scss +2 -0
  19. package/src/components/DevInspector/DevInspector.style.tsx +8 -0
  20. package/src/components/DevInspector/DevInspector.tsx +34 -0
  21. package/src/components/DevList/DevList.scss +2 -0
  22. package/src/components/DevList/DevList.style.tsx +34 -0
  23. package/src/components/DevList/DevList.tsx +62 -0
  24. package/src/components/DevMenu/DevMenu.scss +2 -0
  25. package/src/components/DevMenu/DevMenu.style.tsx +53 -0
  26. package/src/components/DevMenu/DevMenu.tsx +76 -0
  27. package/src/components/DevPanel/DevPanel.scss +2 -0
  28. package/src/components/DevPanel/DevPanel.style.tsx +16 -0
  29. package/src/components/DevPanel/DevPanel.tsx +51 -0
  30. package/src/components/JourneyRow/JourneyRow.scss +2 -0
  31. package/src/components/JourneyRow/JourneyRow.style.tsx +46 -0
  32. package/src/components/JourneyRow/JourneyRow.tsx +58 -0
  33. package/src/components/JsonViewer/JsonViewer.scss +2 -0
  34. package/src/components/JsonViewer/JsonViewer.style.tsx +31 -0
  35. package/src/components/JsonViewer/JsonViewer.tsx +24 -0
  36. package/src/components/Lifecycle/Lifecycle.scss +2 -0
  37. package/src/components/Lifecycle/Lifecycle.style.tsx +6 -0
  38. package/src/components/Lifecycle/Lifecycle.tsx +31 -0
  39. package/src/components/LogsViewer/LogsViewer.scss +2 -0
  40. package/src/components/LogsViewer/LogsViewer.style.tsx +5 -0
  41. package/src/components/LogsViewer/LogsViewer.tsx +14 -0
  42. package/src/components/RequestDetails/RequestDetails.scss +2 -0
  43. package/src/components/RequestDetails/RequestDetails.style.tsx +20 -0
  44. package/src/components/RequestDetails/RequestDetails.tsx +60 -0
  45. package/src/components/RequestJourney/RequestJourney.scss +2 -0
  46. package/src/components/RequestJourney/RequestJourney.style.tsx +6 -0
  47. package/src/components/RequestJourney/RequestJourney.tsx +33 -0
  48. package/src/components/RequestRow/RequestRow.scss +2 -0
  49. package/src/components/RequestRow/RequestRow.style.tsx +31 -0
  50. package/src/components/RequestRow/RequestRow.tsx +37 -0
  51. package/src/components/Time/Time.scss +2 -0
  52. package/src/components/Time/Time.style.tsx +17 -0
  53. package/src/components/Time/Time.tsx +25 -0
  54. package/src/containers/DevMenuContainer.tsx +28 -0
  55. package/src/containers/DevPanelContainer.tsx +10 -0
  56. package/src/containers/EndpointConfigsContainer.tsx +12 -0
  57. package/src/containers/EndpointStatusContainer.tsx +12 -0
  58. package/src/containers/GlobalSettingsContainer.tsx +12 -0
  59. package/src/containers/GlobalStatsContainer.tsx +12 -0
  60. package/src/containers/LifecycleApiErrorContainer.tsx +11 -0
  61. package/src/containers/LifecycleGeneralErrorContainer.tsx +11 -0
  62. package/src/containers/LifecycleInQueueContainer.tsx +11 -0
  63. package/src/containers/LifecyclePendingApiContainer.tsx +11 -0
  64. package/src/containers/LifecyclePostActionContainer.tsx +11 -0
  65. package/src/containers/LifecycleReceivedContainer.tsx +11 -0
  66. package/src/content_script.ts +19 -0
  67. package/src/data/devComponents.tsx +25 -0
  68. package/src/data/devRoutes.ts +83 -0
  69. package/src/devtools.tsx +29 -0
  70. package/src/index.ts +1 -0
  71. package/src/injected_script.ts +9 -0
  72. package/src/options.tsx +77 -0
  73. package/src/panel.tsx +30 -0
  74. package/src/popup.tsx +63 -0
  75. package/src/store/initialState.ts +42 -0
  76. package/src/store/selectors.ts +205 -0
  77. package/src/sum.ts +3 -0
  78. package/src/types.ts +1 -0
  79. package/src/utils/date.ts +3 -0
  80. package/tsconfig.json +24 -0
  81. package/vite.config.ts +45 -0
  82. package/webpack/webpack.common.js +46 -0
  83. package/webpack/webpack.dev.js +7 -0
  84. package/webpack/webpack.prod.js +6 -0
  85. package/esm/components/Config/Config.d.ts +0 -6
  86. package/esm/components/Config/Config.js +0 -15
  87. package/esm/components/DevTools/DevTools.d.ts +0 -4
  88. package/esm/components/DevTools/DevTools.js +0 -19
  89. package/esm/components/Dispatcher/Dispatcher.d.ts +0 -8
  90. package/esm/components/Dispatcher/Dispatcher.js +0 -62
  91. package/esm/components/GlobalSettings/GlobalSettings.d.ts +0 -6
  92. package/esm/components/GlobalSettings/GlobalSettings.js +0 -16
  93. package/esm/components/Group/Group.d.ts +0 -9
  94. package/esm/components/Group/Group.js +0 -14
  95. package/esm/components/Json/Json.d.ts +0 -7
  96. package/esm/components/Json/Json.js +0 -9
  97. package/esm/components/Logs/Logs.d.ts +0 -6
  98. package/esm/components/Logs/Logs.js +0 -49
  99. package/esm/components/Monitor/Monitor.d.ts +0 -6
  100. package/esm/components/Monitor/Monitor.js +0 -52
  101. package/esm/components/OverlayManager/OverlayManager.d.ts +0 -6
  102. package/esm/components/OverlayManager/OverlayManager.js +0 -17
  103. package/esm/components/Panel/Panel.d.ts +0 -14
  104. package/esm/components/Panel/Panel.js +0 -46
  105. package/esm/components/Preview/Preview.d.ts +0 -19
  106. package/esm/components/Preview/Preview.js +0 -58
  107. package/esm/components/Redux/Redux.d.ts +0 -6
  108. package/esm/components/Redux/Redux.js +0 -72
  109. package/esm/components/ReduxSettings/ReduxSettings.d.ts +0 -9
  110. package/esm/components/ReduxSettings/ReduxSettings.js +0 -60
  111. package/esm/components/Requests/Requests.d.ts +0 -6
  112. package/esm/components/Requests/Requests.js +0 -61
  113. package/esm/components/Status/Status.d.ts +0 -6
  114. package/esm/components/Status/Status.js +0 -16
  115. package/esm/components/TaskManager/TaskManager.d.ts +0 -9
  116. package/esm/components/TaskManager/TaskManager.js +0 -22
  117. package/esm/components/Toggle/Toggle.d.ts +0 -9
  118. package/esm/components/Toggle/Toggle.js +0 -8
  119. package/esm/components/VirtualList/VirtualList.d.ts +0 -19
  120. package/esm/components/VirtualList/VirtualList.js +0 -30
  121. package/esm/components/Visual/Visual.d.ts +0 -6
  122. package/esm/components/Visual/Visual.js +0 -38
  123. package/esm/components/prefix.d.ts +0 -2
  124. package/esm/components/prefix.js +0 -2
  125. package/esm/data/boxSizes.d.ts +0 -2
  126. package/esm/data/boxSizes.js +0 -10
  127. package/esm/data/dispatcherActions.d.ts +0 -5
  128. package/esm/data/dispatcherActions.js +0 -35
  129. package/esm/data/panels.d.ts +0 -2
  130. package/esm/data/panels.js +0 -74
  131. package/esm/data/panelsArrangements.d.ts +0 -19
  132. package/esm/data/panelsArrangements.js +0 -19
  133. package/esm/data/reduxFilterOptions.d.ts +0 -20
  134. package/esm/data/reduxFilterOptions.js +0 -223
  135. package/esm/data/widgets.d.ts +0 -2
  136. package/esm/data/widgets.js +0 -85
  137. package/esm/hooks/index.d.ts +0 -7
  138. package/esm/hooks/index.js +0 -7
  139. package/esm/hooks/misc/hookState.d.ts +0 -8
  140. package/esm/hooks/misc/hookState.js +0 -6
  141. package/esm/hooks/misc/util.d.ts +0 -5
  142. package/esm/hooks/misc/util.js +0 -21
  143. package/esm/hooks/useBoolean.d.ts +0 -3
  144. package/esm/hooks/useBoolean.js +0 -3
  145. package/esm/hooks/useClickAway.d.ts +0 -3
  146. package/esm/hooks/useClickAway.js +0 -27
  147. package/esm/hooks/useEvent.d.ts +0 -13
  148. package/esm/hooks/useEvent.js +0 -35
  149. package/esm/hooks/useKey.d.ts +0 -12
  150. package/esm/hooks/useKey.js +0 -29
  151. package/esm/hooks/useList.d.ts +0 -57
  152. package/esm/hooks/useList.js +0 -74
  153. package/esm/hooks/useLocalstorage.d.ts +0 -10
  154. package/esm/hooks/useLocalstorage.js +0 -75
  155. package/esm/hooks/usePanels.d.ts +0 -10
  156. package/esm/hooks/usePanels.js +0 -43
  157. package/esm/hooks/useSetState.d.ts +0 -2
  158. package/esm/hooks/useSetState.js +0 -10
  159. package/esm/hooks/useToggle.d.ts +0 -2
  160. package/esm/hooks/useToggle.js +0 -6
  161. package/esm/hooks/useUpdate.d.ts +0 -1
  162. package/esm/hooks/useUpdate.js +0 -6
  163. package/esm/index.d.ts +0 -3
  164. package/esm/index.js +0 -3
  165. package/esm/selectors/selectors.d.ts +0 -21
  166. package/esm/selectors/selectors.js +0 -20
  167. package/esm/theme/devtoolsTheme.d.ts +0 -2
  168. package/esm/theme/devtoolsTheme.js +0 -95
  169. package/esm/utils/filter.d.ts +0 -3
  170. package/esm/utils/filter.js +0 -25
  171. package/esm/utils/localStorage.d.ts +0 -2
  172. package/esm/utils/localStorage.js +0 -21
  173. package/lib/components/Colors copy.css +0 -3
  174. package/lib/components/Colors copy.css.map +0 -1
  175. package/lib/components/Colors.css +0 -3
  176. package/lib/components/Colors.css.map +0 -1
  177. package/lib/components/ColorsDark.css +0 -3
  178. package/lib/components/ColorsDark.css.map +0 -1
  179. package/lib/components/Config/Config.css +0 -15
  180. package/lib/components/Config/Config.css.map +0 -1
  181. package/lib/components/Config/Config.d.ts +0 -6
  182. package/lib/components/Config/Config.js +0 -20
  183. package/lib/components/DevTools/DevTools.css +0 -3
  184. package/lib/components/DevTools/DevTools.css.map +0 -1
  185. package/lib/components/DevTools/DevTools.d.ts +0 -4
  186. package/lib/components/DevTools/DevTools.js +0 -24
  187. package/lib/components/Dispatcher/Dispatcher.css +0 -15
  188. package/lib/components/Dispatcher/Dispatcher.css.map +0 -1
  189. package/lib/components/Dispatcher/Dispatcher.d.ts +0 -8
  190. package/lib/components/Dispatcher/Dispatcher.js +0 -66
  191. package/lib/components/GlobalSettings/GlobalSettings.css +0 -3
  192. package/lib/components/GlobalSettings/GlobalSettings.css.map +0 -1
  193. package/lib/components/GlobalSettings/GlobalSettings.d.ts +0 -6
  194. package/lib/components/GlobalSettings/GlobalSettings.js +0 -21
  195. package/lib/components/Group/Group.css +0 -41
  196. package/lib/components/Group/Group.css.map +0 -1
  197. package/lib/components/Group/Group.d.ts +0 -9
  198. package/lib/components/Group/Group.js +0 -19
  199. package/lib/components/Json/Json.css +0 -3
  200. package/lib/components/Json/Json.css.map +0 -1
  201. package/lib/components/Json/Json.d.ts +0 -7
  202. package/lib/components/Json/Json.js +0 -14
  203. package/lib/components/Logs/Logs.css +0 -3
  204. package/lib/components/Logs/Logs.css.map +0 -1
  205. package/lib/components/Logs/Logs.d.ts +0 -6
  206. package/lib/components/Logs/Logs.js +0 -54
  207. package/lib/components/Monitor/Monitor.css +0 -3
  208. package/lib/components/Monitor/Monitor.css.map +0 -1
  209. package/lib/components/Monitor/Monitor.d.ts +0 -6
  210. package/lib/components/Monitor/Monitor.js +0 -57
  211. package/lib/components/OverlayManager/OverlayManager.css +0 -72
  212. package/lib/components/OverlayManager/OverlayManager.css.map +0 -1
  213. package/lib/components/OverlayManager/OverlayManager.d.ts +0 -6
  214. package/lib/components/OverlayManager/OverlayManager.js +0 -22
  215. package/lib/components/Panel/Panel.css +0 -35
  216. package/lib/components/Panel/Panel.css.map +0 -1
  217. package/lib/components/Panel/Panel.d.ts +0 -14
  218. package/lib/components/Panel/Panel.js +0 -51
  219. package/lib/components/Prefix copy.css +0 -3
  220. package/lib/components/Prefix copy.css.map +0 -1
  221. package/lib/components/Prefix.css +0 -3
  222. package/lib/components/Prefix.css.map +0 -1
  223. package/lib/components/Preview/Preview.css +0 -29
  224. package/lib/components/Preview/Preview.css.map +0 -1
  225. package/lib/components/Preview/Preview.d.ts +0 -19
  226. package/lib/components/Preview/Preview.js +0 -64
  227. package/lib/components/Reading.css +0 -107
  228. package/lib/components/Reading.css.map +0 -1
  229. package/lib/components/Redux/Redux.css +0 -86
  230. package/lib/components/Redux/Redux.css.map +0 -1
  231. package/lib/components/Redux/Redux.d.ts +0 -6
  232. package/lib/components/Redux/Redux.js +0 -77
  233. package/lib/components/ReduxSettings/ReduxSettings.css +0 -10
  234. package/lib/components/ReduxSettings/ReduxSettings.css.map +0 -1
  235. package/lib/components/ReduxSettings/ReduxSettings.d.ts +0 -9
  236. package/lib/components/ReduxSettings/ReduxSettings.js +0 -64
  237. package/lib/components/Requests/Requests.css +0 -8
  238. package/lib/components/Requests/Requests.css.map +0 -1
  239. package/lib/components/Requests/Requests.d.ts +0 -6
  240. package/lib/components/Requests/Requests.js +0 -66
  241. package/lib/components/Status/Status.css +0 -15
  242. package/lib/components/Status/Status.css.map +0 -1
  243. package/lib/components/Status/Status.d.ts +0 -6
  244. package/lib/components/Status/Status.js +0 -21
  245. package/lib/components/TaskManager/TaskManager.css +0 -9
  246. package/lib/components/TaskManager/TaskManager.css.map +0 -1
  247. package/lib/components/TaskManager/TaskManager.d.ts +0 -9
  248. package/lib/components/TaskManager/TaskManager.js +0 -28
  249. package/lib/components/Toggle/Toggle.css +0 -3
  250. package/lib/components/Toggle/Toggle.css.map +0 -1
  251. package/lib/components/Toggle/Toggle.d.ts +0 -9
  252. package/lib/components/Toggle/Toggle.js +0 -13
  253. package/lib/components/Variables.css +0 -3
  254. package/lib/components/Variables.css.map +0 -1
  255. package/lib/components/VirtualList/VirtualList.css +0 -13
  256. package/lib/components/VirtualList/VirtualList.css.map +0 -1
  257. package/lib/components/VirtualList/VirtualList.d.ts +0 -19
  258. package/lib/components/VirtualList/VirtualList.js +0 -35
  259. package/lib/components/Visual/Visual.css +0 -56
  260. package/lib/components/Visual/Visual.css.map +0 -1
  261. package/lib/components/Visual/Visual.d.ts +0 -6
  262. package/lib/components/Visual/Visual.js +0 -43
  263. package/lib/components/prefix.d.ts +0 -2
  264. package/lib/components/prefix.js +0 -5
  265. package/lib/data/boxSizes.d.ts +0 -2
  266. package/lib/data/boxSizes.js +0 -13
  267. package/lib/data/dispatcherActions.d.ts +0 -5
  268. package/lib/data/dispatcherActions.js +0 -38
  269. package/lib/data/panels.d.ts +0 -2
  270. package/lib/data/panels.js +0 -77
  271. package/lib/data/panelsArrangements.d.ts +0 -19
  272. package/lib/data/panelsArrangements.js +0 -22
  273. package/lib/data/reduxFilterOptions.d.ts +0 -20
  274. package/lib/data/reduxFilterOptions.js +0 -227
  275. package/lib/data/widgets.d.ts +0 -2
  276. package/lib/data/widgets.js +0 -89
  277. package/lib/hooks/index.d.ts +0 -7
  278. package/lib/hooks/index.js +0 -17
  279. package/lib/hooks/misc/hookState.d.ts +0 -8
  280. package/lib/hooks/misc/hookState.js +0 -10
  281. package/lib/hooks/misc/util.d.ts +0 -5
  282. package/lib/hooks/misc/util.js +0 -27
  283. package/lib/hooks/useBoolean.d.ts +0 -3
  284. package/lib/hooks/useBoolean.js +0 -7
  285. package/lib/hooks/useClickAway.d.ts +0 -3
  286. package/lib/hooks/useClickAway.js +0 -31
  287. package/lib/hooks/useEvent.d.ts +0 -13
  288. package/lib/hooks/useEvent.js +0 -37
  289. package/lib/hooks/useKey.d.ts +0 -12
  290. package/lib/hooks/useKey.js +0 -34
  291. package/lib/hooks/useList.d.ts +0 -57
  292. package/lib/hooks/useList.js +0 -79
  293. package/lib/hooks/useLocalstorage.d.ts +0 -10
  294. package/lib/hooks/useLocalstorage.js +0 -79
  295. package/lib/hooks/usePanels.d.ts +0 -10
  296. package/lib/hooks/usePanels.js +0 -47
  297. package/lib/hooks/useSetState.d.ts +0 -2
  298. package/lib/hooks/useSetState.js +0 -14
  299. package/lib/hooks/useToggle.d.ts +0 -2
  300. package/lib/hooks/useToggle.js +0 -10
  301. package/lib/hooks/useUpdate.d.ts +0 -1
  302. package/lib/hooks/useUpdate.js +0 -9
  303. package/lib/index.css +0 -488
  304. package/lib/index.css.map +0 -1
  305. package/lib/index.d.ts +0 -3
  306. package/lib/index.js +0 -9
  307. package/lib/selectors/selectors.d.ts +0 -21
  308. package/lib/selectors/selectors.js +0 -24
  309. package/lib/theme/devtoolsTheme.d.ts +0 -2
  310. package/lib/theme/devtoolsTheme.js +0 -97
  311. package/lib/utils/filter.d.ts +0 -3
  312. package/lib/utils/filter.js +0 -29
  313. package/lib/utils/localStorage.d.ts +0 -2
  314. package/lib/utils/localStorage.js +0 -26
package/.env ADDED
@@ -0,0 +1,2 @@
1
+ VITE_SERVER_DOMAIN=http://localhost
2
+ VITE_BASE_PORT_PAYEM=3100
package/.prettierrc.js ADDED
@@ -0,0 +1,10 @@
1
+ module.exports = {
2
+ trailingComma: 'es5',
3
+ tabWidth: 4,
4
+ semi: true,
5
+ singleQuote: true,
6
+ jsxSingleQuote: true,
7
+ endOfLine: 'auto',
8
+ // printWidth: 120,
9
+ useTabs: false,
10
+ };
package/.vscode/settings.json ADDED
@@ -0,0 +1,12 @@
1
+ {
2
+ "typescript.tsdk": "./node_modules/typescript/lib",
3
+ "files.eol": "\n",
4
+ "json.schemas": [
5
+ {
6
+ "fileMatch": [
7
+ "/manifest.json"
8
+ ],
9
+ "url": "http://json.schemastore.org/chrome-manifest"
10
+ }
11
+ ]
12
+ }
package/.vscode/tasks.json ADDED
@@ -0,0 +1,33 @@
1
+ {
2
+ // See https://go.microsoft.com/fwlink/?LinkId=733558
3
+ // for the documentation about the tasks.json format
4
+ "version": "2.0.0",
5
+ "command": "npm",
6
+ "tasks": [
7
+ {
8
+ "label": "install",
9
+ "type": "shell",
10
+ "command": "npm",
11
+ "args": ["install"]
12
+ },
13
+ {
14
+ "label": "update",
15
+ "type": "shell",
16
+ "command": "npm",
17
+ "args": ["update"]
18
+ },
19
+ {
20
+ "label": "test",
21
+ "type": "shell",
22
+ "command": "npm",
23
+ "args": ["run", "test"]
24
+ },
25
+ {
26
+ "label": "build",
27
+ "type": "shell",
28
+ "group": "build",
29
+ "command": "npm",
30
+ "args": ["run", "watch"]
31
+ }
32
+ ]
33
+ }
package/LICENSE ADDED
@@ -0,0 +1,21 @@
1
+ MIT License
2
+
3
+ Copyright (c) 2018 Tomofumi Chiba
4
+
5
+ Permission is hereby granted, free of charge, to any person obtaining a copy
6
+ of this software and associated documentation files (the "Software"), to deal
7
+ in the Software without restriction, including without limitation the rights
8
+ to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9
+ copies of the Software, and to permit persons to whom the Software is
10
+ furnished to do so, subject to the following conditions:
11
+
12
+ The above copyright notice and this permission notice shall be included in all
13
+ copies or substantial portions of the Software.
14
+
15
+ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16
+ IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17
+ FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18
+ AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19
+ LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20
+ OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21
+ SOFTWARE.
package/README.md CHANGED
@@ -0,0 +1,5 @@
1
+ # Redux-connected-devtools Chrome Extension
2
+
3
+ messages => pub/sub
4
+
5
+ content_script => background => panel script
package/index.html ADDED
@@ -0,0 +1,58 @@
1
+ <!DOCTYPE html>
2
+ <html lang="en">
3
+ <head>
4
+ <meta charset="UTF-8" />
5
+ <link rel="icon" type="image/svg+xml" href="/src/favicon.svg" />
6
+ <meta name="viewport" content="width=device-width, initial-scale=1.0" />
7
+ <link
8
+ rel="stylesheet"
9
+ href="https://fonts.googleapis.com/icon?family=Material+Icons"
10
+ />
11
+ <link
12
+ rel="stylesheet"
13
+ href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700&display=swap"
14
+ />
15
+ <link rel="preconnect" href="https://fonts.googleapis.com" />
16
+ <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
17
+ <link
18
+ href="https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800;900&family=Roboto:wght@100;400;500;700&display=swap"
19
+ rel="stylesheet"
20
+ />
21
+ <link rel="preconnect" href="https://fonts.googleapis.com" />
22
+ <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
23
+ <link
24
+ href="https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800;900&display=swap"
25
+ rel="stylesheet"
26
+ />
27
+
28
+ <title>redux-connected-chrome-extension</title>
29
+ <style>
30
+ body {
31
+ padding: 0;
32
+ margin: 0;
33
+ min-height: 100vh;
34
+ font-family: 'Inter', sans-serif;
35
+ }
36
+
37
+ body,
38
+ #root {
39
+ display: flex;
40
+ flex: 1;
41
+ }
42
+
43
+ input,
44
+ h1,
45
+ h2,
46
+ h3,
47
+ select,
48
+ textarea {
49
+ font-family: 'Inter', sans-serif;
50
+ }
51
+ </style>
52
+ </head>
53
+ <body>
54
+ <div id="root"></div>
55
+ <div id="modal-root"></div>
56
+ <script type="module" src="/src/panel.tsx"></script>
57
+ </body>
58
+ </html>
package/jest.config.js ADDED
@@ -0,0 +1,8 @@
1
+ module.exports = {
2
+ "roots": [
3
+ "src"
4
+ ],
5
+ "transform": {
6
+ "^.+\\.ts$": "ts-jest"
7
+ },
8
+ };
package/package.json CHANGED
@@ -1,73 +1,58 @@
1
1
  {
2
2
  "name": "redux-connected-devtools",
3
- "version": "0.0.13",
4
- "license": "MIT",
5
- "description": "Styless UI",
6
- "main": "lib/index.js",
7
- "files": [
8
- "lib/",
9
- "lib/index.css",
10
- "esm/"
11
- ],
12
- "types": "lib/index.d.ts",
13
- "typings": "lib/index.d.ts",
3
+ "version": "1.0.2",
4
+ "description": "redux-connected-devtools",
5
+ "main": "src/index.ts",
14
6
  "scripts": {
15
- "test": "jest --config jest.config.ts",
16
- "test:watch": "jest --watch",
17
- "test:coverage": "jest --coverage",
18
- "lint": "eslint {src,tests,stories}/**/*.{ts,tsx}",
19
- "lint:fix": "yarn lint --fix",
20
- "lint:types": "tsc --noEmit",
21
- "build:cjs": "tsc",
22
- "build:es": "tsc -m esNext --outDir esm",
23
- "build": "node scripts/generate-index.js && npm run clean && npm run scss && yarn build:cjs && yarn build:es && yalc push",
24
- "clean": "rm -rf lib2/* && rm -rf esm2/*",
25
- "watch": "nodemon -x \"npm run build\"",
26
- "scss": "node scripts/build-scss.js"
7
+ "dev": "vite",
8
+ "watch": "webpack --config webpack/webpack.dev.js --watch",
9
+ "build": "webpack --config webpack/webpack.prod.js",
10
+ "clean": "rimraf dist",
11
+ "test": "npx jest",
12
+ "style": "prettier --write \"src/**/*.{ts,tsx}\""
13
+ },
14
+ "author": "",
15
+ "license": "MIT",
16
+ "repository": {
17
+ "type": "git",
18
+ "url": "https://github.com/dht/redux-connected-devtools.git"
27
19
  },
28
20
  "dependencies": {
29
- "@testing-library/react": "^11.2.5",
30
- "classnames": "^2.3.1",
31
- "date-fns": "^2.22.1",
32
- "igrid": "^0.0.2",
33
- "lodash": "^4.17.21",
34
- "react": "^17.0.2",
35
- "react-draggable": "^4.4.3",
36
- "react-json-view": "^1.21.1",
37
- "react-modal": "^3.14.3",
38
- "react-redux": "^7.2.4",
39
- "react-toggle": "^4.1.2",
40
- "react-use": "^17.2.4",
21
+ "@redux-devtools/extension": "^3.2.2",
22
+ "bytes": "^3.1.2",
23
+ "dotenv-flow": "^3.2.0",
24
+ "react": "^17.0.1",
25
+ "react-dom": "^17.0.2",
26
+ "react-redux": "^7.2.6",
41
27
  "react-window": "^1.8.6",
42
- "redux-connected": "^0.0.5",
43
- "sass": "^1.32.8"
28
+ "redux-connected": "^0.0.90",
29
+ "redux-store-generator": "^0.9.74",
30
+ "reselect": "^4.1.5",
31
+ "styled-components": "^5.3.3",
32
+ "tslib": "^2.3.1"
44
33
  },
45
34
  "devDependencies": {
46
- "@babel/core": "^7.13.8",
47
- "@jest/types": "^26.6.2",
48
- "@types/classnames": "^2.2.11",
49
- "@types/jest": "^26.0.21",
50
- "@types/lodash": "^4.14.168",
51
- "husky": "^5.2.0",
52
- "jest": "^26.6.3",
53
- "lint-staged": "^10.5.4",
35
+ "@types/bytes": "^3.1.1",
36
+ "@types/chrome": "0.0.158",
37
+ "@types/jest": "^27.0.2",
38
+ "@types/react": "^17.0.0",
39
+ "@types/react-dom": "^17.0.0",
40
+ "@types/react-window": "^1.8.5",
41
+ "@types/styled-components": "^5.1.24",
42
+ "@vitejs/plugin-react": "^1.2.0",
43
+ "copy-webpack-plugin": "^9.0.1",
44
+ "glob": "^7.1.6",
45
+ "jest": "^27.2.1",
54
46
  "prettier": "^2.2.1",
55
- "ts-jest": "^26.5.4",
56
- "tslib": "^2.1.0",
57
- "tslint": "^6.1.3",
58
- "tslint-config-prettier": "^1.18.0",
59
- "typescript": "^4.2.3"
60
- },
61
- "husky": {
62
- "hooks": {
63
- "pre-commit": "lint-staged",
64
- "pre-push": "yarn lint && yarn clean && yarn build && yarn test"
65
- }
66
- },
67
- "lint-staged": {
68
- "src/**/**/*.{ts,tsx}": [
69
- "eslint --fix",
70
- "git add"
71
- ]
47
+ "rimraf": "^3.0.2 ",
48
+ "ts-jest": "^27.0.5",
49
+ "ts-loader": "^8.0.0",
50
+ "typescript": "^4.4.3 ",
51
+ "vite": "^2.6.4",
52
+ "vite-plugin-react-svg": "^0.2.0",
53
+ "vite-tsconfig-paths": "^3.3.13",
54
+ "webpack": "^5.0.0",
55
+ "webpack-cli": "^4.0.0",
56
+ "webpack-merge": "^5.0.0"
72
57
  }
73
58
  }
package/public/devtools.html ADDED
@@ -0,0 +1,8 @@
1
+ <!DOCTYPE html>
2
+ <html>
3
+ <head>
4
+ <title>Injects the devtools panel</title>
5
+ <script src="js/devtools.js"></script>
6
+ </head>
7
+ <body></body>
8
+ </html>
package/public/icon.png ADDED
Binary file
package/public/manifest.json ADDED
@@ -0,0 +1,29 @@
1
+ {
2
+ "manifest_version": 3,
3
+ "name": "redux-connected devtools",
4
+ "description": "Inspect the lifecycle of a redux-connected request",
5
+ "version": "1.0",
6
+ "options_ui": {
7
+ "page": "options.html"
8
+ },
9
+ "action": {
10
+ "default_icon": "icon.png",
11
+ "default_popup": "popup.html"
12
+ },
13
+ "background": {
14
+ "service_worker": "js/background.js"
15
+ },
16
+ "content_scripts": [
17
+ {
18
+ "matches": ["<all_urls>"],
19
+ "js": [
20
+ "js/vendor.js",
21
+ "js/content_script.js",
22
+ "js/injected_script.js"
23
+ ]
24
+ }
25
+ ],
26
+ "devtools_page": "devtools.html",
27
+ "permissions": ["storage"],
28
+ "host_permissions": ["<all_urls>"]
29
+ }
package/public/options.html ADDED
@@ -0,0 +1,12 @@
1
+ <!DOCTYPE html>
2
+ <html>
3
+ <head>
4
+ <title>Extension options</title>
5
+ <script src="js/vendor.js"></script>
6
+ </head>
7
+
8
+ <body>
9
+ <div id="root"></div>
10
+ <script src="js/options.js"></script>
11
+ </body>
12
+ </html>
package/public/panel.html ADDED
@@ -0,0 +1,39 @@
1
+ <!DOCTYPE html>
2
+ <html>
3
+ <head>
4
+ <title>Redux-connected devtools</title>
5
+ <script src="js/vendor.js"></script>
6
+ <link
7
+ href="https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800;900&display=swap"
8
+ rel="stylesheet"
9
+ />
10
+ <style>
11
+ body {
12
+ padding: 0;
13
+ margin: 0;
14
+ min-height: 100vh;
15
+ }
16
+
17
+ body,
18
+ #root {
19
+ display: flex;
20
+ flex: 1;
21
+ font-family: 'Inter', sans-serif;
22
+ }
23
+
24
+ input,
25
+ h1,
26
+ h2,
27
+ h3,
28
+ select,
29
+ textarea {
30
+ font-family: 'Inter', sans-serif;
31
+ }
32
+ </style>
33
+ </head>
34
+
35
+ <body>
36
+ <div id="root"></div>
37
+ <script src="js/panel.js"></script>
38
+ </body>
39
+ </html>
package/public/popup.html ADDED
@@ -0,0 +1,12 @@
1
+ <!DOCTYPE html>
2
+ <html>
3
+ <head>
4
+ <meta charset="UTF-8" />
5
+ <title>Popup</title>
6
+ <script src="js/vendor.js"></script>
7
+ </head>
8
+ <body>
9
+ <div id="root"></div>
10
+ <script src="js/popup.js"></script>
11
+ </body>
12
+ </html>
package/src/__tests__/sum.ts ADDED
@@ -0,0 +1,9 @@
1
+ import { sum } from "../sum";
2
+
3
+ test("1 + 1 = 2", () => {
4
+ expect(sum(1, 1)).toBe(2);
5
+ });
6
+
7
+ test("1 + 2 != 2", () => {
8
+ expect(sum(1, 2)).not.toBe(2);
9
+ });
package/src/background.ts ADDED
@@ -0,0 +1,49 @@
1
+ // background.js
2
+
3
+ let connections: Record<number | string, chrome.runtime.Port> = {};
4
+
5
+ chrome.runtime.onConnect.addListener(function (port) {
6
+ var extensionListener = function (message: any) {
7
+ // The original connection event doesn't include the tab ID of the
8
+ // DevTools page, so we need to send it explicitly.
9
+ if (message.name == 'init') {
10
+ connections[message.tabId] = port;
11
+ return;
12
+ }
13
+
14
+ // other message handling
15
+ };
16
+
17
+ // Listen to messages sent from the DevTools page
18
+ port.onMessage.addListener(extensionListener);
19
+
20
+ port.onDisconnect.addListener(function (port) {
21
+ port.onMessage.removeListener(extensionListener);
22
+
23
+ const tabs = Object.keys(connections);
24
+ for (var i = 0, len = tabs.length; i < len; i++) {
25
+ if (connections[tabs[i]] == port) {
26
+ delete connections[tabs[i]];
27
+ break;
28
+ }
29
+ }
30
+ });
31
+ });
32
+
33
+ // Receive message from content script and relay to the devTools page for the
34
+ // current tab
35
+ chrome.runtime.onMessage.addListener(function (request, sender, sendResponse) {
36
+ // Messages from content scripts should have sender.tab set
37
+ if (sender.tab) {
38
+ var tabId = sender.tab.id;
39
+
40
+ if (tabId && connections[tabId]) {
41
+ connections[tabId].postMessage(request);
42
+ } else {
43
+ console.log('Tab not found in connection list.');
44
+ }
45
+ } else {
46
+ console.log('sender.tab not defined.');
47
+ }
48
+ return true;
49
+ });
package/src/components/DevInspector/DevInspector.scss ADDED
@@ -0,0 +1,2 @@
1
+ .DevInspector-container {
2
+ }
package/src/components/DevInspector/DevInspector.style.tsx ADDED
@@ -0,0 +1,8 @@
1
+ import styled from 'styled-components';
2
+
3
+ export const Container = styled.div`
4
+ flex: 1;
5
+ display: flex;
6
+ flex-direction: column;
7
+ background-color: rgba(0, 0, 0, 0.1);
8
+ `;
package/src/components/DevInspector/DevInspector.tsx ADDED
@@ -0,0 +1,34 @@
1
+ import React from 'react';
2
+ import { Container } from './DevInspector.style';
3
+ import { ApiRequest } from 'redux-connected';
4
+ import RequestJourney from '../RequestJourney/RequestJourney';
5
+ import RequestDetails from '../RequestDetails/RequestDetails';
6
+
7
+ export type DevInspectorProps = {
8
+ item?: ApiRequest;
9
+ };
10
+
11
+ export function DevInspector(props: DevInspectorProps) {
12
+ const { item } = props;
13
+
14
+ if (!item) {
15
+ return (
16
+ <Container
17
+ className='DevInspector-container'
18
+ data-testid='DevInspector-container'
19
+ ></Container>
20
+ );
21
+ }
22
+
23
+ return (
24
+ <Container
25
+ className='DevInspector-container'
26
+ data-testid='DevInspector-container'
27
+ >
28
+ <RequestDetails item={item} />
29
+ <RequestJourney item={item} />
30
+ </Container>
31
+ );
32
+ }
33
+
34
+ export default DevInspector;
package/src/components/DevList/DevList.scss ADDED
@@ -0,0 +1,2 @@
1
+ .DevList-container {
2
+ }
package/src/components/DevList/DevList.style.tsx ADDED
@@ -0,0 +1,34 @@
1
+ import styled from 'styled-components';
2
+
3
+ export const Container = styled.div`
4
+ flex: 1;
5
+
6
+ .list {
7
+ &::-webkit-scrollbar {
8
+ width: 8px;
9
+ }
10
+
11
+ /* Track */
12
+ &::-webkit-scrollbar-track {
13
+ background: #333;
14
+ }
15
+
16
+ /* Handle */
17
+ &::-webkit-scrollbar-thumb {
18
+ background: #555;
19
+ }
20
+
21
+ /* Handle on hover */
22
+ &::-webkit-scrollbar-thumb:hover {
23
+ background: #666;
24
+ }
25
+ }
26
+ `;
27
+
28
+ export const Empty = styled.div`
29
+ color: #456;
30
+ margin: 30px;
31
+ font-size: 17px;
32
+ text-align: center;
33
+ text-shadow: 1px 3px 3px rgba(0, 0, 0, 0.2);
34
+ `;
package/src/components/DevList/DevList.tsx ADDED
@@ -0,0 +1,62 @@
1
+ import React from 'react';
2
+ import { Container, Empty } from './DevList.style';
3
+ import { FixedSizeList as List } from 'react-window';
4
+ import { Json } from '../../types';
5
+
6
+ export type DevListProps = {
7
+ items: Json[];
8
+ row: React.FC<any>;
9
+ onClick: (item: any) => void;
10
+ };
11
+
12
+ export function DevList(props: DevListProps) {
13
+ const { row: Cmp, items } = props;
14
+
15
+ const Item = (rowInfo: any) => {
16
+ const { index, style } = rowInfo;
17
+
18
+ const item = items[index];
19
+
20
+ return (
21
+ <Cmp
22
+ onClick={props.onClick}
23
+ index={index}
24
+ style={style}
25
+ item={item}
26
+ />
27
+ );
28
+ };
29
+
30
+ function renderEmpty() {
31
+ return <Empty>Empty list</Empty>;
32
+ }
33
+
34
+ function renderList() {
35
+ if (items.length === 0) {
36
+ return renderEmpty();
37
+ }
38
+
39
+ return (
40
+ <List
41
+ height={850}
42
+ itemCount={items.length}
43
+ itemSize={68}
44
+ width={350}
45
+ className='list'
46
+ >
47
+ {Item}
48
+ </List>
49
+ );
50
+ }
51
+
52
+ return (
53
+ <Container
54
+ className='DevList-container'
55
+ data-testid='DevList-container'
56
+ >
57
+ {renderList()}
58
+ </Container>
59
+ );
60
+ }
61
+
62
+ export default DevList;
package/src/components/DevMenu/DevMenu.scss ADDED
@@ -0,0 +1,2 @@
1
+ .DevMenu-container {
2
+ }
package/src/components/DevMenu/DevMenu.style.tsx ADDED
@@ -0,0 +1,53 @@
1
+ import styled from 'styled-components';
2
+
3
+ export const Container = styled.div`
4
+ width: 190px;
5
+ border-right: 1px solid rgba(255, 255, 255, 0.2);
6
+ box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5);
7
+ `;
8
+
9
+ export const MenuGroup = styled.div`
10
+ border-bottom: 1px solid rgba(255, 255, 255, 0.2);
11
+ `;
12
+
13
+ export const MenuGroupTitle = styled.div`
14
+ font-size: 13px;
15
+ padding: 5px 10px;
16
+ color: rgba(255, 255, 255, 0.5);
17
+ border-bottom: 1px solid rgba(255, 255, 255, 0.2);
18
+ background-color: rgba(0, 0, 0, 0.1);
19
+ `;
20
+
21
+ export const MenuItem = styled.div<{ selected: boolean }>`
22
+ display: flex;
23
+ flex-direction: row;
24
+ align-items: center;
25
+ padding: 6px 10px;
26
+ font-size: 14px;
27
+ color: ${(props) =>
28
+ props.selected ? 'gold' : 'rgba(255, 255, 255, 0.89)'};
29
+ background-color: ${(props) =>
30
+ props.selected ? 'rgba(255, 255, 255, 0.05)' : 'transparent'};
31
+
32
+ &:hover {
33
+ background-color: rgba(255, 255, 255, 0.1);
34
+ cursor: pointer;
35
+ }
36
+ `;
37
+
38
+ export const Title = styled.div`
39
+ flex: 1;
40
+ `;
41
+
42
+ export const Badge = styled.div`
43
+ background-color: rgba(0, 0, 80, 0.3);
44
+ padding: 0 4px;
45
+ font-size: 12px;
46
+ border-radius: 7px;
47
+ border: 1px solid #334;
48
+ color: cyan;
49
+ `;
50
+
51
+ export const BadgeTotal = styled(Badge)`
52
+ color: #555;
53
+ `;