mariano/meetus
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

embedded meetus

Browse Source
This commit is contained in:
Mariano Gabriel
2026-07-05 21:35:09 -03:00
parent a92615d6bc
commit 8ff29fc776
8 changed files with 167 additions and 138 deletions
Download Patch File Download Diff File Expand all files Collapse all files

20
ui/meetus-app/src/components/TranscriptEditor.vue
View File

@@ -1,13 +1,17 @@
<script setup lang="ts">
import { ref, watch, nextTick, computed, onMounted } from 'vue'
import Panel from '@framework/components/Panel.vue'
import { useStore } from '@/store'
import { useStore } from '../store'
const props = withDefaults(defineProps<{ allowEdit?: boolean }>(), { allowEdit: true })
const { state, activeSegmentIndex, seek } = useStore()
// View preferences (persisted).
// View preferences (persisted). When edit is disallowed (e.g. embedded review),
// the transcript is read-only regardless of the saved preference.
type ViewMode = 'edit' | 'read'
const viewMode = ref<ViewMode>((localStorage.getItem('meetus.viewMode') as ViewMode) || 'edit')
const effectiveMode = computed<ViewMode>(() => (props.allowEdit ? viewMode.value : 'read'))
const compact = ref(localStorage.getItem('meetus.compact') === '1')
const showTimes = ref(localStorage.getItem('meetus.readTimes') !== '0')
watch(viewMode, (v) => localStorage.setItem('meetus.viewMode', v))
@@ -83,17 +87,17 @@ watch(activeSegmentIndex, async (i) => {
<template>
<Panel title="Transcript">
<template #actions>
<div class="seg-control">
<button :class="{ on: viewMode === 'edit' }" @click="viewMode = 'edit'">Edit</button>
<button :class="{ on: viewMode === 'read' }" @click="viewMode = 'read'">Read</button>
<div v-if="allowEdit" class="seg-control">
<button :class="{ on: effectiveMode === 'edit' }" @click="viewMode = 'edit'">Edit</button>
<button :class="{ on: effectiveMode === 'read' }" @click="viewMode = 'read'">Read</button>
</div>
<button v-if="viewMode === 'edit'" :class="{ on: compact }" @click="compact = !compact">Compact</button>
<button v-if="allowEdit && effectiveMode === 'edit'" :class="{ on: compact }" @click="compact = !compact">Compact</button>
<button v-else :class="{ on: showTimes }" @click="showTimes = !showTimes">Times</button>
<span class="count">{{ state.segments.length }} segments</span>
</template>
<!-- EDIT: per-segment blocks (comfortable or compact density) -->
<div v-if="viewMode === 'edit'" class="seg-list" :class="{ compact }">
<div v-if="effectiveMode === 'edit'" class="seg-list" :class="{ compact }">
<p v-if="!state.segments.length" class="empty">No transcript for this run.</p>
<div
v-for="(seg, i) in state.segments"
@@ -139,7 +143,7 @@ watch(activeSegmentIndex, async (i) => {
class="rseg"
:class="{ active: it.i === activeSegmentIndex }"
@click="seek(it.start)"
>{{ it.text }} </span>
>{{ it.text.trim() + ' ' }}</span>
</template>
</p>
</div>