Feature: reading answers

chatgpt.service.mjs

@@ -1,5 +1,6 @@
 import { ChatGPTAPIBrowser, ChatGPTConversation } from 'chatgpt'
 import { app, dialog } from 'electron'
+import * as googleTTS from 'google-tts-api'
 
 var conversation = null;
 export async function chatgpt_init() {
@@ -23,4 +24,13 @@ export async function chatgpt(message) {
     )
 
     return response
+}
+
+export function getSpeechUrl(text) {
+    return googleTTS.getAllAudioUrls(text, {
+        lang: 'en',
+        slow: false,
+        host: 'https://translate.google.com',
+        splitPunct: ',.?',
+    })
 }

index.js

@@ -0,0 +1,44 @@
+import { createStore } from "vuex"
+import { getAnswer, getSpeechUrl } from '@/services/chatService.ts'
+
+const store = createStore({
+    state: {
+        messages: [],
+        lastId: 1
+    },
+    mutations: {
+        addMessage(state, { message }) {
+            state.messages.push(message)
+        },
+        advanceId(state) {
+            state.lastId++
+        },
+    },
+    getters: {
+        messages({ messages }) {
+            if (!messages) return
+            return messages
+        },
+        lastId({ lastId }) {
+            return lastId
+        },
+    },
+    actions: {
+        async loadAnswer({ commit, getters }, param) {
+            var message = {id: getters.lastId, type: 'question', txt:param.question};
+            commit({ type: 'addMessage', message })
+            commit({ type: 'advanceId', message })
+
+            const answer = await getAnswer(param.question);
+            message = {id: getters.lastId, type: 'answer', txt:answer}
+            commit({ type: 'addMessage', message })
+            commit({ type: 'advanceId', message })
+            return message
+        },
+        async getSpeechUrl({commit}, param) {
+            return await getSpeechUrl(param.text)
+        }
+    },
+})
+
+export default store

main.js → main.ts

@@ -11,8 +11,7 @@ const createWindow = () => {
     width: 1024,
     height: 920,
     webPreferences: {
-      enableRemoteModule: true,
-      preload: path.join(__dirname, 'preload.js')
+      preload: path.join(__dirname, 'preload.ts')
     }
   })
 

package.json

