Collection documents became duplicate when adding new document

[lnatu]

Steps to reproduce the behavior

1. Use vuexfire to bind firestore collection and show it to the UI
2. Have a function to add a document to the same collection

Expected behavior

The created document appear in the UI

Actual behavior

The created document appear in the UI and the other documents turned into the new created document

Additional information

Code to get the collection
bindPosts: firestoreAction(({ bindFirestoreRef }) => bindFirestoreRef( 'posts', db .collection('post-feed') .where('type', '==', PostType.POST) .where('isDeleted', '==', false) .orderBy('createdAt', 'desc'), ), ),

Code the create a new document
createPost: firestoreAction(async (_, { post }: { post: IPost }) => { await db.doc(posts/${post.id}).set(post) await db.doc(post-feed/${post.id}).set({ postId: post.id, post: db.doc(posts/${post.id}), type: post.type, isDeleted: post.isDeleted, createdAt: firestore.Timestamp.now(), updatedAt: firestore.Timestamp.now(), }) }),
Error shown when added a new document