How to use the botframework-directlinejs.DirectLine function in botframework-directlinejs

componentDidMount() {
        // Now that we're mounted, we know our dimensions. Put them in the store (this will force a re-render)
        this.setSize();

        const botConnection = this.props.directLine
            ? (this.botConnection = new DirectLine(this.props.directLine))
            : this.props.botConnection
            ;

        if (this.props.resize === 'window') {
            window.addEventListener('resize', this.resizeListener);
        }

        this.store.dispatch({ type: 'Start_Connection', user: this.props.user, bot: this.props.bot, botConnection, selectedActivity: this.props.selectedActivity });

        this.connectionStatusSubscription = botConnection.connectionStatus$.subscribe(connectionStatus => {
                if (this.props.speechOptions && this.props.speechOptions.speechRecognizer) {
                    const refGrammarId = botConnection.referenceGrammarId;
                    if (refGrammarId) {
                        this.props.speechOptions.speechRecognizer.referenceGrammarId = refGrammarId;
                    }
                }

componentDidMount() {
        // Now that we're mounted, we know our dimensions. Put them in the store (this will force a re-render)
        this.setSize();

        const botConnection = this.props.directLine
            ? (this.botConnection = new DirectLine(this.props.directLine))
            : this.props.botConnection
            ;

        if (this.props.resize === 'window')
            window.addEventListener('resize', this.resizeListener);

        this.store.dispatch({ type: 'Start_Connection', user: this.props.user, bot: this.props.bot, botConnection, selectedActivity: this.props.selectedActivity });

        this.connectionStatusSubscription = botConnection.connectionStatus$.subscribe(connectionStatus =>{
                if(this.props.speechOptions && this.props.speechOptions.speechRecognizer){
                    let refGrammarId = botConnection.referenceGrammarId;
                    if(refGrammarId)
                        this.props.speechOptions.speechRecognizer.referenceGrammarId = refGrammarId;
                }
                this.store.dispatch({ type: 'Connection_Change', connectionStatus })
            }

createConversation() {
    console.log(this._token);
    return new DirectLineWrapper(new DirectLine({
      token: this._token,
      webSocket: true
    }));
  }
  getToken(directlineSecret) {

constructor(directLineSecret: string, domain?: string) {
    super();
    this.directLine = new DirectLine({ domain, secret: directLineSecret, webSocket: !domain });
    this.subscribeToConnectionStatus();
  }

constructor(props) {
    super(props);
    const styleOptions = {
      hideScrollToEndButton: false,
      rootHeight: '50%',
      rootWidth: '50%'
    };
    this.state = {
      directLine: new DirectLine({
        secret: this.props.directLineSecret
      }),
      styleSetOptions: styleOptions,
      isOpen: false
    };
  }

const styleOptions = {
      backgroundColor: this.props.backgroundColor,
      botAvatarImage: this.props.botAvatarImage,
      userAvatarImage: this.props.userAvatarImage,
      hideUploadButton: this.props.hideUploadButton,
      sendBoxBackground: this.props.sendBoxBackground,
      sendBoxTextColor: this.props.sendBoxTextColor,
      bubbleBackground: this.props.bubbleBackground,
      bubbleTextColor: this.props.bubbleTextColor,
      bubbleFromUserTextColor: this.props.bubbleFromUserTextColor,
      bubbleFromUserBackground: this.props.bubbleFromUserBackground,
      userAvatarInitials: this.props.userAvatarInitials,
      botAvatarInitials: this.props.botAvatarInitials
      };
    this.state = {
      directLine: new DirectLine({
        secret: this.props.directLineSecret
      }),
      styleSetOptions: styleOptions
    };

    
  }
  public render(): React.ReactElement {

resumeConversation(conversationId) {
    return new DirectLineWrapper(new DirectLine({
      token: this._token,
      webSocket: true,
      conversationId
    }));
  }
}

export default function createDirectLine({
  botAgent,
  conversationId,
  domain,
  fetch,
  pollingInterval,
  secret,
  streamUrl,
  token,
  watermark,
  webSocket
}) {
  return new DirectLine({
    botAgent,
    conversationId,
    domain,
    fetch,
    pollingInterval,
    secret,
    streamUrl,
    token,
    watermark,
    webSocket,
    createFormData: attachments => {
      const formData = new FormData();

      attachments.forEach(({ contentType, data, filename, name }) => {
        formData.append(name, new Blob(data, { contentType }), filename);
      });