@jbrowse/plugin-linear-genome-view 1.7.7 → 1.7.10

package/dist/LinearGenomeView/components/ImportForm.js

@@ -70,35 +70,35 @@ var ImportForm = (0, _mobxReact.observer)(function (_ref) {
       textSearchManager = session.textSearchManager;
   var rankSearchResults = model.rankSearchResults,
       isSearchDialogDisplayed = model.isSearchDialogDisplayed,
-      modelError = model.error;
+      error = model.error;
 
   var _useState = (0, _react.useState)(assemblyNames[0]),
       _useState2 = (0, _slicedToArray2.default)(_useState, 2),
       selectedAsm = _useState2[0],
       setSelectedAsm = _useState2[1];
 
-  var _useState3 = (0, _react.useState)(modelError),
+  var _useState3 = (0, _react.useState)(error),
       _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
-      error = _useState4[0],
-      setError = _useState4[1];
+      importError = _useState4[0],
+      setImportError = _useState4[1];
 
   var searchScope = model.searchScope(selectedAsm);
   var assembly = assemblyManager.get(selectedAsm);
   var assemblyError = assemblyNames.length ? assembly === null || assembly === void 0 ? void 0 : assembly.error : 'No configured assemblies';
   var regions = (assembly === null || assembly === void 0 ? void 0 : assembly.regions) || [];
-  var err = assemblyError || error;
+  var err = assemblyError || importError;
 
-  var _useState5 = (0, _react.useState)(),
+  var _useState5 = (0, _react.useState)(''),
       _useState6 = (0, _slicedToArray2.default)(_useState5, 2),
-      myOption = _useState6[0],
-      setOption = _useState6[1]; // use this instead of useState initializer because the useState initializer
-  // won't update in response to an observable
+      myVal = _useState6[0],
+      setValue = _useState6[1];
 
+  var value = myVal || ((_regions$ = regions[0]) === null || _regions$ === void 0 ? void 0 : _regions$.refName); // use this instead of useState initializer because the useState initializer
+  // won't update in response to an observable
 
-  var option = myOption || new _BaseResults.default({
-    label: (_regions$ = regions[0]) === null || _regions$ === void 0 ? void 0 : _regions$.refName
+  var option = new _BaseResults.default({
+    label: value
   });
-  var selectedRegion = option === null || option === void 0 ? void 0 : option.getLocation();
 
   function fetchResults(_x, _x2) {
     return _fetchResults.apply(this, arguments);
@@ -155,7 +155,7 @@ var ImportForm = (0, _mobxReact.observer)(function (_ref) {
 
   function _handleSelectedRegion() {
     _handleSelectedRegion = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee2(input) {
-      var trackId, location, _assembly$allRefNames2, results;
+      var trackId, location, _location$split, _location$split2, ref, rest, allRefs, results;
 
       return _regenerator.default.wrap(function _callee2$(_context2) {
         while (1) {
@@ -171,61 +171,63 @@ var ImportForm = (0, _mobxReact.observer)(function (_ref) {
             case 2:
               trackId = option.getTrackId();
               location = input || option.getLocation() || '';
-              _context2.prev = 4;
+              _location$split = location.split(':'), _location$split2 = (0, _slicedToArray2.default)(_location$split, 2), ref = _location$split2[0], rest = _location$split2[1];
+              allRefs = (assembly === null || assembly === void 0 ? void 0 : assembly.allRefNames) || [];
+              _context2.prev = 6;
 
-              if (!(assembly !== null && assembly !== void 0 && (_assembly$allRefNames2 = assembly.allRefNames) !== null && _assembly$allRefNames2 !== void 0 && _assembly$allRefNames2.includes(location))) {
-                _context2.next = 9;
+              if (!(allRefs.includes(location) || allRefs.includes(ref) && rest !== undefined && !Number.isNaN(parseInt(rest, 10)))) {
+                _context2.next = 11;
                 break;
               }
 
               model.navToLocString(location, selectedAsm);
-              _context2.next = 20;
+              _context2.next = 22;
               break;
 
-            case 9:
-              _context2.next = 11;
+            case 11:
+              _context2.next = 13;
               return fetchResults(input, 'exact');
 
-            case 11:
+            case 13:
               results = _context2.sent;
 
-              if (!(results && results.length > 1)) {
-                _context2.next = 17;
+              if (!(results.length > 1)) {
+                _context2.next = 19;
                 break;
               }
 
               model.setSearchResults(results, input.toLowerCase());
               return _context2.abrupt("return");
 
-            case 17:
-              if ((results === null || results === void 0 ? void 0 : results.length) === 1) {
+            case 19:
+              if (results.length === 1) {
                 location = results[0].getLocation();
                 trackId = results[0].getTrackId();
               }
 
-            case 18:
+            case 20:
               model.navToLocString(location, selectedAsm);
 
               if (trackId) {
                 model.showTrack(trackId);
               }
 
-            case 20:
-              _context2.next = 26;
+            case 22:
+              _context2.next = 28;
               break;
 
-            case 22:
-              _context2.prev = 22;
-              _context2.t0 = _context2["catch"](4);
+            case 24:
+              _context2.prev = 24;
+              _context2.t0 = _context2["catch"](6);
               console.error(_context2.t0);
               session.notify("".concat(_context2.t0), 'warning');
 
-            case 26:
+            case 28:
             case "end":
               return _context2.stop();
           }
         }
-      }, _callee2, null, [[4, 22]]);
+      }, _callee2, null, [[6, 24]]);
     }));
     return _handleSelectedRegion.apply(this, arguments);
   }
@@ -241,7 +243,12 @@ var ImportForm = (0, _mobxReact.observer)(function (_ref) {
     className: classes.importFormContainer
   }, /*#__PURE__*/_react.default.createElement("form", {
     onSubmit: function onSubmit(event) {
-      return event.preventDefault();
+      event.preventDefault();
+      model.setError(undefined);
+
+      if (value) {
+        handleSelectedRegion(value);
+      }
     }
   }, /*#__PURE__*/_react.default.createElement(_core.Grid, {
     container: true,
@@ -252,7 +259,7 @@ var ImportForm = (0, _mobxReact.observer)(function (_ref) {
     item: true
   }, /*#__PURE__*/_react.default.createElement(_AssemblySelector.default, {
     onChange: function onChange(val) {
-      setError(undefined);
+      setImportError('');
       setSelectedAsm(val);
     },
     session: session,
@@ -268,15 +275,15 @@ var ImportForm = (0, _mobxReact.observer)(function (_ref) {
     style: {
       color: 'red'
     }
-  }) : selectedRegion ? /*#__PURE__*/_react.default.createElement(_RefNameAutocomplete.default, {
+  }) : value ? /*#__PURE__*/_react.default.createElement(_RefNameAutocomplete.default, {
     fetchResults: fetchResults,
     model: model,
     assemblyName: assemblyError ? undefined : selectedAsm,
-    value: selectedRegion // note: minWidth 270 accomodates full width of helperText
+    value: value // note: minWidth 270 accomodates full width of helperText
     ,
     minWidth: 270,
-    onSelect: function onSelect(option) {
-      return setOption(option);
+    onChange: function onChange(str) {
+      return setValue(str);
     },
     TextFieldProps: {
       variant: 'outlined',
@@ -298,19 +305,12 @@ var ImportForm = (0, _mobxReact.observer)(function (_ref) {
     item: true
   }, /*#__PURE__*/_react.default.createElement(_core.Button, {
     type: "submit",
-    disabled: !selectedRegion,
+    disabled: !value,
     className: classes.button,
-    onClick: function onClick() {
-      model.setError(undefined);
-
-      if (selectedRegion) {
-        handleSelectedRegion(selectedRegion);
-      }
-    },
     variant: "contained",
     color: "primary"
   }, "Open"), /*#__PURE__*/_react.default.createElement(_core.Button, {
-    disabled: !selectedRegion,
+    disabled: !value,
     className: classes.button,
     onClick: function onClick() {
       model.setError(undefined);

package/dist/LinearGenomeView/components/LinearGenomeView.js

@@ -109,7 +109,7 @@ var LinearGenomeView = (0, _mobxReact.observer)(function (_ref) {
   }, !tracks.length ? /*#__PURE__*/_react.default.createElement(_core.Paper, {
     variant: "outlined",
     className: classes.note
-  }, /*#__PURE__*/_react.default.createElement(_core.Typography, null, "No tracks active."), /*#__PURE__*/_react.default.createElement(_core.Button, {
+  }, !model.hideNoTracksActive ? /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_core.Typography, null, "No tracks active."), /*#__PURE__*/_react.default.createElement(_core.Button, {
     variant: "contained",
     color: "primary",
     onClick: model.activateTrackSelector,
@@ -117,7 +117,11 @@ var LinearGenomeView = (0, _mobxReact.observer)(function (_ref) {
       zIndex: 1000
     },
     startIcon: /*#__PURE__*/_react.default.createElement(_Icons.TrackSelector, null)
-  }, "Open track selector")) : tracks.map(function (track) {
+  }, "Open track selector")) : /*#__PURE__*/_react.default.createElement("div", {
+    style: {
+      height: '48px'
+    }
+  })) : tracks.map(function (track) {
     return /*#__PURE__*/_react.default.createElement(_TrackContainer.default, {
       key: track.id,
       model: model,

package/dist/LinearGenomeView/components/LinearGenomeView.test.js

@@ -129,7 +129,7 @@ describe('<LinearGenomeView />', function () {
 
           case 9:
             _context2.next = 11;
-            return findByText('100 bp');
+            return findByText('100bp');
 
           case 11:
             expect(container.firstChild).toMatchSnapshot();
@@ -215,7 +215,7 @@ describe('<LinearGenomeView />', function () {
 
           case 10:
             _context3.next = 12;
-            return findByText('798 bp');
+            return findByText('798bp');
 
           case 12:
             _context3.next = 14;

package/dist/LinearGenomeView/components/OverviewScaleBar.js

@@ -66,7 +66,6 @@ var useStyles = (0, _core.makeStyles)(function (theme) {
     },
     scaleBarLabel: {
       height: _.HEADER_OVERVIEW_HEIGHT,
-      width: 1,
       position: 'absolute',
       display: 'flex',
       justifyContent: 'center',
@@ -244,6 +243,7 @@ var OverviewBox = (0, _mobxReact.observer)(function (_ref5) {
       overview = _ref5.overview;
   var classes = useStyles();
   var cytobandOffset = model.cytobandOffset,
+      bpPerPx = model.bpPerPx,
       showCytobands = model.showCytobands;
   var start = block.start,
       end = block.end,
@@ -289,7 +289,7 @@ var OverviewBox = (0, _mobxReact.observer)(function (_ref5) {
         pointerEvents: 'none',
         color: refNameColor
       }
-    }, tickLabel.toLocaleString('en-US'));
+    }, (0, _util.getTickDisplayStr)(tickLabel, bpPerPx));
   }) : null, showCytobands ? /*#__PURE__*/_react.default.createElement("svg", {
     style: {
       width: '100%'

package/dist/LinearGenomeView/components/RefNameAutocomplete.d.ts

@@ -6,9 +6,10 @@ export interface Option {
     group?: string;
     result: BaseResult;
 }
-declare function RefNameAutocomplete({ model, showHelp, onSelect, assemblyName, style, fetchResults, value, minWidth, TextFieldProps, }: {
+declare function RefNameAutocomplete({ model, onSelect, assemblyName, style, fetchResults, onChange, value, showHelp, minWidth, TextFieldProps, }: {
     model: LinearGenomeViewModel;
-    onSelect: (region: BaseResult) => void;
+    onSelect?: (region: BaseResult) => void;
+    onChange?: (val: string) => void;
     assemblyName?: string;
     value?: string;
     fetchResults: (query: string) => Promise<BaseResult[]>;

package/dist/LinearGenomeView/components/RefNameAutocomplete.js

@@ -80,13 +80,14 @@ var MyPopper = function MyPopper(props) {
 
 function RefNameAutocomplete(_ref) {
   var model = _ref.model,
-      _ref$showHelp = _ref.showHelp,
-      showHelp = _ref$showHelp === void 0 ? true : _ref$showHelp,
       onSelect = _ref.onSelect,
       assemblyName = _ref.assemblyName,
       style = _ref.style,
       fetchResults = _ref.fetchResults,
+      onChange = _ref.onChange,
       value = _ref.value,
+      _ref$showHelp = _ref.showHelp,
+      showHelp = _ref$showHelp === void 0 ? true : _ref$showHelp,
       _ref$minWidth = _ref.minWidth,
       minWidth = _ref$minWidth === void 0 ? 200 : _ref$minWidth,
       _ref$TextFieldProps = _ref.TextFieldProps,
@@ -223,7 +224,8 @@ function RefNameAutocomplete(_ref) {
     loading: !loaded,
     inputValue: inputValue,
     onInputChange: function onInputChange(event, newInputValue) {
-      return setInputValue(newInputValue);
+      setInputValue(newInputValue);
+      onChange === null || onChange === void 0 ? void 0 : onChange(newInputValue);
     },
     loadingText: "loading results",
     open: open,
@@ -246,11 +248,11 @@ function RefNameAutocomplete(_ref) {
 
       if (typeof selectedOption === 'string') {
         // handles string inputs on keyPress enter
-        onSelect(new _BaseResults.default({
+        onSelect === null || onSelect === void 0 ? void 0 : onSelect(new _BaseResults.default({
           label: selectedOption
         }));
       } else {
-        onSelect(selectedOption.result);
+        onSelect === null || onSelect === void 0 ? void 0 : onSelect(selectedOption.result);
       }
 
       setInputValue(inputBoxVal);

package/dist/LinearGenomeView/components/ScaleBar.d.ts

@@ -21,6 +21,7 @@ declare const _default: React.ForwardRefExoticComponent<{
         tracks: import("mobx-state-tree").IArrayType<import("mobx-state-tree").IAnyType>;
         hideHeader: import("mobx-state-tree").IType<boolean | undefined, boolean, boolean>;
         hideHeaderOverview: import("mobx-state-tree").IType<boolean | undefined, boolean, boolean>;
+        hideNoTracksActive: import("mobx-state-tree").IType<boolean | undefined, boolean, boolean>;
         trackSelectorType: import("mobx-state-tree").IOptionalIType<import("mobx-state-tree").ISimpleType<"hierarchical">, [undefined]>;
         trackLabels: import("mobx-state-tree").IOptionalIType<import("mobx-state-tree").ISimpleType<string>, [undefined]>;
         showCenterLine: import("mobx-state-tree").IOptionalIType<import("mobx-state-tree").ISimpleType<boolean>, [undefined]>;
@@ -52,6 +53,7 @@ declare const _default: React.ForwardRefExoticComponent<{
     } & {
         readonly width: number;
         readonly interRegionPaddingWidth: number;
+        readonly assemblyNames: string[];
     } & {
         readonly assemblyErrors: string;
         readonly assembliesInitialized: boolean;
@@ -71,7 +73,6 @@ declare const _default: React.ForwardRefExoticComponent<{
         readonly minOffset: number;
         readonly displayedRegionsTotalPx: number;
         renderProps(): any;
-        readonly assemblyNames: string[];
         searchScope(assemblyName: string): {
             assemblyName: string;
             includeAggregateIndexes: boolean;
@@ -117,6 +118,7 @@ declare const _default: React.ForwardRefExoticComponent<{
         setError(error: Error | undefined): void;
         toggleHeader(): void;
         toggleHeaderOverview(): void;
+        toggleNoTracksActive(): void;
         scrollTo(offsetPx: number): number;
         zoomTo(bpPerPx: number): number;
         setOffsets(left: import("..").BpOffset | undefined, right: import("..").BpOffset | undefined): void;
@@ -130,7 +132,7 @@ declare const _default: React.ForwardRefExoticComponent<{
         moveTrack(movingTrackId: string, targetTrackId: string): void;
         closeView(): void;
         toggleTrack(trackId: string): void;
-        setTrackLabels(setting: "overlapping" | "offset" | "hidden"): void;
+        setTrackLabels(setting: "offset" | "hidden" | "overlapping"): void;
         toggleCenterLine(): void;
         setDisplayedRegions(regions: import("@jbrowse/core/util").Region[]): void;
         activateTrackSelector(): import("@jbrowse/core/util").Widget;
@@ -218,6 +220,7 @@ declare const _default: React.ForwardRefExoticComponent<{
         tracks: import("mobx-state-tree").IArrayType<import("mobx-state-tree").IAnyType>;
         hideHeader: import("mobx-state-tree").IType<boolean | undefined, boolean, boolean>;
         hideHeaderOverview: import("mobx-state-tree").IType<boolean | undefined, boolean, boolean>;
+        hideNoTracksActive: import("mobx-state-tree").IType<boolean | undefined, boolean, boolean>;
         trackSelectorType: import("mobx-state-tree").IOptionalIType<import("mobx-state-tree").ISimpleType<"hierarchical">, [undefined]>;
         trackLabels: import("mobx-state-tree").IOptionalIType<import("mobx-state-tree").ISimpleType<string>, [undefined]>;
         showCenterLine: import("mobx-state-tree").IOptionalIType<import("mobx-state-tree").ISimpleType<boolean>, [undefined]>;
@@ -249,6 +252,7 @@ declare const _default: React.ForwardRefExoticComponent<{
     } & {
         readonly width: number;
         readonly interRegionPaddingWidth: number;
+        readonly assemblyNames: string[];
     } & {
         readonly assemblyErrors: string;
         readonly assembliesInitialized: boolean;
@@ -268,7 +272,6 @@ declare const _default: React.ForwardRefExoticComponent<{
         readonly minOffset: number;
         readonly displayedRegionsTotalPx: number;
         renderProps(): any;
-        readonly assemblyNames: string[];
         searchScope(assemblyName: string): {
             assemblyName: string;
             includeAggregateIndexes: boolean;
@@ -314,6 +317,7 @@ declare const _default: React.ForwardRefExoticComponent<{
         setError(error: Error | undefined): void;
         toggleHeader(): void;
         toggleHeaderOverview(): void;
+        toggleNoTracksActive(): void;
         scrollTo(offsetPx: number): number;
         zoomTo(bpPerPx: number): number;
         setOffsets(left: import("..").BpOffset | undefined, right: import("..").BpOffset | undefined): void;
@@ -327,7 +331,7 @@ declare const _default: React.ForwardRefExoticComponent<{
         moveTrack(movingTrackId: string, targetTrackId: string): void;
         closeView(): void;
         toggleTrack(trackId: string): void;
-        setTrackLabels(setting: "overlapping" | "offset" | "hidden"): void;
+        setTrackLabels(setting: "offset" | "hidden" | "overlapping"): void;
         toggleCenterLine(): void;
         setDisplayedRegions(regions: import("@jbrowse/core/util").Region[]): void;
         activateTrackSelector(): import("@jbrowse/core/util").Widget;

package/dist/LinearGenomeView/components/ScaleBar.js

@@ -27,6 +27,8 @@ var _Block = require("../../BaseLinearDisplay/components/Block");
 
 var _util = require("../util");
 
+var _util2 = require("@jbrowse/core/util");
+
 var _excluded = ["model", "style", "className"];
 
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
@@ -100,16 +102,19 @@ var RenderedRefNameLabels = (0, _mobxReact.observer)(function (_ref) {
 var RenderedScaleBarLabels = (0, _mobxReact.observer)(function (_ref2) {
   var model = _ref2.model;
   var classes = useStyles();
+  var bpPerPx = model.bpPerPx;
   return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, model.staticBlocks.map(function (block, index) {
     if (block instanceof _blockTypes.ContentBlock) {
-      var ticks = (0, _util.makeTicks)(block.start, block.end, model.bpPerPx, true, false);
+      var start = block.start,
+          end = block.end;
+      var ticks = (0, _util.makeTicks)(start, end, bpPerPx, true, false);
       return /*#__PURE__*/_react.default.createElement(_Block.ContentBlock, {
         key: "".concat(block.key, "-").concat(index),
         block: block
       }, ticks.map(function (tick) {
         if (tick.type === 'major') {
           var x = (block.reversed ? block.end - tick.base : tick.base - block.start) / model.bpPerPx;
-          var baseNumber = (tick.base + 1).toLocaleString('en-US');
+          var baseNumber = tick.base + 1;
           return /*#__PURE__*/_react.default.createElement("div", {
             key: tick.base,
             className: classes.tick,
@@ -118,7 +123,7 @@ var RenderedScaleBarLabels = (0, _mobxReact.observer)(function (_ref2) {
             }
           }, baseNumber ? /*#__PURE__*/_react.default.createElement(_core.Typography, {
             className: classes.majorTickLabel
-          }, baseNumber) : null);
+          }, (0, _util2.getTickDisplayStr)(baseNumber, bpPerPx)) : null);
         }
 
         return null;

package/dist/LinearGenomeView/components/SearchBox.js

@@ -9,6 +9,8 @@ exports.default = void 0;
 
 var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
 
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+
 var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
 
 var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
@@ -54,7 +56,12 @@ function SearchBox(_ref) {
 
   function fetchResults(_x, _x2) {
     return _fetchResults.apply(this, arguments);
-  }
+  } // gets a string as input, or use stored option results from previous query,
+  // then re-query and
+  // 1) if it has multiple results: pop a dialog
+  // 2) if it's a single result navigate to it
+  // 3) else assume it's a locstring and navigate to it
+
 
   function _fetchResults() {
     _fetchResults = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee(query, searchType) {
@@ -104,7 +111,7 @@ function SearchBox(_ref) {
 
   function _handleSelectedRegion() {
     _handleSelectedRegion = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee2(option) {
-      var trackId, location, label, _assembly$allRefNames2, results;
+      var trackId, location, label, _location$split, _location$split2, ref, rest, allRefs, results;
 
       return _regenerator.default.wrap(function _callee2$(_context2) {
         while (1) {
@@ -113,61 +120,63 @@ function SearchBox(_ref) {
               trackId = option.getTrackId();
               location = option.getLocation();
               label = option.getLabel();
-              _context2.prev = 3;
+              _location$split = location.split(':'), _location$split2 = (0, _slicedToArray2.default)(_location$split, 2), ref = _location$split2[0], rest = _location$split2[1];
+              allRefs = (assembly === null || assembly === void 0 ? void 0 : assembly.allRefNames) || [];
+              _context2.prev = 5;
 
-              if (!(assembly !== null && assembly !== void 0 && (_assembly$allRefNames2 = assembly.allRefNames) !== null && _assembly$allRefNames2 !== void 0 && _assembly$allRefNames2.includes(location))) {
-                _context2.next = 8;
+              if (!(allRefs.includes(location) || allRefs.includes(ref) && rest !== undefined && !Number.isNaN(parseInt(rest, 10)))) {
+                _context2.next = 10;
                 break;
               }
 
-              model.navToLocString(location);
-              _context2.next = 19;
+              model.navToLocString(location, assemblyName);
+              _context2.next = 21;
               break;
 
-            case 8:
-              _context2.next = 10;
+            case 10:
+              _context2.next = 12;
               return fetchResults(label, 'exact');
 
-            case 10:
+            case 12:
               results = _context2.sent;
 
-              if (!(results && results.length > 1)) {
-                _context2.next = 16;
+              if (!(results.length > 1)) {
+                _context2.next = 18;
                 break;
               }
 
               model.setSearchResults(results, label.toLowerCase());
               return _context2.abrupt("return");
 
-            case 16:
-              if ((results === null || results === void 0 ? void 0 : results.length) === 1) {
+            case 18:
+              if (results.length === 1) {
                 location = results[0].getLocation();
                 trackId = results[0].getTrackId();
               }
 
-            case 17:
+            case 19:
               model.navToLocString(location, assemblyName);
 
               if (trackId) {
                 model.showTrack(trackId);
               }
 
-            case 19:
-              _context2.next = 25;
+            case 21:
+              _context2.next = 27;
               break;
 
-            case 21:
-              _context2.prev = 21;
-              _context2.t0 = _context2["catch"](3);
+            case 23:
+              _context2.prev = 23;
+              _context2.t0 = _context2["catch"](5);
               console.error(_context2.t0);
               session.notify("".concat(_context2.t0), 'warning');
 
-            case 25:
+            case 27:
             case "end":
               return _context2.stop();
           }
         }
-      }, _callee2, null, [[3, 21]]);
+      }, _callee2, null, [[5, 23]]);
     }));
     return _handleSelectedRegion.apply(this, arguments);
   }