wappa-notifications

Expo / React Native uygulamalarına tek satırda push notification ekleyen SDK. Wappa paneline bağlanır — bir geliştirici kendi mobil uygulamasına bu paketi kurar, tek bir env değişkeni girer, projenin herhangi bir yerinde tek fonksiyon çağırır ve bildirimler çalışır.

wappa-notifications  →  POST /push-tokens   →  Wappa panel (token kaydı)
Wappa panel "Bildirim Gönder"  →  Expo Push API  →  kullanıcının telefonu

Kurulum

npm install wappa-notifications
# peer bağımlılıklar (Expo projelerinde genelde zaten vardır):
npx expo install expo-notifications expo-device @react-native-async-storage/async-storage

Paket; expo-notifications, expo-device, @react-native-async-storage/async-storage, react ve react-native paketlerini peer dependency olarak kullanır. Bunlar uygulamanızda zaten kuruludur. expo-constants opsiyoneldir (EAS projectId otomatik bulunur).

1. Tek env değişkeni

Projenin köküne .env ekleyin:

EXPO_PUBLIC_WAPPA_SITE_KEY=my-site

my-site → Wappa panelindeki site/proje anahtarınız. Backend URL'i varsayılan olarak hosted panele (https://wappa-ui-api.appaflytech.com) gider. Kendi sunucunuza bağlanacaksanız ekleyin:

# opsiyonel — varsayılan hosted panele bağlanır
EXPO_PUBLIC_WAPPA_API=https://your-wappa-backend.com

2. Tek fonksiyon

Projenin giriş noktasında (örn. index.js veya App.tsx) herhangi bir yerde çağırın:

import { initWappaNotifications } from "wappa-notifications";

initWappaNotifications();

Bu kadar. SDK otomatik olarak:

1. Bildirim iznini ister,
2. Expo push token alır,
3. token'ı panele kaydeder (POST /push-tokens),
4. ön planda gelen bildirimleri banner olarak gösterir,
5. Android bildirim kanalını oluşturur.

Kullanım örnekleri

A) Imperative (giriş dosyasında)

index.js:

import "expo-router/entry";
import { initWappaNotifications } from "wappa-notifications";

initWappaNotifications({
  onTap: ({ notification }) => {
    // bildirime dokununca yönlendirme
    console.log("Tapped:", notification.data);
  },
});

B) React hook (root layout)

import { useWappaNotifications } from "wappa-notifications";

export default function RootLayout() {
  useWappaNotifications({
    onReceive: ({ title, body }) => console.log("Geldi:", title, body),
    onTap: ({ notification }) => router.push(String(notification.data?.screen ?? "/")),
  });

  return <Stack />;
}

C) JSX bileşeni

import { WappaNotifications } from "wappa-notifications";

<WappaNotifications
  siteKey="my-site"
  onTap={({ notification }) => handle(notification)}
/>;

Çıkışta token'ı sil

import { unregisterWappaNotifications } from "wappa-notifications";

async function logout() {
  await unregisterWappaNotifications();
  // ... oturum kapatma
}

Kullanıcıya özel bildirim

Giriş yapan kullanıcının id'sini geçerseniz panel user:<id> hedefiyle ona özel bildirim gönderebilir:

initWappaNotifications({ publicUserId: currentUser.id });

API

initWappaNotifications(config?) => Promise<WappaNotificationsController>

Tüm alanlar opsiyoneldir:

| Alan | Tip | Varsayılan | Açıklama | | --- | --- | --- | --- | | siteKey | string | EXPO_PUBLIC_WAPPA_SITE_KEY | Panel site/proje anahtarı | | apiUrl | string | EXPO_PUBLIC_WAPPA_API ya da hosted | Backend URL | | projectId | string | expo-constants'tan otomatik | EAS project id | | publicUserId | string | — | Kullanıcı bazlı hedefleme | | requestPermission | boolean | true | İzin diyalogunu göster | | sound | boolean | true | Ön planda ses çal | | androidChannel | object \| false | { id:"default", name:"Bildirimler", importance:4 } | Android kanalı | | onReceive | (payload) => void | — | Ön planda bildirim geldiğinde | | onTap | (payload) => void | — | Bildirime dokunulduğunda | | onError | (error) => void | — | Kayıt/ağ hatası |

Dönen controller: { token, unregister(), remove() }.

unregisterWappaNotifications(config?) => Promise<void>

Cihaz token'ını panelden siler (çıkışta).

useWappaNotifications(config?) / <WappaNotifications {...config} />

Aynı yapılandırmayı React hook / bileşen olarak sunar; unmount'ta listener'ları temizler.

getWappaPushToken() => string | null

En son kaydedilen Expo push token.

Paneli'den bildirim gönderme

Token kaydedildikten sonra Wappa admin panelindeki Mobil Bildirimler ekranından:

• Herkese, Site bazlı (site:my-site) veya Kullanıcı bazlı (user:<id>) hedefleyin,
• Başlık + mesaj + opsiyonel data (JSON) girin,
• Gönder.

Panel arka planda Expo Push API'ye iletir.

Notlar

• Push bildirimleri yalnızca fiziksel cihazlarda çalışır (simülatörde token alınmaz).
• iOS'ta gönderim için EAS / APNs yapılandırması gerekir (Expo standart akışı).
• siteKey panelde tanımlı olmalıdır.
• SDK hiçbir zaman exception fırlatmaz; hatalar onError ile bildirilir, bildirimler uygulamanızın akışını bozmaz.

Lisans

MIT