Merge branch '18-bug-file-column-always-resets-to-far-right-position'

docs/changelog.md

@@ -1,3 +1,9 @@
+## 0.1.2
+### Improved
+- Now DnD of file column and persist order are supported.
+
+### No longer broken
+- Change select cell type no crash the view anymore. This is a but introduced in 0.1.1.
 ## 0.1.1
 ### Improved
 - The width of columns are adjusted when a column is added of removed

manifest.json

@@ -1,7 +1,7 @@
 {
 	"id": "dbfolder",
 	"name": "DB Folder",
-	"version": "0.1.1",
+	"version": "0.1.2",
 	"minAppVersion": "0.14.6",
 	"description": "Folder with the capability to store and retrieve data from a folder like database",
 	"author": "RafaelGB",

package.json

@@ -1,6 +1,6 @@
 {
 	"name": "obsidian-dbfolder",
-	"version": "0.1.1",
+	"version": "0.1.2",
 	"description": "This is a sample plugin for Obsidian (https://obsidian.md)",
 	"main": "main.js",
 	"scripts": {

src/DatabaseView.tsx

@@ -1,3 +1,4 @@
+import { DatabaseColumn } from "cdm/DatabaseModel";
 import { TableDataType } from "cdm/FolderModel";
 import {
   obtainColumnsFromFolder,
@@ -118,17 +119,17 @@ export class DatabaseView extends TextFileView implements HoverParent {
       await this.diskConfig.initDatabaseconfigYaml(
         this.plugin.settings.local_settings
       );
-      // Obtain base information about the database
-      const columns = await obtainColumnsFromFolder(
-        this.diskConfig.yaml.columns
-      );
-      const metatadaColumns = await obtainMetadataColumns();
-      columns.push(...metatadaColumns);
+      let yamlColumns: Record<string, DatabaseColumn> =
+        this.diskConfig.yaml.columns;
+      // Complete the columns with the metadata columns
+      yamlColumns = await obtainMetadataColumns(yamlColumns);
+      // Obtain base information about columns
+      const columns = await obtainColumnsFromFolder(yamlColumns);
       const rows = await adapterTFilesToRows(this.file.parent.path);
       // Define table properties
       const tableProps: TableDataType = {
         columns: columns,
-        metadataColumns: metatadaColumns,
+        shadowColumns: columns.filter((col) => col.skipPersist),
         data: rows,
         skipReset: false,
         view: this,

src/cdm/DatabaseModel.ts

@@ -9,6 +9,7 @@ export type DatabaseColumn = {
     key?: string,
     position?: number,
     isMetadata?: boolean,
+    skipPersist?: boolean,
     csvCandidate?: boolean,
     [key: string]: RowType
 }

src/cdm/FolderModel.ts

@@ -5,6 +5,7 @@ import { RowType } from "cdm/RowTypeModel";
 import { RowSelectOption } from "cdm/RowSelectModel";
 import NoteInfo from "services/NoteInfo";
 import { TFile } from "obsidian";
+import { DatabaseColumn } from "cdm/DatabaseModel";
 
 export type Group = Parameter | Parameters | FolderModel | Models;
 type Parameter = {
@@ -46,7 +47,8 @@ export type TableColumn = {
     Cell?: any,
     getHeaderProps?: any,
     getResizerProps?: any,
-    isMetadata?: boolean
+    isMetadata?: boolean,
+    skipPersist?: boolean,
     csvCandidate: boolean
 }
 
@@ -58,7 +60,7 @@ export type RowDataType = {
 
 export type TableDataType = {
     columns: TableColumn[],
-    metadataColumns: TableColumn[],
+    shadowColumns: TableColumn[],
     data: Array<RowDataType>,
     skipReset: boolean,
     view: DatabaseView,

src/components/Columns.tsx

@@ -14,20 +14,17 @@ import { dbTrim } from "helpers/StylesHelper";
  * @param columns
  * @returns
  */
-export async function obtainMetadataColumns(): Promise<TableColumn[]> {
-  const columns: TableColumn[] = [];
-  const metadataColumns: Record<string, DatabaseColumn> = {};
-  metadataColumns[MetadataColumns.FILE] = MetadataDatabaseColumns.FILE;
-  metadataColumns[MetadataColumns.ADD_COLUMN] =
-    MetadataDatabaseColumns.ADD_COLUMN;
+export async function obtainMetadataColumns(
+  yamlColumns: Record<string, DatabaseColumn>
+): Promise<Record<string, DatabaseColumn>> {
+  // If File is not already in the table, add it
+  yamlColumns[MetadataColumns.FILE] = {
+    ...MetadataDatabaseColumns.FILE,
+    ...(yamlColumns[MetadataColumns.FILE] ?? {}),
+  };
 
-  await Promise.all(
-    Object.keys(metadataColumns).map(async (columnKey, index) => {
-      const column = metadataColumns[columnKey];
-      columns.push(await columnOptions(columnKey, index, column));
-    })
-  );
-  return columns;
+  yamlColumns[MetadataColumns.ADD_COLUMN] = MetadataDatabaseColumns.ADD_COLUMN;
+  return yamlColumns;
 }
 
 export async function obtainColumnsFromFolder(
@@ -63,6 +60,7 @@ async function columnOptions(
     key: column.key ?? columnKey,
     accessor: column.accessor ?? dbTrim(column.label),
     isMetadata: column.isMetadata ?? false,
+    skipPersist: column.skipPersist ?? false,
     csvCandidate: column.csvCandidate ?? true,
   };
   /**

src/components/Header.tsx

@@ -84,7 +84,7 @@ export default function Header(headerProps: DatabaseHeaderProps) {
 
   function adjustWidthOfTheColumn() {
     const columnNumber =
-      initialState.columns.length + 1 - initialState.metadataColumns.length;
+      initialState.columns.length + 1 - initialState.shadowColumns.length;
     const columnName = `newColumn${columnNumber}`;
     const columnLabel = `New Column ${columnNumber}`;
     // Add width of the new column

src/components/HeaderMenu.tsx

@@ -100,7 +100,6 @@ const HeaderMenu = (headerMenuProps: HeaderMenuProps) => {
     },
     {
       onClick: (e: any) => {
-        console.log("columnWidthState");
         dispatch({
           type: ActionTypes.ADD_COLUMN_TO_LEFT,
           columnId: id,
@@ -114,7 +113,6 @@ const HeaderMenu = (headerMenuProps: HeaderMenuProps) => {
     },
     {
       onClick: (e: any) => {
-        console.log("columnWidthState");
         dispatch({
           type: ActionTypes.ADD_COLUMN_TO_RIGHT,
           columnId: id,
@@ -226,7 +224,7 @@ const HeaderMenu = (headerMenuProps: HeaderMenuProps) => {
 
   function adjustWidthOfTheColumn() {
     const columnNumber =
-      initialState.columns.length + 1 - initialState.metadataColumns.length;
+      initialState.columns.length + 1 - initialState.shadowColumns.length;
     const columnName = `newColumn${columnNumber}`;
     const columnLabel = `New Column ${columnNumber}`;
     // Add width of the new column

src/components/Table.tsx

@@ -22,7 +22,7 @@ import { useDraggableInPortal } from "components/portals/UseDraggableInPortal";
 import { c } from "helpers/StylesHelper";
 import { HeaderNavBar } from "components/NavBar";
 import getColumnsWidthStyle from "components/styles/ColumnWidthStyle";
-import { HeaderContext } from "./contexts/HeaderContext";
+import { HeaderContext } from "components/contexts/HeaderContext";
 
 const defaultColumn = {
   minWidth: 50,
@@ -287,7 +287,7 @@ export function Table(initialState: TableDataType) {
                         key={`Draggable-${column.id}`}
                         draggableId={`${column.id}`}
                         index={index}
-                        isDragDisabled={(column as any).isMetadata}
+                        isDragDisabled={(column as any).skipPersist}
                       >
                         {renderDraggable((provided) => {
                           const tableCellBaseProps = {

src/components/portals/PopperSelectPortal.tsx

@@ -40,6 +40,7 @@ const PopperSelectPortal = (popperProps: PopperProps) => {
       key: (column as any).key,
       value: option.label,
       row: row,
+      columnId: column.id,
     });
   }
 

src/helpers/Constants.ts

@@ -42,6 +42,7 @@ export const MetadataDatabaseColumns = Object.freeze({
     label: MetadataLabels.FILE,
     accessor: MetadataColumns.FILE,
     isMetadata: true,
+    skipPersist: false,
     csvCandidate: true,
   },
   ADD_COLUMN: {
@@ -53,6 +54,7 @@ export const MetadataDatabaseColumns = Object.freeze({
     label: MetadataLabels.ADD_COLUMN,
     accessor: MetadataColumns.ADD_COLUMN,
     isMetadata: true,
+    skipPersist: true,
     csvCandidate: false,
   }
 });

src/mock/mockUtils.tsx

@@ -60,7 +60,7 @@ export function makeData(count: number): TableDataType {
   ];
   return {
     columns: columns,
-    metadataColumns: [],
+    shadowColumns: [],
     data: data,
     skipReset: false,
     view: null,

src/parsers/DatabaseYamlToStringParser.ts

@@ -14,6 +14,7 @@ const DatabaseYamlToStringParser = (databaseConfig: DatabaseYaml): string[] => {
   // Table Columns
   databaseConfigString.push(`columns:`);
   for (const columnName in databaseConfig.columns) {
+    if (databaseConfig.columns[columnName].skipPersist) continue;
     databaseConfigString.push(`${yamlIndent.repeat(1)}${columnName}:`);
     for (const columnKey in databaseConfig.columns[columnName]) {
       databaseConfigString.push(`${yamlIndent.repeat(2)}${columnKey}: ${databaseConfig.columns[columnName][columnKey]}`);