complete the new version for add button

README.md

@@ -13,7 +13,38 @@ Thus, based on the [original author's work](https://github.com/EasyChris/obsidia
 
 **Now, support both NotionNext and General databases.**
 
+**现在支持NotionNext和普通Notion数据库。**
+
+## TODO List
+
+- [ ] Support custom properties for Notion General database. 支持自定义属性
+- [ ] Support preview for database details in plugin settings. 支持预览数据库详情
+- [ ] Support edit for database details in plugin settings. 支持编辑数据库详情
+
 ## Update
+### 2.0.0 (Big Update)
+
+- redesign the plugin settings UI. From this version, the settings UI will be separated into two parts: 
+  - one for general settings: bannerUrl and your notion username (ID)
+  - one for database list: You can add new database or delete the database.
+- 重新设计了插件设置界面。从这个版本开始，设置界面将被分成两部分：
+  - 一部分是通用设置：bannerUrl和你的notion用户名（ID）
+  - 一部分是数据库列表：你可以添加新的数据库或者删除数据库。
+  
+![](https://minioapi.pjx.ac.cn/img1/2023/12/f7e89241f45cfee6b902ec4b69dd6f63.png)
+
+- You can add more databases in the plugin settings.
+- 你可以在插件设置中添加更多的数据库。
+![](https://minioapi.pjx.ac.cn/img1/2023/12/023bf46ebbc92c3991d2c443c575bc80.gif)
+
+- You can sync one note to multiple databases.
+- 你可以将一个笔记同步到多个数据库中。
+
+![](https://minioapi.pjx.ac.cn/img1/2023/12/75f793bad756162e46bf41e54166eb32.png)
+
+**Note: You need to add your previous database in the new template.**
+**注意：你需要将之前的数据库添加到新的模板中。**
+
 
 ### 1.2.0
 

src/commands/NotionCommands.ts

@@ -82,7 +82,7 @@ export default class RibbonCommands {
 	private addCommandForDatabase(dbDetails: DatabaseDetails) {
 		// Example logic - adjust based on your specific requirements
 		let commandId = `share-to-${dbDetails.abName}`;
-		let commandName = `Share to ${dbDetails.abName}`; // or use a translated name
+		let commandName = `Share to ${dbDetails.fullName} (${dbDetails.abName})`; // or use a translated name
 
 		let editorCallback: (editor: Editor, view: MarkdownView) => Promise<void>;
 		if (dbDetails.format === 'next') {

src/main.ts

@@ -81,6 +81,10 @@ export default class ObsidianSyncNotionPlugin extends Plugin {
 
 		await this.saveSettings();
 	}
+
+	// previewDatabase(dbDetails: DatabaseDetails) {
+	//
+	// }
 }
 
 

src/ui/settingModal.ts

@@ -66,7 +66,7 @@ export class SettingModal extends Modal {
 					.addOption('none', '')
 					.addOption('general', i18nConfig.databaseGeneral)
 					.addOption('next', i18nConfig.databaseNext)
-					.addOption('custom', i18nConfig.databaseCustom)
+					// .addOption('custom', i18nConfig.databaseCustom)
 					.setValue(this.data.databaseFormat)
 					.onChange(async (value) => {
 						this.data.databaseFormat = value;
@@ -121,6 +121,31 @@ export class SettingModal extends Modal {
 			// tag button
 			this.createSettingEl(nextTabs, i18nConfig.NotionTagButton, i18nConfig.NotionTagButtonDesc, 'toggle', i18nConfig.NotionCustomTitleText, this.data.tagButton, 'tagButton')
 
+			// add custom title button
+
+			new Setting(nextTabs)
+				.setName(i18nConfig.NotionCustomTitle)
+				.setDesc(i18nConfig.NotionCustomTitleDesc)
+				.addToggle((toggle) =>
+					toggle
+						.setValue(this.data.CustomTitleButton)
+						.onChange(async (value) => {
+							this.data.CustomTitleButton = value;
+
+							this.updateSettingEl(CustomNameEl, value)
+
+							// this.updateSettingEl(CustomValuesEl, value)
+
+							await this.plugin.saveSettings();
+							await this.plugin.commands.updateCommand();
+						})
+				);
+
+
+			// add custom title name
+			const CustomNameEl = this.createStyleDiv('custom-name', (this.data.CustomTitleButton), nextTabs);
+			this.createSettingEl(CustomNameEl, i18nConfig.NotionCustomTitleName, i18nConfig.NotionCustomTitleNameDesc, 'text', i18nConfig.NotionCustomTitleText, this.data.CustomTitleName, 'CustomTitleName')
+
 
 			// add api key
 			this.createSettingEl(nextTabs, i18nConfig.NotionAPI, i18nConfig.NotionAPIDesc, 'password', i18nConfig.NotionAPIText, this.data.notionAPI, 'notionAPI')

src/ui/settingTabs.ts

@@ -235,6 +235,18 @@ export class ObsidianSettingTab extends PluginSettingTab {
 				.setName(`${dbDetails.fullName} (${dbDetails.abName})`)
 				.setDesc(dbDetails.format)
 
+
+				// add a button for preview data
+				// settingEl
+				// .addButton((button: ButtonComponent): ButtonComponent => {
+				// 	return button
+				// 		.setTooltip("Preview Database")
+				// 		.setIcon("eye")
+				// 		.onClick(async () => {
+				// 			this.plugin.previewDatabase(dbDetails);
+				// 		});
+				// });
+
 				// settingEl
 				// .addButton((button: ButtonComponent): ButtonComponent => {
 				// 	return button

src/upload/uploadCommand.ts

@@ -87,13 +87,14 @@ export async function uploadCommandGeneral(
 export async function uploadCommandCustom(
     plugin: ObsidianSyncNotionPlugin,
     settings: PluginSettings,
+	dbDetails: DatabaseDetails,
     app: App,
 ) {
 
-    const { notionAPIGeneral, databaseIDGeneral } = settings;
+    const { notionAPI, databaseID } = settings;
 
     // Check if the user has set up the Notion API and database ID
-    if (notionAPIGeneral === "" || databaseIDGeneral === "") {
+    if (notionAPI === "" || databaseID === "") {
         const setAPIMessage = i18nConfig["set-api-id"];
         new Notice(setAPIMessage);
         return;
@@ -104,7 +105,7 @@ export async function uploadCommandCustom(
     if (markDownData) {
         const { basename } = nowFile;
 
-        const upload = new Upload2NotionCustom(plugin);
+        const upload = new Upload2NotionCustom(plugin,dbDetails);
         const res = await upload.syncMarkdownToNotionCustom(basename, cover, tags, customValues, markDownData, nowFile, this.app);
 
         if (res.status === 200) {

src/upload/upload_general/Upload2NotionGeneral.ts

@@ -14,6 +14,7 @@ export class Upload2NotionGeneral extends UploadBaseGeneral {
 
 	constructor(plugin: MyPlugin, dbDetails: DatabaseDetails) {
 		super(plugin);
+		this.dbDetails = dbDetails;
 	}
 
 	// 因为需要解析notion的block进行对比，非常的麻烦，
@@ -28,12 +29,13 @@ export class Upload2NotionGeneral extends UploadBaseGeneral {
 		await this.deletePage(notionID);
 
 		const { databaseID } = this.dbDetails;
-		const databasecover = await this.getDataBase(
+
+		const databaseCover = await this.getDataBase(
 			databaseID,
 		);
 
 		if (cover == null) {
-			cover = databasecover;
+			cover = databaseCover;
 		}
 
 		return await this.createPage(title, cover, tags, childArr);
@@ -45,13 +47,22 @@ export class Upload2NotionGeneral extends UploadBaseGeneral {
 		tags: string[],
 		childArr: any,
 	) {
+
+		const {
+			databaseID,
+			customTitleButton,
+			customTitleName,
+			tagButton,
+			notionAPI
+		} = this.dbDetails;
+
 		const bodyString: any = {
 			parent: {
-				database_id: this.plugin.settings.databaseIDGeneral,
+				database_id: databaseID,
 			},
 			properties: {
-				[this.plugin.settings.CustomTitleButton
+				[customTitleButton
-					? this.plugin.settings.CustomTitleName
+					? customTitleName
 					: "title"]: {
 					title: [
 						{
@@ -61,7 +72,7 @@ export class Upload2NotionGeneral extends UploadBaseGeneral {
 						},
 					],
 				},
-				...(this.plugin.settings.tagsButton
+				...(tagButton
 					? {
 						tags: {
 							multi_select: tags && true ? tags.map((tag) => ({ name: tag })) : [],
@@ -98,7 +109,7 @@ export class Upload2NotionGeneral extends UploadBaseGeneral {
 					"Content-Type": "application/json",
 					// 'User-Agent': 'obsidian.md',
 					Authorization:
-						"Bearer " + this.plugin.settings.notionAPIGeneral,
+						"Bearer " + notionAPI,
 					"Notion-Version": "2022-06-28",
 				},
 				body: JSON.stringify(bodyString),
@@ -144,7 +155,7 @@ export class Upload2NotionGeneral extends UploadBaseGeneral {
 			res = await this.createPage(title, cover, tags, file2Block);
 		}
 		if (res.status === 200) {
-			await updateYamlInfo(markdown, nowFile, res, app, this.plugin);
+			await updateYamlInfo(markdown, nowFile, res, app, this.plugin, this.dbDetails);
 		} else {
 			new Notice(`${res.text}`);
 		}

src/upload/upload_next/Upload2NotionNext.ts

@@ -40,10 +40,10 @@ export class Upload2NotionNext extends UploadBaseNext {
 
 		const { databaseID} = this.dbDetails
 
-        const databasecover = await this.getDataBase(databaseID)
+        const databaseCover = await this.getDataBase(databaseID)
 
         if (cover == null) {
-            cover = databasecover
+            cover = databaseCover
         }
 
         return await this.createPage(
@@ -77,9 +77,16 @@ export class Upload2NotionNext extends UploadBaseNext {
         datetime: string,
         childArr: any
     ) {
+
+		const {
+			databaseID,
+			notionAPI
+		} = this.dbDetails
+
+
         const bodyString: any = {
             parent: {
-                database_id: this.plugin.settings.databaseIDNext
+                database_id: databaseID,
             },
             icon: {
                 emoji: emoji || '📜'
@@ -183,7 +190,7 @@ export class Upload2NotionNext extends UploadBaseNext {
                 headers: {
                     'Content-Type': 'application/json',
                     // 'User-Agent': 'obsidian.md',
-                    'Authorization': 'Bearer ' + this.plugin.settings.notionAPINext,
+                    'Authorization': 'Bearer ' + notionAPI,
                     'Notion-Version': '2022-06-28',
                 },
                 body: JSON.stringify(bodyString),

src/upload/upoload_custom/Upload2NotionCustom.ts

@@ -4,15 +4,17 @@ import { markdownToBlocks } from "@tryfabric/martian";
 import * as yamlFrontMatter from "yaml-front-matter";
 // import * as yaml from "yaml"
 import MyPlugin from "src/main";
-import { PluginSettings } from "../../ui/settingTabs";
+import {DatabaseDetails, PluginSettings} from "../../ui/settingTabs";
 import { updateYamlInfo } from "../updateYaml";
 import {UploadBaseCustom} from "./BaseUpload2NotionCustom";
 
 export class Upload2NotionCustom extends UploadBaseCustom {
 	settings: PluginSettings;
+	dbDetails: DatabaseDetails;
 
-	constructor(plugin: MyPlugin) {
+	constructor(plugin: MyPlugin, dbDetails: DatabaseDetails) {
 		super(plugin);
+		this.dbDetails = dbDetails;
 	}
 
 	// 因为需要解析notion的block进行对比，非常的麻烦，
@@ -27,12 +29,14 @@ export class Upload2NotionCustom extends UploadBaseCustom {
 	) {
 		await this.deletePage(notionID);
 
-		const databasecover = await this.getDataBase(
+		const { databaseID } = this.dbDetails;
-			this.plugin.settings.databaseIDGeneral,
+
+		const databaseCover = await this.getDataBase(
+			databaseID
 		);
 
 		if (cover == null) {
-			cover = databasecover;
+			cover = databaseCover;
 		}
 
 		return await this.createPage(title, cover, tags, customValues, childArr);
@@ -45,13 +49,22 @@ export class Upload2NotionCustom extends UploadBaseCustom {
 		customValues: Record<string, string>,
 		childArr: any,
 	) {
+
+		const {
+			databaseID,
+			customTitleButton,
+			customTitleName,
+			tagButton,
+			notionAPI
+		} = this.dbDetails;
+
 		const bodyString: any = {
 			parent: {
-				database_id: this.plugin.settings.databaseIDGeneral,
+				database_id: databaseID,
 			},
 			properties: {
-				[this.plugin.settings.CustomTitleButton
+				[customTitleButton
-					? this.plugin.settings.CustomTitleName
+					? customTitleName
 					: "title"]: {
 					title: [
 						{
@@ -148,7 +161,7 @@ export class Upload2NotionCustom extends UploadBaseCustom {
 			res = await this.createPage(title, cover, tags, customValues, file2Block);
 		}
 		if (res.status === 200) {
-			await updateYamlInfo(markdown, nowFile, res, app, this.plugin);
+			await updateYamlInfo(markdown, nowFile, res, app, this.plugin, this.dbDetails);
 		} else {
 			new Notice(`${res.text}`);
 		}