[ch39548] Etools-modules-common improvements

intervention-metadata/fund-reservations/fund-reservations.ts

@@ -1,5 +1,5 @@
 import {LitElement, html} from 'lit';
-import {customElement, property} from 'lit/decorators.js';
+import {customElement, property, query} from 'lit/decorators.js';
 import '@unicef-polymer/etools-unicef/src/etools-icons/etools-icon';
 
 import '@unicef-polymer/etools-unicef/src/etools-content-panel/etools-content-panel';
@@ -27,18 +27,18 @@ import {getStore} from '@unicef-polymer/etools-utils/dist/store.util';
 import {sharedStyles} from '@unicef-polymer/etools-modules-common/dist/styles/shared-styles-lit';
 import FrNumbersConsistencyMixin from '@unicef-polymer/etools-modules-common/dist/mixins/fr-numbers-consistency-mixin';
 import {frWarningsStyles} from '@unicef-polymer/etools-modules-common/dist/styles/fr-warnings-styles';
-import ContentPanelMixin from '@unicef-polymer/etools-modules-common/dist/mixins/content-panel-mixin';
 import {getArraysDiff} from '@unicef-polymer/etools-utils/dist/array.util';
 import {listenForLangChanged} from '@unicef-polymer/etools-unicef/src/etools-translate';
 import {openDialog} from '@unicef-polymer/etools-utils/dist/dialog.util';
 import '@unicef-polymer/etools-modules-common/dist/layout/are-you-sure';
 import '@unicef-polymer/etools-unicef/src/etools-icon-button/etools-icon-button';
+import {EtoolsContentPanel} from '@unicef-polymer/etools-unicef/src/etools-content-panel/etools-content-panel';
 
 /**
  * @customElement
  */
 @customElement('gdd-fund-reservations')
