MOBILE-4374 user: Implement social profile fields

src/addons/userprofilefield/social/component/addon-user-profile-field-social.html

@@ -0,0 +1,28 @@
+<!-- Render (no edit). -->
+<ion-item *ngIf="!edit && field && field.name">
+    <ion-label>
+        <p class="item-heading">
+            <core-format-text [text]="field.name" [contextLevel]="contextLevel" [contextInstanceId]="contextInstanceId"
+                [courseId]="courseId" [wsNotFiltered]="true">
+            </core-format-text>
+        </p>
+        <p>
+            <core-format-text [text]="value" [contextLevel]="contextLevel" [contextInstanceId]="contextInstanceId" [courseId]="courseId"
+                [wsNotFiltered]="valueNotFiltered">
+            </core-format-text>
+        </p>
+    </ion-label>
+</ion-item>
+
+<!-- Edit. -->
+<ion-item *ngIf="edit && field && field.shortname && form" class="ion-text-wrap" [formGroup]="form">
+    <ion-label position="stacked">
+        <span [core-mark-required]="required">
+            <core-format-text [text]="field.name" [contextLevel]="contextLevel" [contextInstanceId]="contextInstanceId"
+                [courseId]="courseId" [wsNotFiltered]="true">
+            </core-format-text>
+        </span>
+    </ion-label>
+    <ion-input type="text" [formControlName]="modelName" [placeholder]="field.name"></ion-input>
+    <core-input-errors [control]="form.controls[modelName]"></core-input-errors>
+</ion-item>

src/addons/userprofilefield/social/component/social.ts

@@ -0,0 +1,28 @@
+// (C) Copyright 2015 Moodle Pty Ltd.
+//
+// Licensed 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.
+
+import { Component } from '@angular/core';
+
+import { CoreUserProfileFieldBaseComponent } from '@features/user/classes/base-profilefield-component';
+
+/**
+ * Directive to render a social user profile field.
+ */
+@Component({
+    selector: 'addon-user-profile-field-social',
+    templateUrl: 'addon-user-profile-field-social.html',
+})
+export class AddonUserProfileFieldSocialComponent extends CoreUserProfileFieldBaseComponent {
+
+}

src/addons/userprofilefield/social/services/handlers/social.ts

@@ -0,0 +1,79 @@
+// (C) Copyright 2015 Moodle Pty Ltd.
+//
+// Licensed 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.
+
+import { Injectable, Type } from '@angular/core';
+
+import { CoreUserProfileFieldHandler, CoreUserProfileFieldHandlerData } from '@features/user/services/user-profile-field-delegate';
+import { AddonUserProfileFieldSocialComponent } from '../../component/social';
+import { CoreTextUtils } from '@services/utils/text';
+import { AuthEmailSignupProfileField } from '@features/login/services/login-helper';
+import { CoreUserProfileField } from '@features/user/services/user';
+import { makeSingleton } from '@singletons';
+import { CoreFormFields } from '@singletons/form';
+
+/**
+ * Social user profile field handlers.
+ */
+@Injectable({ providedIn: 'root' })
+export class AddonUserProfileFieldSocialHandlerService implements CoreUserProfileFieldHandler {
+
+    name = 'AddonUserProfileFieldSocial';
+    type = 'social';
+
+    /**
+     * Whether or not the handler is enabled on a site level.
+     *
+     * @returns True or promise resolved with true if enabled.
+     */
+    async isEnabled(): Promise<boolean> {
+        return true;
+    }
+
+    /**
+     * Get the data to send for the field based on the input data.
+     *
+     * @param field User field to get the data for.
+     * @param signup True if user is in signup page.
+     * @param registerAuth Register auth method. E.g. 'email'.
+     * @param formValues Form Values.
+     * @returns Data to send for the field.
+     */
+    async getData(
+        field: AuthEmailSignupProfileField | CoreUserProfileField,
+        signup: boolean,
+        registerAuth: string,
+        formValues: CoreFormFields,
+    ): Promise<CoreUserProfileFieldHandlerData | undefined> {
+        const name = 'profile_field_' + field.shortname;
+
+        return {
+            type: 'social',
+            name: name,
+            value: CoreTextUtils.cleanTags(<string> formValues[name]),
+        };
+    }
+
+    /**
+     * Return the Component to use to display the user profile field.
+     * It's recommended to return the class of the component, but you can also return an instance of the component.
+     *
+     * @returns The component (or promise resolved with component) to use, undefined if not found.
+     */
+    getComponent(): Type<unknown> | Promise<Type<unknown>> {
+        return AddonUserProfileFieldSocialComponent;
+    }
+
+}
+
+export const AddonUserProfileFieldSocialHandler = makeSingleton(AddonUserProfileFieldSocialHandlerService);

src/addons/userprofilefield/social/social.module.ts

