@eui/cli 21.0.0-alpha.3 → 21.0.0-alpha.5

package/lib/skeletons/_angular/base-mobile/src/app/core/core.module.ts

@@ -0,0 +1,89 @@
+import { NgModule } from '@angular/core';
+import { TranslateModule } from '@ngx-translate/core';
+import { StoreModule } from '@ngrx/store';
+import { EffectsModule } from '@ngrx/effects';
+import { StoreDevtoolsModule } from '@ngrx/store-devtools';
+
+import { HTTP_INTERCEPTORS, HttpClientModule } from '@angular/common/http';
+
+import { IonicModule } from '@ionic/angular';
+
+import {
+    CachePreventionInterceptor,
+    CorsSecurityInterceptor,
+    CsrfPreventionInterceptor,
+    EuLoginSessionTimeoutHandlingInterceptor,
+    CoreModule as EuiCoreModule,
+    translateConfig,
+    CoreModuleEffects,
+    EUI_CONFIG_TOKEN,
+} from '@eui/core';
+
+import { appConfig } from '../../config/index';
+import { environment } from '../../environments/environment';
+
+import { REDUCER_TOKEN, getReducers, metaReducers } from './reducers/index';
+
+import { SharedModule } from '@shared/shared.module';
+
+@NgModule({
+    imports: [
+        HttpClientModule,
+        SharedModule,
+        EuiCoreModule.forRoot(),
+        EffectsModule.forRoot([...CoreModuleEffects]),
+        TranslateModule.forRoot(translateConfig),
+        StoreModule.forRoot(),
+        StoreModule.forRoot(REDUCER_TOKEN, { metaReducers }),
+        !environment.production ? StoreDevtoolsModule.instrument({ maxAge: 50 }) : [],
+        IonicModule.forRoot({mode: 'md'}),
+    ],
+    declarations: [
+    ],
+    exports: [
+        SharedModule,
+    ],
+    providers: [
+        {
+            provide: REDUCER_TOKEN,
+            deps: [],
+            useFactory: getReducers,
+        },
+        {
+            provide: EUI_CONFIG_TOKEN,
+            useValue: { appConfig: appConfig, environment: environment }
+        },
+        {
+            // Sets the withCredentials on Ajax Request to send the JSESSIONID cookie to another domain.
+            // This is necessary when a request is being made to another domain that is protected by EU Login.
+            provide: HTTP_INTERCEPTORS,
+            useClass: CorsSecurityInterceptor,
+            multi: true,
+        },
+        {
+            // When the authentication session is invalid, we need to re-authenticate. The browser refreshes the current URL,
+            // and lets the EU Login client redirect to the official EU Login page.
+            provide: HTTP_INTERCEPTORS,
+            useClass: EuLoginSessionTimeoutHandlingInterceptor,
+            multi: true,
+        },
+        {
+            // Adds HTTP header to each Ajax request that ensures the request is set by a piece of JavaScript code in the application.
+            // This prevents dynamically-loaded content from forging a request in the name of the currently logged-in user.
+            // Be aware that this assumes that cross-site scripting (XSS) is already put in place, (default setting in Angular).
+            provide: HTTP_INTERCEPTORS,
+            useClass: CsrfPreventionInterceptor,
+            multi: true,
+        },
+        {
+            // Asks the intermediate proxies not to return a cache copy of the resource.
+            // In matter of fact forces each server in the chain to validate the freshness of the resource.
+            provide: HTTP_INTERCEPTORS,
+            useClass: CachePreventionInterceptor,
+            multi: true,
+        },
+    ]
+})
+export class CoreModule {
+
+}

package/lib/skeletons/_angular/base-mobile/src/app/core/reducers/index.ts

