fix: STRF-13605 Support local to be channel-specific (#1318)

Author: jairo-bc

lib/stencil-start.js

@@ -58,35 +58,38 @@ class StencilStart {
         const initialStencilConfig = await this._stencilConfigManager.read();
         // Use initial (before updates) port for BrowserSync
         const browserSyncPort = cliOptions.port || initialStencilConfig.port;
-        const channelUrl = await this.getChannelUrl(initialStencilConfig, cliOptions);
+        const channelInfo = await this.getChannelInfo(initialStencilConfig, cliOptions);
         const storeInfoFromAPI = await this._themeApiClient.checkCliVersion({
-            storeUrl: channelUrl,
+            storeUrl: channelInfo.url,
         });
         const updatedStencilConfig = this.updateStencilConfig(
             initialStencilConfig,
             storeInfoFromAPI,
             browserSyncPort,
         );
+
         this._storeSettingsLocale = await this.getStoreSettingsLocale(
             cliOptions,
             updatedStencilConfig,
+            channelInfo.channel_id,
         );
         await this.startLocalServer(cliOptions, updatedStencilConfig);
         this._logger.log(this.getStartUpInfo(updatedStencilConfig));
         await this.startBrowserSync(cliOptions, browserSyncPort);
     }
 
-    async getStoreSettingsLocale(cliOptions, stencilConfig) {
+    async getStoreSettingsLocale(cliOptions, stencilConfig, channelId) {
         const { accessToken } = stencilConfig;
         const apiHost = cliOptions.apiHost || stencilConfig.apiHost;
         return this._storeSettingsApiClient.getStoreSettingsLocale({
             storeHash: this.storeHash,
             accessToken,
             apiHost,
+            channelId,
         });
     }
 
-    async getChannelUrl(stencilConfig, cliOptions) {
+    async getChannelInfo(stencilConfig, cliOptions) {
         const { accessToken } = stencilConfig;
         const apiHost = cliOptions.apiHost || stencilConfig.apiHost;
         this.storeHash = await this._themeApiClient.getStoreHash({
@@ -106,7 +109,7 @@ class StencilStart {
         const foundChannel = channels.find(
             (channel) => channel.channel_id === parseInt(channelId, 10),
         );
-        return foundChannel ? foundChannel.url : null;
+        return foundChannel || null;
     }
 
     /**

lib/stencil-start.spec.js

@@ -137,22 +137,27 @@ describe('StencilStart unit tests', () => {
         const storeHash = 'storeHash_value';
         const channelId = 5;
         const storeUrl = 'https://www.example.com';
-        it('should obtain channel id from the api', async () => {
+        it('should obtain channel info object from the api when no channelUrl is provided', async () => {
             const channels = [{ channel_id: channelId, url: storeUrl }];
             const themeApiClientStub = {
                 checkCliVersion: jest.fn(),
                 getStoreHash: jest.fn().mockResolvedValue(storeHash),
                 getStoreChannels: jest.fn().mockResolvedValue(channels),
             };
+            const stencilPushUtilsStub = {
+                promptUserToSelectChannel: jest.fn().mockResolvedValue(channelId),
+            };
             const { instance } = createStencilStartInstance({
                 themeApiClient: themeApiClientStub,
-                stencilPushUtils: stencilPushUtilsModule,
+                stencilPushUtils: stencilPushUtilsStub,
             });
-            const result = await instance.getChannelUrl({ accessToken }, { apiHost });
-            expect(result).toEqual(storeUrl);
+            const stencilConfig = { accessToken, normalStoreUrl: 'https://example.com', apiHost };
+            const cliOptions = { apiHost };
+            const result = await instance.getChannelInfo(stencilConfig, cliOptions);
+            expect(result).toEqual(channels[0]);
         });
 
-        it('should obtain channel url from the CLI', async () => {
+        it('should return the channelUrl string from cliOptions if provided', async () => {
             const channelUrl = 'https://shop.bigcommerce.com';
             const channels = [{ channel_id: channelId, url: storeUrl }];
             const themeApiClientStub = {
@@ -164,7 +169,9 @@ describe('StencilStart unit tests', () => {
                 themeApiClient: themeApiClientStub,
                 stencilPushUtils: stencilPushUtilsModule,
             });
-            const result = await instance.getChannelUrl({ accessToken }, { apiHost, channelUrl });
+            const stencilConfig = { accessToken, normalStoreUrl: 'https://example.com', apiHost };
+            const cliOptions = { apiHost, channelUrl };
+            const result = await instance.getChannelInfo(stencilConfig, cliOptions);
             expect(result).toEqual(channelUrl);
         });
     });
@@ -173,9 +180,23 @@ describe('StencilStart unit tests', () => {
         it('should read port from the config file', async () => {
             const port = 1234;
             const browserSyncStub = getBrowserSyncStub();
+            const themeApiClientStub = {
+                checkCliVersion: jest
+                    .fn()
+                    .mockResolvedValue({ baseUrl: 'example.com', sslUrl: 'https://example.com' }),
+                getStoreHash: jest.fn().mockResolvedValue('storeHash_value'),
+                getStoreChannels: jest
+                    .fn()
+                    .mockResolvedValue([{ channel_id: 5, url: 'https://www.example.com' }]),
+            };
+            const stencilPushUtilsStub = {
+                promptUserToSelectChannel: jest.fn().mockResolvedValue(5),
+            };
             const { instance } = createStencilStartInstance({
                 browserSync: browserSyncStub,
                 stencilConfigManager: getStencilConfigManagerStub({ port }),
+                themeApiClient: themeApiClientStub,
+                stencilPushUtils: stencilPushUtilsStub,
             });
             instance.startLocalServer = jest.fn();
             instance.getStartUpInfo = jest.fn().mockReturnValue('Start up info');
@@ -191,9 +212,23 @@ describe('StencilStart unit tests', () => {
         it('should read port from the cli', async () => {
             const port = 1234;
             const browserSyncStub = getBrowserSyncStub();
+            const themeApiClientStub = {
+                checkCliVersion: jest
+                    .fn()
+                    .mockResolvedValue({ baseUrl: 'example.com', sslUrl: 'https://example.com' }),
+                getStoreHash: jest.fn().mockResolvedValue('storeHash_value'),
+                getStoreChannels: jest
+                    .fn()
+                    .mockResolvedValue([{ channel_id: 5, url: 'https://www.example.com' }]),
+            };
+            const stencilPushUtilsStub = {
+                promptUserToSelectChannel: jest.fn().mockResolvedValue(5),
+            };
             const { instance } = createStencilStartInstance({
                 browserSync: browserSyncStub,
                 stencilConfigManager: getStencilConfigManagerStub({ port: 5678 }),
+                themeApiClient: themeApiClientStub,
+                stencilPushUtils: stencilPushUtilsStub,
             });
             instance.startLocalServer = jest.fn();
             instance.getStartUpInfo = jest.fn().mockReturnValue('Start up info');

lib/store-settings-api-client.js

@@ -2,29 +2,50 @@ import 'colors';
 import NetworkUtils from './utils/NetworkUtils.js';
 
 const networkUtils = new NetworkUtils();
-async function getStoreSettingsLocale({ apiHost, storeHash, accessToken }) {
+
+async function getStoreSettingsLocaleWithChannel({ apiHost, storeHash, accessToken, channelId }) {
+    let url = `${apiHost}/stores/${storeHash}/v3/settings/store/locale`;
+    if (channelId) {
+        url += `?channel_id=${channelId}`;
+    }
+    const response = await networkUtils.sendApiRequest({
+        url,
+        accessToken,
+    });
+
+    return response.data.data;
+}
+
+async function getStoreSettingsLocale({ apiHost, storeHash, accessToken, channelId }) {
     try {
-        const response = await networkUtils.sendApiRequest({
-            url: `${apiHost}/stores/${storeHash}/v3/settings/store/locale`,
+        let data = await getStoreSettingsLocaleWithChannel({
+            apiHost,
+            storeHash,
             accessToken,
+            channelId,
         });
-        if (!response.data.data) {
+        // if no data available for the channel provided, default to global setting.
+        if (!data) {
+            data = await getStoreSettingsLocaleWithChannel({ apiHost, storeHash, accessToken });
+        }
+        if (!data) {
             throw new Error('Received empty store locale in the server response'.red);
-        } else if (!response.data.data.default_shopper_language) {
+        } else if (!data.default_shopper_language) {
             throw new Error(
                 'Received empty default_shopper_language field in the server response'.red,
             );
-        } else if (!response.data.data.shopper_language_selection_method) {
+        } else if (!data.shopper_language_selection_method) {
             throw new Error(
                 'Received empty shopper_language_selection_method field in the server response'.red,
             );
         }
-        return response.data.data;
+        return data;
     } catch (err) {
         err.name = 'StoreSettingsLocaleError';
         throw err;
     }
 }
+
 export { getStoreSettingsLocale };
 export default {
     getStoreSettingsLocale,