Local Notifications for AIStudioAPK

Add reminders, alerts, task updates, and other notifications to your app without writing any native Android code.

The @aistudioapk/notifications package lets you implement notification logic once and use it everywhere. During development, notifications appear as styled browser toasts. When AIStudioAPK builds your APK, the system automatically converts them into native Android notifications.

No Android coding. No manual bridge setup. No extra configuration.


How It Works

1. Install the Package

Add the notifications package to your project:

npm install @aistudioapk/notifications

2. Add Notification Logic

Use the provided API anywhere in your application to display, schedule, or manage notifications.

3. Build Your APK

When you build your APK with AIStudioAPK:

  • The build process detects the package automatically.
  • A native Android notification bridge is injected.
  • Your existing notification calls become real Android notifications.

Important: If the package is not installed, AIStudioAPK skips the notification bridge entirely. No permissions or additional code are added to your APK.


Quick Start

Import the library:

import { notify } from '@aistudioapk/notifications'

Show an Immediate Notification

await notify.show({
  title: 'Download Complete',
  body: 'Your file is ready.',
  data: {
    fileId: '123'
  }
})

Schedule a Notification

await notify.schedule({
  title: 'Daily Reminder',
  body: 'Check your dashboard',
  triggerAt: Date.now() + 24 * 60 * 60 * 1000,
  repeat: 'daily'
})

Handle Notification Taps

Register this once when your app starts:

notify.onTap((data) => {
  console.log('User tapped notification:', data)
})

Browser Testing: Notifications appear as interactive toast messages inside the browser. No browser notification permission is required.


AI Studio Integration Prompt

Paste the following prompt into Google AI Studio:

Add local notifications to this app using the @aistudioapk/notifications library.

Steps:
1. Install the package:
   npm install @aistudioapk/notifications

2. Import it:
   import { notify } from '@aistudioapk/notifications

3. Implement notifications using:

// Immediate notification
await notify.show({
  title: 'Task complete',
  body: 'Your process finished successfully.',
  data: { screen: 'results' }
})

// Scheduled notification
await notify.schedule({
  title: 'Daily reminder',
  body: "Don't forget to check your dashboard.",
  triggerAt: Date.now() + 60 * 60 * 1000,
  repeat: 'daily'
})

// Handle notification taps
notify.onTap((data) => {
  console.log('Notification tapped with data:', data)
})

// Cancel notification
await notify.cancel('my-reminder-id')

// Cancel all notifications
await notify.cancelAll()

// Request permission
const status = await notify.requestPermission()

Notes

  • Browser mode displays styled toast notifications.
  • APK builds automatically use native Android notifications.
  • Always use notify.show() and notify.schedule() instead of the browser Notification API.

API Reference

notify.show(options)

Displays a notification immediately.

Parameters

ParameterTypeRequiredDescription
titlestringYesNotification title
bodystringYesNotification message
idstring | numberNoUnique notification ID
dataobjectNoData passed to onTap()
iconstringNoEmoji icon for browser toasts
soundbooleanNoEnable sound (default: true)
vibratebooleanNoEnable vibration (default: true)
prioritylow | normal | highNoAndroid priority level
ongoingbooleanNoPersistent notification

Example

await notify.show({
  title: 'Export Ready',
  body: 'Your report has been generated.'
})

notify.schedule(options)

Schedules a notification for a future time.

Android notifications survive app restarts using AlarmManager.

Parameters

ParameterTypeRequiredDescription
triggerAtDate | numberYesNotification time
repeathourly | daily | weekly | numberNoRepeat interval
…show() optionsVariousOptionalAll show() settings supported

Example

await notify.schedule({
  title: 'Reminder',
  body: 'Check your dashboard',
  triggerAt: Date.now() + 3600000
})

notify.cancel(id)

Cancels a specific notification or scheduled notification.

await notify.cancel('daily-reminder')

notify.cancelAll()

Cancels all active and scheduled notifications.

await notify.cancelAll()

notify.onTap(callback)

Registers a notification click handler.

Example

notify.onTap((data) => {
  console.log(data)
})

Register this once during app initialization for best results.


notify.requestPermission()

Requests notification permission.

const status = await notify.requestPermission()

Returns:

granted
denied
not-determined

Browser Behavior

Always returns:

granted

notify.configure(config)

Sets global notification defaults.

Configuration Options

OptionDescription
defaultChannelIdAndroid notification channel
defaultSoundEnable sound by default
defaultVibrateEnable vibration by default
webPositionBrowser toast position

Example

notify.configure({
  defaultChannelId: 'general',
  defaultSound: true,
  defaultVibrate: true,
  webPosition: 'bottom-right'
})

Usage Examples

Process Completion Notification

async function runExport() {
  await generateReport()

  await notify.show({
    title: 'Export Ready',
    body: 'Your report has been generated.',
    data: {
      screen: '/reports/latest'
    }
  })
}
notify.onTap(({ screen }) => {
  if (screen) router.push(screen)
})

Daily Reminder

function scheduleDailyReminder() {
  const next9am = new Date()

  next9am.setHours(9, 0, 0, 0)

  if (next9am <= new Date()) {
    next9am.setDate(next9am.getDate() + 1)
  }

  notify.schedule({
    id: 'daily-reminder',
    title: 'Good Morning!',
    body: 'Your daily summary is ready.',
    triggerAt: next9am,
    repeat: 'daily'
  })
}

Disable the reminder:

notify.cancel('daily-reminder')

Backend Status Notifications

async function watchJobStatus(jobId) {
  const interval = setInterval(async () => {
    const { status, result } = await fetchJobStatus(jobId)

    if (status === 'done') {
      clearInterval(interval)

      await notify.show({
        title: 'Job Complete',
        body: `${result.name} finished successfully.`,
        data: { jobId }
      })
    }
  }, 5000)
}

Troubleshooting

Notifications Not Appearing in the APK

Check the following:

  • The package is listed in package.json
  • Build logs contain [STEP 7e]
  • Notification permission is enabled on Android 13+

If permission was denied, users can re-enable notifications via:

Settings → Apps → Your App → Notifications


Browser Toasts Not Showing

Verify:

  • The import statement is correct
import { notify } from '@aistudioapk/notifications'
  • Both title and body are provided
  • notify.show() is not called during SSR

onTap() Not Triggering

Best practices:

  • Register notify.onTap() once during app startup
  • Avoid registering it inside frequently mounted components
  • For notifications opened while the app is closed, register onTap() as early as possible

Summary

The @aistudioapk/notifications package provides a simple cross-platform notification system that works seamlessly in both browser development and Android APK builds. Develop and test notification logic once, then let AIStudioAPK automatically convert it into native Android notifications during the build process.

Scroll to Top