diff --git a/dotcom-rendering/package.json b/dotcom-rendering/package.json index 5245b501b3b..596e85f9df2 100644 --- a/dotcom-rendering/package.json +++ b/dotcom-rendering/package.json @@ -45,7 +45,7 @@ "@emotion/server": "11.11.0", "@guardian/ab-core": "7.0.1", "@guardian/braze-components": "18.1.0", - "@guardian/bridget": "2.6.0", + "@guardian/bridget": "0.0.0-2024-02-28-SNAPSHOT-DISC", "@guardian/browserslist-config": "6.1.0", "@guardian/cdk": "50.13.0", "@guardian/commercial": "17.0.0", diff --git a/dotcom-rendering/src/components/Discussion/AbuseReportForm.tsx b/dotcom-rendering/src/components/Discussion/AbuseReportForm.tsx index 8fee58a8f9c..7e5732f36a6 100644 --- a/dotcom-rendering/src/components/Discussion/AbuseReportForm.tsx +++ b/dotcom-rendering/src/components/Discussion/AbuseReportForm.tsx @@ -159,10 +159,10 @@ export const AbuseReportForm = ({ } reportAbuse({ - categoryId, + categoryId: categoryId.toString(), reason, email, - commentId, + commentId: commentId.toString(), }) .then((response) => { if (response.kind === 'error') { diff --git a/dotcom-rendering/src/components/Discussion/CommentForm.tsx b/dotcom-rendering/src/components/Discussion/CommentForm.tsx index 92797fada4f..f8fd2148ef8 100644 --- a/dotcom-rendering/src/components/Discussion/CommentForm.tsx +++ b/dotcom-rendering/src/components/Discussion/CommentForm.tsx @@ -330,7 +330,11 @@ export const CommentForm = ({ if (body) { const response = commentBeingRepliedTo - ? await user.onReply(shortUrl, body, commentBeingRepliedTo.id) + ? await user.onReply( + shortUrl, + body, + commentBeingRepliedTo.id.toString(), + ) : await user.onComment(shortUrl, body); // Check response message for error states if (response.kind === 'error') { diff --git a/dotcom-rendering/src/components/Discussion/RecommendationCount.tsx b/dotcom-rendering/src/components/Discussion/RecommendationCount.tsx index b1b269a4fbc..78e5d7b9621 100644 --- a/dotcom-rendering/src/components/Discussion/RecommendationCount.tsx +++ b/dotcom-rendering/src/components/Discussion/RecommendationCount.tsx @@ -63,7 +63,7 @@ export const RecommendationCount = ({ setCount(newCount); setRecommended(true); - user.onRecommend(commentId) + user.onRecommend(commentId.toString()) .then((accepted) => { if (!accepted) { setCount(newCount - 1); diff --git a/dotcom-rendering/src/components/DiscussionApps.importable.tsx b/dotcom-rendering/src/components/DiscussionApps.importable.tsx index d362e58e494..3321bcc5ee7 100644 --- a/dotcom-rendering/src/components/DiscussionApps.importable.tsx +++ b/dotcom-rendering/src/components/DiscussionApps.importable.tsx @@ -3,58 +3,148 @@ import { getdiscussionClient } from '../lib/bridgetApi'; import type { Reader, UserProfile } from '../lib/discussion'; import type { CommentResponse } from '../lib/discussionApi'; import { reportAbuse as reportAbuseWeb } from '../lib/discussionApi'; -import type { Result } from '../lib/result'; +import { error, ok, type Result } from '../lib/result'; import { Discussion, type Props as DiscussionProps } from './Discussion'; type Props = Omit; -const onComment = async (): Promise => { - console.log('onComment'); - return { kind: 'error', error: 'ApiError' }; +const onComment = async ( + shortUrl: string, + body: string, +): Promise => { + return getdiscussionClient() + .comment(shortUrl, body) + .then((response) => { + if (response.__type == 'error') { + return { + kind: 'error', + error: 'NativeError', + }; + } else { + if (response.response.errorCode) { + return { + kind: 'error', + error: 'ApiError', + }; + } + + return ok(Number(response.response.message)); + } + }); }; -const onReply = async (): Promise => { - console.log('onReply'); - return { kind: 'error', error: 'ApiError' }; +const onReply = async ( + shortUrl: string, + body: string, + parentCommentId: string, +): Promise => { + return getdiscussionClient() + .reply(shortUrl, body, parentCommentId) + .then((response) => { + if (response.__type == 'error') { + return { + kind: 'error', + error: 'NativeError', + }; + } else { + if (response.response.errorCode) { + return { + kind: 'error', + error: 'ApiError', + }; + } + + return ok(Number(response.response.message)); + } + }); }; -const onRecommend = async (commentId: number): Promise => { - return getdiscussionClient().recommend(commentId); +const onRecommend = async (commentId: string): Promise => { + return getdiscussionClient() + .recommend(commentId) + .then((response) => { + if (response.__type === 'error') { + return false; + } else { + if (response.response.statusCode === 200) return true; + return false; + } + }); }; -const addUsername = async (): Promise> => { - console.log('addUsername'); - return { kind: 'error', error: 'ApiError' }; +const addUsername = async (username: string): Promise> => { + return getdiscussionClient() + .addUsername(username) + .then((response) => { + if (response.__type === 'error') { + return error('NativeError'); + } else { + if (response.response.errorCode) { + return error('ApiError'); + } + return ok(true); + } + }); }; -/*** - * Currently we are using the web handler for both authenticated and unauthenticated users. - * Once we have knowlege of if the user is authenticated from bridget, we can implement an apps-specific function below, to allow us to send user data to analytics. - */ -// const reportAbuse = async (): Promise> => { -// console.log('reportAbuse'); -// return { kind: 'error', error: 'ApiError' }; -// }; +const reportAbuse = async ({ + commentId, + categoryId, + reason, + email, +}: { + commentId: string; + categoryId: string; + reason?: string; + email?: string; +}): Promise> => { + return getdiscussionClient() + .reportAbuse({ commentId, categoryId, reason, email }) + .then((response) => { + if (response.__type == 'error') { + return error('NativeError'); + } else { + if (response.response.errorCode) { + return error('ApiError'); + } -const mockedProfile: UserProfile = { - userId: 'userId', - displayName: 'displayName', - webUrl: 'webUrl', - apiUrl: 'apiUrl', - avatar: 'avatar', - secureAvatarUrl: 'secureAvatarUrl', - badge: [], + return ok(true); + } + }); }; const getUser = async (): Promise => { - return { - kind: 'Reader', - onComment, - onReply, - onRecommend, - addUsername, - reportAbuse: reportAbuseWeb(undefined), - profile: mockedProfile, - }; + return getdiscussionClient() + .getUserProfile() + .then((response) => { + // TODO: I don't think we're handling a discussion API + // error for this request in the Bridget API + + if (response.__type === 'profile') { + const profile = response.profile; + const userProfile = { + userId: profile.userId, + displayName: profile.displayName, + webUrl: profile.webUrl, + apiUrl: profile.apiUrl, + avatar: profile.avatar, + secureAvatarUrl: profile.secureAvatarUrl, + badge: [], + } as UserProfile; + + return { + kind: 'Reader', + onComment, + onReply, + onRecommend, + addUsername, + reportAbuse, + profile: userProfile, + }; + } else { + // TODO: Handle the error properly + throw error('NativeError'); + } + }); }; export const DiscussionApps = (props: Props) => { diff --git a/dotcom-rendering/src/lib/discussionApi.tsx b/dotcom-rendering/src/lib/discussionApi.tsx index 9df1fde9e52..8d071916cb7 100644 --- a/dotcom-rendering/src/lib/discussionApi.tsx +++ b/dotcom-rendering/src/lib/discussionApi.tsx @@ -162,6 +162,7 @@ export const preview = async ( export type CommentResponse = Result< | 'NetworkError' | 'ApiError' + | 'NativeError' | (ReturnType & { kind: 'error' })['error'], number >; @@ -198,7 +199,7 @@ export const reply = async ( shortUrl: string, body: string, - parentCommentId: number, + parentCommentId: string, ): Promise => { const url = joinUrl( @@ -206,7 +207,7 @@ export const reply = 'discussion', shortUrl, 'comment', - parentCommentId.toString(), + parentCommentId, 'reply', ) + objAsParams(defaultParams); const data = new URLSearchParams(); @@ -264,22 +265,18 @@ export const reportAbuse = email, reason, }: { - commentId: number; - categoryId: number; + commentId: string; + categoryId: string; reason?: string; email?: string; }): Promise> => { const url = - joinUrl( - options.baseUrl, - 'comment', - commentId.toString(), - 'reportAbuse', - ) + objAsParams(defaultParams); + joinUrl(options.baseUrl, 'comment', commentId, 'reportAbuse') + + objAsParams(defaultParams); const data = new URLSearchParams(); - data.append('categoryId', categoryId.toString()); - email && data.append('email', email.toString()); + data.append('categoryId', categoryId); + email && data.append('email', email); reason && data.append('reason', reason); const authOptions = authStatus @@ -306,14 +303,10 @@ export const reportAbuse = export const recommend = (authStatus: SignedInWithCookies | SignedInWithOkta) => - async (commentId: number): Promise => { + async (commentId: string): Promise => { const url = - joinUrl( - options.baseUrl, - 'comment', - commentId.toString(), - 'recommend', - ) + objAsParams(defaultParams); + joinUrl(options.baseUrl, 'comment', commentId, 'recommend') + + objAsParams(defaultParams); const authOptions = getOptionsHeadersWithOkta(authStatus); diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index cca7cf97fb1..d82ccf9f399 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -1,9 +1,5 @@ lockfileVersion: '6.0' -settings: - autoInstallPeers: true - excludeLinksFromLockfile: false - importers: .: @@ -345,8 +341,8 @@ importers: specifier: 18.1.0 version: 18.1.0(@emotion/react@11.11.1)(@guardian/libs@16.0.1)(@guardian/source-foundations@14.1.4)(@guardian/source-react-components-development-kitchen@19.0.0)(@guardian/source-react-components@22.0.1)(react@18.2.0) '@guardian/bridget': - specifier: 2.6.0 - version: 2.6.0 + specifier: 0.0.0-2024-02-28-SNAPSHOT-DISC + version: 0.0.0-2024-02-28-SNAPSHOT-DISC '@guardian/browserslist-config': specifier: 6.1.0 version: 6.1.0(browserslist@4.21.9)(tslib@2.6.2) @@ -4241,6 +4237,10 @@ packages: react: 18.2.0 dev: false + /@guardian/bridget@0.0.0-2024-02-28-SNAPSHOT-DISC: + resolution: {integrity: sha512-W+cxY6oMbU2ldJgbm/ADmBFC1YRjoKcoftmDte4oVqtYthJaR/z9BcYEAtHx0skss+P/05Bphg28bs/dEo7Msg==} + dev: false + /@guardian/bridget@2.6.0: resolution: {integrity: sha512-kYlRZC5/9ImY2wQJfnteanjfLclmSU0wcsyt2CWl5YXHmc3gGnxZM+H/Y6KVqwxj0v5cGrvUuFJ7Zvk570dchQ==} dev: false @@ -11920,7 +11920,7 @@ packages: debug: 4.3.4(supports-color@8.1.1) enhanced-resolve: 5.15.0 eslint: 8.56.0 - eslint-module-utils: 2.8.0(@typescript-eslint/parser@5.61.0)(eslint-import-resolver-node@0.3.9)(eslint-import-resolver-typescript@3.5.5)(eslint@8.56.0) + eslint-module-utils: 2.8.0(@typescript-eslint/parser@6.18.0)(eslint-import-resolver-node@0.3.9)(eslint-import-resolver-typescript@3.6.1)(eslint@8.56.0) eslint-plugin-import: 2.26.0(@typescript-eslint/parser@5.61.0)(eslint-import-resolver-typescript@3.5.5)(eslint@8.56.0) get-tsconfig: 4.7.2 globby: 13.2.2 @@ -20596,3 +20596,7 @@ packages: name: babel-plugin-px-to-rem version: 0.1.0 dev: false + +settings: + autoInstallPeers: true + excludeLinksFromLockfile: false