#520166 fixed comments

packages/create-sitecore-jss/src/templates/nextjs-sxa/src/pages/_app.tsx

@@ -0,0 +1,20 @@
+import type { AppProps } from 'next/app';
+import { I18nProvider } from 'next-localization';
+
+import 'assets/sxa-styles.css';
+import 'assets/app.css';
+
+function App({ Component, pageProps }: AppProps): JSX.Element {
+  const { dictionary, ...rest } = pageProps;
+
+  return (
+    // Use the next-localization (w/ rosetta) library to provide our translation dictionary to the app.
+    // Note Next.js does not (currently) provide anything for translation, only i18n routing.
+    // If your app is not multilingual, next-localization and references to it can be removed.
+    <I18nProvider lngDict={dictionary} locale={pageProps.locale}>
+      <Component {...rest} />
+    </I18nProvider>
+  );
+}
+
+export default App;

packages/sitecore-jss-react/src/components/Placeholder.tsx

@@ -4,9 +4,6 @@ import { withComponentFactory } from '../enhancers/withComponentFactory';
 import { ComponentRendering, HtmlElementRendering } from '@sitecore-jss/sitecore-jss/layout';
 import { HorizonEditor } from '@sitecore-jss/sitecore-jss/utils';
 
-// TODO: common marker by which we find container fo replacing
-const PREFIX_PLACEHOLDER = 'container-{*}';
-
 export interface PlaceholderComponentProps extends PlaceholderProps {
   /**
    * Render props function that is called when the placeholder contains no content components.
@@ -74,17 +71,6 @@ class PlaceholderComponent extends PlaceholderCommon<PlaceholderComponentProps>
   }
 
   render() {
-    const {
-      name,
-      rendering: { placeholders },
-    } = this.props;
-    // TODO: it needs for deleting dynamics placeholder when we set him number(props.name) of container.
-    //  from backend side we get common name of placeholder is called 'container-{*}' where '{*}' marker for replacing
-    if (placeholders && placeholders[PREFIX_PLACEHOLDER]) {
-      placeholders[name] = placeholders[PREFIX_PLACEHOLDER];
-      delete placeholders[PREFIX_PLACEHOLDER];
-    }
-
     const childProps: PlaceholderComponentProps = { ...this.props };
 
     delete childProps.componentFactory;

packages/sitecore-jss-react/src/components/PlaceholderCommon.tsx

@@ -12,6 +12,9 @@ import {
 import { convertAttributesToReactProps } from '../utils';
 import { HiddenRendering, HIDDEN_RENDERING_NAME } from './HiddenRendering';
 
+/** [SXA] common marker by which we find container fo replacing **/
+const PREFIX_PLACEHOLDER = 'container-{*}';
+
 type ErrorComponentProps = {
   [prop: string]: unknown;
 };
@@ -117,6 +120,13 @@ export class PlaceholderCommon<T extends PlaceholderProps> extends React.Compone
     name: string
   ) {
     let result;
+    /** [SXA] it needs for deleting dynamics placeholder when we set him number(props.name) of container.
+    from backend side we get common name of placeholder is called 'container-{*}' where '{*}' marker for replacing **/
+    if (rendering && rendering.placeholders && rendering.placeholders[PREFIX_PLACEHOLDER]) {
+      rendering.placeholders[name] = rendering.placeholders[PREFIX_PLACEHOLDER];
+      delete rendering.placeholders[PREFIX_PLACEHOLDER];
+    }
+
     if (rendering && rendering.placeholders && Object.keys(rendering.placeholders).length > 0) {
       result = rendering.placeholders[name];
     } else {