@@ -0,0 +1,32 @@
+import { InjectionToken } from '@angular/core';
+import { MetaReducer } from '@ngrx/store';
+import { storeFreeze } from 'ngrx-store-freeze';
+import { reducers as coreReducers, localStorageSync } from '@eui/core';
+import { CoreState, getAppState } from '@eui/core';
+
+import { environment } from '../../../environments/environment';
+
+export const REDUCER_TOKEN = new InjectionToken<any>('Registered Reducers');
+
+/**
+ * Define here your app state
+ *
+ * [IMPORTANT]
+ * There are some **reserved** slice of the state
+ * that you **can not** use in your application ==> app |user | notification
+ */
+// eslint-disable-next-line
+export interface AppState extends CoreState {
+    // [key: string]: fromTaskManager.State | any;
+}
+
+/**
+ * Define here the reducers of your app
+ */
+const rootReducer = Object.assign({}, coreReducers, {
+    // [fromTaskManager.namespace]: fromTaskManager.reducers,
+});
+
+export const getReducers = () => rootReducer;
+
+export const metaReducers: MetaReducer<AppState>[] = !environment.production ? [localStorageSync, storeFreeze] : [localStorageSync];

package/lib/skeletons/_angular/base-mobile/src/app/features/about/about-routing.module.ts

@@ -0,0 +1,45 @@
+import { NgModule } from '@angular/core';
+import { RouterModule, Routes } from '@angular/router';
+import { AboutComponent } from './about.component';
+import { ChangeLogComponent } from './change-log/changelog.component';
+import { PrivacystatementComponent } from './privacy-statement/privacy-statement.component';
+import { LegalNoticeComponent } from './legal-notice/legal-notice.component';
+import { HelpSupportComponent } from './help-support/help-support.component';
+import { OpensourceLicencesComponent } from './opensource-licences/opensource-licences.component';
+import { LicenceDetailsComponent } from './licence-details/licence-details.component';
+
+const routes: Routes = [
+    {
+        path: '',
+        component: AboutComponent,
+    },
+    {
+        path: 'change-log',
+        component: ChangeLogComponent
+    },
+    {
+        path: 'privacy-statement',
+        component: PrivacystatementComponent
+    },
+    {
+        path: 'legal-notice',
+        component: LegalNoticeComponent
+    },
+    {
+        path: 'help-support',
+        component: HelpSupportComponent
+    },
+    {
+        path: 'opensource-licences',
+        component: OpensourceLicencesComponent,
+    },
+    {
+        path: 'opensource-licences/licence-details',
+        component: LicenceDetailsComponent
+    },
+];
+
+@NgModule({
+    imports: [RouterModule.forChild(routes)],
+})
+export class AboutRoutingModule {}

package/lib/skeletons/_angular/base-mobile/src/app/features/about/about.component.html

@@ -0,0 +1,70 @@
+<ion-header>
+    <ion-toolbar color="branding">
+        <euim-toolbar>
+            <euim-toolbar-title>{{ 'euim.about.text' | translate }}</euim-toolbar-title>
+            <euim-toolbar-action-items>
+                <ion-button>
+                    <ion-label class="eui-u-mr-m" (click)="toggleQRCode()" slot="end">
+                        <strong>
+                            @if (showCode) {
+                                {{ 'euim.about.hide.qrcode' | translate }}
+                            }
+                            @if (!showCode) {
+                                {{ 'euim.about.show.qrcode' | translate }}
+                            }
+                        </strong>
+                    </ion-label>
+                </ion-button>
+            </euim-toolbar-action-items>
+        </euim-toolbar>
+    </ion-toolbar>
+
+    <euim-header-details color="branding">
+        <div euimHeaderDetailsIcon>
+            <euim-toolbar-qrcode [showCode]="showCode" logoUrl="./assets/images/app-icon.svg"
+                                 qrCodeUrl="https://github.com/Cordobo/angularx-qrcode"></euim-toolbar-qrcode>
+        </div>
+        <div euimHeaderDetailsTitle><strong>eUI / mobile</strong></div>
+        <div euimHeaderDetailsMeta>{{'euim.about.version' | translate }} 1.2.0</div>
+        <div euimHeaderDetailsMeta>{{ 'euim.about.builton' | translate }} 12.03.2024, 16:30</div>
+    </euim-header-details>
+</ion-header>
+<ion-content>
+    <euim-about>
+        <ion-list>
+            <ion-list-header>
+                <ion-label>{{ 'euim.aboutapp.text' | translate }}</ion-label>
+            </ion-list-header>
+            <ion-item button (click)="onNavigate('/screen/about/change-log')">
+                <ion-icon name="build-outline" slot="start"></ion-icon>
+                <ion-label>
+                    <div euimLabel>{{'euim.about.changelog' | translate }}</div>
+                </ion-label>
+            </ion-item>
+            <ion-item button (click)="onNavigate('/screen/about/privacy-statement')">
+                <ion-icon name="finger-print-sharp" slot="start"></ion-icon>
+                <ion-label>
+                    <div euimLabel>{{'euim.about.privacy.statement' | translate }}</div>
+                </ion-label>
+            </ion-item>
+            <ion-item button (click)="onNavigate('/screen/about/opensource-licences')">
+                <ion-icon name="ribbon-outline" slot="start"></ion-icon>
+                <ion-label>
+                    <div euimLabel>{{'euim.about.opensource.licences' | translate }}</div>
+                </ion-label>
+            </ion-item>
+            <ion-item button (click)="onNavigate('/screen/about/legal-notice')">
+                <ion-icon name="library-outline" slot="start"></ion-icon>
+                <ion-label>
+                    <div euimLabel>{{'euim.about.legal.notice' | translate }}</div>
+                </ion-label>
+            </ion-item>
+            <ion-item button (click)="onNavigate('/screen/about/help-support')">
+                <ion-icon name="mail-outline" slot="start"></ion-icon>
+                <ion-label>
+                    <div euimLabel>{{'euim.about.help.support' | translate }}</div>
+                </ion-label>
+            </ion-item>
+        </ion-list>
+    </euim-about>
+</ion-content>

