{"id":11702,"library":"react-facebook-auth","title":"React Facebook Authentication Component","description":"The `react-facebook-auth` package provides a React component designed for client-side Facebook authentication, enabling developers to obtain an authentication token for subsequent backend validation. The current stable version, 1.4.0, was released several years ago. The project appears to be unmaintained, with its last update occurring over six years ago, and its peer dependencies (`react` `^15.0.0 || ^16.0.0`) are significantly outdated. This component primarily functions as a wrapper around the Facebook SDK for JavaScript, handling its initialization and the callback mechanisms for successful authentication or failures. While it offered a straightforward way to integrate Facebook login into React applications at the time of its release, its age renders it largely unsuitable for modern React development environments or current Facebook Graph API versions. Its lack of maintenance also poses significant security and compatibility risks.","status":"abandoned","version":"1.4.0","language":"javascript","source_language":"en","source_url":"https://github.com/ionutmilica/react-facebook-auth","tags":["javascript","react","reactjs","facebook-auth","react-facebook-auth","react-component","facebook-login","login","react-facebook-login"],"install":[{"cmd":"npm install react-facebook-auth","lang":"bash","label":"npm"},{"cmd":"yarn add react-facebook-auth","lang":"bash","label":"yarn"},{"cmd":"pnpm add react-facebook-auth","lang":"bash","label":"pnpm"}],"dependencies":[{"reason":"Required as a peer dependency for the core functionality of the React component.","package":"react","optional":false}],"imports":[{"note":"The `FacebookAuth` component is exported as the default export of the package. Destructured imports will not work.","wrong":"import { FacebookAuth } from 'react-facebook-auth';","symbol":"FacebookAuth","correct":"import FacebookAuth from 'react-facebook-auth';"},{"note":"While CommonJS `require` might work in some transpiled environments, modern React applications primarily use ESM `import`. This package's age means it might have been built with CJS in mind, but direct ESM import is preferred.","wrong":"import FacebookAuth from 'react-facebook-auth';","symbol":"FacebookAuth (CommonJS)","correct":"const FacebookAuth = require('react-facebook-auth');"}],"quickstart":{"code":"import React from 'react';\nimport ReactDOM from 'react-dom';\nimport FacebookAuth from 'react-facebook-auth';\n\nconst MyFacebookButton = ({ onClick }) => (\n  <button onClick={onClick}>\n    Login with facebook\n  </button>\n);\n\nconst authenticate = (response) => {\n  console.log('Facebook Auth Response:', response);\n  // In a real application, you would send this token to your backend\n  // for validation and user session management.\n  // Example: fetch('/api/auth/facebook', { method: 'POST', body: JSON.stringify(response) });\n};\n\nconst App = () => (\n  <div>\n    <h1>Facebook Auth Example</h1>\n    <p>This component provides a customizable button that triggers the Facebook login flow.</p>\n    <FacebookAuth\n      appId={process.env.REACT_APP_FACEBOOK_APP_ID ?? 'YOUR_FACEBOOK_APP_ID'}\n      callback={authenticate}\n      component={MyFacebookButton}\n      scope=\"public_profile,email\"\n      fields=\"name,email,picture\"\n    />\n    <p>Make sure to replace 'YOUR_FACEBOOK_APP_ID' with your actual Facebook App ID.</p>\n    <p>This package is deprecated and likely incompatible with modern Facebook API versions and React.</p>\n  </div>\n);\n\nReactDOM.render(\n  <App />,\n  document.getElementById('root'),\n);","lang":"javascript","description":"This quickstart demonstrates how to integrate the `FacebookAuth` component, provide a custom button for the login trigger, and handle the authentication response, including placeholder for backend integration. It highlights the use of `appId`, `callback`, and `component` props."},"warnings":[{"fix":"Do not use this package with React versions 17 or higher. Consider modern alternatives like `@greatsumini/react-facebook-login` or `react-facebook` that support current React versions.","message":"This package explicitly declares peer dependencies for React versions `^15.0.0 || ^16.0.0`. It is fundamentally incompatible with React 17 and later versions, including the current React 18 and React 19, due to breaking changes in React's core and deprecated lifecycle methods.","severity":"breaking","affected_versions":">=1.0.0"},{"fix":"This package does not support recent Facebook Graph API versions. Attempting to override the `version` prop might not resolve underlying compatibility issues. Migrate to a actively maintained Facebook login library that uses recent Graph API versions.","message":"The package defaults to Facebook SDK version `2.8` via its `version` prop. Facebook deprecated older Graph API versions, typically maintaining them for a limited period (e.g., 90 days or 2 years for core APIs). Version 2.8 is extremely old and will not function with current Facebook applications or Graph API requirements, leading to authentication failures or API errors.","severity":"breaking","affected_versions":">=1.0.0"},{"fix":"Immediately cease using this package in production environments. Migrate to a well-maintained, actively developed Facebook authentication library (e.g., `react-facebook-login` by keppelen or `@greatsumini/react-facebook-login`, or `react-facebook`).","message":"The package is unmaintained, with its last commit over six years ago. This means no security patches, bug fixes, or updates for compatibility with evolving web standards or Facebook API changes. Using unmaintained software, especially for authentication, introduces significant security vulnerabilities (e.g., potential for supply chain attacks, unpatched vulnerabilities) and reliability issues.","severity":"gotcha","affected_versions":">=1.0.0"},{"fix":"Refer to the latest Facebook Developer documentation for app creation and policy compliance. Actively maintained libraries will typically incorporate these changes. Using this package will likely lead to policy violations.","message":"Facebook's platform policies and developer requirements frequently change. An unmaintained library will not adhere to current policies (e.g., data handling, required permissions, app review processes), potentially leading to app suspension or rejection from the Facebook platform.","severity":"gotcha","affected_versions":">=1.0.0"},{"fix":"Install community types if available (`npm install --save-dev @types/react-facebook-auth`). However, given the package's abandonment, these types are unlikely to be maintained either. Modern alternatives often come with built-in TypeScript support.","message":"The package does not ship with TypeScript types. While it can be used in TypeScript projects with declaration files (`@types/react-facebook-auth`), the lack of first-party types increases the chance of type-related errors and reduces developer experience.","severity":"gotcha","affected_versions":">=1.0.0"}],"env_vars":null,"last_verified":"2026-04-19T00:00:00.000Z","next_check":"2026-07-18T00:00:00.000Z","problems":[{"fix":"Ensure the `appId` prop is correctly set with your numerical Facebook Application ID as a string, obtained from the Facebook Developer Dashboard (e.g., `appId=\"1234567890\"`).","cause":"The `appId` prop is either missing, empty, or contains non-numeric characters for your Facebook application.","error":"Error: Invalid App Id: The provided 'appId' is invalid. It must be a number or a numeric string representing the Facebook app ID."},{"fix":"Verify that `appId` is correct and that there are no network issues blocking the Facebook SDK from loading. Given the age of this package, this error is highly likely due to incompatibility with current Facebook SDK versions, which often deprecate older APIs. No simple fix within this package is available; migration is necessary.","cause":"The Facebook JavaScript SDK has not loaded successfully or initialized before the component attempts to call its methods, or the SDK version configured is too old and incompatible.","error":"TypeError: Cannot read properties of undefined (reading 'login') (or similar errors related to FB.login is not a function)"},{"fix":"Ensure the value passed to the `component` prop is a valid React component function or class (e.g., `component={MyFacebookButton}` where `MyFacebookButton` is a function or class that returns JSX), and that it correctly receives an `onClick` prop.","cause":"The component provided to the `component` prop is not a valid React functional component or class component.","error":"Uncaught Error: The 'component' prop must be a React component."},{"fix":"Check your Facebook App settings on developers.facebook.com to ensure 'Facebook Login' is enabled for the 'Web' platform, the 'Valid OAuth Redirect URIs' are correctly configured for your application's domain (including `http://localhost` for development), and that your development environment is running over HTTPS if required. However, the package's deprecated status means this could also be a fundamental incompatibility.","cause":"Facebook login process failed, often due to incorrect app configuration on the Facebook Developer side (e.g., incorrect redirect URIs, disabled login for the platform) or due to Facebook's stricter security policies (e.g., requiring HTTPS for redirects, not localhost).","error":"Failed to authenticate, status: unknown (or similar errors indicating authentication failure)"}],"ecosystem":"npm"}