From c2529e14598d881745b5ce0b5400b6d762fbf135 Mon Sep 17 00:00:00 2001 From: Arlen Johnson Date: Wed, 12 Nov 2025 05:57:48 -0500 Subject: [PATCH] Changelog and entity-metadata layout (CFM-476) (#349) * Changelog and entity-metadata layout (CFM-476) * Entity-metadata element version change (CFM-476) * Ensure consistent naming conventions for "changelog" (CFM-476) --- app/resources/locales/en_US/field.po | 9 + app/resources/locales/en_US/information.po | 11 +- app/resources/locales/en_US/operation.po | 5 +- app/src/Lib/Enum/ApplicationStateEnum.php | 5 +- app/templates/Standard/add-edit-view.php | 33 ++- app/templates/element/changelog.php | 233 ++++++++++-------- app/templates/element/entityMetadata.php | 45 ++++ app/templates/element/form/entityID.php | 37 --- .../element/form/infoDiv/groupMember.php | 2 +- app/templates/element/form/unorderedList.php | 2 - app/templates/element/javascript.php | 22 ++ app/webroot/css/co-base.css | 39 ++- app/webroot/css/co-responsive.css | 21 ++ 13 files changed, 299 insertions(+), 165 deletions(-) create mode 100644 app/templates/element/entityMetadata.php delete mode 100644 app/templates/element/form/entityID.php diff --git a/app/resources/locales/en_US/field.po b/app/resources/locales/en_US/field.po index e67622d8f..6c8e2178c 100644 --- a/app/resources/locales/en_US/field.po +++ b/app/resources/locales/en_US/field.po @@ -89,6 +89,9 @@ msgstr "Country Code" msgid "created" msgstr "Created" +msgid "created.value" +msgstr "Created: {0}" + msgid "cri" msgstr "Change Request Identifier" @@ -155,6 +158,9 @@ msgstr "Frozen" msgid "id" msgstr "ID" +msgid "id.value" +msgstr "ID: {0}" + msgid "item" msgstr "Item" @@ -221,6 +227,9 @@ msgstr "Modifiable" msgid "modified" msgstr "Modified" +msgid "modified.value" +msgstr "Modified: {0}" + msgid "name" msgstr "Name" diff --git a/app/resources/locales/en_US/information.po b/app/resources/locales/en_US/information.po index 9fdfece85..9d2120a65 100644 --- a/app/resources/locales/en_US/information.po +++ b/app/resources/locales/en_US/information.po @@ -31,11 +31,17 @@ msgid "api.key" msgstr "This newly generated API Key cannot be recovered. If it is lost a new key must be generated." msgid "changelog" -msgstr "Change Log" +msgstr "Changelog" msgid "changelog.archived" msgstr "This is an archive record" +msgid "changelog.aria.collapsed" +msgstr "Changelog, collapsed, button, click to expand" + +msgid "changelog.aria.expanded" +msgstr "Changelog, expanded, button, click to collapse" + msgid "changelog.deleted" msgstr "This record has been deleted" @@ -51,9 +57,6 @@ msgstr "Platform-wide configurations are available in the configurations." -msgid "entity.id" -msgstr "ID: {0}" - msgid "noattrs" msgstr "No attributes" diff --git a/app/resources/locales/en_US/operation.po b/app/resources/locales/en_US/operation.po index bfd24d042..cbcf54286 100644 --- a/app/resources/locales/en_US/operation.po +++ b/app/resources/locales/en_US/operation.po @@ -124,7 +124,10 @@ msgid "cancel" msgstr "Cancel" msgid "changelog.view" -msgstr "View Change Log" +msgstr "View Changelog" + +msgid "changelog.return" +msgstr "Return to active record" msgid "clear" msgstr "Clear" diff --git a/app/src/Lib/Enum/ApplicationStateEnum.php b/app/src/Lib/Enum/ApplicationStateEnum.php index 767389b97..c17244b65 100644 --- a/app/src/Lib/Enum/ApplicationStateEnum.php +++ b/app/src/Lib/Enum/ApplicationStateEnum.php @@ -30,10 +30,11 @@ namespace App\Lib\Enum; class ApplicationStateEnum extends StandardEnum { - const UiDrawerState = 'UD'; - const SearchBlockOptions = 'SO'; + const ChangeLogState = 'CL'; const PaginationLimit = 'PL'; const ProfileDarkMode = 'PM'; const ProfileDensity = 'PD'; + const SearchBlockOptions = 'SO'; const VerifyEmailBlocked = 'VE'; + const UiDrawerState = 'UD'; } \ No newline at end of file diff --git a/app/templates/Standard/add-edit-view.php b/app/templates/Standard/add-edit-view.php index 1e2a8dbad..ed494d240 100644 --- a/app/templates/Standard/add-edit-view.php +++ b/app/templates/Standard/add-edit-view.php @@ -91,16 +91,6 @@

- changelogAttributeName(); - - if($vv_obj->deleted) { - print __d('information', 'changelog.deleted'); - } elseif(!empty($vv_obj->$clfield)) { - print __d('information', 'changelog.archived'); - } - ?> element('flash') ?> +changelogAttributeName(); + + if($vv_obj->deleted) { + print $this->element('notify/alert', + ['type' => 'information', + 'message' => __d('information', 'changelog.deleted'), + 'dismissible ' => false] + ); + } elseif(!empty($vv_obj->$clfield)) { + print $this->element('notify/alert', + ['type' => 'information', + 'message' => __d('information', 'changelog.archived'), + 'dismissible ' => false] + ); + } +?> + element('entityMetadata'); print $this->element('changelog'); } \ No newline at end of file diff --git a/app/templates/element/changelog.php b/app/templates/element/changelog.php index 63987cede..0adf91c09 100644 --- a/app/templates/element/changelog.php +++ b/app/templates/element/changelog.php @@ -1,108 +1,141 @@ changelogAttributeName(); + $parentUrl = null; -// If this is an archived record, include a link to the parent (active) record -$clAttr = $vv_obj->changelogAttributeName(); -$parentLink = null; + if(!empty($vv_obj->$clAttr)) { + $parentUrl = $this->Url->build( + ['action' => 'edit', $vv_obj->$clAttr] + ); + } -if(!empty($vv_obj->$clAttr)) { - $parentLink = $this->Html->link( - $vv_obj->$clAttr, - ['action' => 'edit', $vv_obj->$clAttr] - ); -} + // Get the changelog open/closed state + $changeLogState = $this->ApplicationState->getValue(ApplicationStateEnum::ChangeLogState, ''); + $changeLogStateId = $this->ApplicationState->getId(ApplicationStateEnum::ChangeLogState); -// We'll render an index of all archived records if we are the current active record, -// or just the current metadata if we are an archived record + // We'll render an index of all archive records if we are the current active record, + // or just the current metadata if we are an archive record ?> - - - -
- - - - - - - - - - - - - - - - - - - - - - -
id - ?>revision ?>modified ?>actor_identifier ?>
Html->link( - $archive->id, - ['action' => 'view', $archive->id] - ) - ?>revision ?>modified ?>actor_identifier ?>
-
- -
- - - - - - - - - - - - - - - - - - - - - -
deleted ? '1' : '0')) ?>
revision; ?>
modified ?>
actor_identifier ?>
+
+
+

