ENH Use getStatusFlags() instead of hardcoded statuses

client/src/components/LinkField/LinkField.js

@@ -434,6 +434,7 @@ const LinkField = ({
         title={linkData.title}
         description={linkData.description}
         versionState={linkData.versionState}
+        statusFlags={linkData.statusFlags}
         typeTitle={type.title || ''}
         typeIcon={type.icon}
         onDelete={handleDelete}
@@ -511,7 +512,7 @@ const LinkField = ({
       .then(async () => {
         onChange(newLinkIDs);
         actions.toasts.success(i18n._t('LinkField.SORT_SUCCESS', 'Updated link sort order'));
-        // Force a rerender so that links are retched so that versionState badges are up to date
+        // Force a rerender so that links are retched so that status flag badges are up to date
         setForceFetch(forceFetch + 1);
       })
       .catch(() => {

client/src/components/LinkPicker/LinkPicker.scss

@@ -198,9 +198,11 @@
   width: 100%;
 
   .badge {
-    color: #cf3f00;
-    background-color: #fff2ea;
     padding: 2px 3px 2px 4px;
+
+    &:not(:last-child) {
+      margin-right: 5px;
+    }
   }
 }
 

client/src/components/LinkPicker/LinkPickerTitle.js

@@ -17,27 +17,30 @@ const stopPropagation = (fn) => (e) => {
   fn && fn();
 }
 
-const getVersionedBadge = (versionState) => {
-  let title = '';
-  let label = ''
-  if (versionState === versionStates.draft) {
-    title = i18n._t('LinkField.LINK_DRAFT_TITLE', 'Link has draft changes');
-    label = i18n._t('LinkField.LINK_DRAFT_LABEL', 'Draft');
-  } else if (versionState === versionStates.modified) {
-    title = i18n._t('LinkField.LINK_MODIFIED_TITLE', 'Link has unpublished changes');
-    label = i18n._t('LinkField.LINK_MODIFIED_LABEL', 'Modified');
-  } else {
+const renderStatusFlagBadges = (statusFlags) => {
+  if (!statusFlags) {
     return null;
   }
-  const className = classnames('badge', `status-${versionState}`);
-  return <span className={className} title={title}>{label}</span>;
+  const badges = [];
+  for (let [cssClasses, data] of Object.entries(statusFlags)) {
+    cssClasses = `badge status-${cssClasses}`;
+    if (typeof data === 'string') {
+      data = {text: data};
+    }
+    if (!data.title) {
+      data.title = '';
+    }
+    badges.push(<span key={cssClasses} className={cssClasses} title={data.title}>{data.text}</span>);
+  }
+  return badges;
 };
 
 const LinkPickerTitle = ({
   id,
   title,
   description,
   versionState,
+  statusFlags,
   typeTitle,
   typeIcon,
   onDelete,
@@ -132,7 +135,7 @@ const LinkPickerTitle = ({
       <div className="link-picker__link-detail">
         <div className="link-picker__title">
           <span className="link-picker__title-text">{title}</span>
-          {getVersionedBadge(versionState)}
+          {renderStatusFlagBadges(statusFlags)}
         </div>
         {typeTitle && (
           <small className="link-picker__type">
@@ -175,6 +178,7 @@ LinkPickerTitle.propTypes = {
   title: PropTypes.string,
   description: PropTypes.string,
   versionState: PropTypes.oneOf(Object.values(versionStates)),
+  statusFlags: PropTypes.object,
   typeTitle: PropTypes.string.isRequired,
   typeIcon: PropTypes.string.isRequired,
   onDelete: PropTypes.func.isRequired,

client/src/components/LinkPicker/tests/LinkPickerTitle-test.js

@@ -13,6 +13,7 @@ function makeProps(obj = {}) {
     title: 'My title',
     description: 'My description',
     versionState: 'draft',
+    statusFlags: { draft: 'Draft' },
     typeTitle: 'Phone',
     typeIcon: 'font-icon-phone',
     canDelete: true,

src/Models/Link.php

@@ -238,6 +238,7 @@ public function getData(): array
             'description' => $this->getDescription(),
             'canDelete' => $this->canDelete(),
             'versionState' => $this->getVersionedState(),
+            'statusFlags' => $this->getStatusFlags(),
             'typeKey' => $typeKey,
             'sort' => $this->Sort,
         ];
@@ -253,7 +254,7 @@ public function forTemplate(): string
     {
         // First look for a subclass of the email template e.g. EmailLink.ss which may be defined
         // in a project. Fallback to using the generic Link.ss template which this module provides
-        return $this->renderWith([static::class, Link::class]);
+        return (string) $this->renderWith([static::class, Link::class]);
     }
 
     /**

tests/php/Controllers/LinkFieldControllerTest.php

@@ -499,6 +499,12 @@ public static function provideLinkData(): array
                     'versionState' => 'draft',
                     'typeKey' => 'testphone',
                     'sort' => 1,
+                    'statusFlags' => [
+                        'addedtodraft' => [
+                            'text' => 'Draft',
+                            'title' => 'Item has not been published yet',
+                        ],
+                    ],
                 ],
             ],
             'Reject invalid ID' => [