feat(index-file): add index file config options

Author: demshy

packages/decap-cms-core/index.d.ts

@@ -323,7 +323,6 @@ declare module 'decap-cms-core' {
 
     frontmatter_delimiter?: string[] | string;
     fields?: CmsField[];
-    index_fields?: CmsField[];
     filter?: { field: string; value: any };
     path?: string;
     media_folder?: string;
@@ -332,6 +331,11 @@ declare module 'decap-cms-core' {
     view_filters?: ViewFilter[];
     view_groups?: ViewGroup[];
     i18n?: boolean | CmsI18nConfig;
+    index_file?: {
+      pattern: string;
+      fields?: CmsField[];
+      label?: string;
+    };
 
     /**
      * @deprecated Use sortable_fields instead

packages/decap-cms-core/src/components/Collection/Entries/EntryCard.js

@@ -54,6 +54,14 @@ const CollectionLabel = styled.h2`
   text-transform: uppercase;
 `;
 
+const IndexFileLabel = styled.span`
+  font-size: 12px;
+  font-weight: 600;
+  color: ${colors.textLead};
+  text-transform: uppercase;
+  margin-right: 6px;
+`;
+
 const ListCardTitle = styled.h2`
   margin-bottom: 0;
 `;
@@ -95,6 +103,7 @@ function EntryCard({
   image,
   imageField,
   collectionLabel,
+  indexFileLabel,
   viewStyle = VIEW_STYLE_LIST,
   getAsset,
 }) {
@@ -103,7 +112,10 @@ function EntryCard({
       <ListCard>
         <ListCardLink to={path}>
           {collectionLabel ? <CollectionLabel>{collectionLabel}</CollectionLabel> : null}
-          <ListCardTitle>{summary}</ListCardTitle>
+          <ListCardTitle>
+            {indexFileLabel && <IndexFileLabel>{indexFileLabel}</IndexFileLabel>}
+            {summary}
+          </ListCardTitle>
         </ListCardLink>
       </ListCard>
     );
@@ -115,7 +127,10 @@ function EntryCard({
         <GridCardLink to={path}>
           <CardBody hasImage={image}>
             {collectionLabel ? <CollectionLabel>{collectionLabel}</CollectionLabel> : null}
-            <CardHeading>{summary}</CardHeading>
+            <CardHeading>
+              {indexFileLabel && <IndexFileLabel>{indexFileLabel}</IndexFileLabel>}
+              {summary}
+            </CardHeading>
           </CardBody>
           {image ? <CardImage src={getAsset(image, imageField).toString()} /> : null}
         </GridCardLink>
@@ -136,6 +151,9 @@ function mapStateToProps(state, ownProps) {
 
   const isLoadingAsset = selectIsLoadingAsset(state.medias);
 
+  const indexFileConfig = collection.get('index_file');
+  const fileSlug = entry.get('slug')?.split('/').pop();
+
   return {
     summary,
     path: `/collections/${collection.get('name')}/entries/${entry.get('slug')}`,
@@ -144,6 +162,8 @@ function mapStateToProps(state, ownProps) {
       .get('fields')
       ?.find(f => f.get('name') === inferredFields.imageField && f.get('widget') === 'image'),
     isLoadingAsset,
+    indexFileLabel:
+      new RegExp(indexFileConfig.get('pattern')).test(fileSlug) && indexFileConfig.get('label'),
   };
 }
 

packages/decap-cms-core/src/constants/configSchema.js

@@ -242,7 +242,6 @@ function getConfigSchema() {
               },
             },
             fields: fieldsConfig(),
-            index_fields: fieldsConfig(),
             sortable_fields: {
               type: 'array',
               items: {
@@ -282,6 +281,14 @@ function getConfigSchema() {
               minProperties: 1,
             },
             i18n: i18nCollection,
+            index_file: {
+              type: 'object',
+              properties: {
+                pattern: { type: 'string' },
+                fields: fieldsConfig(),
+                label: { type: 'string' },
+              },
+            },
           },
           required: ['name', 'label'],
           oneOf: [{ required: ['files'] }, { required: ['folder', 'fields'] }],

packages/decap-cms-core/src/reducers/collections.ts

@@ -43,11 +43,9 @@ function collections(state = defaultState, action: ConfigAction) {
   }
 }
 
-function isIndexFile(filePath: string) {
+function isIndexFile(filePath: string, pattern: string) {
   const fileSlug = filePath?.split('/').pop();
-  const indexFiles = Set(['_index', 'index']);
-
-  return fileSlug && indexFiles.has(fileSlug);
+  return fileSlug && new RegExp(pattern).test(fileSlug);
 }
 
 const selectors = {
@@ -63,9 +61,15 @@ const selectors = {
       return ext.replace(/^\./, '');
     },
     fields(collection: Collection, slug: string) {
-      if (collection.get('index_fields') && isIndexFile(slug)) {
-        return collection.get('index_fields');
+      const indexFileConfig = collection.get('index_file');
+      if (
+        indexFileConfig &&
+        isIndexFile(slug, indexFileConfig.get('pattern')) &&
+        indexFileConfig.has('fields')
+      ) {
+        return indexFileConfig.get('fields');
       }
+
       return collection.get('fields');
     },
     entryPath(collection: Collection, slug: string) {

packages/decap-cms-core/src/types/redux.ts

@@ -600,14 +600,19 @@ type i18n = StaticallyTypedRecord<{
   default_locale: string;
 }>;
 
+type IndexFile = StaticallyTypedRecord<{
+  pattern: string;
+  fields?: EntryFields;
+  label?: string;
+}>;
+
 export type Format = keyof typeof formatExtensions | string;
 
 type CollectionObject = {
   name: string;
   folder?: string;
   files?: CollectionFiles;
   fields: EntryFields;
-  index_fields?: EntryFields;
   isFetching: boolean;
   media_folder?: string;
   public_folder?: string;
@@ -632,6 +637,7 @@ type CollectionObject = {
   nested?: Nested;
   meta?: Meta;
   i18n: i18n;
+  index_file?: IndexFile;
 };
 
 export type Collection = StaticallyTypedRecord<CollectionObject>;