Skip to content

Commit aae4e59

Browse files
committed
MOBILE-4910 mainmenu: Show custom menu items on user menu
1 parent fa8ca9f commit aae4e59

File tree

6 files changed

+98
-28
lines changed

6 files changed

+98
-28
lines changed
Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
@if (type() !== 'embedded') {
2+
<ion-item button [href]="url()" [attr.aria-label]="label()" core-link [capture]="type() === 'app'"
3+
[inApp]="type() === 'inappbrowser'" class="core-usermenu-customitem" [detail]="true"
4+
[detailIcon]="type() === 'browser' ? 'open-outline' : 'chevron-forward'">
5+
<ion-icon [name]="icon()" slot="start" aria-hidden="true" />
6+
<ion-label>
7+
<p class="item-heading">{{label()}}</p>
8+
</ion-label>
9+
</ion-item>
10+
} @else {
11+
<ion-item button (click)="openItem()" [attr.aria-label]="label()" class="core-usermenu-customitem" [detail]="true">
12+
<ion-icon [name]="icon()" slot="start" aria-hidden="true" />
13+
<ion-label>
14+
<p class="item-heading">{{label()}}</p>
15+
</ion-label>
16+
</ion-item>
17+
}
Lines changed: 59 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,59 @@
1+
// (C) Copyright 2015 Moodle Pty Ltd.
2+
//
3+
// Licensed under the Apache License, Version 2.0 (the "License");
4+
// you may not use this file except in compliance with the License.
5+
// You may obtain a copy of the License at
6+
//
7+
// http://www.apache.org/licenses/LICENSE-2.0
8+
//
9+
// Unless required by applicable law or agreed to in writing, software
10+
// distributed under the License is distributed on an "AS IS" BASIS,
11+
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
12+
// See the License for the specific language governing permissions and
13+
// limitations under the License.
14+
15+
import { CoreLinkOpenMethod } from '@/core/constants';
16+
import { CoreSharedModule } from '@/core/shared.module';
17+
import { Component, input } from '@angular/core';
18+
import { CoreViewer } from '@features/viewer/services/viewer';
19+
20+
/**
21+
* Component to display a custom menu item.
22+
*/
23+
@Component({
24+
selector: 'core-custom-menu-item',
25+
templateUrl: 'custom-menu-item.html',
26+
imports: [
27+
CoreSharedModule,
28+
],
29+
})
30+
export class CoreCustomMenuItemComponent {
31+
32+
/**
33+
* Type of the item: app, inappbrowser, browser or embedded.
34+
*/
35+
readonly type = input.required<CoreLinkOpenMethod>();
36+
37+
/**
38+
* Url of the item.
39+
*/
40+
readonly url = input.required<string>();
41+
42+
/**
43+
* Label to display for the item.
44+
*/
45+
readonly label = input.required<string>();
46+
47+
/**
48+
* Name of the icon to display for the item.
49+
*/
50+
readonly icon = input.required<string>();
51+
52+
/**
53+
* Open an embedded custom item.
54+
*/
55+
openItem(): void {
56+
CoreViewer.openIframeViewer(this.label(), this.url());
57+
}
58+
59+
}

src/core/features/mainmenu/components/user-menu/user-menu.html

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -67,6 +67,10 @@ <h1>
6767
}
6868
</ion-item>
6969

70+
@for (item of customItems; track item) {
71+
<core-custom-menu-item [type]="item.type" [label]="item.label" [icon]="item.icon" [url]="item.url" />
72+
}
73+
7074
<ion-item button *ngFor="let handler of accountHandlers; let first = first"
7175
(click)="handlerClicked($event, handler)"
7276
[class]="['ion-text-wrap', 'core-user-account-menu-handler', handler.class]"

src/core/features/mainmenu/components/user-menu/user-menu.ts

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -34,6 +34,8 @@ import { Subscription } from 'rxjs';
3434
import { CoreLoginHelper } from '@features/login/services/login-helper';
3535
import { CoreSiteLogoComponent } from '@/core/components/site-logo/site-logo';
3636
import { CoreAlerts } from '@services/overlays/alerts';
37+
import { CoreCustomMenu, CoreCustomMenuItem } from '@features/mainmenu/services/custommenu';
38+
import { CoreCustomMenuItemComponent } from '../custom-menu-item/custom-menu-item';
3739

