Add MVEA vue.js components to Person edit page (CFM-205) (#80)

* Addition of Person Overview/Canvas. Commit also includes reworking of subnavigation for a Person view, VueJS starter components, updates for AJAX API access, and a minor fix to textarea rendering. (CFM-205)

* Revert changes to edit() and view() function signatures. (CFM-205)

* Fix "Using $this when not in object context" error in StringUtilities.php (NOJIRA)

* Post rebase cleanup; pass flash messages to subnavigation

* Output all available mvea text in Vue.js components (CFM-205)

* Allow User with Session to by pass basic auth when making ajax requests (#69)

* Rebasing against develop (#71)

* Fix "Using $this when not in object context" error in StringUtilities.php (NOJIRA) (#67)

* Addition of Person Overview/Canvas. Commit also includes reworking of subnavigation for a Person view, VueJS starter components, updates for AJAX API access, and a minor fix to textarea rendering. (CFM-205)

* Revert changes to edit() and view() function signatures. (CFM-205)

* Post rebase cleanup; pass flash messages to subnavigation

* Output all available mvea text in Vue.js components (CFM-205)

* Allow User with Session to by pass basic auth when making ajax requests (#69)

* CO-205_Create_langauge_labels_via_javascript_for_items_with_a_lang_string_definition (#72)

* Create language labels using standard BC-47 abbreviation codes
* Move language label after type

* Fetch MVEA types as part of the REST API responses

* Request extended REST API data

* Construct names in Vue.js component (display, rtl, ltr); hide comment out non-javascript approach on Person canvas. (CFM-205) (#75)

* Initial implementation for loading animation and skeleton placeholders for components on Person canvas. (CFM-205) (#76)

* Rebasing against current develop (#77)

* Fix "Using $this when not in object context" error in StringUtilities.php (NOJIRA) (#67)

* Addition of Person Overview/Canvas. Commit also includes reworking of subnavigation for a Person view, VueJS starter components, updates for AJAX API access, and a minor fix to textarea rendering. (CFM-205)

* Revert changes to edit() and view() function signatures. (CFM-205)

* Post rebase cleanup; pass flash messages to subnavigation

* Output all available mvea text in Vue.js components (CFM-205)

* Allow User with Session to by pass basic auth when making ajax requests (#69)

* Rebasing against develop (#71)

* Fix "Using $this when not in object context" error in StringUtilities.php (NOJIRA) (#67)

* Addition of Person Overview/Canvas. Commit also includes reworking of subnavigation for a Person view, VueJS starter components, updates for AJAX API access, and a minor fix to textarea rendering. (CFM-205)

* Revert changes to edit() and view() function signatures. (CFM-205)

* Post rebase cleanup; pass flash messages to subnavigation

* Output all available mvea text in Vue.js components (CFM-205)

* Allow User with Session to by pass basic auth when making ajax requests (#69)

* CO-205_Create_langauge_labels_via_javascript_for_items_with_a_lang_string_definition (#72)

* Create language labels using standard BC-47 abbreviation codes
* Move language label after type

* Fetch MVEA types as part of the REST API responses

* Request extended REST API data

* Construct names in Vue.js component (display, rtl, ltr); hide comment out non-javascript approach on Person canvas. (CFM-205) (#75)

* Initial implementation for loading animation and skeleton placeholders for components on Person canvas. (CFM-205) (#76)

* Person_canvas_improvements (#78)

* Dynamically calculate mvea Model name

* Localizations load from CAKEPHP helper

* Update access to txt lexicals

* Update Person edit page to hold the person "canvas". Remove the /canvas action from the People controller. (CFM-205) (#79)

This PR special-cases the Person /edit page to contain vue.js components.

app/resources/locales/en_US/field.po

@@ -29,8 +29,8 @@
 # When adding entries to this file, group non-model specific translations at the top,
 # then model specific translations alphabetically by model.
 
-msgid "action"
-msgstr "Action"
+msgid "actions"
+msgstr "{0,plural,=1{Action} other{Actions}}"
 
 msgid "actor"
 msgstr "Actor"
@@ -159,6 +159,9 @@ msgstr "Plugin"
 msgid "postal_code"
 msgstr "Postal Code"
 
+msgid "primary"
+msgstr "Primary"
+
 msgid "primary_name"
 msgstr "Primary Name"
 
@@ -243,6 +246,9 @@ msgstr "Value"
 msgid "verified"
 msgstr "Verified"
 
+msgid "unverified"
+msgstr "Unverified"
+
 msgid "ApiUsers.privileged.desc"
 msgstr "A privileged API user has full access to the CO. Unprivileged API users may be granted specific permissions where supported."
 

app/resources/locales/en_US/information.po

@@ -56,3 +56,9 @@ msgstr "There are no records to display."
 
 msgid "global.title.none"
 msgstr "No title"
+
+msgid "global.value.none"
+msgstr "No value"
+
+msgid "global.visit.link"
+msgstr "Visit link"

app/resources/locales/en_US/operation.po

@@ -27,6 +27,9 @@
 msgid "activate"
 msgstr "Activate"
 
+msgid "add"
+msgstr "Add"
+
 msgid "add.a"
 msgstr "Add a New {0}"
 

app/src/Controller/ApiV2Controller.php

@@ -280,7 +280,20 @@ public function index() {
     if(!empty($link->attr) && !empty($link->value)) {
       $query = $query->where([$this->$modelsName->getAlias().'.'.$link->attr => $link->value]);
     }
-
+
+    // This will produce a nested object which is very useful for vue integration
+    if($this->request->getQuery('extended') !== null) {
+      $modelContain = [];
+      $associations = $this->$modelsName->associations();
+      foreach($associations->getByType(['BelongsTo']) as $a) {
+        $modelContain[] = $a->getClassName();
+      }
+
+      if(!empty($modelContain)) {
+        $query = $query->contain($modelContain);
+      }
+    }
+
     if($modelsName == 'AuthenticationEvents') {
       // Special case for filtering on authenticated identifier. There is a
       // similar filter in AuthenticationEventsController::beforeFilter.

app/src/Controller/Component/RegistryAuthComponent.php

@@ -129,8 +129,19 @@ public function beforeFilter(EventInterface $event) {
     }
 
     // Perform authorization check
-
-    if($this->getConfig('apiUser')) {
+
+    // Do we have an authenticated user session?
+
+    // Note we don't stuff anything into the session anymore, the only attribute
+    // is the username, which is actually loaded by login.php.
+
+    $auth = $session->read('Auth');
+
+    // Registry UI is now a hybrid implementation of VUE and CAKEPHP MVC.
+    // In order to allow a logged-in user to reach out to the backend without
+    // the need of an API User, but just with the use of the Session, we will
+    // skip the API user authorization if a user Session is available.
+    if(empty($auth) && $this->getConfig('apiUser')) {
       // There are no unauthenticated API calls, so always require a valid user
 
       try {
@@ -177,16 +188,9 @@ public function beforeFilter(EventInterface $event) {
       if($controller->getName() == 'Pages') {
         return true;
       }
-
-      // Do we have an authenticated user session?
-      
-      // Note we don't stuff anything into the session anymore, the only attribute
-      // is the username, which is actually loaded by login.php.
-
-      $auth = $session->read('Auth');
-
+
       if(!empty($auth['external']['user'])) {
-        // We have a valid user name that is *authenticated* for the current request.
+        // We have a valid username that is *authenticated* for the current request.
         // Note we haven't checked authorization, but this is how the authorization
         // checks can get the authenticated username.
         $controller->set('vv_user', ['username' => $auth['external']['user']]);

app/src/Controller/StandardController.php

@@ -331,8 +331,9 @@ public function edit(string $id) {
     }
     catch(\Exception $e) {
       // findById throws Cake\Datasource\Exception\RecordNotFoundException
-
       $this->Flash->error($e->getMessage());
+      // XXX This redirects to an Exception page because $id is not found.
+      // XXX A 404 with error would be better.
       return $this->generateRedirect((int)$id);
     }
 
@@ -724,8 +725,9 @@ public function view($id = null) {
     }
     catch(\Exception $e) {
       // findById throws Cake\Datasource\Exception\RecordNotFoundException
-
       $this->Flash->error($e->getMessage());
+      // XXX This redirects to an Exception page because $id is not found.
+      // XXX A 404 with error would be better.
       return $this->generateRedirect((int)$id);
     }
 
@@ -742,6 +744,9 @@ public function view($id = null) {
       // We don't use a trait for this since each table will implement different logic
 
       $this->set('vv_title', __d('operation', 'view.ai', $table->generateDisplayField($obj)));
+      $this->set('vv_supertitle', $table->generateDisplayField($obj));
+      // Pass the display field also into subtitle for dealing with External IDs
+      $this->set('vv_subtitle', $table->generateDisplayField($obj));
     } else {
       // Default view title is the object display field
       $field = $table->getDisplayField();

app/src/Lib/Traits/PrimaryLinkTrait.php

@@ -46,7 +46,7 @@ trait PrimaryLinkTrait {
   private $unkeyedActions = ['add', 'index'];
 
   // Actions where the primary link can be obtained by looking up the record ID
-  private $lookupActions = ['delete', 'edit', 'view'];
+  private $lookupActions = ['delete', 'edit', 'canvas', 'view'];
 
   // Where to redirect on add or edit, can be 'self', 'index', or 'primaryLink'
   private $redirectGoal = 'index';

app/src/Model/Table/PeopleTable.php

@@ -150,6 +150,7 @@ public function initialize(array $config): void {
       'entity' => [
         'delete' =>   ['platformAdmin', 'coAdmin'],
         'edit' =>     ['platformAdmin', 'coAdmin'],
+        'canvas' =>   ['platformAdmin', 'coAdmin'],
         'view' =>     ['platformAdmin', 'coAdmin']
       ],
       // Actions that operate over a table (ie: do not require an $id)

app/src/View/Helper/VueHelper.php

@@ -0,0 +1,74 @@
+<?php
+/**
+ * COmanage Registry Vue Helper
+ *
+ * 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)
+ */
+
+declare(strict_types = 1);
+
+namespace App\View\Helper;
+
+use Cake\I18n\FrozenTime;
+use Cake\Utility\Inflector;
+use Cake\View\Helper;
+use Cake\I18n\I18n;
+
+class VueHelper extends Helper {
+  private array $locales_list = [
+    'field' => [
+      'login',
+      'primary',
+      'datepicker.hour',
+      'unverified'
+    ],
+    'information' => [
+      'global.value.none',
+      'datepicker.hour'
+    ]
+  ];
+
+  /**
+   * Helper which will produce an array of configured locales
+   *
+   * @param   string  $lang  The language of the locale
+   *
+   * @return array []
+   * @since  COmanage Registry v5.0.0
+   */
+
+  public function locales(string $lang = 'en_US'): array {
+
+    I18n::setLocale($lang);
+
+    $locales = [];
+    foreach ($this->locales_list as $domain => $key_list) {
+      foreach ($key_list as $key) {
+        $locales[$key] = __d($domain, $key);
+      }
+    }
+
+    return $locales;
+  }
+
+}

app/templates/AdHocAttributes/columns.inc

@@ -41,6 +41,6 @@ $bulkActions = [
 
 $subnav = [
   'name' => 'person',
-  'active' => 'attributes',
+  'active' => 'person',
   'subActive' => 'ad_hoc_attributes'
 ];

app/templates/AdHocAttributes/fields-nav.inc

@@ -30,6 +30,6 @@ $topLinks = [];
 
 $subnav = [
   'name' => 'person',
-  'active' => 'attributes',
+  'active' => 'person',
   'subActive' => 'ad_hoc_attributes'
 ];

app/templates/Addresses/columns.inc

@@ -45,6 +45,6 @@ $bulkActions = [
 
 $subnav = [
   'name' => 'person',
-  'active' => 'attributes',
+  'active' => 'person',
   'subActive' => 'addresses'
 ];

app/templates/Addresses/fields-nav.inc

@@ -30,6 +30,6 @@ $topLinks = [];
 
 $subnav = [
   'name' => 'person',
-  'active' => 'attributes',
+  'active' => 'person',
   'subActive' => 'addresses'
 ];

app/templates/EmailAddresses/columns.inc

@@ -41,6 +41,6 @@ $bulkActions = [
 
 $subnav = [
   'name' => 'person',
-  'active' => 'attributes',
+  'active' => 'person',
   'subActive' => 'email_addresses'
 ];

app/templates/EmailAddresses/fields-nav.inc

@@ -30,6 +30,6 @@ $topLinks = [];
 
 $subnav = [
   'name' => 'person',
-  'active' => 'attributes', // default for person. 'external identities' are special cased
+  'active' => 'person', // default for person. 'external identities' are special cased
   'subActive' => 'email_addresses'
 ];

app/templates/Identifiers/columns.inc

@@ -56,6 +56,6 @@ $bulkActions = [
 
 $subnav = [
   'name' => 'person',
-  'active' => 'attributes',
+  'active' => 'person',
   'subActive' => 'identifiers'
 ];

app/templates/Identifiers/fields-nav.inc

@@ -30,6 +30,6 @@ $topLinks = [];
 
 $subnav = [
   'name' => 'person',
-  'active' => 'attributes',
+  'active' => 'person',
   'subActive' => 'identifiers'
 ];

app/templates/Names/columns.inc

@@ -58,6 +58,6 @@ $bulkActions = [
 
 $subnav = [
   'name' => 'person',
-  'active' => 'attributes',
+  'active' => 'person',
   'subActive' => 'names'
 ];

app/templates/Names/fields-nav.inc

@@ -30,6 +30,6 @@ $topLinks = [];
 
 $subnav = [
   'name' => 'person',
-  'active' => 'attributes',
+  'active' => 'person',
   'subActive' => 'names'
 ];