MOBILE-4248 actionsmenu: Create actions menu component

scripts/langindex.json

@@ -524,6 +524,7 @@
   "addon.mod_choice.savemychoice": "choice",
   "addon.mod_choice.userchoosethisoption": "choice",
   "addon.mod_choice.yourselection": "choice",
+  "addon.mod_data.actions": "data",
   "addon.mod_data.addentries": "data",
   "addon.mod_data.advancedsearch": "data",
   "addon.mod_data.alttext": "data",

src/addons/mod/data/components/actionsmenu/actionsmenu.html

@@ -0,0 +1,9 @@
+<ion-list>
+    <ion-item button class="ion-text-wrap" (click)="onItemClick(item)" *ngFor="let item of items" detail="false"
+        [attr.aria-label]="item.text | translate">
+        <ion-label>
+            <p class="item-heading">{{ item.text | translate }}</p>
+        </ion-label>
+        <ion-icon [name]="item.icon" slot="end" aria-hidden="true"></ion-icon>
+    </ion-item>
+</ion-list>

src/addons/mod/data/components/actionsmenu/actionsmenu.ts

@@ -0,0 +1,45 @@
+// (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, Input } from '@angular/core';
+import { PopoverController } from '@singletons';
+
+/**
+ * Component that displays the actionsmenu.
+ */
+@Component({
+    selector: 'addon-mod-data-actionsmenu',
+    templateUrl: 'actionsmenu.html',
+})
+export class AddonModDataActionsMenuComponent  {
+
+    @Input() items: AddonModDataActionsMenuItem[] = [];
+
+    /**
+     * Execute item action and dismiss the popover.
+     *
+     * @param item item from which the action will be executed.
+     */
+    async onItemClick(item: AddonModDataActionsMenuItem): Promise<void> {
+        item.action();
+        await PopoverController.dismiss();
+    }
+
+}
+
+export interface AddonModDataActionsMenuItem {
+    text: string;
+    icon: string;
+    action: () => void;
+};

src/addons/mod/data/components/components.module.ts

@@ -18,11 +18,13 @@ import { CoreCourseComponentsModule } from '@features/course/components/componen
 import { AddonModDataIndexComponent } from './index';
 import { AddonModDataSearchComponent } from './search/search';
 import { CoreCompileHtmlComponentModule } from '@features/compile/components/compile-html/compile-html.module';
+import { AddonModDataActionsMenuComponent } from './actionsmenu/actionsmenu';
 
 @NgModule({
     declarations: [
         AddonModDataIndexComponent,
         AddonModDataSearchComponent,
+        AddonModDataActionsMenuComponent,
     ],
     imports: [
         CoreSharedModule,
@@ -32,6 +34,7 @@ import { CoreCompileHtmlComponentModule } from '@features/compile/components/com
     exports: [
         AddonModDataIndexComponent,
         AddonModDataSearchComponent,
+        AddonModDataActionsMenuComponent,
     ],
 })
 export class AddonModDataComponentsModule {}