3840
/**
3941
* Component to display a user menu.
@@ -45,6 +47,7 @@ import { CoreAlerts } from '@services/overlays/alerts';
4547
imports: [
4648
CoreSharedModule,
4749
CoreSiteLogoComponent,
50+
CoreCustomMenuItemComponent,
4851
],
4952
})
5053
export class CoreMainMenuUserMenuComponent implements OnInit, OnDestroy {
@@ -53,6 +56,7 @@ export class CoreMainMenuUserMenuComponent implements OnInit, OnDestroy {
5356
siteUrl?: string;
5457
displaySiteUrl = false;
5558
handlers: CoreUserProfileHandlerData[] = [];
59+
customItems?: CoreCustomMenuItem[];
5660
accountHandlers: CoreUserProfileHandlerData[] = [];
5761
handlersLoaded = false;
5862
user?: CoreUserProfile;
@@ -78,6 +82,8 @@ export class CoreMainMenuUserMenuComponent implements OnInit, OnDestroy {
7882
this.removeAccountOnLogout = !!CoreConstants.CONFIG.removeaccountonlogout;
7983
this.displaySiteUrl = currentSite.shouldDisplayInformativeLinks();
8084

85+
this.loadCustomMenuItems();
86+
8187
if (!this.siteInfo) {
8288
return;
8389
}
@@ -122,6 +128,13 @@ export class CoreMainMenuUserMenuComponent implements OnInit, OnDestroy {
122128
});
123129
}
124130

131+
/**
132+
* Load custom menu items.
133+
*/
134+
protected async loadCustomMenuItems(): Promise<void> {
135+
this.customItems = await CoreCustomMenu.getUserCustomMenuItems();
136+
}
137+
125138
/**
126139
* Opens User profile page.
127140
*

src/core/features/mainmenu/pages/more/more.html

Lines changed: 3 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -42,25 +42,9 @@ <h1>{{ 'core.more' | translate }}</h1>
4242
}
4343
}
4444
</ion-item>
45-
<ng-container *ngFor="let item of customItems">
46-
@if (item.type !== 'embedded') {
47-
<ion-item button [href]="item.url" [attr.aria-label]="item.label" core-link [capture]="item.type === 'app'"
48-
[inApp]="item.type === 'inappbrowser'" class="core-moremenu-customitem" [detail]="true"
49-
[detailIcon]="item.type === 'browser' ? 'open-outline' : 'chevron-forward'">
50-
<ion-icon [name]="item.icon" slot="start" aria-hidden="true" />
51-
<ion-label>
52-
<p class="item-heading">{{item.label}}</p>
53-
</ion-label>
54-
</ion-item>
55-
} @else {
56-
<ion-item button (click)="openItem(item)" [attr.aria-label]="item.label" class="core-moremenu-customitem" [detail]="true">
57-
<ion-icon [name]="item.icon" slot="start" aria-hidden="true" />
58-
<ion-label>
59-
<p class="item-heading">{{item.label}}</p>
60-
</ion-label>
61-
</ion-item>
62-
}
63-
</ng-container>
45+
@for (item of customItems; track item) {
46+
<core-custom-menu-item [type]="item.type" [label]="item.label" [icon]="item.icon" [url]="item.url" />
47+
}
6448
@if (showScanQR) {
6549
<ion-item button (click)="scanQR()" [detail]="true">
6650
<ion-icon name="fas-qrcode" slot="start" aria-hidden="true" />

src/core/features/mainmenu/pages/more/more.ts

Lines changed: 2 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -29,6 +29,7 @@ import { CoreMainMenuUserButtonComponent } from '../../components/user-menu-butt
2929
import { CoreContentLinksHelper } from '@features/contentlinks/services/contentlinks-helper';
3030
import { CoreUrl } from '@singletons/url';
3131
import { CoreCustomMenu, CoreCustomMenuItem } from '@features/mainmenu/services/custommenu';
32+
import { CoreCustomMenuItemComponent } from '@features/mainmenu/components/custom-menu-item/custom-menu-item';
3233

3334
/**
3435
* Page that displays the more page of the app.
@@ -40,6 +41,7 @@ import { CoreCustomMenu, CoreCustomMenuItem } from '@features/mainmenu/services/
4041
imports: [
4142
CoreSharedModule,
4243
CoreMainMenuUserButtonComponent,
44+
CoreCustomMenuItemComponent,
4345
],
4446
})
4547
export default class CoreMainMenuMorePage implements OnInit, OnDestroy {
@@ -133,15 +135,6 @@ export default class CoreMainMenuMorePage implements OnInit, OnDestroy {
133135
CoreNavigator.navigateToSitePath(handler.page, { params });
134136
}
135137

136-
/**
137-
* Open an embedded custom item.
138-
*
139-
* @param item Item to open.
140-
*/
141-
openItem(item: CoreCustomMenuItem): void {
142-
CoreViewer.openIframeViewer(item.label, item.url);
143-
}
144-
145138
/**
146139
* Open settings.
147140
*/

0 commit comments

Comments
 (0)