@datagrok/peptides 1.0.1 → 1.0.2

package/src/model.ts

@@ -3,24 +3,21 @@ import * as grok from 'datagrok-api/grok';
 import * as DG from 'datagrok-api/dg';
 
 import {Subject, Observable} from 'rxjs';
-import {addViewerToHeader, StackedBarChart} from './viewers/stacked-barchart-viewer';
-import {tTest} from '@datagrok-libraries/statistics/src/tests';
-import {fdrcorrection} from '@datagrok-libraries/statistics/src/multiple-tests';
-import {ChemPalette} from './utils/chem-palette';
-import {MonomerLibrary} from './monomer-library';
 import * as C from './utils/constants';
 import * as type from './utils/types';
-import {getSeparator, getTypedArrayConstructor, stringToBool} from './utils/misc';
+import {calculateBarsData, getTypedArrayConstructor, scaleActivity, splitAlignedPeptides} from './utils/misc';
 import {_package} from './package';
-import {SARViewer, SARViewerVertical} from './viewers/sar-viewer';
+import {SARViewer, SARViewerBase, SARViewerVertical} from './viewers/sar-viewer';
 import {PeptideSpaceViewer} from './viewers/peptide-space-viewer';
-import {renderSARCell, setAARRenderer} from './utils/cell-renderer';
+import {renderBarchart, renderSARCell, setAARRenderer} from './utils/cell-renderer';
 import {substitutionsWidget} from './widgets/subst-table';
 import {getDistributionAndStats, getDistributionWidget} from './widgets/distribution';
 import {getStats, Stats} from './utils/filtering-statistics';
