npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

firebase-electron

v1.1.0

Published

Receive a Firebase notifications in your Electron app

Downloads

95

Readme

firebase-electron

Receive Firebase push notifications in your Electron app.

Installation

npm i firebase-electron

Usage

Usage is similar to the electron-push-receiver package.

In the main process (main.js/.ts)

import { setup: setupPushReceiver } from 'firebase-electron';

// Call it before 'did-finish-load' with mainWindow a reference to your window
setupPushReceiver(mainWindow.webContents);

In the renderer process (renderer.js/.ts)

import { ipcRenderer } from 'electron';
import {
  START_NOTIFICATION_SERVICE,
  NOTIFICATION_SERVICE_STARTED,
  NOTIFICATION_SERVICE_ERROR,
  NOTIFICATION_RECEIVED,
  TOKEN_UPDATED,
} from 'firebase-electron/dist/electron/consts';

// Listen for service successfully started
ipcRenderer.on(NOTIFICATION_SERVICE_STARTED, (_, token) => {
  // do something
});
// Handle notification errors
ipcRenderer.on(NOTIFICATION_SERVICE_ERROR, (_, error) => {
  // do something
});
// Send FCM token to backend
ipcRenderer.on(TOKEN_UPDATED, (_, token) => {
  // Send token
});
// Display notification
ipcRenderer.on(NOTIFICATION_RECEIVED, (_, notification) => {
  // display notification
});
// Start service
ipcRenderer.send(START_NOTIFICATION_SERVICE, { appId, apiKey, projectId, vapidKey });
// or
window.ipc.send(START_NOTIFICATION_SERVICE, { appId, apiKey, projectId, vapidKey });

Where to find appId, apiKey, projectId and vapidKey

  1. Go to Firebase Console & login to your account
  2. Select your project
  3. Click on the Project Settings cog icon
  4. Click on Project Settings
  5. Make sure you're on the General tab
  6. Scroll down to the Your apps section
  7. If you don't have an app, click on Add app
    • Select Web
    • Fill in the required fields
    • Click on Register
  8. Copy the appId, apiKey, projectId listed under the SDK setup and configuration section
  9. (Optional) Copy the vapidKey listed under the Cloud Messaging tab and Web Configuration > Web Push certificates section
  10. (Optional) Generate a new key pair and use the value in the Key pair column as your vapidKey

Moving from electron-push-receiver

electron-push-receiver library stopped working because it depends on the Legacy FCM API which was deprecated on June 21st, 2024 by Google.

This package is a fork of the electron-push-receiver package that has been updated to work with the new Firebase Cloud Messaging (FCM) protocol.

I'm giving all credits to Matthieu Lemoine for the initial work and all the contributors for the electron-push-receiver package. I only updated the package to work with the new FCM protocol.

What's new

  • Uses the new FCM protocol (HTTP v1 API)
  • Uses updated dependencies (without any critical vulnerabilities)
  • Remove unnecessary, deprecated and vulnerable dependencies (e.g. request-promise, electron-config)
  • Simplified the codebase
  • Latest Node.js (v22)
  • Refactor tests and use vitest for testing
  • Completely written in TypeScript

[!CAUTION] Breaking changes - Instead of providing just a senderId, you now must provide appId, apiKey, projectId and optionally a vapidKey. See the updated usage example.

Google deprecated https://fcm.googleapis.com/fcm/connect/subscribe (/send too), which is slated for full removal on June 22, 2024. (Source: https://firebase.google.com/docs/cloud-messaging/migrate-v1)

Development

  1. Make sure you have the right Node.js version installed (specified in .nvmrc file)
  2. Install dependencies with npm install
  3. Duplicate .env.template to .env and fill in the required fields
  4. Run tests with npm run test
  5. Everything should works :)