[Feat]: Support i18n placeholder input in Storybook | Fix [object Object] translations

[digiwand]

Describe the bug

i18n placeholder input is not supported in Storybook which results in translations outputting "[Object object]" when placeholder inputs are provided. Supporting this feature will help us have a more accurate representation of the rendered components.

Expected behavior

Current behavior: Storybook TokenAllowance page displays "Spending cap behavior for [object Object]"

Expected behavior: Storybook TokenAllowance page displays "Spending cap behavior for TST"

Screenshots

Steps to reproduce

1. run storybook yarn storybook
2. open a page that passes a second parameter to the t, translation function (placeholder input)
3. observe "[object Object]" displays instead of expected content

Error messages or log output

No response

Version

11.2.0

Build type

None

Browser

Chrome

Operating system

MacOS

Hardware wallet

No response

Additional context

No response

Severity

No response

[garrettbear]

Looks like this was working as of Jan 23 and then some other changes were made moving around test data. Doesn't appear to be an issue with i18n

[digiwand]

I believe I found the issue. In prod, join is a function. In storybook, it is undefined so we call parts.join('') in storybook which coerces the substitution object into [object Object] and joins this together with the other parts

storybook:

screenshot of substitution object in both storybook and prod: