mbnotify-app 1.0.2 → 1.0.5

package/README.md

@@ -0,0 +1,291 @@
+
+---
+
+# 🚀 mbnotify Ecosystem
+
+A **real-time push notification system** for web & mobile apps powered by MQTT.
+
+This ecosystem consists of two packages:
+
+* 📦 **mbnotify** → Send notifications (Backend / Server)
+* 📱 **mbnotify-app** → Receive notifications (Expo / React Native)
+
+---
+
+# 📦 1. mbnotify (Server / Sender)
+
+Send push notifications to devices instantly.
+
+## 📥 Installation
+
+```bash
+npm install mbnotify
+```
+
+## ⚡ Usage
+
+```js
+import { sendNotification } from "mbnotify";
+
+await sendNotification({
+  appName: "myapp",
+  token: "dev_xxxxxxxxxxxxx",
+
+  title: "Order Shipped 🚚",
+  body: "Your order has been shipped!",
+
+  icon: "https://cdn-icons-png.flaticon.com/512/1827/1827392.png",
+  image: "https://images.unsplash.com/photo-1586528116311-ad8dd3c8310d?w=1200",
+
+  url: "https://google.com",
+
+  data: {
+    orderId: "12345"
+  }
+});
+
+console.log("✅ Notification sent");
+```
+
+---
+
+## 🧾 Payload Options
+
+| Field   | Type   | Description          |
+| ------- | ------ | -------------------- |
+| appName | string | App identifier       |
+| token   | string | Device token         |
+| title   | string | Notification title   |
+| body    | string | Notification message |
+| icon    | string | Small icon URL       |
+| image   | string | Large image URL      |
+| url     | string | Deep link / redirect |
+| data    | object | Custom payload       |
+
+---
+
+## 🎯 Features
+
+* ⚡ Real-time delivery
+* 🌍 Works globally via MQTT
+* 📦 Lightweight API
+* 🔗 Supports deep linking
+* 🧠 Custom data payloads
+
+---
+
+# 📱 2. mbnotify-app (Client / Receiver)
+
+Receive notifications inside your **Expo / React Native app**.
+
+---
+
+## 📥 Installation
+
+```bash
+npm install mbnotify-app
+```
+
+Also install Expo notifications:
+
+```bash
+npx expo install expo-notifications
+```
+
+---
+
+## ⚙️ Setup
+
+### ✅ Required Fix (VERY IMPORTANT)
+
+React Native doesn't support some Node modules by default:
+
+```js
+import { Buffer } from "buffer";
+import process from "process";
+
+global.Buffer = Buffer;
+global.process = process;
+```
+
+---
+
+## 🚀 Basic Usage
+
+```js
+import { useEffect, useState } from "react";
+import { Text, View } from "react-native";
+import * as Notifications from "expo-notifications";
+
+import { requestPermission, getToken } from "mbnotify-app";
+
+// Show notifications in foreground
+Notifications.setNotificationHandler({
+  handleNotification: async () => ({
+    shouldShowAlert: true,
+    shouldPlaySound: true,
+    shouldSetBadge: false,
+  }),
+});
+
+export default function App() {
+
+  const [token, setToken] = useState(null);
+  const [status, setStatus] = useState("Initializing...");
+
+  useEffect(() => {
+
+    async function init() {
+
+      try {
+        setStatus("Requesting permission...");
+
+        const granted = await requestPermission();
+
+        if (!granted) {
+          setStatus("❌ Permission denied");
+          return;
+        }
+
+        setStatus("Connecting...");
+
+        const deviceToken = await getToken("myapp");
+
+        setToken(deviceToken);
+        setStatus("✅ Connected");
+
+        console.log("📱 Device token:", deviceToken);
+
+      } catch (err) {
+        console.error(err);
+        setStatus("❌ Error initializing");
+      }
+
+    }
+
+    init();
+
+  }, []);
+
+  return (
+    <View>
+      <Text>{status}</Text>
+      {token && <Text>{token}</Text>}
+    </View>
+  );
+}
+```
+
+---
+
+## 🔑 Functions
+
+### `requestPermission()`
+
+```js
+const granted = await requestPermission();
+```
+
+* Requests notification permission
+* Returns `true` / `false`
+
+---
+
+### `getToken(appName)`
+
+```js
+const token = await getToken("myapp");
+```
+
+* Connects to MQTT
+* Returns a **unique device token**
+
+---
+
+## 📲 Flow Overview
+
+```text
+[mbnotify-app] → Generates Token
+        ↓
+[Your Server] → Stores Token
+        ↓
+[mbnotify] → Sends Notification
+        ↓
+[Device] → Receives Notification 🚀
+```
+
+---
+
+## 🔥 Features
+
+* 📡 Real-time notifications (MQTT)
+* 📱 Expo compatible
+* 🔔 Foreground + Background support
+* 🔐 Unique device tokens
+* ⚡ Fast & lightweight
+
+---
+
+## ⚠️ Common Issues
+
+### ❌ MQTT Errors in React Native
+
+Fix:
+
+```js
+global.Buffer = require("buffer").Buffer;
+global.process = require("process");
+```
+
+---
+
+### ❌ Notifications not showing
+
+Make sure:
+
+* Permission is granted
+* `Notifications.setNotificationHandler` is configured
+* App is not restricted by OS battery settings
+
+---
+
+## 💡 Best Practices
+
+* Store tokens securely in DB
+* Use meaningful `appName`
+* Avoid sending too many notifications
+* Use `data` for deep linking/navigation
+
+---
+
+## 🧪 Example Use Case
+
+* 🛒 E-commerce → Order updates
+* 💬 Chat app → New messages
+* 📦 Delivery → Status tracking
+* 📊 SaaS → Alerts & updates
+
+---
+
+## 👨‍💻 Author
+
+**Manoj Gowda B R**
+Full Stack Developer (MERN)
+
+---
+
+## 🌟 Support
+
+If you like this project:
+
+⭐ Star the repo
+🐛 Report issues
+🚀 Contribute improvements
+
+---
+
+## 📜 License
+
+MIT License
+
+---

