Merge pull request #2731 from centerofci/fix_regressions

Reverts #2213 Column reorder from 0.1.1
mathesar-foundation · Mar 21, 2023 · ef06744 · ef06744
2 parents 422691b + 9aa81b1
commit ef06744
Show file tree

Hide file tree

Showing 18 changed files with 62 additions and 384 deletions.
diff --git a/mathesar_ui/src/api/types/tables.ts b/mathesar_ui/src/api/types/tables.ts
@@ -13,7 +13,6 @@ export interface TableSettings {
     customized: boolean;
     template: string;
   };
-  column_order: number[];
 }
 
 /**

diff --git a/mathesar_ui/src/components/sheet/SheetCellResizer.svelte b/mathesar_ui/src/components/sheet/SheetCellResizer.svelte
@@ -57,7 +57,6 @@
 <div
   class="column-resizer"
   class:is-resizing={isResizing}
-  on:dragstart
   on:mousedown={startColumnResize}
   on:touchstart|nonpassive={startColumnResize}
   on:dblclick={() => api.resetColumnWidth(columnIdentifierKey)}

diff --git a/mathesar_ui/src/components/sheet/SheetSelection.ts b/mathesar_ui/src/components/sheet/SheetSelection.ts
@@ -3,6 +3,7 @@ import { get, writable, type Unsubscriber, type Writable } from 'svelte/store';
 
 interface SelectionColumn {
   id: number | string;
+  columnIndex: number;
 }
 
 interface SelectionRow {
@@ -132,8 +133,8 @@ export function scrollBasedOnSelection(): void {
 type SelectionBounds = {
   startRowIndex: number;
   endRowIndex: number;
-  startColumnId: string | number;
-  endColumnId: string | number;
+  startColumnIndex: number;
+  endColumnIndex: number;
 };
 
 type Cell<Row extends SelectionRow, Column extends SelectionColumn> = [
@@ -194,8 +195,6 @@ export default class SheetSelection<
 > {
   private getColumns: () => Column[];
 
-  private getColumnOrder: () => number[];
-
   private getRows: () => Row[];
 
   // max index is inclusive
@@ -222,22 +221,17 @@ export default class SheetSelection<
 
   freezeSelection: boolean;
 
-  selectionInProgress: Writable<boolean>;
-
   constructor(args: {
     getColumns: () => Column[];
-    getColumnOrder: () => number[];
     getRows: () => Row[];
     getMaxSelectionRowIndex: () => number;
   }) {
     this.selectedCells = new WritableSet<string>();
     this.columnsSelectedWhenTheTableIsEmpty = new WritableSet<Column['id']>();
     this.getColumns = args.getColumns;
-    this.getColumnOrder = args.getColumnOrder;
     this.getRows = args.getRows;
     this.getMaxSelectionRowIndex = args.getMaxSelectionRowIndex;
     this.freezeSelection = false;
-    this.selectionInProgress = writable<boolean>(false);
     this.activeCell = writable<ActiveCell | undefined>(undefined);
 
     /**
@@ -287,12 +281,10 @@ export default class SheetSelection<
     if (this.freezeSelection) {
       return;
     }
-
-    this.selectionInProgress.set(true);
     // Initialize the bounds of the selection
     this.selectionBounds = {
-      startColumnId: column.id,
-      endColumnId: column.id,
+      startColumnIndex: column.columnIndex,
+      endColumnIndex: column.columnIndex,
       startRowIndex: row.rowIndex,
       endRowIndex: row.rowIndex,
     };
@@ -306,7 +298,7 @@ export default class SheetSelection<
     column: SelectionColumn,
   ): void {
     const { rowIndex } = row;
-    const { id } = column;
+    const { columnIndex } = column;
 
     // If there is no selection start cell,
     // this means the selection was never initiated
@@ -315,7 +307,7 @@ export default class SheetSelection<
     }
 
     this.selectionBounds.endRowIndex = rowIndex;
-    this.selectionBounds.endColumnId = id;
+    this.selectionBounds.endColumnIndex = columnIndex;
 
     const cells = this.getIncludedCells(this.selectionBounds);
     this.selectMultipleCells(cells);
@@ -327,7 +319,6 @@ export default class SheetSelection<
       this.selectMultipleCells(cells);
       this.selectionBounds = undefined;
     }
-    this.selectionInProgress.set(false);
   }
 
   selectAndActivateFirstCellIfExists(): void {
@@ -340,32 +331,22 @@ export default class SheetSelection<
   }
 
   getIncludedCells(selectionBounds: SelectionBounds): Cell<Row, Column>[] {
-    const { startRowIndex, endRowIndex, startColumnId, endColumnId } =
+    const { startRowIndex, endRowIndex, startColumnIndex, endColumnIndex } =
       selectionBounds;
     const minRowIndex = Math.min(startRowIndex, endRowIndex);
     const maxRowIndex = Math.max(startRowIndex, endRowIndex);
-
-    const columnOrder = this.getColumnOrder();
-
-    const startOrderIndex = columnOrder.indexOf(Number(startColumnId));
-    const endOrderIndex = columnOrder.indexOf(Number(endColumnId));
-
-    const minColumnPosition = Math.min(startOrderIndex, endOrderIndex);
-    const maxColumnPosition = Math.max(startOrderIndex, endOrderIndex);
-    const columnOrderSelected = columnOrder.slice(
-      minColumnPosition,
-      maxColumnPosition + 1,
-    );
-
-    const columns = this.getColumns();
+    const minColumnIndex = Math.min(startColumnIndex, endColumnIndex);
+    const maxColumnIndex = Math.max(startColumnIndex, endColumnIndex);
 
     const cells: Cell<Row, Column>[] = [];
     this.getRows().forEach((row) => {
       const { rowIndex } = row;
       if (rowIndex >= minRowIndex && rowIndex <= maxRowIndex) {
-        columnOrderSelected.forEach((columnId) => {
-          const column = columns.find((c) => c.id === columnId);
-          if (column) {
+        this.getColumns().forEach((column) => {
+          if (
+            column.columnIndex >= minColumnIndex &&
+            column.columnIndex <= maxColumnIndex
+          ) {
             cells.push([row, column]);
           }
         });
@@ -387,7 +368,7 @@ export default class SheetSelection<
     this.selectedCells.clear();
   }
 
-  isCompleteColumnSelected(column: Pick<Column, 'id'>): boolean {
+  private isCompleteColumnSelected(column: Pick<Column, 'id'>): boolean {
     if (this.getRows().length) {
       return (
         this.columnsSelectedWhenTheTableIsEmpty.getHas(column.id) ||
@@ -528,19 +509,17 @@ export default class SheetSelection<
   }
 
   onColumnSelectionStart(column: Column): boolean {
-    if (!this.isCompleteColumnSelected(column)) {
-      this.activateCell({ rowIndex: 0 }, { id: column.id });
-      const rows = this.getRows();
-
-      if (rows.length === 0) {
-        this.resetSelection();
-        this.columnsSelectedWhenTheTableIsEmpty.add(column.id);
-        return true;
-      }
+    this.activateCell({ rowIndex: 0 }, { id: column.id });
+    const rows = this.getRows();
 
-      this.onStartSelection(rows[0], column);
-      this.onMouseEnterCellWhileSelection(rows[rows.length - 1], column);
+    if (rows.length === 0) {
+      this.resetSelection();
+      this.columnsSelectedWhenTheTableIsEmpty.add(column.id);
+      return true;
     }
+
+    this.onStartSelection(rows[0], column);
+    this.onMouseEnterCellWhileSelection(rows[rows.length - 1], column);
     return true;
   }
 

diff --git a/mathesar_ui/src/pages/record/TableWidget.svelte b/mathesar_ui/src/pages/record/TableWidget.svelte
@@ -22,7 +22,7 @@
   });
 
   export let recordPk: string;
-  export let table: TableEntry;
+  export let table: Pick<TableEntry, 'id' | 'name'>;
   export let fkColumn: Pick<Column, 'id' | 'name'>;
 
   $: abstractTypesMap = $currentDbAbstractTypes.data;
@@ -31,7 +31,6 @@
     abstractTypesMap,
     meta,
     contextualFilters: new Map([[fkColumn.id, recordPk]]),
-    table,
   });
   $: tabularDataStore.set(tabularData);
 </script>
@@ -43,7 +42,7 @@
   </div>
 
   <div class="results">
-    <TableView context="widget" {table} />
+    <TableView context="widget" />
   </div>
 </div>
 

diff --git a/mathesar_ui/src/pages/record/Widgets.svelte b/mathesar_ui/src/pages/record/Widgets.svelte
@@ -1,17 +1,14 @@
 <script lang="ts">
-  import type { TableEntry } from '@mathesar/api/types/tables';
   import type { JoinableTablesResult } from '@mathesar/api/types/tables/joinable_tables';
   import { Help } from '@mathesar-component-library';
   import NameWithIcon from '@mathesar/components/NameWithIcon.svelte';
   import { iconRecord } from '@mathesar/icons';
-  import { currentTable } from '@mathesar/stores/tables';
   import TableWidget from './TableWidget.svelte';
 
   export let recordPk: string;
   export let recordSummary: string;
   export let joinableTablesResult: JoinableTablesResult;
 
-  $: currTable = $currentTable as TableEntry;
   $: tableNameMap = new Map(
     Object.entries(joinableTablesResult.tables).map(([tableId, table]) => [
       parseInt(tableId, 10),
@@ -56,7 +53,7 @@
     <div class="widgets">
       {#each tableWidgetInputs as { table, fkColumn } (`${table.id}-${fkColumn.id}`)}
         <section class="table-widget-positioner">
-          <TableWidget {recordPk} table={currTable} {fkColumn} />
+          <TableWidget {table} {fkColumn} {recordPk} />
         </section>
       {/each}
     </div>

diff --git a/mathesar_ui/src/pages/table/TablePage.svelte b/mathesar_ui/src/pages/table/TablePage.svelte
@@ -30,7 +30,6 @@
     id: table.id,
     abstractTypesMap,
     meta,
-    table,
   });
   $: tabularDataStore.set(tabularData);
 
@@ -46,7 +45,7 @@
 <LayoutWithHeader fitViewport restrictWidth={false}>
   <div class="table-page">
     <ActionsPane {table} />
-    <TableView {table} />
+    <TableView />
   </div>
 </LayoutWithHeader>
 

diff --git a/mathesar_ui/src/stores/table-data/tabularData.ts b/mathesar_ui/src/stores/table-data/tabularData.ts
@@ -7,12 +7,10 @@ import {
   type Writable,
 } from 'svelte/store';
 import type { DBObjectEntry } from '@mathesar/AppTypes';
-import type { TableEntry } from '@mathesar/api/types/tables';
 import type { AbstractTypesMap } from '@mathesar/stores/abstract-types/types';
 import { States } from '@mathesar/api/utils/requestUtils';
 import type { Column } from '@mathesar/api/types/tables/columns';
 import { SheetSelection } from '@mathesar/components/sheet';
-import { getColumnOrder } from '@mathesar/utils/tables';
 import { Meta } from './meta';
 import { ColumnsDataStore } from './columns';
 import type { RecordRow, TableRecordsData } from './records';
@@ -29,7 +27,6 @@ import { processColumn } from './processedColumns';
 export interface TabularDataProps {
   id: DBObjectEntry['id'];
   abstractTypesMap: AbstractTypesMap;
-  table: TableEntry;
   meta?: Meta;
   /**
    * Keys are columns ids. Values are cell values.
@@ -65,8 +62,6 @@ export class TabularData {
 
   selection: TabularDataSelection;
 
-  table: TableEntry;
-
   constructor(props: TabularDataProps) {
     const contextualFilters =
       props.contextualFilters ?? new Map<number, string | number>();
@@ -107,12 +102,8 @@ export class TabularData {
         ),
     );
 
-    this.table = props.table;
-
     this.selection = new SheetSelection({
       getColumns: () => [...get(this.processedColumns).values()],
-      getColumnOrder: () =>
-        getColumnOrder([...get(this.processedColumns).values()], this.table),
       getRows: () => this.recordsData.getRecordRows(),
       getMaxSelectionRowIndex: () => {
         const totalCount = get(this.recordsData.totalCount) ?? 0;

diff --git a/mathesar_ui/src/stores/tables.ts b/mathesar_ui/src/stores/tables.ts
@@ -483,13 +483,3 @@ export function saveRecordSummaryTemplate(
     preview_settings: customized ? previewSettings : { customized },
   });
 }
-
-export function saveColumnOrder(
-  table: Pick<TableEntry, 'id' | 'settings' | 'schema'>,
-  columnOrder: TableSettings['column_order'],
-): Promise<void> {
-  return saveTableSettings(table, {
-    // Using the Set constructor to remove potential duplicates
-    column_order: [...new Set(columnOrder)],
-  });
-}
diff --git a/mathesar_ui/src/systems/data-explorer/QueryRunner.ts b/mathesar_ui/src/systems/data-explorer/QueryRunner.ts
@@ -83,7 +83,6 @@ export default class QueryRunner<
     void this.run();
     this.selection = new SheetSelection({
       getColumns: () => [...get(this.processedColumns).values()],
-      getColumnOrder: () => [], // Empty array to default to the columnIndex order
       getRows: () => get(this.rowsData).rows,
       getMaxSelectionRowIndex: () => {
         const rowLength = get(this.rowsData).rows.length;

diff --git a/mathesar_ui/src/systems/record-selector/RecordSelectorWindow.svelte b/mathesar_ui/src/systems/record-selector/RecordSelectorWindow.svelte
@@ -6,7 +6,6 @@
   import { getTableName } from '@mathesar/stores/tables';
   import { getArticleForWord } from '@mathesar/utils/languageUtils';
   import Pagination from '@mathesar/utils/Pagination';
-  import { tables } from '@mathesar/stores/tables';
   import RecordSelectorContent from './RecordSelectorContent.svelte';
   import { RecordSelectorController } from './RecordSelectorController';
   import type { RecordSelectorPurpose } from './recordSelectorUtils';
@@ -33,17 +32,14 @@
     nestingLevel: controller.nestingLevel + 1,
   });
   $: ({ tableId, purpose } = controller);
-  $: table = $tableId && $tables.data.get($tableId);
-  $: tabularData =
-    $tableId && table
-      ? new TabularData({
-          id: $tableId,
-          abstractTypesMap: $currentDbAbstractTypes.data,
-          meta: new Meta({ pagination: new Pagination({ size: 10 }) }),
-          hasEnhancedPrimaryKeyCell: false,
-          table,
-        })
-      : undefined;
+  $: tabularData = $tableId
+    ? new TabularData({
+        id: $tableId,
+        abstractTypesMap: $currentDbAbstractTypes.data,
+        meta: new Meta({ pagination: new Pagination({ size: 10 }) }),
+        hasEnhancedPrimaryKeyCell: false,
+      })
+    : undefined;
   $: tableName = $tableId ? getTableName($tableId) : undefined;
   $: verb = verbMap.get($purpose) ?? '';
   $: nestedSelectorIsOpen = nestedController.isOpen;