fix: registered external resouces should keep singleton ref

- external resources can be provided through the grid options, but these options are sometime deep copied and that might have the side effect of losing the singleton ref of the instantiate services/resources, instead we can simply keep these singleton refs before any grid options merge can happen and that is in the constructor before the grid initializes and before the grid options are merged and sometime deep copied with global options

Author: ghiscoding

src/app/examples/grid-clientside.component.ts

@@ -196,7 +196,7 @@ export class GridClientSideComponent implements OnInit {
           { columnId: 'complete', direction: 'ASC' }
         ],
       },
-      registerExternalResources: [new ExcelExportService()],
+      externalResources: [new ExcelExportService()],
     };
 
     // mock a dataset

src/app/examples/grid-colspan.component.ts

@@ -68,7 +68,7 @@ export class GridColspanComponent implements OnInit {
       excelExportOptions: {
         exportWithFormatter: false
       },
-      registerExternalResources: [new ExcelExportService()],
+      externalResources: [new ExcelExportService()],
     };
 
     this.dataset1 = this.getData(500);
@@ -100,7 +100,7 @@ export class GridColspanComponent implements OnInit {
       excelExportOptions: {
         exportWithFormatter: false
       },
-      registerExternalResources: [new ExcelExportService()],
+      externalResources: [new ExcelExportService()],
     };
 
     this.dataset2 = this.getData(500);

src/app/examples/grid-composite-editor.component.ts

@@ -394,7 +394,7 @@ export class GridCompositeEditorComponent implements OnInit {
       excelExportOptions: {
         exportWithFormatter: false
       },
-      registerExternalResources: [new ExcelExportService(), this.compositeEditorInstance],
+      externalResources: [new ExcelExportService(), this.compositeEditorInstance],
       enableFiltering: true,
       rowSelectionOptions: {
         // True (Single Selection), False (Multiple Selections)

src/app/examples/grid-contextmenu.component.ts

@@ -297,7 +297,7 @@ export class GridContextMenuComponent implements OnInit, OnDestroy {
         columnHeaderStyle: { font: { bold: true, italic: true } }
       },
       i18n: this.translate,
-      registerExternalResources: [new ExcelExportService()],
+      externalResources: [new ExcelExportService()],
 
       enableContextMenu: true,
       enableCellMenu: true,

src/app/examples/grid-custom-tooltip.component.ts

@@ -323,7 +323,7 @@ export class GridCustomTooltipComponent implements OnInit {
         exportWithFormatter: true
       },
       // Custom Tooltip options can be defined in a Column or Grid Options or a mixed of both (first options found wins)
-      registerExternalResources: [new SlickCustomTooltip(), new ExcelExportService()],
+      externalResources: [new SlickCustomTooltip(), new ExcelExportService()],
       customTooltip: {
         formatter: this.tooltipFormatter.bind(this) as Formatter,
         headerFormatter: this.headerFormatter,

src/app/examples/grid-draggrouping.component.ts

@@ -244,7 +244,7 @@ export class GridDraggableGroupingComponent implements OnInit {
       enableTextExport: true,
       enableExcelExport: true,
       excelExportOptions: { sanitizeDataExport: true },
-      registerExternalResources: [this.excelExportService, this.textExportService],
+      externalResources: [this.excelExportService, this.textExportService],
     };
 
     this.loadData(500);

src/app/examples/grid-graphql.component.ts

@@ -276,7 +276,7 @@ export class GridGraphqlComponent implements OnInit, OnDestroy {
       setTimeout(() => {
         this.graphqlQuery = this.angularGrid.backendService!.buildQuery();
         if (this.isWithCursor) {
-          // When using cursor pagination, the pagination service needs to updated with the PageInfo data from the latest request
+          // When using cursor pagination, the pagination service needs to be updated with the PageInfo data from the latest request
           // This might be done automatically if using a framework specific slickgrid library
           // Note because of this timeout, this may cause race conditions with rapid clicks!
           this.angularGrid?.paginationService?.setCursorPageInfo((mockedResult.data[GRAPHQL_QUERY_DATASET_NAME].pageInfo));

src/app/examples/grid-grouping.component.ts

@@ -165,7 +165,7 @@ export class GridGroupingComponent implements OnInit {
       },
       excelExportOptions: { sanitizeDataExport: true },
       textExportOptions: { sanitizeDataExport: true },
-      registerExternalResources: [this.excelExportService, this.textExportService],
+      externalResources: [this.excelExportService, this.textExportService],
     };
 
     this.loadData(500);

src/app/examples/grid-localization.component.ts

@@ -202,7 +202,7 @@ export class GridLocalizationComponent implements OnInit, OnDestroy {
         exportWithFormatter: true,
         sanitizeDataExport: true
       },
-      registerExternalResources: [this.excelExportService, this.textExportService],
+      externalResources: [this.excelExportService, this.textExportService],
     };
 
     this.loadData(NB_ITEMS);

src/app/examples/grid-range.component.ts

@@ -184,7 +184,7 @@ export class GridRangeComponent implements OnInit, OnDestroy {
           { columnId: 'duration', direction: 'ASC' },
         ],
       },
-      registerExternalResources: [new SlickCustomTooltip(), new ExcelExportService()],
+      externalResources: [new SlickCustomTooltip(), new ExcelExportService()],
     };
 
     // mock a dataset