feat: update app with gpt4 (#23)

graasp · Jan 8, 2024 · 78ef1b7 · 78ef1b7
1 parent 4bc997c
commit 78ef1b7
Show file tree

Hide file tree

Showing 70 changed files with 3,327 additions and 2,103 deletions.
diff --git a/.github/workflows/build.yml b/.github/workflows/build.yml
@@ -19,3 +19,6 @@ jobs:
 
       - name: Build
         run: yarn build
+
+      - name: Unit Tests
+        run: yarn vitest
diff --git a/cypress/e2e/builder/main.cy.ts b/cypress/e2e/builder/main.cy.ts
@@ -8,16 +8,16 @@ describe('Builder View', () => {
       {},
       {
         context: Context.Builder,
-        permission: PermissionLevel.Read,
+        permission: PermissionLevel.Admin,
       },
     );
     cy.visit('/');
   });
 
-  it('App', () => {
+  it('Results table', () => {
     cy.get(buildDataCy(BUILDER_VIEW_CY)).should(
       'contain.text',
-      'Builder as read',
+      'Conversations',
     );
   });
 });
diff --git a/cypress/e2e/player/main.cy.ts b/cypress/e2e/player/main.cy.ts
@@ -15,9 +15,6 @@ describe('Player View', () => {
   });
 
   it('App', () => {
-    cy.get(buildDataCy(PLAYER_VIEW_CY)).should(
-      'contain.text',
-      'Player as write',
-    );
+    cy.get(buildDataCy(PLAYER_VIEW_CY)).should('be.visible');
   });
 });
diff --git a/cypress/support/commands.ts b/cypress/support/commands.ts
@@ -1,5 +1,6 @@
 /// <reference types="../../src/window" />
 import { Database, LocalContext } from '@graasp/apps-query-client';
+import { Context } from '@graasp/sdk';
 
 import { CURRENT_MEMBER, MEMBERS } from '../fixtures/members';
 import { MOCK_SERVER_ITEM } from '../fixtures/mockItem';
