eiam-user-preference 0.0.13

package/dist/cjs/my-component.cjs.entry.js

@@ -0,0 +1,36 @@
+'use strict';
+
+var index = require('./index-CpBvGZoy.js');
+var index$1 = require('./index.cjs.js');
+
+const myComponentCss = ":host{display:block}";
+
+const MyComponent = class {
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+    }
+    /**
+     * The first name
+     */
+    first;
+    /**
+     * The middle name
+     */
+    middle;
+    /**
+     * The last name
+     */
+    last;
+    getText() {
+        return index$1.format(this.first, this.middle, this.last);
+    }
+    render() {
+        return index.h("div", { key: '76b1efbfabf4194a3615ca3c9f0af80d326fed1c' }, "Hello, World! I'm ", this.getText());
+    }
+};
+MyComponent.style = myComponentCss;
+
+exports.my_component = MyComponent;
+//# sourceMappingURL=my-component.entry.cjs.js.map
+
+//# sourceMappingURL=my-component.cjs.entry.js.map

package/dist/cjs/my-component.cjs.entry.js.map

@@ -0,0 +1 @@
+{"file":"my-component.entry.cjs.js","mappings":";;;;;AAAA,MAAM,cAAc,GAAG,sBAAsB;;MCQhC,WAAW,GAAA,MAAA;;;;AACtB;;AAEG;AACK,IAAA,KAAK;AAEb;;AAEG;AACK,IAAA,MAAM;AAEd;;AAEG;AACK,IAAA,IAAI;IAEJ,OAAO,GAAA;AACb,QAAA,OAAOA,cAAM,CAAC,IAAI,CAAC,KAAK,EAAE,IAAI,CAAC,MAAM,EAAE,IAAI,CAAC,IAAI,CAAC;;IAGnD,MAAM,GAAA;AACJ,QAAA,OAAOC,OAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,wBAAwB,IAAI,CAAC,OAAO,EAAE,CAAO;;;;;;;","names":["format","h"],"sources":["src/components/my-component/my-component.css?tag=my-component&encapsulation=shadow","src/components/my-component/my-component.tsx"],"sourcesContent":[":host {\n  display: block;\n}\n","import { Component, Prop, h } from '@stencil/core';\nimport { format } from '../../utils/utils';\n\n@Component({\n  tag: 'my-component',\n  styleUrl: 'my-component.css',\n  shadow: true,\n})\nexport class MyComponent {\n  /**\n   * The first name\n   */\n  @Prop() first: string;\n\n  /**\n   * The middle name\n   */\n  @Prop() middle: string;\n\n  /**\n   * The last name\n   */\n  @Prop() last: string;\n\n  private getText(): string {\n    return format(this.first, this.middle, this.last);\n  }\n\n  render() {\n    return <div>Hello, World! I'm {this.getText()}</div>;\n  }\n}\n"],"version":3}

package/dist/cjs/my-component.entry.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"my-component.entry.cjs.js","sources":["src/components/my-component/my-component.css?tag=my-component&encapsulation=shadow","src/components/my-component/my-component.tsx"],"sourcesContent":[":host {\n  display: block;\n}\n","import { Component, Prop, h } from '@stencil/core';\nimport { format } from '../../utils/utils';\n\n@Component({\n  tag: 'my-component',\n  styleUrl: 'my-component.css',\n  shadow: true,\n})\nexport class MyComponent {\n  /**\n   * The first name\n   */\n  @Prop() first: string;\n\n  /**\n   * The middle name\n   */\n  @Prop() middle: string;\n\n  /**\n   * The last name\n   */\n  @Prop() last: string;\n\n  private getText(): string {\n    return format(this.first, this.middle, this.last);\n  }\n\n  render() {\n    return <div>Hello, World! I'm {this.getText()}</div>;\n  }\n}\n"],"names":["format","h"],"mappings":";;;;;AAAA,MAAM,cAAc,GAAG,sBAAsB;;MCQhC,WAAW,GAAA,MAAA;;;;AACtB;;AAEG;AACK,IAAA,KAAK;AAEb;;AAEG;AACK,IAAA,MAAM;AAEd;;AAEG;AACK,IAAA,IAAI;IAEJ,OAAO,GAAA;AACb,QAAA,OAAOA,cAAM,CAAC,IAAI,CAAC,KAAK,EAAE,IAAI,CAAC,MAAM,EAAE,IAAI,CAAC,IAAI,CAAC;;IAGnD,MAAM,GAAA;AACJ,QAAA,OAAOC,OAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,wBAAwB,IAAI,CAAC,OAAO,EAAE,CAAO;;;;;;;"}

package/dist/collection/collection-manifest.json

@@ -0,0 +1,13 @@
+{
+  "entries": [
+    "components/eiam-user-preference/eiam-user-preference.js",
+    "components/my-component/my-component.js"
+  ],
+  "compiler": {
+    "name": "@stencil/core",
+    "version": "4.29.1",
+    "typescriptVersion": "5.5.4"
+  },
+  "collections": [],
+  "bundles": []
+}

package/dist/collection/components/eiam-user-preference/eiam-user-preference.css

@@ -0,0 +1,34 @@
+
+.kt-quick-panel.kt-quick-panel--on {
+    -webkit-transition: left 0.3s ease, right 0.3s ease;
+    transition: left 0.3s ease, right 0.3s ease;
+    right: 0;
+    left: auto;
+  }
+  
+  .kt-quick-panel-close {
+    width: 25px;
+    height: 25px;
+    top: 1px;
+    z-index: 1002;
+    -webkit-transition: left 0.3s ease, right 0.3s ease;
+    transition: left 0.3s ease, right 0.3s ease;
+    position: fixed;
+    border: 0;
+    -webkit-box-shadow: none;
+    box-shadow: none;
+    border-radius: 3px;
+    cursor: pointer;
+    outline: none !important;
+    display: -webkit-box;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-box-pack: center;
+    -ms-flex-pack: center;
+    justify-content: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    left: -25px;
+  }
+  

package/dist/collection/components/eiam-user-preference/eiam-user-preference.js

