How to use <FormattedMessage id="qr.button.done" />

Hi, I’m making my plugin, it working nicely, but i have some minor issues with making translation work:
I made a plugin with strapi:generate plugin

I’ve been studying repo in some places this used:

<FormattedMessage id="qr.button.cancel" />

i defined my translation/en.json like so:

{
  "qr.button.cancel": "Cancel",
  "qr.button.done": "OK",
}

Switched Admin language to English, however i get on my frontend:
image

if i do

<FormattedMessage id={getTrad("qr.button.done")} /> 

everything in order, but i would like to know, is there any more steps necessary to make first variant work?