Add feedback alert for on-demand scans

This change should show an alert to users to
solicit feedback on DAST on-demand scan page

app/assets/javascripts/vue_shared/components/dismissible_feedback_alert.vue

@@ -22,7 +22,7 @@ export default {
   },
   data() {
     return {
-      isDismissed: 'false',
+      isDismissed: false,
     };
   },
   computed: {
@@ -30,12 +30,12 @@ export default {
       return `${slugifyWithUnderscore(this.featureName)}_feedback_dismissed`;
     },
     showAlert() {
-      return this.isDismissed === 'false';
+      return !this.isDismissed;
     },
   },
   methods: {
     dismissFeedbackAlert() {
-      this.isDismissed = 'true';
+      this.isDismissed = true;
     },
   },
 };
@@ -43,16 +43,12 @@ export default {
 
 <template>
   <div v-show="showAlert">
-    <local-storage-sync
-      :value="isDismissed"
-      :storage-key="storageKey"
-      @input="dismissFeedbackAlert"
-    />
+    <local-storage-sync v-model="isDismissed" :storage-key="storageKey" as-json />
     <gl-alert v-if="showAlert" class="gl-mt-5" @dismiss="dismissFeedbackAlert">
       <gl-sprintf
         :message="
           __(
-            'We’ve been making changes to %{featureName} and we’d love your feedback %{linkStart}in this issue%{linkEnd} to help us improve the experience.',
+            'Please share your feedback about %{featureName} %{linkStart}in this issue%{linkEnd} to help us improve the experience.',
           )
         "
       >

ee/app/assets/javascripts/on_demand_scans/components/on_demand_scans_form.vue

@@ -20,6 +20,7 @@ import glFeatureFlagsMixin from '~/vue_shared/mixins/gl_feature_flags_mixin';
 import { s__ } from '~/locale';
 import { redirectTo } from '~/lib/utils/url_utility';
 import dastOnDemandScanCreateMutation from '../graphql/dast_on_demand_scan_create.mutation.graphql';
+import DismissibleFeedbackAlert from '~/vue_shared/components/dismissible_feedback_alert.vue';
 
 const ERROR_RUN_SCAN = 'ERROR_RUN_SCAN';
 const ERROR_FETCH_SCANNER_PROFILES = 'ERROR_FETCH_SCANNER_PROFILES';
@@ -54,6 +55,7 @@ export default {
     GlDropdownItem,
     GlSkeletonLoader,
     GlSprintf,
+    DismissibleFeedbackAlert,
   },
   directives: {
     GlTooltip: GlTooltipDirective,
@@ -238,6 +240,15 @@ export default {
 
 <template>
   <gl-form @submit.prevent="onSubmit">
+    <!--
+      This is a temporary change to solicit feedback from users
+      and shall be removed in https://gitlab.com/gitlab-org/gitlab/-/issues/255889
+    -->
+    <dismissible-feedback-alert
+      feature-name="on-demand DAST scans"
+      feedback-link="https://gitlab.com/gitlab-org/gitlab/-/issues/249684"
+    />
+
     <header class="gl-mb-6">
       <h2>{{ s__('OnDemandScans|New on-demand DAST scan') }}</h2>
       <p>

ee/changelogs/unreleased/djadmin-dast-feedback-alerts.yml

+---
+title: Add feedback alert in DAST On-demand Scans
+merge_request: 43374
+author:
+type: added

locale/gitlab.pot

@@ -18978,6 +18978,9 @@ msgstr ""
 msgid "Please set a new password before proceeding."
 msgstr ""
 
+msgid "Please share your feedback about %{featureName} %{linkStart}in this issue%{linkEnd} to help us improve the experience."
+msgstr ""
+
 msgid "Please solve the reCAPTCHA"
 msgstr ""
 
@@ -28710,9 +28713,6 @@ msgstr ""
 msgid "Welcome to your issue board!"
 msgstr ""
 
-msgid "We’ve been making changes to %{featureName} and we’d love your feedback %{linkStart}in this issue%{linkEnd} to help us improve the experience."
-msgstr ""
-
 msgid "What are you searching for?"
 msgstr ""