Use qaBot in access-ci-ui

access.module

@@ -75,17 +75,27 @@ function access_page_attachments(array &$attachments) {
 
     $current_uri = \Drupal::request()->getRequestUri();
 
-    // Get current user information
+    // Get current user data for JavaScript.
     $current_user = \Drupal::currentUser();
     $user_data = [];
-
     if ($current_user->isAuthenticated()) {
-      $user = \Drupal\user\Entity\User::load($current_user->id());
-      $user_data['username'] = $current_user->getAccountName();
-      $user_data['email'] = $user->getEmail();
-      $user_data['firstName'] = $user->get('field_user_first_name')->value ?? '';
-      $user_data['lastName'] = $user->get('field_user_last_name')->value ?? '';
-      $user_data['accessId'] = $current_user->id();
+      $user_entity = \Drupal\user\Entity\User::load($current_user->id());
+      $first_name = $user_entity->get('field_user_first_name')->value ?? '';
+      $last_name = $user_entity->get('field_user_last_name')->value ?? '';
+      $full_name = trim($first_name . ' ' . $last_name);
+      $account_name = $user_entity->getAccountName();
+
+      // Derive accessId from username by removing @access-ci.org
+      $access_id = '';
+      if (str_ends_with($account_name, '@access-ci.org')) {
+        $access_id = str_replace('@access-ci.org', '', $account_name);
+      }
+
+      $user_data = [
+        'email' => $user_entity->getEmail(),
+        'name' => $full_name,
+        'accessId' => $access_id,
+      ];
     }
 
     // Adding global library to all pages.

js/headerfooter.js

@@ -7,21 +7,23 @@ import {
   footer,
   footerMenus,
   header,
+  qaBot,
   siteMenus,
   universalMenus,
-} from "https://esm.sh/@access-ci/[email protected]";
+} from "/libraries/access-ci-ui/access-ci-ui.js";
 
 (function (Drupal, drupalSettings) {
 
   'use strict';
 
+  let currentUri = drupalSettings.access.current_uri;
+
   /**
    * Attaches the JS test behavior to weight div.
    */
   Drupal.behaviors.accessMenuData = {
     attach: function (context, settings) {
-      var currentMenu = drupalSettings.access.current_menu;
-      var currentUri = drupalSettings.access.current_uri;
+      let currentMenu = drupalSettings.access.current_menu;
       try {
         currentMenu = JSON.parse(currentMenu);
       } catch (e) {
@@ -90,4 +92,28 @@ async function setMenu(menu, currentUri) {
     target: document.getElementById("footer")
   });
 
+  const { email = '', name = '', accessId = '' } = drupalSettings.access.user || {};
+  const apiKey = "4nn5l4T4TnkMdzsK0AwAtnGRcheBDnjawuAT42LaOLc";
+
+  qaBot({
+    target: document.getElementById("qa-bot"),
+    apiKey: apiKey,
+    isLoggedIn: isLoggedIn,
+    userEmail: email,
+    userName: name,
+    accessId: accessId,
+    loginUrl: "/login?redirect=" + currentUri,
+  });
+
+  qaBot({
+    target: document.querySelector(".embedded-qa-bot"),
+    embedded: true,
+    apiKey: apiKey,
+    isLoggedIn: isLoggedIn,
+    userEmail: email,
+    userName: name,
+    accessId: accessId,
+    loginUrl: "/login?redirect=" + currentUri,
+  });
+
 };

modules/cssn/src/Plugin/Block/PersonaBlock.php

@@ -82,15 +82,23 @@ public function build() {
       $last_name = $user_entity->get('field_user_last_name')->value;
       $pronouns = $user_entity->get('field_user_preferred_pronouns')->value;
 
-      // Show access organization if set; otherwise, use institution field.
+      // Show access organization if set; use institution field if organization is "Other" (3695) or not set.
       $orgArray = $user_entity->get('field_access_organization')->getValue();
+      $institution = $user_entity->get('field_institution')->value;
+
       if (!empty($orgArray) && !empty($orgArray[0])) {
         $nodeId = $orgArray[0]['target_id'];
-        if (!empty($nodeId)) {
+        // If organization is "Other" (node ID 3695), use institution field instead
+        if ($nodeId == 3695) {
+          $institution = $user_entity->get('field_institution')->value;
+        } else if (!empty($nodeId)) {
           $orgNode = \Drupal::entityTypeManager()->getStorage('node')->load($nodeId);
+          if ($orgNode) {
+            $institution = $orgNode->getTitle();
+          }
         }
       }
-      $institution = isset($orgNode) ? $orgNode->getTitle() : $user_entity->get('field_institution')->value;
+      // If no organization is set, use institution field (this is already handled above)
 
       $roles = $user_entity->getRoles();
       $is_student = array_search('student', $roles) !== FALSE;

modules/user_profiles/js/organization-toggle.js

@@ -0,0 +1,49 @@
+(function ($, Drupal, once) {
+  'use strict';
+
+  Drupal.behaviors.organizationToggle = {
+    attach: function (context, settings) {
+      once('organization-toggle', '[name="field_access_organization[0][target_id]"]', context).forEach(function (element) {
+        var $orgField = $(element);
+        var $institutionField = $('[name="field_institution[0][value]"]').closest('.field--name-field-institution');
+
+        function toggleInstitutionField() {
+          var selectedValue = $orgField.val();
+
+          // Check if the value contains "Other" and node ID 3695
+          // Autocomplete fields might have format like "Other (3695)" 
+          if (selectedValue === '3695' || 
+              (selectedValue && selectedValue.includes('3695')) ||
+              (selectedValue && selectedValue.toLowerCase().includes('other'))) {
+            $institutionField.show();
+            $institutionField.find('input').prop('required', true);
+          } else {
+            $institutionField.hide();
+            $institutionField.find('input').prop('required', false);
+          }
+        }
+
+        // Initial state
+        toggleInstitutionField();
+
+        // Listen for changes - multiple events to catch all scenarios
+        $orgField.on('change keyup input', toggleInstitutionField);
+
+        // Handle autocomplete selections
+        $orgField.on('autocompleteselect autocompletechange', function(event, ui) {
+          setTimeout(toggleInstitutionField, 100);
+        });
+
+        // Also check periodically in case value changes via other means
+        setInterval(function() {
+          var currentValue = $orgField.val();
+          if (currentValue !== $orgField.data('lastValue')) {
+            $orgField.data('lastValue', currentValue);
+            toggleInstitutionField();
+          }
+        }, 500);
+      });
+    }
+  };
+
+})(jQuery, Drupal, once);

modules/user_profiles/user_profiles.libraries.yml

@@ -0,0 +1,6 @@
+organization-toggle:
+  js:
+    js/organization-toggle.js: {}
+  dependencies:
+    - core/jquery
+    - core/once

modules/user_profiles/user_profiles.module

@@ -88,13 +88,26 @@ function user_profiles_form_alter(&$form, &$form_state, $form_id) {
       }
 
       // Check here for id because case fall-through from user_form case.
-      // Hide some fields.
+      // Hide some fields only on registration forms.
       if ($form_id == 'user_register_form') {
         $form['field_user_bio']['#access'] = FALSE;
-        $form['field_institution']['#access'] = FALSE;
         $form['field_citizenships']['#access'] = FALSE;
         $form['field_user_preferred_pronouns']['#access'] = FALSE;
       }
+
+      // Apply institution field visibility logic to both registration and edit forms
+      // This must come after ASP access restrictions to avoid being overridden
+      if (isset($form['field_access_organization']) && isset($form['field_institution'])) {
+        // Initially hide the institution field, show it via JS when "Other" is selected
+        $form['field_institution']['#states'] = [
+          'visible' => [
+            ':input[name="field_access_organization[0][target_id]"]' => ['value' => '3695'],
+          ],
+        ];
+
+        // Add JS library for organization field behavior
+        $form['#attached']['library'][] = 'user_profiles/organization-toggle';
+      }
       break;
   }
 }