@@ -1,62 +1,63 @@
-{
-  "name": "chaty",
-  "version": "1.0.0",
-  "private": true,
-  "description": "Chaty is an Electron bot that you can use to interact with ChatGPT",
-  "author": "Shiran Abir",
-  "repository": "ShiranAbir/chaty",
-  "main": "main.js",
-  "scripts": {
-    "dev": "vite",
-    "build": "run-p type-check build-only",
-    "preview": "vite preview",
-    "build-only": "vite build",
-    "type-check": "vue-tsc --noEmit",
-    "lint": "eslint . --ext .vue,.js,.jsx,.cjs,.mjs,.ts,.tsx,.cts,.mts --fix --ignore-path .gitignore",
-    "start": "run-p build && electron-forge start",
-    "package": "run-p build && electron-forge package",
-    "make": "electron-forge make"
-  },
-  "dependencies": {
-    "app-env": "^1.0.1",
-    "axios": "^1.2.1",
-    "bootstrap": "^5.2.3",
-    "bootstrap-vue-3": "^0.4.15",
-    "chatgpt": "^2.5.2",
-    "clone-deep": "^4.0.1",
-    "compression": "^1.7.4",
-    "cors": "^2.8.5",
-    "electron-squirrel-startup": "^1.0.0",
-    "express": "^4.18.2",
-    "pump": "^3.0.0",
-    "puppeteer": "^19.4.0",
-    "puppeteer-extra-plugin-stealth": "^2.11.1",
-    "sass": "^1.56.2",
-    "scss": "^0.2.4",
-    "vue": "^3.2.45",
-    "vue-router": "^4.1.6",
-    "vuex": "^4.1.0"
-  },
-  "devDependencies": {
-    "@electron-forge/cli": "^6.0.4",
-    "@electron-forge/maker-deb": "^6.0.4",
-    "@electron-forge/maker-dmg": "^6.0.4",
-    "@electron-forge/maker-rpm": "^6.0.4",
-    "@electron-forge/maker-squirrel": "^6.0.4",
-    "@electron-forge/maker-zip": "^6.0.4",
-    "@electron/rebuild": "^3.2.10",
-    "@rushstack/eslint-patch": "^1.1.4",
-    "@types/node": "^18.11.9",
-    "@types/puppeteer": "^7.0.4",
-    "@vitejs/plugin-vue": "^4.0.0",
-    "@vue/eslint-config-typescript": "^11.0.0",
-    "@vue/tsconfig": "^0.1.3",
-    "electron": "^23.0.0-alpha.3",
-    "eslint": "^8.22.0",
-    "eslint-plugin-vue": "^9.3.0",
-    "npm-run-all": "^4.1.5",
-    "typescript": "~4.7.4",
-    "vite": "^4.0.0",
-    "vue-tsc": "^1.0.9"
-  }
-}
+{
+  "name": "chaty",
+  "version": "1.1.0",
+  "private": true,
+  "description": "Chaty is an Electron bot that you can use to interact with ChatGPT",
+  "author": "Shiran Abir",
+  "repository": "ShiranAbir/chaty",
+  "main": "main.ts",
+  "scripts": {
+    "dev": "vite",
+    "build": "run-p type-check build-only",
+    "preview": "vite preview",
+    "build-only": "vite build",
+    "type-check": "vue-tsc --noEmit",
+    "lint": "eslint . --ext .vue,.js,.jsx,.cjs,.mjs,.ts,.tsx,.cts,.mts --fix --ignore-path .gitignore",
+    "start": "run-p build && electron-forge start",
+    "package": "run-p build && electron-forge package",
+    "make": "electron-forge make"
+  },
+  "dependencies": {
+    "app-env": "^1.0.1",
+    "axios": "^1.2.1",
+    "bootstrap": "^5.2.3",
+    "bootstrap-vue-3": "^0.4.15",
+    "chatgpt": "^2.5.2",
+    "clone-deep": "^4.0.1",
+    "compression": "^1.7.4",
+    "cors": "^2.8.5",
+    "electron-squirrel-startup": "^1.0.0",
+    "express": "^4.18.2",
+    "google-tts-api": "^2.0.2",
+    "pump": "^3.0.0",
+    "puppeteer": "^19.4.0",
+    "puppeteer-extra-plugin-stealth": "^2.11.1",
+    "sass": "^1.56.2",
+    "scss": "^0.2.4",
+    "vue": "^3.2.45",
+    "vue-router": "^4.1.6",
+    "vuex": "^4.1.0"
+  },
+  "devDependencies": {
+    "@electron-forge/cli": "^6.0.4",
+    "@electron-forge/maker-deb": "^6.0.4",
+    "@electron-forge/maker-dmg": "^6.0.4",
+    "@electron-forge/maker-rpm": "^6.0.4",
+    "@electron-forge/maker-squirrel": "^6.0.4",
+    "@electron-forge/maker-zip": "^6.0.4",
+    "@electron/rebuild": "^3.2.10",
+    "@rushstack/eslint-patch": "^1.1.4",
+    "@types/node": "^18.11.16",
+    "@types/puppeteer": "^7.0.4",
+    "@vitejs/plugin-vue": "^4.0.0",
+    "@vue/eslint-config-typescript": "^11.0.0",
+    "@vue/tsconfig": "^0.1.3",
+    "electron": "^23.0.0-alpha.3",
+    "eslint": "^8.22.0",
+    "eslint-plugin-vue": "^9.3.0",
+    "npm-run-all": "^4.1.5",
+    "typescript": "~4.7.4",
+    "vite": "^4.0.0",
+    "vue-tsc": "^1.0.9"
+  }
+}

server.js

@@ -1,14 +1,15 @@
 const compression = require('compression');
 const express = require('express');
-const cors = require('cors');
 const app = express();
 const port = 3000;
 
 var chatgptFunc = null;
+var speechFunc = null;
 // need to import es module dynamically
 import('./chatgpt.service.mjs').then(chatgpt =>
   {
     chatgptFunc = chatgpt.chatgpt
+    speechFunc = chatgpt.getSpeechUrl
     chatgpt.chatgpt_init()
   }
 );
@@ -17,14 +18,6 @@ app.use(compression())
 app.use(express.json());
 app.use(express.urlencoded({ extended: true }));
 
-// Configuring CORS
-const corsOptions = {
-	// Make sure origin contains the url your frontend is running on
-	origin: ['http://localhost:5173'],
-	credentials: true
-}
-app.use(cors(corsOptions))
-
 app.post("/", async function (req, res) {
   if (!chatgptFunc){
     res.send("Backend isn't ready yet!")
@@ -35,6 +28,11 @@ app.post("/", async function (req, res) {
   res.send(await chatgptFunc(question));
 });
 
+app.post("/speech", function (req, res) {
+  const text = req.body.text;
+  res.send(speechFunc(text));
+});
+
 app.listen(port, async function () {
   console.log(`Example app listening on port ${port}!`);
 });

src/App.vue

@@ -1,10 +1,10 @@
-<script setup lang="ts">
-import mainView from '@/views/mainView.vue'
-
-</script>
-
-<template>
-  <mainView/>
-</template>
-
-
+<script setup lang="ts">
+import mainView from '@/views/mainView.vue'
+
+</script>
+
+<template>
+  <mainView/>
+</template>
+
+