Merge pull request #56 from andrewcourtice/feat/devtools-reset

Devtools Reset

.eslintrc.js

@@ -1,10 +1,11 @@
 module.exports = {
+    root: true,
     parserOptions: {
         parser: '@typescript-eslint/parser',
     },
     extends: [
         'eslint:recommended',
-        'plugin:@typescript-eslint/recommended'
+        'plugin:@typescript-eslint/recommended',
     ],
     env: {
         'es2021': true,

.vscode/settings.json

@@ -1,9 +1,12 @@
 {
     "npm.packageManager": "yarn",
+    "typescript.tsdk": "node_modules/typescript/lib",
     "files.exclude": {
         "**/node_modules": true
     },
-    "typescript.tsdk": "node_modules/typescript/lib",
+    "editor.codeActionsOnSave": {
+        "source.fixAll.eslint": true
+    },
     "[vue]": {
         "editor.semanticHighlighting.enabled": false
     }

.yarnrc.yml

@@ -4,4 +4,4 @@ plugins:
   - path: .yarn/plugins/@yarnpkg/plugin-interactive-tools.cjs
     spec: "@yarnpkg/plugin-interactive-tools"
 
-yarnPath: .yarn/releases/yarn-berry.cjs
+yarnPath: .yarn/releases/yarn-3.2.0.cjs

app/package.json

@@ -25,13 +25,13 @@
         "@harlem/extension-transaction": "^2.3.1",
         "@harlem/plugin-devtools": "^2.3.1",
         "date-fns": "^2.28.0",
-        "date-fns-tz": "^1.2.2",
+        "date-fns-tz": "^1.3.3",
         "flex-layout-attribute": "^1.0.3",
-        "vue": "^3.2.31"
+        "vue": "^3.2.33"
     },
     "devDependencies": {
-        "@vitejs/plugin-vue": "^2.2.0",
-        "@vue/compiler-sfc": "^3.2.31",
-        "vite": "2.8.2"
+        "@vitejs/plugin-vue": "^2.3.1",
+        "@vue/compiler-sfc": "^3.2.33",
+        "vite": "2.9.5"
     }
 }

app/src/stores/app/store.ts

@@ -2,6 +2,7 @@ import getState from './state';
 import actionExtension from '@harlem/extension-action';
 import composeExtension from '@harlem/extension-compose';
 import storageExtension from '@harlem/extension-storage';
+import resetExtension from '@harlem/extension-reset';
 
 import {
     NAME,
@@ -28,5 +29,6 @@ export const {
                 MUTATIONS.updateTime,
             ],
         }),
+        resetExtension(),
     ],
 });

core/package.json

@@ -43,6 +43,6 @@
         "vue": "^3.2.0"
     },
     "devDependencies": {
-        "vue": "^3.2.0"
+        "vue": "^3.2.33"
     }
 }

core/src/constants.ts

@@ -28,6 +28,7 @@ export const EVENTS = {
     },
     devtools: {
         update: 'devtools:update',
+        reset: 'devtools:reset',
     },
 } as const;
 

docs/package.json

@@ -12,14 +12,14 @@
         "build": "vuepress build src"
     },
     "dependencies": {
-        "@vuepress/plugin-docsearch": "^2.0.0-beta.35",
-        "@vuepress/plugin-google-analytics": "^2.0.0-beta.35",
-        "vuepress": "^2.0.0-beta.35",
-        "vuepress-vite": "^2.0.0-beta.35"
+        "@vuepress/plugin-docsearch": "^2.0.0-beta.38",
+        "@vuepress/plugin-google-analytics": "^2.0.0-beta.38",
+        "vuepress": "^2.0.0-beta.39",
+        "vuepress-vite": "^2.0.0-beta.39"
     },
     "devDependencies": {
         "dotenv": "^16.0.0",
-        "postcss": "^8.4.6",
+        "postcss": "^8.4.12",
         "postcss-loader": "^6.2.1"
     }
 }

examples/vite-ts-actions/package.json

@@ -13,10 +13,10 @@
         "@harlem/extension-reset": "^2.3.0",
         "@harlem/extension-storage": "^2.3.0",
         "@harlem/plugin-devtools": "^2.3.0",
-        "vue": "^3.2.31"
+        "vue": "^3.2.33"
     },
     "devDependencies": {
-        "@vitejs/plugin-vue": "^2.2.4",
-        "vite": "^2.8.5"
+        "@vitejs/plugin-vue": "^2.3.1",
+        "vite": "^2.9.5"
     }
 }

examples/vite-ts/package.json

@@ -12,10 +12,10 @@
         "@harlem/extension-reset": "^2.3.0",
         "@harlem/extension-storage": "^2.3.0",
         "@harlem/plugin-devtools": "^2.3.0",
