Transcription Dashboard - Copy this React, Tailwind Component to your project

Avg1 : Grammatical (progress circular bar chart) avg2 : Clarity (progress circular bar chart) avg3 : Phonetic (progress circular bar chart) avg4 : Pause (progress circular bar chart) flex box Main1 : Transcription text (right side this component) Main2 : Transcription camera preview (left side this component) 1. Grammatical Errors (KPI with title,value,visual clue, background:light colors) count = 3 (number of wrong words) here is list in which i have 2 key value pair of wrong sentence and correct sentence 2. Word Clarity (KPI with title,value,visual clue, background:light colors) score = 94% unclear words in list this is list of words consider 3 words here 3. Phonetic Accuracy (KPI with title,value,visual clue, background:light colors) Score: 95% Issues: collaborate, temp, hello list 4. Pause Patterns (pie chart) Average Pause Duration: 0.67s Longest Pause: 2.8s 5. Filler Word Usage (KPI with title,value,visual clue, background:light colors) count = 3 (number of filler words) words display 3 which is filler 6. Speaking Pace (KPI with title,value,visual clue, background:light colors) Words Per Minute: 109.8 Variability: variable/Consistent Generate feedback button (model feedback and then feedback will download) create in nice layout which further i can print it has 4 paragraphs and each has bullet points this is what i needed create beutiful ui use animations, background colors , responsive layout which fits when content is large or small use suitable provided info graphics dont use any line chart or bar chart use infographics which i told you