fix: ensure correct url is used for "subscribe to push window" (#13)

The correct url was used when using magicbell-react, but as the url was constructed using axios, and axios is replaced with redaxios in the embeddable, it did not function when using the embeddable.

.changeset/beige-coins-report.md

@@ -0,0 +1,5 @@
+---
+'@magicbell/magicbell-react': patch
+---
+
+Fix embeddable web notifications: since embeddable aliases axios (redaxios) and redaxios does not implement `.getUri`, the code was failing for the embeddable package (that uses redaxios) but not for the react package (that uses axios).

packages/react/package.json

@@ -77,7 +77,6 @@
  "@emotion/react": "^11.4.1",
  "@magicbell/react-headless": "4.2.2",
  "@tippyjs/react": "^4.2.5",
- "axios": "^0.27.2",
  "dayjs": "^1.11.5",
  "humps": "^2.0.1",
  "immer": "^9.0.7",

packages/react/src/components/EnablePushNotificationsBanner/EnablePushNotificationsBanner.tsx

@@ -1,7 +1,6 @@
 /** @jsxImportSource @emotion/react */
 import { css } from '@emotion/react';
 import { clientSettings, useConfig } from '@magicbell/react-headless';
-import axios from 'axios';
 import { path, pathOr } from 'ramda';
 import { useLocalStorage } from 'react-use';
 
@@ -35,18 +34,17 @@ export default function EnablePushNotificationsBanner() {
 
  const enablePushNotifications = () => {
  const subscribeUrl = path<string>(['webPush', 'config', 'subscribeUrl'], channels);
- const url = axios.getUri({
- url: subscribeUrl,
- params: {
- user_email: userEmail,
- user_external_id: userExternalId,
- background_color: theme.header.backgroundColor,
- text_color: theme.header.textColor,
- },
- });
+
+ const { backgroundColor, textColor } = theme.header;
+
+ const url = new URL(subscribeUrl);
+ if (userEmail) url.searchParams.append('user_email', userEmail);
+ if (userExternalId) url.searchParams.append('user_external_id', userExternalId);
+ if (backgroundColor) url.searchParams.append('background_color', backgroundColor);
+ if (textColor) url.searchParams.append('text_color', textColor);
 
  setRequestedAt(Date.now());
- openWindow(url);
+ openWindow(url.toString());
  };
 
  const closeBanner = () => {