Ganache Events – How to Fix Ganache Not Showing Any Events

I have a contract method which emits events but ganache seems not to catch any events. I say this because when I deploy my contract on ropsten the events are being caught fine but only in ganache I have this problem. Also I am using web3 js to watch for the events.

This is my solidity contract which emits events:

pragma solidity ^0.5.0;

contract Marketplace {
    string public name;
    address owner;
    uint public fileCount = 0;
    mapping(uint => File) public files; 


    struct File
    {
        uint id;
        string name;
        address owner;
        address sharedWith;
    }

    event FileViewed(
        uint id,
        string name,
        address owner,
        address sharedWith
    );

    constructor() public {
        name = "File Sharing System";
        owner = msg.sender;
    }

    function viewFile(uint _id) public 
    {
        File memory _file = files[_id];
        require(msg.sender==_file.sharedWith || msg.sender==owner ,"Not shared with you!!");
        emit FileViewed(fileCount, _file.name, owner, _file.sharedWith);
    }
}

This is my App.js in which I am watching for events:

import React, { Component } from 'react';
import Web3 from 'web3';
import './App.css';
import Navbar from './Navbar';
import Main from './Main';
import Marketplace from '../abis/Marketplace.json';

class App extends Component {
  //const marketplace 

  async componentWillMount()
  {
    await this.loadWeb3()
    await this.loadBlockChainData()
  }

  async loadWeb3()
  {
    if(window.ethereum)
    {
      window.web3 = new Web3(window.ethereum);
      await window.ethereum.enable();
    }
    else if (window.web3)
    {
      window.web3 = new Web3(window.web3.currentProvider);
      await window.ethereum.enable();
    }
    else{
      window.alert("Non ethereum browser detected!!!!");
    }
  }

  async loadBlockChainData()
  {
    const web3 = window.web3;
    //load Account
    const accounts = await web3.eth.getAccounts();
    this.setState({account: accounts[0]});
    const networkId = await web3.eth.net.getId();
    const networkData = Marketplace.networks[networkId];
    if(networkData) 
    {
      const marketplace = web3.eth.Contract(Marketplace.abi, networkData.address);
      this.setState({marketplace});

      const fileCount = await marketplace.methods.fileCount().call();
      for(var i=1;i<=fileCount;i++)
      {
        const file = await marketplace.methods.files(i).call();
        this.setState({
          files: [...this.state.files, file]
        });
      }
    } 
    else 
    {
      window.alert('Marketplace contract not deployed to detected network.');
    }

  }


  constructor(props)
  {
    super(props);
    this.state =
    {
      account: '',
      fileCount: 0,
      files: [], 
      loading: false
    };

    this.viewFile = this.viewFile.bind(this);
  }



  viewFile(id)
  {
    this.setState({loading: true});
    this.state.marketplace.methods.viewFile(id).send({from: this.state.account})

    this.state.marketplace.events.FileViewed({
      fromBlock: 0
    }, function(error, event)
    {
      if(error)
      {
        window.alert("Error: ", error);
      }
      else
      {
        console.log(event);
      }
    })

  }

Note: I don't want to use ropsten network because it takes time to record my transactions.

Help would be appreciated and new here any suggestions would be appreciated.