Platform: Example: Remove @ngrx/db

[brandonroberts]

Its not being maintained and there are better solutions for persisting state across page loads.

Describe any alternatives/workarounds you're currently using

Other information:

If accepted, I would be willing to submit a PR for this feature

[ ] Yes (Assistance is provided if you need help submitting a pull request)
[ ] No

[adrianfaciu]

Any suggestion for what should be used instead ?

[agalazis]

any ideas? i see 3k downloads per month on npm. My project does not currently depend on it but any recommendations appreciated

[timdeschryver]

What about localStorage, that we could also wrap in a meta-reducer?

[brandonroberts]

That's what I had in mind

[King-i]

Hi all,

I have a few days worth of spare time that I can devote to this and I think it is about time I cut my teeth on returning something back to the community, removing the @ngrx/db dependencies from the example app and updating the tests is simple enough, as for a replacement, If you can point me in the direction of how you envision that working?

Single action to store away state slices as a simple key/value? e.g { type: [action type], state: [state to store] } which a @ngrx/store consumer can dispatch from anywhere?
Retrieving the values, leave that up to the consumer or provide storage selectors?

Kind regards Paul

[timdeschryver]

Hi @King-i, we're glad to hear that!

If I'm not mistaken, the only place where ngrx/db is used would be in collection.effects.

The first step of the migration to localStorage would be to replace the db with localStorage. You can use the current setup and you won't need to create additional actions.

Afterwards, we could perhaps remove the whole CollectionEffect in favor of a meta-reducer that would persist the collection state and it would also rehydrate the state on the initial start up.

[King-i]

Wicked, Ill get right on that, it'll be my first public PR so i may need a little hand holding at the end :)

[timdeschryver]

Awesome! Feel free to ping us whenever you have questions 😄

One more thing 😅
You also might have to update some tests, and also your e2e test (with cypress) at https://github.com/ngrx/platform/blob/master/projects/example-app-cypress/integration/round-trip.spec.ts#L8.

[King-i]

Hi,
I managed to get a cypress up and running locally, this is the behaviour that is happening, im not sure if cypress clears down localStorage in between test cases? (Note the collection is added into local store but is then removed, you have to catch it as its really fast). As i have never used cypress previously any help would be appreciated, there isn't any errors during unit tests and example works flawlesy in both JIT and AOT.

EDIT:

Found this issue: https://github.com/cypress-io/cypress/issues/686
Added hacky workaround as discussed here: https://stackoverflow.com/questions/50471047/preserve-cookies-localstorage-session-across-tests-in-cypress

Tests are now passing, but my lunch break got ruined :cake: !! :dancer:

[allens]

Please maintain @ngrx/db rather than replace it with localStorage. This change has made the example app a poorer example. @ngrx/db uses IndexedDb which is very different to localStorage. When I first came across NgRx I found the use of @ngrx/db very useful.

What was wrong with @ngrx/db anyway? It doesn't need much support besides upgrading Angular version once in a while. If you'd put a request out for supporting @ngrx/db that would have been better.

[allens]

PS there is an open issue to move @ngrx/db to the platform #42 so it was a bit of a surprise that @ngrx/db has been removed from the example app!

[allens]

Also it would be much more enlightening to see the correct way for the store to be rehyrdated from indexeddb rather than localStorage (because former is async and therefore a much trickier proposition).