Shared segment validator (#661)

* Shared segment validator

* add new audio annotator role

Author: naveed-ahmad

app/controllers/application_controller.rb

@@ -55,6 +55,8 @@ def can_manage?(resource)
     if resource
       @access = if current_user.is_super_admin?
                   AdminProjectAccess.new
+                elsif current_user.is_audio_annotator? && resource.recitation?
+                  AdminProjectAccess.new
                 else
                   access = current_user.user_projects.find_by(resource_content_id: resource.id)
                   access if access&.approved?

app/controllers/surah_audio_files_controller.rb

@@ -2,6 +2,7 @@ class SurahAudioFilesController < CommunityController
   before_action :authenticate_user!, only: [:save_segments]
   before_action :authorize_access!, only: [:save_segments]
   before_action :init_presenter
+
   def builder_help
     render layout: false
   end
@@ -41,6 +42,20 @@ def segments
                    .order('verses.id ASC')
   end
 
+  def validate_segments
+    @audio_file = load_audio_file
+    return render(json: { issues: [] }) if @audio_file.nil?
+
+    issues =
+      if params[:segments].present?
+        validate_posted_segments(@audio_file, params[:segments])
+      else
+        @recitation.validate_segments_data(audio_file: @audio_file)
+      end
+
+    render json: { issues: issues.map { |issue| serialize_issue(issue) } }
+  end
+
   def save_segments
     audio_file = load_audio_file
     key = params[:verse_key].to_s.strip
@@ -79,6 +94,53 @@ def save_segments
   end
 
   protected
+
+  def validate_posted_segments(audio_file, posted)
+    chapter = audio_file.chapter
+    verses_by_number = Verse.where(chapter_id: chapter.id).index_by(&:verse_number)
+
+    segments = posted.to_unsafe_h.map do |verse_key, data|
+      verse_number = verse_key.to_s.split(':').last.to_i
+      verse = verses_by_number[verse_number]
+
+      Audio::SegmentValidator::SegmentData.new(
+        verse_key: verse_key.to_s,
+        chapter_id: chapter.id,
+        verse_number: verse_number,
+        timestamp_from: cast_ms(data['timestamp_from']),
+        timestamp_to: cast_ms(data['timestamp_to']),
+        words_count: verse&.words_count.to_i,
+        word_segments: cast_word_segments(data['segments']),
+        audio_file_id: audio_file.id,
+        audio_duration_ms: audio_file.duration_ms
+      )
+    end
+
+    Audio::SegmentValidator.new(segments, expected_verses_count: chapter.verses_count).validate
+  end
+
+  def serialize_issue(issue)
+    verse_number = issue[:key] ? issue[:key].to_s.split(':').last.to_i : nil
+    issue.merge(verse: verse_number)
+  end
+
+  def cast_ms(value)
+    return nil if value.nil? || value == ''
+
+    Integer(value)
+  rescue ArgumentError, TypeError
+    value.to_i
+  end
+
+  def cast_word_segments(segments)
+    return [] if segments.blank?
+
+    Array(segments).map do |word_segment|
+      word_segment = word_segment.values if word_segment.respond_to?(:values)
+      [word_segment[0], cast_ms(word_segment[1]), cast_ms(word_segment[2])]
+    end
+  end
+
   def sort_key
     sort_by = params[:sort_key].presence || 'chapter_id'
 

app/javascript/segments/components/Verse.vue

@@ -55,7 +55,13 @@
           </div>
 
           <div class="max-h-[60vh] overflow-y-auto divide-y divide-gray-100">
-            <p v-if="!activeIssues.length" class="px-4 py-8 text-sm text-gray-500 text-center">
+            <p v-if="issuesLoading" class="px-4 py-8 text-sm text-gray-500 text-center">
+              Checking segments…
+            </p>
+            <p v-else-if="issuesError" class="px-4 py-8 text-sm text-red-600 text-center">
+              Could not validate segments. Please try again.
+            </p>
+            <p v-else-if="!activeIssues.length" class="px-4 py-8 text-sm text-gray-500 text-center">
               No issues found 🎉
             </p>
             <button
@@ -533,6 +539,8 @@ export default {
     return {
       timeStep: 50,
       showIssues: false,
+      issuesLoading: false,
+      issuesError: false,
       issueGroups: [],
       activeIssueTab: 'current',
       showCompare: false,
@@ -853,23 +861,108 @@ export default {
     redo() {
       this.$store.commit('REDO_SEGMENTS');
     },
-    openIssues() {
-      const groups = [
-        { id: 'current', name: 'Current', color: '#198754', issues: this.findSegmentIssues((verse) => this.mainVerseData(verse)) },
-      ];
+    async openIssues() {
+      this.activeIssueTab = 'current';
+      this.showIssues = true;
 
-      for (const source of this.compareSources) {
-        groups.push({
-          id: source.id,
-          name: source.name,
-          color: source.color,
-          issues: this.findSegmentIssues((verse) => this.sourceVerseData(source, verse)),
-        });
+      // The gapped (ayah-by-ayah) tool keeps client-side validation across every
+      // compare source. The gapless (surah) tool is unified: its authoritative
+      // issues come from the server so it runs the exact same rules as the admin
+      // model view and the export job.
+      if (this.audioType === 'ayah') {
+        const groups = [
+          { id: 'current', name: 'Current', color: '#198754', issues: this.findSegmentIssues((verse) => this.mainVerseData(verse)) },
+        ];
+
+        for (const source of this.compareSources) {
+          groups.push({
+            id: source.id,
+            name: source.name,
+            color: source.color,
+            issues: this.findSegmentIssues((verse) => this.sourceVerseData(source, verse)),
+          });
+        }
+
+        this.issueGroups = groups;
+        return;
       }
 
-      this.issueGroups = groups;
-      this.activeIssueTab = 'current';
-      this.showIssues = true;
+      this.issuesError = false;
+      this.issuesLoading = true;
+      this.issueGroups = [{ id: 'current', name: 'Current', color: '#198754', issues: [] }];
+
+      let issues = [];
+      try {
+        // Validate the live in-browser state, so issues the reviewer already
+        // fixed (but has not saved) are not reported. Nothing is persisted.
+        issues = await this.fetchServerIssues();
+      } catch (error) {
+        this.issuesError = true;
+      }
+
+      // The one check the server cannot do: the audio can continue past the last
+      // ayah using the real decoded duration (the server only knows the stored
+      // file.duration_ms).
+      const durationIssue = this.fileDurationIssue();
+      if (durationIssue) issues.push(durationIssue);
+
+      issues.sort((a, b) => (a.severity === 'major' ? 0 : 1) - (b.severity === 'major' ? 0 : 1));
+
+      this.issueGroups = [{ id: 'current', name: 'Current', color: '#198754', issues }];
+      this.issuesLoading = false;
+    },
+    async fetchServerIssues() {
+      const recitation = this.$store.state.recitation;
+      const segmentsUrl = this.$store.state.segmentsUrl;
+
+      const csrfTokenElement = document.querySelector('meta[name="csrf-token"]');
+      const headers = { 'Content-Type': 'application/json' };
+      if (csrfTokenElement) headers['X-CSRF-Token'] = csrfTokenElement.content;
+
+      const response = await fetch(`/${segmentsUrl}/${recitation}/validate_segments.json`, {
+        method: 'post',
+        headers,
+        body: JSON.stringify({ chapter_id: this.chapter, segments: this.segments }),
+      });
+
+      if (!response.ok) throw new Error(`Validation request failed (${response.status})`);
+
+      const json = await response.json();
+
+      return (json.issues || []).map((issue, index) => ({
+        verse: issue.verse || (issue.key ? Number(String(issue.key).split(':').pop()) : null),
+        key: `server-${index}`,
+        severity: issue.severity === 'bg-danger' ? 'major' : 'minor',
+        message: issue.text,
+      }));
+    },
+    fileDurationIssue() {
+      const TRAILING_GAP_THRESHOLD_MS = 1000;
+      const audioDuration = this.playerDurationMs();
+      if (!audioDuration) return null;
+
+      const present = (value) => value !== undefined && value !== null && value !== '';
+
+      let lastVerse = null;
+      let lastEnd = null;
+      for (let verse = 1; verse <= this.versesCount; verse++) {
+        const data = this.segments[`${this.chapter}:${verse}`];
+        if (data && present(data.timestamp_to)) {
+          lastVerse = verse;
+          lastEnd = Number(data.timestamp_to);
+        }
+      }
+      if (lastEnd === null) return null;
+
+      const gap = audioDuration - lastEnd;
+      if (gap <= TRAILING_GAP_THRESHOLD_MS) return null;
+
+      return {
+        verse: lastVerse,
+        key: 'client-file-duration',
+        severity: 'major',
+        message: `Audio continues ${Math.round(gap / 1000)}s past the last ayah ends (unsegmented tail)`,
+      };
     },
     goToIssue(verse) {
       this.$store.commit('CHANGE_AYAH', { to: verse });