package/lib/skeletons/_angular/base-mobile/src/app/features/about/about.component.ts

@@ -0,0 +1,19 @@
+import { Component } from '@angular/core';
+import { NavController } from '@ionic/angular';
+
+@Component({
+    templateUrl: './about.component.html'
+})
+export class AboutComponent {
+    showCode = false;
+
+    constructor(
+        private navCtrl: NavController,
+    ) {}
+    toggleQRCode(): void {
+        this.showCode = !this.showCode;
+    }
+    onNavigate(url: string) {
+        this.navCtrl.navigateForward(url);
+    }
+}

package/lib/skeletons/_angular/base-mobile/src/app/features/about/about.module.ts

@@ -0,0 +1,30 @@
+import { NgModule } from '@angular/core';
+import { AboutRoutingModule } from './about-routing.module';
+import { AboutComponent } from './about.component';
+import { ChangeLogComponent } from './change-log/changelog.component';
+import { LicenceDetailsComponent } from './licence-details/licence-details.component';
+import { PrivacystatementComponent } from './privacy-statement/privacy-statement.component';
+import { LegalNoticeComponent } from './legal-notice/legal-notice.component';
+import { HelpSupportComponent } from './help-support/help-support.component';
+import { OpensourceLicencesComponent } from './opensource-licences/opensource-licences.component';
+import { SharedModule } from '@shared/shared.module';
+import { TranslateModule } from '@ngx-translate/core';
+
+@NgModule({
+    imports: [
+        SharedModule,
+        AboutRoutingModule,
+        TranslateModule,
+    ],
+    declarations: [
+        AboutComponent,
+        ChangeLogComponent,
+        PrivacystatementComponent,
+        LegalNoticeComponent,
+        HelpSupportComponent,
+        LicenceDetailsComponent,
+        OpensourceLicencesComponent
+    ],
+})
+export class Module {
+}

package/lib/skeletons/_angular/base-mobile/src/app/features/about/change-log/changelog.component.html

@@ -0,0 +1,11 @@
+<ion-header>
+    <ion-toolbar color="branding">
+        <euim-toolbar>
+            <euim-toolbar-title>{{ 'euim.about.changelog' | translate }}</euim-toolbar-title>
+        </euim-toolbar>
+    </ion-toolbar>
+</ion-header>
+<ion-content>
+    <euim-changelog [changeLogs]="changeLogs">
+    </euim-changelog>
+</ion-content>

package/lib/skeletons/_angular/base-mobile/src/app/features/about/change-log/changelog.component.ts

