Skip to content

Commit b6edd18

Browse files
0xrohitgarg0xrohitgarg
authored
Merge pull request #95 from omgate234/main
feat: meeting recorder style updates, highlights and logs clean up
2 parents 77b83c4 + 5ccddb7 commit b6edd18

File tree

3 files changed

+89
-38
lines changed

3 files changed

+89
-38
lines changed

‎src/components/canvas-handlers/meeting-recorder/MeetingAnalysisModal.vue‎

Lines changed: 84 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
<div
33
v-if="isOpen"
44
ref="modalRef"
5-
class="max-h-[8] vdb-c-select-none vdb-c-border vdb-c-border-[#E5E7EB] vdb-c-bg-[#FFFFFF]"
5+
class="vdb-c-max-h-[80%] vdb-c-select-none vdb-c-border vdb-c-border-[#E5E7EB] vdb-c-bg-[#FFFFFF]"
66
:class="
77
isFloating
88
? 'vdb-c-absolute vdb-c-z-10 vdb-c-overflow-hidden vdb-c-rounded-12 vdb-c-shadow-[0_8px_24px_rgba(0,0,0,0.08)]'
@@ -15,7 +15,7 @@
1515
>
1616
<!-- Shell -->
1717
<div
18-
class="vdb-c-flex vdb-c-max-h-[80vh] vdb-c-flex-col vdb-c-items-start vdb-c-overflow-hidden vdb-c-pb-24 vdb-c-transition-all vdb-c-duration-300"
18+
class="scrollbar-hide vdb-c-flex vdb-c-h-full vdb-c-flex-col vdb-c-items-start vdb-c-overflow-hidden vdb-c-pb-24 vdb-c-transition-all vdb-c-duration-300"
1919
:class="isFloating ? 'vdb-c-rounded-12' : 'vdb-c-rounded-0'"
2020
>
2121
<!-- Header -->
@@ -60,7 +60,7 @@
6060

6161
<!-- Main (scroll area) -->
6262
<div
63-
class="scrollbar-hide vdb-c-flex vdb-c-w-full vdb-c-flex-1 vdb-c-flex-col vdb-c-items-start vdb-c-gap-30 vdb-c-overflow-y-auto vdb-c-px-20 vdb-c-py-16"
63+
class="scrollbar-hide vdb-c-flex vdb-c-min-h-0 vdb-c-w-full vdb-c-flex-1 vdb-c-flex-col vdb-c-items-start vdb-c-gap-30 vdb-c-overflow-y-auto vdb-c-px-20 vdb-c-py-16"
6464
>
6565
<!-- Live Insights -->
6666
<section
@@ -91,6 +91,47 @@
9191
</div>
9292
</div>
9393