-        "vue": "^3.2.31"
+        "vue": "^3.2.33"
     },
     "devDependencies": {
-        "@vitejs/plugin-vue": "^2.2.4",
-        "vite": "^2.8.5"
+        "@vitejs/plugin-vue": "^2.3.1",
+        "vite": "^2.9.5"
     }
 }

extensions/action/package.json

@@ -48,6 +48,6 @@
     "devDependencies": {
         "@harlem/core": "^2.3.1",
         "@harlem/testing": "^2.3.1",
-        "vue": "^3.2.0"
+        "vue": "^3.2.33"
     }
 }

extensions/compose/package.json

@@ -47,6 +47,6 @@
     },
     "devDependencies": {
         "@harlem/core": "^2.3.1",
-        "vue": "^3.2.0"
+        "vue": "^3.2.33"
     }
 }

extensions/lazy/package.json

@@ -45,6 +45,6 @@
     "devDependencies": {
         "@harlem/core": "^2.3.1",
         "@harlem/testing": "^2.3.1",
-        "vue": "^3.2.0"
+        "vue": "^3.2.33"
     }
 }

extensions/reset/src/index.ts

@@ -41,6 +41,7 @@ export default function resetExtension<TState extends BaseState>() {
         }
 
         store.on(EVENTS.store.created, () => snapshot = clone(store.state) as TState);
+        store.on(EVENTS.devtools.reset, () => reset());
 
         return {
             reset,

package.json

@@ -4,6 +4,7 @@
     "description": "Simple, unopinionated, lightweight and extensible state management for Vue 3",
     "repository": "https://github.com/andrewcourtice/harlem.git",
     "author": "Andrew Courtice <[email protected]>",
+    "packageManager": "[email protected]",
     "license": "MIT",
     "private": true,
     "workspaces": [
@@ -23,19 +24,19 @@
         "lint": "eslint \"**/@(src|test)/**/@(*.ts|*.js)\""
     },
     "devDependencies": {
-        "@commitlint/cli": "^16.2.1",
+        "@commitlint/cli": "^16.2.3",
         "@commitlint/config-conventional": "^16.2.1",
-        "@typescript-eslint/eslint-plugin": "^5.12.0",
-        "@typescript-eslint/parser": "^5.12.0",
+        "@typescript-eslint/eslint-plugin": "^5.19.0",
+        "@typescript-eslint/parser": "^5.19.0",
         "c8": "^7.11.0",
-        "eslint": "^8.9.0",
-        "happy-dom": "^2.41.0",
+        "eslint": "^8.13.0",
+        "happy-dom": "^2.55.0",
         "husky": "^7.0.4",
         "jsdom": "^19.0.0",
         "lerna": "^4.0.0",
         "standard-changelog": "^2.0.27",
-        "tsup": "^5.11.13",
-        "typescript": "^4.5.5",
-        "vitest": "^0.5.7"
+        "tsup": "^5.12.5",
+        "typescript": "^4.6.3",
+        "vitest": "^0.9.3"
     }
 }

packages/utilities/package.json

@@ -41,6 +41,6 @@
         "vue": "^3.2.0"
     },
     "devDependencies": {
-        "vue": "^3.2.0"
+        "vue": "^3.2.33"
     }
 }

plugins/devtools/package.json

@@ -43,7 +43,7 @@
     },
     "dependencies": {
         "@harlem/utilities": "^2.3.1",
-        "@vue/devtools-api": "^6.0.11"
+        "@vue/devtools-api": "^6.1.4"
     },
     "devDependencies": {
         "@harlem/core": "^2.3.1"

plugins/devtools/src/index.ts

@@ -196,7 +196,7 @@ function getMutationHook(api: DevtoolsPluginApi<unknown>, logType?: LogType): Ev
                 title: 'Mutation',
                 subtitle: store,
                 groupId: store,
-                time: Date.now(),
+                time: api.now(),
                 data: payload,
                 meta: {
                     store: store,
@@ -242,6 +242,18 @@ export default function createDevtoolsPlugin(options: Partial<Options> = OPTIONS
                     id: DEVTOOLS_ID,
                     icon: 'source',
                     treeFilterPlaceholder: 'Search stores',
+                    stateFilterPlaceholder: 'Search state',
+                    nodeActions: [
+                        {
+                            icon: 'replay',
+                            tooltip: 'Reset store',
+                            action: nodeId => eventEmitter.emit(EVENTS.devtools.reset, {
+                                sender: SENDER,
+                                store: nodeId,
+                                data: nodeId,
+                            }),
+                        },
+                    ],
                 });
 
                 api.addTimelineLayer({