[RNMobile] Prevent unnecessary re-renders of RichText component due t…

…o color palettes prop (#40615)

packages/rich-text/src/component/index.native.js

@@ -51,6 +51,15 @@ const unescapeSpaces = ( text ) => {
 	return text.replace( / | /gi, ' ' );
 };
 
+// The flattened color palettes array is memoized to ensure that the same array instance is
+// returned for the colors palettes. This value might be used as a prop, so having the same
+// instance will prevent unnecessary re-renders of the RichText component.
+const flatColorPalettes = memize( ( colorsPalettes ) => [
+	...( colorsPalettes?.theme || [] ),
+	...( colorsPalettes?.custom || [] ),
+	...( colorsPalettes?.default || [] ),
+] );
+
 const gutenbergFormatNamesToAztec = {
 	'core/bold': 'bold',
 	'core/italic': 'italic',
@@ -1260,14 +1269,10 @@ export default compose( [
 
 		const settings = getSettings();
 		const baseGlobalStyles = settings?.__experimentalGlobalStylesBaseStyles;
-		const colorsPalettes = settings?.__experimentalFeatures?.color?.palette;
-		const allColorsPalette = [
-			...( colorsPalettes?.theme || [] ),
-			...( colorsPalettes?.custom || [] ),
-			...( colorsPalettes?.default || [] ),
-		];
-		const colorPalette = colorsPalettes
-			? allColorsPalette
+
+		const colorPalettes = settings?.__experimentalFeatures?.color?.palette;
+		const colorPalette = colorPalettes
+			? flatColorPalettes( colorPalettes )
 			: settings?.colors;
 
 		return {