1

I need to provide a translated string to a saga.

Simplified, I now have:

export function* createAppointment(action){
  yield put({ type: ACTION_REQUESTED, data: { content: 'Creating appointment', key: 'appointment' }});

  try {
    yield call(apiRequestWithToken, apiCreateAppointment);
    yield put({ type: ACTION_FINISHED, data: { type: 'success', content: 'Appointment created', key: 'appointment' }});
  } catch {
    yield put({ type: ACTION_FINISHED, data: { type: 'error', content: 'Appointment not created', key: 'appointment' }});
  }
}

The ACTION_ actions, trigger some tool (antd-messages) that shows growl-alike notification messages to the user.

I this case, it shows a "spinner" with 'Creating appointment' and then once finished, a success or error icon with the resp. message 'Appointment created' or 'Appointment not created'.

I need those strings translated. I want these strings in the messages, in any case, not hardcoded in my saga logic. The translations are available in components through a <LanguageProvider>.

I could pass the message along from the component, but that becomes quite messy quite fast. As can been seen in the example, the logic of the saga really determines what string is shown. Passing all the potential translated messages to the payload of intial action that triggers the createAppointment saga, could work. I'd then have to do something like content: action.data.message.actionFinishedError. But that gets ugly really fast, and prohibits me from interpolating variables, e.g. content: `Appointment not created. We got the error: ${response.error}`

How can I get a translated, formatted message as string from react-intl in saga? Is this possible at all?

I'm not very familiar with react, redux, saga and how this all should tie together, I'm not even sure if the React app that I inherited is setup "correct" - reactfull - in the first place. So please tell me if I'm approaching this all wrong: XY-problem.

berkes
  • 26,996
  • 27
  • 115
  • 206

0 Answers0