diff --git a/cvat/apps/dextr_segmentation/static/dextr_segmentation/js/enginePlugin.js b/cvat/apps/dextr_segmentation/static/dextr_segmentation/js/enginePlugin.js
index 548f19f64aa..7384f33b9eb 100644
--- a/cvat/apps/dextr_segmentation/static/dextr_segmentation/js/enginePlugin.js
+++ b/cvat/apps/dextr_segmentation/static/dextr_segmentation/js/enginePlugin.js
@@ -54,7 +54,8 @@ window.addEventListener('DOMContentLoaded', () => {
             Object.defineProperty(instance, 'defaultType', {
                 get: () => instance._defaultType,
                 set: (type) => {
-                    if (!['box', 'points', 'polygon', 'polyline', 'auto_segmentation'].includes(type)) {
+                    if (!['box', 'box_by_4_points', 'points', 'polygon',
+                        'polyline', 'auto_segmentation'].includes(type)) {
                         throw Error(`Unknown shape type found ${type}`);
                     }
                     instance._defaultType = type;
diff --git a/cvat/apps/documentation/user_guide.md b/cvat/apps/documentation/user_guide.md
index 53bf3c6ea21..594e64c4161 100644
--- a/cvat/apps/documentation/user_guide.md
+++ b/cvat/apps/documentation/user_guide.md
@@ -936,11 +936,16 @@ By default, objects in the mode are zoomed. Check
 ``Open Menu`` —> ``Settings`` —> ``AAM Zoom Margin`` to adjust that.
 
 ## Annotation with box by 4 points
-It is an efficient method of bounding box annotation, proposed [here](https://arxiv.org/pdf/1708.02750.pdf). Before starting, you need to be sure that ``Box by 4 points`` is selected.
+It is an efficient method of bounding box annotation, proposed 
+[here](https://arxiv.org/pdf/1708.02750.pdf). 
+Before starting, you need to be sure that ``Box by 4 points`` is selected.
 
 ![](static/documentation/images/image134.jpg)
 
-Press ``N`` for entering drawing mode. Click exactly four extreme points: the top, bottom, left- and right-most physical points on the object. Drawing is automatically completed right after clicking the fourth point. Press ``Esc`` to cancel editing.
+Press ``N`` for entering drawing mode. Click exactly four extreme points: 
+the top, bottom, left- and right-most physical points on the object. 
+Drawing is automatically completed right after clicking the fourth point. 
+Press ``Esc`` to cancel editing.
 
 ![](static/documentation/images/gif016.gif)
 
diff --git a/cvat/apps/engine/static/engine/js/shapeCreator.js b/cvat/apps/engine/static/engine/js/shapeCreator.js
index 3a0e371131d..d9da2ba21b3 100644
--- a/cvat/apps/engine/static/engine/js/shapeCreator.js
+++ b/cvat/apps/engine/static/engine/js/shapeCreator.js
@@ -54,7 +54,8 @@ class ShapeCreatorModel extends Listener {
         }
 
         // FIXME: In the future we have to make some generic solution
-        if (this._defaultMode === 'interpolation' && ['box', 'points'].includes(this._defaultType)) {
+        if (this._defaultMode === 'interpolation' 
+            && ['box', 'points', 'box_by_4_points'].includes(this._defaultType)) {
             data.shapes = [];
             data.shapes.push(Object.assign({}, result, data));
             this._shapeCollection.add(data, `interpolation_${this._defaultType}`);
@@ -234,8 +235,8 @@ class ShapeCreatorView {
             // FIXME: In the future we have to make some generic solution
             const mode = this._modeSelector.prop('value');
             const type = $(e.target).prop('value');
-            if (type !== 'box' && !(type === 'points' && this._polyShapeSize === 1)
-                && mode !== 'annotation') {
+            if (type !== 'box' && type !== 'box_by_4_points' 
+                && !(type === 'points' && this._polyShapeSize === 1) && mode !== 'annotation') {
                 this._modeSelector.prop('value', 'annotation');
                 this._controller.setDefaultShapeMode('annotation');
                 showMessage('Only the annotation mode allowed for the shape');
@@ -252,7 +253,7 @@ class ShapeCreatorView {
             const mode = $(e.target).prop('value');
             const type = this._typeSelector.prop('value');
             if (mode !== 'annotation' && !(type === 'points' && this._polyShapeSize === 1)
-                && type !== 'box') {
+                && type !== 'box' && type !== 'box_by_4_points') {
                 this._typeSelector.prop('value', 'box');
                 this._controller.setDefaultShapeType('box');
                 showMessage('Only boxes and single point allowed in the interpolation mode');
@@ -492,7 +493,7 @@ class ShapeCreatorView {
                         ytl,
                         xbr,
                         ybr,
-                    }
+                    };
 
                     if (this._mode === 'interpolation') {
                         box.outside = false;
@@ -555,8 +556,8 @@ class ShapeCreatorView {
                             }
                             // finish drawing
                             this._controller.finish(box, this._type);
-                            this._controller.switchCreateMode(true);
                         }
+                        this._controller.switchCreateMode(true);
                     }
                 }).on('undopoint', () => {
                     if (numberOfPoints > 0) {