From 0df3419a4649a23a07123a383e560453a282bcb3 Mon Sep 17 00:00:00 2001
From: Tim Deschryver <28659384+timdeschryver@users.noreply.github.com>
Date: Mon, 24 Apr 2023 20:12:41 +0200
Subject: [PATCH] fix(store-devtools): correctly import state when feature is
 set to true (#3855)

Closes #3636
---
 modules/store-devtools/spec/config.spec.ts | 26 ++++++++++++++++++++++
 modules/store-devtools/src/config.ts       | 10 ++++++++-
 projects/example-app/src/app/app.module.ts |  1 -
 3 files changed, 35 insertions(+), 2 deletions(-)

diff --git a/modules/store-devtools/spec/config.spec.ts b/modules/store-devtools/spec/config.spec.ts
index 986b9b2e39..b5c12100e7 100644
--- a/modules/store-devtools/spec/config.spec.ts
+++ b/modules/store-devtools/spec/config.spec.ts
@@ -109,4 +109,30 @@ describe('StoreDevtoolsOptions', () => {
       },
     });
   });
+
+  it('import "true" is updated to "custom"', () => {
+    // setting import to true results in an error while importing a persisted state into the devtools
+    // the imported state only contains the new state without the actions (and config)
+    // while testing this, the imported state also wasn't correct and contained the initial state values
+    const config = createConfig({
+      features: {
+        import: true,
+      },
+    });
+    expect(config).toEqual({
+      maxAge: false,
+      monitor: noMonitor,
+      actionSanitizer: undefined,
+      stateSanitizer: undefined,
+      name: DEFAULT_NAME,
+      serialize: false,
+      logOnly: false,
+      autoPause: false,
+      features: {
+        import: 'custom',
+      },
+      trace: false,
+      traceLimit: 75,
+    });
+  });
 });
diff --git a/modules/store-devtools/src/config.ts b/modules/store-devtools/src/config.ts
index 460c97aaa0..e6a014f81b 100644
--- a/modules/store-devtools/src/config.ts
+++ b/modules/store-devtools/src/config.ts
@@ -172,7 +172,15 @@ export function createConfig(
   const logOnly = options.logOnly
     ? { pause: true, export: true, test: true }
     : false;
-  const features = options.features || logOnly || DEFAULT_OPTIONS.features;
+  const features: NonNullable<Partial<StoreDevtoolsConfig['features']>> =
+    options.features ||
+    logOnly ||
+    (DEFAULT_OPTIONS.features as NonNullable<
+      Partial<StoreDevtoolsConfig['features']>
+    >);
+  if (features.import === true) {
+    features.import = 'custom';
+  }
   const config = Object.assign({}, DEFAULT_OPTIONS, { features }, options);
 
   if (config.maxAge && config.maxAge < 2) {
diff --git a/projects/example-app/src/app/app.module.ts b/projects/example-app/src/app/app.module.ts
index 2b97c0a72b..8528757b6b 100644
--- a/projects/example-app/src/app/app.module.ts
+++ b/projects/example-app/src/app/app.module.ts
@@ -62,7 +62,6 @@ import { AppComponent } from '@example-app/core/containers';
      */
     StoreDevtoolsModule.instrument({
       name: 'NgRx Book Store App',
-
       // In a production build you would want to disable the Store Devtools
       // logOnly: !isDevMode(),
     }),