[Bug]: Copyright declaration doesn't work with Babel translation

[ryangrundy7]

Describe the bug

When upgrading to 72.1.0, I updated the copyrightDeclaration to have a text parameter as required. When doing so, the copyright section doesn't look to be rendering the Copyright symbol or the break.

It looks as though the copyright declaration doesn't work correctly with the Babel translation function when it's surrounding text e.g 'copyright': _('Crown copyright and database rights 2020 OS 100019153.'). We need to keep this function in to keep the Welsh translations on the page. The page gets translated correctly but those symbols and break aren't rendered still.

Expected behaviour / outcome

Expected behavoiour is for the copyright declaration to work as expected with the Babel translation and render both the copyright symbol and break.

List the steps necessary to reproduce the bug

Pass the copyright declaration string using gettext translation system and you should be able to replicate it.

Additional context

From looking into the _macro.njk for the Footer, it looks like the string concatenation used is not working correctly when its got the _() passed into it.

{% set copyrightDeclaration = '&copy; ' + params.copyrightDeclaration.copyright + '<br /> ' + params.copyrightDeclaration.text %}

I've had a play around with the code and managed to get it working in a couple of ways. The first was by replacing the + with the ~ operator. In Jinja, this is the recommended way to string concatenation. https://jinja.palletsprojects.com/en/stable/templates/#math I'm not sure if this is the correct way for Nunjucks, so this might not be the best solution.

{% set copyrightDeclaration = '&copy; ' ~ params.copyrightDeclaration.copyright ~ '<br /> ' ~ params.copyrightDeclaration.text %}

Another way to do it would be passing all the values in as a list and doing a join on it then. I found this way online when looking into Nunjucks' string concatenation.

{% set copyrightDeclaration = ['&copy; ', params.copyrightDeclaration.copyright,'<br /> ', params.copyrightDeclaration.text] | join %}

What version of the ONS Design System are you using?

72.1.0

What device(s) are you using?

Desktop

What operating system(s) are you using?

macOS

What browser(s) are you using?

Chrome

[MagdalenaLarge]

hello @ryangrundy7 , Thank you for raising this issue. We will contact you shortly once we resolve it.