From 65f77baf2b95c4e11bdc983ff5b06ac2fecc12cd Mon Sep 17 00:00:00 2001 From: Elio Struyf Date: Sat, 19 Feb 2022 17:32:32 +0100 Subject: [PATCH] #261 - Update tags and categories --- CHANGELOG.md | 1 + src/dashboardWebView/hooks/usePages.tsx | 4 +- src/dashboardWebView/models/Page.ts | 3 + src/listeners/dashboard/PagesListener.ts | 64 ++++++++++++++++++- src/listeners/panel/TaxonomyListener.ts | 8 +-- .../components/Fields/WrapperField.tsx | 4 +- src/panelWebView/components/TagPicker.tsx | 2 + 7 files changed, 78 insertions(+), 8 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 1c80dfc7..6e0c0623 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -26,6 +26,7 @@ ### 🐞 Fixes - [#247](https://github.com/estruyf/vscode-front-matter/issues/247): Fix the front matter highlighting in markdown documents +- [#261](https://github.com/estruyf/vscode-front-matter/issues/261): Fix to allow that tag and category fields can be renamed ## [6.0.0] - 2022-01-25 - [Release Notes](https://beta.frontmatter.codes/updates/v6.0.0) diff --git a/src/dashboardWebView/hooks/usePages.tsx b/src/dashboardWebView/hooks/usePages.tsx index f963a4a6..1fd405c2 100644 --- a/src/dashboardWebView/hooks/usePages.tsx +++ b/src/dashboardWebView/hooks/usePages.tsx @@ -100,12 +100,12 @@ export default function usePages(pages: Page[]) { // Filter by tag if (tag) { - pagesSorted = pagesSorted.filter(page => page.tags && page.tags.includes(tag)); + pagesSorted = pagesSorted.filter(page => page.fmTags && page.fmTags.includes(tag)); } // Filter by category if (category) { - pagesSorted = pagesSorted.filter(page => page.categories && page.categories.includes(category)); + pagesSorted = pagesSorted.filter(page => page.fmCategories && page.fmCategories.includes(category)); } setPageItems(pagesSorted); diff --git a/src/dashboardWebView/models/Page.ts b/src/dashboardWebView/models/Page.ts index d1e037bb..4c4a4fd9 100644 --- a/src/dashboardWebView/models/Page.ts +++ b/src/dashboardWebView/models/Page.ts @@ -7,6 +7,9 @@ export interface Page { fmModified: number; fmDraft: "Draft" | "Published", fmYear: number | null | undefined; + fmPreviewImage: string; + fmTags: string[]; + fmCategories: string[]; title: string; slug: string; diff --git a/src/listeners/dashboard/PagesListener.ts b/src/listeners/dashboard/PagesListener.ts index 0c8b8c39..eeea4fe8 100644 --- a/src/listeners/dashboard/PagesListener.ts +++ b/src/listeners/dashboard/PagesListener.ts @@ -13,7 +13,7 @@ import { ContentType } from "../../helpers/ContentType"; import { DateHelper } from "../../helpers/DateHelper"; import { Notifications } from "../../helpers/Notifications"; import { BaseListener } from "./BaseListener"; -import { Field } from '../../models'; +import { Field, FieldType } from '../../models'; export class PagesListener extends BaseListener { @@ -152,6 +152,8 @@ export class PagesListener extends BaseListener { fmDraft: ContentType.getDraftStatus(article?.data), fmYear: article?.data[dateField] ? DateHelper.tryParse(article?.data[dateField])?.getFullYear() : null, fmPreviewImage: "", + fmTags: [], + fmCategories: [], // Make sure these are always set title: article?.data.title, slug: article?.data.slug, @@ -170,6 +172,16 @@ export class PagesListener extends BaseListener { } } + let tagParents = this.findFieldByType(contentType.fields, "tags"); + if (tagParents.length !== 0) { + page.fmTags = this.getFieldValue(article.data, tagParents); + } + + let categoryParents = this.findFieldByType(contentType.fields, "categories"); + if (categoryParents.length !== 0) { + page.fmCategories = this.getFieldValue(article.data, categoryParents); + } + // Check if parent fields were retrieved, if not there was no image present if (previewFieldParents.length > 0) { let fieldValue = null; @@ -224,6 +236,56 @@ export class PagesListener extends BaseListener { return; } + /** + * Retrieve the field value + * @param data + * @param parents + * @returns + */ + private static getFieldValue(data: any, parents: string[]): string[] { + let fieldValue = []; + let crntPageData = data; + + for (let i = 0; i < parents.length; i++) { + const crntField = parents[i]; + + if (i === parents.length - 1) { + fieldValue = crntPageData[crntField]; + } else { + if (!crntPageData[crntField]) { + continue; + } + + crntPageData = crntPageData[crntField]; + } + } + + return fieldValue; + } + + /** + * Find the field by its type + * @param fields + * @param type + * @param parents + * @returns + */ + private static findFieldByType(fields: Field[], type: FieldType, parents: string[] = []) { + for (const field of fields) { + if (field.type === type) { + parents = [...parents, field.name]; + return parents; + } else if (field.type === "fields" && field.fields) { + const subFields = this.findPreviewField(field.fields); + if (subFields.length > 0) { + return [...parents, field.name, ...subFields]; + } + } + } + + return parents; + } + /** * Find the preview field in the fields * @param ctFields diff --git a/src/listeners/panel/TaxonomyListener.ts b/src/listeners/panel/TaxonomyListener.ts index 675f3c88..444a7513 100644 --- a/src/listeners/panel/TaxonomyListener.ts +++ b/src/listeners/panel/TaxonomyListener.ts @@ -19,10 +19,10 @@ export class TaxonomyListener extends BaseListener { switch(msg.command) { case CommandToCode.updateTags: - this.updateTags(TagType.tags, msg.data?.values || [], msg.data?.parents || [], msg.data?.blockData); + this.updateTags(msg.data?.fieldName, msg.data?.values || [], msg.data?.parents || [], msg.data?.blockData); break; case CommandToCode.updateCategories: - this.updateTags(TagType.categories, msg.data?.values || [], msg.data?.parents || [], msg.data?.blockData); + this.updateTags(msg.data?.fieldName, msg.data?.values || [], msg.data?.parents || [], msg.data?.blockData); break; case CommandToCode.updateKeywords: this.updateTags(TagType.keywords, msg.data?.values || [], msg.data?.parents || [], msg.data?.blockData); @@ -47,7 +47,7 @@ export class TaxonomyListener extends BaseListener { * @param tagType * @param values */ - private static updateTags(tagType: TagType, values: string[], parents: string[], blockData?: BlockFieldData) { + private static updateTags(fieldName: string, values: string[], parents: string[], blockData?: BlockFieldData) { const editor = window.activeTextEditor; if (!editor) { return ""; @@ -58,7 +58,7 @@ export class TaxonomyListener extends BaseListener { const parentObj = DataListener.getParentObject(article.data, article, parents, blockData); - parentObj[tagType.toLowerCase()] = values || []; + parentObj[fieldName] = values || []; ArticleHelper.update(editor, article); DataListener.pushMetadata(article!.data); } diff --git a/src/panelWebView/components/Fields/WrapperField.tsx b/src/panelWebView/components/Fields/WrapperField.tsx index 48469984..728373a7 100644 --- a/src/panelWebView/components/Fields/WrapperField.tsx +++ b/src/panelWebView/components/Fields/WrapperField.tsx @@ -72,7 +72,7 @@ export const WrapperField: React.FunctionComponent = ({ let value: any = parent[field.name]; if (field.type === "tags" || field.type === "categories" || field.type === "taxonomy") { - setFieldValue(value); + setFieldValue(value || []); return; }; @@ -202,6 +202,7 @@ export const WrapperField: React.FunctionComponent = ({ } crntSelected={fieldValue as string[] || []} options={settings?.tags || []} @@ -240,6 +241,7 @@ export const WrapperField: React.FunctionComponent = ({ } crntSelected={fieldValue as string[] || []} options={settings.categories} diff --git a/src/panelWebView/components/TagPicker.tsx b/src/panelWebView/components/TagPicker.tsx index 3a3787a8..9232eeee 100644 --- a/src/panelWebView/components/TagPicker.tsx +++ b/src/panelWebView/components/TagPicker.tsx @@ -71,12 +71,14 @@ const TagPicker: React.FunctionComponent = (props: React.PropsW const sendUpdate = (values: string[]) => { if (type === TagType.tags) { MessageHelper.sendMessage(CommandToCode.updateTags, { + fieldName, values, parents, blockData }); } else if (type === TagType.categories) { MessageHelper.sendMessage(CommandToCode.updateCategories, { + fieldName, values, parents, blockData