Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Feature]: Support configuration of com_braze_push_small_notification_icon (and possibly others) via this plugin #18

Open
joeyuscca opened this issue Apr 11, 2023 · 4 comments

Comments

@joeyuscca
Copy link

What problem are you facing?

When setting up push notifications for android following the expo docs here there was no mention of custom small icons, as well as other custom configuration that is available through the standard docs via configuration in the braze.xml file.

I was stuck with one of those sexy mono-color squares for a small icon until I stumbled across the standard integration docs and realized what was up.

Screenshot 2023-04-10 at 10 59 01 PM

To simplify the workflow and avoid needing to edit the braze.xml file directly, it'd be nice if some new config options were added to ConfigProps and the ANDROID_CONFIG_MAP so that way these items could be configured when calling, withBraze.

The workaround described allows me to do this by passing config including these to withBraze

  'notificationSmallIcon': '@drawable/notification_icon',
  'notificationAccentColor': '@color/notification_icon_color'

Screenshot 2023-04-10 at 11 24 44 PM

Workarounds

As an npm postinstall I currently run this script to modify ANDROID_CONFIG_MAP and withBrazeAndroid implementation so that I can set notification icon and accent color with the config I pass to withBraze.

const brazeAndroidConstantsPath = `${process.cwd()}/node_modules/@braze/expo-plugin/build/brazeAndroidConstants.js`;
let brazeAndroidConstantsContents = fs.readFileSync(brazeAndroidConstantsPath).toString();
brazeAndroidConstantsContents = brazeAndroidConstantsContents.replace(
  'exports.ANDROID_CONFIG_MAP = {',
  `exports.ANDROID_CONFIG_MAP = {
    "notificationSmallIcon": ["com_braze_push_small_notification_icon", 'drawable'],
    "notificationAccentColor": ["com_braze_default_notification_accent_color", 'color'],`);
fs.writeFileSync(brazeAndroidConstantsPath, brazeAndroidConstantsContents);

const withBrazeAndroidPath = `${process.cwd()}/node_modules/@braze/expo-plugin/build/withBrazeAndroid.js`;
let withBrazeAndroidContents = fs.readFileSync(withBrazeAndroidPath).toString();
withBrazeAndroidContents = withBrazeAndroidContents.replace(`break;
            }`, `break;
                default:
                    brazeXml += \`<\${xmlKeyType} name="\${xmlKeyName}">\${value}</\${xmlKeyType}>\`;
            }`);
fs.writeFileSync(withBrazeAndroidPath, withBrazeAndroidContents);

Ideal Solution

Something along the lines of this...

  • Add the following entries to the ANDROID_CONFIG_MAP portion of src/brazeAndroidConstants.ts:
"notificationSmallIcon": ["com_braze_push_small_notification_icon", 'drawable'],
"notificationAccentColor": ["com_braze_default_notification_accent_color", 'color'],
  • Add the following entries to ConfigProps in src/types.ts:
notificationSmallIcon?: string,
notificationAccentColor?: string
  • Add a default xml tag case to src/withBrazeAndroid - or add new explicit cases for drawable/color if you prefer that
default:
    brazeXml += `<${xmlKeyType} name="${xmlKeyName}">${value}</${xmlKeyType}>`;

Other Information

It'd be worth considering other braze.xml configurable options to add to this type/map as well. Unless there are particular reasons to exclude certain options from being configured via withBraze might as well add them.

@radixdev
Copy link

Hi @joeyuscca ,

We're tracking this internally and will update this issue once support is live.

Thanks for filing,
Julian

@pwfcurry
Copy link

pwfcurry commented Oct 6, 2023

Hi @radixdev, any update on this? It looks like the fields have been added 🎉 (thanks), but the TypeScript types.ts file hasn't been updated to reflect.

https://www.braze.com/docs/developer_guide/platform_integration_guides/react_native/react_sdk_setup/#step-2-complete-native-setup

https://github.com/braze-inc/braze-expo-plugin/blob/main/plugin/src/brazeAndroidConstants.ts#L68-L74

https://github.com/braze-inc/braze-expo-plugin/blob/main/plugin/src/types.ts

The following appear to be missing:

androidFirebaseMessagingFallbackServiceClasspath
androidFirebaseMessagingFallbackServiceEnabled
androidNotificationAccentColor
androidNotificationLargeIcon
androidNotificationSmallIcon
androidPushNotificationHtmlRenderingEnabled

@Noitham
Copy link

Noitham commented Apr 11, 2024

Hey @joeyuscca, how's possible to add @drawable assets via the expo app.json?

@luke-bryant-unmind
Copy link

Hey @joeyuscca, how's possible to add @drawable assets via the expo app.json?

I'm also having problems with this. To elaborate on the question, the example in the app.json in the docs is like this:

          "androidNotificationLargeIcon": "@drawable/custom_app_large_icon",
          "androidNotificationSmallIcon": "@drawable/custom_app_small_icon",

I'm trying to use expo Continuous Native Generation, so I can't just add these assets to android/app/src/main/res without writing a custom plugin. Other icons configured in expo take a path to an asset, which is injected by expo during prebuild. Ideally these fields would support this format as well.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

5 participants