@datagrok/bio 2.8.6 → 2.10.0

package/package.json

@@ -5,7 +5,7 @@
     "name": "Leonid Stolbov",
     "email": "lstolbov@datagrok.ai"
   },
-  "version": "2.8.6",
+  "version": "2.10.0",
   "description": "Bioinformatics support (import/export of sequences, conversion, visualization, analysis). [See more](https://github.com/datagrok-ai/public/blob/master/packages/Bio/README.md) for details.",
   "repository": {
     "type": "git",
@@ -34,14 +34,14 @@
   ],
   "dependencies": {
     "@biowasm/aioli": "^3.1.0",
-    "@datagrok-libraries/bio": "^5.36.0",
+    "@datagrok-libraries/bio": "^5.38.0",
     "@datagrok-libraries/chem-meta": "^1.0.1",
     "@datagrok-libraries/ml": "^6.3.39",
     "@datagrok-libraries/tutorials": "^1.3.6",
     "@datagrok-libraries/utils": "^4.0.17",
     "cash-dom": "^8.0.0",
     "css-loader": "^6.7.3",
-    "datagrok-api": "^1.13.3",
+    "datagrok-api": "^1.16.0",
     "dayjs": "^1.11.4",
     "fastest-levenshtein": "^1.0.16",
     "openchemlib": "6.0.1",
@@ -62,8 +62,8 @@
     "webpack": "^5.76.3",
     "webpack-bundle-analyzer": "latest",
     "webpack-cli": "^4.9.1",
-    "@datagrok/chem": "1.4.21",
-    "@datagrok/helm": "2.1.7"
+    "@datagrok/chem": "1.7.2",
+    "@datagrok/helm": "2.1.16"
   },
   "scripts": {
     "link-api": "npm link datagrok-api",

package/src/analysis/sequence-space.ts

@@ -6,7 +6,6 @@ import {ISequenceSpaceParams} from '@datagrok-libraries/ml/src/viewers/activity-
 import {invalidateMols, MONOMERIC_COL_TAGS} from '../substructure-search/substructure-search';
 import {UnitsHandler} from '@datagrok-libraries/bio/src/utils/units-handler';
 import * as grok from 'datagrok-api/grok';
-import {NotationConverter} from '@datagrok-libraries/bio/src/utils/notation-converter';
 import {ALPHABET, NOTATION} from '@datagrok-libraries/bio/src/utils/macromolecule';
 import {MmDistanceFunctionsNames} from '@datagrok-libraries/ml/src/macromolecule-distance-functions';
 
@@ -57,17 +56,17 @@ export async function sequenceSpaceByFingerprints(spaceParams: ISequenceSpacePar
 }
 
 export async function getSequenceSpace(spaceParams: ISequenceSpaceParams): Promise<ISequenceSpaceResult> {
-  const nc = new NotationConverter(spaceParams.seqCol);
-  if (nc.isFasta() || (nc.isSeparator() && nc.alphabet && nc.alphabet !== ALPHABET.UN)) {
+  const ncUH = UnitsHandler.getOrCreate(spaceParams.seqCol);
+  if (ncUH.isFasta() || (ncUH.isSeparator() && ncUH.alphabet && ncUH.alphabet !== ALPHABET.UN)) {
     let distanceFName = MmDistanceFunctionsNames.LEVENSHTEIN;
     let seqList = spaceParams.seqCol.toList();
-    if (nc.isSeparator()) {
-      const fastaCol = nc.convert(NOTATION.FASTA);
+    if (ncUH.isSeparator()) {
+      const fastaCol = ncUH.convert(NOTATION.FASTA);
       seqList = fastaCol.toList();
       const uh = UnitsHandler.getOrCreate(fastaCol);
       distanceFName = uh.getDistanceFunctionName();
     } else {
-      distanceFName = nc.getDistanceFunctionName();
+      distanceFName = ncUH.getDistanceFunctionName();
     }
     for (let i = 0; i < seqList.length; i++) {
       // toList puts empty values in array and it causes downstream errors. replace with null

package/src/apps/get-region-app.ts

@@ -0,0 +1,56 @@
+import * as grok from 'datagrok-api/grok';
+import * as ui from 'datagrok-api/ui';
+import * as DG from 'datagrok-api/dg';
+
+import {TAGS, positionSeparator} from '@datagrok-libraries/bio/src/utils/macromolecule';
+import {IWebLogoViewer} from '@datagrok-libraries/bio/src/viewers/web-logo';
+
+import {_package} from '../package';
+
+const csv = `seq,value
+ATCCGTCGT,0.5
+TGTTCGTCA,0.4
+ATGGTCGTA,0.7
+ATCCGTGCA,0.1`;
+
+const positionNames = ['1', '1A', '1C', '2', '4', '4A', '4B', '5', '6'].join(positionSeparator);
+
+const regions = [
+  {name: 'first region', start: '1', end: '2'},
+  {name: 'second region', start: '1C', end: '4'},
+  {name: 'overlapping second', start: '1C', end: '4A'},
+  {name: 'whole sequence', start: '1', end: '6'},
+  {name: 'bad start', start: '0', end: '6'},
+  {name: 'bad end', start: '1', end: '4C'},
+  {name: 'bad start & end', start: '0', end: '4C'},
+];
+
+export class GetRegionApp {
+  df: DG.DataFrame;
+  view: DG.TableView;
+
+  constructor(
+    private readonly urlParams: URLSearchParams,
+    private readonly funcName: string
+  ) {}
+
+  async init(): Promise<void> {
+    this.df = DG.DataFrame.fromCsv(csv);
+    const seqCol = this.df.getCol('seq');
+    seqCol.setTag(TAGS.positionNames, positionNames);
+    seqCol.setTag(TAGS.regions, JSON.stringify(regions));
+
+    await this.buildView();
+  }
+
+  // -- View --
+
+  async buildView(): Promise<void> {
+    this.view = grok.shell.addTableView(this.df);
+    this.view.path = this.view.basePath = `func/${_package.name}.${this.funcName}`;
+
+    const viewer: DG.Viewer & IWebLogoViewer = (await this.view.dataFrame.plot
+      .fromType('WebLogo')) as DG.Viewer & IWebLogoViewer;
+    this.view.dockManager.dock(viewer, DG.DOCK_TYPE.DOWN, null, 'WebLogo', 0.35);
+  }
+}

package/src/apps/web-logo-app.ts

@@ -11,15 +11,12 @@ import {PROPS as wlPROPS} from '../viewers/web-logo-viewer';
 import {_package} from '../package';
 
 export class WebLogoApp {
-  private _funcName: string = '';
-
   df: DG.DataFrame;
   view: DG.TableView;
 
-  constructor(private readonly urlParams: URLSearchParams) {}
+  constructor(private readonly urlParams: URLSearchParams, private readonly funcName: string) {}
 
-  async init(df: DG.DataFrame, funcName: string): Promise<void> {
-    this._funcName = funcName;
+  async init(df: DG.DataFrame): Promise<void> {
     this.df = df;
 
     await this.buildView();
@@ -33,7 +30,7 @@ export class WebLogoApp {
       .toArray().join('&');
 
     this.view = grok.shell.addTableView(this.df);
-    this.view.path = this.view.basePath = `func/${_package.name}.${this._funcName}?${urlParamsTxt}`;
+    this.view.path = this.view.basePath = `func/${_package.name}.${this.funcName}?${urlParamsTxt}`;
 
     const options: { [p: string]: any } = {sequenceColumnName: 'sequence'};
     for (const [optName, optValue] of this.urlParams.entries()) {

package/src/package-test.ts

@@ -24,10 +24,12 @@ import './tests/pepsea-tests';
 import './tests/viewers';
 import './tests/units-handler-tests';
 import './tests/units-handler-splitted-tests';
+import './tests/units-handler-get-region';
 import './tests/to-atomic-level-tests';
 import './tests/mm-distance-tests';
 import './tests/activity-cliffs-tests';
 import './tests/sequence-space-test';
+import './tests/scoring';
 
 
 export const _package = new DG.Package();

package/src/package-types.ts

@@ -14,7 +14,6 @@ export const enum BioPackagePropertiesNames {
 
 
 export class BioPackageProperties extends Map<string, any> {
-
   private _onPropertyChanged: Subject<string> = new Subject<string>();
   public get onPropertyChanged(): Observable<string> { return this._onPropertyChanged; }
 
@@ -58,4 +57,17 @@ export class BioPackage extends DG.Package {
   public get properties(): BioPackageProperties { return this._properties; };
 
   public set properties(value: BioPackageProperties) { this._properties = value; }
+
+  private _initialized: boolean = false;
+
+  public get initialized(): boolean { return this._initialized;}
+
+  public completeInit(): void { this._initialized = true;}
+
+  handleErrorUI(err: any) {
+    const errMsg = err instanceof Error ? err.message : err.toString();
+    const errStack = err instanceof Error ? err.stack : undefined;
+    grok.shell.error(errMsg);
+    this.logger.error(errMsg, undefined, errStack);
+  }
 }

package/src/package.ts

@@ -21,7 +21,7 @@ import {removeEmptyStringRows} from '@datagrok-libraries/utils/src/dataframe-uti
 
 import {SequenceSimilarityViewer} from './analysis/sequence-similarity-viewer';
 import {SequenceDiversityViewer} from './analysis/sequence-diversity-viewer';
-import {substructureSearchDialog} from './substructure-search/substructure-search';
+import {SubstructureSearchDialog} from './substructure-search/substructure-search';
 import {saveAsFastaUI} from './utils/save-as-fasta';
 import {BioSubstructureFilter} from './widgets/bio-substructure-filter';
 import {delay} from '@datagrok-libraries/utils/src/test';
@@ -40,10 +40,11 @@ import {
   getLibFileNameList,
   getLibraryPanelUI
 } from './utils/monomer-lib';
-import {getMacromoleculeColumn} from './utils/ui-utils';
+import {getMacromoleculeColumns} from './utils/ui-utils';
 import {DimReductionMethods, ITSNEOptions, IUMAPOptions} from '@datagrok-libraries/ml/src/reduce-dimensionality';
 import {SequenceSpaceFunctionEditor} from '@datagrok-libraries/ml/src/functionEditors/seq-space-editor';
 import {ActivityCliffsFunctionEditor} from '@datagrok-libraries/ml/src/functionEditors/activity-cliffs-editor';
+import {SCORE, calculateScores} from '@datagrok-libraries/bio/src/utils/macromolecule/scoring';
 
 import {demoBio01UI} from './demo/bio01-similarity-diversity';
 import {demoBio01aUI} from './demo/bio01a-hierarchical-clustering-and-sequence-space';
@@ -54,7 +55,6 @@ import {checkInputColumnUI} from './utils/check-input-column';
 import {multipleSequenceAlignmentUI} from './utils/multiple-sequence-alignment-ui';
 import {MmDistanceFunctionsNames} from '@datagrok-libraries/ml/src/macromolecule-distance-functions';
 import {BitArrayMetrics, BitArrayMetricsNames} from '@datagrok-libraries/ml/src/typed-metrics';
-import {NotationConverter} from '@datagrok-libraries/bio/src/utils/notation-converter';
 import {WebLogoApp} from './apps/web-logo-app';
 import {SplitToMonomersFunctionEditor} from './function-edtiors/split-to-monomers-editor';
 import {splitToMonomersUI} from './utils/split-to-monomers';
@@ -65,10 +65,13 @@ import {PackageSettingsEditorWidget} from './widgets/package-settings-editor-wid
 import {getCompositionAnalysisWidget} from './widgets/composition-analysis-widget';
 import {MacromoleculeColumnWidget} from './utils/macromolecule-column-widget';
 import {addCopyMenuUI} from './utils/context-menu';
+import {getRegionDo} from './utils/get-region';
+import {GetRegionApp} from './apps/get-region-app';
+import {GetRegionFuncEditor} from './utils/get-region-func-editor';
 
 export const _package = new BioPackage();
 
-// /** Avoid reassinging {@link monomerLib} because consumers subscribe to {@link IMonomerLib.onChanged} event */
+// /** Avoid reassigning {@link monomerLib} because consumers subscribe to {@link IMonomerLib.onChanged} event */
 // let monomerLib: MonomerLib | null = null;
 
 //name: getMonomerLibHelper
@@ -103,7 +106,9 @@ export async function initBio() {
       const bioPkgProps = new BioPackageProperties(pkgProps);
       _package.properties = bioPkgProps;
     })(),
-  ]);
+  ]).finally(() => {
+    _package.completeInit();
+  });
 
   const monomerLib = MonomerLibHelper.instance.getBioLib();
   const monomers: string[] = [];
@@ -149,14 +154,96 @@ export function getBioLib(): IMonomerLib {
   return MonomerLibHelper.instance.getBioLib();
 }
 
+// -- Panels --
+
+//name: Get Region
+//description: Creates a new column with sequences of the region between start and end
+//tags: panel
+//input: column seqCol {semType: Macromolecule}
+//output: widget result
+export function getRegionPanel(seqCol: DG.Column<string>): DG.Widget {
+  // const host = ui.divV([
+  //   ui.inputs([
+  //     ui.stringInput('Region', ''),
+  //   ]),
+  //   ui.button('Ok', () => {})
+  // ]);
+  // return DG.Widget.fromRoot(host);
+  const funcName: string = 'getRegionTopMenu';
+  const funcList = DG.Func.find({package: _package.name, name: funcName});
+  if (funcList.length !== 1) throw new Error(`Package '${_package.name}' func '${funcName}' not found`);
+  const func = funcList[0];
+  const funcCall = func.prepare({table: seqCol.dataFrame, sequence: seqCol});
+  const funcEditor = new GetRegionFuncEditor(funcCall);
+  return funcEditor.widget();
+}
+
 //name: Manage Libraries
-//input: column seqColumn {semType: Macromolecule}
+//description:
 //tags: panel, exclude-actions-panel
+//input: column seqColumn {semType: Macromolecule}
 //output: widget result
 export async function libraryPanel(_seqColumn: DG.Column): Promise<DG.Widget> {
   return getLibraryPanelUI();
 }
 
+// -- Func Editors --
+
+//name: GetRegionEditor
+//tags: editor
+//input: funccall call
+export function GetRegionEditor(call: DG.FuncCall): void {
+  try {
+    const funcEditor = new GetRegionFuncEditor(call);
+    funcEditor.dialog();
+  } catch (err: any) {
+    const errMsg = err instanceof Error ? err.message : err.toString();
+    const errStack = err instanceof Error ? err.stack : undefined;
+    grok.shell.error(`Get region editor error: ${errMsg}`);
+    _package.logger.error(errMsg, undefined, errStack);
+  }
+}
+
+//name: SplitToMonomersEditor
+//tags: editor
+//input: funccall call
+export function SplitToMonomersEditor(call: DG.FuncCall): void {
+  const funcEditor = new SplitToMonomersFunctionEditor();
+  ui.dialog({title: 'Split to Monomers'})
+    .add(funcEditor.paramsUI)
+    .onOK(async () => {
+      return call.func.prepare(funcEditor.funcParams).call(true);
+    })
+    .show();
+}
+
+//name: SequenceSpaceEditor
+//tags: editor
+//input: funccall call
+export function SequenceSpaceEditor(call: DG.FuncCall) {
+  const funcEditor = new SequenceSpaceFunctionEditor(DG.SEMTYPE.MACROMOLECULE);
+  ui.dialog({title: 'Sequence Space'})
+    .add(funcEditor.paramsUI)
+    .onOK(async () => {
+      return call.func.prepare(funcEditor.funcParams).call(true);
+    })
+    .show();
+}
+
+//name: SeqActivityCliffsEditor
+//tags: editor
+//input: funccall call
+export function SeqActivityCliffsEditor(call: DG.FuncCall) {
+  const funcEditor = new ActivityCliffsFunctionEditor(DG.SEMTYPE.MACROMOLECULE);
+  ui.dialog({title: 'Activity Cliffs'})
+    .add(funcEditor.paramsUI)
+    .onOK(async () => {
+      return call.func.prepare(funcEditor.funcParams).call(true);
+    })
+    .show();
+}
+
+
 // -- Package settings editor --
 
 //name: packageSettingsEditor
@@ -181,6 +268,8 @@ export function fastaSequenceCellRenderer(): MacromoleculeSequenceCellRenderer {
   return new MacromoleculeSequenceCellRenderer();
 }
 
+// -- Property panels --
+
 //name: Sequence Renderer
 //input: column molColumn {semType: Macromolecule}
 //tags: panel
@@ -250,17 +339,39 @@ export function vdRegionsViewer() {
   return new VdRegionsViewer();
 }
 
-//name: SeqActivityCliffsEditor
-//tags: editor
-//input: funccall call
-export function SeqActivityCliffsEditor(call: DG.FuncCall) {
-  const funcEditor = new ActivityCliffsFunctionEditor(DG.SEMTYPE.MACROMOLECULE);
-  ui.dialog({title: 'Activity Cliffs'})
-    .add(funcEditor.paramsUI)
-    .onOK(async () => {
-      return call.func.prepare(funcEditor.funcParams).call(true);
-    })
-    .show();
+
+// -- Top menu --
+
+//name: getRegion
+//description: Gets a new column with sequences of the region between start and end
+//input: column sequence
+//input: string start  {optional: true}
+//input: string end    {optional: true}
+//input: string name   {optional: true} [Name of the column to be created]
+//output: column result
+export function getRegion(
+  sequence: DG.Column<string>, start: string | undefined, end: string | undefined, name: string | undefined
+): DG.Column<string> {
+  return getRegionDo(sequence,
+    start ?? null, end ?? null, name ?? null);
+}
+
+//top-menu: Bio | Convert | Get Region...
+//name: Get Region
+//description: Get sequences for a region specified from a Macromolecule
+//input: dataframe table                           [Input data table]
+//input: column sequence  {semType: Macromolecule} [Sequence column]
+//input: string start     {optional: true}         [Region start position name]
+//input: string end       {optional: true}         [Region end position name]
+//input: string name      {optional: true}         [Region column name]
+//editor: Bio:GetRegionEditor
+export function getRegionTopMenu(
+  table: DG.DataFrame, sequence: DG.Column,
+  start: string | undefined, end: string | undefined, name: string | undefined
+): void {
+  const regCol = getRegionDo(sequence, start ?? null, end ?? null, name ?? null);
+  sequence.dataFrame.columns.add(regCol);
+  regCol.setTag(DG.TAGS.CELL_RENDERER, 'sequence');
 }
 
 //top-menu: Bio | Analyze | Activity Cliffs...
@@ -286,14 +397,14 @@ export async function activityCliffs(df: DG.DataFrame, macroMolecule: DG.Column,
     'separator': macroMolecule.getTag(bioTAGS.separator),
     'alphabet': macroMolecule.getTag(bioTAGS.alphabet),
   };
-  const nc = new NotationConverter(macroMolecule);
+  const ncUH = UnitsHandler.getOrCreate(macroMolecule);
   let columnDistanceMetric: BitArrayMetrics | MmDistanceFunctionsNames = BitArrayMetricsNames.Tanimoto;
   let seqCol = macroMolecule;
-  if (nc.isFasta() || (nc.isSeparator() && nc.alphabet && nc.alphabet !== ALPHABET.UN)) {
-    if (nc.isFasta()) {
-      columnDistanceMetric = nc.getDistanceFunctionName();
+  if (ncUH.isFasta() || (ncUH.isSeparator() && ncUH.alphabet && ncUH.alphabet !== ALPHABET.UN)) {
+    if (ncUH.isFasta()) {
+      columnDistanceMetric = ncUH.getDistanceFunctionName();
     } else {
-      seqCol = nc.convert(NOTATION.FASTA);
+      seqCol = ncUH.convert(NOTATION.FASTA);
       const uh = UnitsHandler.getOrCreate(seqCol);
       columnDistanceMetric = uh.getDistanceFunctionName();
       tags.units = NOTATION.FASTA;
@@ -344,19 +455,6 @@ export async function activityCliffs(df: DG.DataFrame, macroMolecule: DG.Column,
   }
 }
 
-//name: SequenceSpaceEditor
-//tags: editor
-//input: funccall call
-export function SequenceSpaceEditor(call: DG.FuncCall) {
-  const funcEditor = new SequenceSpaceFunctionEditor(DG.SEMTYPE.MACROMOLECULE);
-  ui.dialog({title: 'Sequence Space'})
-    .add(funcEditor.paramsUI)
-    .onOK(async () => {
-      return call.func.prepare(funcEditor.funcParams).call(true);
-    })
-    .show();
-}
-
 //top-menu: Bio | Analyze | Sequence Space...
 //name: Sequence Space
 //description: Creates 2D sequence space with projected sequences by pairwise distance
@@ -602,7 +700,7 @@ export function importBam(fileContent: string): DG.DataFrame [] {
 //top-menu: Bio | Convert | Notation...
 //name: convertDialog
 export function convertDialog() {
-  const col = getMacromoleculeColumn();
+  const col = getMacromoleculeColumns()[0];
   convert(col);
 }
 
@@ -666,19 +764,6 @@ export async function testDetectMacromolecule(path: string): Promise<DG.DataFram
   return resDf;
 }
 
-//name: SplitToMonomersEditor
-//tags: editor
-//input: funccall call
-export function SplitToMonomersEditor(call: DG.FuncCall): void {
-  const funcEditor = new SplitToMonomersFunctionEditor();
-  ui.dialog({title: 'Split to Monomers'})
-    .add(funcEditor.paramsUI)
-    .onOK(async () => {
-      return call.func.prepare(funcEditor.funcParams).call(true);
-    })
-    .show();
-}
-
 //top-menu: Bio | Convert | Split to Monomers...
 //name: Split to Monomers
 //input: dataframe table
@@ -734,12 +819,56 @@ export function diversitySearchTopMenu() {
   view.dockManager.dock(viewer, 'down');
 }
 
-//top-menu: Bio | Search | Substructure...
-//name: bioSubstructureSearch
-//description: Finds sequence with the given subsequence
-export function bioSubstructureSearch(): void {
-  const col = getMacromoleculeColumn();
-  substructureSearchDialog(col);
+//name: SearchSubsequenceEditor
+//tags: editor
+//input: funccall call
+export function searchSubsequenceEditor(call: DG.FuncCall) {
+  const columns = getMacromoleculeColumns();
+  if (columns.length === 1)
+    call.func.prepare({macromolecules: columns[0]}).call(true);
+  else
+    new SubstructureSearchDialog(columns);
+}
+
+//top-menu: Bio | Search | Subsequence...
+//name: Subsequence Search
+//input: column macromolecules
+//editor: Bio:SearchSubsequenceEditor
+export function SubsequenceSearchTopMenu(macromolecules: DG.Column): void {
+  grok.shell.tv.getFiltersGroup({createDefaultFilters: false}).updateOrAdd({
+    type: 'Bio:bioSubstructureFilter',
+    column: macromolecules.name,
+    columnName: macromolecules.name,
+  });
+  grok.shell.tv.grid.scrollToCell(macromolecules, 0);
+}
+
+//top-menu: Bio | Calculate | Identity...
+//name: Identity Scoring
+//description: Adds a column with fraction of matching monomers
+//input: dataframe table [Table containing Macromolecule column]
+//input: column macromolecules {semType: Macromolecule} [Sequences to score]
+//input: string reference [Sequence, matching column format]
+//output: column scores
+export async function sequenceIdentityScoring(
+  table: DG.DataFrame, macromolecule: DG.Column, reference: string
+): Promise<DG.Column<number>> {
+  const scores = calculateScores(table, macromolecule, reference, SCORE.IDENTITY);
+  return scores;
+}
+
+//top-menu: Bio | Calculate | Similarity...
+//name: Similarity Scoring
+//description: Adds a column with similarity scores, calculated as sum of monomer fingerprint similarities
+//input: dataframe table [Table containing Macromolecule column]
+//input: column macromolecules {semType: Macromolecule} [Sequences to score]
+//input: string reference [Sequence, matching column format]
+//output: column scores
+export async function sequenceSimilarityScoring(
+  table: DG.DataFrame, macromolecule: DG.Column, reference: string
+): Promise<DG.Column<number>> {
+  const scores = calculateScores(table, macromolecule, reference, SCORE.SIMILARITY);
+  return scores;
 }
 
 //name: saveAsFasta
@@ -765,10 +894,22 @@ export async function webLogoLargeApp(): Promise<void> {
   const pi = DG.TaskBarProgressIndicator.create('WebLogo');
   try {
     const urlParams = new URLSearchParams(window.location.search);
-    const app = new WebLogoApp(urlParams);
+    const app = new WebLogoApp(urlParams, 'webLogoLargeApp');
     const df: DG.DataFrame = await _package.files.readCsv('data/sample_PT_100000x5.csv');
     await grok.data.detectSemanticTypes(df);
-    await app.init(df, 'webLogoLargeApp');
+    await app.init(df);
+  } finally {
+    pi.close();
+  }
+}
+
+//name: getRegionApp
+export async function getRegionApp(): Promise<void> {
+  const pi = DG.TaskBarProgressIndicator.create('getRegion ...');
+  try {
+    const urlParams = new URLSearchParams(window.location.search);
+    const app = new GetRegionApp(urlParams, 'getRegionApp');
+    await app.init();
   } finally {
     pi.close();
   }