@@ -0,0 +1,42 @@
+// (C) Copyright 2015 Moodle Pty Ltd.
+//
+// Licensed 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.
+
+import { APP_INITIALIZER, NgModule } from '@angular/core';
+
+import { AddonUserProfileFieldSocialHandler } from './services/handlers/social';
+import { CoreUserProfileFieldDelegate } from '@features/user/services/user-profile-field-delegate';
+import { AddonUserProfileFieldSocialComponent } from './component/social';
+import { CoreSharedModule } from '@/core/shared.module';
+
+@NgModule({
+    declarations: [
+        AddonUserProfileFieldSocialComponent,
+    ],
+    imports: [
+        CoreSharedModule,
+    ],
+    providers: [
+        {
+            provide: APP_INITIALIZER,
+            multi: true,
+            useValue: () => {
+                CoreUserProfileFieldDelegate.registerHandler(AddonUserProfileFieldSocialHandler.instance);
+            },
+        },
+    ],
+    exports: [
+        AddonUserProfileFieldSocialComponent,
+    ],
+})
+export class AddonUserProfileFieldSocialModule {}

src/addons/userprofilefield/userprofilefield.module.ts

@@ -17,6 +17,7 @@ import { NgModule } from '@angular/core';
 import { AddonUserProfileFieldCheckboxModule } from './checkbox/checkbox.module';
 import { AddonUserProfileFieldDatetimeModule } from './datetime/datetime.module';
 import { AddonUserProfileFieldMenuModule } from './menu/menu.module';
+import { AddonUserProfileFieldSocialModule } from './social/social.module';
 import { AddonUserProfileFieldTextareaModule } from './textarea/textarea.module';
 import { AddonUserProfileFieldTextModule } from './text/text.module';
 
@@ -25,6 +26,7 @@ import { AddonUserProfileFieldTextModule } from './text/text.module';
         AddonUserProfileFieldCheckboxModule,
         AddonUserProfileFieldDatetimeModule,
         AddonUserProfileFieldMenuModule,
+        AddonUserProfileFieldSocialModule,
         AddonUserProfileFieldTextareaModule,
         AddonUserProfileFieldTextModule,
     ],

src/core/features/login/tests/behat/signup.feature

@@ -125,6 +125,7 @@ Feature: Test signup in app
       | datetime | birthday    | Birthday            | 1        | 1      | 1900                | 2040   | 0      |             |
       | datetime | time        | Date and time       | 0        | 1      | 1900                | 2040   | 1      |             |
       | textarea | description | Describe yourself   | 0        | 1      |                     |        |        | Sample text |
+      | social   | website     | url                 | 0        | 1      | url                 |        |        |             |
       | text     | beverage    | Favourite beverage  | 0        | 0      |                     |        |        |             |
 
     When I launch the app
@@ -139,6 +140,7 @@ Feature: Test signup in app
     And I should find "Date and time" in the app
     And I should find "Describe yourself" in the app
     And the field "Describe yourself" matches value "Sample text" in the app
+    And I should find "Web page" in the app
     But I should not find "Favourite beverage" in the app
 
     When I set the following fields to these values in the app:
@@ -150,6 +152,7 @@ Feature: Test signup in app
       | Last name | Test |
       | City/town | Barcelona |
       | Country | Spain |
+      | Web page | https://moodle.com |
     And I press "Create my new account" in the app
     Then I should find "Required" in the app
 
@@ -179,3 +182,4 @@ Feature: Test signup in app
     And I should find "1 January 1990" in the app
     And I should find "1 January 2010, 11:45 AM" in the app
     And I should find "This is my description" in the app
+    And I should find "https://moodle.com" in the app

src/core/features/user/tests/behat/basic_usage.feature

@@ -8,8 +8,9 @@ Feature: Test basic usage of user features
 
   Scenario: Complete missing fields
     Given the following "custom profile fields" exist:
-      | datatype | shortname  | name           | required |
-      | text     | food       | Favourite food | 1        |
+      | datatype | shortname  | name           | required | param1 |
+      | text     | food       | Favourite food | 1        |        |
+      | social   | website    | url            | 1        | url    |
     When I enter the app
     And I log in as "student1"
     Then I should find "Complete your profile" in the app
@@ -42,6 +43,7 @@ Feature: Test basic usage of user features
     And I set the field "password" to "student1"
     And I click on "Log in" "button"
     And I set the field "Favourite food" to "Pasta"
+    And I set the field "Web page" to "https://moodle.com"
     And I click on "Update profile" "button"
     Then I should see "Changes saved"
 
@@ -53,11 +55,29 @@ Feature: Test basic usage of user features
     Then I should find "Acceptance test site" in the app
 
   Scenario: View profile
-    Given I entered the app as "student1"
-    When I press the user menu button in the app
+    Given the following "custom profile fields" exist:
+      | datatype | shortname  | name           | required | param1 |
+      | text     | food       | Favourite food | 1        |        |
+      | social   | website    | url            | 1        | url    |
+    And I entered the app as "student1"
+    And I press "Complete profile" in the app
+    And I switch to the browser tab opened by the app
+    And I set the field "username" to "student1"
+    And I set the field "password" to "student1"
+    And I click on "Log in" "button"
+    And I set the field "Favourite food" to "Pasta"
+    And I set the field "Web page" to "https://moodle.com"
+    When I click on "Update profile" "button"
+    Then I should see "Changes saved"
+
+    When I close the browser tab opened by the app
+    And I press "Reconnect" in the app
+    And I press the user menu button in the app
     And I press "Student" in the app
     Then I should find "[email protected]" in the app
     And I should find "Student Student" in the app
+    And I should find "Pasta" in the app
+    And I should find "https://moodle.com" in the app
     And the UI should match the snapshot
 
   @lms_from4.2