// Importing required modules
const yaml = require("js-yaml");
const fs = require("fs");
const path = require("path");
const axios = require("axios");

// Function to create all OpenAPI files
const createAllOpenApiFiles = async () => {
  console.log("Creating new openapi files...");
  const folderName = "api-reference";

  // Function to read OpenAPI documentation from URL
  const readDoc = async () => {
    try {
      const response = await axios.get(
        "https://app.dynamic.xyz/api-docs/api.yaml"
      );

      fs.writeFileSync(
        path.join(__dirname, "../../openapi.yaml"),
        response.data
      );

      const doc = yaml.load(fs.readFileSync("openapi.yaml", "utf8"));
      return doc;
    } catch (e) {
      console.log(e);
      return null;
    }
  };

  // Function to delete output folder
  const deleteOutputFolder = () => {
    if (fs.existsSync(path.join(__dirname, `/${folderName}`))) {
      fs.rmSync(path.join(__dirname, `/${folderName}`), { recursive: true });
    }
  };

  // Read OpenAPI documentation
  const doc = await readDoc();

  // Delete output folder
  deleteOutputFolder();

  // // Loop through each path in the OpenAPI documentation
  for (const [key, value] of Object.entries(doc.paths)) {
    const url = key;
    const availableMethods = value;
    const innerFolderName = url.split("/")[1].toLowerCase();

    // Create output folder if it doesn't exist
    if (!fs.existsSync(path.join(__dirname, `/${folderName}`))) {
      fs.mkdirSync(path.join(__dirname, `/${folderName}`));
    }

    // Loop through each available method for the path
    for (const [key, value] of Object.entries(availableMethods)) {
      const method = key.toUpperCase();

      // Don't create file for OPTIONS method calls
      if (method !== "OPTIONS") {
        const description = value.summary;
        const id = value.operationId;
        const tags = value.tags;
        const tag = tags[0].toLowerCase();

        // Create inner folder for tag if it doesn't exist
        if (!fs.existsSync(path.join(__dirname, `/${folderName}/${tag}`))) {
          fs.mkdirSync(path.join(__dirname, `/${folderName}/${tag}`));
        }

        // Format string for output file
        const formattedString =
          "---\ntitle: " +
          description +
          "\nopenapi: " +
          method +
          " " +
          url +
          "\n---";

        // Write output file
        fs.writeFileSync(
          path.join(__dirname, `/${folderName}/${tag}/${id}.mdx`),
          formattedString,
          { flag: "wx" }
        );
      }
    }
  }
};

// Function to move overview file into OpenAPI folder
const moveOverviewIntoOpenApiFolder = () => {
  console.log("copying overview file into OpenAPI folder...");
  const folderName = "api-reference";
  const overviewFileName = "overview.mdx";

  // Copy overview file into OpenAPI folder
  if (fs.existsSync(path.join(__dirname, `./${folderName}`))) {
    fs.copyFileSync(
      path.join(__dirname, `../${overviewFileName}`),
      path.join(__dirname, `./${folderName}/${overviewFileName}`)
    );
  }

  return;
};

const createNewOpenApiFiles = async () => {
  // Call functions to create all OpenAPI files and move overview file into OpenAPI folder
  await createAllOpenApiFiles();
  await moveOverviewIntoOpenApiFolder();

  console.log("New openapi files created!");
  return;
};

module.exports = createNewOpenApiFiles;


Announcements

System Status

Changelog

Dynamic

React

React Native

Flutter

API Reference

Live Support

Start Free

Explore Dynamic

React Static Flag Error

Welcome to Dynamic! We're so excited that you're here!

Welcome

Let's get you up and running with a React based signup/login UI! Just [sign up](https://app.dynamic.xyz) and follow the guide below!

Quickstart

Example apps

Go Live Checklist

Developer Best Practices

Adding the SDK

DynamicContextProvider props

Wagmi & Dynamic

Using Ethers instead of Viem

Enabling Chains

Embedded Wallet Chains

Account Abstraction Chains

Using RPC Providers

Custom EVM networks (EvmNetwork)

Switching Networks

Sign Up with Email/Social/SMS

Sign Up with Branded Wallets

JWTs/Authentication Tokens

Cookie Based Authentication

Adding Captcha Protection

Server-side verification

Third-party Authentication

Multi Asset UI

Accessing Users

Verified Credentials

Email and Phone Verification

Social Linking

UI Customization Overview

Customizing Signup/Login UI

Adapt Copy With Translations

Adapt UI With Views

Customizing Transaction UI

Headless Overview

Headless Email Signup

Headless SMS signup

Headless Social Login

Headless Embedded Wallets With OTP

Headless embedded wallets using Passkeys

Headless Embedded Wallet Export

