Missing related polymorphic model on store entities after data transformation

[yoelpc4]

Missing related polymorphic model on store entities after data transformation

[cuebit]

While this isn't an issue with the axios plugin per-se, it seems to point to either Vuex ORM or json-api-response-converter.

Currently a morphTo relation expects the id and type to exist in the given record since it doesn't need to attach foreign keys to the related model. Given your transformed data doesn't provide that, the necessary relations are not generated. For example, the following payload will generate the relations for a morphTo:

Activity.insert({
  data: {
    id: 'a1',
    causer_id: 'u1',
    causer_type: 'users',
    causer: { id: 'u1', name: 'Admin' }
  }
})

I'm not sure if this is Vuex ORM just not generating the missing foreign keys (something @kiaking could shed light on perhaps?)... But As a workaround, you could attach the would-be foreign keys to the Activity model in the transformer:

static apiConfig = {
  dataTransformer: (response) => {
    const data = new JsonApiResponseConverter(response.data).formattedResponse

    data.forEach((item, index) => {
      if (item.causer) {
        data[index].causer_id = item.causer.id
        data[index].causer_type = 'users'
      }
      if (item.subject) {
        data[index].subject_id = item.subject.id
        data[index].subject_type = 'institutes'
      }
    })

    return data
  }
}

Here's a workable fork.

[yoelpc4]

Thanks for responding my issue @cuebit, the reason why I'm asked here instead of on vuex-orm package, is because of the dataTransformer timing so that I can provides data with expected morph to format.

This case is using User as causer and Institute as subject, anyway how can I guess the type of related data if I have registered 44 models on vuex-orm database?

Another point to mention is JSON:API prefers kebab-case on resource's type, but vuex-orm prefers snake-case on model's entity. Should I make a morph map to solve this case?