94+
<!-- Highlights Card -->
95+
<div
96+
class="vdb-c-flex vdb-c-w-full vdb-c-flex-col vdb-c-items-center vdb-c-justify-center vdb-c-gap-16 vdb-c-rounded-[10px] vdb-c-border vdb-c-border-yellow-200 vdb-c-bg-yellow-50 vdb-c-p-12"
97+
>
98+
<div
99+
class="vdb-c-flex vdb-c-w-full vdb-c-flex-col vdb-c-items-start vdb-c-gap-12"
100+
>
101+
<div
102+
class="vdb-c-inline-flex vdb-c-items-center vdb-c-gap-12 vdb-c-rounded-[48px] vdb-c-bg-white vdb-c-px-12 vdb-c-py-8 vdb-c-text-[13px] vdb-c-font-[600] vdb-c-text-black"
103+
>
104+
Highlights
105+
</div>
106+
<div
107+
v-if="highlights.length === 0"
108+
class="vdb-c-text-[13px] vdb-c-text-[#6B7280]"
109+
>
110+
No highlights available
111+
</div>
112+
<ul
113+
v-else
114+
class="scrollbar-hide vdb-c-max-h-[200px] vdb-c-w-full vdb-c-list-disc vdb-c-overflow-auto vdb-c-pl-20"
115+
>
116+
<li
117+
v-for="(item, idx) in visibleHighlights"
118+
:key="'hl-' + idx + '-' + item.text"
119+
class="vdb-c-text-[14px] vdb-c-leading-[24px] vdb-c-text-black"
120+
>
121+
{{ normalize(item.text) }}
122+
</li>
123+
</ul>
124+
</div>
125+
126+
<button
127+
v-if="highlights.length > 2"
128+
class="vdb-c-inline-flex vdb-c-items-center vdb-c-gap-1 vdb-c-rounded-[999px] vdb-c-border vdb-c-border-[#EFEFEF] vdb-c-bg-white vdb-c-p-8 vdb-c-text-[13px] vdb-c-font-[500] vdb-c-leading-[16px] vdb-c-tracking-[0.065px] vdb-c-text-black vdb-c-transition hover:vdb-c-bg-[#F9FAFB]"
129+
@click="toggleSeeAll('highlights')"
130+
>
131+
{{ showAllHighlights ? "See less" : "See all" }}
132+
</button>
133+
</div>
134+
94135
<!-- High Priority Card -->
95136
<div
96137
class="vdb-c-flex vdb-c-w-full vdb-c-flex-col vdb-c-items-center vdb-c-justify-center vdb-c-gap-16 vdb-c-rounded-[10px] vdb-c-border vdb-c-border-[#FFE9D3] vdb-c-bg-[#FFF5EC] vdb-c-p-12"
@@ -103,7 +144,14 @@
103144
>
104145
High Priority
105146
</div>
147+
<div
148+
v-if="highPriority.length === 0"
149+
class="vdb-c-text-[13px] vdb-c-text-[#6B7280]"
150+
>
151+
No high priority insights available
152+
</div>
106153
<ul
154+
v-else
107155
class="scrollbar-hide vdb-c-max-h-[200px] vdb-c-w-full vdb-c-list-disc vdb-c-overflow-auto vdb-c-pl-20"
108156
>
109157
<li
@@ -138,7 +186,14 @@
138186
Opportunity
139187
</div>
140188

189+
<div
190+
v-if="opportunities.length === 0"
191+
class="vdb-c-text-[13px] vdb-c-text-[#6B7280]"
192+
>
193+
No opportunities available
194+
</div>
141195
<ul
196+
v-else
142197
class="scrollbar-hide vdb-c-max-h-[200px] vdb-c-w-full vdb-c-list-disc vdb-c-overflow-auto vdb-c-pl-20"
143198
>
144199
<li
@@ -183,7 +238,14 @@
183238
Suggested Questions/Actions
184239
</div>
185240

241+
<div
242+
v-if="questions.length === 0"
243+
class="vdb-c-text-[13px] vdb-c-text-[#6B7280]"
244+
>
245+
No suggested questions or actions
246+
</div>
186247
<TransitionGroup
248+
v-else
187249
name="list-fade"
188250
tag="ul"
189251
class="scrollbar-hide vdb-c-max-h-[200px] vdb-c-w-full vdb-c-list-disc vdb-c-overflow-auto vdb-c-pl-20"
@@ -221,6 +283,13 @@
221283
</div>
222284

