Merge branch 'main' into jeffdaley/product-avatar

pkg/links/redirect.go

@@ -99,7 +99,8 @@ func parseAndValidatePath(p string) (string, error) {
 		return "", fmt.Errorf("invalid url path")
 	}
 
-	return fmt.Sprintf("/%s/%s", resultPath[0], resultPath[1]), nil
+	return fmt.Sprintf("/%s/%s",
+		strings.ToLower(resultPath[0]), strings.ToLower(resultPath[1])), nil
 }
 
 // matchStaticPathRedirects matches the URL path provided

web/app/components/custom-editable-field.hbs

@@ -1,60 +1,11 @@
-{{#if this.typeIsString}}
+<div class="editable-field-container" ...attributes>
   <EditableField
-    data-test-custom-string-field
-    @value={{get @document @field}}
-    @onChange={{@onChange}}
+    data-test-custom-field
+    data-test-custom-field-type={{if this.typeIsString "string" "people"}}
+    @value={{if this.typeIsString this.stringValue this.hermesUsers}}
+    @onChange={{if this.typeIsPeople this.onPeopleSelectChange}}
+    @onSave={{if this.typeIsPeople this.onPeopleSave @onSave}}
     @isSaving={{@isSaving}}
-    @disabled={{@disabled}}
-  >
-    <:default as |F|>
-      {{#if F.value}}
-        <p class="truncate text-body-200" title={{F.value}}>
-          {{F.value}}
-        </p>
-      {{else}}
-        <EmptyStateText />
-      {{/if}}
-    </:default>
-    <:editing as |F|>
-      <Hds::Form::Textarea::Field
-        {{F.input}}
-        {{auto-height-textarea}}
-        @value={{F.value}}
-        name={{@field}}
-        data-test-custom-string-field-input
-      />
-    </:editing>
-  </EditableField>
-
-{{else if this.typeIsPeople}}
-  <EditableField
-    data-test-custom-people-field
-    @value={{get @attributes "value"}}
-    @onChange={{@onChange}}
-    @isSaving={{@isSaving}}
-  >
-    <:default>
-      {{#if this.people.length}}
-        <ol class="person-list">
-          {{#each this.people as |user|}}
-            <li>
-              <Person @imgURL={{user.imgURL}} @email={{user.email}} />
-            </li>
-          {{/each}}
-        </ol>
-      {{else}}
-        <EmptyStateText />
-      {{/if}}
-    </:default>
-    <:editing as |F|>
-      <Inputs::PeopleSelect
-        {{autofocus targetChildren=true}}
-        class="multiselect--narrow"
-        @selected={{this.people}}
-        @onChange={{this.updateEmails}}
-        {{click-outside (fn F.update this.people)}}
-        data-test-custom-people-field-input
-      />
-    </:editing>
-  </EditableField>
-{{/if}}
+    @isReadOnly={{@disabled}}
+  />
+</div>

web/app/components/custom-editable-field.ts

@@ -1,4 +1,4 @@
-import { action } from "@ember/object";
+import { action, get } from "@ember/object";
 import Component from "@glimmer/component";
 import { tracked } from "@glimmer/tracking";
 import {
@@ -8,39 +8,68 @@ import {
 } from "hermes/types/document";
 
 interface CustomEditableFieldComponentSignature {
+  Element: HTMLDivElement;
   Args: {
     document: HermesDocument;
     field: string;
     attributes: CustomEditableField;
-    onChange: (value: any) => void;
+    onSave: (value: any) => void;
     isSaving?: boolean;
     disabled?: boolean;
   };
 }
 
 export default class CustomEditableFieldComponent extends Component<CustomEditableFieldComponentSignature> {
-  @tracked protected emails: string | string[] =
-    this.args.attributes.value || [];
-
-  protected get typeIsString(): boolean {
+  protected get typeIsString() {
     return this.args.attributes.type === "STRING";
   }
 
-  protected get typeIsPeople(): boolean {
+  protected get typeIsPeople() {
     return this.args.attributes.type === "PEOPLE";
   }
 
-  protected get people(): HermesUser[] {
+  /**
+   * The value of the field. Initially set to the value passed in.
+   * Changes when the user updates or saves the PeopleSelect value.
+   */
+  @tracked protected emails = this.args.attributes.value || [];
+
+  /**
+   * The value of the field, serialized for the PeopleSelect.
+   */
+  protected get hermesUsers(): HermesUser[] {
     let emails = this.emails instanceof Array ? this.emails : [this.emails];
     return emails.map((email: string) => {
       return { email, imgURL: null };
     });
   }
-  @action protected updateEmails(people: HermesUser[]) {
+
+  protected get stringValue(): string {
+    const value = get(this.args.document, this.args.field);
+    if (typeof value === "string") {
+      return value;
+    } else {
+      return "";
+    }
+  }
+
+  /**
+   * The function to call when the user updates the PeopleSelect value.
+   * Deserializes the value and updates the local `emails` property.
+   */
+  @action protected onPeopleSelectChange(people: HermesUser[]) {
     this.emails = people.map((person: HermesUser) => {
       return person.email;
     });
   }
+
+  /**
+   * The function to call when the user saves PeopleSelect changes.
+   * Calls the parent `onSave` action and updates the local `cached` property.
+   */
+  @action protected onPeopleSave() {
+    this.args.onSave(this.emails);
+  }
 }
 
 declare module "@glint/environment-ember-loose/registry" {