+ +

+
+
+ $clAttr && !empty($vv_archives))): // $vv_obj is an active record ?> + + + + + + + + + + + + + + + + + + + + + + +
id + ?>revision ?>modified ?>actor_identifier ?>
Html->link( + $archive->id, + ['action' => 'view', $archive->id] + ) + ?>revision ?>modified ?>actor_identifier ?>
+ +
    +
  • +
    +
    deleted ? '1' : '0')) ?>
    +
    • +
  • +
    +
    revision; ?>
    +
    • +
  • +
    +
    actor_identifier ?>
    +
    • +
  • +
    +
    + $clAttr)): ?> + +
    $clAttr ?>
    +
    + +
    +     + +
    +
    • +
+ +
+
+
- \ No newline at end of file + \ No newline at end of file diff --git a/app/templates/element/entityMetadata.php b/app/templates/element/entityMetadata.php new file mode 100644 index 000000000..41865d84a --- /dev/null +++ b/app/templates/element/entityMetadata.php @@ -0,0 +1,45 @@ + + +id)): ?> +
+
+ id) ?> +
+
+ created) ?> +
+ created != $vv_obj->modified): ?> +
+ modified) ?> +
+ +
+ \ No newline at end of file diff --git a/app/templates/element/form/entityID.php b/app/templates/element/form/entityID.php deleted file mode 100644 index 9f24868e0..000000000 --- a/app/templates/element/form/entityID.php +++ /dev/null @@ -1,37 +0,0 @@ - - -id)): ?> -
  • - id) ?> -
    • - - diff --git a/app/templates/element/form/infoDiv/groupMember.php b/app/templates/element/form/infoDiv/groupMember.php index a645c65ed..2f92b4e99 100644 --- a/app/templates/element/form/infoDiv/groupMember.php +++ b/app/templates/element/form/infoDiv/groupMember.php @@ -45,7 +45,7 @@ );?> - () + () diff --git a/app/templates/element/form/unorderedList.php b/app/templates/element/form/unorderedList.php index a5ee224a3..9179f3285 100644 --- a/app/templates/element/form/unorderedList.php +++ b/app/templates/element/form/unorderedList.php @@ -48,8 +48,6 @@ // in one of several paths if we are in a plugin context. // The include files will contain the listItem elements include($vv_template_path . DS . $fieldsFile); - // Element ID - print $this->element('form/entityID'); if(!isset($suppress_submit) || !$suppress_submit) { // The Submit element will be printed only if we are adding or updating, and if not diff --git a/app/templates/element/javascript.php b/app/templates/element/javascript.php index 472b1a64b..52a17e187 100644 --- a/app/templates/element/javascript.php +++ b/app/templates/element/javascript.php @@ -365,6 +365,28 @@ }); + // CHANGELOG ACCORDION BEHAVIOR + $('#changelog-container .accordion-button').click(function(){ + const changelogAriaLabelExpanded = ''; + const changelogAriaLabelCollapsed = ''; + if (!$(this).hasClass("collapsed")) { + $(this).attr('aria-label', changelogAriaLabelExpanded); + setApplicationState( + "show", + $("#changelog-container .accordion-button"), + false + ); + } else { + $(this).attr('aria-label', changelogAriaLabelCollapsed); + setApplicationState( + "hide", + $("#changelog-container .accordion-button"), + false + ); + } + $('#changelog accordion-button').toggle(); + }); + // SETTINGS (from User Menu) // Dark Mode toggles (auto is default) $("#setting-darkmode-dark").click(function(e) { diff --git a/app/webroot/css/co-base.css b/app/webroot/css/co-base.css index 3c92d465f..fb5b4721e 100644 --- a/app/webroot/css/co-base.css +++ b/app/webroot/css/co-base.css @@ -1966,14 +1966,11 @@ li[data-pc-section="emptymessage"] { clip: rect(0, 0, 0, 0); white-space: nowrap; /* Prevent text wrapping */ } -/* ENTITY ID under each Edit/View Form/List */ -#cm-entity-id { - position: absolute; - border: none; - right: 2.5em; - padding-top: 1em; +/* ENTITY METADATA under each Edit/View Form/List */ +#entity-metadata { + text-align: right; + margin: 0 0 0.5rem; color: var(--cmg-color-txt-soft); - background-color: unset; } /* ENROLLMENT FLOWS */ .upper-buttons { @@ -2806,6 +2803,34 @@ html.density-large ul.form-list li .field { html.density-large .field-data { padding: 0.75em 1em; } +/* CHANGELOG */ +#changelog-container .accordion-button { + padding: 0.5rem 1rem; +} +#changelog-container .accordion-item { + border-radius: 0; + border: 1px solid var(--cmg-color-bg-005) +} +#changelog .accordion-body, +#changelog .accordion-body ul { + margin: 0; + padding: 0; + list-style: none; +} +#changelog .accordion-body { + overflow-x: scroll; +} +#changelog .accordion-body li { + display: grid; + grid-template-columns: 1fr 1fr; + gap: 1rem; + padding: 0.5rem 1rem; + border-top: 1px solid var(--cmg-color-bg-003); + align-items: center; +} +#changelog .accordion-body li:first-child { + border-top: none; +} /* FOOTER */ footer { text-align: center; diff --git a/app/webroot/css/co-responsive.css b/app/webroot/css/co-responsive.css index 833a57d5a..a398a7c15 100644 --- a/app/webroot/css/co-responsive.css +++ b/app/webroot/css/co-responsive.css @@ -363,6 +363,15 @@ right: 0.75em; z-index: 1; } + /* ENTITY METADATA under each Edit/View Form/List */ + #entity-metadata { + display: flex; + justify-content: flex-end; + gap: 2rem; + align-items: center; + text-align: left; + margin: 1rem 0 0.5rem; + } /* GENERAL */ .table-container { overflow: unset; @@ -572,6 +581,18 @@ .petition-attrs-subset-label { font-size: 0.8em; } + /* CHANGELOG */ + #changelog .accordion-body li { + grid-template-columns: 1fr 3fr; + } + #changelog .changelog-parent-link { + display: flex; + gap: 1rem; + align-items: center; + } + #changelog .accordion-body { + overflow-x: unset; + } /* FOOTER */ #co-footer { position: static;