Setup - React

npm install @offline-protocol/id-react

yarn add @offline-protocol/id-react

import { OfflineAppProvider } from "@offline-protocol/id-react";

import React from "react";
import ReactDOM from "react-dom/client";
import App from "./App";
import { OfflineAppProvider } from "@offline-protocol/id-react";

const PROJECT_ID = "your-id-here";

ReactDOM.createRoot(document.getElementById("root")!).render(
  <OfflineAppProvider projectId={PROJECT_ID}>
    <App />
  </OfflineAppProvider>
);

import { useAuth } from "@offlineprotocol/sdk";

function TestComponent() {
  const { user } = useAuth();

  return <>SDK Connected! User: {user?.email || "Not authenticated"}</>;
}

import { useAuth } from "@offlineprotocol/sdk";

function LoginButton() {
  const { loginWithModal, user, logout } = useAuth();

  const handleLogin = async () => {
    try {
      await loginWithModal();
      console.log("User logged in successfully!");
    } catch (error) {
      console.error("Login failed:", error);
    }
  };

  if (user) {
    return <p>Welcome, {user.email}!</p>;
  }

  return <>Login with Offline Protocol</>;
}

export default LoginButton;