finish the edit modal

src/ui/EditModal.ts

@@ -5,6 +5,7 @@ import { DatabaseDetails, ObsidianSettingTab } from "./settingTabs";
 import { i18nConfig } from "../lang/I18n";
 
 export class EditModal extends SettingModal {
+	propertyLines: Setting[] = []; // Store all property line settings
 	[key: string]: any; // Index signature
 	dataTemp: Record<string, any> = {
 		databaseFormatTemp: '',
@@ -132,6 +133,8 @@ export class EditModal extends SettingModal {
 				.onClick(async () => {
 					this.dataTemp.savedTempInd = true;
 					this.dataTemp.savedTemp = true;
+					console.log(this.dataTemp);
+					console.log(this.dataPrev);
 					this.close();
 				});
 		}
@@ -321,38 +324,17 @@ export class EditModal extends SettingModal {
 					.setTooltip("Delete")
 					.setIcon("trash")
 					.onClick(() => {
+						console.log('Deleting property', properties[propertyIndex]);
 						this.deleteProperty(propertyIndex, properties);
 					});
 			});
 		}
-	}
-
-	createPropertyLine(containerEl: HTMLElement, properties: customProperty[]) {
-		super.createPropertyLine(containerEl, properties);
-	}
-
-	deleteProperty(propertyIndex: number, properties: customProperty[]) {
-		let actualIndex = properties.findIndex(p => p.index === propertyIndex);
-		if (actualIndex > 0) {
-			properties.splice(actualIndex, 1);
-			this.propertyLines[actualIndex].settingEl.remove();
-			this.propertyLines.splice(actualIndex, 1);
-
-			properties.forEach((prop, idx) => {
-				prop.index = idx;
-			});
 
+		this.propertyLines.push(propertyLine);
 		this.updatePropertyLines();
-		}
-	}
 
-	updatePropertyLines() {
-		this.propertyLines.forEach((line, idx) => {
-			line.setName(idx === 0 ? i18nConfig.CustomPropertyFirstColumn : `${i18nConfig.CustomProperty} ${idx}`);
-		});
 	}
 
-
 	createStyleDiv(className: string, commandValue: boolean = false, parentEl: HTMLElement): HTMLDivElement {
 		return super.createStyleDiv(className, commandValue, parentEl);
 	}

src/ui/settingModal.ts

@@ -1,19 +1,22 @@
 import {
 	Modal,
 	Setting,
-	PluginSettingTab,
 	ButtonComponent, App
 } from 'obsidian';
 
 import { i18nConfig } from "../lang/I18n";
 import ObsidianSyncNotionPlugin from "../main";
 import { DatabaseDetails, ObsidianSettingTab } from "./settingTabs";
-// import {CustomModal} from "./CustomModal";
 
+export interface customProperty {
+	customName: string;
+	customType: string;
+	index: number;
+}
 
 export class SettingModal extends Modal {
 	propertyLines: Setting[] = []; // Store all property line settings
-	properties: { customName: string, customType: string , index: number}[] = []; // Array to store property values and types
+	properties: customProperty[] = []; // Array to store property values and types
 	[key: string]: any; // Index signature
 	data: Record<string, any> = {
 		databaseFormat: 'none',
@@ -80,7 +83,7 @@ export class SettingModal extends Modal {
 					});
 
 				// Initialize content based on the current dropdown value
-				(this.data.saved) ? this.updateContentBasedOnSelection(this.data.databaseFormat, nextTabs) : this.updateContentBasedOnSelection(this.data.databaseFormat, nextTabs);
+				(this.data.saved) ? this.updateContentBasedOnSelection(this.data.databaseFormat, nextTabs) : this.updateContentBasedOnSelection(this.plugin.settings.databaseFormat, nextTabs);
 
 			});
 
@@ -105,7 +108,7 @@ export class SettingModal extends Modal {
 				.setIcon('cross')
 				.onClick(() => {
 					this.data.saved = false;
-						this.data.customProperties = this.properties;
+					// this.data.customProperties = this.properties;
 					this.close();
 				});
 		}
@@ -139,7 +142,6 @@ export class SettingModal extends Modal {
 						.setValue(this.data.customTitleButton)
 						.onChange(async (value) => {
 							this.data.customTitleButton = value;
-
 							this.updateSettingEl(CustomNameEl, value)
 
 						})
@@ -197,16 +199,15 @@ export class SettingModal extends Modal {
 				.setDesc(i18nConfig.NotionCustomValuesDesc)
 				.addButton((button: ButtonComponent) => {
 					return button
-							.setTooltip('Add new property')
-							.setIcon('plus')
+						.setTooltip('Add one more property')
+						.setButtonText('Add New Property')
 						.onClick(async () => {
 							const customTabs = nextTabs.createDiv("custom-tabs");
-								this.createPropertyLine(customTabs);
+							this.createPropertyLine(customTabs, this.properties);
 						});
 				}
 				);
 		}
-
 	}
 
 
