search

CodeDredd / pinia-orm

The Pinia plugin to enable Object-Relational Mapping access to the Pinia Store.
https://pinia-orm.codedredd.de/
MIT License
434 stars 38 forks source link

Store is not reactive in Vue 2 #1772

Closed Graphmaxer closed 2 months ago

Graphmaxer commented 5 months ago

Environment

With Vue 2.7.16 and pinia-orm 1.7.2

Reproduction

Not working with pinia-orm 1.7.2 and vue 2: https://stackblitz.com/edit/vue2-vite-starter-yrebbd Working with pinia-orm 1.6.7 and vue 2: https://stackblitz.com/edit/vue2-vite-starter-a2jqrw Working with pinia-orm 1.7.2 and vue 3: https://stackblitz.com/edit/vue2-vite-starter-jn2ym2

Describe the bug

When using Vue 2, Object.assign is breaking reactivity. When an entity is inserted into a repository, the getter using the repository are not updated.

Additional context

It is possible to verify that the pinia store state is changed via https://pinia.vuejs.org/core-concepts/state.html#Subscribing-to-the-state With Vue 2, we can see that the inner store state is not properly updated via the Object.assign used in pinia-orm 1.7

Logs

No response

khamaileon commented 5 months ago

I have the same problem here. I'd like to test the PR in my project but I don't know how to install a JS package from a repo. It's pretty simple in Python but I'm not sure it's possible with NPM.

Graphmaxer commented 5 months ago

To test the PR you can clone my repo with git clone git@github.com:Graphmaxer/pinia-orm.git and switch to the branch fix-vue-2-reactivity then you can build the pinia-orm package via pnpm install & pnpm build and finally you can copy the dist inside your node_modules project via cp -r ../pinia-orm/packages/pinia-orm/dist/ node_modules/pinia-orm/. If you use vite you must do a vite --force to clean cache and re-optimize deps.

EDIT: I found a simpler way, you can just do npm install 'https://gitpkg.now.sh/Graphmaxer/pinia-orm/packages/pinia-orm?fix-vue-2-reactivity-with-dist' in your project to test the PR

khamaileon commented 5 months ago

Thanks @Graphmaxer, that's exactly the kind of solution I had in mind! And good news, the fix works in my case. I hope it will be released soon, it's a critical bug.

Graphmaxer commented 5 months ago

That's good to hear, I just discovered this tool to easily create npm packages with github repository https://gitpkg.vercel.app Now it's time to wait for the review and the release :)

CodeDredd commented 2 months ago

@Graphmaxer Well its merged and can be testet with pina-orm edge channel: https://pinia-orm.codedredd.de/guide/getting-started/quick-start#edge-channel

Thank you for the PR and patients ❤️