[commerce-sdk-react] SCAPI Custom endpoint support #1793

kevinxh · 2024-05-16T21:05:50Z

Description

This PR introduces support for calling SCAPI custom endpoint. It upgrades commerce-sdk-isormorphic to the latest version v2. Two new hooks are introduced in this PR.

New hooks

useCustomQuery
useCustomMutation

Types of Changes

Bug fix (non-breaking change that fixes an issue)
New feature (non-breaking change that adds functionality)
Documentation update
Breaking change (could cause existing functionality to not work as expected)
Other changes (non-breaking changes that does not fit any of the above)

How to Test-Drive This PR

pull this branch
npm ci
cd ./packages/test-commerce-sdk-react && npm start
go to localhost:3000/custom-endpoint
check the custom query is successfully made with 200 and correct auth token

Checklists

General

Changes are covered by test cases
CHANGELOG.md updated with a short description of changes (not required for documentation updates)

Accessibility Compliance

You must check off all items in one of the follow two lists:

There are no changes to UI

or...

Changes were tested with a Screen Reader (iOS VoiceOver or Android Talkback) and had no issues
Changes comply with WCAG 2.0 guidelines levels A and AA
Changes to common UI patterns and interactions comply with WAI-ARIA best practices

Localization

Changes include a UI text update in the Retail React App (which requires translation)

packages/commerce-sdk-react/src/hooks/ShopperPromotions/query.test.ts

kevinxh · 2024-05-16T21:07:02Z

packages/commerce-sdk-react/src/hooks/ShopperOrders/index.test.ts