@@ -22,12 +23,13 @@ declare global {
 
 Cypress.Commands.add('setUpApi', (database, appContext) => {
   Cypress.on('window:before:load', (win: Window) => {
-    win.indexedDB.deleteDatabase('graasp-app-cypress');
+    // win.indexedDB.deleteDatabase('graasp-app-cypress');
     // eslint-disable-next-line no-param-reassign
     win.appContext = {
       memberId: CURRENT_MEMBER.id,
       itemId: MOCK_SERVER_ITEM.id,
       apiHost: Cypress.env('VITE_API_HOST'),
+      context: Context.Player,
       ...appContext,
     };
     // eslint-disable-next-line no-param-reassign

diff --git a/index.html b/index.html
@@ -4,10 +4,10 @@
     <meta charset="UTF-8" />
     <link rel="icon" type="image/svg+xml" href="/graasp.svg" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <meta name="title" content="Graasp App template" />
+    <meta name="title" content="Graasp Chatbot App" />
     <meta
       name="description"
-      content="A Template project to create graasp apps."
+      content="An app to discuss with ChatGPT on Graasp."
     />
     <meta
       name="version-info"
@@ -19,7 +19,7 @@
       rel="stylesheet"
       href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700&display=swap"
     />
-    <title>Graasp App Template</title>
+    <title>Graasp Chatbot App</title>
   </head>
   <body>
     <div id="root"></div>

diff --git a/package.json b/package.json
@@ -10,9 +10,10 @@
   "homepage": ".",
   "type": "module",
   "dependencies": {
+    "@codemirror/lang-javascript": "^6.2.1",
     "@emotion/react": "11.11.1",
     "@emotion/styled": "11.11.0",
-    "@graasp/apps-query-client": "3.2.1",
+    "@graasp/apps-query-client": "3.4.0",
     "@graasp/sdk": "3.3.0",
     "@graasp/ui": "4.1.1",
     "@mui/icons-material": "5.14.19",
@@ -24,11 +25,22 @@
     "@types/node": "20.10.4",
     "@types/react": "18.2.42",
     "@types/react-dom": "18.2.17",
-    "i18next": "23.7.8",
+    "@uiw/react-codemirror": "^4.21.21",
+    "file-saver": "^2.0.5",
+    "i18next": "^23.7.9",
+    "lodash.groupby": "^4.6.0",
+    "lucide-react": "^0.297.0",
+    "prism-react-renderer": "^2.3.0",
     "react": "18.2.0",
     "react-dom": "18.2.0",
-    "react-i18next": "13.5.0",
+    "react-i18next": "^13.5.0",
+    "react-markdown": "^9.0.1",
+    "react-mde": "12",
+    "react-router-dom": "^6.21.0",
     "react-toastify": "9.1.3",
+    "remark-breaks": "^4.0.0",
+    "remark-gfm": "^4.0.0",
+    "stylis-plugin-rtl": "^2.1.1",
     "typescript": "5.3.3"
   },
   "scripts": {
@@ -58,7 +70,9 @@
     "@commitlint/config-conventional": "18.4.3",
     "@cypress/code-coverage": "3.12.13",
     "@trivago/prettier-plugin-sort-imports": "^4.3.0",
+    "@types/file-saver": "^2",
     "@types/i18n": "0.13.10",
+    "@types/lodash.groupby": "^4.6.9",
     "@types/uuid": "9.0.7",
     "@typescript-eslint/eslint-plugin": "6.13.2",
     "@typescript-eslint/parser": "6.13.2",
@@ -87,7 +101,8 @@
     "uuid": "9.0.1",
     "vite": "^5.0.6",
     "vite-plugin-checker": "^0.6.2",
-    "vite-plugin-istanbul": "^5.0.0"
+    "vite-plugin-istanbul": "^5.0.0",
+    "vitest": "^1.0.4"
   },
   "browserslist": {
     "production": [

diff --git a/src/@types/i18next.d.ts b/src/@types/i18next.d.ts
diff --git a/src/config/appActions.ts b/src/config/appActions.ts
@@ -0,0 +1,9 @@
+export const AppActionsType = {
+  // Message actions
+  Create: 'create_comment',
+  Edit: 'edit_comment',
+  Delete: 'delete_comment',
+  Reply: 'reply_comment',
+  // chatbot actions
+  AskChatbot: 'ask_chatbot',
+} as const;
diff --git a/src/config/appActionsTypes.ts b/src/config/appActionsTypes.ts
diff --git a/src/config/appData.ts b/src/config/appData.ts
@@ -0,0 +1,20 @@
+import { AppData } from '@graasp/sdk';
+
+export const AppDataTypes = {
+  UserComment: 'comment',
+  BotComment: 'bot-comment',
+};
+
+export const COMMENT_APP_DATA_TYPES: string[] = [
+  AppDataTypes.UserComment,
+  AppDataTypes.BotComment,
+];
+
+export type VisibilityVariants = 'member' | 'item';
+
+export type CommentData = {
+  content: string;
+  parent: string | null;
+  chatbotPromptSettingId?: string;
+};
+export type CommentAppData = AppData<CommentData>;
diff --git a/src/config/appDataTypes.ts b/src/config/appDataTypes.ts
diff --git a/src/config/appSetting.ts b/src/config/appSetting.ts
@@ -0,0 +1,42 @@
+export const SettingsKeys = {
+  ChatbotPrompt: 'chatbot-prompt',
+  General: 'general',
+} as const;
+
+export type ChatCompletionMessageRoles = 'system' | 'user' | 'assistant';
+
+export type ChatCompletionMessage = {
+  role: ChatCompletionMessageRoles;
+  content: string;
+};
+
+// Chatbot Prompt Setting keys
+export enum ChatbotPromptSettingsKeys {
+  InitialPrompt = 'initialPrompt',
+  ChatbotCue = 'chatbotCue',
+  ChatbotName = 'chatbotName',
+}
+
+export type ChatbotPromptSettings = {
+  [ChatbotPromptSettingsKeys.InitialPrompt]: ChatCompletionMessage[];
+  [ChatbotPromptSettingsKeys.ChatbotCue]: string;
+  [ChatbotPromptSettingsKeys.ChatbotName]: string;
+
+  // used to allow access using settings[settingKey] syntax
+  // [key: string]: unknown;
+};
+
+// Chatbot Prompt Setting keys
+export enum GeneralSettingsKeys {
+  MaxCommentLength = 'maxCommentLength',
+  MaxThreadLength = 'maxThreadLength',
+}
+
+export type GeneralSettings = {
+  [GeneralSettingsKeys.MaxCommentLength]: number;
+  [GeneralSettingsKeys.MaxThreadLength]: number;
+};
+export const DEFAULT_GENERAL_SETTINGS: GeneralSettings = {
+  [GeneralSettingsKeys.MaxCommentLength]: 300,
+  [GeneralSettingsKeys.MaxThreadLength]: 50,
+};
diff --git a/src/config/appSettingsTypes.ts b/src/config/appSettingsTypes.ts
diff --git a/src/config/layout.ts b/src/config/layout.ts
diff --git a/src/config/selectors.ts b/src/config/selectors.ts
@@ -140,6 +140,7 @@ export const SETTING_INITIAL_PROMPT_CODE_EDITOR_CY =
 export const SETTING_CHATBOT_PROMPT_LINE_NUMBER_CY =
   'setting_chatbot_prompt_line_number';
 export const SETTING_MAX_COMMENT_LENGTH = 'setting_max_comment_length';
+export const SETTING_MAX_THREAD_LENGTH = 'setting_max_thread_length';
 export const SETTING_ADD_CHATBOT_PROMPT_CY = 'setting_add_chatbot_prompt';
 
 export const REPL_RUN_CODE_BUTTON_CY = 'repl_run_code_button';

diff --git a/src/config/settings.ts b/src/config/settings.ts
diff --git a/src/constants.ts b/src/constants.ts
@@ -0,0 +1,10 @@
+export const DEFAULT_BOT_USERNAME = 'Graasp Bot';
+export const ANONYMOUS_USER = 'Anonymous';
+
+// UI
+export const SMALL_BORDER_RADIUS = '4px';
+export const BIG_BORDER_RADIUS = '8px';
+
+// messages
+export const UNEXPECTED_ERROR_MESSAGE = 'An unexpected error has occurred.';
+export const SUCCESS_MESSAGE = 'The operation succeeded.';
diff --git a/src/constants/messages.ts b/src/constants/messages.ts