Merge pull request #157 from weni-ai/feature/adjusting-ia-logics

[ENGAGE-1784] - Adjust comments logic, clickOutSide and NanValues in prompt - Generate Insights

src/components/insights/Layout/Header.vue

@@ -21,7 +21,7 @@
  iconCenter="ios_share"
  type="secondary"
  /> -->
- <HeaderGenerateInsightButton />
+ <HeaderGenerateInsightButton v-if="isRenderInsightButton" />
  </section>
  </section>
  </header>
@@ -60,6 +60,10 @@ export default {
  dashboardDefault: 'dashboards/dashboardDefault',
  }),
 
+ isRenderInsightButton() {
+ return this.currentDashboard?.name === 'human_service_dashboard.title';
+ },
+
  breadcrumbs() {
  const { currentDashboard } = this;
  const { dashboardUuid } = this.$route.params;

src/components/insights/Layout/HeaderGenerateInsights/HeaderGenerateInsightModal.vue

@@ -2,6 +2,7 @@
  <Transition>
  <section
  v-if="show"
+ ref="insightModal"
  class="header-generate-insight-modal"
  @click.stop
  >
@@ -43,8 +44,8 @@
  :isRenderFooterFeedback="isRenderFooterFeedback"
  :isBtnYesActive="isBtnYesActive"
  :isBtnNoActive="isBtnNoActive"
- :feedbackText="feedbackText"
  :isSubmitFeedbackLoading="isSubmitFeedbackLoading"
+ @update-feedback-text="handleFeedbackText"
  @handle-positive-feedback="handlePositiveFeedback"
  @handle-negative-feedback="handleNegativeFeedback"
  @submit-review="submitReview"
@@ -60,6 +61,8 @@ import InsightModalFooter from './InsightModalFooter.vue';
 import firebaseService from '@/services/api/resources/GPT';
 import mitt from 'mitt';
 import { formatSecondsToHumanString } from '@/utils/time';
+import { onClickOutside } from '@vueuse/core';
+import { ref } from 'vue';
 
 const emitter = mitt();
 
@@ -80,6 +83,15 @@ export default {
 
  emits: ['close'],
 
+ setup(_, context) {
+ const insightModal = ref(null);
+ onClickOutside(insightModal, () => context.emit('close'));
+
+ return {
+ insightModal,
+ };
+ },
+
  data() {
  return {
  generatedInsight: '',
@@ -153,15 +165,8 @@ export default {
  this.isSubmitFeedbackLoading = false;
  }
  },
- handlePlaceholderTextArea() {
- if (this.isBtnYesActive)
- return this.$t(
- 'insights_header.generate_insight.input.placeholder_positive',
- );
-
- return this.$t(
- 'insights_header.generate_insight.input.placeholder_negative',
- );
+ handleFeedbackText(value) {
+ this.feedbackText = value;
  },
  handlePositiveFeedback() {
  if (this.isBtnNoActive) this.isBtnNoActive = false;
@@ -174,6 +179,8 @@ export default {
  handleDynamicParam(widget) {
  const { config, data } = widget;
 
+ if (isNaN(data?.value)) return '';
+
  if (config.data_type === 'sec') {
  return `${widget.name} ${formatSecondsToHumanString(Math.round(data?.value))}`;
  }

src/components/insights/Layout/HeaderGenerateInsights/InsightModalFooter.vue

@@ -49,7 +49,7 @@
  class="footer__feedback__container__area"
  >
  <textarea
- :value="feedbackText"
+ v-model="feedbackText"
  rows="7"
  class="footer__feedback__textarea"
  :placeholder="handlePlaceholderTextArea()"
@@ -97,10 +97,6 @@ export default {
  type: Boolean,
  required: true,
  },
- feedbackText: {
- type: String,
- required: true,
- },
  isSubmitFeedbackLoading: {
  type: Boolean,
  required: true,
@@ -110,8 +106,17 @@ export default {
  'handle-negative-feedback',
  'handle-positive-feedback',
  'submit-review',
+ 'update-feedback-text',
  ],
+ data() {
+ return {
+ feedbackText: '',
+ };
+ },
  watch: {
+ feedbackText(newValue) {
+ this.$emit('update-feedback-text', newValue);
+ },
  isFeedbackSent() {
  this.$nextTick(() => {
  this.scrollToEnd();

src/components/insights/Layout/HeaderGenerateInsights/__tests__/HeaderGenerateInsightModal.spec.js

@@ -155,31 +155,4 @@ describe('HeaderGenerateInsightModal.vue', () => {
  wrapper.unmount();
  expect(disconnectMock).toHaveBeenCalled();
  });
-
- it('returns positive placeholder when isBtnYesActive is true', () => {
- wrapper.vm.isBtnYesActive = true;
- expect(wrapper.vm.handlePlaceholderTextArea()).toBe(
- wrapper.vm.$t(
- 'insights_header.generate_insight.input.placeholder_positive',
- ),
- );
- });
-
- it('returns negative placeholder when isBtnYesActive is false', () => {
- wrapper.vm.isBtnYesActive = false;
- expect(wrapper.vm.handlePlaceholderTextArea()).toBe(
- wrapper.vm.$t(
- 'insights_header.generate_insight.input.placeholder_negative',
- ),
- );
- });
-
- it('returns negative placeholder when isBtnYesActive is undefined', () => {
- wrapper.vm.isBtnYesActive = undefined;
- expect(wrapper.vm.handlePlaceholderTextArea()).toBe(
- wrapper.vm.$t(
- 'insights_header.generate_insight.input.placeholder_negative',
- ),
- );
- });
 });