@@ -16,7 +16,7 @@ describe('Shopper Orders hooks', () => {
        const unimplemented = getUnimplementedEndpoints(ShopperOrders, queries, mutations)
        // If this test fails: create a new query hook, add the endpoint to the mutations enum,
        // or add it to the `expected` array with a comment explaining "TODO" or "never" (and why).
-        expect(unimplemented).toEqual([])
+        expect(unimplemented).toEqual(['guestOrderLookup'])


new method came from commerce-sdk-isomorphic@2

kevinxh · 2024-05-16T21:07:20Z

packages/commerce-sdk-react/src/hooks/ShopperCustomers/index.test.ts

-            'invalidateCustomerAuth', // DEPRECATED, not included
-            'authorizeCustomer', // DEPRECATED, not included
-            'authorizeTrustedSystem', // DEPRECATED, not included


Deprecated method removed from commerce-sdk-isomorphic@2

kevinxh · 2024-05-16T21:12:23Z

packages/test-commerce-sdk-react/app/components/_app-config/index.tsx

+            shortCode="kv7kzm78"
+            clientId="4afbc51f-6423-41c8-8b29-d7f2825b5bee"
+            organizationId="f_ecom_zzrf_006"


for custom endpoint manual testing, we have zzrf_006 setup for that

packages/commerce-sdk-react/src/hooks/types.ts

alexvuong · 2024-05-16T22:43:58Z

packages/commerce-sdk-react/src/hooks/types.ts

@@ -208,3 +209,14 @@ export type CacheUpdateMatrix<Client extends ApiClient> = {
        ? CacheUpdateGetter<MergedOptions<Client, Argument<Client[Method]>>, Data>
        : never
 }
+
+type CustomEndpointArg = Parameters<typeof helpers.callCustomEndpoint>[0]
+type CustomEndpointArgClientConfig = Parameters<


Suggested change

type CustomEndpointArgClientConfig = Parameters<

type CustomEndpointParam = Parameters<typeof helpers.callCustomEndpoint>[0]

type CustomEndpointClientConfig = CustomEndpointParam['clientConfig']

sorry i'm not quite understanding this diff, are you suggesting to rename CustomEndpointArgClientConfig to CustomEndpointParam?

This type is a partial of the entire param just to extract the client config.

packages/commerce-sdk-react/src/hooks/useQuery.ts

bendvc · 2024-05-17T18:35:23Z

packages/commerce-sdk-react/package.json

@@ -40,7 +40,7 @@
    "version": "node ./scripts/version.js"
  },
  "dependencies": {
-    "commerce-sdk-isomorphic": "^1.13.1",
+    "commerce-sdk-isomorphic": "^2.0.0",


Did we inadvertently force a breaking on this project by pumping this dependency as we are exposing the api clients via the useCommerceApi hook?

yes i think so

i'm bumping the major version for commerce-sdk-react too

bendvc · 2024-05-17T18:42:52Z

packages/commerce-sdk-react/src/hooks/useQuery.ts

+        `/${apiOptions.options.customApiPathParameters?.apiName || 'apiName'}`,
+        `/${apiOptions.options.customApiPathParameters?.apiVersion || 'apiVersion'}`,
+        `/organizations`,
+        `/${apiOptions.options.customApiPathParameters?.organizationId || 'organizationId'}`,
+        `/${apiOptions.options.customApiPathParameters?.endpointPath || 'endpointPath'}`,


I'm understanding the default values used to fallback on here, e.g. the static value 'apiName', 'apiVersion', 'organizationId' and 'endpointPath'.

If apiName isn't defined we probably already failed making the call.

we'll probably have to have duplicate logic that defines what the apiVersion is.. alternatively we have it exported from the isomorphic lib.

i think customApiPathParameters should be required, but it's optional at the moment, shall we fix that in commerce-sdk-isomorphic

Good call. i added a guard to make sure customApiPathParameters is defined before calling the api. otherwise throw error

bendvc · 2024-05-17T18:43:28Z

packages/pwa-kit-create-app/assets/bootstrap/js/package.json.hbs

@@ -21,7 +21,7 @@
  "bundlesize": [
    {
      "path": "build/main.js",
-      "maxSize": "43 kB"
+      "maxSize": "44 kB"


Ass we get older we get fatter 😭

bendvc · 2024-05-17T18:53:11Z

packages/commerce-sdk-react/src/hooks/useMutation.ts

+    CacheUpdateGetter,
+    ApiOptions,
+    ApiMethod,
+    ApiClient,
+    MergedOptions,
+    CustomEndpointArgClientConfigOptional


NIT: Might be an opportunity to sort this alphabetically.

sounds good

bendvc · 2024-05-17T18:58:00Z

packages/commerce-sdk-react/src/hooks/useMutation.ts

+                        shortCode: config.organizationId
+                    },
+                    proxy: config.proxy,
+                    ...clientConfig


This answers my previous question. 👍

Co-authored-by: Alex Vuong <alex.vuong@salesforce.com> Signed-off-by: Kevin He <kevin.he@salesforce.com>

…ceCommerceCloud/pwa-kit into custom-endpoint-support

kevinxh added 6 commits May 15, 2024 11:13

custom endpoint query

9943fee

add query key

2cc05db

add query test

31a716c

add useCustomMutation

15e0712

add useMutation test

51c4fb7

fix tests

6de641a

kevinxh requested a review from a team as a code owner May 16, 2024 21:05

kevinxh commented May 16, 2024

View reviewed changes

packages/commerce-sdk-react/src/hooks/ShopperPromotions/query.test.ts Outdated Show resolved Hide resolved

kevinxh commented May 16, 2024

View reviewed changes

remove console logs

3ee10de

kevinxh commented May 16, 2024

View reviewed changes

kevinxh added 5 commits May 16, 2024 14:36

merge client config

e2c4ab6

merge headers and client configs

2c4551f

add more tests

25fe405

add default strings

5c51521

add changelog

a3906c0

alexvuong reviewed May 16, 2024

View reviewed changes

packages/commerce-sdk-react/src/hooks/types.ts Outdated Show resolved Hide resolved

alexvuong reviewed May 16, 2024

View reviewed changes

packages/commerce-sdk-react/src/hooks/useQuery.ts Outdated Show resolved Hide resolved

alexvuong reviewed May 16, 2024

View reviewed changes

packages/commerce-sdk-react/src/hooks/useQuery.ts Outdated Show resolved Hide resolved

alexvuong reviewed May 16, 2024

View reviewed changes

packages/commerce-sdk-react/src/hooks/useQuery.ts Show resolved Hide resolved

bump size by 1kb

b32ec50

bendvc reviewed May 17, 2024

View reviewed changes

kevinxh added 2 commits May 21, 2024 10:49

rename types

57d39cc

re-order options to make it overriable

b988313

kevinxh and others added 8 commits May 21, 2024 10:58

Update packages/commerce-sdk-react/src/hooks/useQuery.ts

717109b

Co-authored-by: Alex Vuong <alex.vuong@salesforce.com> Signed-off-by: Kevin He <kevin.he@salesforce.com>

order alphabetically

1cfc058

Merge branch 'custom-endpoint-support' of https://github.com/Salesfor…

4c3ec0f

…ceCommerceCloud/pwa-kit into custom-endpoint-support

guard missing customApiPathParameters

dfdd49c

guard missing params

08ad401

export useCustomMutation

9ba471a

fix test

b2b3a69

merge changelog

0185552

kevinxh requested review from bendvc and alexvuong May 21, 2024 22:24

bendvc previously approved these changes May 22, 2024

View reviewed changes

reuse types

08b8bd9

kevinxh dismissed bendvc’s stale review via 08b8bd9 May 22, 2024 21:54

alexvuong previously approved these changes May 22, 2024

View reviewed changes

resolve merge conflict

84b4b4a

kevinxh dismissed alexvuong’s stale review via 84b4b4a May 22, 2024 22:32

bendvc approved these changes May 22, 2024

View reviewed changes

alexvuong approved these changes May 22, 2024

View reviewed changes

kevinxh merged commit dcfae70 into develop May 22, 2024
28 checks passed

kevinxh deleted the custom-endpoint-support branch May 22, 2024 22:52

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

[commerce-sdk-react] SCAPI Custom endpoint support #1793

[commerce-sdk-react] SCAPI Custom endpoint support #1793

kevinxh commented May 16, 2024 •

edited

Loading

kevinxh May 16, 2024

kevinxh May 16, 2024

kevinxh May 16, 2024 •

edited

Loading

alexvuong May 16, 2024

kevinxh May 21, 2024

bendvc May 17, 2024

kevinxh May 21, 2024

kevinxh May 21, 2024

bendvc May 17, 2024

kevinxh May 17, 2024

kevinxh May 21, 2024

bendvc May 17, 2024

bendvc May 17, 2024

kevinxh May 21, 2024

bendvc May 17, 2024

	type CustomEndpointArgClientConfig = Parameters<
	type CustomEndpointParam = Parameters<typeof helpers.callCustomEndpoint>[0]
	type CustomEndpointClientConfig = CustomEndpointParam['clientConfig']

[commerce-sdk-react] SCAPI Custom endpoint support #1793

[commerce-sdk-react] SCAPI Custom endpoint support #1793

Conversation

kevinxh commented May 16, 2024 • edited Loading

Description

New hooks

Types of Changes

How to Test-Drive This PR

Checklists

General

Accessibility Compliance

Localization

Choose a reason for hiding this comment

Choose a reason for hiding this comment

kevinxh May 16, 2024 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

kevinxh commented May 16, 2024 •

edited

Loading

kevinxh May 16, 2024 •

edited

Loading