package/dist/cjs/index.d.ts

@@ -1,8 +1,2 @@
-/**
- * Request permission
- */
 export declare function requestPermission(): Promise<boolean>;
-/**
- * Get token + subscribe
- */
 export declare function getToken(appName: string, brokerUrl?: string): Promise<string>;

package/dist/cjs/index.js

@@ -2,21 +2,15 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.requestPermission = requestPermission;
 exports.getToken = getToken;
-const mqtt = require("mqtt/dist/mqtt");
+const mqtt_1 = require("mqtt");
 const Notifications = require("expo-notifications");
 const async_storage_1 = require("@react-native-async-storage/async-storage");
 const DEFAULT_BROKER = "wss://broker.hivemq.com:8884/mqtt";
 let client = null;
-/**
- * Request permission
- */
 async function requestPermission() {
     const { status } = await Notifications.requestPermissionsAsync();
     return status === "granted";
 }
-/**
- * Generate token
- */
 async function generateToken() {
     let token = await async_storage_1.default.getItem("mbnotify_token");
     if (!token) {
@@ -28,27 +22,23 @@ async function generateToken() {
     }
     return token;
 }
-/**
- * Connect MQTT
- */
 function connectMQTT(brokerUrl) {
     if (client)
         return client;
-    client = mqtt.connect(brokerUrl, {
+    client = mqtt_1.default.connect(brokerUrl, {
         reconnectPeriod: 5000,
         connectTimeout: 10000
     });
     client.on("connect", () => {
-        console.log("✅ MQTT Connected");
+        // console.log("✅ mbnotify app connected");
     });
     client.on("error", (err) => {
-        console.error("❌ MQTT Error:", err);
+        console.error("MQTT error:", err);
     });
-    // ✅ SINGLE LISTENER
+    // ✅ SINGLE message listener
     client.on("message", async (_, message) => {
         try {
             const payload = JSON.parse(message.toString());
-            console.log("📩 Received:", payload);
             await Notifications.scheduleNotificationAsync({
                 content: {
                     title: payload.title || "",
@@ -64,9 +54,6 @@ function connectMQTT(brokerUrl) {
     });
     return client;
 }
-/**
- * Get token + subscribe
- */
 async function getToken(appName, brokerUrl = DEFAULT_BROKER) {
     if (!appName)
         throw new Error("appName required");
@@ -74,6 +61,6 @@ async function getToken(appName, brokerUrl = DEFAULT_BROKER) {
     const topic = `/${appName}/${token}/notification`;
     const mqttClient = connectMQTT(brokerUrl);
     mqttClient.subscribe(topic);
-    console.log("📡 Subscribed:", topic);
+    // console.log("📡 Subscribed:", topic);
     return token;
 }

package/dist/esm/index.d.ts

@@ -1,8 +1,2 @@
-/**
- * Request permission
- */
 export declare function requestPermission(): Promise<boolean>;
-/**
- * Get token + subscribe
- */
 export declare function getToken(appName: string, brokerUrl?: string): Promise<string>;

package/dist/esm/index.js

@@ -1,18 +1,12 @@
-import * as mqtt from "mqtt/dist/mqtt";
+import mqtt from "mqtt";
 import * as Notifications from "expo-notifications";
 import AsyncStorage from "@react-native-async-storage/async-storage";
 const DEFAULT_BROKER = "wss://broker.hivemq.com:8884/mqtt";
 let client = null;
-/**
- * Request permission
- */
 export async function requestPermission() {
     const { status } = await Notifications.requestPermissionsAsync();
     return status === "granted";
 }
-/**
- * Generate token
- */
 async function generateToken() {
     let token = await AsyncStorage.getItem("mbnotify_token");
     if (!token) {
@@ -24,9 +18,6 @@ async function generateToken() {
     }
     return token;
 }
-/**
- * Connect MQTT
- */
 function connectMQTT(brokerUrl) {
     if (client)
         return client;
@@ -35,16 +26,15 @@ function connectMQTT(brokerUrl) {
         connectTimeout: 10000
     });
     client.on("connect", () => {
-        console.log("✅ MQTT Connected");
+        // console.log("✅ mbnotify app connected");
     });
     client.on("error", (err) => {
-        console.error("❌ MQTT Error:", err);
+        console.error("MQTT error:", err);
     });
-    // ✅ SINGLE LISTENER
+    // ✅ SINGLE message listener
     client.on("message", async (_, message) => {
         try {
             const payload = JSON.parse(message.toString());
-            console.log("📩 Received:", payload);
             await Notifications.scheduleNotificationAsync({
                 content: {
                     title: payload.title || "",
@@ -60,9 +50,6 @@ function connectMQTT(brokerUrl) {
     });
     return client;
 }
-/**
- * Get token + subscribe
- */
 export async function getToken(appName, brokerUrl = DEFAULT_BROKER) {
     if (!appName)
         throw new Error("appName required");
@@ -70,6 +57,6 @@ export async function getToken(appName, brokerUrl = DEFAULT_BROKER) {
     const topic = `/${appName}/${token}/notification`;
     const mqttClient = connectMQTT(brokerUrl);
     mqttClient.subscribe(topic);
-    console.log("📡 Subscribed:", topic);
+    // console.log("📡 Subscribed:", topic);
     return token;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "mbnotify-app",
-  "version": "1.0.2",
+  "version": "1.0.5",
   "description": "React Native (Expo) client for mbnotify MQTT push notifications",
   "main": "dist/cjs/index.js",
   "module": "dist/esm/index.js",
@@ -31,7 +31,10 @@
     "buffer": "^6.0.3",
     "expo-notifications": "~55.0.12",
     "mqtt": "^5.15.0",
-    "process": "^0.11.10"
+    "process": "^0.11.10",
+    "expo": "~55.0.6",
+    "react": "19.2.0",
+    "react-native": "0.83.2"
   },
   "devDependencies": {
     "typescript": "^5.9.3"

package/src/index.ts

@@ -1,4 +1,4 @@
-import * as mqtt from "mqtt/dist/mqtt";
+import mqtt from "mqtt";
 import * as Notifications from "expo-notifications";
 import AsyncStorage from "@react-native-async-storage/async-storage";
 
@@ -6,22 +6,19 @@ const DEFAULT_BROKER = "wss://broker.hivemq.com:8884/mqtt";
 
 let client: any = null;
 
-/**
- * Request permission
- */
 export async function requestPermission(): Promise<boolean> {
+
   const { status } = await Notifications.requestPermissionsAsync();
+
   return status === "granted";
 }
 
-/**
- * Generate token
- */
 async function generateToken(): Promise<string> {
 
   let token = await AsyncStorage.getItem("mbnotify_token");
 
   if (!token) {
+
     token =
       "dev_" +
       Math.random().toString(36).substring(2) +
@@ -33,9 +30,6 @@ async function generateToken(): Promise<string> {
   return token;
 }
 
-/**
- * Connect MQTT
- */
 function connectMQTT(brokerUrl: string) {
 
   if (client) return client;
@@ -46,22 +40,20 @@ function connectMQTT(brokerUrl: string) {
   });
 
   client.on("connect", () => {
-    console.log("✅ MQTT Connected");
+    // console.log("✅ mbnotify app connected");
   });
 
   client.on("error", (err: any) => {
-    console.error("❌ MQTT Error:", err);
+    console.error("MQTT error:", err);
   });
 
-  // ✅ SINGLE LISTENER
+  // ✅ SINGLE message listener
   client.on("message", async (_: any, message: any) => {
 
     try {
 
       const payload = JSON.parse(message.toString());
 
-      console.log("📩 Received:", payload);
-
       await Notifications.scheduleNotificationAsync({
         content: {
           title: payload.title || "",
@@ -80,9 +72,6 @@ function connectMQTT(brokerUrl: string) {
   return client;
 }
 
-/**
- * Get token + subscribe
- */
 export async function getToken(
   appName: string,
   brokerUrl: string = DEFAULT_BROKER
@@ -98,7 +87,7 @@ export async function getToken(
 
   mqttClient.subscribe(topic);
 
-  console.log("📡 Subscribed:", topic);
+  // console.log("📡 Subscribed:", topic);
 
   return token;
 }