const {Subject} = require("rxjs")
const {createStore} = require("redux")

function addItem(item) {
    return {
        type: "ADD_ITEM",
        payload: item,
        property: "array"
    }
}

const reducer = (state = {array: []}, action) => {
    switch (action.type) {
        case "ADD_ITEM" :
            return {...state, array: [...state.array, action.payload]}
        default:
            return state
    }
}

class SubscriberService {
    constructor() {
        // Build non-nested structure for all observables
        this.subscribeTo = {array: new Subject()}
    }

    getObservable(property) {
        return this.subscribeTo[property]
    }

    notify(property, value) {
        this.getObservable(property).next(value)
    }
}

const subscriberService = new SubscriberService()

class StoreService {
    constructor() {
        this.store = createStore(reducer)
        this.subscriberService = subscriberService // Angular-Injection
    }

    dispatch(action) {
        this.store.dispatch(action)
        this.subscriberService.notify(action.property, action.payload)
    }
}

const storeService = new StoreService()

const blacklistSubscriber = subscriberService.getObservable("array").subscribe((x) => {
    console.log("array changed to", x)
})

storeService.dispatch(addItem(1))
storeService.dispatch(addItem(2))

blacklistSubscriber.unsubscribe()