@@ -215,23 +216,22 @@ export class SettingModal extends Modal {
 		this.display()
 	}
 
-	createPropertyLine(containerEl: HTMLElement): void {
-		const propertyIndex = this.properties.length;
+	createPropertyLine(containerEl: HTMLElement, properties: customProperty[]): void {
+		const propertyIndex = properties.length;
 
-		this.properties.push({customName: "", customType: "", index: propertyIndex});
-
-		console.log(this.properties[propertyIndex].index);
+		properties.push({ customName: "", customType: "", index: propertyIndex });
 
 		const propertyLine = new Setting(containerEl)
 			.setName(propertyIndex === 0 ? i18nConfig.CustomPropertyFirstColumn : `${i18nConfig.CustomProperty} ${propertyIndex}`)
 			.setDesc(propertyIndex === 0 ? i18nConfig.CustomPropertyFirstColumnDesc : "");
+
 		propertyLine.addText(text => {
 			text.setPlaceholder(i18nConfig.CustomPropertyName)
 				.setValue("")
 				.onChange(value => {
-					let actualIndex = this.properties.findIndex(p => p.index === propertyIndex);
+					let actualIndex = properties.findIndex(p => p.index === propertyIndex);
 					if (actualIndex !== -1) {
-						this.properties[actualIndex].customName = value;
+						properties[actualIndex].customName = value;
 					}
 				});
 		});
@@ -258,8 +258,7 @@ export class SettingModal extends Modal {
 				// 'last_edited_by': 'Last Edited By',
 			};
 
-			// Use a reference to the current property object
-			const currentProperty = this.properties[propertyIndex];
+			const currentProperty = properties[propertyIndex];
 
 			if (propertyIndex === 0) {
 				dropdown.addOption("title", "Title");
@@ -273,7 +272,7 @@ export class SettingModal extends Modal {
 					if (currentProperty) {
 						currentProperty.customType = value;
 						// Retrieve the index of currentProperty from the properties array
-						const updatedIndex = this.properties.findIndex(p => p === currentProperty);
+						const updatedIndex = properties.findIndex(p => p === currentProperty);
 						console.log(`Updated value at index ${updatedIndex}: ${value}`);
 					} else {
 						console.log("Property not found, may have been deleted.");
@@ -288,32 +287,29 @@ export class SettingModal extends Modal {
 					.setTooltip("Delete")
 					.setIcon("trash")
 					.onClick(() => {
-						this.deleteProperty(propertyIndex);
+						this.deleteProperty(propertyIndex, properties);
 					});
 			});
 		}
 
 		this.propertyLines.push(propertyLine);
+		this.updatePropertyLines(); // Ensure property lines are updated after creation
 	}
 
-	deleteProperty(propertyIndex: number) {
-		let actualIndex = this.properties.findIndex(p => p.index === propertyIndex);
+	deleteProperty(propertyIndex: number, properties: customProperty[]): void {
+		let actualIndex = properties.findIndex(p => p.index === propertyIndex);
 		if (actualIndex !== -1) {
-			this.properties.splice(actualIndex, 1);
+			properties.splice(actualIndex, 1);
+			if (this.propertyLines[actualIndex]) {
 				this.propertyLines[actualIndex].settingEl.remove();
 				this.propertyLines.splice(actualIndex, 1);
-
+			}
 			// Update indices in the properties array
-			this.properties.forEach((prop, idx) => {
+			properties.forEach((prop, idx) => {
 				prop.index = idx;
 			});
 
 			this.updatePropertyLines();
-
-			console.log("Updated indices after deletion:");
-			this.properties.forEach((prop, idx) => {
-				console.log(`Index ${idx}: ${prop.index}`);
-			});
 		}
 	}
 

src/ui/settingTabs.ts

@@ -88,9 +88,6 @@ export class ObsidianSettingTab extends PluginSettingTab {
 
 		this.createSettingEl(containerEl, i18nConfig.NotionLinkDisplay, i18nConfig.NotionLinkDisplayDesc, 'toggle', i18nConfig.NotionLinkDisplay, this.plugin.settings.NotionLinkDisplay, 'NotionLinkDisplay')
 
-		// TODO: add toggle to enable or disable link display
-
-
 		// add new button
 
 		new Setting(containerEl)
@@ -291,6 +288,8 @@ export class ObsidianSettingTab extends PluginSettingTab {
 								if (modal.data.deleted) {
 									this.plugin.deleteDatabaseDetails(dbDetails);
 
+									console.log(dbDetails.fullName + " deleted");
+
 									this.plugin.commands.updateCommand();
 
 									this.display()