json api形式のスネークケースのレスポンスをキャメルケースにする[jsona]

スネークケースのレスポンスをキャメルケースにしたい

背景

フロントエンド側でapiつなぎこみ作業していて、
サーバーからのレスポンスがスネークケースで、
そのままフロント側で使うとeslintエラーになる。。。
そこでスネークケースをキャメルケースに手動で変換する。。。 ← これがめんどい、なんとかしたい

対処

こんな感じのレスポンスが来たとする

{
  "data": {
    "id": "1",
    "type": "movie",
    "attributes": {
      "name": "test movie",
      "year": null,
      "is_released": true,
      "director_name": "hoge"
    }
  }
}

まず、jsonaというライブラリを使って、扱いやすい形にする

import axios from 'axios'
import Jsona from 'jsona'

const dataFormatter = new Jsona()
const getData = async () => {
    try {
        const response = await axios.get('/data')
        console.log(dataFormatter.deserialize(response))
    } catch (error) {
        console.log(error)
    }
}

// console.logの結果
{
  type: 'movie',
  id: '1',
  name: 'test movie',
  year: null,
  is_released: true, // ここと
  director_name: 'hoge' // ここをキャメルケースにしたい
}

jsonaのオプションにいい感じのがある
jsonaの初期化時にオプションとして、SwitchCaseJsonMapperを下のように渡せば良い

import Jsona, { SwitchCaseJsonMapper } from 'jsona

const dataFormatter = new Jsona({
    jsonPropertiesMapper: new SwitchCaseJsonMapper({
        switchChar: '_'
    })
})

こうすることで先ほどのconsole.logの結果が、下のようにキャメルケースになる

{
  type: 'movie',
  id: '1',
  name: 'test movie',
  year: null,
  isReleased: true,
  directorName: 'hoge'
}