#23792 Pages portlet - Bugs found (#24265)

* Update release version for dotcms-ui and dotcms-webcomponents * Modify dotcmsReleaseVersion to 23.03, coreWebReleaseVersion, webComponentsReleaseVersion to rc and dot-cicd branch version to release-23.03 * Update branch in git submodule to release-23.03 * Excluding from triggering test at folder: dotCMS/src/main/webapp/html * #23977 Block editor freeze scroll on tippy menus show (#24180) * dev: freeze scroll on show forms #23977 * clean up * refactor * clean up v2 * feedback * clean up * #24172 Refresh Page portlet's data when site changed (#24175) * #24031 fix block editor not saving (#24222) * Fix #24032 Bring it to 22.03 (#24229) * Fix #24032 Bring it to 22.03 * Build de lib --------- Co-authored-by: Manuel Rojas <manuel.rojas.21@gmail.com> * #24240 Fix data-access tests in 23.03 (#24244) * #24240 fix test cases * #24240 fix lint * fire release docker image generation * #24221 fix Snapshots should be displayed when the language is changed (#24234) * Fix #23449 show dotAssets in folder listing * Bugs fixed: - When I search by URL I need to type exactly the full url to get a match - If I edit a page using right click and save it, the new changes aren't always displayed in the table and the context menu doesn't list the options correctly * Bock Editor: Allow user to insert videos from local files#23863 (#24248) * dev: remove fileSize limit and fit the video in the block editor #23863 * clean up * Fix 24032: Adding for Internal QA (#24255) * #24032 Adding Fix for Internal QA * #24032 Adding PR Feedback * #24032 Adding PR Feedback * #24032 Adding PR Feedback * #24032 Logging error * dotCMS/core#issue-20432 adding const * dotCMS/core#issue-20432 adding const * #24032 validation schema * Adding empty extensions * Adding empty extensions * Get all modules no actions required * Adding optional validation for actions * Adding optional validation for actions * Adding id insted of name * Adding Type for promise * Adding dot-cms-block-editor * Adding lock file --------- Co-authored-by: Freddy Montes <751424+fmontes@users.noreply.github.com> * #22151 make the message better (#24041) * #22151 make the message better * #22151 hides token button if aws * #24173 Create dialog for 'Create Page' button (#24215) * #24173 Create dialog for 'Create Page' button * #24173 Create dialog for 'Create Page' button - tests * #24173 Create dialog for 'Create Page' button - feedback * #24173 Create dialog for 'Create Page' button - more feedback * #23792 feedback * #23792 More Feedback * #23792 More Feedback - unit tests * #23792 More Feedback v2 --------- Co-authored-by: victoralfaro-dotcms <victor.alfaro@dotcms.com> Co-authored-by: Rafael Velazco <rjvelazco21@gmail.com> Co-authored-by: Freddy Montes <751424+fmontes@users.noreply.github.com> Co-authored-by: Manuel Rojas <manuel.rojas.21@gmail.com> Co-authored-by: zulqarnainvd <113915849+zulqarnainvd@users.noreply.github.com> Co-authored-by: hassan-mustafa-baig <111717530+hassan-mustafa-baig@users.noreply.github.com> Co-authored-by: Will Ezell <will@dotcms.com>
dotCMS · Mar 15, 2023 · 5868866 · 5868866
1 parent 3bc6c12
commit 5868866
Show file tree

Hide file tree

Showing 22 changed files with 408 additions and 136 deletions.
diff --git a/...ps/dotcms-ui/src/app/portlets/dot-containers/container-list/container-list.component.html b/...ps/dotcms-ui/src/app/portlets/dot-containers/container-list/container-list.component.html
@@ -78,7 +78,7 @@
                     {{ rowData.friendlyName }}
                 </td>
                 <td [ngStyle]="{ 'text-align': tableColumns[3].textAlign }">
-                    {{ rowData.modDate }}
+                    {{ rowData.modDate | dotRelativeDate : true }}
                 </td>
                 <td style="width: 5%">
                     <dot-action-menu-button

