Skip to content

Commit f6aa3b6

Browse files
zJaaalzJaaal
authored
chore(client): Remove REST Page API from client.page.get (#32098)
This pull request focuses on transitioning the codebase to use the updated `DotCMSPageResponse` type instead of the deprecated `DotCMSEditablePage` and `DotCMSGraphQLPageResponse` types, while also centralizing shared types into `@dotcms/types`. The changes span across multiple files, including service implementations, tests, and client APIs, with the goal of improving type consistency and maintainability. ### Transition to `DotCMSPageResponse` Type: * Updated the `DotPageApiService` to replace `DotCMSGraphQLPageResponse` with `DotCMSPageResponse` for type annotations and method calls. (`dot-page-api.service.ts`, [[1]](diffhunk://#diff-9acb0e7dc2619395c49047164381778d2b6d6c41f58b30aa3cd6a798044007c6L20-R20) [[2]](diffhunk://#diff-9acb0e7dc2619395c49047164381778d2b6d6c41f58b30aa3cd6a798044007c6L202-R202) * Refactored `DotCMSEditablePageService` to use `DotCMSPageResponse` for internal subjects, observables, and mock data in both implementation and tests. (`dotcms-editable-page.service.ts`, [[1]](diffhunk://#diff-08ba5e2ca6377757a25ae71539af956c5b47f9f6b918a74bdca06a1e23b7438dL20-R28) [[2]](diffhunk://#diff-08ba5e2ca6377757a25ae71539af956c5b47f9f6b918a74bdca06a1e23b7438dL63-R62); `dotcms-editable-page.service.spec.ts`, [[3]](diffhunk://#diff-9e99be6093c44be0c1ff531e7f2eee75185a56c63cd07e9ec60b8db26d98ccf4L26-R34) [[4]](diffhunk://#diff-9e99be6093c44be0c1ff531e7f2eee75185a56c63cd07e9ec60b8db26d98ccf4L74-R70) [[5]](diffhunk://#diff-9e99be6093c44be0c1ff531e7f2eee75185a56c63cd07e9ec60b8db26d98ccf4L87-R83) [[6]](diffhunk://#diff-9e99be6093c44be0c1ff531e7f2eee75185a56c63cd07e9ec60b8db26d98ccf4L97-R93) ### Centralization of Shared Types: * Removed redundant type definitions (e.g., `ContentTypeMainFields` and `Contentlet`) from the SDK and replaced them with imports from `@dotcms/types`. (`types.ts`, [[1]](diffhunk://#diff-c8387d8c19477cb41407db77d2aa1068000323ec8c3ddc4390f2b1d791bff64bR1-R2) [[2]](diffhunk://#diff-c8387d8c19477cb41407db77d2aa1068000323ec8c3ddc4390f2b1d791bff64bL27-L70) * Consolidated `DotCMSClientConfig`, `RequestOptions`, and other shared types into `@dotcms/types` and updated imports across client modules. (`client.ts`, [[1]](diffhunk://#diff-aa54238655bef05cdd48772e24046f2105dd74b1a20fac91e0b3ca610e3095a6R1-L38); `content-api.ts`, [[2]](diffhunk://#diff-7c81d474bc4a2de176c90dd7fc5a3b5584095ce7e19a8ae8e60e1f403f8344feL1-R3); `navigation-api.ts`, [[3]](diffhunk://#diff-ccca05575b5095ec6e63c7a7d3be4723cc9ed76a5ddf12197c6ad456b5785dc7L1-R1); `page-api.spec.ts`, [[4]](diffhunk://#diff-39f9fdbb6ffc97cc19b942165b9a66d212e4ab0d0e900b639687e28c393be0bcL2-L13) ### Cleanup and Simplification: * Removed unused or redundant imports and mock implementations in test files, such as `jest.mock` calls and mock data for deprecated types. (`navigation-api.spec.ts`, [[1]](diffhunk://#diff-6efa73174333c167644002586b5144107991d3c681a0bd0e982aefe0eeeca7a5L1-R3); `page-api.spec.ts`, [[2]](diffhunk://#diff-39f9fdbb6ffc97cc19b942165b9a66d212e4ab0d0e900b639687e28c393be0bcL28-L40) [[3]](diffhunk://#diff-39f9fdbb6ffc97cc19b942165b9a66d212e4ab0d0e900b639687e28c393be0bcL58-L67) * Simplified type annotations and method parameters in client APIs to use centralized types like `DotCMSNavigationRequestParams`. (`navigation-api.ts`, [[1]](diffhunk://#diff-ccca05575b5095ec6e63c7a7d3be4723cc9ed76a5ddf12197c6ad456b5785dc7L37-R19) [[2]](diffhunk://#diff-ccca05575b5095ec6e63c7a7d3be4723cc9ed76a5ddf12197c6ad456b5785dc7L59-R41) These changes collectively enhance type safety, reduce redundancy, and align the codebase with the latest `@dotcms/types` definitions.
1 parent 3640bcd commit f6aa3b6

File tree

28 files changed

+436
-663
lines changed

28 files changed

+436
-663
lines changed

‎core-web/libs/portlets/edit-ema/portlet/src/lib/services/dot-page-api.service.ts

+2-2
Original file line numberDiff line numberDiff line change
@@ -188,7 +188,7 @@ export class DotPageApiService {
188188
query: string;
189189
variables: Record<string, string>;
190190
}): Observable<{
191-
page: DotPageApiResponse;
191+
pageAsset: DotPageApiResponse;
192192
content: Record<string, unknown>;
193193
}> {
194194
const headers = {
@@ -202,7 +202,7 @@ export class DotPageApiService {
202202
const pageEntity = graphqlToPageEntity({ page } as DotCMSGraphQLPageResponse);
203203

204204
return {
205-
page: pageEntity,
205+
pageAsset: pageEntity,
206206
content
207207
};
208208
})

‎core-web/libs/portlets/edit-ema/portlet/src/lib/store/features/client/withClient.ts

+2-2
Original file line numberDiff line numberDiff line change
@@ -27,7 +27,7 @@ export interface ClientConfigState {
2727
variables: Record<string, string>;
2828
};
2929
graphqlResponse: {
30-
page: DotPageApiResponse;
30+
pageAsset: DotPageApiResponse;
3131
content?: Record<string, unknown>;
3232
};
3333
}
@@ -85,7 +85,7 @@ export function withClient() {
8585
// Old customers using graphQL expect only the page.
8686
// We can remove this once we are in stable and tell the devs this won't work in new dotCMS versions.
8787
if (store.legacyGraphqlResponse()) {
88-
return store.graphqlResponse()?.page;
88+
return store.graphqlResponse()?.pageAsset;
8989
}
9090

9191
return {

‎core-web/libs/portlets/edit-ema/portlet/src/lib/store/features/editor/save/withSave.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -53,7 +53,7 @@ export function withSave() {
5353
tap((response) =>
5454
store.setGraphqlResponse(response)
5555
),
56-
map((response) => response.page)
56+
map((response) => response.pageAsset)
5757
);
5858

5959
return pageRequest.pipe(

‎core-web/libs/portlets/edit-ema/portlet/src/lib/store/features/load/withLoad.spec.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -246,7 +246,7 @@ describe('withLoad', () => {
246246
it('should call getGraphQLPage if graphql is present', () => {
247247
jest.spyOn(dotPageApiService, 'getGraphQLPage').mockImplementation(() =>
248248
of({
249-
page: MOCK_RESPONSE_HEADLESS,
249+
pageAsset: MOCK_RESPONSE_HEADLESS,
250250
content: {}
251251
})
252252
);

‎core-web/libs/portlets/edit-ema/portlet/src/lib/store/features/load/withLoad.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -202,7 +202,7 @@ export function withLoad() {
202202
? dotPageApiService.get(store.pageParams())
203203
: dotPageApiService.getGraphQLPage(store.$graphqlWithParams()).pipe(
204204
tap((response) => store.setGraphqlResponse(response)),
205-
map((response) => response.page)
205+
map((response) => response.pageAsset)
206206
);
207207

208208
return pageRequest.pipe(

‎core-web/libs/sdk/angular/next/services/dotcms-editable-page.service.spec.ts

+26-23
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
1+
import { expect } from '@jest/globals';
12
import { createServiceFactory, SpectatorService } from '@ngneat/spectator/jest';
23

3-
import { updateNavigation } from '@dotcms/client';
4-
import { UVEEventType, DotCMSEditablePage } from '@dotcms/types';
5-
import { getUVEState, initUVE, createUVESubscription } from '@dotcms/uve';
4+
import { UVEEventType, DotCMSPageResponse } from '@dotcms/types';
5+
import { getUVEState, initUVE, createUVESubscription, updateNavigation } from '@dotcms/uve';
66

77
import { DotCMSEditablePageService } from './dotcms-editable-page.service';
88

@@ -11,10 +11,7 @@ import { DotCMSEditablePageService } from './dotcms-editable-page.service';
1111
jest.mock('@dotcms/uve', () => ({
1212
getUVEState: jest.fn(),
1313
initUVE: jest.fn(),
14-
createUVESubscription: jest.fn()
15-
}));
16-
17-
jest.mock('@dotcms/client', () => ({
14+
createUVESubscription: jest.fn(),
1815
updateNavigation: jest.fn()
1916
}));
2017

@@ -23,19 +20,25 @@ describe('DotCMSEditablePageService', () => {
2320
let service: DotCMSEditablePageService;
2421
let unsubscribeMock: jest.Mock;
2522

26-
const mockPageAsset: DotCMSEditablePage = {
27-
page: {
28-
pageURI: '/test-page',
29-
title: 'Test Page'
30-
}
31-
} as DotCMSEditablePage;
32-
33-
const mockUpdatedPageAsset: DotCMSEditablePage = {
34-
page: {
35-
pageURI: '/test-page',
36-
title: 'Updated Test Page'
37-
}
38-
} as DotCMSEditablePage;
23+
const mockPageAsset: DotCMSPageResponse = {
24+
pageAsset: {
25+
page: {
26+
pageURI: '/test-page',
27+
title: 'Test Page'
28+
}
29+
},
30+
graphql: {}
31+
} as DotCMSPageResponse;
32+
33+
const mockUpdatedPageAsset: DotCMSPageResponse = {
34+
pageAsset: {
35+
page: {
36+
pageURI: '/test-page',
37+
title: 'Updated Test Page'
38+
}
39+
},
40+
graphql: {}
41+
} as DotCMSPageResponse;
3942

4043
const createService = createServiceFactory({
4144
service: DotCMSEditablePageService
@@ -71,7 +74,7 @@ describe('DotCMSEditablePageService', () => {
7174

7275
it('should return observable with the initial page asset when UVE state is false', () => {
7376
(getUVEState as jest.Mock).mockReturnValue(false);
74-
let result: DotCMSEditablePage | null = null;
77+
let result: DotCMSPageResponse | null = null;
7578

7679
service.listen(mockPageAsset).subscribe((res) => {
7780
result = res;
@@ -84,7 +87,7 @@ describe('DotCMSEditablePageService', () => {
8487
});
8588

8689
it('should emit updated page asset when UVE event occurs', () => {
87-
let capturedCallback = (_payload: DotCMSEditablePage): void => {
90+
let capturedCallback = (_payload: DotCMSPageResponse): void => {
8891
// Empty default implementation
8992
};
9093

@@ -94,7 +97,7 @@ describe('DotCMSEditablePageService', () => {
9497
return { unsubscribe: unsubscribeMock };
9598
});
9699

97-
const emittedValues: Array<DotCMSEditablePage | null> = [];
100+
const emittedValues: Array<DotCMSPageResponse | null> = [];
98101

99102
service.listen(mockPageAsset).subscribe((value) => {
100103
emittedValues.push(value);

‎core-web/libs/sdk/angular/next/services/dotcms-editable-page.service.ts

+13-14
Original file line numberDiff line numberDiff line change
@@ -4,9 +4,8 @@ import { Injectable } from '@angular/core';
44

55
import { finalize } from 'rxjs/operators';
66

7-
import { updateNavigation } from '@dotcms/client';
8-
import { UVEEventType, DotCMSEditablePage } from '@dotcms/types';
9-
import { createUVESubscription, getUVEState, initUVE } from '@dotcms/uve';
7+
import { UVEEventType, DotCMSPageResponse } from '@dotcms/types';
8+
import { createUVESubscription, getUVEState, initUVE, updateNavigation } from '@dotcms/uve';
109

1110
@Injectable({
1211
providedIn: 'root'
@@ -17,18 +16,18 @@ export class DotCMSEditablePageService {
1716
* Used internally to track changes to the page data.
1817
*
1918
* @private
20-
* @type {Subject<DotCMSEditablePage | null>}
19+
* @type {Subject<DotCMSPageResponse | null>}
2120
*/
22-
#pageAssetSubject = new Subject<DotCMSEditablePage | null>();
21+
#responseSubject = new Subject<DotCMSPageResponse | null>();
2322

2423
/**
2524
* Observable stream of the page asset changes.
2625
* Exposes the pageAssetSubject as an Observable for subscribers.
2726
*
2827
* @private
29-
* @type {Observable<DotCMSEditablePage | null>}
28+
* @type {Observable<DotCMSPageResponse | null>}
3029
*/
31-
#pageAsset$ = this.#pageAssetSubject.asObservable();
30+
#response$ = this.#responseSubject.asObservable();
3231

3332
/**
3433
* Listens for changes to an editable page and returns an Observable that emits the updated page data.
@@ -57,22 +56,22 @@ export class DotCMSEditablePageService {
5756
* subscription.unsubscribe();
5857
* ```
5958
*
60-
* @param pageAsset Optional initial page data
59+
* @param response Optional initial page data
6160
* @returns Observable that emits the updated page data or null
6261
*/
63-
listen(pageAsset?: DotCMSEditablePage): Observable<DotCMSEditablePage | null> {
62+
listen(response?: DotCMSPageResponse): Observable<DotCMSPageResponse | null> {
6463
if (!getUVEState()) {
65-
return of(pageAsset || null);
64+
return of(response || null);
6665
}
6766

68-
const pageURI = pageAsset?.page?.pageURI ?? '/';
67+
const pageURI = response?.pageAsset?.page?.pageURI ?? '/';
6968

70-
initUVE(pageAsset);
69+
initUVE(response);
7170
updateNavigation(pageURI);
7271

7372
const unsubscribeUVEChanges = this.#listenUVEChanges();
7473

75-
return this.#pageAsset$.pipe(
74+
return this.#response$.pipe(
7675
finalize(() => {
7776
unsubscribeUVEChanges();
7877
})
@@ -88,7 +87,7 @@ export class DotCMSEditablePageService {
8887
*/
8988
#listenUVEChanges() {
9089
const { unsubscribe } = createUVESubscription(UVEEventType.CONTENT_CHANGES, (payload) => {
91-
this.#pageAssetSubject.next(payload);
90+
this.#responseSubject.next(payload);
9291
});
9392

9493
return unsubscribe;

‎core-web/libs/sdk/client/README.md

+21-2
Original file line numberDiff line numberDiff line change
@@ -127,11 +127,30 @@ const pageData = await client.page.get('/your-page-path', {
127127
});
128128
```
129129
130+
131+
### Warning
132+
133+
If you are updating from a version that is lower than `0.0.1-beta.29`, be aware that the response from the `client.page.get` method changed the access to the page value from `page` to `pageAsset`.
134+
This change was made to avoid redundancy on access inside of `page` object.
135+
136+
#### Before
137+
138+
```javascript
139+
const { page } = await client.page.get("/")
140+
```
141+
142+
#### After
143+
144+
```javascript
145+
const { pageAsset } = await client.page.get("/")
146+
```
147+
148+
130149
#### Example with all options
131150
132151
```javascript
133152
// Fetching a page with all available options
134-
const { page, content } = await client.page.get('/about-us', {
153+
const { pageAsset, content } = await client.page.get('/about-us', {
135154
languageId: '1', // Language ID (optional)
136155
siteId: 'demo.dotcms.com', // Site ID (optional, defaults to the one provided during initialization)
137156
mode: 'PREVIEW_MODE', // ADMIN_MODE, PREVIEW_MODE, or LIVE_MODE (optional)
@@ -172,7 +191,7 @@ const { page, content } = await client.page.get('/about-us', {
172191
});
173192
174193
// Access page data
175-
console.log(page.containers);
194+
console.log(pageAsset.containers);
176195
177196
// Access content data
178197
console.log(content.blogPosts);

‎core-web/libs/sdk/client/src/lib/client/client.spec.ts

+3-1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,6 @@
1-
import { createDotCMSClient, DotCMSClientConfig, RequestOptions } from './client';
1+
import { DotCMSClientConfig, RequestOptions } from '@dotcms/types';
2+
3+
import { createDotCMSClient } from './client';
24
import { Content } from './content/content-api';
35
import { NavigationClient } from './navigation/navigation-api';
46
import { PageClient } from './page/page-api';

‎core-web/libs/sdk/client/src/lib/client/client.ts

+2-34
Original file line numberDiff line numberDiff line change
@@ -1,41 +1,9 @@
1+
import { DotCMSClientConfig, RequestOptions } from '@dotcms/types';
2+
13
import { Content } from './content/content-api';
24
import { NavigationClient } from './navigation/navigation-api';
35
import { PageClient } from './page/page-api';
46

5-
/**
6-
* Options for configuring fetch requests, excluding body and method properties.
7-
*/
8-
export type RequestOptions = Omit<RequestInit, 'body' | 'method'>;
9-
10-
/**
11-
* Configuration options for the DotCMS client.
12-
*/
13-
export interface DotCMSClientConfig {
14-
/**
15-
* The URL of the dotCMS instance.
16-
* Ensure to include the protocol (http or https).
17-
* @example `https://demo.dotcms.com`
18-
*/
19-
dotcmsUrl: string;
20-
21-
/**
22-
* The authentication token for requests.
23-
* Obtainable from the dotCMS UI.
24-
*/
25-
authToken: string;
26-
27-
/**
28-
* The id of the site you want to interact with. Defaults to the default site if not provided.
29-
*/
30-
siteId?: string;
31-
32-
/**
33-
* Additional options for the fetch request.
34-
* @example `{ headers: { 'Content-Type': 'application/json' } }`
35-
*/
36-
requestOptions?: RequestOptions;
37-
}
38-
397
/**
408
* Parses a string into a URL object.
419
*

‎core-web/libs/sdk/client/src/lib/client/content/content-api.ts

+5-5
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
1-
import { CollectionBuilder } from './builders/collection/collection';
1+
import { RequestOptions } from '@dotcms/types';
22

3-
import { ClientOptions } from '../../deprecated/sdk-js-client';
3+
import { CollectionBuilder } from './builders/collection/collection';
44

55
/**
66
* Creates a builder to filter and fetch a collection of content items.
@@ -55,15 +55,15 @@ import { ClientOptions } from '../../deprecated/sdk-js-client';
5555
* ```
5656
*/
5757
export class Content {
58-
#requestOptions: ClientOptions;
58+
#requestOptions: RequestOptions;
5959
#serverUrl: string;
6060

6161
/**
6262
* Creates an instance of Content.
63-
* @param {ClientOptions} requestOptions - The options for the client request.
63+
* @param {RequestOptions} requestOptions - The options for the client request.
6464
* @param {string} serverUrl - The server URL.
6565
*/
66-
constructor(requestOptions: ClientOptions, serverUrl: string) {
66+
constructor(requestOptions: RequestOptions, serverUrl: string) {
6767
this.#requestOptions = requestOptions;
6868
this.#serverUrl = serverUrl;
6969
}

0 commit comments

Comments
 (0)