import AnonLink from "@anon/sdk-web-link-typescript";

function App() {
  const onSuccess = () => {
    console.log("success");
  };
  const onExit = (error: any) => {
    anonLinkInstance.destroy();
  };

  // Initialize AnonLink with configuration settings.
  const anonLinkInstance = AnonLink.init({
    config: {
      environment: "sandbox",
      // The uuid of your SdkClient associated with your UserPool
      // i.e. the one which returned   "auth": { "type": "userPool", "userPoolId": "..." }
      clientId: "7190a924-ce91-[redacted]",
      // Your application user ID token, e.g. JWT
      appUserIdToken: "eyJhbGciOiJSUzI1NiIsImtp....[redacted]",
      // Update per the app you're testing with.
      app: "instagram",
      // Replace with your company's actual name.
      company: "My Company",
      // Provide a full URL to your company's logo image.
      companyLogo: "https://assets-global.website-files.com/65aa784d1e7b42a7f2f428bb/65c30d047199273eb47d3b35_favicon.ico",
      // Set the Chrome extension ID you're using.
      // You can use Anon's extension ID which is set below
      // Make sure this matches the ID in the "My Extensions" page in Chrome (chrome://extensions)
      chromeExtensionId: "lbgbplnejdpahnfmnphghjlbedpjjbgd",
    },
    // Callback function to handle success events.
    onSuccess,
    // Callback function to handle exit or failure events.
    onExit,
  });

  const open = () => {
    anonLinkInstance.open();
  };

  return (
    <div className="App">
      <header className="App-header">
        <button onClick={open}>Open Anon Link</button>
      </header>
    </div>
  );
}

export default App;