diff --git a/...dotcms-ui/src/app/portlets/dot-containers/container-list/container-list.component.spec.ts b/...dotcms-ui/src/app/portlets/dot-containers/container-list/container-list.component.spec.ts
@@ -21,6 +21,7 @@ import { DotAddToBundleModule } from '@components/_common/dot-add-to-bundle';
 import { DotListingDataTableModule } from '@components/dot-listing-data-table';
 import { DotListingDataTableComponent } from '@components/dot-listing-data-table/dot-listing-data-table.component';
 import { DotMessageDisplayService } from '@components/dot-message-display/services';
+import { DotRelativeDatePipe } from '@dotcms/app/view/pipes/dot-relative-date/dot-relative-date.pipe';
 import {
     DotAlertConfirmService,
     DotMessageService,
@@ -279,6 +280,7 @@ describe('ContainerListComponent', () => {
                 DotActionButtonModule,
                 DotActionMenuButtonModule,
                 DotAddToBundleModule,
+                DotRelativeDatePipe,
                 HttpClientTestingModule,
                 DynamicDialogModule,
                 BrowserAnimationsModule

diff --git a/...eb/apps/dotcms-ui/src/app/portlets/dot-containers/container-list/container-list.module.ts b/...eb/apps/dotcms-ui/src/app/portlets/dot-containers/container-list/container-list.module.ts
@@ -12,6 +12,7 @@ import { DotEmptyStateModule } from '@components/_common/dot-empty-state/dot-emp
 import { DotContentTypeSelectorModule } from '@components/dot-content-type-selector';
 import { DotListingDataTableModule } from '@components/dot-listing-data-table';
 import { DotPortletBaseModule } from '@components/dot-portlet-base/dot-portlet-base.module';
+import { DotRelativeDatePipe } from '@dotcms/app/view/pipes/dot-relative-date/dot-relative-date.pipe';
 import { DotSiteBrowserService } from '@dotcms/data-access';
 import { DotMessagePipeModule } from '@pipes/dot-message/dot-message-pipe.module';
 import { DotContainerListResolver } from '@portlets/dot-containers/container-list/dot-container-list-resolver.service';
@@ -34,7 +35,8 @@ import { ContainerListComponent } from './container-list.component';
         MenuModule,
         DotEmptyStateModule,
         DotAddToBundleModule,
-        DotActionMenuButtonModule
+        DotActionMenuButtonModule,
+        DotRelativeDatePipe
     ],
     providers: [
         DotContainerListResolver,

diff --git a/...src/app/portlets/dot-pages/dot-pages-listing-panel/dot-pages-listing-panel.component.html b/...src/app/portlets/dot-pages/dot-pages-listing-panel/dot-pages-listing-panel.component.html
@@ -1,6 +1,7 @@
 <p-table
     *ngIf="vm$ | async as vm"
     [value]="vm.pages.items"
+    [loading]="vm.isPagesLoading"
     [scrollable]="true"
     [virtualScroll]="true"
     [virtualScrollItemSize]="47"
@@ -90,9 +91,7 @@
             <td>
                 {{ rowData['modUserName'] }}
             </td>
-            <td>
-                {{ rowData['modDate'] }}
-            </td>
+            <td>{{ rowData['modDate'] | dotRelativeDate }}</td>
             <td>
                 <dot-icon-button
                     id="pageActionButton-{{ rowIndex }}"

diff --git a/.../app/portlets/dot-pages/dot-pages-listing-panel/dot-pages-listing-panel.component.spec.ts b/.../app/portlets/dot-pages/dot-pages-listing-panel/dot-pages-listing-panel.component.spec.ts
@@ -163,6 +163,7 @@ describe('DotPagesListingPanelComponent', () => {
         it('should set table with params', () => {
             const elem = de.query(By.css('p-table')).componentInstance;
             expect(elem.scrollable).toBe(true);
+            expect(elem.loading).toBe(undefined);
             expect(elem.virtualScroll).toBe(true);
             expect(elem.virtualScrollItemSize).toBe(47);
             expect(elem.lazy).toBe(true);

diff --git a/...s-ui/src/app/portlets/dot-pages/dot-pages-listing-panel/dot-pages-listing-panel.module.ts b/...s-ui/src/app/portlets/dot-pages/dot-pages-listing-panel/dot-pages-listing-panel.module.ts
@@ -13,6 +13,7 @@ import { TooltipModule } from 'primeng/tooltip';
 import { UiDotIconButtonModule } from '@components/_common/dot-icon-button/dot-icon-button.module';
 import { DotAutofocusModule } from '@directives/dot-autofocus/dot-autofocus.module';
 import { DotMessagePipeModule } from '@dotcms/app/view/pipes/dot-message/dot-message-pipe.module';
+import { DotRelativeDatePipe } from '@dotcms/app/view/pipes/dot-relative-date/dot-relative-date.pipe';
 
 import { DotPagesListingPanelComponent } from './dot-pages-listing-panel.component';
 
@@ -21,9 +22,10 @@ import { DotPagesListingPanelComponent } from './dot-pages-listing-panel.compone
         ButtonModule,
         CheckboxModule,
         CommonModule,
-        DropdownModule,
         DotAutofocusModule,
         DotMessagePipeModule,
+        DotRelativeDatePipe,
+        DropdownModule,
         InputTextModule,
         SkeletonModule,
         TableModule,

diff --git a/core-web/apps/dotcms-ui/src/app/portlets/dot-pages/dot-pages-store/dot-pages.store.spec.ts b/core-web/apps/dotcms-ui/src/app/portlets/dot-pages/dot-pages-store/dot-pages.store.spec.ts
@@ -1,9 +1,8 @@
-import { formatDistanceStrict } from 'date-fns';
 import { Observable, of } from 'rxjs';
 
 import { HttpClientTestingModule } from '@angular/common/http/testing';
 import { Injectable } from '@angular/core';
-import { TestBed } from '@angular/core/testing';
+import { fakeAsync, TestBed, tick } from '@angular/core/testing';
 
 import { DotGlobalMessageService } from '@components/_common/dot-global-message/dot-global-message.service';
 import { PushPublishServiceMock } from '@components/_common/dot-push-publish-env-selector/dot-push-publish-env-selector.component.spec';
@@ -25,7 +24,8 @@ import {
     DotPageTypesService,
     DotRenderMode,
     DotWorkflowActionsFireService,
-    DotWorkflowsActionsService
+    DotWorkflowsActionsService,
+    ESOrderDirection
 } from '@dotcms/data-access';
 import {
     CoreWebService,
@@ -38,7 +38,12 @@ import {
     SiteServiceMock,
     StringUtils
 } from '@dotcms/dotcms-js';
-import { DotCMSContentlet, DotCMSContentType, ESContent } from '@dotcms/dotcms-models';
+import {
+    ComponentStatus,
+    DotCMSContentlet,
+    DotCMSContentType,
+    ESContent
+} from '@dotcms/dotcms-models';
 import {
     DotcmsConfigServiceMock,
     dotcmsContentTypeBasicMock,
@@ -159,6 +164,18 @@ describe('DotPageStore', () => {
         });
     });
 
+    it('should get pages status', () => {
+        dotPageStore.getStatus$.subscribe((data) => {
+            expect(data).toEqual(ComponentStatus.INIT);
+        });
+    });
+
+    it('should get pages loading status', () => {
+        dotPageStore.isPagesLoading$.subscribe((data) => {
+            expect(data).toEqual(true);
+        });
+    });
+
     // Updaters
     it('should update Favorite Pages', () => {
         dotPageStore.setFavoritePages(favoritePagesInitialTestData);
@@ -195,6 +212,13 @@ describe('DotPageStore', () => {
         });
     });
 
+    it('should update Pages Status', () => {
+        dotPageStore.setPagesStatus(ComponentStatus.LOADING);
+        dotPageStore.state$.subscribe((data) => {
+            expect(data.pages.status).toEqual(ComponentStatus.LOADING);
+        });
+    });
+
     it('should clear Menu Actions', () => {
         dotPageStore.clearMenuActions();
         dotPageStore.state$.subscribe((data) => {
@@ -259,24 +283,12 @@ describe('DotPageStore', () => {
     });
 
     it('should set all Pages value in store', () => {
-        const relativeDate = (date: string) => {
-            return formatDistanceStrict(
-                new Date(parseInt(new Date(date).getTime().toString(), 10)),
-                new Date(),
-                {
-                    addSuffix: true
-                }
-            );
-        };
-
         const expectedInputArray = [
             {
-                ...favoritePagesInitialTestData[0],
-                modDate: relativeDate(favoritePagesInitialTestData[0].modDate)
+                ...favoritePagesInitialTestData[0]
             },
             {
-                ...favoritePagesInitialTestData[1],
-                modDate: relativeDate(favoritePagesInitialTestData[1].modDate)
+                ...favoritePagesInitialTestData[1]
             }
         ];
         spyOn(dotESContentService, 'get').and.returnValue(
@@ -295,8 +307,79 @@ describe('DotPageStore', () => {
             expect(data.pages.items).toEqual(expectedInputArray);
         });
         expect(dotESContentService.get).toHaveBeenCalledTimes(1);
+        expect(dotESContentService.get).toHaveBeenCalledWith({
+            itemsPerPage: 40,
+            offset: '0',
+            query: '+conhost:123-xyz-567-xxl +deleted:false  +(urlmap:* OR basetype:5)    ',
+            sortField: 'title',
+            sortOrder: ESOrderDirection.ASC
+        });
     });
 
+    it('should keep fetching Pages data until new value comes from the DB in store', fakeAsync(() => {
+        dotPageStore.setPages(favoritePagesInitialTestData);
+        const old = {
+            contentTook: 0,
+            jsonObjectView: {
+                contentlets: favoritePagesInitialTestData as unknown as DotCMSContentlet[]
+            },
+            queryTook: 1,
+            resultsSize: 2
+        };
+
+        const updated = {
+            contentTook: 0,
+            jsonObjectView: {
+                contentlets: [
+                    { ...favoritePagesInitialTestData[0], modDate: '2020-09-02 16:50:15.569' },
+                    { ...favoritePagesInitialTestData[1] }
+                ] as unknown as DotCMSContentlet[]
+            },
+            queryTook: 1,
+            resultsSize: 4
+        };
+
+        const mockFunction = (times) => {
+            let count = 1;
+
+            return Observable.create((observer) => {
+                if (count++ > times) {
+                    observer.next(updated);
+                } else {
+                    observer.next(old);
+                }
+            });
+        };
+
+        spyOn(dotESContentService, 'get').and.returnValue(mockFunction(3));
+        spyOn(dotPageStore, 'setPagesStatus').and.callThrough();
+
+        dotPageStore.updateSinglePageData({ identifier: '123', isFavoritePage: false });
+
+        tick(3000);
+
+        // dotESContentService.get only is called 1 time, but "retryWhen" operator makes several request to the SpyOn
+        expect(dotESContentService.get).toHaveBeenCalledTimes(1);
+
+        // Testing to setPagesStatus to LOADING on the first fetch
+        expect((dotPageStore.setPagesStatus as jasmine.Spy).calls.argsFor(0).toString()).toBe(
+            ComponentStatus.LOADING
+        );
+
+        // Testing to pages.status to be LOADED on the last fetch (there can only be 2 calls during the whole process)
+        dotPageStore.state$.subscribe((data) => {
+            expect(data.pages.status).toBe(ComponentStatus.LOADED);
+        });
+
+        // Since dotESContentService.get can only be called 1 time (and once called the data will be changed on "mockFunction"),
+        // we test that the last fetch contains the updated data
+        (dotESContentService.get as jasmine.Spy).calls
+            .mostRecent()
+            .returnValue.subscribe((data) => {
+                expect(data).toEqual(updated);
+            });
+    }));
+
     it('should get all Workflow actions and static actions from a contentlet', () => {
         spyOn(dotWorkflowsActionsService, 'getByInode').and.returnValue(of(mockWorkflowsActions));
         dotPageStore.showActionsMenu({