User Field not working in a plugin outlet

Development

AI-generated summary

MihirR is trying to display a user field (user-fields/5) in the above-user-summary-stats plugin outlet using a Handlebars template, but it’s not loading. awesomerobot responds that more context is needed, particularly how this.fieldValue is defined. They suggest two approaches: (1) if the field is meant to be public, add user_field_5 to the site setting Public user custom fields, then access it via {{@user.custom_fields.user_field_5}} in the template or this.args.user?.custom_fields?.user_field_5 in JS; or (2) if it’s not public, access it directly via this.args.user?.user_fields?.[5] without modifying site settings. The issue likely stems from how the field value is being referenced or whether the field is properly configured as public.

1

I’m trying to add this user field: user-fields/5 in this outlet: above-user-summary-stats. But it does not load, here is the hbs I’m trying to use:

{{!-- Display and edit a custom user field (e.g., "profile note") for user_field_5 --}}
{{#if this.fieldValue}}
  <div class="profile-note-display">
    <strong>Profile Note:</strong> {{this.fieldValue}}
  </div>
{{else}}
  {{#if this.canEdit}}
    <div class="profile-note-display empty">
      <em>No profile note set</em>
    </div>
  {{/if}}
{{/if}}

{{#if this.canEdit}}
  {{#unless this.editing}}
    <button class="btn btn-primary btn-small" {{on "click" this.startEdit}}>
      {{#if this.fieldValue}}Edit{{else}}Add{{/if}} Profile Note
    </button>
  {{/unless}}
{{/if}}

{{#if this.editing}}
  <form {{on "submit" this.save}}>
    <textarea
      rows="4"
      style="width:100%;"
      value={{this.editValue}}
      {{on "input" this.updateEdit}}
      autofocus
    ></textarea>
    <br>
    <button type="submit" class="btn btn-primary btn-small">Save</button>
    <button type="button" class="btn btn-conditional btn-small" {{on "click" this.cancelEdit}}>Cancel</button>
  </form>
{{/if}}

What can be the possible issue?

2

I don’t think we have enough information to help based on this template alone. How is this.fieldValue defined?

If you enter user_field_5 in the site setting Public user custom fields… you should be able to access it from this plugin outlet

Either in your template like: {{@user.custom_fields.user_field_5}}

or in your JS as: this.args.user?.custom_fields?.user_field_5

Alternatively, if you don’t want the field to be public you can skip the site setting change and use this.args.user?.user_fields?.[5]