android: fix various places still using default Material Teal (#3555)

These places include TextInput cursor, TextInput selection, and the
spinner (ActivityIndicator) --- the default Material Teal is out of
place wherever it shows up.

This sets Expo's primaryColor to #1083fe, which is the color that
defaultTheme.palette.default.brandText resolves to, then applies it as
the native accent color via a plugin because Expo doesn't apply the
accent color.

1 files changed, 25 insertions, 0 deletions

diff --git a/plugins/withAndroidStylesAccentColorPlugin.js b/plugins/withAndroidStylesAccentColorPlugin.js
new file mode 100644
index 000000000..c45553788
--- /dev/null
+++ b/plugins/withAndroidStylesAccentColorPlugin.js
@@ -0,0 +1,25 @@
+/**
+ * @file Set accent color to primaryColor from app.config.js.
+ * This way we get a sane default color for spinners, text inputs, etc.
+ */
+
+const {withAndroidStyles, AndroidConfig} = require('@expo/config-plugins')
+
+module.exports = function withAndroidStylesAccentColorPlugin(appConfig) {
+  return withAndroidStyles(appConfig, function (decoratedAppConfig) {
+    try {
+      decoratedAppConfig.modResults = AndroidConfig.Styles.assignStylesValue(
+        decoratedAppConfig.modResults,
+        {
+          add: true,
+          parent: AndroidConfig.Styles.getAppThemeLightNoActionBarGroup(),
+          name: 'colorAccent',
+          value: '@color/colorPrimary',
+        },
+      )
+    } catch (e) {
+      console.error(`withAndroidStylesAccentColorPlugin failed`, e)
+    }
+    return decoratedAppConfig
+  })
+}