Table like slicer

Update, with the following code I am managing to get some output in the console and I can see the other tables on the report refreshing but no filtering is taking place:

export class Visual implements IVisual {
  private settings: VisualSettings;
  private host: IVisualHost;
  private selectionManager: ISelectionManager;
  private selectionIdBuilder: ISelectionIdBuilder;
  private container: d3.Selection<any, any, any, any>;

  constructor(options: VisualConstructorOptions) {
    console.log("Visual constructor", options);
    this.host = options.host;
    this.selectionManager = this.host.createSelectionManager();
    /** Visual container */
    this.container = d3select
      .select(options.element)
      .append("div")
      .append("table");
  }

  public update(options: VisualUpdateOptions) {
    this.settings = Visual.parseSettings(
      options && options.dataViews && options.dataViews[0]
    );

    /** Clear down existing plot */
    this.container.selectAll("*").remove();

    /** Test 1: Data view has valid bare-minimum entries */
    let dataViews = options.dataViews;
    console.log("Test 1: Valid data view...");
    if (
      !dataViews ||
      !dataViews[0] ||
      !dataViews[0].table ||
      !dataViews[0].table.rows ||
      !dataViews[0].table.columns ||
      !dataViews[0].metadata
    ) {
      console.log("Test 1 FAILED. No data to draw table.");
      return;
    }

    /** If we get this far, we can trust that we can work with the data! */
    let table = dataViews[0].table;

    /** Add table heading row and columns */
    let tHead = this.container.append("tr");
    table.columns.forEach((col) => {
      tHead.append("th").text(col.displayName);
    });

    /** Now add rows and columns for each row of data */
    table.rows.forEach((row, rowIndex) => {
      let tRow = this.container.append("tr");
      const selection: ISelectionId = this.host
        .createSelectionIdBuilder()
        .withTable(table, rowIndex)
        .createSelectionId();

      tRow.on("click", (d) => {
        if (this.host.hostCapabilities.allowInteractions) {
          this.selectionManager.select(selection);
          console.log(selection);
        }
      });

      row.forEach((col) => {
        tRow.append("td").text(col.toString());
      });
    });
    console.log("Table rendered!");
  }

  private static parseSettings(dataView: DataView): VisualSettings {
    return VisualSettings.parse(dataView) as VisualSettings;
  }


  public enumerateObjectInstances(
    options: EnumerateVisualObjectInstancesOptions
  😞 VisualObjectInstance[] | VisualObjectInstanceEnumerationObject {
    return VisualSettings.enumerateObjectInstances(
      this.settings || VisualSettings.getDefault(),
      options
    );
  }
}