Merge pull request #325 from scratchfoundation/IPR-1063

feat: [IPR-1063] Add locale to editor state props

Author: MiroslavDionisiev

.github/workflows/publish.yml

@@ -112,12 +112,7 @@ jobs:
 
       - name: Publish scratch-gui-standalone
         run: |
-          jq '
-            .name = "@scratch/scratch-gui-standalone" |
-            del(.peerDependencies) |
-            .exports."." = .exports."./standalone" |
-            del(.exports."./standalone")
-          ' ./packages/scratch-gui/package.json | npx sponge ./packages/scratch-gui/package.json
+          bash ./scripts/prepare-standalone-gui.sh
 
           npm --workspace=@scratch/scratch-gui-standalone run clean && npm --workspace=@scratch/scratch-gui-standalone run build:dist-standalone
           npm publish --access=public --tag="${{steps.npm_tag.outputs.npm_tag}}" --workspace=@scratch/scratch-gui-standalone

packages/scratch-gui/src/exported-reducers.ts

@@ -1,5 +1,5 @@
 import {ScratchPaintReducer} from 'scratch-paint';
-import LocalesReducer, {localesInitialState, initLocale} from './reducers/locales.js';
+import LocalesReducer, {localesInitialState, initLocale, selectLocale} from './reducers/locales.js';
 import GuiReducer, {buildInitialState, guiMiddleware, initEmbedded, initFullScreen, initPlayer} from './reducers/gui';
 import {setFullScreen, setPlayer, setEmbedded} from './reducers/mode.js';
 import {activateDeck} from './reducers/cards.js';
@@ -49,5 +49,6 @@ export {
     setFullScreen,
     setPlayer,
     setEmbedded,
-    activateDeck
+    activateDeck,
+    selectLocale
 };

packages/scratch-gui/src/lib/app-state-provider-hoc.jsx

@@ -4,7 +4,6 @@ import PropTypes from 'prop-types';
 
 import {EditorState} from './editor-state';
 import {setPlayer, setFullScreen, setEmbedded} from '../reducers/mode.js';
-import ConnectedIntlProvider from './connected-intl-provider.jsx';
 
 /**
  * Wraps the editor into the redux state contained within an EditorState instance.
@@ -39,11 +38,9 @@ export const AppStateProviderHOC = function (WrappedComponent) {
             } = this.props;
             return (
                 <Provider store={appState.store}>
-                    <ConnectedIntlProvider>
-                        <WrappedComponent
-                            {...componentProps}
-                        />
-                    </ConnectedIntlProvider>
+                    <WrappedComponent
+                        {...componentProps}
+                    />
                 </Provider>
             );
         }

packages/scratch-gui/src/lib/editor-state.tsx

@@ -21,6 +21,7 @@ export interface EditorStateParams {
     isPlayerOnly?: boolean;
     showTelemetryModal?: boolean;
     isEmbedded?: boolean;
+    locale?: string;
 }
 
 /**
@@ -40,10 +41,22 @@ export class EditorState {
         let enhancer;
 
         let initializedLocales = localesInitialState;
-        const locale = detectLocale(Object.keys(locales));
+
+        let locale = 'en';
+        if (params.locale) {
+            if (Object.keys(locales).includes(params.locale)) {
+                locale = params.locale;
+            } else {
+                console.warn(`Unsupported locale ${params.locale}, falling back to en`);
+            }
+        } else {
+            locale = detectLocale(Object.keys(locales));
+        }
+
         if (locale !== 'en') {
             initializedLocales = initLocale(initializedLocales, locale);
         }
+
         if (params.localesOnly) {
             // Used for instantiating minimal state for the unsupported
             // browser modal

scripts/prepare-standalone-gui.sh

@@ -0,0 +1,10 @@
+jq '
+    if .name != "@scratch/scratch-gui-standalone" then
+        .name = "@scratch/scratch-gui-standalone" |
+        del(.peerDependencies) |
+        .exports."." = .exports."./standalone" |
+        del(.exports."./standalone")
+    else
+        .
+    end
+' ./packages/scratch-gui/package.json | npx sponge ./packages/scratch-gui/package.json