efox-notify-react-standalone

React Notify package built from the working WooEcomm integration.

What it provides

• notification inbox React UI
• notify inbox API helpers
• project-scoped device identity helpers
• NotifyClient bootstrap helpers
• useNotifyAutoSubscribe hook
• sw.js service worker asset

Install

npm install efox-notify-react-standalone

Copy service worker

Copy the package service worker to your app public folder:

npx efox-notify-copy-assets ./public

This creates:

• public/sw.js

Add SDK script

Add in index.html:

<script src="https://api-notify.efoxtechnologies.com/sdk/notify-client.js"></script>

React usage

import { NotificationsPage, useNotifyAutoSubscribe } from "efox-notify-react-standalone";

function HomePage() {
  useNotifyAutoSubscribe({
    merchantId: 8,
    serviceId: 6,
    modeId: 10,
    apiKey: "YOUR_MERCHANT_API_KEY",
    vapidPublicKey: "YOUR_VAPID_PUBLIC_KEY",
    notifyApiBaseUrl: "https://api-notify.efoxtechnologies.com",
    backendBaseUrl: "https://your-backend-host.com",
    projectScopeKey: window.location.origin + "/"
  });

  return null;
}

Inbox page

import { NotificationsPage, createNotifyBootstrapConfig } from "efox-notify-react-standalone";

const notifyConfig = createNotifyBootstrapConfig({
  merchantId: 8,
  serviceId: 6,
  modeId: 10,
  apiKey: "YOUR_MERCHANT_API_KEY",
  vapidPublicKey: "YOUR_VAPID_PUBLIC_KEY",
  notifyApiBaseUrl: "https://api-notify.efoxtechnologies.com",
  backendBaseUrl: "https://your-backend-host.com",
  projectScopeKey: window.location.origin + "/"
});

export default function NotificationsRoute() {
  return <NotificationsPage config={{ handlerUrl: notifyConfig.notifyInboxUrl, deviceStorageKey: notifyConfig.deviceStorageKey }} />;
}

Notes

• service worker must be available as /sw.js
• browser device id is project-scope based
• call window.NotifyClient.clearLocalDeviceUserId() only on logout
• this package expects a backend inbox API compatible with NotifyInbox.ashx