@@ -0,0 +1,102 @@
+import { Component } from '@angular/core';
+@Component({
+    templateUrl: './changelog.component.html'
+})
+export class ChangeLogComponent {
+    changeLogs = [
+        {
+            version: 'v1.2.0',
+            sections: [
+                {
+                    name: 'New features',
+                    items: [
+                        'Lorem ipsum sit amelor dot alersi',
+                        'Addenadum, des ameliori dora cantine imaginum des cornes',
+                        'Prioridari modulo EXANTI pero alumnides monitoro alere umo quorum pano',
+                    ],
+                },
+                {
+                    name: 'Improvements',
+                    items: [
+                        'Nuevo funcciono uno',
+                        'Apprenati koleos amedo del corossa',
+                        'Aperanci todo formas y formulas',
+                    ],
+                },
+                {
+                    name: 'Bugfixes',
+                    items: [
+                        'Fixato lorem ipsum et amelori',
+                        'Correctus magnus magnificus',
+                        'Reparus extra petiti textus',
+                    ],
+                },
+            ],
+        },
+        {
+            version: 'v1.1.2',
+            sections: [
+                {
+                    name: 'New features',
+                    items: [
+                        'Lorem ipsum sit amelor dot alersi',
+                        'Addenadum, des ameliori dora cantine imaginum des cornes',
+                        'Prioridari modulo EXANTI pero alumnides monitoro alere umo quorum pano',
+                    ],
+                },
+                {
+                    name: 'Improvements',
+                    items: [
+                        'Nuevo funcciono uno',
+                    ],
+                },
+                {
+                    name: 'Bugfixes',
+                    items: [],
+                },
+            ],
+        },
+        {
+            version: 'v1.1.0',
+            sections: [
+                {
+                    name: 'New features',
+                    items: [
+                        'Home page',
+                        'Main menu',
+                    ],
+                },
+                {
+                    name: 'Improvements',
+                    items: [
+                        'Nuevo funcciono uno',
+                    ],
+                },
+                {
+                    name: 'Bugfixes',
+                    items: [],
+                },
+            ],
+        },
+        {
+            version: 'v1.0.1',
+            sections: [
+                {
+                    name: 'New features',
+                    items: [
+                        'Initial version',
+                    ],
+                },
+                {
+                    name: 'Improvements',
+                    items: [],
+                },
+                {
+                    name: 'bugfixes',
+                    items: [],
+                },
+            ],
+        },
+    ];
+
+}

package/lib/skeletons/_angular/base-mobile/src/app/features/about/help-support/help-support.component.html

@@ -0,0 +1,20 @@
+<ion-header>
+    <ion-toolbar color="branding">
+        <euim-toolbar>
+            <euim-toolbar-title>{{ 'euim.about.help.support' | translate }}</euim-toolbar-title>
+        </euim-toolbar>
+
+        <euim-alert-message color="branding">
+            <ion-icon name="person-circle" slotStart></ion-icon>
+            {{ alertInfos.title }}
+
+            <ion-button [href]="alertInfos.btnLink" slotEnd size="small" fill="outline">
+                <strong>{{ alertInfos.btnTitle }}</strong>
+            </ion-button>
+        </euim-alert-message>
+    </ion-toolbar>
+</ion-header>
+<ion-content>
+    <euim-help-support [helpAndSupportItems]="helpAndSupportItems">
+    </euim-help-support>
+</ion-content>

package/lib/skeletons/_angular/base-mobile/src/app/features/about/help-support/help-support.component.ts

