From 9ddaedaaf27bbfc41af9f74b32d6d0ee883815ce Mon Sep 17 00:00:00 2001 From: Elio Struyf Date: Wed, 15 Nov 2023 15:09:42 +0100 Subject: [PATCH] #710 - Remove the fields from FM when the when clause is not met --- CHANGELOG.md | 1 + src/helpers/ContentType.ts | 2 +- src/listeners/panel/DataListener.ts | 25 ++++++++++++++++++- .../components/Fields/WrapperField.tsx | 6 +++-- src/panelWebView/components/Metadata.tsx | 1 + src/utils/fieldWhenClause.ts | 10 +++++++- 6 files changed, 40 insertions(+), 5 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 0aba8048..334479e2 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -15,6 +15,7 @@ - [#700](https://github.com/estruyf/vscode-front-matter/issues/700): Added the `{{pathToken.relPath}}` placeholder for the `previewPath` property - [#706](https://github.com/estruyf/vscode-front-matter/issues/706): Show the error of scripts failing in the Front Matter output panel - [#709](https://github.com/estruyf/vscode-front-matter/issues/709): Take "where clause" into account on content creation +- [#710](https://github.com/estruyf/vscode-front-matter/issues/710): Hide child field when parent field its "when clause" is not met, also remove the fields from the content ### ⚡️ Optimizations diff --git a/src/helpers/ContentType.ts b/src/helpers/ContentType.ts index 53fa7d1f..81581822 100644 --- a/src/helpers/ContentType.ts +++ b/src/helpers/ContentType.ts @@ -918,7 +918,7 @@ export class ContentType { const dateFormat = Settings.get(SETTING_DATE_FORMAT) as string; for (const field of obj.fields) { - if (!fieldWhenClause(field, data)) { + if (!fieldWhenClause(field, data, obj.fields)) { Logger.info(`Field ${field.name} not added because of when clause`); continue; } diff --git a/src/listeners/panel/DataListener.ts b/src/listeners/panel/DataListener.ts index be3b90c9..88441c02 100644 --- a/src/listeners/panel/DataListener.ts +++ b/src/listeners/panel/DataListener.ts @@ -19,7 +19,7 @@ import { Article, Preview } from '../../commands'; import { ParsedFrontMatter } from '../../parsers'; import { processKnownPlaceholders } from '../../helpers/PlaceholderHelper'; import { Field, PostMessageData } from '../../models'; -import { encodeEmoji } from '../../utils'; +import { encodeEmoji, fieldWhenClause } from '../../utils'; import { PanelProvider } from '../../panelWebView/PanelProvider'; import { MessageHandlerData } from '@estruyf/vscode'; import { SponsorAi } from '../../services/SponsorAI'; @@ -348,6 +348,29 @@ export class DataListener extends BaseListener { } } + // Verify if there are fields to be cleared due to the when clause + const allFieldNames = Object.keys(parentObj); + let ctFields = contentType.fields; + if (parents && parents.length > 0) { + for (const parent of parents) { + const crntField = ctFields.find((f) => f.name === parent); + if (crntField) { + ctFields = crntField.fields || []; + } + } + } + if (ctFields && ctFields.length > 0) { + for (const field of allFieldNames) { + const crntField = ctFields.find((f) => f.name === field); + if (crntField && crntField.when) { + const renderField = fieldWhenClause(crntField, parentObj, ctFields); + if (!renderField) { + delete parentObj[field]; + } + } + } + } + // Clear the field if it is empty if ( value === undefined || diff --git a/src/panelWebView/components/Fields/WrapperField.tsx b/src/panelWebView/components/Fields/WrapperField.tsx index b059a2ae..dcff0466 100644 --- a/src/panelWebView/components/Fields/WrapperField.tsx +++ b/src/panelWebView/components/Fields/WrapperField.tsx @@ -2,7 +2,7 @@ import { Messenger } from '@estruyf/vscode/dist/client'; import * as React from 'react'; import { useCallback, useEffect, useState } from 'react'; import { DateHelper } from '../../../helpers/DateHelper'; -import { BlockFieldData, CustomPanelViewResult, Field, PanelSettings, WhenOperator } from '../../../models'; +import { BlockFieldData, CustomPanelViewResult, Field, PanelSettings } from '../../../models'; import { Command } from '../../Command'; import { CommandToCode } from '../../CommandToCode'; import { TagType } from '../../TagType'; @@ -36,6 +36,7 @@ import { LocalizationKey } from '../../../localization'; export interface IWrapperFieldProps { field: Field; + allFields: Field[]; parent: IMetadata; parentFields: string[]; metadata: IMetadata; @@ -57,6 +58,7 @@ export interface IWrapperFieldProps { export const WrapperField: React.FunctionComponent = ({ field, + allFields, parent, parentFields, metadata, @@ -158,7 +160,7 @@ export const WrapperField: React.FunctionComponent = ({ // Conditional fields if (typeof field.when !== 'undefined') { - const shouldRender = fieldWhenClause(field, parent); + const shouldRender = fieldWhenClause(field, parent, allFields); if (!shouldRender) { return null; diff --git a/src/panelWebView/components/Metadata.tsx b/src/panelWebView/components/Metadata.tsx index 0951cff7..e9d02276 100644 --- a/src/panelWebView/components/Metadata.tsx +++ b/src/panelWebView/components/Metadata.tsx @@ -74,6 +74,7 @@ const Metadata: React.FunctionComponent = ({ { +export const fieldWhenClause = (field: Field, parent: IMetadata, allFields?: Field[]): boolean => { const when = field.when; if (!when) { return true; } + let parentField = allFields?.find((f) => f.name === when.fieldRef); + if (parentField && parentField.when) { + const renderParent = fieldWhenClause(parentField, parent, allFields); + if (!renderParent) { + return false; + } + } + let whenValue = parent[when.fieldRef]; if (when.caseSensitive || typeof when.caseSensitive === 'undefined') { return caseSensitive(when, field, whenValue);