223285
<div
286+
v-if="localChecklist.length === 0"
287+
class="vdb-c-text-[13px] vdb-c-text-[#6B7280]"
288+
>
289+
No checklist items
290+
</div>
291+
<div
292+
v-else
224293
class="vdb-c-flex vdb-c-w-full vdb-c-flex-col vdb-c-items-start vdb-c-gap-12"
225294
>
226295
<TransitionGroup
@@ -345,9 +414,15 @@ const opportunities = computed(() =>
345414
(x) => (x.type || "").toLowerCase() === "opportunity",
346415
),
347416
);
417+
const highlights = computed(() =>
418+
liveInsights.value.filter(
419+
(x) => (x.type || "").toLowerCase() === "highlights",
420+
),
421+
);
348422
349423
const showAllHigh = ref(false);
350424
const showAllOpp = ref(false);
425+
const showAllHighlights = ref(false);
351426
const latestTwo = (arr) => (arr.length <= 2 ? arr : arr.slice(-2));
352427
353428
const visibleHighPriority = computed(() =>
@@ -356,6 +431,9 @@ const visibleHighPriority = computed(() =>
356431
const visibleOpportunities = computed(() =>
357432
showAllOpp.value ? opportunities.value : latestTwo(opportunities.value),
358433
);
434+
const visibleHighlights = computed(() =>
435+
showAllHighlights.value ? highlights.value : latestTwo(highlights.value),
436+
);
359437
360438
/**
361439
* Snap the floating modal to the parent container's top-right corner
@@ -399,6 +477,8 @@ watch(
399477
function toggleSeeAll(which) {
400478
if (which === "high") showAllHigh.value = !showAllHigh.value;
401479
if (which === "opp") showAllOpp.value = !showAllOpp.value;
480+
if (which === "highlights")
481+
showAllHighlights.value = !showAllHighlights.value;
402482
}
403483
404484
function toggleChecklist(idx) {
@@ -449,6 +529,7 @@ watch(
449529
if (open) {
450530
showAllHigh.value = false;
451531
showAllOpp.value = false;
532+
showAllHighlights.value = false;
452533
// Ensure correct initial anchor when opening in floating mode
453534
if (props.isFloating) snapToTopRight();
454535
}

‎src/components/canvas-handlers/meeting-recorder/MeetingRecorderCanvas.vue‎

Lines changed: 1 addition & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -41,7 +41,7 @@
4141

4242
<script setup>
4343
import { useVideoDBChat } from "../../../context";
44-
import { ref, watch, computed } from "vue";
44+
import { ref, computed } from "vue";
4545
import Button from "./Button.vue";
4646
import Robot from "./Robot.vue";
4747
import Live from "./Live.vue";
@@ -62,29 +62,6 @@ const props = defineProps({
6262
// Use content from canvas state instead of props
6363
const content = computed(() => canvasState.content || {});
6464
65-
// Watch for content changes to update canvas state
66-
watch(
67-
() => content.value,
68-
(newContent) => {
69-
console.log("MeetingRecorderCanvas content updated:", newContent);
70-
71-
// If content has live_analysis, we might want to show live analysis button
72-
if (newContent?.live_analysis && newContent.live_analysis.length > 0) {
73-
// Live analysis is available
74-
console.log("Live analysis data available:", newContent.live_analysis);
75-
}
76-
77-
// If content has meeting_assistant data, we can show meeting analysis
78-
if (newContent?.meeting_assistant) {
79-
console.log(
80-
"Meeting assistant data available:",
81-
newContent.meeting_assistant,
82-
);
83-
}
84-
},
85-
{ deep: true, immediate: true },
86-
);
87-
8865
function openMeetingAnalysis() {
8966
isMeetingAnalysisOpen.value = true;
9067
isFloating.value = true; // start in floating mode

‎src/components/message-handlers/MeetingRecorder.vue‎

Lines changed: 4 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -235,6 +235,7 @@ const mainGoals = [
235235
"Strategic Planning",
236236
"Daily Standup",
237237
"Client meeting",
238+
"Demo Showcase",
238239
"Other",
239240
];
240241
const selectedMainGoals = ref(new Set()); // empty
@@ -263,11 +264,7 @@ function toggleTopic(t) {
263264
}
264265
265266
const canSave = computed(
266-
() =>
267-
objective.value.trim().length > 0 &&
268-
selectedTopics.value.size > 0 &&
269-
(selectedMainGoals.value.size > 0 ||
270-
discussionTopicText.value.trim().length > 0),
267+
() => objective.value.trim().length > 0 && selectedMainGoals.value.size > 0,
271268
);
272269
273270
/* chat ctx */
@@ -285,11 +282,7 @@ onMounted(() => {
285282
watch(
286283
() => props.content,
287284
(c) => {
288-
console.log(">>> CanvasState", canvasState);
289-
290-
console.log(">>> CanvasState-Status", canvasState.show, canvasState.type);
291285
if (canvasState.show && canvasState.type === "meeting_recorder") {
292-
console.log("canvasState.content", c);
293286
canvasState.content = c;
294287
}
295288
},
@@ -299,7 +292,6 @@ watch(
299292
watch(
300293
() => message.value?.metadata,
301294
(m) => {
302-
console.log(">>> Message Metadata", message.value);
303295
const ctx = m?.meeting_context;
304296
if (!ctx) return;
305297
if (Array.isArray(ctx.main_goals))
@@ -328,7 +320,8 @@ async function handleSave() {
328320
},
329321
};
330322
331-
appendMessageMetadata && appendMessageMetadata(props.msgId, metadata);
323+
const targetMsgId = props.content?.msg_id || props.msgId;
324+
appendMessageMetadata && appendMessageMetadata(targetMsgId, metadata);
332325
openCanvas && openCanvas("meeting_recorder", props.content);
333326
334327
// 2) Auto-close the drawer

0 commit comments

Comments
 (0)