From dae972058828185903d226ad27c278a6db38b4ea Mon Sep 17 00:00:00 2001
From: tsv2013 <tsv2013@users.noreply.github.com>
Date: Tue, 19 Sep 2023 14:36:47 +0300
Subject: [PATCH] Work for
 https://github.com/surveyjs/survey-creator/issues/4371 - added component
 container to completed page (#6978)

Co-authored-by: tsv2013 <tsv2013@noreply.github.com>
---
 .../survey-angular-ui/src/survey-content.component.html     | 1 +
 packages/survey-vue3-ui/src/Survey.vue                      | 6 ++++++
 src/knockout/templates/index.html                           | 1 +
 src/react/reactSurvey.tsx                                   | 1 +
 src/vue/survey.vue                                          | 1 +
 5 files changed, 10 insertions(+)

diff --git a/packages/survey-angular-ui/src/survey-content.component.html b/packages/survey-angular-ui/src/survey-content.component.html
index 88f29440a1..0b6dfd81db 100644
--- a/packages/survey-angular-ui/src/survey-content.component.html
+++ b/packages/survey-angular-ui/src/survey-content.component.html
@@ -26,6 +26,7 @@
         <ng-template [component]="{ name: 'sv-components-container', data: { survey: model, container: 'footer', needRenderWrapper: false } }"></ng-template>
         <div *ngIf="model.state === 'completed' && model.showCompletedPage" [class]="model.completedCss"
           [innerHtml]="model.processedCompletedHtml"></div>
+        <ng-template *ngIf="model.state === 'completed' && model.showCompletedPage" [component]="{ name: 'sv-components-container', data: { survey: model, container: 'completePage' } }"></ng-template>
         <div *ngIf="model.state === 'completedbefore'" [class]="model.completedBeforeCss"
           [innerHtml]="model.processedCompletedBeforeHtml"></div>
         <div *ngIf="model.state === 'loading'" [class]="model.loadingBodyCss" [innerHtml]="model.processedLoadingHtml"></div>
diff --git a/packages/survey-vue3-ui/src/Survey.vue b/packages/survey-vue3-ui/src/Survey.vue
index ef3e733300..400622df58 100644
--- a/packages/survey-vue3-ui/src/Survey.vue
+++ b/packages/survey-vue3-ui/src/Survey.vue
@@ -71,6 +71,12 @@
             v-html="getProcessedCompletedHtml()"
             :class="vueSurvey.completedCss"
           ></div>
+          <component
+            :is="'sv-components-container'"
+            :survey="vueSurvey"
+            :container="'completePage'"
+            :needRenderWrapper="true"
+          ></component>
         </div>
         <div
           v-if="vueSurvey.state === 'completedbefore'"
diff --git a/src/knockout/templates/index.html b/src/knockout/templates/index.html
index b063dc9ab3..f44244e5b4 100644
--- a/src/knockout/templates/index.html
+++ b/src/knockout/templates/index.html
@@ -35,6 +35,7 @@
               <!-- /ko -->
               <!-- ko if: state == "completed" && showCompletedPage -->
               <div data-bind="html: processedCompletedHtml, css: completedCss"></div>
+              <!-- ko component: { name: "sv-components-container", params: { survey: $data, container: "completePage", needRenderWrapper: false } } --><!-- /ko -->
               <!-- /ko -->
               <!-- ko if: state == "completedbefore" -->
               <div data-bind="html: locCompletedBeforeHtml.koRenderedHtml, css: completedBeforeCss"></div>
diff --git a/src/react/reactSurvey.tsx b/src/react/reactSurvey.tsx
index c85d892321..3c18bb6373 100644
--- a/src/react/reactSurvey.tsx
+++ b/src/react/reactSurvey.tsx
@@ -145,6 +145,7 @@ export class Survey extends SurveyElementBase<any, any>
           dangerouslySetInnerHTML={htmlValue}
           className={this.survey.completedCss}
         />
+        <ComponentsContainer survey={this.survey} container={"completePage"} needRenderWrapper={false}></ComponentsContainer>
       </React.Fragment>
     );
   }
diff --git a/src/vue/survey.vue b/src/vue/survey.vue
index 70e6629cca..98d70ba54a 100644
--- a/src/vue/survey.vue
+++ b/src/vue/survey.vue
@@ -32,6 +32,7 @@
             v-html="getProcessedCompletedHtml()"
             :class="vueSurvey.completedCss"
           ></div>
+          <component :is="'sv-components-container'" :survey="vueSurvey" :container="'completePage'"></component>
         </div>
         <div
           v-if="vueSurvey.state === 'completedbefore'"