diff --git a/package.json b/package.json index 82ac96d..ecb52e4 100644 --- a/package.json +++ b/package.json @@ -13,8 +13,8 @@ "@codemirror/lang-javascript": "^6.2.1", "@emotion/react": "11.11.4", "@emotion/styled": "11.11.5", - "@graasp/apps-query-client": "^3.4.5", - "@graasp/sdk": "4.0.1", + "@graasp/apps-query-client": "https://github.com/graasp/graasp-apps-query-client.git#renovate/graasp-sdk-4.x", + "@graasp/sdk": "4.8.1", "@graasp/ui": "4.8.5", "@mui/icons-material": "5.15.16", "@mui/lab": "5.0.0-alpha.170", diff --git a/src/config/appSetting.ts b/src/config/appSetting.ts index cddd823..fe50c5a 100644 --- a/src/config/appSetting.ts +++ b/src/config/appSetting.ts @@ -1,4 +1,4 @@ -import { ChatBotMessage } from '@graasp/sdk'; +import { ChatBotMessage, GPTVersion } from '@graasp/sdk'; export const SettingsKeys = { ChatbotPrompt: 'chatbot-prompt', @@ -12,13 +12,14 @@ export enum ChatbotPromptSettingsKeys { InitialPrompt = 'initialPrompt', ChatbotCue = 'chatbotCue', ChatbotName = 'chatbotName', + GptVersion = 'gptVersion', } export type ChatbotPromptSettings = { [ChatbotPromptSettingsKeys.InitialPrompt]: ChatBotMessage[]; [ChatbotPromptSettingsKeys.ChatbotCue]: string; [ChatbotPromptSettingsKeys.ChatbotName]: string; - + [ChatbotPromptSettingsKeys.GptVersion]?: GPTVersion; // used to allow access using settings[settingKey] syntax // [key: string]: unknown; }; diff --git a/src/langs/en.json b/src/langs/en.json index 50ac8ac..bef1836 100644 --- a/src/langs/en.json +++ b/src/langs/en.json @@ -48,6 +48,10 @@ "NO_COMMENTS_PLACEHOLDER": "No comments", "ABOUT_TITLE": "About the Chatbot App", "ABOUT_DESCRIPTION": "The chatbot app uses OpenAI's ChatGPT model as a base to provide the chatbot integration. Users responses are transmitted to OpenAI trough their API to be processed and for responses to be generated. No other user data is transmitted. If users provide personal data in their messages there is nothing we can do to protect that data.", - "ABOUT_PRIVACY_POLICY_OPENAI": "See the <1>OpenAI Privacy Policy for EU users." + "ABOUT_PRIVACY_POLICY_OPENAI": "See the <1>OpenAI Privacy Policy for EU users.", + "MODEL_VERSION": "Model version", + "GPT_3_5_TURBO_DESCRIPTION" : "gpt-3.5-turbo-0125", + "GPT_4_DESCRIPTION" : "gpt-4", + "GPT_4_TURBO_DESCRIPTION" : "gpt-4-turbo" } } diff --git a/src/mocks/db.ts b/src/mocks/db.ts index 7b145ad..855ce79 100644 --- a/src/mocks/db.ts +++ b/src/mocks/db.ts @@ -18,6 +18,7 @@ export const mockMembers: CompleteMember[] = [ type: 'individual', createdAt: new Date('1996-09-08T19:00:00').toISOString(), updatedAt: new Date().toISOString(), + enableSaveActions: true, }, { id: 'mock-member-id-2', @@ -27,6 +28,7 @@ export const mockMembers: CompleteMember[] = [ type: 'individual', createdAt: new Date('1995-02-02T15:00:00').toISOString(), updatedAt: new Date().toISOString(), + enableSaveActions: true, }, ]; @@ -40,6 +42,7 @@ export const defaultMockContext: LocalContext = { export const mockItem: DiscriminatedItem = { id: defaultMockContext.itemId, + displayName: 'app-starter-ts-vite', name: 'app-starter-ts-vite', description: null, path: '', diff --git a/src/modules/common/ChatbotPrompt.tsx b/src/modules/common/ChatbotPrompt.tsx index 4228ee4..d728995 100644 --- a/src/modules/common/ChatbotPrompt.tsx +++ b/src/modules/common/ChatbotPrompt.tsx @@ -40,7 +40,6 @@ type Props = { const ChatbotPrompt = ({ id }: Props): JSX.Element | null => { const { t } = useTranslation(); const { mutateAsync: postAppDataAsync } = mutations.usePostAppData(); - const { mutateAsync: postChatBot } = mutations.usePostChatBot(); const { data: appData } = hooks.useAppData(); const { data: chatbotPrompts, @@ -49,10 +48,15 @@ const ChatbotPrompt = ({ id }: Props): JSX.Element | null => { } = hooks.useAppSettings({ name: SettingsKeys.ChatbotPrompt, }); + const chatbotPrompt = chatbotPrompts?.[0]; + + const { mutateAsync: postChatBot } = mutations.usePostChatBot( + chatbotPrompt?.data?.gptVersion, + ); + const { data: generalSettings } = hooks.useAppSettings({ name: SettingsKeys.General, }); - const chatbotPrompt = chatbotPrompts?.[0]; const generalSetting = generalSettings?.[0]?.data ?? DEFAULT_GENERAL_SETTINGS; let { memberId } = useLocalContext(); if (id) { diff --git a/src/modules/common/CommentThread.tsx b/src/modules/common/CommentThread.tsx index f900743..698fb27 100644 --- a/src/modules/common/CommentThread.tsx +++ b/src/modules/common/CommentThread.tsx @@ -55,14 +55,18 @@ const CommentThread = ({ children }: Props): JSX.Element | null => { const { mutate: patchData } = mutations.usePatchAppData(); const { mutateAsync: postAppDataAsync } = mutations.usePostAppData(); const { mutate: postAction } = mutations.usePostAppAction(); - const { mutateAsync: postChatbot, isLoading } = mutations.usePostChatBot(); const { data: chatbotPrompts } = hooks.useAppSettings({ name: SettingsKeys.ChatbotPrompt, }); + const chatbotPrompt = chatbotPrompts?.[0]; + + const { mutateAsync: postChatbot, isLoading } = mutations.usePostChatBot( + chatbotPrompt?.data?.gptVersion, + ); + const { data: generalSettings } = hooks.useAppSettings({ name: SettingsKeys.General, }); - const chatbotPrompt = chatbotPrompts?.[0]; const { maxThreadLength, maxCommentLength } = { ...DEFAULT_GENERAL_SETTINGS, ...generalSettings?.[0]?.data, diff --git a/src/modules/settings/ChatbotSettings.tsx b/src/modules/settings/ChatbotSettings.tsx index 8a24980..9c94ed8 100644 --- a/src/modules/settings/ChatbotSettings.tsx +++ b/src/modules/settings/ChatbotSettings.tsx @@ -12,6 +12,8 @@ import { CardContent, FormLabel, Link, + MenuItem, + Select, Stack, TextField, TextareaAutosize, @@ -19,7 +21,7 @@ import { styled, } from '@mui/material'; -import { ChatBotMessage } from '@graasp/sdk'; +import { ChatBotMessage, GPTVersion } from '@graasp/sdk'; import { ChevronDown, Edit, Undo2 } from 'lucide-react'; @@ -69,11 +71,15 @@ const ChatbotSettings = (): JSX.Element => { const stringifiedJsonPrompt = JSON.stringify(initialPrompt, null, 2); const chatbotCue = chatbotPrompt?.data?.chatbotCue || ''; const chatbotName = chatbotPrompt?.data?.chatbotName || DEFAULT_BOT_USERNAME; + const chatbotVersion = + chatbotPrompt?.data?.gptVersion || GPTVersion.GPT_3_5_TURBO; + const [newChatbotPrompt, setNewChatbotPrompt] = useState( stringifiedJsonPrompt, ); const [newChatbotCue, setNewChatbotCue] = useState(chatbotCue); const [newChatbotName, setNewChatbotName] = useState(chatbotName); + const [newChatbotVersion, setNewChatbotVersion] = useState(chatbotVersion); const doneEditing = (): void => { setIsEditing(false); @@ -142,6 +148,7 @@ const ChatbotSettings = (): JSX.Element => { initialPrompt: jsonNewChatbotPrompt, chatbotCue: newChatbotCue, chatbotName: newChatbotName, + gptVersion: newChatbotVersion, }; // setting does not exist if (!chatbotPrompt) { @@ -275,6 +282,33 @@ const ChatbotSettings = (): JSX.Element => { + + + {t('MODEL_VERSION')} + + {t('CHATBOT_CUE_HELPER')} + + + + {t('CHATBOT_CUE_LABEL')} @@ -344,6 +378,28 @@ const ChatbotSettings = (): JSX.Element => { )} + + {t('MODEL_VERSION')} + + {t('CHATBOT_CUE_HELPER')} + + {newChatbotVersion} + + + + {t('CHATBOT_CUE_LABEL')}: + + {t('CHATBOT_CUE_HELPER')} + + + {chatbotCue ? ( + {chatbotCue} + ) : ( + + {t('CHATBOT_CUE_EMPTY_MESSAGE')} + + )} + diff --git a/yarn.lock b/yarn.lock index 5f6583e..4b020e4 100644 --- a/yarn.lock +++ b/yarn.lock @@ -2630,17 +2630,17 @@ __metadata: languageName: node linkType: hard -"@graasp/apps-query-client@npm:^3.4.5": - version: 3.4.10 - resolution: "@graasp/apps-query-client@npm:3.4.10" +"@graasp/apps-query-client@https://github.com/graasp/graasp-apps-query-client.git#renovate/graasp-sdk-4.x": + version: 3.4.12 + resolution: "@graasp/apps-query-client@https://github.com/graasp/graasp-apps-query-client.git#commit=ab1efe0a3001fbeb20a2c293da9df6055b69e5de" dependencies: "@emotion/react": "npm:11.11.4" "@emotion/styled": "npm:11.11.5" - "@graasp/sdk": "npm:4.4.0" - "@mui/icons-material": "npm:5.15.14" - "@mui/material": "npm:5.15.14" + "@graasp/sdk": "npm:4.8.1" + "@mui/icons-material": "npm:5.15.15" + "@mui/material": "npm:5.15.15" axios: "npm:0.28.1" - dexie: "npm:4.0.1" + dexie: "npm:4.0.4" http-status-codes: "npm:2.3.0" miragejs: "npm:0.1.48" msw: "npm:1.3.3" @@ -2653,35 +2653,22 @@ __metadata: date-fns: ^3.3.0 react: ^18.0.0 react-dom: ^18.0.0 - checksum: 10/d0bb88521428f28e4b947922a84879f92d0f7c903422ccae2f08f5ad4fbe0d190d4a097c6d4b3b572bec417be391a517ae68cf28666914776c7805a532bcbe04 + checksum: 10/b8a75a59ae5f8112c10db833dde54fe930cc65664b8527d30279fc6d4b83c6e00da85a3429e799b6f2152545d1d2015e4ea4d055be53db28ba9f561a30942995 languageName: node linkType: hard -"@graasp/sdk@npm:4.0.1": - version: 4.0.1 - resolution: "@graasp/sdk@npm:4.0.1" +"@graasp/sdk@npm:4.8.1": + version: 4.8.1 + resolution: "@graasp/sdk@npm:4.8.1" dependencies: "@faker-js/faker": "npm:8.4.1" + filesize: "npm:10.1.1" js-cookie: "npm:3.0.5" validator: "npm:13.11.0" peerDependencies: date-fns: ^3 uuid: ^9 - checksum: 10/6bd311228762e5c6e18e1585b5fbe72472add562a7025c9c5d55a980e0c2ff6c85e1e200e308d23a6c0a6e2c76ba84d5a64e848669cecc9cd210b95b579e596a - languageName: node - linkType: hard - -"@graasp/sdk@npm:4.4.0": - version: 4.4.0 - resolution: "@graasp/sdk@npm:4.4.0" - dependencies: - "@faker-js/faker": "npm:8.4.1" - js-cookie: "npm:3.0.5" - validator: "npm:13.11.0" - peerDependencies: - date-fns: ^3 - uuid: ^9 - checksum: 10/12c52bca82bc3302ef76747434f80cb4a65b60d64e1fdffffdd729feead573878e6a7434837bebc6b2d930ebe761bb74f6d46e5291b134558df610d57c4c59de + checksum: 10/01dc8fb9f64877add864990b4b8db91728a6e1912976be7bb3d60b85f84733a96f76fa89851bf4b66f45104d1343e26f73fe210d99423a9641990cbcfcb24083 languageName: node linkType: hard @@ -2942,10 +2929,10 @@ __metadata: languageName: node linkType: hard -"@mui/core-downloads-tracker@npm:^5.15.14": - version: 5.15.14 - resolution: "@mui/core-downloads-tracker@npm:5.15.14" - checksum: 10/0a1c63d906af594d0a7fb63d1d574482b3916351ea8908e8621c8bfa16ac38cf4edb5a334f0e28084f583ac928b587cab6e031f992195e0a590186faba13b9a5 +"@mui/core-downloads-tracker@npm:^5.15.15": + version: 5.15.15 + resolution: "@mui/core-downloads-tracker@npm:5.15.15" + checksum: 10/3e99a04e03f66d5fa5f0c23cdce0f9fa2331ba08c99a75dc2347ccaa1c6ed520153e04aaeb0d613c9dca099a3e6242558a6284c33d93f95cc65e3243b17860bc languageName: node linkType: hard @@ -2956,9 +2943,9 @@ __metadata: languageName: node linkType: hard -"@mui/icons-material@npm:5.15.14": - version: 5.15.14 - resolution: "@mui/icons-material@npm:5.15.14" +"@mui/icons-material@npm:5.15.15": + version: 5.15.15 + resolution: "@mui/icons-material@npm:5.15.15" dependencies: "@babel/runtime": "npm:^7.23.9" peerDependencies: @@ -2968,7 +2955,7 @@ __metadata: peerDependenciesMeta: "@types/react": optional: true - checksum: 10/a5033b67d4ff455f5fdd91fc51d26d967d634e861cde194b9dde02a8cc3f557d1b3f7e0b3175bc654b8e944f2118d46620485734ecd9d2ed4a6f748386447933 + checksum: 10/e8810d7ffbba914baf21509e5d664f5f23bdba5d2a7ec7c485a3c7ddbbcb417e555c31feff2a3fa9c7d7fa0d22d4380f32488559ab3b170d891641dbc2161b22 languageName: node linkType: hard @@ -3017,14 +3004,14 @@ __metadata: languageName: node linkType: hard -"@mui/material@npm:5.15.14": - version: 5.15.14 - resolution: "@mui/material@npm:5.15.14" +"@mui/material@npm:5.15.15": + version: 5.15.15 + resolution: "@mui/material@npm:5.15.15" dependencies: "@babel/runtime": "npm:^7.23.9" "@mui/base": "npm:5.0.0-beta.40" - "@mui/core-downloads-tracker": "npm:^5.15.14" - "@mui/system": "npm:^5.15.14" + "@mui/core-downloads-tracker": "npm:^5.15.15" + "@mui/system": "npm:^5.15.15" "@mui/types": "npm:^7.2.14" "@mui/utils": "npm:^5.15.14" "@types/react-transition-group": "npm:^4.4.10" @@ -3046,7 +3033,7 @@ __metadata: optional: true "@types/react": optional: true - checksum: 10/a2c3355b39b86472bf2debb84d6c032b1ea4ba691fbda0f25803f2702f9106130bb85a7d2757545ce97540fe185f07cf24574d5786a29df26baa298ff7db063b + checksum: 10/e2803d078243ee5489bf693f7e9d421061dfda79b6ce74762f3a81e3c519cf69c18af179e4267fc9d0ce799898e6b3d7eac029e7dcfbea12dab5e867d641984b languageName: node linkType: hard @@ -3121,34 +3108,6 @@ __metadata: languageName: node linkType: hard -"@mui/system@npm:^5.15.14": - version: 5.15.14 - resolution: "@mui/system@npm:5.15.14" - dependencies: - "@babel/runtime": "npm:^7.23.9" - "@mui/private-theming": "npm:^5.15.14" - "@mui/styled-engine": "npm:^5.15.14" - "@mui/types": "npm:^7.2.14" - "@mui/utils": "npm:^5.15.14" - clsx: "npm:^2.1.0" - csstype: "npm:^3.1.3" - prop-types: "npm:^15.8.1" - peerDependencies: - "@emotion/react": ^11.5.0 - "@emotion/styled": ^11.3.0 - "@types/react": ^17.0.0 || ^18.0.0 - react: ^17.0.0 || ^18.0.0 - peerDependenciesMeta: - "@emotion/react": - optional: true - "@emotion/styled": - optional: true - "@types/react": - optional: true - checksum: 10/64a9eac1bebefad3042cce28a75d0af2828aa71acd4c32fb0267f5e68bc75b16a093b6fb30709db83ec32130f14f1d67c1c27457ef62733e54a9d04f9b027cee - languageName: node - linkType: hard - "@mui/system@npm:^5.15.15": version: 5.15.15 resolution: "@mui/system@npm:5.15.15" @@ -6539,10 +6498,10 @@ __metadata: languageName: node linkType: hard -"dexie@npm:4.0.1": - version: 4.0.1 - resolution: "dexie@npm:4.0.1" - checksum: 10/c58760b3b0fd5d3781ccfa049fdb730958322c767f03598539e058307248845e846aa8aa9bcfc5279271a4e816d4eba6e049dcd883af2c2b7142cba1475958da +"dexie@npm:4.0.4": + version: 4.0.4 + resolution: "dexie@npm:4.0.4" + checksum: 10/36b55ae77a504ca879017524a51bca2e0355777678a5c25b114408faaf4190398bca752afb22e4ffe80b61d3430f134763942786e59bef8b0aad1e3cd7fb4122 languageName: node linkType: hard @@ -7862,6 +7821,13 @@ __metadata: languageName: node linkType: hard +"filesize@npm:10.1.1": + version: 10.1.1 + resolution: "filesize@npm:10.1.1" + checksum: 10/3d4d05930ec3de16d9cb8c8f4061df1218d3eac4d69521deb3f768cbe7451ff82fe4af3bbf562e1f3a491b96c42e445d65af3cefec90a5deff0ec302dda42ede + languageName: node + linkType: hard + "fill-range@npm:^7.0.1": version: 7.0.1 resolution: "fill-range@npm:7.0.1" @@ -8388,8 +8354,8 @@ __metadata: "@cypress/code-coverage": "npm:3.12.38" "@emotion/react": "npm:11.11.4" "@emotion/styled": "npm:11.11.5" - "@graasp/apps-query-client": "npm:^3.4.5" - "@graasp/sdk": "npm:4.0.1" + "@graasp/apps-query-client": "https://github.com/graasp/graasp-apps-query-client.git#renovate/graasp-sdk-4.x" + "@graasp/sdk": "npm:4.8.1" "@graasp/ui": "npm:4.8.5" "@mui/icons-material": "npm:5.15.16" "@mui/lab": "npm:5.0.0-alpha.170"