@@ -0,0 +1,75 @@
+import { Component } from '@angular/core';
+
+@Component({
+    templateUrl: './help-support.component.html'
+})
+export class HelpSupportComponent {
+    alertInfos = {
+        icon: 'person-circle',
+        title: 'Looking for staff member?',
+        btnLink: '.',
+        btnTitle: 'FIND PERSON'
+    }
+
+    helpAndSupportItems = [
+        {
+            sectionTitle: 'CONTACT US',
+            items: [
+                {
+                    title: '+352 123 45 67890',
+                    phone: '+352 123 45 67890',
+                    subtitle: 'Customer service',
+                    startIcon: 'call',
+                    hasBottomLine: true
+                },
+                {
+                    title: '+32 123 45 67890',
+                    phone: '+32 123 45 67890',
+                    subtitle: 'Helpdesk support',
+                    startIcon: 'call',
+                    hasBottomLine: true
+                },
+                {
+                    title: 'digit-eui-support@ec.europa.eu',
+                    mail: 'digit-eui-support@ec.europa.eu',
+                    subtitle: 'Helpdesk support',
+                    startIcon: 'at',
+                    hasBottomLine: true
+                },
+                {
+                    title: 'EC Microsoft Teams',
+                    link: 'https://teams.microsoft.com/l/channel/19%3a6db7a6cef52340eb91d67b8d75db2523%40thread.tacv2/%25E2%259D%2593%25E2%259D%2593%2520%2520HELPDESK%2520and%2520SUPPORT?groupId=fb6def72-c57b-4e8f-a82e-49be65d6e1f5&tenantId=b24c8b06-522c-46fe-9080-70926f8dddb1',
+                    subtitle: 'Microsoft Teams helpdesk channel',
+                    startIcon: 'people'
+                },
+            ],
+        },
+        {
+            sectionTitle: 'SUPPORT MATERIALS',
+            items: [
+                {
+                    title: 'eUI / mobile manual',
+                    subtitle: 'Getting started with library',
+                    link: 'https://euidev.ecdevops.eu/eui-showcase-mobile-18.x/home',
+                    startIcon: 'book',
+                    endIcon: 'link'
+                },
+                {
+                    title: 'EU Login',
+                    subtitle: 'User manual',
+                    link: 'https://webgate.ec.europa.eu/cas/help.html',
+                    startIcon: 'book',
+                    endIcon: 'link'
+                },
+                {
+                    title: 'FAQ',
+                    subtitle: 'Frequently asked questions',
+                    link: 'https://ec.europa.eu/sustainable-finance-taxonomy/faq',
+                    startIcon: 'book',
+                    endIcon: 'link'
+                }
+            ]
+        }
+    ];
+
+}

package/lib/skeletons/_angular/base-mobile/src/app/features/about/legal-notice/legal-notice.component.html

@@ -0,0 +1,12 @@
+<ion-header>
+    <ion-toolbar color="branding">
+        <euim-toolbar>
+            <euim-toolbar-title>{{ 'euim.about.legal.notice' | translate }}</euim-toolbar-title>
+        </euim-toolbar>
+    </ion-toolbar>
+</ion-header>
+<ion-content>
+    <euim-about-content-loading>
+        <euim-pdf-viewer url="assets/docs/pdf-test.pdf"></euim-pdf-viewer>
+    </euim-about-content-loading>
+</ion-content>

package/lib/skeletons/_angular/base-mobile/src/app/features/about/legal-notice/legal-notice.component.ts

@@ -0,0 +1,8 @@
+import { Component } from '@angular/core';
+
+@Component({
+    templateUrl: './legal-notice.component.html'
+})
+export class LegalNoticeComponent {
+
+}

package/lib/skeletons/_angular/base-mobile/src/app/features/about/licence-details/licence-details.component.html

