2. Fetching symbol reservations

Now that we have registered a symbol, we can configure and deploy our Security Token. But before that, we will use the SDK to fetch all symbol registrations (aka reservations) that belong to the current app user.

Once retrieved, we'll display those reservations in a select list to enable users to proceed with token creation using selected reservation (ie symbol)

Note The function getSecurityTokenReservations({ owner: string }) will return all reservations belonging to owner, whether they have been launched as a security token or not. Hence, we'll need to filter out reservations that have been registered already.

Append the following snippet to App function component, before it returns.

function App() {
  const [state, dispatch] = useContext(Store)
  const { sdk } = state.AppReducer

  ...
  useEffect(() => {
    async function fetchReservations() {
      // Start spinner
      dispatch({ type: 'FETCHING_RESERVATIONS' })
      try {
        // Retrieve reservations from SecurityTokenRegistry contract.
        let reservations = await sdk.getSecurityTokenReservations({owner: walletAddress })
        // Filter launched reservations out.
        reservations = await filter(reservations, async (reservation) => {
          const launched = await reservation.isLaunched()
          return !launched
        })
        // Stop spinner and update state.
        dispatch({type: 'FETCHED_RESERVATIONS', reservations})
      } catch (error) {
        dispatch({type: 'ERROR', error: error.message})
      }
    }
    if (sdk && walletAddress && reservations === undefined) {
      fetchReservations()
    }
  }, [reservations, sdk, walletAddress])
  ...