Add Ask Mento, customer mood, and Pipecat speech-to-text.

Ship assistant answers, contact moods, voice dictation, and the related CRM UI so these can be deployed to production.

Co-authored-by: Cursor <cursoragent@cursor.com>

apps/web/src/components/AskMentoPanel.vue

@@ -0,0 +1,161 @@
+<script setup lang="ts">
+import { ref } from 'vue';
+import { RouterLink } from 'vue-router';
+import axios from 'axios';
+import { api } from '@/lib/api';
+import UiIcon from '@/components/UiIcon.vue';
+import type { AskMentoResponse, AskMentoSourceDto } from '@mento/shared';
+
+const props = defineProps<{
+  personId?: string;
+  placeholder?: string;
+}>();
+
+const question = ref('');
+const asking = ref(false);
+const error = ref('');
+const result = ref<AskMentoResponse | null>(null);
+
+function sourceTo(source: AskMentoSourceDto) {
+  if (source.type === 'person') return { name: 'person-detail', params: { id: source.id } };
+  if (source.type === 'activity') return { name: 'activity-detail', params: { id: source.id } };
+  if (source.type === 'deal') return { name: 'deal-detail', params: { id: source.id } };
+  return { name: 'notes' };
+}
+
+async function submit() {
+  const q = question.value.trim();
+  if (!q || asking.value) return;
+  asking.value = true;
+  error.value = '';
+  result.value = null;
+  try {
+    const { data } = await api.post<AskMentoResponse>('/ai/ask', {
+      question: q,
+      personId: props.personId || undefined,
+    });
+    result.value = data;
+  } catch (e) {
+    if (axios.isAxiosError(e)) {
+      const msg = (e.response?.data as { message?: string | string[] })?.message;
+      error.value = Array.isArray(msg) ? msg.join('، ') : (msg ?? 'پرسش ناموفق بود');
+    } else {
+      error.value = 'پرسش ناموفق بود';
+    }
+  } finally {
+    asking.value = false;
+  }
+}
+</script>
+
+<template>
+  <section class="ask">
+    <form @submit.prevent="submit">
+      <UiIcon name="sparkle" :size="16" class="ico" />
+      <input
+        v-model="question"
+        type="search"
+        :placeholder="placeholder || 'از منتو بپرس...'"
+      />
+      <button type="submit" :disabled="asking || question.trim().length < 2">
+        {{ asking ? '…' : 'بپرس' }}
+      </button>
+    </form>
+    <p v-if="error" class="error">{{ error }}</p>
+    <div v-else-if="result" class="answer">
+      <p>{{ result.answer }}</p>
+      <div v-if="result.sources.length" class="sources">
+        <RouterLink
+          v-for="source in result.sources"
+          :key="`${source.type}-${source.id}`"
+          :to="sourceTo(source)"
+        >
+          {{ source.label }}
+        </RouterLink>
+      </div>
+    </div>
+  </section>
+</template>
+
+<style scoped>
+.ask {
+  display: grid;
+  gap: 0.55rem;
+  min-width: 0;
+}
+
+form {
+  display: flex;
+  align-items: center;
+  gap: 0.45rem;
+  background: #fff;
+  border: 1px solid #e2e8f0;
+  border-radius: 14px;
+  padding: 0.35rem 0.4rem 0.35rem 0.7rem;
+}
+
+.ico {
+  color: #0f766e;
+  flex-shrink: 0;
+}
+
+input {
+  flex: 1;
+  min-width: 0;
+  border: 0;
+  background: transparent;
+  font: inherit;
+  padding: 0.45rem 0;
+}
+
+button {
+  border: 0;
+  border-radius: 10px;
+  background: #14b8a6;
+  color: #fff;
+  font: inherit;
+  font-weight: 700;
+  padding: 0.45rem 0.8rem;
+  cursor: pointer;
+}
+
+button:disabled {
+  opacity: 0.55;
+  cursor: wait;
+}
+
+.answer {
+  background: #f0fdfa;
+  border-radius: 12px;
+  padding: 0.7rem 0.85rem;
+}
+
+.answer p {
+  margin: 0;
+  color: #134e4a;
+  font-size: 0.88rem;
+  line-height: 1.7;
+}
+
+.sources {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 0.35rem;
+  margin-top: 0.55rem;
+}
+
+.sources a {
+  font-size: 0.74rem;
+  font-weight: 700;
+  color: #0f766e;
+  background: #fff;
+  border-radius: 999px;
+  padding: 0.18rem 0.55rem;
+}
+
+.error {
+  margin: 0;
+  color: #b91c1c;
+  font-size: 0.84rem;
+}
+</style>