@@ -0,0 +1,446 @@
+import { Host, h } from "@stencil/core";
+export class EiamUserPreference {
+    host;
+    apiUrl = window['config']?.apiUrl || 'http://localhost:5000';
+    currentRouteSlug;
+    payload = {
+        pagination: {
+            pageIndex: 0,
+            pageSize: 1000,
+        },
+        search: {
+            pageName: '',
+        },
+    };
+    userPreferences = {
+        dateFormate: 'dd/MM/yyyy',
+        timeFormate: '',
+        fontSize: null,
+        displayFormat: 4,
+        defaultLandingPageId: '',
+        pageName: '',
+    };
+    dateFormates = ['dd/MM/yyyy', 'MM/dd/yyyy', 'yyyy-MM-dd'];
+    timeFormats = ['h:mm a'];
+    fontSizes = [
+        { label: 'Small', value: '14' },
+        { label: 'Medium', value: '16' },
+        { label: 'Large', value: '18' },
+    ];
+    displayFormats = [];
+    userApplications = [];
+    pages = [];
+    totalPages = 0;
+    isModalOpen = false;
+    isPageModalOpen = false; // Controls the visibility of the secondary modal
+    selectedPage = { id: null, name: '' }; // To store selected page
+    pageParams = {
+        pageName: '',
+        status: 0,
+        pageCategory: 0,
+        cultureId: 0,
+        cultureCode: '',
+        pageNumber: 0,
+        pageSize: 10,
+        applicationId: 0,
+        searchText: '',
+    };
+    pageId;
+    cultureCode;
+    applicationId;
+    async componentWillLoad() {
+        await this.getDisplayFormats();
+        await this.getUserPreferences();
+        await this.getUserApplications();
+    }
+    componentDidLoad() {
+        if (this.host.shadowRoot) {
+            const existingLink = this.host.shadowRoot.querySelector('link[rel="stylesheet"]');
+            if (!existingLink) {
+                const link = document.createElement('link');
+                link.rel = 'stylesheet';
+                link.href = 'https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css';
+                this.host.shadowRoot.appendChild(link);
+                // console.log('FontAwesome added to shadow DOM');
+            }
+            else {
+                console.log('FontAwesome already added to shadow DOM');
+            }
+        }
+        else {
+            console.warn('shadowRoot is null');
+        }
+    }
+    async getDisplayFormats() {
+        try {
+            const headers = {
+                'Content-Type': 'application/json',
+                'IntegrationPermission': '0f5d983d203189bbffc5f686d01f6680bc6a83718a515fe42639347efc92478e',
+                'CultureCode': this.cultureCode,
+                'Source': '2',
+                'applicationId': this.applicationId,
+            };
+            const response = await fetch(`${this.apiUrl}/api/UserPreferences/DisplayFormats`, {
+                method: 'GET', // Specify GET method
+                headers: headers,
+                credentials: 'include', // Include credentials (cookies) in the request
+            });
+            const data = await response.json();
+            if (Array.isArray(data.content)) {
+                this.displayFormats = data.content;
+            }
+            else {
+                console.error('Invalid response structure:', data);
+            }
+        }
+        catch (error) {
+            console.error('Error fetching display formats:', error);
+        }
+    }
+    async getUserPreferences() {
+        try {
+            const headers = {
+                'Content-Type': 'application/json',
+                'IntegrationPermission': '0f5d983d203189bbffc5f686d01f6680bc6a83718a515fe42639347efc92478e',
+                'CultureCode': this.cultureCode,
+                'Source': '2',
+                'applicationId': this.applicationId,
+            };
+            const response = await fetch(`${this.apiUrl}/api/UserPreferences/GetUserPreferences`, {
+                method: 'GET',
+                headers: headers,
+                credentials: 'include',
+            });
+            const data = await response.json();
+            if (data && typeof data !== 'string') {
+                const fontSizeValue = parseFloat(data.fontSize);
+                this.userPreferences = {
+                    ...this.userPreferences,
+                    dateFormate: data.dateFormate || 'dd/MM/yyyy',
+                    timeFormate: data.timeFormate || this.timeFormats[0], // fallback!
+                    fontSize: !isNaN(fontSizeValue) ? fontSizeValue : this.fontSizes[0]?.value,
+                    displayFormat: data.displayFormat || 1,
+                    defaultLandingPageId: data.defaultLandingPageId,
+                    pageName: data?.defaultLandingPageDetails?.name || '',
+                };
+            }
+        }
+        catch (error) {
+            console.error('Error fetching user preferences:', error);
+        }
+    }
+    async getUserApplications() {
+        try {
+            const headers = {
+                'Content-Type': 'application/json',
+                'IntegrationPermission': '0f5d983d203189bbffc5f686d01f6680bc6a83718a515fe42639347efc92478e',
+                'CultureCode': this.cultureCode,
+                'Source': '2',
+                'applicationId': this.applicationId,
+            };
+            const response = await fetch(`${this.apiUrl}/api/OrganizationApplicationsApi/GetAssigndApplicationForUser`, {
+                method: 'GET',
+                headers: headers,
+                credentials: 'include',
+            });
+            const data = await response.json();
+            if (data && Array.isArray(data.content)) {
+                this.userApplications = data.content;
+            }
+            else {
+                console.error('Invalid response structure:', data);
+            }
+        }
+        catch (error) {
+            console.error('Error fetching applications:', error);
+        }
+    }
+    changeApplication(application) {
+        if (application.applicationId) {
+            this.pageParams.applicationId = application.applicationId;
+            this.getPagesSApplications();
+        }
+    }
+    async getPagesSApplications() {
+        const requestBody = {}; // Create the request body (you can modify based on your needs)
+        try {
+            const response = await fetch(`${this.apiUrl}/api/Pages/GetPages`, {
+                method: 'POST',
+                headers: {
+                    'Content-Type': 'application/json',
+                    'IntegrationPermission': '0f5d983d203189bbffc5f686d01f6680bc6a83718a515fe42639347efc92478e',
+                    'CultureCode': this.cultureCode,
+                    'Source': '2',
+                    'applicationId': this.applicationId,
+                },
+                credentials: 'include',
+                body: JSON.stringify(requestBody),
+            });
+            if (!response.ok) {
+                console.error('Failed to fetch pages');
+                return;
+            }
+            const data = await response.json();
+            console.log(data, 'data of all pages ');
+        }
+        catch (error) {
+            console.error('Error fetching pages:', error);
+        }
+    }
+    //   async submitPreferences() {
+    //     const fontSize = this.userPreferences.fontSize ? this.userPreferences.fontSize + 'px' : null;
+    //     const headers = {
+    //       'Content-Type': 'application/json',
+    //       'IntegrationPermission': '0f5d983d203189bbffc5f686d01f6680bc6a83718a515fe42639347efc92478e',
+    //       'CultureCode': this.cultureCode,
+    //       'Source': '2',
+    //       'applicationId': this.applicationId,
+    //     };
+    //     try {
+    //       const response = await fetch(`${this.apiUrl}/api/UserPreferences/SaveUserPreferences`, {
+    //         method: 'POST',
+    //         headers: headers,
+    //         body: JSON.stringify({ ...this.userPreferences, fontSize }),
+    //         credentials: 'include',
+    //       });
+    //       if (!response.ok) {
+    //         console.error('Failed to save preferences:', response.statusText);
+    //         return;
+    //       }
+    //       await this.getUserPreferences();
+    //     } catch (error) {
+    //       console.error('Error submitting preferences:', error);
+    //     }
+    //   }
+    async submitPreferences() {
+        const fontSizeValue = parseFloat(this.userPreferences.fontSize);
+        const fontSize = !isNaN(fontSizeValue) ? `${fontSizeValue}px` : null;
+        const headers = {
+            'Content-Type': 'application/json',
+            'IntegrationPermission': '0f5d983d203189bbffc5f686d01f6680bc6a83718a515fe42639347efc92478e',
+            'CultureCode': this.cultureCode,
+            'Source': '2',
+            'applicationId': this.applicationId,
+        };
+        try {
+            const response = await fetch(`${this.apiUrl}/api/UserPreferences/SaveUserPreferences`, {
+                method: 'POST',
+                headers,
+                body: JSON.stringify({ ...this.userPreferences, fontSize }),
+                credentials: 'include',
+            });
+            if (!response.ok) {
+                console.error('Failed to save preferences:', response.statusText);
+                return;
+            }
+            // Fetch updated preferences
+            const newPrefs = await this.getUserPreferences();
+            if (!newPrefs || typeof newPrefs === 'string')
+                return;
+            // Apply updated preferences like Angular code
+            const { displayFormat, fontSize: newFontSize, dateFormate, timeFormate } = newPrefs;
+            if (displayFormat) {
+                localStorage.setItem('displayFormat', displayFormat);
+                // this.emit('displayFormatUpdated', displayFormat);
+            }
+            if (newFontSize) {
+                document.body.setAttribute('style', `font-size: ${newFontSize} !important`);
+            }
+            localStorage.setItem('dateFormat', dateFormate || 'dd/MM/yyyy');
+            localStorage.setItem('timeFormat', timeFormate || '');
+            // this.emit('dateFormatUpdated', dateFormate || 'dd/MM/yyyy');
+            // this.emit('timeFormatUpdated', timeFormate || '');
+        }
+        catch (error) {
+            console.error('Error submitting preferences:', error);
+        }
+    }
+    async resetPreferences() {
+        try {
+            await fetch(`${this.apiUrl}/api/UserPreferences/Delete`, {
+                method: 'DELETE',
+                credentials: 'include',
+            });
+            this.userPreferences = {
+                dateFormate: 'dd/MM/yyyy',
+                timeFormate: '',
+                fontSize: '',
+                displayFormat: 4,
+                defaultLandingPageId: '',
+                pageName: '',
+            };
+            localStorage.removeItem('dateFormat');
+            localStorage.removeItem('displayFormat');
+            localStorage.removeItem('fontSize');
+            location.reload(); // If you want to refresh the UI
+        }
+        catch (error) {
+            console.error('Failed to reset preferences', error);
+        }
+    }
+    toggleModal() {
+        this.isModalOpen = !this.isModalOpen;
+    }
+    togglePageModal() {
+        this.isPageModalOpen = !this.isPageModalOpen;
+    }
+    selectPage(page) {
+        this.selectedPage = page;
+        this.userPreferences.defaultLandingPageId = page.id; // Update default landing page
+        this.togglePageModal(); // Close the page selection modal
+    }
+    //   render() {
+    //     return (
+    //       <Host>
+    //         <div>
+    //           <i class="fas fa-cogs" onClick={() => this.toggleModal()} style={{ cursor: 'pointer', fontSize: '24px' }}></i>
+    //           {/* Modal */}
+    //           {this.isModalOpen && (
+    //             <div class="modal">
+    //               <div class="modal-content">
+    //                 <span class="close" onClick={() => this.toggleModal()}>
+    //                   &times;
+    //                 </span>
+    //                 <h2>User Preferences</h2>
+    //                 <div>
+    //                   <label>Date Format</label>
+    //                   <select onInput={e => (this.userPreferences.dateFormate = (e.target as HTMLSelectElement).value)}>
+    //                     {this.dateFormates.map(format => (
+    //                       <option value={format} selected={this.userPreferences.dateFormate === format}>
+    //                         {format}
+    //                       </option>
+    //                     ))}
+    //                   </select>
+    //                   <label>Time Format</label>
+    //                   <select onInput={e => (this.userPreferences.timeFormate = (e.target as HTMLSelectElement).value)}>
+    //                     {this.timeFormats.map(format => (
+    //                       <option value={format} selected={this.userPreferences.timeFormate === format}>
+    //                         {format}
+    //                       </option>
+    //                     ))}
+    //                   </select>
+    //                   <label>Font Size</label>
+    //                   <select onInput={e => (this.userPreferences.fontSize = (e.target as HTMLSelectElement).value)}>
+    //                     {this.fontSizes.map(size => (
+    //                       <option value={size.value} selected={this.userPreferences.fontSize === size.value}>
+    //                         {size.label}
+    //                       </option>
+    //                     ))}
+    //                   </select>
+    //                   <label>User Display Format</label>
+    //                   <select onInput={e => (this.userPreferences.displayFormat = parseInt((e.target as HTMLSelectElement).value))}>
+    //                     {this.displayFormats.map(format => (
+    //                       <option value={format.value} selected={this.userPreferences.displayFormat === format.value}>
+    //                         {format.label}
+    //                       </option>
+    //                     ))}
+    //                   </select>
+    //                   <label>Default Landing Page</label>
+    //                   <select onInput={e => (this.userPreferences.defaultLandingPageId = (e.target as HTMLSelectElement).value)}>
+    //                     {this.pages.map(page => (
+    //                       <option value={page.id} selected={this.userPreferences.defaultLandingPageId === page.id}>
+    //                         {page.name}
+    //                       </option>
+    //                     ))}
+    //                   </select>
+    //                   <button onClick={() => this.submitPreferences()}>Save</button>
+    //                   <button onClick={() => this.resetPreferences()}>Reset</button>
+    //                 </div>
+    //               </div>
+    //             </div>
+    //           )}
+    //         </div>
+    //       </Host>
+    //     );
+    //   }
+    render() {
+        return (h(Host, { key: '73268d667553094939f061bcb072bda06c14b214' }, h("div", { key: '9eb1fd24078089437f64a4840f738a1f942452b0' }, h("i", { key: '8ad9ea93263a7695eed25fb3fe33893c22e2a989', class: "fas fa-cogs", onClick: () => this.toggleModal(), style: { cursor: 'pointer', fontSize: '24px' } }), this.isModalOpen && (h("div", { key: '988a1a24b362afc61f0e9398a6c401dacfc42837', class: "kt-quick-panel kt-quick-panel--on" }, h("a", { key: 'd969cf578cab9d74ce3bc9203beab91d7d47f1b2', onClick: () => this.toggleModal(), id: "kt_quick_panel_close_btn", class: "kt-quick-panel__close" }, h("i", { key: 'a575b9ee906bd938bfb324835e56b04f9ce256f1', class: "fas fa-times" })), h("div", { key: 'e35452dc147593b9b10707c8efa15e600d8b38c2', class: "kt-quick-panel__nav" }, h("ul", { key: 'b5eb70a8f79b795e53dd364e6c518f623ea0680c', role: "tablist", class: "nav nav-tabs nav-tabs-line nav-tabs-bold nav-tabs-line-3x nav-tabs-line-brand kt-notification-item-padding-x" }, h("li", { key: '2a4efe276341c924f7c3437643c9aa23f2739ca6', class: "nav-item active" }, h("a", { key: 'a301c57cc56e752b21881037f02abbaf5e721060', "data-toggle": "tab", role: "tab", class: "nav-link active" }, "User Preference")))), h("div", { key: '2a2a0a8df42f12ae43290fa82649492faf118a1a', class: "kt-quick-panel__content" }, h("div", { key: 'df7abede8ff8e7c6219939f32bb097e4126b513c', class: "tab-content" }, h("div", { key: 'aef7806fef44acb6179007e5af991ec1a9ef1148', id: "kt_quick_panel_tab_notifications", role: "tabpanel", class: "tab-pane fade show kt-scroll active ps ps--active-y" }, h("div", { key: 'ceb62ff2e5d97947c7746cc3ba8359a903106261', class: "kt-notification" }, h("div", { key: '345c04d2b76a353e6336d87d6cf7fb0ba831183f', class: "kt-portlet__body" }, h("div", { key: 'e8f3b6eaacea413e7f8fa9a05d7e4a1ecd4f3abf', class: "form-group" }, h("label", { key: '7f4f8b89e8bb8fce52da354579c305edfdbfbd7b' }, "Date Format"), h("select", { key: '802e4604185a71450e19fe0ff80091c11aa607aa', onInput: e => (this.userPreferences.dateFormate = e.target.value) }, this.dateFormates.map(format => (h("option", { value: format, selected: this.userPreferences.dateFormate === format }, format))))), h("div", { key: 'da29120fb40a409f143a212b592455ee0a3e9486', class: "form-group" }, h("label", { key: 'db8adfe511a9647822add835b2e79b35551e8ae8' }, "Time Format"), h("select", { key: 'aa335e039c7509388ae5b0ebb95e38a2dd26dd84', onInput: e => (this.userPreferences.timeFormate = e.target.value) }, this.timeFormats.map(format => (h("option", { value: format, selected: this.userPreferences.timeFormate === format }, format))))), h("div", { key: '95591ac88b995c9a2bc9c7e85dc4d86fabd49111', class: "form-group" }, h("label", { key: 'abcc1107a38ab88df414cb6e0b0f89d30db14edb' }, "Font Size"), h("select", { key: '2500ac6ead59cdfd696fb70de46d80395f09b7ba', onInput: e => (this.userPreferences.fontSize = e.target.value) }, this.fontSizes.map(size => (h("option", { value: size.value, selected: this.userPreferences.fontSize === size.value }, size.label))))), h("div", { key: '8e28e4ea701c85a9df01c6e377ff41e0775d217f', class: "form-group" }, h("label", { key: '63a1fca56a0bdae7c4aa91f97e00e764d130b61d' }, "User Display Format"), h("select", { key: 'd637292ae9df0ad9694119d3ed9eb653aa318350', onInput: e => (this.userPreferences.displayFormat = parseInt(e.target.value)) }, this.displayFormats.map(format => (h("option", { value: format.value, selected: this.userPreferences.displayFormat === format.value }, format.label))))), h("div", { key: 'a05f5a4620222485b3d70e662675f79a344cbfc6', class: "form-group" }, h("label", { key: '163feb5c4c8707d3b5de2e7ece82d725de954814' }, "Default Landing Page"), h("div", { key: 'f45690926ace8996450fc90856d725c49ad87efd', class: "input-group", onClick: () => this.togglePageModal() }, h("div", { key: '96be1b6688f8b8d354662e2978d5d767c2d097b5', class: "input-group-prepend" }, h("span", { key: '71f477fe498f90e3b440fdde31fb17e7ffa6743e', class: "input-group-text" }, h("i", { key: '5491f0b4b917a953590e9d3b40ac04fcf767a357', class: "fas fa-link" }))), h("input", { key: '8ab0f12f72e0a2911a8803c79409de0fdbc9a935', type: "text", class: "form-control", readonly: true, value: this.selectedPage.name || 'Select page', placeholder: "Select page" })))), h("div", { key: 'd031e47045efa5108f70e7d1e97700b348c34654', class: "kt-portlet__foot" }, h("div", { key: 'fc41e360f1331381d73bac4f9bb0c6c89ae3262c', class: "kt-form__actions" }, h("button", { key: 'f6e0948a440fbd83885bd20549ddc2bbddf3219c', class: "btn btn-primary", onClick: () => this.submitPreferences() }, "Save"), h("button", { key: 'db3e6b974e20adb93c7dcca03fa52dfdbea57d82', class: "btn btn-secondary", onClick: () => this.resetPreferences() }, "Reset"))))))))), this.isPageModalOpen && (h("div", { key: '36ed3547d24490064ad098ff6893f64abafa612f', class: "modal-dialog modal-md landing-modal" }, h("div", { key: '425a4cdbe00179fb0628ddd46f1ea8699c52aa8b', class: "modal-content landing-page" }, h("div", { key: '0ea6be6c543941262e28a029990bf3d5a3d65f6b', class: "modal-header" }, h("h4", { key: '36644da5cf638a4c24179cc553ec74db1705315e', class: "modal-title pull-left" }, " Default Landing Page "), h("button", { key: 'e59f82a9c151a80ae4300e432172d767e819ba9a', onClick: () => this.togglePageModal(), type: "button", "aria-label": "Close", class: "close pull-right" }, h("span", { key: '6c36480c025d8c7a9ddbee1ca2c3d8c15b01b917' }, h("i", { key: '22e67e915e5dc2cdee997c48b548710c9038941f', class: "fas fa-times" })))), h("div", { key: '5afc1b174e337ac3656d7f2a268d245acb65a8a2', class: "modal-body" }, h("div", { key: '08b55625de4683aad5c3eeede962029701b7d8c6', class: "row" }, h("div", { key: 'f7eebf3e41024676b42c956addef734e18aa2d05', class: "col-12" }, h("div", { key: '2e4bec9be8c15162b43e202623ebf79367783ff0', class: "row" }, h("div", { key: 'd10ec0ce280235ad7bdad74d65f1158e53966519', class: "form-group" }, h("label", { key: 'c67179f8a27436aeec5a209a4b6a169f31bc367b', htmlFor: "" }, " Default Landing Page "), h("select", { key: 'bf0f2664891f7b581ee60cba7c14296e25f2e218', onInput: e => this.changeApplication(e) }, this.userApplications.map(application => (h("option", { value: application.applicationId }, application.applicationName)))))), h("label", { key: '17fa28c79845986510a0d2a538251673cdde4dc6' }, "Select Page"), h("div", { key: 'ceaf84ad32062d5b3a6c125b77f4b8c37c82ca37', style: { maxHeight: '300px', overflowY: 'auto', overflowX: 'hidden' } }, this.pages.map(page => (h("div", { class: "slug-item", onClick: () => this.selectPage(page) }, h("div", { class: "row" }, h("span", { class: "text-brand", style: { fontWeight: '600', lineHeight: '1' } }, page.name), h("small", { class: {
+                'culture-unpublished': page.pageCultureStatus == 1,
+                'culture-published': page.pageCultureStatus == 2,
+            } }, "| ", page.cultureCode)))))), h("div", { key: 'fe6fd591d3f70ed1903b49d927b6efd3006d82cf', class: "d-flex justify-content-center mt-2 pagination-class" }))))))))));
+    }
+    static get is() { return "eiam-user-preference"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["eiam-user-preference.css"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["eiam-user-preference.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "cultureCode": {
+                "type": "string",
+                "attribute": "culture-code",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false
+            },
+            "applicationId": {
+                "type": "string",
+                "attribute": "application-id",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false
+            }
+        };
+    }
+    static get states() {
+        return {
+            "currentRouteSlug": {},
+            "payload": {},
+            "userPreferences": {},
+            "dateFormates": {},
+            "timeFormats": {},
+            "fontSizes": {},
+            "displayFormats": {},
+            "userApplications": {},
+            "pages": {},
+            "totalPages": {},
+            "isModalOpen": {},
+            "isPageModalOpen": {},
+            "selectedPage": {},
+            "pageParams": {},
+            "pageId": {}
+        };
+    }
+    static get elementRef() { return "host"; }
+    static get watchers() {
+        return [{
+                "propName": "cultureCode",
+                "methodName": "componentWillLoad"
+            }, {
+                "propName": "applicationId",
+                "methodName": "componentWillLoad"
+            }];
+    }
+}
+//# sourceMappingURL=eiam-user-preference.js.map

