From c5dcc23f00fb2f1e623494761542f44d58039e83 Mon Sep 17 00:00:00 2001
From: Arlen Johnson <arlen@sphericalcowgroup.com>
Date: Mon, 13 Feb 2023 10:05:07 -0500
Subject: [PATCH] Construct names in Vue.js component (display, rtl, ltr); hide
 comment out non-javascript approach on Person canvas. (CFM-205) (#75)

---
 app/templates/People/canvas.php               |  7 ++---
 .../js/comanage/components/mvea/mvea-item.js  | 18 ++++++++++---
 .../js/comanage/components/utils/helpers.js   | 26 +++++++++++++++++++
 3 files changed, 44 insertions(+), 7 deletions(-)

diff --git a/app/templates/People/canvas.php b/app/templates/People/canvas.php
index 2d7397b01..54b25ba3a 100644
--- a/app/templates/People/canvas.php
+++ b/app/templates/People/canvas.php
@@ -89,8 +89,8 @@
     ?>
   </div>
 
-  <!-- XXX Non-AJAX Approach: Keep the output below as a reference until the component approach above is complete. -->
-  <hr>
+  <?php /* 
+  <!-- XXX Non-AJAX Approach: Keep the output below as a reference until the component approach above is complete. --> 
   <!-- Person Attributes -->
   <div id="person-canvas-attributes" class="row row-cols-1 g-4 <?= ($widgetCount > 1) ? 'row-cols-md-2' : ''?>">
     <?php
@@ -109,7 +109,8 @@
       }
     ?>
   </div>
-  <!-- XXX End of Non-AJAX Approach: Keep the output below as a reference until the component approach above is complete. -->
+  <!-- XXX End of Non-AJAX Approach -->
+  */ ?>
   
   <!-- Person Roles -->
   <div id="person-canvas-roles" class="card">
diff --git a/app/webroot/js/comanage/components/mvea/mvea-item.js b/app/webroot/js/comanage/components/mvea/mvea-item.js
index 134060ffe..1a9802140 100644
--- a/app/webroot/js/comanage/components/mvea/mvea-item.js
+++ b/app/webroot/js/comanage/components/mvea/mvea-item.js
@@ -43,10 +43,20 @@ export default {
     <!-- Names -->
     <li class="field-data-container" v-if="this.core.mveaType == 'names'">
       <div class="field-data force-wrap">
-        <!-- XXX The following must be fixed after discussion of what we will return from the API. The output 
-             can either be properly assembled here (all name components, proper order) or the API can return 
-             a display name. The latter would be best. -->
-        <a href="#" class="nospin">{{ this.mvea.given }} {{ this.mvea.family }}</a>                                              
+        <!-- If there is a display name use it. Otherwise, check language and produce right-to-left 
+          order or left-to-right order. This approach is similar to Model/Entity/Name.php::_getFullName(). 
+          If we need this construction in other components later, move this to a helper function. -->
+        <a href="#" class="nospin">
+          <span v-if="this.mvea.display_name" class="mvea-name-displayname">
+            {{ this.mvea.display_name }}
+          </span>
+          <span v-else-if="['hu', 'ja', 'ko', 'za-Hans', 'za-Hant'].indexOf(this.mvea.language) != -1" class="mvea-name-rtl">
+            {{ this.mvea.family }} {{ this.mvea.given }}
+          </span>
+          <span v-else class="mvea-name-ltr">
+            {{ this.mvea.honorific }} {{ this.mvea.given }} {{ this.mvea.middle }} {{ this.mvea.family }} {{ this.mvea.suffix }}
+          </span>
+        </a>                                                
       </div>
       <div class="field-data data-label">
         <span v-if="this.mvea.primary_name" class="mr-1 badge bg-outline-secondary primary">{{ this.txt.primary }}</span>
diff --git a/app/webroot/js/comanage/components/utils/helpers.js b/app/webroot/js/comanage/components/utils/helpers.js
index 166cf1c1a..299cf2888 100644
--- a/app/webroot/js/comanage/components/utils/helpers.js
+++ b/app/webroot/js/comanage/components/utils/helpers.js
@@ -1,3 +1,29 @@
+/**
+ * COmanage Registry JavaScript Component Helpers
+ *
+ * Portions licensed to the University Corporation for Advanced Internet
+ * Development, Inc. ("UCAID") under one or more contributor license agreements.
+ * See the NOTICE file distributed with this work for additional information
+ * regarding copyright ownership.
+ *
+ * UCAID licenses this file to you under the Apache License, Version 2.0
+ * (the "License"); you may not use this file except in compliance with the
+ * License. You may obtain a copy of the License at:
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *
+ * @link          https://www.internet2.edu/comanage COmanage Project
+ * @package       registry
+ * @since         COmanage Registry v5.0.0
+ * @license       Apache License, Version 2.0 (http://www.apache.org/licenses/LICENSE-2.0)
+ */
+
 /**
  * Construct human-readable string from language abbreviation code
  * BC-47 language tags (https://en.wikipedia.org/wiki/IETF_language_tag)