+import * as rxjs from 'rxjs';
+
 
 export class PeptidesModel {
-  static _modelName = 'peptidesModel';
+  static modelName = 'peptidesModel';
 
   _statsDataFrameSubject = new Subject<DG.DataFrame>();
   _sarGridSubject = new Subject<DG.Grid>();
@@ -32,20 +29,11 @@ export class PeptidesModel {
   isBitsetChangedInitialized = false;
   isCellChanging = false;
 
-  //viewer properties
-  _filterMode!: boolean;
-  _twoColorMode!: boolean;
-  _activityScaling!: string;
-  _isSubstitutionOn!: boolean;
-  _activityLimit!: number;
-  _maxSubstitutions!: number;
-
   _sarGrid!: DG.Grid;
   _sarVGrid!: DG.Grid;
   _sourceGrid!: DG.Grid;
-  _dataFrame: DG.DataFrame;
+  df: DG.DataFrame;
   splitCol!: DG.Column<boolean>;
-  stackedBarchart!: StackedBarChart;
   edf: DG.DataFrame | null = null;
   statsDf!: DG.DataFrame;
   _currentSelection!: type.SelectionObject;
@@ -55,28 +43,27 @@ export class PeptidesModel {
 
   isPeptideSpaceChangingBitset = false;
   isChangingEdfBitset = false;
-  splitByPos = false;
-  splitByAAR = false;
+
+  sarViewer!: SARViewer;
+  sarViewerVertical!: SARViewerVertical;
+
+  _usedProperties: {[propName: string]: string | number | boolean} = {};
+  monomerMap: {[key: string]: {molfile: string, fullName: string}} = {};
+  barData: type.MonomerDfStats = {};
+  barsBounds: {[position: string]: type.BarCoordinates} = {};
+  cachedBarchartTooltip: {bar: string, tooltip: null | HTMLDivElement} = {bar: '', tooltip: null};
+  monomerLib: any;
 
   private constructor(dataFrame: DG.DataFrame) {
-    this._dataFrame = dataFrame;
-    this.updateProperties();
+    this.df = dataFrame;
   }
 
-  static async getInstance(dataFrame: DG.DataFrame, dgPackage?: DG.Package): Promise<PeptidesModel> {
-    if (dataFrame.temp[MonomerLibrary.id] === null) {
-      const sdf = await (dgPackage ?? _package).files.readAsText('HELMMonomers_June10.sdf');
-      dataFrame.temp[MonomerLibrary.id] ??= new MonomerLibrary(sdf);
-    }
+  static async getInstance(dataFrame: DG.DataFrame): Promise<PeptidesModel> {
     dataFrame.temp[PeptidesModel.modelName] ??= new PeptidesModel(dataFrame);
     await (dataFrame.temp[PeptidesModel.modelName] as PeptidesModel).init();
     return dataFrame.temp[PeptidesModel.modelName] as PeptidesModel;
   }
 
-  static get modelName(): string {return PeptidesModel._modelName;}
-
-  static get chemPalette(): typeof ChemPalette {return ChemPalette;}
-
   get onStatsDataFrameChanged(): Observable<DG.DataFrame> {return this._statsDataFrameSubject.asObservable();}
 
   get onSARGridChanged(): Observable<DG.Grid> {return this._sarGridSubject.asObservable();}
@@ -86,13 +73,41 @@ export class PeptidesModel {
   get onSubstTableChanged(): Observable<type.SubstitutionsInfo> {return this._substitutionTableSubject.asObservable();}
 
   get currentSelection(): type.SelectionObject {
-    this._currentSelection ??= JSON.parse(this._dataFrame.tags[C.TAGS.SELECTION] || '{}');
+    this._currentSelection ??= JSON.parse(this.df.tags[C.TAGS.SELECTION] || '{}');
     return this._currentSelection;
   }
   set currentSelection(selection: type.SelectionObject) {
     this._currentSelection = selection;
-    this._dataFrame.tags[C.TAGS.SELECTION] = JSON.stringify(selection);
+    this.df.tags[C.TAGS.SELECTION] = JSON.stringify(selection);
     this.invalidateSelection();
+    this.barData = calculateBarsData(this.df.columns.bySemTypeAll(C.SEM_TYPES.MONOMER), this.df.selection);
+  }
+
+  get usedProperties(): {[propName: string]: string | number | boolean} {
+    this._usedProperties = JSON.parse(this.df.tags['sarProperties'] ?? '{}');
+    return this._usedProperties;
+  }
+  set usedProperties(properties: {[propName: string]: string | number | boolean}) {
+    this.df.tags['sarProperties'] = JSON.stringify(properties);
+    this._usedProperties = properties;
+  }
+
+  get splitByPos() {
+    const splitByPosFlag = (this.df.tags['distributionSplit'] ?? '00')[0];
+    return splitByPosFlag == '1' ? true : false;
+  }
+  set splitByPos(flag: boolean) {
+    const splitByAARFlag = (this.df.tags['distributionSplit'] ?? '00')[1];
+    this.df.tags['distributionSplit'] = `${flag ? 1 : 0}${splitByAARFlag}`;
+  }
+
+  get splitByAAR() {
+    const splitByPosFlag = (this.df.tags['distributionSplit'] ?? '00')[1];
+    return splitByPosFlag == '1' ? true : false;
+  }
+  set splitByAAR(flag: boolean) {
+    const splitByAARFlag = (this.df.tags['distributionSplit'] ?? '00')[0];
+    this.df.tags['distributionSplit'] = `${splitByAARFlag}${flag ? 1 : 0}`;
   }
 
   invalidateSelection(): void {
@@ -103,111 +118,87 @@ export class PeptidesModel {
   createAccordion() {
     const acc = ui.accordion();
     acc.root.style.width = '100%';
-    acc.addTitle(ui.h1(`${this.getBiteset().trueCount} selected rows`));
-    acc.addPane('Substitutions', () => substitutionsWidget(this._dataFrame, this).root, true);
-    acc.addPane('Distribtution', () => getDistributionWidget(this._dataFrame, this).root, true);
+    acc.addTitle(ui.h1(`${this.df.selection.trueCount} selected rows`));
+    acc.addPane('Substitutions', () => substitutionsWidget(this.df, this).root, true);
+    acc.addPane('Distribtution', () => getDistributionWidget(this.df, this).root, true);
 
     return acc;
   }
 
-  updateProperties(): void {
-    this._activityScaling = this._dataFrame.tags['scaling'];
-    this._filterMode = stringToBool(this._dataFrame.tags['filterMode']);
-    this._twoColorMode = stringToBool(this._dataFrame.tags['bidirectionalAnalysis']);
-    this._isSubstitutionOn = stringToBool(this._dataFrame.tags['showSubstitution']);
-    this._maxSubstitutions = parseInt(this._dataFrame.tags['maxSubstitutions']);
-    this._activityLimit = parseFloat(this._dataFrame.tags['activityLimit']);
-  }
-
-  setProperties(
-    activityScaling: string, filterMode: boolean, twoColorMode: boolean, isSubstitutionOn: boolean,
-    maxSubstitutions: number, activityLimit: number, forceUpdate = false,
-  ): void {
-    const chooseAction =
-      (value: string, defaultValue: string | boolean | number): string | boolean | number =>
-        forceUpdate ? value : defaultValue ?? value;
-    this._dataFrame.tags['scaling'] = chooseAction(`${activityScaling}`, this._dataFrame.tags['scaling']);
-    this._dataFrame.tags['filterMode'] = chooseAction(`${filterMode}`, this._dataFrame.tags['filterMode']);
-    this._dataFrame.tags['bidirectionalAnalysis'] =
-      chooseAction(`${twoColorMode}`, this._dataFrame.tags['bidirectionalAnalysis']);
-    this._dataFrame.tags['showSubstitution'] =
-      chooseAction(`${isSubstitutionOn}`, this._dataFrame.tags['showSubstitution']);
-    this._dataFrame.tags['maxSubstitutions'] =
-      chooseAction(`${maxSubstitutions}`, this._dataFrame.tags['maxSubstitutions']);
-    this._dataFrame.tags['activityLimit'] = chooseAction(`${activityLimit}`, this._dataFrame.tags['activityLimit']);
-
-    this.updateProperties();
-  }
-
-  async updateData(
-    activityScaling?: string, sourceGrid?: DG.Grid, twoColorMode?: boolean, activityLimit?: number,
-    maxSubstitutions?: number, isSubstitutionOn?: boolean, filterMode?: boolean,
-  ): Promise<void> {
-    //FIXME: threre are too many assignments, some are duplicating
-    this._activityScaling = activityScaling ?? this._activityScaling;
-    this._sourceGrid = sourceGrid ?? this._sourceGrid;
-    this._twoColorMode = twoColorMode ?? this._twoColorMode;
-    this._activityLimit = activityLimit ?? this._activityLimit;
-    this._maxSubstitutions = maxSubstitutions ?? this._maxSubstitutions;
-    this._isSubstitutionOn = isSubstitutionOn ?? this._isSubstitutionOn;
-    this._filterMode = filterMode ?? this._filterMode;
-    this.setProperties(this._activityScaling, this._filterMode, this._twoColorMode, this._isSubstitutionOn,
-      this._maxSubstitutions, this._activityLimit, true);
-
-    await this.updateDefault();
-  }
-
-  async updateDefault(): Promise<void> {
-    if (this._activityScaling && this._sourceGrid && this._twoColorMode !== null && !this._isUpdating) {
+  getViewer(): SARViewerBase {
+    const viewer = this.sarViewer ?? this.sarViewerVertical;
+    if (!viewer)
+      throw new Error('ViewerError: none of the SAR viewers is initialized');
+    return viewer;
+  }
+
+  isPropertyChanged(viewer: SARViewerBase): boolean {
+    // const viewer = this.getViewer();
+    const viewerProps = viewer.props.getProperties();
+    let result = false;
+    const tempProps = this.usedProperties;
+    for (const property of viewerProps) {
+      const propName = property.name;
+      const propVal = property.get(viewer);
+      if (tempProps[propName] != propVal) {
+        tempProps[propName] = propVal;
+        result = true;
+      }
+    }
+    this.usedProperties = tempProps;
+    return result;
+  }
+
+  updateDefault(): void {
+    const viewer = this.getViewer();
+    const proprtyChanged = this.isPropertyChanged(this.sarViewer) || this.isPropertyChanged(this.sarViewerVertical);
+    if ((this._sourceGrid && !this._isUpdating && proprtyChanged) || !this.isInitialized) {
+      this.isInitialized = true;
       this._isUpdating = true;
-      const [viewerGrid, viewerVGrid, statsDf] = await this.initializeViewersComponents();
+      const [viewerGrid, viewerVGrid, statsDf] = this.initializeViewersComponents();
       //FIXME: modify during the initializeViewersComponents stages
       this._statsDataFrameSubject.next(statsDf);
       this._sarGridSubject.next(viewerGrid);
       this._sarVGridSubject.next(viewerVGrid);
-      if (this._isSubstitutionOn) {
+      if (viewer.showSubstitution) {
         this._substitutionTableSubject.next(this.substitutionsInfo);
         this._isSubstInitialized = true;
       }
-    }
-    await this.updateBarchart();
-    this.invalidateSelection();
 
-    this._isUpdating = false;
-  }
+      this.invalidateSelection();
 
-  async updateBarchart(): Promise<void> {
-    this.stackedBarchart ??= await this._dataFrame?.plot.fromType('StackedBarChartAA') as StackedBarChart;
-    if (this.stackedBarchart && this._sourceGrid)
-      addViewerToHeader(this._sourceGrid, this.stackedBarchart);
+      this._isUpdating = false;
+    }
   }
 
-  async initializeViewersComponents(): Promise<[DG.Grid, DG.Grid, DG.DataFrame]> {
+  initializeViewersComponents(): [DG.Grid, DG.Grid, DG.DataFrame] {
     if (this._sourceGrid === null)
       throw new Error(`Source grid is not initialized`);
 
     //Split the aligned sequence into separate AARs
-    let splitSeqDf: DG.DataFrame | undefined;
-    let invalidIndexes: number[];
-    const col: DG.Column = this._dataFrame.columns.bySemType(C.SEM_TYPES.ALIGNED_SEQUENCE)!;
-    [splitSeqDf, invalidIndexes] = PeptidesModel.splitAlignedPeptides(col);
+    const col: DG.Column = this.df.columns.bySemType(C.SEM_TYPES.MACROMOLECULE)!;
+    const alphabet = col.tags[DG.TAGS.UNITS].split(':')[2];
+    const splitSeqDf = splitAlignedPeptides(col);
+
+    this.barData = calculateBarsData(splitSeqDf.columns.toList(), this.df.selection);
 
     const positionColumns = splitSeqDf.columns.names();
-    const renderColNames: string[] = splitSeqDf.columns.names();
 
-    const activityCol = this._dataFrame.columns.bySemType(C.SEM_TYPES.ACTIVITY)!;
+    const activityCol = this.df.columns.bySemType(C.SEM_TYPES.ACTIVITY)!;
     splitSeqDf.columns.add(activityCol);
 
     this.joinDataFrames(positionColumns, splitSeqDf);
 
-    for (const dfCol of this._dataFrame.columns) {
+    for (const dfCol of this.df.columns) {
       if (positionColumns.includes(dfCol.name))
-        setAARRenderer(dfCol, this._sourceGrid);
+        setAARRenderer(dfCol, alphabet, this._sourceGrid);
     }
 
-    this.sortSourceGrid(this._sourceGrid);
+    this.sortSourceGrid();
 
-    await this.createScaledCol(this._activityScaling, this._dataFrame, this._sourceGrid, splitSeqDf);
+    const viewer = this.getViewer();
+
+    this.createScaledCol(viewer.scaling, splitSeqDf);
 
     //unpivot a table and handle duplicates
     let matrixDf = splitSeqDf.groupBy(positionColumns).aggregate();
@@ -226,66 +217,68 @@ export class PeptidesModel {
     matrixDf.name = 'SAR';
 
     // Setting category order
-    await this.setCategoryOrder(matrixDf);
+    this.setCategoryOrder(matrixDf);
 
     // SAR vertical table (naive, choose best Mean difference from pVals <= 0.01)
     const sequenceDf = this.createVerticalTable();
-    renderColNames.push(C.COLUMNS_NAMES.MEAN_DIFFERENCE);
 
-    if (this._isSubstitutionOn || !this._isSubstInitialized)
+    if (viewer.showSubstitution || !this._isSubstInitialized)
       this.calcSubstitutions();
 
-    //TODO: move everything below out to controller
-    const [sarGrid, sarVGrid] = this.createGrids(matrixDf, positionColumns, sequenceDf);
+    const [sarGrid, sarVGrid] = this.createGrids(matrixDf, positionColumns, sequenceDf, alphabet);
 
     this._sarGrid = sarGrid;
     this._sarVGrid = sarVGrid;
 
-    this.setCellRenderers(renderColNames, sarGrid, sarVGrid);
+    positionColumns.push(C.COLUMNS_NAMES.MEAN_DIFFERENCE);
+
+    this.setBarChartInteraction();
+
+    this.setCellRenderers(positionColumns, sarGrid, sarVGrid);
 
     // show all the statistics in a tooltip over cell
-    this.setTooltips(renderColNames, sarGrid, sarVGrid);
+    this.setTooltips(positionColumns, sarGrid, sarVGrid);
 
     this.setInteractionCallback();
 
     this.setBitsetCallback();
 
-    this.postProcessGrids(this._sourceGrid, invalidIndexes, sarGrid, sarVGrid);
+    this.postProcessGrids(sarGrid, sarVGrid);
 
     //TODO: return class instead
     return [sarGrid, sarVGrid, this.statsDf];
   }
 
-  //TODO: move to controller?
   calcSubstitutions(): void {
-    const activityValues: DG.Column<number> = this._dataFrame.columns.bySemType(C.SEM_TYPES.ACTIVITY_SCALED)!;
-    const columnList: DG.Column<string>[] = this._dataFrame.columns.bySemTypeAll(C.SEM_TYPES.AMINO_ACIDS);
+    const activityValues: DG.Column<number> = this.df.columns.bySemType(C.SEM_TYPES.ACTIVITY_SCALED)!;
+    const columnList: DG.Column<string>[] = this.df.columns.bySemTypeAll(C.SEM_TYPES.MONOMER);
     const nCols = columnList.length;
     if (nCols == 0)
-      throw new Error(`Couldn't find any column of semType '${C.SEM_TYPES.AMINO_ACIDS}'`);
+      throw new Error(`Couldn't find any column of semType '${C.SEM_TYPES.MONOMER}'`);
 
+    const viewer = this.getViewer();
     this.substitutionsInfo = new Map();
-    const nRows = this._dataFrame.rowCount;
+    const nRows = this.df.rowCount;
     for (let seq1Idx = 0; seq1Idx < nRows - 1; seq1Idx++) {
       for (let seq2Idx = seq1Idx + 1; seq2Idx < nRows; seq2Idx++) {
         let substCounter = 0;
-        const activityValSeq1 = activityValues.get(seq1Idx);
-        const activityValSeq2 = activityValues.get(seq2Idx);
+        const activityValSeq1 = activityValues.get(seq1Idx)!;
+        const activityValSeq2 = activityValues.get(seq2Idx)!;
         const delta = activityValSeq1 - activityValSeq2;
-        if (Math.abs(delta) < this._activityLimit)
+        if (Math.abs(delta) < viewer.minActivityDelta)
           continue;
 
         let substCounterFlag = false;
         const tempData: {pos: string, seq1monomer: string, seq2monomer: string, seq1Idx: number, seq2Idx: number}[] =
           [];
         for (const currentPosCol of columnList) {
-          const seq1monomer = currentPosCol.get(seq1Idx);
-          const seq2monomer = currentPosCol.get(seq2Idx);
+          const seq1monomer = currentPosCol.get(seq1Idx)!;
+          const seq2monomer = currentPosCol.get(seq2Idx)!;
           if (seq1monomer == seq2monomer)
             continue;
 
           substCounter++;
-          substCounterFlag = substCounter > this._maxSubstitutions;
+          substCounterFlag = substCounter > viewer.maxSubstitutions;
           if (substCounterFlag)
             break;
 
@@ -343,58 +336,52 @@ export class PeptidesModel {
 
   joinDataFrames(positionColumns: string[], splitSeqDf: DG.DataFrame): void {
     // append splitSeqDf columns to source table and make sure columns are not added more than once
-    const name = this._dataFrame.name;
-    const dfColsSet = new Set(this._dataFrame.columns.names());
+    const name = this.df.name;
+    const dfColsSet = new Set(this.df.columns.names());
     if (!positionColumns.every((col: string) => dfColsSet.has(col))) {
-      this._dataFrame.join(splitSeqDf, [C.COLUMNS_NAMES.ACTIVITY], [C.COLUMNS_NAMES.ACTIVITY],
-        this._dataFrame.columns.names(), positionColumns, 'inner', true);
+      this.df.join(splitSeqDf, [C.COLUMNS_NAMES.ACTIVITY], [C.COLUMNS_NAMES.ACTIVITY],
+        this.df.columns.names(), positionColumns, 'inner', true);
     }
-    this._dataFrame.name = name;
+    this.df.name = name;
     this.currentView.name = name;
   }
 
-  sortSourceGrid(sourceGrid: DG.Grid): void {
-    if (sourceGrid) {
-      const colNames: DG.GridColumn[] = [];
-      for (let i = 1; i < sourceGrid.columns.length; i++)
-        colNames.push(sourceGrid.columns.byIndex(i)!);
+  sortSourceGrid(): void {
+    const colNames: DG.GridColumn[] = [];
+    for (let i = 1; i < this._sourceGrid.columns.length; i++)
+      colNames.push(this._sourceGrid.columns.byIndex(i)!);
 
-      colNames.sort((a, b)=>{
-        if (a.column!.semType == C.SEM_TYPES.AMINO_ACIDS) {
-          if (b.column!.semType == C.SEM_TYPES.AMINO_ACIDS)
-            return 0;
-          return -1;
-        }
-        if (b.column!.semType == C.SEM_TYPES.AMINO_ACIDS)
-          return 1;
-        return 0;
-      });
-      sourceGrid.columns.setOrder(colNames.map((v) => v.name));
-    }
+    colNames.sort((a, b)=>{
+      if (a.column!.semType == C.SEM_TYPES.MONOMER) {
+        if (b.column!.semType == C.SEM_TYPES.MONOMER)
+          return 0;
+        return -1;
+      }
+      if (b.column!.semType == C.SEM_TYPES.MONOMER)
+        return 1;
+      return 0;
+    });
+    this._sourceGrid.columns.setOrder(colNames.map((v) => v.name));
   }
 
-  //TODO: move out, merge with controller's scaleActivity
-  async createScaledCol(
-    activityScaling: string, df: DG.DataFrame, sourceGrid: DG.Grid, splitSeqDf: DG.DataFrame,
-  ): Promise<void> {
-    const [scaledDf, newColName] = await PeptidesModel.scaleActivity(
-      activityScaling, df, df.tags[C.COLUMNS_NAMES.ACTIVITY]);
+  createScaledCol(activityScaling: string, splitSeqDf: DG.DataFrame): void {
+    const [scaledDf, newColName] =
+      scaleActivity(activityScaling, this.df, this.df.tags[C.COLUMNS_NAMES.ACTIVITY]);
     //TODO: make another func
     const scaledCol = scaledDf.getCol(C.COLUMNS_NAMES.ACTIVITY_SCALED);
     scaledCol.semType = C.SEM_TYPES.ACTIVITY_SCALED;
     splitSeqDf.columns.add(scaledCol);
-    const oldScaledCol = df.getCol(C.COLUMNS_NAMES.ACTIVITY_SCALED);
-    df.columns.replace(oldScaledCol, scaledCol);
-    const gridCol = sourceGrid.col(C.COLUMNS_NAMES.ACTIVITY_SCALED);
+    const oldScaledCol = this.df.getCol(C.COLUMNS_NAMES.ACTIVITY_SCALED);
+    this.df.columns.replace(oldScaledCol, scaledCol);
+    const gridCol = this._sourceGrid.col(C.COLUMNS_NAMES.ACTIVITY_SCALED);
     if (gridCol !== null) {
       gridCol.name = newColName;
-      df.tags[C.COLUMNS_NAMES.ACTIVITY_SCALED] = newColName;
+      this.df.tags[C.COLUMNS_NAMES.ACTIVITY_SCALED] = newColName;
     }
 
-    sourceGrid.columns.setOrder([newColName]);
+    this._sourceGrid.columns.setOrder([newColName]);
   }
 
-  //TODO: move out
   calculateStatistics(matrixDf: DG.DataFrame): DG.DataFrame {
     matrixDf = matrixDf.groupBy([C.COLUMNS_NAMES.POSITION, C.COLUMNS_NAMES.AMINO_ACID_RESIDUE]).aggregate();
 
@@ -406,16 +393,15 @@ export class PeptidesModel {
     const ratioCol = matrixCols.addNewFloat(C.COLUMNS_NAMES.RATIO);
     const aarCol = matrixDf.getCol(C.COLUMNS_NAMES.AMINO_ACID_RESIDUE);
     const posCol = matrixDf.getCol(C.COLUMNS_NAMES.POSITION);
-    const activityCol: number[] = this._dataFrame.getCol(C.COLUMNS_NAMES.ACTIVITY_SCALED).toList();
+    const activityCol: number[] = this.df.getCol(C.COLUMNS_NAMES.ACTIVITY_SCALED).toList();
     const sourceDfLen = activityCol.length;
 
     for (let i = 0; i < matrixDf.rowCount; i++) {
       const position: string = posCol.get(i);
       const aar: string = aarCol.get(i);
-      const mask = DG.BitSet.create(sourceDfLen, (j) => this._dataFrame.get(position, j) == aar);
+      const mask = DG.BitSet.create(sourceDfLen, (j) => this.df.get(position, j) == aar);
       const stats = getStats(activityCol, mask);
 
-      //TODO: store as object in a single column
       mdCol.set(i, stats.meanDifference);
       pValCol.set(i, stats.pValue);
       countCol.set(i, stats.count);
@@ -429,11 +415,14 @@ export class PeptidesModel {
     return matrixDf as DG.DataFrame;
   }
 
-  async setCategoryOrder(matrixDf: DG.DataFrame): Promise<void> {
-    const absMD = 'Absolute Mean difference';
-    const sortArgument = this._twoColorMode ? absMD : C.COLUMNS_NAMES.MEAN_DIFFERENCE;
-    if (this._twoColorMode)
-      await this.statsDf.columns.addNewCalculated(absMD, 'Abs(${Mean difference})');
+  setCategoryOrder(matrixDf: DG.DataFrame): void {
+    let sortArgument: string = C.COLUMNS_NAMES.MEAN_DIFFERENCE;
+    if (this.getViewer().bidirectionalAnalysis) {
+      const mdCol = this.statsDf.getCol(sortArgument);
+      sortArgument = 'Absolute Mean difference';
+      const absMDCol = this.statsDf.columns.addNewFloat(sortArgument);
+      absMDCol.init((i) => Math.abs(mdCol.get(i)));
+    }
 
     const aarWeightsDf = this.statsDf.groupBy([C.COLUMNS_NAMES.AMINO_ACID_RESIDUE]).sum(sortArgument, 'weight')
       .aggregate();
@@ -464,7 +453,7 @@ export class PeptidesModel {
     const rowCount = sequenceDf.rowCount;
     for (const pos of posColCategories) {
       tempStats = DG.Stats.fromColumn(mdCol, DG.BitSet.create(rowCount, (i) => posCol.get(i) === pos));
-      maxAtPos[pos] = this._twoColorMode ?
+      maxAtPos[pos] = this.getViewer().bidirectionalAnalysis ?
         (tempStats.max > Math.abs(tempStats.min) ? tempStats.max : tempStats.min) :
         tempStats.max;
     }
@@ -473,7 +462,8 @@ export class PeptidesModel {
     return sequenceDf;
   }
 
-  createGrids(matrixDf: DG.DataFrame, positionColumns: string[], sequenceDf: DG.DataFrame): DG.Grid[] {
+  createGrids(
+    matrixDf: DG.DataFrame, positionColumns: string[], sequenceDf: DG.DataFrame, alphabet: string): DG.Grid[] {
     const sarGrid = matrixDf.plot.grid();
     sarGrid.sort([C.COLUMNS_NAMES.AMINO_ACID_RESIDUE]);
     sarGrid.columns.setOrder([C.COLUMNS_NAMES.AMINO_ACID_RESIDUE].concat(positionColumns as C.COLUMNS_NAMES[]));
@@ -486,16 +476,58 @@ export class PeptidesModel {
 
     let tempCol = matrixDf.getCol(C.COLUMNS_NAMES.AMINO_ACID_RESIDUE);
     if (tempCol)
-      setAARRenderer(tempCol, sarGrid);
+      setAARRenderer(tempCol, alphabet, sarGrid);
 
     tempCol = sequenceDf.getCol(C.COLUMNS_NAMES.AMINO_ACID_RESIDUE);
     if (tempCol)
-      setAARRenderer(tempCol, sarGrid);
+      setAARRenderer(tempCol, alphabet, sarGrid);
 
     return [sarGrid, sarVGrid];
   }
 
-  //TODO: move out
+  setBarChartInteraction() {
+    const eventAction = (ev: MouseEvent): void => {
+      const cell = this._sourceGrid.hitTest(ev.offsetX, ev.offsetY);
+      if (cell?.isColHeader && cell.tableColumn?.semType == C.SEM_TYPES.MONOMER) {
+        const newBarPart = this.findAARandPosition(cell, ev);
+        this.requestBarchartAction(ev, newBarPart);
+      }
+    };
+
+    // The following events makes the barchart interactive
+    rxjs.fromEvent<MouseEvent>(this._sourceGrid.overlay, 'mousemove').subscribe((mouseMove: MouseEvent) => eventAction(mouseMove));
+    rxjs.fromEvent<MouseEvent>(this._sourceGrid.overlay, 'click').subscribe((mouseMove: MouseEvent) => eventAction(mouseMove));
+  }
+
+  findAARandPosition(cell: DG.GridCell, ev: MouseEvent) {
+    const barCoords = this.barsBounds[cell.tableColumn!.name];
+    for (const [monomer, coords] of Object.entries(barCoords)) {
+      const isIntersectingX = ev.offsetX >= coords.x && ev.offsetX <= coords.x + coords.width;
+      const isIntersectingY = ev.offsetY >= coords.y && ev.offsetY <= coords.y + coords.height;
+      if (isIntersectingX && isIntersectingY)
+        return {monomer: monomer, position: cell.tableColumn!.name};
+    }
+
+    return null;
+  }
+
+  requestBarchartAction(ev: MouseEvent, barPart: {position: string, monomer: string} | null): void {
+    if (!barPart)
+      return;
+    const monomer = barPart.monomer;
+    const position = barPart.position;
+    if (ev.type === 'click') {
+      ev.shiftKey ? this.modifyCurrentSelection(monomer, position) :
+        this.initCurrentSelection(monomer, position);
+    } else {
+      const bar = `${monomer}:${position}`;
+      if (this.cachedBarchartTooltip.bar == bar)
+        ui.tooltip.show(this.cachedBarchartTooltip.tooltip!, ev.clientX, ev.clientY);
+      else
+        this.cachedBarchartTooltip = {bar: bar, tooltip: this.showTooltipAt(monomer, position, ev.clientX, ev.clientY)};
+    }
+  }
+
   setCellRenderers(renderColNames: string[], sarGrid: DG.Grid, sarVGrid: DG.Grid): void {
     const mdCol = this.statsDf.getCol(C.COLUMNS_NAMES.MEAN_DIFFERENCE);
     //decompose into two different renering funcs
@@ -527,8 +559,9 @@ export class PeptidesModel {
             tableColName : gridTable.get(C.COLUMNS_NAMES.POSITION, tableRowIndex);
           const currentAAR: string = gridTable.get(C.COLUMNS_NAMES.AMINO_ACID_RESIDUE, tableRowIndex);
 
-          renderSARCell(canvasContext, currentAAR, currentPosition, this.statsDf, this._twoColorMode, mdCol, bound,
-            cellValue, this.currentSelection, this._isSubstitutionOn ? this.substitutionsInfo : null);
+          const viewer = this.getViewer();
+          renderSARCell(canvasContext, currentAAR, currentPosition, this.statsDf, viewer.bidirectionalAnalysis, mdCol,
+            bound, cellValue, this.currentSelection, viewer.showSubstitution ? this.substitutionsInfo : null);
         }
         args.preventDefault();
       }
@@ -536,26 +569,45 @@ export class PeptidesModel {
     };
     sarGrid.onCellRender.subscribe(renderCell);
     sarVGrid.onCellRender.subscribe(renderCell);
+
+    this._sourceGrid.setOptions({'colHeaderHeight': 130});
+    this._sourceGrid.onCellRender.subscribe((gcArgs) => {
+      const context = gcArgs.g;
+      const bounds = gcArgs.bounds;
+      const col = gcArgs.cell.tableColumn;
+
+      context.save();
+      context.beginPath();
+      context.rect(bounds.x, bounds.y, bounds.width, bounds.height);
+      context.clip();
+
+      if (gcArgs.cell.isColHeader && col?.semType == C.SEM_TYPES.MONOMER) {
+        const barBounds = renderBarchart(context, col, this.barData[col.name], bounds, this.df.filter.trueCount);
+        this.barsBounds[col.name] = barBounds;
+        gcArgs.preventDefault();
+      }
+
+      context.restore();
+    });
   }
 
   setTooltips(renderColNames: string[], sarGrid: DG.Grid, sarVGrid: DG.Grid): void {
     const showTooltip = (cell: DG.GridCell, x: number, y: number): boolean => {
       const tableCol = cell.tableColumn;
       const tableColName = tableCol?.name;
+      const tableRowIndex = cell.tableRowIndex;
 
-      if (!cell.isRowHeader && !cell.isColHeader && tableCol !== null) {
-        const tableRowIndex = cell.tableRowIndex;
+      if (!cell.isRowHeader && !cell.isColHeader && tableCol && tableRowIndex) {
+        const table = cell.grid.table;
+        const currentAAR = table.get(C.COLUMNS_NAMES.AMINO_ACID_RESIDUE, tableRowIndex);
 
-        if (tableCol.semType == C.SEM_TYPES.AMINO_ACIDS) {
-          const monomerLib = this._dataFrame.temp[MonomerLibrary.id];
-          ChemPalette.showTooltip(cell, x, y, monomerLib);
-        } else if (cell.cell.value !== null && tableRowIndex !== null && renderColNames.includes(tableColName!)) {
-          const table = cell.grid.table;
+        if (tableCol.semType == C.SEM_TYPES.MONOMER)
+          this.showMonomerTooltip(currentAAR, x, y);
+        else if (cell.cell.value && renderColNames.includes(tableColName!)) {
           const currentPosition = tableColName !== C.COLUMNS_NAMES.MEAN_DIFFERENCE ? tableColName :
             table.get(C.COLUMNS_NAMES.POSITION, tableRowIndex);
-          const currentAAR = table.get(C.COLUMNS_NAMES.AMINO_ACID_RESIDUE, tableRowIndex);
 
-          this.showTooltip(currentAAR, currentPosition, x, y);
+          this.showTooltipAt(currentAAR, currentPosition, x, y);
         }
       }
       return true;
@@ -563,13 +615,36 @@ export class PeptidesModel {
 
     sarGrid.onCellTooltip(showTooltip);
     sarVGrid.onCellTooltip(showTooltip);
+    this._sourceGrid.onCellTooltip((cell, x, y) => {
+      const col = cell.tableColumn;
+      const cellValue = cell.cell.value;
+      if (cellValue && col && col.semType === C.SEM_TYPES.MONOMER)
+        this.showMonomerTooltip(cellValue, x, y);
+      return true;
+    });
+  }
+
+  showMonomerTooltip(aar: string, x: number, y: number): void {
+    const tooltipElements: HTMLDivElement[] = [];
+    //@ts-ignore: no types for org
+    // const monomer: type.HELMMonomer = org.helm.webeditor.monomers.getMonomer('HELM_AA', aar);
+    const monomer: type.HELMMonomer = this.monomerLib[aar.toLowerCase()];
+
+    if (monomer) {
+      tooltipElements.push(ui.div(monomer.n));
+      const options = {autoCrop: true, autoCropMargin: 0, suppressChiralText: true};
+      tooltipElements.push(grok.chem.svgMol(monomer.m, undefined, undefined, options));
+    } else
+      tooltipElements.push(ui.div(aar));
+
+    ui.tooltip.show(ui.divV(tooltipElements), x, y);
   }
 
-  showTooltip(aar: string, position: string, x: number, y: number): void {
+  showTooltipAt(aar: string, position: string, x: number, y: number): HTMLDivElement | null {
     const currentStatsDf = this.statsDf.rows.match({Pos: position, AAR: aar}).toDataFrame();
-    const activityCol = this._dataFrame.columns.bySemType(C.SEM_TYPES.ACTIVITY_SCALED)!;
+    const activityCol = this.df.columns.bySemType(C.SEM_TYPES.ACTIVITY_SCALED)!;
     const splitCol = DG.Column.bool(C.COLUMNS_NAMES.SPLIT_COL, activityCol.length);
-    const currentPosCol = this._dataFrame.getCol(position);
+    const currentPosCol = this.df.getCol(position);
     splitCol.init((i) => currentPosCol.get(i) == aar);
     const distributionTable = DG.DataFrame.fromColumns([activityCol, splitCol]);
     const stats: Stats = {
@@ -578,13 +653,16 @@ export class PeptidesModel {
       pValue: currentStatsDf.get(C.COLUMNS_NAMES.P_VALUE, 0),
       meanDifference: currentStatsDf.get(C.COLUMNS_NAMES.MEAN_DIFFERENCE, 0),
     };
-    const tooltip = getDistributionAndStats(
-      distributionTable, stats, `${position} : ${aar}`, 'Other', true);
+    if (!stats.count)
+      return null;
+
+    const tooltip = getDistributionAndStats(distributionTable, stats, `${position} : ${aar}`, 'Other', true);
 
     ui.tooltip.show(tooltip, x, y);
+
+    return tooltip;
   }
 
-  //TODO: think about it, move out?
   setInteractionCallback(): void {
     const sarDf = this._sarGrid.dataFrame;
     const sarVDf = this._sarVGrid.dataFrame;
@@ -649,7 +727,7 @@ export class PeptidesModel {
   }
 
   invalidateGrids(): void {
-    this.stackedBarchart?.computeData();
+    // this.stackedBarchart?.computeData();
     this._sarGrid.invalidate();
     this._sarVGrid.invalidate();
     this._sourceGrid?.invalidate();
@@ -659,12 +737,9 @@ export class PeptidesModel {
   setBitsetCallback(): void {
     if (this.isBitsetChangedInitialized)
       return;
-    const filter = this._dataFrame.filter;
-    const selection = this._dataFrame.selection;
-
-    const changeBitset = (currentBitset: DG.BitSet, previousBitset: DG.BitSet): void => {
-      previousBitset.setAll(!this._filterMode, false);
+    const selection = this.df.selection;
 
+    const changeBitset = (currentBitset: DG.BitSet): void => {
       const edfSelection = this.edf?.selection;
       if (this.isPeptideSpaceChangingBitset) {
         if (edfSelection == null)
@@ -690,8 +765,8 @@ export class PeptidesModel {
       //TODO: move out
       const getBitAt = (i: number) => {
         for (const position of positionList) {
-          const positionCol: DG.Column<string> = this._dataFrame.getCol(position);
-          if (this._currentSelection[position].includes(positionCol.get(i)))
+          const positionCol: DG.Column<string> = this.df.getCol(position);
+          if (this._currentSelection[position].includes(positionCol.get(i)!))
             return true;
         }
         return false;
@@ -701,29 +776,19 @@ export class PeptidesModel {
       updateEdfSelection();
     };
 
-    filter.onChanged.subscribe(() => changeBitset(filter, selection));
-    selection.onChanged.subscribe(() => changeBitset(selection, filter));
+    selection.onChanged.subscribe(() => changeBitset(selection));
     this.isBitsetChangedInitialized = true;
   }
 
   fireBitsetChanged(isPeptideSpaceSource: boolean = false): void {
     this.isPeptideSpaceChangingBitset = isPeptideSpaceSource;
-    this.getBiteset().fireChanged();
+    this.df.selection.fireChanged();
     this.modifyOrCreateSplitCol();
     grok.shell.o = this.createAccordion().root;
     this.isPeptideSpaceChangingBitset = false;
   }
 
-  getBiteset(): DG.BitSet {return this._filterMode ? this._dataFrame.filter : this._dataFrame.selection;}
-
-  //TODO: move out
-  postProcessGrids(sourceGrid: DG.Grid, invalidIndexes: number[], sarGrid: DG.Grid, sarVGrid: DG.Grid): void {
-    sourceGrid.onCellPrepare((cell: DG.GridCell) => {
-      const currentRowIndex = cell.tableRowIndex;
-      if (currentRowIndex && invalidIndexes.includes(currentRowIndex) && !cell.isRowHeader)
-        cell.style.backColor = DG.Color.lightLightGray;
-    });
-
+  postProcessGrids(sarGrid: DG.Grid, sarVGrid: DG.Grid): void {
     const mdCol: DG.GridColumn = sarVGrid.col(C.COLUMNS_NAMES.MEAN_DIFFERENCE)!;
     mdCol.name = 'Diff';
 
@@ -753,141 +818,54 @@ export class PeptidesModel {
   }
 
   getSplitColValueAt(index: number, aar: string, position: string, aarLabel: string): string {
-    const currentAAR = this._dataFrame.get(position, index) as string;
+    const currentAAR = this.df.get(position, index) as string;
     return currentAAR === aar ? aarLabel : C.CATEGORIES.OTHER;
   }
 
   modifyOrCreateSplitCol(): void {
-    const bs = this.getBiteset();
-    this.splitCol = this._dataFrame.col(C.COLUMNS_NAMES.SPLIT_COL) ??
-      this._dataFrame.columns.addNewBool(C.COLUMNS_NAMES.SPLIT_COL);
+    const bs = this.df.selection;
+    this.splitCol = this.df.col(C.COLUMNS_NAMES.SPLIT_COL) ??
+      this.df.columns.addNewBool(C.COLUMNS_NAMES.SPLIT_COL);
     this.splitCol.init((i) => bs.get(i));
     this.splitCol.compact();
   }
 
-  static async scaleActivity(
-    activityScaling: string, df: DG.DataFrame, originalActivityName?: string, cloneBitset = false,
-  ): Promise<[DG.DataFrame, string]> {
-    let currentActivityColName = originalActivityName ?? C.COLUMNS_NAMES.ACTIVITY;
-    const flag = df.columns.names().includes(currentActivityColName) &&
-      currentActivityColName === originalActivityName;
-    currentActivityColName = flag ? currentActivityColName : C.COLUMNS_NAMES.ACTIVITY;
-    const tempDf = df.clone(cloneBitset ? df.filter : null, [currentActivityColName]);
-
-    let formula = '${' + currentActivityColName + '}';
-    let newColName = 'activity';
-    switch (activityScaling) {
-    case 'none':
-      break;
-    case 'lg':
-      formula = `Log10(${formula})`;
-      newColName = `Log10(${newColName})`;
-      break;
-    case '-lg':
-      formula = `-1*Log10(${formula})`;
-      newColName = `-Log10(${newColName})`;
-      break;
-    default:
-      throw new Error(`ScalingError: method \`${activityScaling}\` is not available.`);
-    }
-
-    await tempDf.columns.addNewCalculated(C.COLUMNS_NAMES.ACTIVITY_SCALED, formula);
-    df.tags['scaling'] = activityScaling;
-
-    return [tempDf, newColName];
-  }
-
-  static splitAlignedPeptides(peptideColumn: DG.Column<string>, filter: boolean = true): [DG.DataFrame, number[]] {
-    const separator = peptideColumn.tags[C.TAGS.SEPARATOR] ?? getSeparator(peptideColumn);
-    const splitPeptidesArray: string[][] = [];
-    let currentSplitPeptide: string[];
-    let modeMonomerCount = 0;
-    let currentLength;
-    const colLength = peptideColumn.length;
-
-    // splitting data
-    const monomerLengths: {[index: string]: number} = {};
-    for (let i = 0; i < colLength; i++) {
-      currentSplitPeptide = peptideColumn.get(i).split(separator).map((value: string) => value ? value : '-');
-      splitPeptidesArray.push(currentSplitPeptide);
-      currentLength = currentSplitPeptide.length;
-      monomerLengths[currentLength + ''] =
-        monomerLengths[currentLength + ''] ? monomerLengths[currentLength + ''] + 1 : 1;
-    }
-    modeMonomerCount =
-      parseInt(Object.keys(monomerLengths).reduce((a, b) => monomerLengths[a] > monomerLengths[b] ? a : b));
-
-    // making sure all of the sequences are of the same size
-    // and marking invalid sequences
-    let nTerminal: string;
-    const invalidIndexes: number[] = [];
-    let splitColumns: string[][] = Array.from({length: modeMonomerCount}, (_) => []);
-    modeMonomerCount--; // minus N-terminal
-    for (let i = 0; i < colLength; i++) {
-      currentSplitPeptide = splitPeptidesArray[i];
-      nTerminal = currentSplitPeptide.pop()!; // it is guaranteed that there will be at least one element
-      currentLength = currentSplitPeptide.length;
-      if (currentLength !== modeMonomerCount)
-        invalidIndexes.push(i);
-
-      for (let j = 0; j < modeMonomerCount; j++)
-        splitColumns[j].push(j < currentLength ? currentSplitPeptide[j] : '-');
-
-      splitColumns[modeMonomerCount].push(nTerminal);
-    }
-    modeMonomerCount--; // minus C-terminal
-
-    //create column names list
-    const columnNames = Array.from({length: modeMonomerCount}, (_, index) => `${index + 1 < 10 ? 0 : ''}${index + 1 }`);
-    columnNames.splice(0, 0, 'N');
-    columnNames.push('C');
-
-    // filter out the columns with the same values
-    if (filter) {
-      splitColumns = splitColumns.filter((positionArray, index) => {
-        const isRetained = new Set(positionArray).size > 1;
-        if (!isRetained)
-          columnNames.splice(index, 1);
-
-        return isRetained;
-      });
-    }
-
-    return [
-      DG.DataFrame.fromColumns(splitColumns.map((positionArray, index) => {
-        return DG.Column.fromList('string', columnNames[index], positionArray);
-      })),
-      invalidIndexes,
-    ];
-  }
-
   syncProperties(isSourceSAR = true): void {
-    const sarViewer: SARViewer = this._dataFrame.temp['sarViewer'];
-    const sarViewerVertical: SARViewerVertical = this._dataFrame.temp['sarViewerVertical'];
-    const sourceViewer = isSourceSAR ? sarViewer : sarViewerVertical;
-    const targetViewer = isSourceSAR ? sarViewerVertical : sarViewer;
-    const properties = sourceViewer.props.getProperties();
-    for (const property of properties)
-      targetViewer.props.set(property.name, property.get(sourceViewer));
+    if (this.sarViewer && this.sarViewerVertical) {
+      const [sourceViewer, targetViewer] = isSourceSAR ? [this.sarViewer, this.sarViewerVertical] :
+        [this.sarViewerVertical, this.sarViewer];
+      const properties = sourceViewer.props.getProperties();
+      const newProps: {[propName: string]: string | number | boolean} = {};
+      for (const property of properties) {
+        const propName = property.name;
+        const propVal = property.get(sourceViewer);
+        targetViewer.props.set(propName, propVal);
+        newProps[propName] = propVal;
+      }
+      this.usedProperties = newProps;
+    } else
+      console.warn('Warning: could not sync viewer properties, one of the viewers is not initialized');
   }
 
   /** Class initializer */
   async init(): Promise<void> {
     if (this.isInitialized)
       return;
-    this.isInitialized = true;
 
-    this.currentView = this._dataFrame.tags[C.PEPTIDES_ANALYSIS] == 'true' ? grok.shell.v as DG.TableView :
-      grok.shell.addTableView(this._dataFrame);
-    const sourceGrid = this.currentView.grid;
-    if (this._dataFrame.tags[C.PEPTIDES_ANALYSIS] == 'true')
+    this.monomerLib =
+      JSON.parse(await grok.functions.call('Helm:getMonomerLib', {type: this.df.getTag('monomerType')}));
+
+    this.currentView = this.df.tags[C.PEPTIDES_ANALYSIS] == 'true' ? grok.shell.v as DG.TableView :
+      grok.shell.addTableView(this.df);
+    this._sourceGrid = this.currentView.grid;
+    if (this.df.tags[C.PEPTIDES_ANALYSIS] == 'true')
       return;
 
-    this._dataFrame.tags[C.PEPTIDES_ANALYSIS] = 'true';
-    sourceGrid.col(C.COLUMNS_NAMES.ACTIVITY_SCALED)!.name = this._dataFrame.tags[C.COLUMNS_NAMES.ACTIVITY_SCALED];
-    sourceGrid.columns.setOrder([this._dataFrame.tags[C.COLUMNS_NAMES.ACTIVITY_SCALED]]);
+    this.df.tags[C.PEPTIDES_ANALYSIS] = 'true';
+    this._sourceGrid.col(C.COLUMNS_NAMES.ACTIVITY_SCALED)!.name = this.df.tags[C.COLUMNS_NAMES.ACTIVITY_SCALED];
+    this._sourceGrid.columns.setOrder([this.df.tags[C.COLUMNS_NAMES.ACTIVITY_SCALED]]);
 
-    this._dataFrame.temp[C.EMBEDDING_STATUS] = false;
+    this.df.temp[C.EMBEDDING_STATUS] = false;
     const adjustCellSize = (grid: DG.Grid): void => {
       const colNum = grid.columns.length;
       for (let i = 0; i < colNum; ++i) {
@@ -897,36 +875,37 @@ export class PeptidesModel {
       grid.props.rowHeight = 20;
     };
 
-    for (let i = 0; i < sourceGrid.columns.length; i++) {
-      const aarCol = sourceGrid.columns.byIndex(i);
-      if (aarCol && aarCol.name && aarCol.column?.semType !== C.SEM_TYPES.AMINO_ACIDS &&
-        aarCol.name !== this._dataFrame.tags[C.COLUMNS_NAMES.ACTIVITY_SCALED])
+    for (let i = 0; i < this._sourceGrid.columns.length; i++) {
+      const aarCol = this._sourceGrid.columns.byIndex(i);
+      if (aarCol && aarCol.name && aarCol.column?.semType !== C.SEM_TYPES.MONOMER &&
+        aarCol.name !== this.df.tags[C.COLUMNS_NAMES.ACTIVITY_SCALED])
         aarCol.visible = false;
     }
 
-    const options = {scaling: this._dataFrame.tags['scaling']};
-    await this.updateData(this._dataFrame.tags['scaling'], sourceGrid, false, 1, 2, false, false);
+    const options = {scaling: this.df.tags['scaling']};
 
     const dockManager = this.currentView.dockManager;
 
-    const sarViewer = await this._dataFrame.plot.fromType('peptide-sar-viewer', options) as SARViewer;
+    this.sarViewer = await this.df.plot.fromType('peptide-sar-viewer', options) as SARViewer;
 
-    const sarViewerVertical =
-      await this._dataFrame.plot.fromType('peptide-sar-viewer-vertical', options) as SARViewerVertical;
+    this.sarViewerVertical =
+      await this.df.plot.fromType('peptide-sar-viewer-vertical', options) as SARViewerVertical;
 
-    const sarViewersGroup: viewerTypes[] = [sarViewer, sarViewerVertical];
+    const sarViewersGroup: viewerTypes[] = [this.sarViewer, this.sarViewerVertical];
 
-    if (this._dataFrame.rowCount <= 10000) {
+    if (this.df.rowCount <= 10000) {
       const peptideSpaceViewerOptions = {method: 'UMAP', measure: 'Levenshtein', cyclesCount: 100};
       const peptideSpaceViewer =
-        await this._dataFrame.plot.fromType('peptide-space-viewer', peptideSpaceViewerOptions) as PeptideSpaceViewer;
+        await this.df.plot.fromType('peptide-space-viewer', peptideSpaceViewerOptions) as PeptideSpaceViewer;
       dockManager.dock(peptideSpaceViewer, DG.DOCK_TYPE.RIGHT, null, 'Peptide Space Viewer');
     }
 
+    this.updateDefault();
+
     dockViewers(sarViewersGroup, DG.DOCK_TYPE.RIGHT, dockManager, DG.DOCK_TYPE.DOWN);
 
-    sourceGrid.props.allowEdit = false;
-    adjustCellSize(sourceGrid);
+    this._sourceGrid.props.allowEdit = false;
+    adjustCellSize(this._sourceGrid);
 
     this.invalidateGrids();
   }