Headless Wallet Management

Headless User Profile

Banxa

The `DynamicBridgeWidget` component allows you to handle multi chain bridging

Dynamic Bridge Widget

bridgeChains

This page hosts the keys that you'll need to setup the SDK, validate the JWT, and generate tokens for API usage.

SDK and API Keys

Every project you create in Dynamic comes with a Sandbox and a Live environment. Both these environments behave similarly but we've customized the Sandbox environment to make it ideal for testing and exploring features.

Sandbox vs Live

Analytics

Users

Visitors

One of the first things you'll want to do as you create a new project is update some of the basic metadata associated with the SDK such as your app name, logo url, and support url.

General Settings

Privacy Settings

We take security seriously at Dynamic and most of the work we do is behind the scenes so you don't have to worry about it. We will surface some security features that can be configured. 

Security Settings

Invite Members

Projects vs Organizations

General

Webhook Event types

Social Providers Overview

Farcaster Overview

Sign in with Farcaster

Enable Write Access to Farcaster

Generate an multi-chain embedded wallet from a Farcaster frame

Phantom Redirect

Multi-Factor Authentcation (MFA)

NextAuth & Dynamic

Create-web3-dapp & Dynamic

Dynamic in PWA

Deploy a Safe account with Dynamic

Telegram Mini App

Co:Create & Dynamic Integration

Shield3 & Dynamic Integration

XMTP & Dynamic Integration

Verifying webhook message signatures

Add new users to your CRM

Webhooks using a serverless function

Post in a slack channel when you have a new signup

Slack notifications of new signups

Send new users an XMTP message

Migrating to Dynamic

Migrating Users via CSV

Migration from RainbowKit

The SDK allows you to build authentication and authorization into your application in a few lines of code.

Introduction to the SDK

SDK/User Loading States

Providers and Connectors Introduction

DynamicContextProvider

The `DynamicWagmiConnector` component integrates your Dynamic project settings with Wagmi

DynamicWagmiConnector

Components Introduction

DynamicBridgeWidget

DynamicConnectButton

DynamicEmbeddedWidget

DynamicMultiWalletPromptsWidget

DynamicWidget

DynamicUserProfile

DynamicNav

Hooks Introduction

useAuthenticateConnectedUser

Allow for headless email or sms OTP authentication

useConnectWithOtp

Dynamic's React Context which is set via DynamicContextProvider

useDynamicContext

useDynamicEvents

useDynamicModals

useDynamicScopes

useEmbeddedReveal

useEmbeddedWallet

useFunding

useIsLoggedIn

useOtpVerificationRequest

usePasskeyRecovery

useRefreshUser

useReinitialize

useSendBalance

useSelectWalletOption

useSocialAccounts

useSwitchNetwork

useSwitchWallet

useTokenBalances

useUserUpdateRequest

Get access to the current user/session wallets

useUserWallets

useWalletConnectorEvent

useWalletItemActions

Events Introduction

onAuthFlowCancel

onAuthFlowClose

onAuthFlowOpen

onAuthFailure

onAuthInit

onAuthSuccess

onEmbeddedWalletCreated

onLogout

onOtpVerificationResult

onSignedMessage

onUserProfileUpdate

onWalletAdded

onWalletRemoved

Handlers Introduction

handleConnectedWallet

handleUserOnboarding

handleVerifiedUser

React Objects Introduction

AccessDeniedCustomButton

This is Dynamic's Bitcoin connector over the basic wallet interface. This can be used to interact with the users Bitcoin wallets.

BitcoinWalletConnector

EvmRpcProvider

EvmRpcProviderMethods

EvmNetwork

LocaleResource

PhoneData

SocialProvider

SolanaRpcProvider

SolanaRpcProviderMethods

JWT Payload

An object containing attributes about the user such as the wallet address, email, first name, etc.

UserProfile

JwtVerifiedCredential

SdkViews

WalletOption

An object containing the attributes about the user wallets.

Wallet

This is Dynamic's WalletConnect connector over the basic wallet interface. This can be used to interact with the users WalletConnect wallets. It has all methods available in the [WalletConnector](https://docs.dynamic.xyz/react-sdk/objects/walletconnector) and some additional method specific to WalletConnect wallets.

WalletConnectConnector

This is Dynamic's abstraction over the wallet interface. This can be used to interact with the users wallet.

WalletConnector

WalletsByChain

Utilities Introduction

This utility can be used to get a JWT token generated by Dynamic which is stored inside of localStorage.

Introduction

Configurations

Developer Dashboard

Tutorials

Migrating to Dynamic

Troubleshooting

React Static Flag Error

🚧 The issue has been resolved - we no longer have Framer Motion as a dependency. [ >0.14.x]