package/dist/collection/components/eiam-user-preference/eiam-user-preference.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"eiam-user-preference.js","sourceRoot":"","sources":["../../../src/components/eiam-user-preference/eiam-user-preference.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Host, Prop, State, Watch, h, Element } from '@stencil/core';\r\n\r\n@Component({\r\n  tag: 'eiam-user-preference',\r\n  styleUrl: 'eiam-user-preference.css',\r\n  shadow: true,\r\n})\r\nexport class EiamUserPreference {\r\n  @Element() host: HTMLElement;\r\n  apiUrl = window['config']?.apiUrl || 'http://localhost:5000';\r\n  @State() currentRouteSlug: string;\r\n  @State() payload = {\r\n    pagination: {\r\n      pageIndex: 0,\r\n      pageSize: 1000,\r\n    },\r\n    search: {\r\n      pageName: '',\r\n    },\r\n  };\r\n  @State() userPreferences = {\r\n    dateFormate: 'dd/MM/yyyy',\r\n    timeFormate: '',\r\n    fontSize: null,\r\n    displayFormat: 4,\r\n    defaultLandingPageId: '',\r\n    pageName: '',\r\n  };\r\n\r\n  @State() dateFormates: string[] = ['dd/MM/yyyy', 'MM/dd/yyyy', 'yyyy-MM-dd'];\r\n  @State() timeFormats: string[] = ['h:mm a'];\r\n  @State() fontSizes = [\r\n    { label: 'Small', value: '14' },\r\n    { label: 'Medium', value: '16' },\r\n    { label: 'Large', value: '18' },\r\n  ];\r\n  @State() displayFormats: any[] = [];\r\n  @State() userApplications: any[] = [];\r\n  @State() pages: any[] = [];\r\n  @State() totalPages: number = 0;\r\n  @State() isModalOpen = false;\r\n  @State() isPageModalOpen: boolean = false; // Controls the visibility of the secondary modal\r\n  @State() selectedPage: { id: number; name: string } = { id: null, name: '' }; // To store selected page\r\n\r\n  @State() pageParams = {\r\n    pageName: '',\r\n    status: 0,\r\n    pageCategory: 0,\r\n    cultureId: 0,\r\n    cultureCode: '',\r\n    pageNumber: 0,\r\n    pageSize: 10,\r\n    applicationId: 0,\r\n    searchText: '',\r\n  };\r\n  @State() pageId: any;\r\n  @Prop() cultureCode: string;\r\n  @Prop() applicationId: string;\r\n\r\n  @Watch('cultureCode')\r\n  @Watch('applicationId')\r\n  async componentWillLoad() {\r\n    await this.getDisplayFormats();\r\n    await this.getUserPreferences();\r\n    await this.getUserApplications();\r\n  }\r\n  componentDidLoad() {\r\n    if (this.host.shadowRoot) {\r\n      const existingLink = this.host.shadowRoot.querySelector('link[rel=\"stylesheet\"]');\r\n      if (!existingLink) {\r\n        const link = document.createElement('link');\r\n        link.rel = 'stylesheet';\r\n        link.href = 'https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css';\r\n        this.host.shadowRoot.appendChild(link);\r\n        // console.log('FontAwesome added to shadow DOM');\r\n      } else {\r\n        console.log('FontAwesome already added to shadow DOM');\r\n      }\r\n    } else {\r\n      console.warn('shadowRoot is null');\r\n    }\r\n  }\r\n  async getDisplayFormats() {\r\n    try {\r\n      const headers = {\r\n        'Content-Type': 'application/json',\r\n        'IntegrationPermission': '0f5d983d203189bbffc5f686d01f6680bc6a83718a515fe42639347efc92478e',\r\n        'CultureCode': this.cultureCode,\r\n        'Source': '2',\r\n        'applicationId': this.applicationId,\r\n      };\r\n\r\n      const response = await fetch(`${this.apiUrl}/api/UserPreferences/DisplayFormats`, {\r\n        method: 'GET', // Specify GET method\r\n        headers: headers,\r\n        credentials: 'include', // Include credentials (cookies) in the request\r\n      });\r\n\r\n      const data = await response.json();\r\n\r\n      if (Array.isArray(data.content)) {\r\n        this.displayFormats = data.content;\r\n      } else {\r\n        console.error('Invalid response structure:', data);\r\n      }\r\n    } catch (error) {\r\n      console.error('Error fetching display formats:', error);\r\n    }\r\n  }\r\n\r\n  async getUserPreferences() {\r\n    try {\r\n      const headers = {\r\n        'Content-Type': 'application/json',\r\n        'IntegrationPermission': '0f5d983d203189bbffc5f686d01f6680bc6a83718a515fe42639347efc92478e',\r\n        'CultureCode': this.cultureCode,\r\n        'Source': '2',\r\n        'applicationId': this.applicationId,\r\n      };\r\n\r\n      const response = await fetch(`${this.apiUrl}/api/UserPreferences/GetUserPreferences`, {\r\n        method: 'GET',\r\n        headers: headers,\r\n        credentials: 'include',\r\n      });\r\n\r\n      const data = await response.json();\r\n\r\n      if (data && typeof data !== 'string') {\r\n        const fontSizeValue = parseFloat(data.fontSize);\r\n        this.userPreferences = {\r\n          ...this.userPreferences,\r\n          dateFormate: data.dateFormate || 'dd/MM/yyyy',\r\n          timeFormate: data.timeFormate || this.timeFormats[0], // fallback!\r\n          fontSize: !isNaN(fontSizeValue) ? fontSizeValue : this.fontSizes[0]?.value,\r\n          displayFormat: data.displayFormat || 1,\r\n          defaultLandingPageId: data.defaultLandingPageId,\r\n          pageName: data?.defaultLandingPageDetails?.name || '',\r\n        };\r\n      }\r\n    } catch (error) {\r\n      console.error('Error fetching user preferences:', error);\r\n    }\r\n  }\r\n\r\n  async getUserApplications() {\r\n    try {\r\n      const headers = {\r\n        'Content-Type': 'application/json',\r\n        'IntegrationPermission': '0f5d983d203189bbffc5f686d01f6680bc6a83718a515fe42639347efc92478e',\r\n        'CultureCode': this.cultureCode,\r\n        'Source': '2',\r\n        'applicationId': this.applicationId,\r\n      };\r\n\r\n      const response = await fetch(`${this.apiUrl}/api/OrganizationApplicationsApi/GetAssigndApplicationForUser`, {\r\n        method: 'GET',\r\n        headers: headers,\r\n        credentials: 'include',\r\n      });\r\n\r\n      const data = await response.json();\r\n\r\n      if (data && Array.isArray(data.content)) {\r\n        this.userApplications = data.content;\r\n      } else {\r\n        console.error('Invalid response structure:', data);\r\n      }\r\n    } catch (error) {\r\n      console.error('Error fetching applications:', error);\r\n    }\r\n  }\r\n  changeApplication(application) {\r\n    if (application.applicationId) {\r\n      this.pageParams.applicationId = application.applicationId;\r\n      this.getPagesSApplications();\r\n    }\r\n  }\r\n\r\n  async getPagesSApplications() {\r\n    const requestBody = {}; // Create the request body (you can modify based on your needs)\r\n\r\n    try {\r\n      const response = await fetch(`${this.apiUrl}/api/Pages/GetPages`, {\r\n        method: 'POST',\r\n        headers: {\r\n          'Content-Type': 'application/json',\r\n          'IntegrationPermission': '0f5d983d203189bbffc5f686d01f6680bc6a83718a515fe42639347efc92478e',\r\n          'CultureCode': this.cultureCode,\r\n          'Source': '2',\r\n          'applicationId': this.applicationId,\r\n        },\r\n        credentials: 'include',\r\n        body: JSON.stringify(requestBody),\r\n      });\r\n\r\n      if (!response.ok) {\r\n        console.error('Failed to fetch pages');\r\n        return;\r\n      }\r\n\r\n      const data = await response.json();\r\n      console.log(data, 'data of all pages ');\r\n    } catch (error) {\r\n      console.error('Error fetching pages:', error);\r\n    }\r\n  }\r\n\r\n  //   async submitPreferences() {\r\n  //     const fontSize = this.userPreferences.fontSize ? this.userPreferences.fontSize + 'px' : null;\r\n\r\n  //     const headers = {\r\n  //       'Content-Type': 'application/json',\r\n  //       'IntegrationPermission': '0f5d983d203189bbffc5f686d01f6680bc6a83718a515fe42639347efc92478e',\r\n  //       'CultureCode': this.cultureCode,\r\n  //       'Source': '2',\r\n  //       'applicationId': this.applicationId,\r\n  //     };\r\n\r\n  //     try {\r\n  //       const response = await fetch(`${this.apiUrl}/api/UserPreferences/SaveUserPreferences`, {\r\n  //         method: 'POST',\r\n  //         headers: headers,\r\n  //         body: JSON.stringify({ ...this.userPreferences, fontSize }),\r\n  //         credentials: 'include',\r\n  //       });\r\n\r\n  //       if (!response.ok) {\r\n  //         console.error('Failed to save preferences:', response.statusText);\r\n  //         return;\r\n  //       }\r\n\r\n  //       await this.getUserPreferences();\r\n  //     } catch (error) {\r\n  //       console.error('Error submitting preferences:', error);\r\n  //     }\r\n  //   }\r\n  async submitPreferences() {\r\n    const fontSizeValue = parseFloat(this.userPreferences.fontSize);\r\n    const fontSize = !isNaN(fontSizeValue) ? `${fontSizeValue}px` : null;\r\n\r\n    const headers = {\r\n      'Content-Type': 'application/json',\r\n      'IntegrationPermission': '0f5d983d203189bbffc5f686d01f6680bc6a83718a515fe42639347efc92478e',\r\n      'CultureCode': this.cultureCode,\r\n      'Source': '2',\r\n      'applicationId': this.applicationId,\r\n    };\r\n\r\n    try {\r\n      const response = await fetch(`${this.apiUrl}/api/UserPreferences/SaveUserPreferences`, {\r\n        method: 'POST',\r\n        headers,\r\n        body: JSON.stringify({ ...this.userPreferences, fontSize }),\r\n        credentials: 'include',\r\n      });\r\n\r\n      if (!response.ok) {\r\n        console.error('Failed to save preferences:', response.statusText);\r\n        return;\r\n      }\r\n\r\n      // Fetch updated preferences\r\n      const newPrefs: any = await this.getUserPreferences();\r\n      if (!newPrefs || typeof newPrefs === 'string') return;\r\n\r\n      // Apply updated preferences like Angular code\r\n      const { displayFormat, fontSize: newFontSize, dateFormate, timeFormate } = newPrefs;\r\n\r\n      if (displayFormat) {\r\n        localStorage.setItem('displayFormat', displayFormat);\r\n        // this.emit('displayFormatUpdated', displayFormat);\r\n      }\r\n\r\n      if (newFontSize) {\r\n        document.body.setAttribute('style', `font-size: ${newFontSize} !important`);\r\n      }\r\n\r\n      localStorage.setItem('dateFormat', dateFormate || 'dd/MM/yyyy');\r\n      localStorage.setItem('timeFormat', timeFormate || '');\r\n\r\n      // this.emit('dateFormatUpdated', dateFormate || 'dd/MM/yyyy');\r\n      // this.emit('timeFormatUpdated', timeFormate || '');\r\n    } catch (error) {\r\n      console.error('Error submitting preferences:', error);\r\n    }\r\n  }\r\n\r\n  async resetPreferences() {\r\n    try {\r\n      await fetch(`${this.apiUrl}/api/UserPreferences/Delete`, {\r\n        method: 'DELETE',\r\n        credentials: 'include',\r\n      });\r\n\r\n      this.userPreferences = {\r\n        dateFormate: 'dd/MM/yyyy',\r\n        timeFormate: '',\r\n        fontSize: '',\r\n        displayFormat: 4,\r\n        defaultLandingPageId: '',\r\n        pageName: '',\r\n      };\r\n\r\n      localStorage.removeItem('dateFormat');\r\n      localStorage.removeItem('displayFormat');\r\n      localStorage.removeItem('fontSize');\r\n\r\n      location.reload(); // If you want to refresh the UI\r\n    } catch (error) {\r\n      console.error('Failed to reset preferences', error);\r\n    }\r\n  }\r\n  toggleModal() {\r\n    this.isModalOpen = !this.isModalOpen;\r\n  }\r\n  togglePageModal() {\r\n    this.isPageModalOpen = !this.isPageModalOpen;\r\n  }\r\n  selectPage(page: { id: any; name: string }) {\r\n    this.selectedPage = page;\r\n    this.userPreferences.defaultLandingPageId = page.id; // Update default landing page\r\n    this.togglePageModal(); // Close the page selection modal\r\n  }\r\n\r\n  //   render() {\r\n  //     return (\r\n  //       <Host>\r\n  //         <div>\r\n  //           <i class=\"fas fa-cogs\" onClick={() => this.toggleModal()} style={{ cursor: 'pointer', fontSize: '24px' }}></i>\r\n\r\n  //           {/* Modal */}\r\n  //           {this.isModalOpen && (\r\n  //             <div class=\"modal\">\r\n  //               <div class=\"modal-content\">\r\n  //                 <span class=\"close\" onClick={() => this.toggleModal()}>\r\n  //                   &times;\r\n  //                 </span>\r\n  //                 <h2>User Preferences</h2>\r\n  //                 <div>\r\n  //                   <label>Date Format</label>\r\n  //                   <select onInput={e => (this.userPreferences.dateFormate = (e.target as HTMLSelectElement).value)}>\r\n  //                     {this.dateFormates.map(format => (\r\n  //                       <option value={format} selected={this.userPreferences.dateFormate === format}>\r\n  //                         {format}\r\n  //                       </option>\r\n  //                     ))}\r\n  //                   </select>\r\n\r\n  //                   <label>Time Format</label>\r\n  //                   <select onInput={e => (this.userPreferences.timeFormate = (e.target as HTMLSelectElement).value)}>\r\n  //                     {this.timeFormats.map(format => (\r\n  //                       <option value={format} selected={this.userPreferences.timeFormate === format}>\r\n  //                         {format}\r\n  //                       </option>\r\n  //                     ))}\r\n  //                   </select>\r\n\r\n  //                   <label>Font Size</label>\r\n  //                   <select onInput={e => (this.userPreferences.fontSize = (e.target as HTMLSelectElement).value)}>\r\n  //                     {this.fontSizes.map(size => (\r\n  //                       <option value={size.value} selected={this.userPreferences.fontSize === size.value}>\r\n  //                         {size.label}\r\n  //                       </option>\r\n  //                     ))}\r\n  //                   </select>\r\n\r\n  //                   <label>User Display Format</label>\r\n  //                   <select onInput={e => (this.userPreferences.displayFormat = parseInt((e.target as HTMLSelectElement).value))}>\r\n  //                     {this.displayFormats.map(format => (\r\n  //                       <option value={format.value} selected={this.userPreferences.displayFormat === format.value}>\r\n  //                         {format.label}\r\n  //                       </option>\r\n  //                     ))}\r\n  //                   </select>\r\n\r\n  //                   <label>Default Landing Page</label>\r\n  //                   <select onInput={e => (this.userPreferences.defaultLandingPageId = (e.target as HTMLSelectElement).value)}>\r\n  //                     {this.pages.map(page => (\r\n  //                       <option value={page.id} selected={this.userPreferences.defaultLandingPageId === page.id}>\r\n  //                         {page.name}\r\n  //                       </option>\r\n  //                     ))}\r\n  //                   </select>\r\n\r\n  //                   <button onClick={() => this.submitPreferences()}>Save</button>\r\n  //                   <button onClick={() => this.resetPreferences()}>Reset</button>\r\n  //                 </div>\r\n  //               </div>\r\n  //             </div>\r\n  //           )}\r\n  //         </div>\r\n  //       </Host>\r\n  //     );\r\n  //   }\r\n  render() {\r\n    return (\r\n      <Host>\r\n        <div>\r\n          {/* User Preferences Modal Trigger */}\r\n          <i class=\"fas fa-cogs\" onClick={() => this.toggleModal()} style={{ cursor: 'pointer', fontSize: '24px' }}></i>\r\n\r\n          {/* Main Modal */}\r\n          {this.isModalOpen && (\r\n            <div class=\"kt-quick-panel kt-quick-panel--on\">\r\n              <a onClick={() => this.toggleModal()} id=\"kt_quick_panel_close_btn\" class=\"kt-quick-panel__close\">\r\n                <i class=\"fas fa-times\"></i>\r\n              </a>\r\n              <div class=\"kt-quick-panel__nav\">\r\n                <ul role=\"tablist\" class=\"nav nav-tabs nav-tabs-line nav-tabs-bold nav-tabs-line-3x nav-tabs-line-brand kt-notification-item-padding-x\">\r\n                  <li class=\"nav-item active\">\r\n                    <a data-toggle=\"tab\" role=\"tab\" class=\"nav-link active\">\r\n                      User Preference\r\n                    </a>\r\n                  </li>\r\n                </ul>\r\n              </div>\r\n\r\n              <div class=\"kt-quick-panel__content\">\r\n                <div class=\"tab-content\">\r\n                  <div id=\"kt_quick_panel_tab_notifications\" role=\"tabpanel\" class=\"tab-pane fade show kt-scroll active ps ps--active-y\">\r\n                    <div class=\"kt-notification\">\r\n                      <div class=\"kt-portlet__body\">\r\n                        <div class=\"form-group\">\r\n                          <label>Date Format</label>\r\n                          <select onInput={e => (this.userPreferences.dateFormate = (e.target as HTMLSelectElement).value)}>\r\n                            {this.dateFormates.map(format => (\r\n                              <option value={format} selected={this.userPreferences.dateFormate === format}>\r\n                                {format}\r\n                              </option>\r\n                            ))}\r\n                          </select>\r\n                        </div>\r\n\r\n                        <div class=\"form-group\">\r\n                          <label>Time Format</label>\r\n                          <select onInput={e => (this.userPreferences.timeFormate = (e.target as HTMLSelectElement).value)}>\r\n                            {this.timeFormats.map(format => (\r\n                              <option value={format} selected={this.userPreferences.timeFormate === format}>\r\n                                {format}\r\n                              </option>\r\n                            ))}\r\n                          </select>\r\n                        </div>\r\n\r\n                        <div class=\"form-group\">\r\n                          <label>Font Size</label>\r\n                          <select onInput={e => (this.userPreferences.fontSize = (e.target as HTMLSelectElement).value)}>\r\n                            {this.fontSizes.map(size => (\r\n                              <option value={size.value} selected={this.userPreferences.fontSize === size.value}>\r\n                                {size.label}\r\n                              </option>\r\n                            ))}\r\n                          </select>\r\n                        </div>\r\n\r\n                        <div class=\"form-group\">\r\n                          <label>User Display Format</label>\r\n                          <select onInput={e => (this.userPreferences.displayFormat = parseInt((e.target as HTMLSelectElement).value))}>\r\n                            {this.displayFormats.map(format => (\r\n                              <option value={format.value} selected={this.userPreferences.displayFormat === format.value}>\r\n                                {format.label}\r\n                              </option>\r\n                            ))}\r\n                          </select>\r\n                        </div>\r\n\r\n                        <div class=\"form-group\">\r\n                          <label>Default Landing Page</label>\r\n                          <div class=\"input-group\" onClick={() => this.togglePageModal()}>\r\n                            <div class=\"input-group-prepend\">\r\n                              <span class=\"input-group-text\">\r\n                                <i class=\"fas fa-link\"></i>\r\n                              </span>\r\n                            </div>\r\n                            <input type=\"text\" class=\"form-control\" readonly value={this.selectedPage.name || 'Select page'} placeholder=\"Select page\" />\r\n                          </div>\r\n                        </div>\r\n                      </div>\r\n                      <div class=\"kt-portlet__foot\">\r\n                        <div class=\"kt-form__actions\">\r\n                          <button class=\"btn btn-primary\" onClick={() => this.submitPreferences()}>\r\n                            Save\r\n                          </button>\r\n                          <button class=\"btn btn-secondary\" onClick={() => this.resetPreferences()}>\r\n                            Reset\r\n                          </button>\r\n                        </div>\r\n                      </div>\r\n                    </div>\r\n                  </div>\r\n                </div>\r\n              </div>\r\n            </div>\r\n          )}\r\n\r\n          {/* Page Selection Modal */}\r\n\r\n          {this.isPageModalOpen && (\r\n            <div class=\"modal-dialog modal-md landing-modal\">\r\n              <div class=\"modal-content landing-page\">\r\n                <div class=\"modal-header\">\r\n                  <h4 class=\"modal-title pull-left\"> Default Landing Page </h4>\r\n                  <button onClick={() => this.togglePageModal()} type=\"button\" aria-label=\"Close\" class=\"close pull-right\">\r\n                    <span>\r\n                      <i class=\"fas fa-times\"></i>\r\n                    </span>\r\n                  </button>\r\n                </div>\r\n\r\n                <div class=\"modal-body\">\r\n                  <div class=\"row\">\r\n                    <div class=\"col-12\">\r\n                      <div class=\"row\">\r\n                        <div class=\"form-group\">\r\n                          <label htmlFor=\"\"> Default Landing Page </label>\r\n                          <select onInput={e => this.changeApplication(e)}>\r\n                            {this.userApplications.map(application => (\r\n                              <option value={application.applicationId}>{application.applicationName}</option>\r\n                            ))}\r\n                          </select>\r\n                        </div>\r\n                      </div>\r\n\r\n                      <label>Select Page</label>\r\n                      <div style={{ maxHeight: '300px', overflowY: 'auto', overflowX: 'hidden' }}>\r\n                        {this.pages.map(page => (\r\n                          <div class=\"slug-item\" onClick={() => this.selectPage(page)}>\r\n                            <div class=\"row\">\r\n                              <span class=\"text-brand\" style={{ fontWeight: '600', lineHeight: '1' }}>\r\n                                {page.name}\r\n                              </span>\r\n                              <small\r\n                                class={{\r\n                                  'culture-unpublished': page.pageCultureStatus == 1,\r\n                                  'culture-published': page.pageCultureStatus == 2,\r\n                                }}\r\n                              >\r\n                                | {page.cultureCode}\r\n                              </small>\r\n                            </div>\r\n                          </div>\r\n                        ))}\r\n                      </div>\r\n                      <div class=\"d-flex justify-content-center mt-2 pagination-class\">\r\n                        {/* <pagination\r\n                    totalItems={this.totalPages}\r\n                    maxSize={10}\r\n                    itemsPerPage={this.pageParams.pageSize}\r\n                    boundaryLinks={true}\r\n                    onPageChanged={event => this.changePage(event)}\r\n                  /> */}\r\n                      </div>\r\n                    </div>\r\n                  </div>\r\n                </div>\r\n              </div>\r\n            </div>\r\n          )}\r\n        </div>\r\n      </Host>\r\n    );\r\n  }\r\n}\r\n"]}

package/dist/collection/components/my-component/my-component.css

@@ -0,0 +1,3 @@
+:host {
+  display: block;
+}