How to use the linkifyjs/plugins/mention function in linkifyjs

import Echo from 'laravel-echo'
import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome'
import ClickOutside from 'vue-click-outside'
import * as linkify from 'linkifyjs'
import linkifyElement from 'linkifyjs/element'
import mention from 'linkifyjs/plugins/mention'

mention(linkify)

window.Vue = require('vue')

window.axios = require('axios')

window.luxon = require('luxon')

window.axios.defaults.headers.common = {
  'X-CSRF-TOKEN': window.Laravel.csrfToken,
  'X-Requested-With': 'XMLHttpRequest'
}

if (typeof io !== 'undefined') {
  window.Echo = new Echo({
    broadcaster: 'socket.io',
    host: window.location.hostname + ':6001',

import { configure } from 'radiks';
import * as linkify from 'linkifyjs';
import mentionPlugin from 'linkifyjs/plugins/mention';
import { CookiesProvider, withCookies, Cookies } from 'react-cookie';
import { instanceOf } from 'prop-types';
import { withRouter } from 'next/router';
import { ReduxBundlerProvider } from 'redux-bundler-hook';
import withReduxStore from '../common/lib/with-redux-store';
import Nav from '../components/nav';
import Footer from '../components/footer';
import { theme } from '../common/theme';
import NewSignInModal from '../components/modal/new-sign-in';
import { globalStyles } from '../common/style';
import OfflineIndicator from '../components/offline-indicator';

mentionPlugin(linkify);

const makeUserSession = () => {
  const appConfig = new AppConfig(['store_write', 'publish_data'], process.env.RADIKS_API_SERVER);
  return new UserSession({ appConfig });
};

const GlobalStyles = globalStyles();

const Wrapper = withRouter(({ children }) => (
  
    
    {children}
  
));

class MyApp extends App {

import * as linkify from 'linkifyjs';
import mention from 'linkifyjs/plugins/mention';

mention(linkify);

export default function(str) {
  const links = linkify.find(str);

  for (let link of Array.from(links)) {
    str = str.replace(link.value, _getTag(link));
  }

  return str;
}

var _getTag = function(link) {
  switch (link.type) {
    case 'url':
      return `<a href="${link.href}">${link.value}</a>`;
    case 'mention':