From 7207ce6e66c60c775ae5f6974a158c25f1aed326 Mon Sep 17 00:00:00 2001
From: Lost Paul <70213368+LostPaul@users.noreply.github.com>
Date: Tue, 4 Jul 2023 22:03:39 +0200
Subject: [PATCH] Remove grid style option temporary

---
 src/folderOverview.ts        | 29 ++++++++++++++++++++++-------
 src/modals/folderOverview.ts |  1 -
 styles.css                   | 27 +++++++++++++++++++++++++++
 3 files changed, 49 insertions(+), 8 deletions(-)

diff --git a/src/folderOverview.ts b/src/folderOverview.ts
index fa5a8c3..486c4ff 100644
--- a/src/folderOverview.ts
+++ b/src/folderOverview.ts
@@ -62,12 +62,27 @@ export function createOverview(plugin: FolderNotesPlugin, source: string, el: HT
 
 	if (style === 'grid') {
 		const grid = root.createEl('div', { cls: 'folder-overview-grid' });
-		files.forEach((file) => {
+		files.forEach(async (file) => {
 			const gridItem = grid.createEl('div', { cls: 'folder-overview-grid-item' });
-			const link = gridItem.createEl('a', { cls: 'folder-overview-grid-item-link' });
-			link.innerText = file.name.replace('.md', '').replace('.canvas', '');
-			if (!(file instanceof TFile)) return;
-			link.href = plugin.app.fileManager.generateMarkdownLink(file, '', ctx.sourcePath);
+			const gridArticle = gridItem.createEl('article', { cls: 'folder-overview-grid-item-article' });
+			if (file instanceof TFile) {
+				const fileContent = await plugin.app.vault.read(file);
+				// skip --- yaml
+				const descriptionEl = gridArticle.createEl('p', { cls: 'folder-overview-grid-item-description' });
+				let description = fileContent.split('\n')[0];
+				if (description.length > 64) {
+					description = description.slice(0, 64) + '...';
+				}
+				descriptionEl.innerText = description;
+				const link = gridArticle.createEl('a', { cls: 'folder-overview-grid-item-link internal-link' });
+				const title = link.createEl('h1', { cls: 'folder-overview-grid-item-link-title' });
+				title.innerText = file.name.replace('.md', '').replace('.canvas', '');
+				link.href = file.path;
+			} else if (file instanceof TFolder) {
+				const folderItem = gridArticle.createEl('div', { cls: 'folder-overview-grid-item-folder' });
+				const folderName = folderItem.createEl('h1', { cls: 'folder-overview-grid-item-folder-name' });
+				folderName.innerText = file.name;
+			}
 		});
 	} else if (style === 'list') {
 		const pathBlacklist: string[] = [];
@@ -92,7 +107,7 @@ export function createOverview(plugin: FolderNotesPlugin, source: string, el: HT
 		root.appendChild(folderElement);
 		*/
 	}
-	if (includeTypes.length > 1) {
+	if (includeTypes.length > 1 && style !== 'grid') {
 		removeEmptyFolders(ul);
 	}
 }
@@ -187,7 +202,7 @@ function getAllFiles(files: TAbstractFile[], sourceFolderPath: string, depth: nu
 	const allFiles: TAbstractFile[] = [];
 	files.forEach((file) => {
 		if (file instanceof TFolder) {
-			if ((file.path.split('/').length - sourceFolderPath.split('/').length) - 1 < depth -1) {
+			if ((file.path.split('/').length - sourceFolderPath.split('/').length) - 1 < depth - 1) {
 				allFiles.push(...getAllFiles(file.children, sourceFolderPath, depth));
 			}
 		} else {
diff --git a/src/modals/folderOverview.ts b/src/modals/folderOverview.ts
index a7e50af..d3ebe49 100644
--- a/src/modals/folderOverview.ts
+++ b/src/modals/folderOverview.ts
@@ -118,7 +118,6 @@ export class FolderOverviewSettings extends Modal {
 			.addDropdown((dropdown) =>
 				dropdown
 					.addOption('list', 'List')
-					.addOption('grid', 'Grid')
 					.setValue(this.yaml?.style || 'list')
 					.onChange(async (value: 'list') => {
 						this.yaml.style = value;
diff --git a/styles.css b/styles.css
index 6e2ef56..c51f75a 100644
--- a/styles.css
+++ b/styles.css
@@ -128,3 +128,30 @@
 .folder-list::marker {
     color: var(--text-normal) !important;
 }
+
+.folder-overview-grid {
+    display: grid;
+    grid-gap: 20px;
+    grid-template-columns: repeat(3, 1fr);
+}
+
+.folder-overview-grid-item-article article {
+    padding: 15px;
+    flex: 1;
+    display: flex;
+    flex-direction: column;
+    justify-content: space-between;
+}
+.folder-overview-grid-item-article a {
+    text-decoration: none !important;
+}
+.folder-overview-grid-item-article h1 {
+    font-size: 1.2rem;
+}
+
+
+.folder-overview-grid-item {
+    flex: 1 1 auto;
+    margin-right: 1.200rem;
+    margin-bottom: 1.200rem;
+}
\ No newline at end of file