What?

Resolves an Android issue where text was being cut off in the OfflineStatus component when bold text was being used.

Before	After

Why?

This appears to be a legitimate bug in React Native:

• Text component cuts part of the text if fontWeight bold is used facebook/react-native#21729
• Support isBoldTextEnabled for Android react-native-community/discussions-and-proposals#477

When a bold typeface style is used, the last node of the text appears to be removed.

When there are two or more words in one <Text> element, the last word is removed:

<Text>Working Offline</Text>
→ "Working "

When there is one word in a <Text> element, the last letter is removed:

<Text>Working</Text><Text>Offline</Text>
→ "Workin Offlin"

When there are two or more words in one <Text> element and a space is added, the space is removed:

<Text>Working Offline </Text>
→ "Working Offline"

How?

This PR adds a space to the end of the element in OfflineStatus to workaround the issue. This space does not appear to impact the UI.

Note: the space appears outside of the i18n string to avoid invoking the i18n-no-flanking-whitespace linter error.

<Text style={ textStyle }>{ __( 'Working Offline' ) } </Text>

This PR also removes an extra <View style={ containerStyle }></View> that appears to be redundant from its parent.

Testing Instructions

1. On an Android device, set the device to use a bold font within Accessibility Settings.
2. Open a post in the Editor and turn off Network Connectivity via Airplane Mode.
3. Observe that the offline status indicator displays the text "Working Offline" next to a no-wifi icon, and that text is not cut off as in the "Before" screenshot above.

Testing note: I was not able to consistently reproduce the original issue across various Android devices. I was not able to replicate the issue on a Samsung Galaxy FE20 or Google Pixel 6 Pro, but could consistently replicate it on a Pixel One.