Merge branch 'hotfix-update-cell-after-change-column-label'

Author: RafaelGB

src/components/Columns.tsx

@@ -3,6 +3,7 @@ import {TableColumn} from 'cdm/FolderModel';
 import { LOGGER } from "services/Logger";
 import { DatabaseColumn } from 'cdm/DatabaseModel';
 import { RowSelectOption } from 'cdm/RowSelectModel';
+import { dbTrim } from 'parsers/DatabaseParser';
 
 /**
  * Add mandatory columns to the table
@@ -58,7 +59,7 @@ async function columnOptions(columnKey:string,index:number, column:DatabaseColum
     position: column.position ?? index,
     label: column.label,
     key: column.key ?? columnKey,
-    accessor: column.accessor ?? column.label.trim().toLowerCase(),
+    accessor: column.accessor ?? dbTrim(column.label),
     isMetadata: column.isMetadata ?? false
   }
   /**

src/components/Header.tsx

@@ -14,6 +14,7 @@ import { ActionTypes, DataTypes, MetadataColumns } from 'helpers/Constants';
 import { LOGGER } from 'services/Logger';
 import { DatabaseHeaderProps } from 'cdm/FolderModel';
 import ReactDOM from 'react-dom';
+import { dbTrim } from 'parsers/DatabaseParser';
 
 function setOptionsOfSelectDataType(options:any[],rows:any,columnId:string):any[]{
   rows.forEach((row:any)=>{
@@ -53,7 +54,7 @@ export default function Header(headerProps:DatabaseHeaderProps) {
     strategy: "absolute"
   });
   const [labelState, setLabelState] = useState(headerProps.column.label);
-  const [keyState, setkeyState] = useState(key.trim());
+  const [keyState, setkeyState] = useState(dbTrim(key));
   const [typeReferenceElement, setTypeReferenceElement] = useState(null);
   const [typePopperElement, setTypePopperElement] = useState(null);
   const [showType, setShowType] = useState(false);
@@ -185,7 +186,7 @@ export default function Header(headerProps:DatabaseHeaderProps) {
         label: labelState
       });
       setExpanded(false);
-      setkeyState(labelState.trim());
+      setkeyState(dbTrim(labelState));
     }
   }
 

src/components/reducers/DatabaseDispatch.tsx

@@ -9,6 +9,7 @@ import { adapterRowToDatabaseYaml, updateRowFile } from 'helpers/VaultManagement
 import { randomColor } from 'helpers/Colors';
 import { DatabaseColumn } from 'cdm/DatabaseModel';
 import NoteInfo from 'services/NoteInfo';
+import { dbTrim } from 'parsers/DatabaseParser';
 
 export function databaseReducer(state:TableDataType, action:ActionType) {
     LOGGER.debug(`<=>databaseReducer action: ${action.type}`);
@@ -74,27 +75,20 @@ export function databaseReducer(state:TableDataType, action:ActionType) {
               (column:any) => column.id === action.columnId
           );
           // trim label will get a valid yaml key
-          const update_col_key:string = action.label.trim();
-          // Update configuration on disk
+          const update_col_key:string = dbTrim(action.label);
+          // Update configuration & row files on disk
           state.view.diskConfig.updateColumnProperties(
             action.columnId,
-            {label: action.label, accessor: update_col_key, key: update_col_key}
+            {label: action.label, accessor: update_col_key, key: update_col_key},
+            state.data // Update all rows with new key
           );
-          Promise.all(state.data.map(async (row:TableRow) => {
-              updateRowFile(
-                row.note.getFile(),
-                action.accessor,
-                update_col_key,
-                UpdateRowOptions.COLUMN_KEY
-              );
-          }));
           // Update state
           return {
               ...state,
               skipReset: true,
               columns: [
               ...state.columns.slice(0, index),
-              { ...state.columns[index], label: action.label },
+              { ...state.columns[index], label: action.label, id: update_col_key, key: update_col_key, accessor: update_col_key },
               ...state.columns.slice(index + 1, state.columns.length)
               ]
           };
@@ -238,7 +232,7 @@ export function databaseReducer(state:TableDataType, action:ActionType) {
                 label: newLeftColumn.label,
                 key: newLeftColumn.key,
                 accessor: newLeftColumn.accessor,
-                dataType: newLeftColumn.input,
+                dataType: DataTypes.TEXT,
                 created: action.focus && true,
                 options: []
               },
@@ -282,7 +276,7 @@ export function databaseReducer(state:TableDataType, action:ActionType) {
                 label: newRIghtColumn.label,
                 key: newRIghtColumn.key,
                 accessor: newRIghtColumn.accessor,
-                dataType: newRIghtColumn.input,
+                dataType: DataTypes.TEXT,
                 created: action.focus && true,
                 options: []
               },

src/parsers/DatabaseParser.ts

@@ -49,4 +49,13 @@ export function hasFrontmatterKey(data: string) {
     databaseConfigString.push(`config:`);
     databaseConfigString.push(`${yamlIndent.repeat(1)}enable_show_state: ${databaseConfig.config.enable_show_state}`);
     return databaseConfigString;
+  }
+
+  /**
+   * Given a string, parse it to be key candidate
+   * @param str
+   * @returns {string}
+   */
+  export function dbTrim(str: string) {
+    return str.trim().replaceAll("\n", "").replaceAll("\t", "").replaceAll(" ", "_");
   }

src/services/DatabaseInfo.ts

@@ -6,8 +6,10 @@ import {
 import { LOGGER } from 'services/Logger';
 import { VaultManagerDB } from 'services/FileManagerService';
 import { convertDatabaseYamlToParsedString, hasFrontmatterKey } from 'parsers/DatabaseParser';
-import { NoteContentAction } from 'cdm/FolderModel';
+import { NoteContentAction, TableRow } from 'cdm/FolderModel';
 import { LocalSettings } from 'Settings';
+import { updateRowFile } from 'helpers/VaultManagement';
+import { UpdateRowOptions } from 'helpers/Constants';
 
 export default class DatabaseInfo {
     private file: TFile;
@@ -78,12 +80,25 @@ export default class DatabaseInfo {
      * @param columnId 
      * @param properties 
      */
-    async updateColumnProperties<P extends keyof DatabaseColumn>(columnId:string, properties:Record<string,P>):Promise<void>{
-        const currentCol = this.yaml.columns[columnId];
+    async updateColumnProperties<P extends keyof DatabaseColumn>(columnId:string, properties:Record<string,P>,rows?:TableRow[]):Promise<void>{
+        const colToUpdate = this.yaml.columns[columnId];
+        const currentKey = colToUpdate.key;
         for (const key in properties) {
-            currentCol[key] = properties[key];
+            colToUpdate[key] = properties[key];
+        }
+        this.yaml.columns[columnId] = colToUpdate;
+        if(rows){
+        await this.updateColumnKey(columnId, colToUpdate.accessor);
+        // Once the column is updated, update the rows in case the key is changed
+        await Promise.all(rows.map(async (row:TableRow) => {
+                updateRowFile(
+                    row.note.getFile(),
+                    currentKey,
+                    colToUpdate.key,
+                    UpdateRowOptions.COLUMN_KEY
+                );
+            }));
         }
-        this.yaml.columns[columnId] = currentCol;
         await this.saveOnDisk();
     }