baconjs / bacon.js

Functional reactive programming library for TypeScript and JavaScript

Home Page:https://baconjs.github.io

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

How to focus on and listen for partial object changes?

andpor opened this issue · comments

You have deprecated and no longer maintaining Bacon.Model and suggesting to use update() in conjunction with partial.lenses.

We have a project in which we use Bacon.Model extensively, primarily because it allows to update and receive notifications when parts of the state object changes and accomplish this with Lenses.

I am struggling to understand how to achieve similar functionality with just Bacon.update() and partial.lenses.

Perhaps you can provide a very short example?

In our case we have a deeply nested JSON model that can be described like this (being very simplistic):

model = {
product : {
id: string,
name: string
},
company: {
id: string,
name: string
}
compilation: {
selectedReports: [],
sectionIndex : []
sectionMap : {}
}
}

we modify and listen to notifications on product, company, compilation.selectedReports. Sometimes the nesting level is 3 or 4 and Lenses allow us to focus on those levels quite easily. One of the great benefits of using Lenses for something like this is that you can create components that only listen to updates they are interested in. For example, in some components we only care for changes to compilation.selectedReports and do not care what happen elsewhere. At the end though, we want to be able to retrieve/have access to the object at the root or the model as a whole.

You could also use https://github.com/calmm-js/bacon.atom which provides a similar model to Bacon.Model, in the sense that you get a mutable Property and can use lenses to focus on different parts of the data.

I'm sorry I don't have the time to write an example now.