@@ -0,0 +1,48 @@
+<ion-header>
+    <ion-toolbar color="branding">
+        <euim-toolbar>
+            <euim-toolbar-title>{{ 'euim.about.licence.details' | translate }}</euim-toolbar-title>
+        </euim-toolbar>
+    </ion-toolbar>
+</ion-header>
+<ion-content>
+    <euim-about-content-loading>
+        <p><strong>EUROPEAN UNION PUBLIC LICENCE v. 1.2</strong></p>
+        <p>
+            This European Union Public Licence (the ‘EUPL’) applies to the Work (as defined below) which is provided under the terms of this Licence. Any use of the Work, other than as authorised under this Licence is prohibited (to the extent such use is covered by a right of the copyright holder of the Work).
+        </p>
+        <p>
+            The Work is provided under the terms of this Licence when the Licensor (as defined below) has placed the following notice immediately following the copyright notice for the Work:
+        </p>
+        <p>
+            Licensed under the EUPL
+
+            or has expressed by any other means his willingness to license under the EUPL.
+        </p>
+        <p>
+            1. Definitions
+            In this Licence, the following terms have the following meaning:
+            <br><br>
+            — ‘The Licence’: this Licence.
+            <br><br>
+            — ‘The Original Work’: the work or software distributed or communicated by the Licensor under this Licence, available as Source Code and also as Executable Code as the case may be.
+            <br><br>
+            — ‘Derivative Works’: the works or software that could be created by the Licensee, based upon the Original Work or modifications thereof. This Licence does not define the extent of modification or dependence on the Original Work required in order to classify a work as a Derivative Work; this extent is determined by copyright law applicable in the country mentioned in Article 15.
+            <br><br>
+            — ‘The Work’: the Original Work or its Derivative Works.
+            <br><br>
+            — ‘The Source Code’: the human-readable form of the Work which is the most convenient for people to study and modify.
+            <br><br>
+            — ‘The Executable Code’: any code which has generally been compiled and which is meant to be interpreted by a computer as a program.
+            <br><br>
+            — ‘The Licensor’: the natural or legal person that distributes or communicates the Work under the Licence.
+            <br><br>
+            — ‘Contributor(s)’: any natural or legal person who modifies the Work under the Licence, or otherwise contributes to the creation of a Derivative Work.
+            <br><br>
+            — ‘The Licensee’ or ‘You’: any natural or legal person who makes any usage of the Work under the terms of the Licence.
+            <br><br>
+            — ‘Distribution’ or ‘Communication’: any act of selling, giving, lending, renting, distributing, communicating, transmitting, or otherwise making available, online or offline, copies of the Work or providing access to its essential functionalities at the disposal of any other natural or legal person.
+        </p>
+
+    </euim-about-content-loading>
+</ion-content>

package/lib/skeletons/_angular/base-mobile/src/app/features/about/licence-details/licence-details.component.ts

@@ -0,0 +1,7 @@
+import { Component } from '@angular/core';
+
+@Component({
+    templateUrl: './licence-details.component.html'
+})
+export class LicenceDetailsComponent {
+}

package/lib/skeletons/_angular/base-mobile/src/app/features/about/opensource-licences/opensource-licences.component.html

@@ -0,0 +1,11 @@
+<ion-header>
+    <ion-toolbar color="branding">
+        <euim-toolbar>
+            <euim-toolbar-title>{{ 'euim.about.opensource.licences' | translate }}</euim-toolbar-title>
+        </euim-toolbar>
+    </ion-toolbar>
+</ion-header>
+<ion-content>
+    <euim-opensource-licences [items]="items" (clickItem)="onClickedItems($event)">
+    </euim-opensource-licences>
+</ion-content>

package/lib/skeletons/_angular/base-mobile/src/app/features/about/opensource-licences/opensource-licences.component.ts

@@ -0,0 +1,31 @@
+import { Component } from '@angular/core';
+import { NavController } from '@ionic/angular';
+
+@Component({
+    templateUrl: './opensource-licences.component.html'
+})
+export class OpensourceLicencesComponent {
+    constructor(
+        private navCtrl: NavController,
+    ) {}
+
+    items = [
+        { name: 'ionic-framework' },
+        { name: 'angular-framework' },
+        { name: 'swiper.js' },
+        { name: 'ng2-pdf-viewer' },
+        { name: 'file-saver' },
+        { name: 'EUPL' },
+
+    ];
+
+    onNavigate(url: string) {
+        this.navCtrl.navigateForward(url);
+    }
+
+    onClickedItems(clickedItem: string[]): void {
+        console.log('Selected Item - ', clickedItem);
+        this.onNavigate('screen/about/opensource-licences/licence-details');
+    }
+
+}

package/lib/skeletons/_angular/base-mobile/src/app/features/about/privacy-statement/privacy-statement.component.html

@@ -0,0 +1,11 @@
+<ion-header>
+    <ion-toolbar color="branding">
+        <euim-toolbar>
+            <euim-toolbar-title>{{'euim.about.privacy.statement' | translate }}</euim-toolbar-title>
+        </euim-toolbar>
+    </ion-toolbar>
+</ion-header>
+<ion-content>
+    <euim-about-content-loading webUrl="https://www.europeana.eu/en/rights/privacy-policy">
+    </euim-about-content-loading>
+</ion-content>