-export class GDDFundReservations extends CommentsMixin(ContentPanelMixin(FrNumbersConsistencyMixin(LitElement))) {
+export class GDDFundReservations extends CommentsMixin(FrNumbersConsistencyMixin(LitElement)) {
   static get styles() {
     return [frWarningsStyles];
   }
@@ -116,6 +116,9 @@ export class GDDFundReservations extends CommentsMixin(ContentPanelMixin(FrNumbe
     `;
   }
 
+  @query('etools-content-panel')
+  contentPanel?: EtoolsContentPanel;
+
   @property({type: Object})
   permissions!: Permission<GDDFundReservationsPermissions>;
 
@@ -206,7 +209,9 @@ export class GDDFundReservations extends CommentsMixin(ContentPanelMixin(FrNumbe
     this.frsDialogEl.data = frs;
     this.frsDialogEl.interventionStatus = this.intervention.status;
     this.frsDialogEl.openDialog();
-    this.openContentPanel();
+    if (this.contentPanel) {
+      this.contentPanel.open = true;
+    }
   }
 
   // get original/initial intervention frs numbers

intervention-metadata/review-and-sign/review-and-sign.ts

@@ -31,7 +31,7 @@ import {CommentsMixin} from '../../common/components/comments/comments-mixin';
 import {AsyncAction, EtoolsEndpoint, MinimalUser, Permission, User} from '@unicef-polymer/etools-types';
 import {MinimalAgreement} from '@unicef-polymer/etools-types';
 import {translate} from '@unicef-polymer/etools-unicef/src/etools-translate';
-import {sectionContentStyles} from '@unicef-polymer/etools-modules-common/dist/styles/content-section-styles-polymer';
+import {contentSectionStylesLit} from '@unicef-polymer/etools-modules-common/dist/styles/content-section-styles-lit';
 import {getEndpoint} from '@unicef-polymer/etools-utils/dist/endpoint.util';
 import {gddEndpoints} from '../../utils/intervention-endpoints';
 import {EtoolsUpload} from '@unicef-polymer/etools-unicef/src/etools-upload';
@@ -45,7 +45,7 @@ import {RequestEndpoint} from '@unicef-polymer/etools-utils/dist/etools-ajax/aja
 @customElement('gdd-review-and-sign')
 export class GDDInterventionReviewAndSign extends CommentsMixin(ComponentBaseMixin(UploadMixin(LitElement))) {
   static get styles() {
-    return [layoutStyles];
+    return [contentSectionStylesLit, layoutStyles];
   }
   render() {
     if (!this.data || !this.permissions) {
@@ -55,7 +55,7 @@ export class GDDInterventionReviewAndSign extends CommentsMixin(ComponentBaseMix
     return html`
     ${sharedStyles}
       <style>
-        ${sectionContentStyles}:host {
+        :host {
           display: flex;
           flex-direction: column;
           width: 100%;

intervention-timing/reporting-requirements/partner-reporting-requirements.ts

@@ -26,7 +26,7 @@ import {sharedStyles} from '@unicef-polymer/etools-modules-common/dist/styles/sh
 import {callClickOnSpacePushListener} from '@unicef-polymer/etools-utils/dist/accessibility.util';
 import {translate} from '@unicef-polymer/etools-unicef/src/etools-translate';
 import {gddTranslatesMap} from '../../utils/intervention-labels-map';
-import {sectionContentStyles} from '@unicef-polymer/etools-modules-common/dist/styles/content-section-styles-polymer';
+import {contentSectionStylesLit} from '@unicef-polymer/etools-modules-common/dist/styles/content-section-styles-lit';
 import '@unicef-polymer/etools-unicef/src/etools-info-tooltip/info-icon-tooltip';
 import '@unicef-polymer/etools-unicef/src/etools-icon-button/etools-icon-button';
 import {isActiveTab} from '../../utils/utils';
@@ -38,11 +38,11 @@ import {isActiveTab} from '../../utils/utils';
 @customElement('gdd-partner-reporting-requirements')
 export class GDDPartnerReportingRequirements extends connectStore(LitElement) {
   static get styles() {
-    return [layoutStyles];
+    return [contentSectionStylesLit, layoutStyles];
   }
   render() {
     return html`
-      ${sectionContentStyles} ${sharedStyles}
+      ${sharedStyles}
       <style>
         :host {
           display: block;

intervention-workplan/results-structure/results-structure.ts

@@ -1,6 +1,6 @@
 import {getStore} from '@unicef-polymer/etools-utils/dist/store.util';
 import {css, html, CSSResultArray, LitElement} from 'lit';
-import {property, customElement} from 'lit/decorators.js';
+import {property, customElement, query} from 'lit/decorators.js';
 import {repeat} from 'lit/directives/repeat.js';
 import {layoutStyles} from '@unicef-polymer/etools-unicef/src/styles/layout-styles';
 import {
@@ -46,7 +46,7 @@ import {
 } from '@unicef-polymer/etools-types';
 import {translate} from '@unicef-polymer/etools-unicef/src/etools-translate';
 import {gddTranslatesMap} from '../../utils/intervention-labels-map';
-import ContentPanelMixin from '@unicef-polymer/etools-modules-common/dist/mixins/content-panel-mixin';
+import {EtoolsContentPanel} from '@unicef-polymer/etools-unicef/src/etools-content-panel/etools-content-panel';
 import {_sendRequest} from '@unicef-polymer/etools-modules-common/dist/utils/request-helper';
 import {EtoolsDataTableRow} from '@unicef-polymer/etools-unicef/src/etools-data-table/etools-data-table-row';
 import {GDDPdActivities} from './pd-activities';
@@ -60,7 +60,7 @@ import '@unicef-polymer/etools-unicef/src/etools-icon-button/etools-icon-button'
  * @customElement
  */
 @customElement('gdd-results-structure')
-export class GDDResultsStructure extends CommentsMixin(ContentPanelMixin(LitElement)) {
+export class GDDResultsStructure extends CommentsMixin(LitElement) {
   get resultLinks(): GDDExpectedResult[] {
     return this._resultLinks || [];
   }
@@ -69,6 +69,7 @@ export class GDDResultsStructure extends CommentsMixin(ContentPanelMixin(LitElem
       (linkA, linkB) => Number(Boolean(linkB.cp_output)) - Number(Boolean(linkA.cp_output))
     );
   }
+  @query('etools-content-panel') contentPanel?: EtoolsContentPanel;
   @property() interventionId!: number | null;
   @property() interventionStatus!: string;
 
@@ -390,7 +391,9 @@ export class GDDResultsStructure extends CommentsMixin(ContentPanelMixin(LitElem
         canChangeCpOp: canChangeCpOp
       }
     });
-    this.openContentPanel();
+    if (this.contentPanel) {
+      this.contentPanel.open = true;
+    }
   }
 
   openSyncResultsStructure() {
@@ -400,7 +403,9 @@ export class GDDResultsStructure extends CommentsMixin(ContentPanelMixin(LitElem
         interventionId: this.interventionId
       }
     });
-    this.openContentPanel();
+    if (this.contentPanel) {
+      this.contentPanel.open = true;
+    }
   }
 
   filterOutAlreadySelectedAndByCPStructure(canChangeCpOp: boolean) {