diff --git a/docs/architecture/README.md b/docs/architecture/README.md index 0c5cf98..b1fcfcb 100644 --- a/docs/architecture/README.md +++ b/docs/architecture/README.md @@ -1,4 +1,5 @@ ## Perplexica's Architecture + Perplexica's architecture consists of the following key components: 1. **User Interface**: A web-based interface that allows users to interact with Perplexica for searching images, videos, and much more. @@ -7,4 +8,4 @@ Perplexica's architecture consists of the following key components: 4. **LLMs (Large Language Models)**: Utilized by agents and chains for tasks like understanding content, writing responses, and citing sources. Examples include Claude, GPTs, etc. 5. **Embedding Models**: To improve the accuracy of search results, embedding models re-rank the results using similarity search algorithms such as cosine similarity and dot product distance. -For a more detailed explanation of how these components work together, see [WORKING.md](https://github.com/ItzCrazyKns/Perplexica/tree/master/docs/architecture/WORKING.md). \ No newline at end of file +For a more detailed explanation of how these components work together, see [WORKING.md](https://github.com/ItzCrazyKns/Perplexica/tree/master/docs/architecture/WORKING.md). diff --git a/package.json b/package.json index efb336a..ee75225 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "perplexica-backend", - "version": "1.1.0", + "version": "1.2.0", "license": "MIT", "author": "ItzCrazyKns", "scripts": { @@ -29,6 +29,7 @@ "dotenv": "^16.4.5", "express": "^4.19.2", "langchain": "^0.1.30", + "react-text-to-speech": "^0.14.5", "winston": "^3.13.0", "ws": "^8.16.0", "zod": "^3.22.4" diff --git a/ui/components/MessageBox.tsx b/ui/components/MessageBox.tsx index 3ccda13..9ee7245 100644 --- a/ui/components/MessageBox.tsx +++ b/ui/components/MessageBox.tsx @@ -1,22 +1,17 @@ +'use client'; + /* eslint-disable @next/next/no-img-element */ import React, { MutableRefObject, useEffect, useState } from 'react'; import { Message } from './ChatWindow'; import { cn } from '@/lib/utils'; -import { - BookCopy, - Disc3, - FilePen, - PlusIcon, - Share, - ThumbsDown, - VideoIcon, -} from 'lucide-react'; +import { BookCopy, Disc3, Share, Volume2, StopCircle } from 'lucide-react'; import Markdown from 'markdown-to-jsx'; import Copy from './MessageActions/Copy'; import Rewrite from './MessageActions/Rewrite'; import MessageSources from './MessageSources'; import SearchImages from './SearchImages'; import SearchVideos from './SearchVideos'; +import { useSpeech } from 'react-text-to-speech'; const MessageBox = ({ message, @@ -36,6 +31,7 @@ const MessageBox = ({ rewrite: (messageId: string) => void; }) => { const [parsedMessage, setParsedMessage] = useState(message.content); + const [speechMessage, setSpeechMessage] = useState(message.content); useEffect(() => { if ( @@ -45,6 +41,8 @@ const MessageBox = ({ ) { const regex = /\[(\d+)\]/g; + setSpeechMessage(message.content.replace(regex, '')); + return setParsedMessage( message.content.replace( regex, @@ -56,6 +54,8 @@ const MessageBox = ({ setParsedMessage(message.content); }, [message.content, message.sources, message.role]); + const { speechStatus, start, stop } = useSpeech({ text: speechMessage }); + return (