@elyx-code/editor-ui 0.0.2

package/src/components/dialogs/search-statement/search-statement-context.tsx

@@ -0,0 +1,1630 @@
+import React, {
+	createContext,
+	ReactNode,
+	useContext,
+	useEffect,
+	useMemo,
+	useState
+} from 'react';
+import {
+	EntityId,
+	EntityType,
+	ProjectState,
+	SearchState,
+	ChangeSet,
+	SQLAST as SQLASTLib,
+	searchStatementState as searchStatementStateLib,
+	SQLAST,
+	searchStatementUtils,
+	syncSearchEntityOutput,
+	searchStatementDefs,
+	StateMutationAction
+} from '@elyx-code/project-logic-tree';
+import { EditorService } from '../../../services/editor';
+import { IDialogProps } from '../../../lib/dialog/Dialog';
+import { useParams } from 'react-router-dom';
+import { Database } from '../../../services/local-relational-database';
+import { popupNotification } from '../../../popup-notification';
+import { Logger } from '@elyx-code/common-ts-utils';
+
+const { parse, cstVisitor } = SQLASTLib;
+const { SearchStatementLiteralValue } = searchStatementStateLib;
+
+const { SearchStatementNodeType, SearchLiteralValueType } = searchStatementDefs;
+
+type AggregationStatement = searchStatementStateLib.AggregationStatement;
+type AllColumnsSelector = searchStatementStateLib.AllColumnsSelector;
+type FunctionCall = searchStatementStateLib.FunctionCall;
+type ColumnRef = searchStatementStateLib.ColumnRef;
+type DataSource = searchStatementStateLib.DataSource;
+type SearchStatementLiteralValue =
+	searchStatementStateLib.SearchStatementLiteralValue;
+type ValueRef = searchStatementStateLib.ValueRef;
+type SearchStatementState = searchStatementStateLib.SearchStatementState;
+type SortStatement = searchStatementStateLib.SortStatement;
+type WhereStatement = searchStatementStateLib.WhereStatement;
+type SearchLiteralValueType = searchStatementDefs.SearchLiteralValueType;
+
+type SQLAST = SQLASTLib.Program;
+type SqlAstNode = SQLASTLib.Node;
+
+const testQuery = `-- Select specific columns from the Employee table
+SELECT 
+  e.identifier AS EmployeeID,
+  e.department,
+  e.startDate,
+  m.identifier AS ManagerID,
+  m.department AS ManagerDepartment,
+  m.startDate AS ManagerStartDate
+FROM 
+  Employee e
+LEFT JOIN 
+  Employee m ON e.manager = m.identifier
+WHERE 
+  -- Filter: Search for a specific employee by their UUID
+  e.identifier = 'your-employee-uuid'
+  -- Additional Filter: Employees that belong to a specific department
+  AND e.department = 'Sales'
+  -- Additional Filter: Employees who started after a certain date
+  AND e.startDate > '2022-01-01'
+ORDER BY 
+  -- Sorting: Sort employees by their start date, descending
+  e.startDate DESC, 
+  -- Sorting: Sort by department alphabetically after start date
+  e.department ASC
+LIMIT 
+  -- Limit the results to 10 employees
+  10
+OFFSET 
+  -- Skip the first 2 employees
+  2;
+`;
+
+const testQuery2 = `select * from Employee;`;
+
+const testQuery3 = `-- Select specific columns from the Employee table
+SELECT 
+  Employee.identifier AS EmployeeID,
+  Employee.department,
+  Employee.startDate,
+  m.identifier AS ManagerID,
+  m.department AS ManagerDepartment,
+  m.startDate AS ManagerStartDate
+FROM 
+  Employee
+LEFT JOIN 
+  Employee m ON Employee.manager = m.identifier
+WHERE 
+  -- Filter: Search for a specific employee by their UUID
+  Employee.identifier = 'your-employee-uuid'
+  -- Additional Filter: Employees that belong to a specific department
+  AND Employee.department = 'Sales'
+  -- Additional Filter: Employees who started after a certain date
+  AND Employee.startDate > '2022-01-01'
+ORDER BY 
+  -- Sorting: Sort employees by their start date, descending
+  Employee.startDate DESC, 
+  -- Sorting: Sort by department alphabetically after start date
+  Employee.department ASC
+LIMIT 
+  -- Limit the results to 10 employees
+  10
+OFFSET 
+  -- Skip the first 2 employees
+  2;
+`;
+
+const testQuery4 = `SELECT * 
+from Employee 
+ORDER BY startDate desc, department asc 
+limit 10 offset 2`;
+
+const testQuery5 = `SELECT 
+Employee.identifier AS EmployeeID 
+from Employee 
+ORDER BY startDate desc, department asc 
+limit 10 offset 2`;
+
+const testQuery6 = `SELECT 
+Employee.identifier AS EmployeeID, 
+User.identifier AS UserID 
+from Employee 
+INNER JOIN User ON 
+Employee.manager=User.identifier 
+ORDER BY Employee.startDate desc, Employee.department asc 
+limit 10 offset 2`;
+
+const testQuery7 = `SELECT 
+Employee.identifier AS EmployeeID, 
+User.identifier AS userID 
+from Employee 
+INNER JOIN User ON 
+Employee.manager=User.identifier 
+limit 10 offset 0`;
+
+const testQuery8 = `SELECT 
+Employee.identifier AS EmployeeID, 
+Employee.startDate AS startDate, 
+User.identifier AS userID, 
+Employee.department as department_a
+from Employee 
+INNER JOIN User ON 
+Employee.manager=User.identifier 
+ORDER BY Employee.startDate desc, Employee.department asc
+limit 10 offset 0`;
+
+const testQuery9 = `SELECT * 
+from Employee 
+ORDER BY startDate desc
+limit 10 offset 0`;
+
+const testQuery10 = `SELECT 
+Employee.identifier AS EmployeeID, 
+Employee.startDate AS startDate, 
+User.identifier AS userID 
+from 
+	(SELECT 
+     identifier AS EmployeeID, 
+     manager, 
+     startDate 
+   FROM 
+     Employee 
+   WHERE 
+     startDate > '2020-01-01' -- Example condition in subquery
+  ) AS e 
+INNER JOIN User ON 
+Employee.manager=User.identifier 
+ORDER BY Employee.startDate desc 
+limit 10 offset 0`;
+
+const testQuery11 = `SELECT 
+    Employee.identifier AS EmployeeID, 
+    Employee.startDate AS startDate, 
+    User.identifier AS userID, 
+		Employee.manager,
+    Employee.department AS department_a,
+    ProductSub.product_identifier AS ProductID,
+    RandomTable.random_value AS RandomValue
+FROM Employee 
+INNER JOIN User ON Employee.manager = User.identifier 
+LEFT JOIN (
+    SELECT identifier AS product_identifier, name 
+    FROM Product 
+    WHERE name LIKE 'a%'
+) AS ProductSub ON ProductSub.product_identifier = 'a'
+CROSS JOIN (SELECT 'useless_value' AS random_value) AS RandomTable
+CROSS JOIN (SELECT 'another_useless_value' AS another_useless_value) AS AnotherRandomTable
+ORDER BY Employee.startDate DESC, Employee.department ASC
+LIMIT 10 OFFSET 0`;
+
+const testQuery12 = `SELECT 
+    Employee.identifier AS EmployeeID, 
+    Employee.startDate AS startDate, 
+    User.identifier AS userID, 
+    Employee.department AS department_a,
+    ProductSub.product_identifier AS ProductID,
+    RandomTable.random_value AS RandomValue
+FROM Employee 
+LEFT JOIN (
+    SELECT identifier AS product_identifier, name 
+    FROM Product 
+    WHERE name LIKE 'a%'
+	-- ) AS ProductSub ON Employee.identifier = ProductSub.product_identifier
+) AS ProductSub ON ProductSub.product_identifier = 'a'
+ORDER BY Employee.startDate DESC, Employee.department ASC
+LIMIT 10 OFFSET 0`;
+
+const testQuery13 = `SELECT 
+    Employee.identifier AS EmployeeID, 
+    Employee.startDate AS startDate, 
+    User.identifier AS userID, 
+    Employee.department AS department_a
+FROM Employee 
+INNER JOIN User ON Employee.manager = User.identifier 
+ORDER BY Employee.startDate DESC, Employee.department ASC
+LIMIT 10 OFFSET 0`;
+
+const testQuery14 = `SELECT
+	identifier AS product_identifier,
+	name 
+FROM Product 
+WHERE name LIKE 'a';`;
+
+const testQuery15 = `SELECT 
+    Employee.identifier AS EmployeeID, 
+    Employee.startDate AS startDate, 
+    User.identifier AS userID, 
+		Employee.manager,
+    Employee.department AS department_a,
+    ProductSub.product_identifier AS ProductID,
+    RandomTable.random_value AS RandomValue
+FROM Employee 
+INNER JOIN User ON Employee.manager = User.identifier 
+LEFT JOIN (
+    SELECT identifier AS product_identifier, name 
+    FROM Product 
+    WHERE name LIKE 'a%'
+) AS ProductSub ON ProductSub.product_identifier = 'a'
+CROSS JOIN (SELECT 'useless_value' AS random_value) AS RandomTable
+CROSS JOIN (SELECT 'another_useless_value' AS another_useless_value) AS AnotherRandomTable 
+WHERE 
+	Employee.department = 'Sales' 
+	AND Employee.startDate >= '2020-01-01' 
+	AND Employee.manager IS NOT NULL 
+	
+	-- OR condition with grouping 
+	AND ( 
+			Employee.identifier IN (SELECT identifier FROM Employee WHERE department = 'Engineering') 
+			OR Employee.identifier IN (SELECT identifier FROM Employee WHERE department = 'Marketing') 
+	) 
+	
+	-- Nested conditions with OR and AND mixed 
+	AND ( 
+			(RandomTable.random_value = 'useless_value' AND AnotherRandomTable.another_useless_value = 'another_useless_value') 
+			OR 
+			(Employee.department = 'HR' AND Employee.startDate < '2015-01-01') 
+	) 
+	
+	-- Another OR group with nested conditions 
+	AND ( 
+			ProductSub.product_identifier IS NOT NULL 
+			OR (Employee.manager = User.identifier AND User.identifier IS NOT NULL) 
+	) 
+ORDER BY Employee.startDate DESC, Employee.department ASC 
+LIMIT 10 OFFSET 0;`;
+
+const testQuery16 = `SELECT 
+    Employee.identifier AS EmployeeID, 
+    Employee.startDate AS startDate, 
+    User.identifier AS userID, 
+		Employee.manager,
+    Employee.department AS department_a,
+    ProductSub.product_identifier AS ProductID,
+    RandomTable.random_value AS RandomValue
+FROM Employee 
+INNER JOIN User ON Employee.manager = User.identifier 
+LEFT JOIN (
+    SELECT identifier AS product_identifier, name 
+    FROM Product 
+    WHERE name LIKE 'a%'
+) AS ProductSub ON ProductSub.product_identifier = 'a'
+CROSS JOIN (SELECT 'useless_value' AS random_value) AS RandomTable
+CROSS JOIN (SELECT 'another_useless_value' AS another_useless_value) AS AnotherRandomTable 
+WHERE 
+  Employee.department = 'Sales' 
+	AND Employee.startDate >= '2020-01-01'
+ORDER BY Employee.startDate DESC, Employee.department ASC
+LIMIT 10 OFFSET 0;`;
+
+const testQuery17 = `SELECT 
+	Employee.identifier AS EmployeeID, 
+	Employee.startDate AS startDate, 
+	User.identifier AS userID, 
+	Employee.manager,
+	Employee.department AS department_a,
+	ProductSub.product_identifier AS ProductID,
+	RandomTable.random_value AS RandomValue
+FROM Employee 
+INNER JOIN User ON Employee.manager = User.identifier 
+LEFT JOIN (
+	SELECT identifier AS product_identifier, name 
+	FROM Product 
+	WHERE name LIKE 'a%'
+) AS ProductSub ON ProductSub.product_identifier = 'a'
+CROSS JOIN (SELECT 'useless_value' AS random_value) AS RandomTable
+CROSS JOIN (SELECT 'another_useless_value') AS AnotherRandomTable 
+WHERE 
+	Employee.department = 'Sales' 
+	AND Employee.startDate >= '2020-01-01' 
+	AND Employee.manager IS NOT NULL 
+	OR (Employee.manager = User.identifier AND User.identifier IS NOT NULL) 
+ORDER BY Employee.startDate DESC, Employee.department ASC 
+LIMIT 10 OFFSET 0;`;
+
+const testQuery18 = `select *, Employee.* from Employee;`;
+
+const testQuery19 = `select Something.*
+from Something
+    LEFT JOIN Prod ON 1 = 1
+where
+    Something.department = 'Sales';`;
+
+// =============================================================================
+// HEAVILY-NESTED FUNCTION FIXTURES — for layout stress-testing the search
+// builder. Set OVERRIDE_TEST_QUERY (below) to one of these to bypass the
+// entity's saved query and load a known-bad-layout case instead.
+// =============================================================================
+
+// Heavy scalar-function nesting in SELECT + WHERE.
+// Exercises: nested calls in selection columns, function-of-function in WHERE.
+const testQueryNestedScalars = `SELECT
+  UPPER(COALESCE(CONCAT(Employee.department, '-', LOWER(Employee.identifier)), 'NONE')) AS label,
+  CONCAT(UPPER(Employee.department), ' (', COALESCE(Employee.manager, 'no manager'), ')') AS departmentLine,
+  Employee.identifier AS EmployeeID
+FROM Employee
+WHERE LENGTH(COALESCE(Employee.manager, '')) > 0
+  AND UPPER(Employee.department) = UPPER('sales')
+ORDER BY UPPER(Employee.department) ASC
+LIMIT 10 OFFSET 0;`;
+
+// Heavy table-valued function nesting in FROM + JOINs.
+// Exercises: function as the main FROM source, multiple JOINs whose source
+// is itself a function, an existing JOIN function call referenced via alias.
+const testQueryNestedTableFunctions = `SELECT
+  Employee.identifier AS EmployeeID,
+  series.value AS seriesValue,
+  arr.value AS arrValue
+FROM Employee
+LEFT JOIN generate_series(1, 5, 1) AS series ON series.value > 0
+LEFT JOIN unnest('[1,2,3]') AS arr ON arr.value = series.value
+LEFT JOIN unnest(json_build_object('k', Employee.identifier)) AS payload ON 1 = 1
+WHERE Employee.department = 'Sales'
+ORDER BY Employee.identifier ASC
+LIMIT 10 OFFSET 0;`;
+
+// Mixes everything: nested scalars in SELECT, table-valued in FROM/JOIN,
+// nested AND/OR in WHERE, ordering on a function expression.
+const testQueryEverything = `SELECT
+  UPPER(COALESCE(Employee.department, 'UNKNOWN')) AS deptLabel,
+  CONCAT(Employee.identifier, '-', COALESCE(Employee.manager, 'root')) AS chain,
+  series.value AS seriesValue,
+  Product.name AS productName
+FROM Employee
+INNER JOIN User ON Employee.manager = User.identifier
+LEFT JOIN Product ON Product.name LIKE 'a%'
+LEFT JOIN generate_series(1, 3, 1) AS series ON series.value >= 1
+LEFT JOIN unnest('[1,2]') AS arr ON arr.value = series.value
+WHERE
+  UPPER(Employee.department) = 'SALES'
+  AND (
+    LENGTH(COALESCE(Employee.manager, '')) > 0
+    OR Employee.startDate >= '2020-01-01'
+  )
+  AND COALESCE(Product.name, '') != ''
+ORDER BY UPPER(Employee.department) ASC, Employee.startDate DESC
+LIMIT 25 OFFSET 0;`;
+
+// Minimal: a single JOIN whose source is a table-valued function. The smallest
+// fixture that exercises both the Merge-strategy alignment (function source =>
+// tall data-source side) and the duplicate-`unnest` dedup in the dropdown.
+const testQueryJoinFunction = `SELECT Employee.identifier AS EmployeeID
+FROM Employee
+LEFT JOIN unnest('[1,2,3]') AS arr ON 1 = 1;`;
+
+// Deep scalar-function nesting on literals only — avoids any schema-dependent
+// column refs that could fail hydration. The point is to render functions
+// inside functions inside functions across SELECT, WHERE, and ORDER BY so we
+// can see how the layout holds up at multiple nesting depths.
+const testQueryDeepNestedFunctions = `SELECT
+  UPPER(COALESCE(LOWER('HELLO'), 'fallback')) AS msg1,
+  CONCAT(UPPER('a'), '-', LOWER('B'), '-', COALESCE('c', 'd')) AS msg2,
+  LENGTH(CONCAT(UPPER(LOWER('mixed')), '_', COALESCE('x', 'y'))) AS len1
+FROM unnest('[1,2,3]') AS arr
+WHERE LENGTH(COALESCE(UPPER('value'), '')) > 0
+  AND UPPER(LOWER('a')) = LOWER(UPPER('A'))
+ORDER BY UPPER(LOWER('z')) ASC
+LIMIT 5 OFFSET 0;`;
+
+// Two unnest sources fed by JSON-array literal strings — exercises the array
+// literal hydration path and gives the layout engine two parallel function
+// data-sources to render side-by-side as JOINs.
+const testQueryArrays = `SELECT a.value AS a_val, b.value AS b_val
+FROM unnest('[1,2,3]') AS a
+LEFT JOIN unnest('[4,5,6]') AS b ON a.value = b.value
+WHERE a.value > 0
+ORDER BY a.value ASC
+LIMIT 10 OFFSET 0;`;
+
+// Nested arrays via nested unnest calls — the inner unnest emits a row
+// collection, then the outer unnest expands that. Layout-wise this is the
+// most aggressive table-valued nesting we test.
+const testQueryNestedArrays = `SELECT outer_arr.value AS v
+FROM unnest('[[1,2],[3,4],[5,6]]') AS outer_arr
+WHERE LENGTH(UPPER(COALESCE(LOWER('hello'), 'x'))) > 0
+ORDER BY outer_arr.value ASC
+LIMIT 5 OFFSET 0;`;
+
+// Subquery in FROM (nested SELECT) + WHERE filter inside it. Exercises the
+// nested-search-statement rendering and ensures the parent's calculateAst
+// tolerates a child query that's actually populated.
+const testQueryNestedSelect = `SELECT sub.identifier AS empId
+FROM (
+  SELECT Employee.id AS identifier
+  FROM Employee
+  WHERE Employee.id IS NOT NULL
+) AS sub
+ORDER BY sub.identifier ASC
+LIMIT 5 OFFSET 0;`;
+
+// "Everything bagel" — combines deep nested functions in SELECT and WHERE,
+// a nested SELECT in FROM, an array-literal in a JOIN's unnest source, and
+// ordering on a function expression. Useful for spotting layout regressions
+// that only show up under combined load.
+const testQueryEverythingBagel = `SELECT
+  UPPER(COALESCE(LOWER(sub.identifier), 'unknown')) AS upperId,
+  arr.value AS arrayValue
+FROM (
+  SELECT Employee.id AS identifier
+  FROM Employee
+  WHERE Employee.id IS NOT NULL
+) AS sub
+LEFT JOIN unnest('[1,2,3]') AS arr ON arr.value > 0
+WHERE LENGTH(UPPER(COALESCE(sub.identifier, ''))) > 0
+  AND UPPER(LOWER('x')) != LOWER(UPPER('Y'))
+ORDER BY UPPER(LOWER(sub.identifier)) ASC
+LIMIT 10 OFFSET 0;`;
+
+// External-input interpolation stress fixture. The dialog's saved Search
+// entity has 7 input maps with the exact UUIDs below; each `{{::id}}`
+// reference round-trips through hydrate → ValueRef → toQuery. Items below
+// exercise interpolation in every position where a value can appear: SELECT
+// projections (literal + function args), JOIN's array literal can't take an
+// interpolation but the JOIN's ON RHS can, WHERE LHS/RHS, function args
+// inside WHERE, ORDER BY (via a function expression), and LIMIT / OFFSET.
+//
+//   Email (String)            : efb7b373-bc11-4b5b-8035-720b82fdb9e6
+//   First number value (Number): 7a859d02-6c8a-490c-9dee-327300787808
+//   Second number value (Number): 4072c906-5937-4a0e-b4fb-51b4b1c74dc1
+//   Some boolean (Boolean)    : 223f61d4-dd05-4cf7-9f21-957c41a44425
+//   Some external ID (UUID)   : de00a2d7-7b63-4828-bce3-885aeea55dda
+//   External enum input (Enum): 9c3dd62b-2bcb-4341-bc3e-973db698a0f8
+//   Explicitly empty input (Null): ddf2890c-593a-4663-97ed-5d5efad86eb4
+const testQueryInterpolationEverywhere = `SELECT
+  Employee.id AS empId,
+  '{{::efb7b373-bc11-4b5b-8035-720b82fdb9e6}}' AS emailLiteralProjection,
+  CONCAT('prefix-', '{{::efb7b373-bc11-4b5b-8035-720b82fdb9e6}}', '-suffix') AS labelWithEmail,
+  UPPER(COALESCE('{{::efb7b373-bc11-4b5b-8035-720b82fdb9e6}}', 'fallback')) AS upperEmail,
+  LENGTH('{{::9c3dd62b-2bcb-4341-bc3e-973db698a0f8}}') AS enumLength
+FROM Employee
+LEFT JOIN unnest('[1,2,3]') AS arr ON arr.value > '{{::7a859d02-6c8a-490c-9dee-327300787808}}'
+WHERE Employee.id != '{{::de00a2d7-7b63-4828-bce3-885aeea55dda}}'
+  AND LENGTH('{{::efb7b373-bc11-4b5b-8035-720b82fdb9e6}}') > '{{::4072c906-5937-4a0e-b4fb-51b4b1c74dc1}}'
+  AND UPPER('{{::9c3dd62b-2bcb-4341-bc3e-973db698a0f8}}') != UPPER('placeholder')
+ORDER BY UPPER(COALESCE('{{::efb7b373-bc11-4b5b-8035-720b82fdb9e6}}', '')) ASC
+LIMIT '{{::7a859d02-6c8a-490c-9dee-327300787808}}'
+OFFSET '{{::4072c906-5937-4a0e-b4fb-51b4b1c74dc1}}';`;
+
+// Round-trip canary: a fixture that uses ONLY columns that exist on the real
+// schema (Employee.id, not the non-existent Employee.identifier) so that
+// hydrate → toQuery → re-hydrate preserves every field. Useful to spot
+// regressions where the stringified SQL produces a shape the parser+hydrator
+// can't reconstruct identically.
+const testQueryRoundTripCanary = `SELECT
+  Employee.id AS empId,
+  UPPER(COALESCE(Employee.id, '')) AS upperId,
+  CONCAT(Employee.id, '-tag') AS taggedId
+FROM Employee
+LEFT JOIN unnest('[1,2,3]') AS arr ON 1 = 1
+WHERE Employee.id IS NOT NULL
+  AND LENGTH(UPPER(Employee.id)) > 0
+ORDER BY UPPER(Employee.id) ASC
+LIMIT 10 OFFSET 0;`;
+
+// =============================================================================
+// Set this to one of the testQuery* constants above to bypass the saved
+// entity query and load that fixture instead. Useful for stress-testing the
+// dialog layout against intentionally-pathological queries. Leave at null to
+// use the actual saved query.
+// =============================================================================
+const OVERRIDE_TEST_QUERY: string | null = null; // testQueryInterpolationEverywhere;
+
+// Visits all nodes in the syntax tree and applies a callback to each node
+// If the callback returns a value, the value will replace the node
+// If the callback returns null, the node will be removed
+// If the callback returns undefined, the node will be left as is
+export function nodeVisitor(
+	node: SqlAstNode,
+	callbacks: {
+		beforeChildrenCallback?: (node: SqlAstNode) => SqlAstNode | null | void;
+		afterChildrenCallback?: (node: SqlAstNode) => SqlAstNode | null | void;
+	}
+): SqlAstNode | null | void {
+	if (!node) {
+		return;
+	}
+
+	const beforeCallbackResult = callbacks?.beforeChildrenCallback?.(node);
+
+	if (beforeCallbackResult === null) {
+		return null;
+	} else if (beforeCallbackResult) {
+		return beforeCallbackResult;
+	}
+
+	const keys: string[] = Object.keys(node);
+
+	keys.forEach((key) => {
+		// @ts-ignore
+		const value = node[key];
+
+		if (Array.isArray(value)) {
+			value.forEach((item, index) => {
+				if (item && typeof item === 'object') {
+					const newItem = nodeVisitor(item, callbacks);
+
+					if (newItem === null) {
+						value.splice(index, 1);
+					} else if (newItem) {
+						value[index] = newItem;
+					}
+				}
+			});
+		} else if (value && typeof value === 'object') {
+			const newValue = nodeVisitor(value, callbacks);
+
+			if (newValue === null) {
+				// @ts-ignore
+				delete node[key];
+			} else if (newValue) {
+				// @ts-ignore
+				node[key] = newValue;
+			}
+		}
+	});
+
+	return callbacks?.afterChildrenCallback?.(node);
+}
+
+// Recursively visits all nodes in the syntax tree and adds a uuid 'id' property to each node
+export function addIdsToASTNodes(sqlAstNode: SqlAstNode) {
+	nodeVisitor(sqlAstNode, {
+		beforeChildrenCallback: (node) => {
+			const id = ProjectState.UUID.uuid();
+
+			// @ts-ignore
+			node.id = id;
+		}
+	});
+}
+
+// addIdsToASTNodes(cst);
+
+// convert all keywords to uppercase
+export const toUpper = cstVisitor({
+	keyword: (kw) => {
+		kw.text = kw.text.toUpperCase();
+	}
+});
+
+export const toLower = cstVisitor({
+	keyword: (kw) => {
+		kw.text = kw.text.toLowerCase();
+	}
+});
+
+export function replaceNode(
+	parentNode: SqlAstNode,
+	nodeToReplace: SqlAstNode,
+	newNode: SqlAstNode
+) {
+	nodeVisitor(parentNode, {
+		beforeChildrenCallback: (node) => {
+			if (
+				!!node &&
+				!!nodeToReplace &&
+				(node === nodeToReplace ||
+					// @ts-ignore
+					node?.id === nodeToReplace?.id)
+			) {
+				return newNode;
+			}
+		}
+	});
+}
+
+export enum SearchStatementBuilderTabType {
+	MainSearchStatement = 'main-search-statement',
+	NewInputTab = 'new-input',
+	InputDeclarationTab = 'input-declaration-tab',
+	NestedQuery = 'nested-query'
+}
+
+export interface ISearchStatementTab {
+	entity: SearchStatementBuilderTabType;
+	// Any extra data that the tab might need
+	[key: string]: any;
+}
+
+export interface ITabManager {
+	addTab: (tab: ISearchStatementTab, navigate?: boolean) => void;
+	navigateToTab: (tab: ISearchStatementTab) => void;
+	navigateToTabIndex: (index: number) => void;
+	popTab: () => void;
+}
+
+export interface ISearchStatementBaseProps extends IDialogProps {
+	project: EditorService;
+}
+
+export interface ISearchStatementContext {
+	tabManager: ITabManager;
+	searchStatementState: SearchStatementState;
+	entity: SearchState;
+	dataSources: DataSource[];
+	selections: (ColumnRef | AllColumnsSelector | FunctionCall)[];
+	selectionsUpdateKey: number;
+	aggregations: AggregationStatement[];
+	aggregationsUpdateKey: number;
+	addAggregation: (value: AggregationStatement) => void;
+	removeAggregation: (value: AggregationStatement) => void;
+	editAggregation: (value: AggregationStatement) => void;
+	mainDataSource: DataSource | null;
+	setMainDataSource: (value: DataSource) => void;
+	setOffset: (value: SearchStatementLiteralValue | ValueRef) => void;
+	setLimit: (value: SearchStatementLiteralValue | ValueRef) => void;
+	setAsList: (value: boolean) => void;
+	sorting: SortStatement[];
+	sortingUpdateKey: number;
+	addSorting: (value: SortStatement) => void;
+	editSorting: (value: SortStatement) => void;
+	removeSorting: (value: SortStatement) => void;
+	addSelection: (
+		value: ColumnRef | AllColumnsSelector | FunctionCall
+	) => void;
+	editSelection: (
+		value: ColumnRef | AllColumnsSelector | FunctionCall
+	) => void;
+	removeSelection: (
+		value: ColumnRef | AllColumnsSelector | FunctionCall
+	) => void;
+	resolveDatabaseClient: () => Database | null;
+	setWhere: (value: WhereStatement | null) => void;
+	where: WhereStatement | null;
+	whereUpdateKey: number;
+	offset: SearchStatementLiteralValue | ValueRef | null;
+	offsetUpdateKey: number;
+	limit: SearchStatementLiteralValue | ValueRef | null;
+	limitUpdateKey: number;
+	dataSourcesUpdateKey: number;
+	asList: boolean;
+	project: EditorService;
+	sqlAST: SQLAST | null;
+	hydrationReady: boolean;
+	isNested: boolean;
+}
+
+export const SearchStatementContext = createContext<ISearchStatementContext>({
+	tabManager: {
+		addTab: () => {},
+		navigateToTab: () => {},
+		navigateToTabIndex: () => {},
+		popTab: () => {}
+	},
+	searchStatementState: null,
+	entity: null,
+	dataSources: [],
+	selections: [],
+	selectionsUpdateKey: 0,
+	aggregations: [],
+	aggregationsUpdateKey: 0,
+	addAggregation: () => {},
+	removeAggregation: () => {},
+	editAggregation: () => {},
+	mainDataSource: null,
+	setMainDataSource: () => {},
+	setOffset: () => {},
+	setLimit: () => {},
+	setAsList: () => {},
+	sorting: [],
+	sortingUpdateKey: 0,
+	addSorting: () => {},
+	editSorting: () => {},
+	removeSorting: () => {},
+	addSelection: () => {},
+	editSelection: () => {},
+	removeSelection: () => {},
+	resolveDatabaseClient: () => null,
+	setWhere: () => {},
+	where: null,
+	whereUpdateKey: 0,
+	offset: null,
+	offsetUpdateKey: 0,
+	limit: null,
+	limitUpdateKey: 0,
+	dataSourcesUpdateKey: 0,
+	asList: true,
+	project: null,
+	sqlAST: null,
+	hydrationReady: false,
+	isNested: false
+});
+
+export const useSearchStatementContext = () => {
+	const context = useContext(SearchStatementContext);
+
+	if (!context) {
+		throw new Error(
+			'useSearchStatementContext must be used within an SearchStatementProvider'
+		);
+	}
+
+	return context;
+};
+
+const SearchStatementProvider = ({
+	children,
+	project,
+	ready,
+	tabManager
+}: {
+	children: ReactNode;
+	project: EditorService;
+	ready: boolean;
+	tabManager: ITabManager;
+}) => {
+	const { entityId } = useParams<{
+		entityType: EntityType;
+		entityId: EntityId;
+	}>();
+
+	const entity: SearchState | null = project?.logic.get(
+		entityId
+	) as SearchState | null;
+
+	const [sqlAST, _setSqlAST] = useState<SQLAST | null>(null);
+
+	const searchStatementState: SearchStatementState | null = useMemo(() => {
+		if (!entity || !project) {
+			return null;
+		}
+
+		// If an override fixture is set, use it in place of the entity's saved
+		// query so the builder loads with a controlled, complex test case.
+		const sourceQuery = OVERRIDE_TEST_QUERY ?? entity.query;
+
+		if (OVERRIDE_TEST_QUERY) {
+			Logger.warn(
+				'[SearchStatementProvider] Using OVERRIDE_TEST_QUERY instead of the saved entity query. Set it back to null to load real data.'
+			);
+		}
+
+		const sanitizedQuery =
+			searchStatementUtils.sanitizeQuery(sourceQuery) || '';
+
+		const initialAst = sanitizedQuery
+			? parse(sanitizedQuery, {
+					dialect: 'sqlite'
+				})
+			: // Initializing the state with a default query
+				null;
+
+		const hydratedStateConfig =
+			searchStatementUtils.hydrateSearchStatementState(
+				initialAst,
+				project.logic,
+				entity
+			);
+
+		if (!!hydratedStateConfig.errors.length) {
+			popupNotification({
+				color: 'error',
+				text: `Error:\n${hydratedStateConfig.errors
+					.map(
+						(error) =>
+							`"${error.name}" ${
+								error.entity === 'table' ? 'entity' : 'property'
+							} not found`
+					)
+					.join('\n')}`,
+				delay: 4000
+			});
+		}
+
+		return hydratedStateConfig.state;
+	}, [project, entityId]);
+
+	const [dataSources, _setDataSources] = useState<DataSource[]>(
+		searchStatementState?.dataSources || []
+	);
+	const [dataSourcesUpdateKey, setDataSourcesUpdateKey] = useState(0);
+
+	const [where, _setWhere] = useState<WhereStatement | null>(
+		searchStatementState?.where || null
+	);
+	const [whereUpdateKey, setWhereUpdateKey] = useState(0);
+
+	const [selections, _setSelections] = useState<
+		(ColumnRef | AllColumnsSelector | FunctionCall)[]
+	>(searchStatementState?.selections || []);
+	const [selectionsUpdateKey, setSelectionsUpdateKey] = useState(0);
+
+	const [mainDataSource, _setMainDataSource] = useState<DataSource | null>(
+		searchStatementState?.from || null
+	);
+
+	const [aggregations, _setAggregations] = useState<AggregationStatement[]>(
+		searchStatementState?.aggregations || []
+	);
+	const [aggregationsUpdateKey, setAggregationsUpdateKey] = useState(0);
+
+	const [sorting, _setSorting] = useState<SortStatement[]>(
+		searchStatementState?.sorting || []
+	);
+	const [sortingUpdateKey, setSortingUpdateKey] = useState(0);
+
+	const [offset, _setOffset] = useState<
+		SearchStatementLiteralValue | ValueRef | null
+	>(searchStatementState?.offset || null);
+	const [offsetUpdateKey, setOffsetUpdateKey] = useState(0);
+
+	const [limit, _setLimit] = useState<
+		SearchStatementLiteralValue | ValueRef | null
+	>(searchStatementState?.limit || null);
+	const [limitUpdateKey, setLimitUpdateKey] = useState(0);
+
+	const [asList, _setAsList] = useState<boolean>(
+		searchStatementState?.asList || true
+	);
+
+	const [hydrationReady, setHydrationReady] = useState(false);
+
+	const setQueryAST = ({
+		ast,
+		query
+	}: {
+		ast: SQLAST | null;
+		query: string | null;
+	}) => {
+		// Don't persist broken intermediate states. `calculateAst` returns
+		// `ast: null` when the generated SQL string fails to re-parse — e.g.
+		// just after creating an empty nested-search that hasn't been
+		// configured yet. Writing that broken string into entity.query would
+		// poison it for the next hydration.
+		if (!ast) {
+			_setSqlAST(null);
+			return;
+		}
+
+		if (!!entity) {
+			const changeSet = project?.logic?.addChangeSet(
+				new ChangeSet(
+					project?.logic,
+					ProjectState.sessionAuthor,
+					new Date().toISOString(),
+					entity,
+					false,
+					StateMutationAction.ChangeSearchQuery
+				)
+			);
+
+			const sanitizedQuery =
+				searchStatementUtils.sanitizeQuery(query) || '';
+
+			entity?.metaSync({ query: sanitizedQuery }, changeSet);
+
+			if (
+				!!searchStatementState &&
+				searchStatementState.isValid &&
+				!!ast &&
+				!!sanitizedQuery
+			) {
+				syncSearchEntityOutput(entity, searchStatementState, changeSet);
+			}
+
+			project.renderAndCloseChangeSet(changeSet);
+		}
+
+		_setSqlAST(ast);
+	};
+
+	useEffect(() => {
+		if (!searchStatementState) {
+			return;
+		}
+
+		if (searchStatementState.dataSources) {
+			_setDataSources(searchStatementState.dataSources);
+		}
+
+		const newAst = searchStatementState.calculateAst();
+
+		if (newAst) {
+			Logger.log('query before sanitization: ', entity.query);
+			const sanitizedQuery =
+				searchStatementUtils.sanitizeQuery(entity.query) || '';
+			Logger.log('sanitizedQuery: ', sanitizedQuery);
+			if (
+				(!!newAst.query && !sanitizedQuery) ||
+				(!newAst.query && !!sanitizedQuery) ||
+				(!!newAst.query &&
+					!!sanitizedQuery &&
+					newAst.query !== sanitizedQuery)
+			) {
+				Logger.log('--- Setting query ---');
+				Logger.log('newAst.query: ', newAst.query);
+				Logger.log('entity query: ', sanitizedQuery);
+				setQueryAST(newAst);
+			}
+		}
+
+		if (!!searchStatementState.from) {
+			_setMainDataSource(searchStatementState.from);
+		}
+
+		_setWhere(searchStatementState.where);
+		_setOffset(searchStatementState.offset);
+		setOffsetUpdateKey((key) => key + 1);
+		_setLimit(searchStatementState.limit);
+		setLimitUpdateKey((key) => key + 1);
+		_setAsList(searchStatementState.asList);
+		_setAggregations(searchStatementState.aggregations);
+		_setSelections(searchStatementState.selections);
+		setSelectionsUpdateKey((key) => key + 1);
+		_setSorting(searchStatementState.sorting);
+
+		setHydrationReady(true);
+	}, [searchStatementState]);
+
+	const removeAggregation = (value: AggregationStatement) => {
+		searchStatementState.removeAggregation(value);
+		_setAggregations(searchStatementState.aggregations);
+		_setSelections(searchStatementState.selections);
+		_setSorting(searchStatementState.sorting);
+		_setWhere(searchStatementState.where);
+		setAggregationsUpdateKey((key) => key + 1);
+		setDataSourcesUpdateKey((key) => key + 1);
+		setSelectionsUpdateKey((key) => key + 1);
+		setSortingUpdateKey((key) => key + 1);
+		setWhereUpdateKey((key) => key + 1);
+
+		const newAst = searchStatementState.calculateAst();
+		setQueryAST(newAst);
+	};
+
+	const addAggregation = (value: AggregationStatement) => {
+		searchStatementState.addAggregation(value);
+		_setAggregations(searchStatementState.aggregations);
+		setAggregationsUpdateKey((key) => key + 1);
+		setDataSourcesUpdateKey((key) => key + 1);
+
+		const newAst = searchStatementState.calculateAst();
+		setQueryAST(newAst);
+	};
+
+	const editAggregation = (value: AggregationStatement) => {
+		searchStatementState.editAggregation(value);
+		_setAggregations(searchStatementState.aggregations);
+		setAggregationsUpdateKey((key) => key + 1);
+		setDataSourcesUpdateKey((key) => key + 1);
+
+		const newAst = searchStatementState.calculateAst();
+		setQueryAST(newAst);
+	};
+
+	const addSelection = (
+		value: ColumnRef | AllColumnsSelector | FunctionCall
+	) => {
+		searchStatementState.addSelection(value);
+		_setSelections(searchStatementState.selections);
+		setSelectionsUpdateKey((key) => key + 1);
+
+		const newAst = searchStatementState.calculateAst();
+		setQueryAST(newAst);
+	};
+
+	const editSelection = (
+		value: ColumnRef | AllColumnsSelector | FunctionCall
+	) => {
+		searchStatementState.editSelection(value);
+		_setSelections(searchStatementState.selections);
+		setSelectionsUpdateKey((key) => key + 1);
+
+		const newAst = searchStatementState.calculateAst();
+		setQueryAST(newAst);
+	};
+
+	const removeSelection = (
+		value: ColumnRef | AllColumnsSelector | FunctionCall
+	) => {
+		searchStatementState.removeSelection(value);
+		_setSelections(searchStatementState.selections);
+		_setSorting(searchStatementState.sorting);
+		setSelectionsUpdateKey((key) => key + 1);
+		setSortingUpdateKey((key) => key + 1);
+
+		const newAst = searchStatementState.calculateAst();
+		setQueryAST(newAst);
+	};
+
+	const addSorting = (value: SortStatement) => {
+		searchStatementState.addSort(value);
+		_setSorting(searchStatementState.sorting);
+
+		const newAst = searchStatementState.calculateAst();
+		setQueryAST(newAst);
+	};
+
+	const editSorting = (value: SortStatement) => {
+		searchStatementState.editSort(value);
+		_setSorting(searchStatementState.sorting);
+
+		const newAst = searchStatementState.calculateAst();
+		setQueryAST(newAst);
+	};
+
+	const removeSorting = (value: SortStatement) => {
+		searchStatementState.removeSort(value);
+		_setSorting(searchStatementState.sorting);
+		setSortingUpdateKey((key) => key + 1);
+
+		const newAst = searchStatementState.calculateAst();
+		setQueryAST(newAst);
+	};
+
+	const setMainDataSource = (value: DataSource | null) => {
+		searchStatementState.setFrom(value);
+		_setMainDataSource(value);
+		_setSelections(searchStatementState.selections);
+		_setSorting(searchStatementState.sorting);
+		_setAggregations(searchStatementState.aggregations);
+		setSelectionsUpdateKey((key) => key + 1);
+		setSortingUpdateKey((key) => key + 1);
+		setAggregationsUpdateKey((key) => key + 1);
+
+		const newAst = searchStatementState.calculateAst();
+		setQueryAST(newAst);
+	};
+
+	const setWhere = (value: WhereStatement | null) => {
+		searchStatementState.where = value;
+
+		_setWhere(value);
+		setWhereUpdateKey((key) => key + 1);
+
+		const newAst = searchStatementState.calculateAst();
+		setQueryAST(newAst);
+	};
+
+	const setOffset = (
+		value: SearchStatementLiteralValue | ValueRef | null
+	) => {
+		searchStatementState.offset = value;
+		_setOffset(value);
+		setOffsetUpdateKey((key) => key + 1);
+
+		const newAst = searchStatementState.calculateAst();
+		setQueryAST(newAst);
+	};
+
+	const setLimit = (value: SearchStatementLiteralValue | ValueRef | null) => {
+		searchStatementState.limit = value;
+		_setLimit(value);
+		setLimitUpdateKey((key) => key + 1);
+
+		if (
+			value?.type === SearchStatementNodeType.LiteralValue &&
+			value.valueType === SearchLiteralValueType.Number &&
+			(value.value as number) > 1
+		) {
+			searchStatementState.asList = true;
+
+			_setAsList(true);
+		}
+
+		const newAst = searchStatementState.calculateAst();
+		setQueryAST(newAst);
+	};
+
+	const setAsList = (value: boolean) => {
+		searchStatementState.asList = value;
+
+		_setAsList(value);
+
+		if (!value) {
+			const newLimitLiteral = new SearchStatementLiteralValue(
+				searchStatementState
+			);
+			newLimitLiteral.value = 1;
+			newLimitLiteral.valueType = SearchLiteralValueType.Number;
+
+			searchStatementState.limit = newLimitLiteral;
+			_setLimit(newLimitLiteral);
+			setLimitUpdateKey((key) => key + 1);
+		}
+
+		const newAst = searchStatementState.calculateAst();
+		setQueryAST(newAst);
+	};
+
+	const addDatasource = (dataSource: DataSource) => {
+		const storedDataSource = searchStatementState.addDataSource(dataSource);
+
+		if (dataSource !== storedDataSource) {
+			// Add the data source to the list of data sources available to use throughout the search statement builder
+			_setDataSources((dataSources) => [...dataSources, dataSource]);
+			setDataSourcesUpdateKey((key) => key + 1);
+		}
+	};
+
+	// Based on the main data source, we resolve the database client
+	const resolveDatabaseClient = (): Database | null => {
+		Logger.log('resolveDatabaseClient');
+		if (!!searchStatementState?.from) {
+			const mainDataSourceEntity =
+				searchStatementState?.mainPersistedEntity || null;
+
+			if (!mainDataSourceEntity) {
+				Logger.log('No main data source entity');
+				return null;
+			}
+
+			const database =
+				project?.localDatabaseStore?.getDatabaseForPersistedEntity(
+					mainDataSourceEntity
+				);
+
+			Logger.log('Database', database);
+
+			return database;
+		} else {
+			Logger.log('Selecting first database');
+			// There is no need for any table to be present, so we just need ANY client, to query against
+			return project?.localDatabaseStore?.databases[0] || null;
+		}
+	};
+
+	if (!searchStatementState || !entity || !project) {
+		return null;
+	}
+
+	return (
+		<SearchStatementContext.Provider
+			value={{
+				tabManager,
+				searchStatementState,
+				dataSources,
+				mainDataSource,
+				setMainDataSource,
+				aggregations,
+				aggregationsUpdateKey,
+				addAggregation,
+				removeAggregation,
+				editAggregation,
+				selections,
+				selectionsUpdateKey,
+				addSelection,
+				editSelection,
+				removeSelection,
+				sorting,
+				sortingUpdateKey,
+				addSorting,
+				editSorting,
+				removeSorting,
+				setOffset,
+				setLimit,
+				setAsList,
+				setWhere,
+				resolveDatabaseClient,
+				where,
+				whereUpdateKey,
+				offset,
+				asList,
+				limit,
+				project,
+				entity,
+				sqlAST,
+				offsetUpdateKey,
+				limitUpdateKey,
+				dataSourcesUpdateKey,
+				hydrationReady,
+				isNested: false
+			}}
+		>
+			{children}
+		</SearchStatementContext.Provider>
+	);
+};
+
+export const withSearchStatementProvider = <
+	T extends {
+		project: EditorService;
+		ready: boolean;
+		tabManager: ITabManager;
+	} = {
+		project: EditorService;
+		ready: boolean;
+		tabManager: ITabManager;
+	}
+>(
+	Component: React.ComponentType<T>
+) => {
+	return function WrappedComponent(props: T) {
+		return (
+			<SearchStatementProvider
+				project={props.project}
+				ready={props.ready}
+				tabManager={props.tabManager}
+			>
+				<Component {...props} />
+			</SearchStatementProvider>
+		);
+	};
+};
+
+const NestedSearchStatementProvider = ({
+	children,
+	project,
+	ready,
+	tabManager,
+	parent,
+	// recalculateParent,
+	query
+}: {
+	children: ReactNode;
+	project: EditorService;
+	ready: boolean;
+	tabManager: ITabManager;
+	parent: SearchStatementState;
+	// recalculateParent: () => void;
+	query: SearchStatementState;
+}) => {
+	const { entityId } = useParams<{
+		entityType: EntityType;
+		entityId: EntityId;
+	}>();
+
+	const entity: SearchState | null = project?.logic.get(
+		entityId
+	) as SearchState | null;
+
+	const [sqlAST, _setSqlAST] = useState<SQLAST | null>(null);
+
+	const searchStatementState: SearchStatementState | null = query;
+
+	const [dataSources, _setDataSources] = useState<DataSource[]>(
+		searchStatementState?.dataSources || []
+	);
+	const [dataSourcesUpdateKey, setDataSourcesUpdateKey] = useState(0);
+
+	const [where, _setWhere] = useState<WhereStatement | null>(
+		searchStatementState?.where || null
+	);
+	const [whereUpdateKey, setWhereUpdateKey] = useState(0);
+
+	const [selections, _setSelections] = useState<
+		(ColumnRef | AllColumnsSelector | FunctionCall)[]
+	>(searchStatementState?.selections || []);
+	const [selectionsUpdateKey, setSelectionsUpdateKey] = useState(0);
+
+	const [mainDataSource, _setMainDataSource] = useState<DataSource | null>(
+		searchStatementState?.from || null
+	);
+
+	const [aggregations, _setAggregations] = useState<AggregationStatement[]>(
+		searchStatementState?.aggregations || []
+	);
+	const [aggregationsUpdateKey, setAggregationsUpdateKey] = useState(0);
+
+	const [sorting, _setSorting] = useState<SortStatement[]>(
+		searchStatementState?.sorting || []
+	);
+	const [sortingUpdateKey, setSortingUpdateKey] = useState(0);
+
+	const [offset, _setOffset] = useState<
+		SearchStatementLiteralValue | ValueRef | null
+	>(searchStatementState?.offset || null);
+	const [offsetUpdateKey, setOffsetUpdateKey] = useState(0);
+
+	const [limit, _setLimit] = useState<
+		SearchStatementLiteralValue | ValueRef | null
+	>(searchStatementState?.limit || null);
+	const [limitUpdateKey, setLimitUpdateKey] = useState(0);
+
+	const [hydrationReady, setHydrationReady] = useState(false);
+
+	const setQueryAST = ({
+		ast,
+		query
+	}: {
+		ast: SQLAST | null;
+		query: string | null;
+	}) => {
+		// We don't set it in the entity becuase it's a nested search statement
+		// if (!!entity) {
+		// 	entity.query = query;
+		// }
+		// if (recalculateParent) {
+		// 	recalculateParent();
+		// }
+
+		_setSqlAST(ast);
+	};
+
+	useEffect(() => {
+		if (!searchStatementState) {
+			return;
+		}
+
+		if (searchStatementState.dataSources) {
+			_setDataSources(searchStatementState.dataSources);
+		}
+
+		const newAst = searchStatementState.calculateAst();
+
+		if (newAst) {
+			setQueryAST(newAst);
+		}
+
+		if (!!searchStatementState.from) {
+			_setMainDataSource(searchStatementState.from);
+		}
+
+		_setWhere(searchStatementState.where);
+		_setOffset(searchStatementState.offset);
+		setOffsetUpdateKey((key) => key + 1);
+		_setLimit(searchStatementState.limit);
+		setLimitUpdateKey((key) => key + 1);
+		_setAggregations(searchStatementState.aggregations);
+		_setSelections(searchStatementState.selections);
+		setSelectionsUpdateKey((key) => key + 1);
+		_setSorting(searchStatementState.sorting);
+
+		setHydrationReady(true);
+	}, [searchStatementState]);
+
+	const removeAggregation = (value: AggregationStatement) => {
+		searchStatementState.removeAggregation(value);
+		_setAggregations(searchStatementState.aggregations);
+		_setSelections(searchStatementState.selections);
+		_setSorting(searchStatementState.sorting);
+		_setWhere(searchStatementState.where);
+		setAggregationsUpdateKey((key) => key + 1);
+		setDataSourcesUpdateKey((key) => key + 1);
+		setSelectionsUpdateKey((key) => key + 1);
+		setSortingUpdateKey((key) => key + 1);
+		setWhereUpdateKey((key) => key + 1);
+
+		const newAst = searchStatementState.calculateAst();
+		setQueryAST(newAst);
+	};
+
+	const addAggregation = (value: AggregationStatement) => {
+		searchStatementState.addAggregation(value);
+		_setAggregations(searchStatementState.aggregations);
+		setAggregationsUpdateKey((key) => key + 1);
+		setDataSourcesUpdateKey((key) => key + 1);
+
+		const newAst = searchStatementState.calculateAst();
+		setQueryAST(newAst);
+	};
+
+	const editAggregation = (value: AggregationStatement) => {
+		searchStatementState.editAggregation(value);
+		_setAggregations(searchStatementState.aggregations);
+		setAggregationsUpdateKey((key) => key + 1);
+		setDataSourcesUpdateKey((key) => key + 1);
+
+		const newAst = searchStatementState.calculateAst();
+		setQueryAST(newAst);
+	};
+
+	const addSelection = (
+		value: ColumnRef | AllColumnsSelector | FunctionCall
+	) => {
+		searchStatementState.addSelection(value);
+		_setSelections(searchStatementState.selections);
+		setSelectionsUpdateKey((key) => key + 1);
+
+		const newAst = searchStatementState.calculateAst();
+		setQueryAST(newAst);
+	};
+
+	const editSelection = (
+		value: ColumnRef | AllColumnsSelector | FunctionCall
+	) => {
+		searchStatementState.editSelection(value);
+		_setSelections(searchStatementState.selections);
+		setSelectionsUpdateKey((key) => key + 1);
+
+		const newAst = searchStatementState.calculateAst();
+		setQueryAST(newAst);
+	};
+
+	const removeSelection = (
+		value: ColumnRef | AllColumnsSelector | FunctionCall
+	) => {
+		searchStatementState.removeSelection(value);
+		_setSelections(searchStatementState.selections);
+		_setSorting(searchStatementState.sorting);
+		setSelectionsUpdateKey((key) => key + 1);
+		setSortingUpdateKey((key) => key + 1);
+
+		const newAst = searchStatementState.calculateAst();
+		setQueryAST(newAst);
+	};
+
+	const addSorting = (value: SortStatement) => {
+		searchStatementState.addSort(value);
+		_setSorting(searchStatementState.sorting);
+		setSortingUpdateKey((key) => key + 1);
+
+		const newAst = searchStatementState.calculateAst();
+		setQueryAST(newAst);
+	};
+
+	const editSorting = (value: SortStatement) => {
+		searchStatementState.editSort(value);
+		_setSorting(searchStatementState.sorting);
+
+		const newAst = searchStatementState.calculateAst();
+		setQueryAST(newAst);
+	};
+
+	const removeSorting = (value: SortStatement) => {
+		searchStatementState.removeSort(value);
+		_setSorting(searchStatementState.sorting);
+		setSortingUpdateKey((key) => key + 1);
+
+		const newAst = searchStatementState.calculateAst();
+		setQueryAST(newAst);
+	};
+
+	const setMainDataSource = (value: DataSource | null) => {
+		searchStatementState.setFrom(value);
+		_setMainDataSource(value);
+		_setSelections(searchStatementState.selections);
+		_setSorting(searchStatementState.sorting);
+		_setAggregations(searchStatementState.aggregations);
+		setSelectionsUpdateKey((key) => key + 1);
+		setSortingUpdateKey((key) => key + 1);
+		setAggregationsUpdateKey((key) => key + 1);
+
+		const newAst = searchStatementState.calculateAst();
+		setQueryAST(newAst);
+	};
+
+	const setWhere = (value: WhereStatement | null) => {
+		searchStatementState.where = value;
+		_setWhere(value);
+		setWhereUpdateKey((key) => key + 1);
+
+		const newAst = searchStatementState.calculateAst();
+		setQueryAST(newAst);
+	};
+
+	const setOffset = (
+		value: SearchStatementLiteralValue | ValueRef | null
+	) => {
+		searchStatementState.offset = value;
+		_setOffset(value);
+		setOffsetUpdateKey((key) => key + 1);
+
+		const newAst = searchStatementState.calculateAst();
+		setQueryAST(newAst);
+	};
+
+	const setLimit = (value: SearchStatementLiteralValue | ValueRef | null) => {
+		searchStatementState.limit = value;
+		_setLimit(value);
+		setLimitUpdateKey((key) => key + 1);
+
+		if (
+			value?.type === SearchStatementNodeType.LiteralValue &&
+			value.valueType === SearchLiteralValueType.Number &&
+			(value.value as number) > 1
+		) {
+			searchStatementState.asList = true;
+		}
+
+		const newAst = searchStatementState.calculateAst();
+		setQueryAST(newAst);
+	};
+
+	const addDatasource = (dataSource: DataSource) => {
+		const storedDataSource = searchStatementState.addDataSource(dataSource);
+
+		if (dataSource !== storedDataSource) {
+			// Add the data source to the list of data sources available to use throughout the search statement builder
+			_setDataSources((dataSources) => [...dataSources, dataSource]);
+			setDataSourcesUpdateKey((key) => key + 1);
+		}
+	};
+
+	// Based on the main data source, we resolve the database client
+	const resolveDatabaseClient = (): Database | null => {
+		if (!!searchStatementState?.from) {
+			const mainDataSourceEntity =
+				searchStatementState?.mainPersistedEntity || null;
+
+			if (!mainDataSourceEntity) {
+				return null;
+			}
+
+			const database =
+				project?.localDatabaseStore?.getDatabaseForPersistedEntity(
+					mainDataSourceEntity
+				);
+
+			return database;
+		} else {
+			// There is no need for any table to be present, so we just need ANY client, to query against
+			return project?.localDatabaseStore?.databases[0] || null;
+		}
+	};
+
+	if (!searchStatementState || !entity || !project || !ready) {
+		return null;
+	}
+
+	return (
+		<SearchStatementContext.Provider
+			value={{
+				tabManager,
+				searchStatementState,
+				dataSources,
+				mainDataSource,
+				setMainDataSource,
+				aggregations,
+				aggregationsUpdateKey,
+				addAggregation,
+				removeAggregation,
+				editAggregation,
+				selections,
+				selectionsUpdateKey,
+				addSelection,
+				editSelection,
+				removeSelection,
+				sorting,
+				sortingUpdateKey,
+				addSorting,
+				editSorting,
+				removeSorting,
+				setOffset,
+				setLimit,
+				setAsList: () => {},
+				setWhere,
+				resolveDatabaseClient,
+				where,
+				whereUpdateKey,
+				offset,
+				asList: true,
+				limit,
+				project,
+				entity,
+				sqlAST,
+				offsetUpdateKey,
+				limitUpdateKey,
+				dataSourcesUpdateKey,
+				hydrationReady,
+				isNested: true
+			}}
+		>
+			{children}
+		</SearchStatementContext.Provider>
+	);
+};
+
+export const withNestedSearchStatementProvider = <
+	T extends {
+		project: EditorService;
+		ready: boolean;
+		parent: SearchStatementState;
+		query: SearchStatementState;
+		tabManager: ITabManager;
+		// recalculateParent: () => void;
+	} = {
+		project: EditorService;
+		ready: boolean;
+		parent: SearchStatementState;
+		query: SearchStatementState;
+		tabManager: ITabManager;
+		// recalculateParent: () => void;
+	}
+>(
+	Component: React.ComponentType<T>
+) => {
+	return function WrappedComponent(props: T) {
+		return (
+			<NestedSearchStatementProvider
+				project={props.project}
+				ready={props.ready}
+				tabManager={props.tabManager}
+				parent={props.parent}
+				query={props.query}
+				// recalculateParent={props.recalculateParent}
+			>
+				<Component {...props} />
+			</NestedSearchStatementProvider>
+		);
+	};
+};