diff --git a/apps/desktop/src/components/grid/DataGrid.vue b/apps/desktop/src/components/grid/DataGrid.vue index 5b684c6da0..efd82ab752 100644 --- a/apps/desktop/src/components/grid/DataGrid.vue +++ b/apps/desktop/src/components/grid/DataGrid.vue @@ -521,6 +521,10 @@ const columnTypeMap = computed(() => { }); const resolvedConnectionConfig = computed(() => connectionStore.getConfig(props.connectionId ?? "")); const resolvedDatabaseType = computed(() => props.databaseType ?? effectiveDatabaseTypeForConnection(resolvedConnectionConfig.value)); +const isResultsContext = computed(() => props.context === "results"); +const canShowWhereSearch = computed(() => !!props.onExecuteSql && !isResultsContext.value && resolvedDatabaseType.value !== "victoriametrics"); +const canUseWhereSearch = computed(() => !!props.tableMeta && canShowWhereSearch.value); +const canUseServerColumnFilter = computed(() => canUseWhereSearch.value && !!props.connectionId && !!props.tableMeta); const tableStructureCapabilities = computed(() => getTableStructureCapabilities(resolvedDatabaseType.value, resolvedConnectionConfig.value?.db_type)); const columnCommentMap = computed(() => { @@ -2780,7 +2784,6 @@ const manualTotalRowCount = ref(undefined); const manualTotalRowCountLoading = ref(false); const showTruncationWarning = computed(() => props.result.truncated === true && typeof props.pageLimit !== "number" && props.result.has_more !== true); const truncationHintKey = computed(() => dataGridTruncationHintKey(resolvedDatabaseType.value)); -const isResultsContext = computed(() => props.context === "results"); // affected_rows reported by the backend can be larger than the rows we // actually have in memory — e.g. ES auto-pages SELECT * on a big index and // reports the index's true match count. Surface that in the status bar so @@ -2916,9 +2919,6 @@ watch( const showQueryEditReadOnlyBadge = computed(() => isResultsContext.value && hasData.value && !props.editable && !!props.queryEditabilityReason); const queryEditReadOnlyReason = computed(() => (props.queryEditabilityReason ? t(`grid.queryEditUnsupported.${props.queryEditabilityReason}`) : "")); const showKeylessEditWarning = computed(() => !!props.editable && !!props.tableMeta && canUseKeylessRowPredicate(props.databaseType, props.tableMeta.primaryKeys ?? [])); -const canShowWhereSearch = computed(() => !!props.onExecuteSql && !isResultsContext.value && resolvedDatabaseType.value !== "victoriametrics"); -const canUseWhereSearch = computed(() => !!props.tableMeta && canShowWhereSearch.value); -const canUseServerColumnFilter = computed(() => canUseWhereSearch.value && !!props.connectionId && !!props.tableMeta); type DataGridTableMeta = NonNullable; const hiveTableTransactional = ref(undefined); const resultSourceColumns = computed(() => props.result.columns.map((column, index) => props.sourceColumns?.[index] ?? column)); diff --git a/apps/desktop/src/components/grid/__tests__/DataGridInitializationOrder.spec.ts b/apps/desktop/src/components/grid/__tests__/DataGridInitializationOrder.spec.ts new file mode 100644 index 0000000000..cdb31cbb75 --- /dev/null +++ b/apps/desktop/src/components/grid/__tests__/DataGridInitializationOrder.spec.ts @@ -0,0 +1,16 @@ +import { readFileSync } from "node:fs"; +import { describe, expect, it } from "vitest"; + +const dataGridSource = readFileSync(new URL("../DataGrid.vue", import.meta.url), "utf8"); + +describe("DataGrid setup initialization order", () => { + it("initializes where-search capability before the immediate filter preview watcher", () => { + const canUseWhereSearchDeclaration = dataGridSource.indexOf("const canUseWhereSearch = computed"); + const filterPreviewDeclaration = dataGridSource.indexOf("const filterPreviewVisible = computed"); + const filterPreviewWatcher = dataGridSource.indexOf("[filterPreviewVisible, structuredFilterRules]"); + + expect(canUseWhereSearchDeclaration).toBeGreaterThanOrEqual(0); + expect(filterPreviewDeclaration).toBeGreaterThan(canUseWhereSearchDeclaration); + expect(filterPreviewWatcher).toBeGreaterThan(filterPreviewDeclaration); + }); +});