From d66c573697c6a66919e048f0fde9cf2f8ea6acac Mon Sep 17 00:00:00 2001 From: tillschweneker Date: Fri, 21 Jan 2022 15:09:02 +0100 Subject: [PATCH] feat: add truncate filter to summary tag (#6105) Co-authored-by: Till Schweneker Co-authored-by: kodiakhq[bot] <49736102+kodiakhq[bot]@users.noreply.github.com> --- .../src/__tests__/stringTemplate.spec.js | 29 +++++++++++++++++-- .../src/stringTemplate.ts | 16 ++++++++-- website/content/docs/beta-features.md | 5 ++-- 3 files changed, 43 insertions(+), 7 deletions(-) diff --git a/packages/netlify-cms-lib-widgets/src/__tests__/stringTemplate.spec.js b/packages/netlify-cms-lib-widgets/src/__tests__/stringTemplate.spec.js index 3a62a341..fd164144 100644 --- a/packages/netlify-cms-lib-widgets/src/__tests__/stringTemplate.spec.js +++ b/packages/netlify-cms-lib-widgets/src/__tests__/stringTemplate.spec.js @@ -1,12 +1,13 @@ import { fromJS } from 'immutable'; import { - keyToPathArray, compileStringTemplate, - parseDateFromEntry, - extractTemplateVars, expandPath, + extractTemplateVars, + keyToPathArray, + parseDateFromEntry, } from '../stringTemplate'; + describe('stringTemplate', () => { describe('keyToPathArray', () => { it('should return array of length 1 with simple path', () => { @@ -152,6 +153,28 @@ describe('stringTemplate', () => { ), ).toBe('BACKENDSLUG-star️-open️'); }); + + it('return apply filter for truncate', () => { + expect( + compileStringTemplate( + '{{slug | truncate(6)}}', + date, + 'backendSlug', + fromJS({ slug: 'entrySlug', starred: true, done: false }), + ), + ).toBe('backen...'); + }); + + it('return apply filter for truncate', () => { + expect( + compileStringTemplate( + "{{slug | truncate(3,'***')}}", + date, + 'backendSlug', + fromJS({ slug: 'entrySlug', starred: true, done: false }), + ), + ).toBe('bac***'); + }); }); describe('expandPath', () => { diff --git a/packages/netlify-cms-lib-widgets/src/stringTemplate.ts b/packages/netlify-cms-lib-widgets/src/stringTemplate.ts index 7773316d..1b08e202 100644 --- a/packages/netlify-cms-lib-widgets/src/stringTemplate.ts +++ b/packages/netlify-cms-lib-widgets/src/stringTemplate.ts @@ -1,7 +1,7 @@ -import moment from 'moment'; import { Map } from 'immutable'; +import { get, trimEnd, truncate } from 'lodash'; +import moment from 'moment'; import { basename, dirname, extname } from 'path'; -import { get, trimEnd } from 'lodash'; const filters = [ { pattern: /^upper$/, transform: (str: string) => str.toUpperCase() }, @@ -21,6 +21,18 @@ const filters = [ pattern: /^ternary\('(.*)',\s*'(.*)'\)$/, transform: (str: string, match: RegExpMatchArray) => (str ? match[1] : match[2]), }, + { + pattern: /^truncate\(([0-9]+)(?:(?:,\s*['"])([^'"]*)(?:['"]))?\)$/, + transform: (str: string, match: RegExpMatchArray) => { + const omission = match[2] || '...'; + const length = parseInt(match[1]) + omission.length; + + return truncate(str, { + length, + omission, + }); + }, + }, ]; const FIELD_PREFIX = 'fields.'; diff --git a/website/content/docs/beta-features.md b/website/content/docs/beta-features.md index 58970d8e..cc7de9c4 100644 --- a/website/content/docs/beta-features.md +++ b/website/content/docs/beta-features.md @@ -556,14 +556,15 @@ collections: - name: 'posts' label: 'Posts' folder: '_posts' - summary: "{{title | upper}} - {{date | date('YYYY-MM-DD')}}" + summary: "{{title | upper}} - {{date | date('YYYY-MM-DD')}} – {{body | truncate(20, '***')}}" fields: - { label: 'Title', name: 'title', widget: 'string' } - { label: 'Publish Date', name: 'date', widget: 'datetime' } + - { label: 'Body', name: 'body', widget: 'markdown' } ``` The above config will transform the title field to uppercase and format the date field using `YYYY-MM-DD` format. -Available transformations are `upper`, `lower`, `date(''), default('defaultValue') and ternary('valueForTrue','valueForFalse')` +Available transformations are `upper`, `lower`, `date('')`, `default('defaultValue')`, `ternary('valueForTrue','valueForFalse')` and `truncate()`/`truncate(, '')` ## Registering to CMS Events