diff --git a/.yarn/patches/typeorm-npm-0.3.17-f8c2578e7f.patch b/.yarn/patches/typeorm-npm-0.3.17-f8c2578e7f.patch
new file mode 100644
index 00000000..02663b99
--- /dev/null
+++ b/.yarn/patches/typeorm-npm-0.3.17-f8c2578e7f.patch
@@ -0,0 +1,167 @@
+diff --git a/browser/data-source/DataSource.js b/browser/data-source/DataSource.js
+index ac597a62857e6f05d1a7496ae9c49cdf6403c599..8a0530d03f0d51bca4c36bdb7e1a629683d4ab2f 100644
+--- a/browser/data-source/DataSource.js
++++ b/browser/data-source/DataSource.js
+@@ -13,6 +13,9 @@ import { ObjectUtils } from "../util/ObjectUtils";
+ import { RelationIdLoader } from "../query-builder/RelationIdLoader";
+ import { DriverUtils } from "../driver/DriverUtils";
+ import { InstanceChecker } from "../util/InstanceChecker";
++import { registerQueryBuilders } from "../query-builder";
++
++registerQueryBuilders()
+ /**
+  * DataSource is a pre-defined connection configuration to a specific database.
+  * You can have multiple data sources connected (with multiple connections in it),
+diff --git a/browser/query-builder/QueryBuilder.js b/browser/query-builder/QueryBuilder.js
+index 3fdc1a9b88b663c100562c073a2371b64c248b4a..f45f2db8c65f7aaf05ffb9e7c7e7d3da73a5e253 100644
+--- a/browser/query-builder/QueryBuilder.js
++++ b/browser/query-builder/QueryBuilder.js
+@@ -23,6 +23,7 @@ import { escapeRegExp } from "../util/escapeRegExp";
+  * Allows to build complex sql queries in a fashion way and execute those queries.
+  */
+ export class QueryBuilder {
++    static queryBuilderRegistry = {}
+     /**
+      * QueryBuilder can be initialized from given Connection and QueryRunner objects or from given other QueryBuilder.
+      */
+@@ -71,10 +72,9 @@ export class QueryBuilder {
+             ];
+         }
+         // loading it dynamically because of circular issue
+-        const SelectQueryBuilderCls = require("./SelectQueryBuilder").SelectQueryBuilder;
+         if (InstanceChecker.isSelectQueryBuilder(this))
+             return this;
+-        return new SelectQueryBuilderCls(this);
++        return QueryBuilder.queryBuilderRegistry["SelectQueryBuilder"](this);
+     }
+     /**
+      * Creates INSERT query.
+@@ -82,10 +82,9 @@ export class QueryBuilder {
+     insert() {
+         this.expressionMap.queryType = "insert";
+         // loading it dynamically because of circular issue
+-        const InsertQueryBuilderCls = require("./InsertQueryBuilder").InsertQueryBuilder;
+         if (InstanceChecker.isInsertQueryBuilder(this))
+             return this;
+-        return new InsertQueryBuilderCls(this);
++        return QueryBuilder.queryBuilderRegistry["InsertQueryBuilder"](this);
+     }
+     /**
+      * Creates UPDATE query and applies given update values.
+@@ -105,10 +104,9 @@ export class QueryBuilder {
+         this.expressionMap.queryType = "update";
+         this.expressionMap.valuesSet = updateSet;
+         // loading it dynamically because of circular issue
+-        const UpdateQueryBuilderCls = require("./UpdateQueryBuilder").UpdateQueryBuilder;
+         if (InstanceChecker.isUpdateQueryBuilder(this))
+             return this;
+-        return new UpdateQueryBuilderCls(this);
++        return QueryBuilder.queryBuilderRegistry["UpdateQueryBuilder"](this);
+     }
+     /**
+      * Creates DELETE query.
+@@ -116,26 +114,23 @@ export class QueryBuilder {
+     delete() {
+         this.expressionMap.queryType = "delete";
+         // loading it dynamically because of circular issue
+-        const DeleteQueryBuilderCls = require("./DeleteQueryBuilder").DeleteQueryBuilder;
+         if (InstanceChecker.isDeleteQueryBuilder(this))
+             return this;
+-        return new DeleteQueryBuilderCls(this);
++        return QueryBuilder.queryBuilderRegistry["DeleteQueryBuilder"](this);
+     }
+     softDelete() {
+         this.expressionMap.queryType = "soft-delete";
+         // loading it dynamically because of circular issue
+-        const SoftDeleteQueryBuilderCls = require("./SoftDeleteQueryBuilder").SoftDeleteQueryBuilder;
+         if (InstanceChecker.isSoftDeleteQueryBuilder(this))
+             return this;
+-        return new SoftDeleteQueryBuilderCls(this);
++        return QueryBuilder.queryBuilderRegistry["SoftDeleteQueryBuilder"](this);
+     }
+     restore() {
+         this.expressionMap.queryType = "restore";
+         // loading it dynamically because of circular issue
+-        const SoftDeleteQueryBuilderCls = require("./SoftDeleteQueryBuilder").SoftDeleteQueryBuilder;
+         if (InstanceChecker.isSoftDeleteQueryBuilder(this))
+             return this;
+-        return new SoftDeleteQueryBuilderCls(this);
++        return QueryBuilder.queryBuilderRegistry["SoftDeleteQueryBuilder"](this);
+     }
+     /**
+      * Sets entity's relation with which this query builder gonna work.
+@@ -152,10 +147,9 @@ export class QueryBuilder {
+             this.expressionMap.setMainAlias(mainAlias);
+         }
+         // loading it dynamically because of circular issue
+-        const RelationQueryBuilderCls = require("./RelationQueryBuilder").RelationQueryBuilder;
+         if (InstanceChecker.isRelationQueryBuilder(this))
+             return this;
+-        return new RelationQueryBuilderCls(this);
++        return QueryBuilder.queryBuilderRegistry["RelationQueryBuilder"](this);
+     }
+     /**
+      * Checks if given relation or relations exist in the entity.
+@@ -1120,6 +1114,9 @@ export class QueryBuilder {
+     hasCommonTableExpressions() {
+         return this.expressionMap.commonTableExpressions.length > 0;
+     }
++    static registerQueryBuilderClass(name, factory) {
++        QueryBuilder.queryBuilderRegistry[name] = factory
++    }
+ }
+ 
+ //# sourceMappingURL=QueryBuilder.js.map
+diff --git a/browser/query-builder/index.js b/browser/query-builder/index.js
+new file mode 100644
+index 0000000000000000000000000000000000000000..794b3a665ac2b64a8ec42e64bca6b27b34d5cd5f
+--- /dev/null
++++ b/browser/query-builder/index.js
+@@ -0,0 +1,34 @@
++import { DeleteQueryBuilder } from "./DeleteQueryBuilder"
++import { InsertQueryBuilder } from "./InsertQueryBuilder"
++import { QueryBuilder } from "./QueryBuilder"
++import { RelationQueryBuilder } from "./RelationQueryBuilder"
++import { SelectQueryBuilder } from "./SelectQueryBuilder"
++import { SoftDeleteQueryBuilder } from "./SoftDeleteQueryBuilder"
++import { UpdateQueryBuilder } from "./UpdateQueryBuilder"
++
++export function registerQueryBuilders() {
++    QueryBuilder.registerQueryBuilderClass(
++        "DeleteQueryBuilder",
++        (qb) => new DeleteQueryBuilder(qb),
++    )
++    QueryBuilder.registerQueryBuilderClass(
++        "InsertQueryBuilder",
++        (qb) => new InsertQueryBuilder(qb),
++    )
++    QueryBuilder.registerQueryBuilderClass(
++        "RelationQueryBuilder",
++        (qb) => new RelationQueryBuilder(qb),
++    )
++    QueryBuilder.registerQueryBuilderClass(
++        "SelectQueryBuilder",
++        (qb) => new SelectQueryBuilder(qb),
++    )
++    QueryBuilder.registerQueryBuilderClass(
++        "SoftDeleteQueryBuilder",
++        (qb) => new SoftDeleteQueryBuilder(qb),
++    )
++    QueryBuilder.registerQueryBuilderClass(
++        "UpdateQueryBuilder",
++        (qb) => new UpdateQueryBuilder(qb),
++    )
++}
+\ No newline at end of file
+diff --git a/data-source/DataSource.js b/data-source/DataSource.js
+index 1aedd237abde0c8f75d8852b5c49c43b82a216c2..5bb28b8f2d04eca0e39c0d4512eece22e4fcedd7 100644
+--- a/data-source/DataSource.js
++++ b/data-source/DataSource.js
+@@ -16,6 +16,7 @@ const ObjectUtils_1 = require("../util/ObjectUtils");
+ const RelationIdLoader_1 = require("../query-builder/RelationIdLoader");
+ const DriverUtils_1 = require("../driver/DriverUtils");
+ const InstanceChecker_1 = require("../util/InstanceChecker");
++
+ /**
+  * DataSource is a pre-defined connection configuration to a specific database.
+  * You can have multiple data sources connected (with multiple connections in it),
diff --git a/package.json b/package.json
index 2d88233d..799bd0b8 100644
--- a/package.json
+++ b/package.json
@@ -51,5 +51,8 @@
 		"vite-tsconfig-paths": "^4.2.0",
 		"vitest": "^0.34.2",
 		"wasm-pack": "^0.12.1"
+	},
+	"resolutions": {
+		"typeorm@^0.3.17": "patch:typeorm@npm%3A0.3.17#./.yarn/patches/typeorm-npm-0.3.17-f8c2578e7f.patch"
 	}
 }
diff --git a/packages/web-test/package.json b/packages/web-test/package.json
index 0e4ac552..002b58b6 100644
--- a/packages/web-test/package.json
+++ b/packages/web-test/package.json
@@ -6,6 +6,7 @@
 	"scripts": {
 		"build": "npx vite build",
 		"vite:serve": "npx vite --port 3000 --host",
+		"vite:preview": "npx vite preview",
 		"parcel:serve": "npx parcel serve index.html --port 3000",
 		"test": "npx playwright test"
 	},
diff --git a/yarn.lock b/yarn.lock
index de9aac2b..b995d643 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -6183,7 +6183,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"typeorm@npm:^0.3.17":
+"typeorm@npm:0.3.17":
   version: 0.3.17
   resolution: "typeorm@npm:0.3.17"
   dependencies:
@@ -6263,6 +6263,86 @@ __metadata:
   languageName: node
   linkType: hard
 
+"typeorm@patch:typeorm@npm%3A0.3.17#./.yarn/patches/typeorm-npm-0.3.17-f8c2578e7f.patch::locator=chopsticks-monorepo%40workspace%3A.":
+  version: 0.3.17
+  resolution: "typeorm@patch:typeorm@npm%3A0.3.17#./.yarn/patches/typeorm-npm-0.3.17-f8c2578e7f.patch::version=0.3.17&hash=9ea05a&locator=chopsticks-monorepo%40workspace%3A."
+  dependencies:
+    "@sqltools/formatter": ^1.2.5
+    app-root-path: ^3.1.0
+    buffer: ^6.0.3
+    chalk: ^4.1.2
+    cli-highlight: ^2.1.11
+    date-fns: ^2.29.3
+    debug: ^4.3.4
+    dotenv: ^16.0.3
+    glob: ^8.1.0
+    mkdirp: ^2.1.3
+    reflect-metadata: ^0.1.13
+    sha.js: ^2.4.11
+    tslib: ^2.5.0
+    uuid: ^9.0.0
+    yargs: ^17.6.2
+  peerDependencies:
+    "@google-cloud/spanner": ^5.18.0
+    "@sap/hana-client": ^2.12.25
+    better-sqlite3: ^7.1.2 || ^8.0.0
+    hdb-pool: ^0.1.6
+    ioredis: ^5.0.4
+    mongodb: ^5.2.0
+    mssql: ^9.1.1
+    mysql2: ^2.2.5 || ^3.0.1
+    oracledb: ^5.1.0
+    pg: ^8.5.1
+    pg-native: ^3.0.0
+    pg-query-stream: ^4.0.0
+    redis: ^3.1.1 || ^4.0.0
+    sql.js: ^1.4.0
+    sqlite3: ^5.0.3
+    ts-node: ^10.7.0
+    typeorm-aurora-data-api-driver: ^2.0.0
+  peerDependenciesMeta:
+    "@google-cloud/spanner":
+      optional: true
+    "@sap/hana-client":
+      optional: true
+    better-sqlite3:
+      optional: true
+    hdb-pool:
+      optional: true
+    ioredis:
+      optional: true
+    mongodb:
+      optional: true
+    mssql:
+      optional: true
+    mysql2:
+      optional: true
+    oracledb:
+      optional: true
+    pg:
+      optional: true
+    pg-native:
+      optional: true
+    pg-query-stream:
+      optional: true
+    redis:
+      optional: true
+    sql.js:
+      optional: true
+    sqlite3:
+      optional: true
+    ts-node:
+      optional: true
+    typeorm-aurora-data-api-driver:
+      optional: true
+  bin:
+    typeorm: cli.js
+    typeorm-ts-node-commonjs: cli-ts-node-commonjs.js
+    typeorm-ts-node-esm: cli-ts-node-esm.js
+  checksum: c22085840e466d1b203abbca1cde582fd250dcdb51cac0d20ff4dd27abf2f9eb8efa1ce6cc8a7a204764ccc495a3f65e368cff36726ec92fb273116b7c31437c
+  languageName: node
+  linkType: hard
+
 "typescript@npm:^5.1.6":
   version: 5.1.6
   resolution: "typescript@npm:5.1.6"