Added Capacitor and SpeechRecognition

This commit is contained in:
Srinath 2026-03-10 14:06:32 +05:30
parent 5b2367fe73
commit 7a1814f0ef
1 changed files with 108 additions and 16 deletions

View File

@ -1,6 +1,9 @@
import React, { useState, useEffect, useRef, forwardRef, useImperativeHandle } from "react"; import React, { useState, useEffect, useRef, forwardRef, useImperativeHandle } from "react";
import { FaMicrophone, FaMicrophoneSlash } from "react-icons/fa"; import { FaMicrophone, FaMicrophoneSlash } from "react-icons/fa";
import './VoiceToText.scss' import './VoiceToText.scss'
import { Capacitor } from "@capacitor/core";
import { SpeechRecognition } from "@capacitor-community/speech-recognition";
const VoiceToTextItemCard = forwardRef(({ setVoiceData, setprodQty, uomNames = [] }, ref) => { const VoiceToTextItemCard = forwardRef(({ setVoiceData, setprodQty, uomNames = [] }, ref) => {
const [formData, setFormData] = useState({ product: "", qty: "", uom: "" }); const [formData, setFormData] = useState({ product: "", qty: "", uom: "" });
const [transcript, setTranscript] = useState(""); const [transcript, setTranscript] = useState("");
@ -106,37 +109,126 @@ const VoiceToTextItemCard = forwardRef(({ setVoiceData, setprodQty, uomNames = [
// setTranscript(""); // setTranscript("");
// setVoiceData && setVoiceData(""); // setVoiceData && setVoiceData("");
// }; // };
const startListening = async () => { //sree coment line
try { // const startListening = async () => {
// Step 1: Check microphone access // try {
const stream = await navigator.mediaDevices.getUserMedia({ audio: true }); // // Step 1: Check microphone access
stream.getTracks().forEach(track => track.stop()); // stop test mic stream // const stream = await navigator.mediaDevices.getUserMedia({ audio: true });
// stream.getTracks().forEach(track => track.stop()); // stop test mic stream
// // Step 2: Try starting speech recognition
// try {
// recognitionRef.current?.start();
// setIsListening(true);
// setTranscript("");
// if (setVoiceData) setVoiceData("");
// } catch (err) {
// console.error("SpeechRecognition start error:", err);
// alert("Unable to start speech recognition. Please check mic access or try again.");
// setIsListening(false);
// }
// } catch (error) {
// console.error("Microphone access denied or not available", error);
// alert("Microphone not connected or permission denied.");
// setIsListening(false);
// }
// };
const startListening = async () => {
// Detect platform
const platform = Capacitor.getPlatform();
if (platform === "web") {
try {
// Check microphone permission
const stream = await navigator.mediaDevices.getUserMedia({ audio: true });
stream.getTracks().forEach(track => track.stop());
// Step 2: Try starting speech recognition
try {
recognitionRef.current?.start(); recognitionRef.current?.start();
setIsListening(true); setIsListening(true);
setTranscript(""); setTranscript("");
if (setVoiceData) setVoiceData(""); if (setVoiceData) setVoiceData("");
} catch (err) {
console.error("SpeechRecognition start error:", err); } catch (error) {
alert("Unable to start speech recognition. Please check mic access or try again.");
console.error("Microphone access denied or not available", error);
alert("Microphone not connected or permission denied.");
setIsListening(false); setIsListening(false);
} }
}
else {
// 📱 Capacitor Android / iOS
try {
} catch (error) { const permission = await SpeechRecognition.requestPermissions();
console.error("Microphone access denied or not available", error);
alert("Microphone not connected or permission denied."); if (!permission.speechRecognition) {
alert("Speech recognition permission denied");
return;
}
setIsListening(true);
const result = await SpeechRecognition.start({
language: "en-US",
maxResults: 1,
partialResults: false,
});
if (result.matches && result.matches.length > 0) {
const spokenText = result.matches[0];
setTranscript(spokenText);
const { product, qty, uom } = extractEntities(spokenText);
setFormData({ product, qty, uom });
if (setVoiceData) setVoiceData({ product, qty, uom });
if (setprodQty) setprodQty(qty);
}
setIsListening(false);
} catch (err) {
console.error(err);
setIsListening(false); setIsListening(false);
} }
}
}; };
const stopListening = () => {
// const stopListening = () => {
// if (recognitionRef.current) {
// console.log("Stopping voice recognition...");
// recognitionRef.current.stop();
// } else {
// console.warn("Recognition not initialized");
// }
// setIsListening(false);
// };
const stopListening = async () => {
const platform = Capacitor.getPlatform();
try {
if (platform === "web") {
if (recognitionRef.current) { if (recognitionRef.current) {
console.log("Stopping voice recognition...");
recognitionRef.current.stop(); recognitionRef.current.stop();
console.log("Stopping voice recognition...");
}
} else { } else {
console.warn("Recognition not initialized"); await SpeechRecognition.stop();
console.log("Stopping native speech recognition...");
}
} catch (error) {
console.error("Error stopping speech recognition:", error);
} }
setIsListening(false); setIsListening(false);