From 8964aea9df8fa580a6fd9f3043dfb448806acacb Mon Sep 17 00:00:00 2001 From: Rishabh Saxena Date: Thu, 20 May 2021 17:33:08 +0530 Subject: [PATCH] [Feature] Comments feature updates (#4579) --- .../ApiPaneTests/API_Edit_spec.js | 5 +- .../ProductUpdates/ProductUpdates_spec.js | 2 +- .../manual_TestSuite/List_Widget_Spec.js | 92 ++-- .../manual_TestSuite/Text_Widget_Spec.js | 199 ++++---- app/client/cypress/support/commands.js | 12 +- app/client/package.json | 5 +- app/client/public/index.html | 5 + app/client/src/actions/commentActions.ts | 118 ++++- app/client/src/actions/tourActions.ts | 22 + app/client/src/actions/userActions.ts | 13 + app/client/src/api/CommentsAPI.tsx | 37 +- app/client/src/api/UserApi.tsx | 21 +- app/client/src/assets/icons/comments/chat.svg | 3 + .../comment-mode-unread-indicator.svg | 4 + .../assets/icons/comments/commentCursor.png | Bin 0 -> 1441 bytes .../assets/icons/comments/context-menu.svg | 5 + .../src/assets/icons/comments/down-arrow.svg | 4 + .../src/assets/icons/comments/edit-mode.svg | 3 + .../src/assets/icons/comments/emoji.svg | 4 +- .../src/assets/icons/comments/filter.svg | 3 + app/client/src/assets/icons/comments/link.svg | 4 +- app/client/src/assets/icons/comments/pen.svg | 3 + .../src/assets/icons/comments/pin_3.svg | 3 + .../src/assets/icons/comments/reaction-2.svg | 13 + .../src/assets/icons/comments/reaction.svg | 6 + .../src/assets/icons/comments/read-pin.svg | 3 + .../src/assets/icons/comments/unpin.svg | 3 + .../src/assets/icons/comments/unread-pin.svg | 3 + .../images/comments-onboarding/step-1.png | Bin 0 -> 37202 bytes .../images/comments-onboarding/step-2.png | Bin 0 -> 30390 bytes .../images/comments-onboarding/step-3.png | Bin 0 -> 40249 bytes .../images/comments-onboarding/step-4.png | Bin 0 -> 15261 bytes .../src/assets/images/profile-placeholder.svg | 3 + .../AppComments/AppCommentThreads.tsx | 77 +++- .../src/comments/AppComments/AppComments.tsx | 17 +- .../AppComments/AppCommentsFilterPopover.tsx | 128 ++++++ .../AppComments/AppCommentsHeader.tsx | 55 +-- .../AppComments/AppCommentsPlaceholder.tsx | 34 ++ .../src/comments/AppComments/Container.tsx | 12 +- .../src/comments/CommentCard/CommentCard.tsx | 433 +++++++++++++++--- .../CommentCard/CommentContextMenu.tsx | 106 +++-- .../CommentCard/ResolveCommentButton.tsx | 47 +- .../comments/CommentThread/CommentThread.tsx | 177 ++++--- .../comments/CommentThread/ScrollToLatest.tsx | 30 +- .../CommentsCarouselModal.tsx | 25 + .../FormDisplayImage.tsx | 50 ++ .../CommentsShowcaseCarousel/ProfileForm.tsx | 81 ++++ .../CommentsShowcaseCarousel/index.tsx | 173 +++++++ .../src/comments/ToggleCommentModeButton.tsx | 105 ----- .../inlineComments/AddCommentInput.tsx | 143 ++++-- .../inlineComments/InlineCommentPin.tsx | 256 ++++++++--- .../inlineComments/OverlayCommentsWrapper.tsx | 50 +- .../inlineComments/StyledComponents.tsx | 6 +- .../UnpublishedCommentThread.tsx | 143 +++--- .../comments/tour/AddCommentTourComponent.tsx | 22 + .../src/comments/tour/commentsTourSteps.ts | 25 + app/client/src/comments/utils.ts | 36 ++ app/client/src/components/ads/Checkbox.tsx | 7 +- .../src/components/ads/DisplayImageUpload.tsx | 175 +++++++ app/client/src/components/ads/EmojiPicker.tsx | 48 +- .../src/components/ads/EmojiReactions.tsx | 157 +++++++ app/client/src/components/ads/Icon.tsx | 74 ++- .../src/components/ads/MentionsInput.tsx | 79 +++- app/client/src/components/ads/Radio.tsx | 8 +- .../src/components/ads/ShowcaseCarousel.tsx | 117 +++++ app/client/src/components/ads/Tooltip.tsx | 7 +- .../components/ads/formFields/TextField.tsx | 5 +- .../ads/tour/TourTooltipWrapper.tsx | 57 +++ .../blueprint/ModalComponent.tsx | 24 +- app/client/src/constants/CommentConstants.tsx | 1 + app/client/src/constants/DefaultTheme.tsx | 100 +++- app/client/src/constants/Layers.tsx | 7 +- .../src/constants/ReduxActionConstants.tsx | 21 + app/client/src/constants/TourSteps.tsx | 8 + app/client/src/constants/messages.ts | 17 + .../entities/Comments/CommentsInterfaces.ts | 33 +- app/client/src/entities/Tour/index.ts | 3 + .../src/globalStyles/commentThreadPopovers.ts | 15 +- app/client/src/globalStyles/index.tsx | 4 + app/client/src/globalStyles/popover.ts | 10 +- app/client/src/globalStyles/portals.ts | 20 + app/client/src/globalStyles/uppy.ts | 11 + app/client/src/index.css | 9 - .../AppViewer/viewer/AppViewerHeader.tsx | 2 +- app/client/src/pages/Editor/EditorHeader.tsx | 4 +- app/client/src/pages/Editor/GlobalHotKeys.tsx | 14 + .../src/pages/Editor/ToggleModeButton.tsx | 182 ++++++++ app/client/src/pages/Editor/index.tsx | 4 + app/client/src/pages/common/ProfileImage.tsx | 33 +- app/client/src/pages/common/SubHeader.tsx | 3 +- app/client/src/reducers/index.tsx | 2 + .../commentsReducer/commentsReducer.test.ts | 25 +- .../commentsReducer/commentsReducer.ts | 146 ++++-- .../handleCreateNewCommentThreadSuccess.ts | 2 +- .../handleNewCommentThreadEvent.ts | 17 +- .../handleUpdateCommentEvent.ts | 21 + .../handleUpdateCommentThreadEvent.ts | 5 +- .../handleUpdateCommentThreadSuccess.ts | 2 + .../uiReducers/commentsReducer/interfaces.ts | 7 + .../commentsReducer/testFixtures.ts | 1 - app/client/src/reducers/uiReducers/index.tsx | 2 + .../src/reducers/uiReducers/tourReducer.ts | 40 ++ .../sagas/CommentSagas/handleCommentEvents.ts | 5 + app/client/src/sagas/CommentSagas/index.ts | 172 +++++-- app/client/src/sagas/InitSagas.ts | 13 + app/client/src/sagas/TourSagas.ts | 30 ++ app/client/src/sagas/WebsocketSagas.ts | 22 +- app/client/src/sagas/index.tsx | 2 + app/client/src/sagas/userSagas.tsx | 36 +- app/client/src/selectors/commentsSelectors.ts | 112 ++++- app/client/src/selectors/tourSelectors.tsx | 7 + .../src/utils/hooks/dragResizeHooks.tsx | 10 +- .../src/utils/hooks/useIsScrolledToBottom.tsx | 1 + .../utils/hooks/useProceedToNextTourStep.tsx | 22 + .../src/utils/hooks/useResizeObserver.tsx | 19 + app/client/src/utils/storage.ts | 22 + app/client/start-https.sh | 4 +- app/client/test/setup.ts | 2 + app/client/yarn.lock | 44 +- .../com/appsmith/server/domains/Comment.java | 13 +- .../server/domains/CommentThread.java | 3 +- .../server/services/CommentServiceImpl.java | 17 +- 122 files changed, 3951 insertions(+), 963 deletions(-) create mode 100644 app/client/src/actions/tourActions.ts create mode 100644 app/client/src/assets/icons/comments/chat.svg create mode 100644 app/client/src/assets/icons/comments/comment-mode-unread-indicator.svg create mode 100644 app/client/src/assets/icons/comments/commentCursor.png create mode 100644 app/client/src/assets/icons/comments/context-menu.svg create mode 100644 app/client/src/assets/icons/comments/down-arrow.svg create mode 100644 app/client/src/assets/icons/comments/edit-mode.svg create mode 100644 app/client/src/assets/icons/comments/filter.svg create mode 100644 app/client/src/assets/icons/comments/pen.svg create mode 100644 app/client/src/assets/icons/comments/pin_3.svg create mode 100644 app/client/src/assets/icons/comments/reaction-2.svg create mode 100644 app/client/src/assets/icons/comments/reaction.svg create mode 100644 app/client/src/assets/icons/comments/read-pin.svg create mode 100644 app/client/src/assets/icons/comments/unpin.svg create mode 100644 app/client/src/assets/icons/comments/unread-pin.svg create mode 100644 app/client/src/assets/images/comments-onboarding/step-1.png create mode 100644 app/client/src/assets/images/comments-onboarding/step-2.png create mode 100644 app/client/src/assets/images/comments-onboarding/step-3.png create mode 100644 app/client/src/assets/images/comments-onboarding/step-4.png create mode 100644 app/client/src/assets/images/profile-placeholder.svg create mode 100644 app/client/src/comments/AppComments/AppCommentsFilterPopover.tsx create mode 100644 app/client/src/comments/AppComments/AppCommentsPlaceholder.tsx create mode 100644 app/client/src/comments/CommentsShowcaseCarousel/CommentsCarouselModal.tsx create mode 100644 app/client/src/comments/CommentsShowcaseCarousel/FormDisplayImage.tsx create mode 100644 app/client/src/comments/CommentsShowcaseCarousel/ProfileForm.tsx create mode 100644 app/client/src/comments/CommentsShowcaseCarousel/index.tsx delete mode 100644 app/client/src/comments/ToggleCommentModeButton.tsx create mode 100644 app/client/src/comments/tour/AddCommentTourComponent.tsx create mode 100644 app/client/src/comments/tour/commentsTourSteps.ts create mode 100644 app/client/src/components/ads/DisplayImageUpload.tsx create mode 100644 app/client/src/components/ads/EmojiReactions.tsx create mode 100644 app/client/src/components/ads/ShowcaseCarousel.tsx create mode 100644 app/client/src/components/ads/tour/TourTooltipWrapper.tsx create mode 100644 app/client/src/constants/TourSteps.tsx create mode 100644 app/client/src/entities/Tour/index.ts create mode 100644 app/client/src/globalStyles/portals.ts create mode 100644 app/client/src/globalStyles/uppy.ts create mode 100644 app/client/src/pages/Editor/ToggleModeButton.tsx create mode 100644 app/client/src/reducers/uiReducers/commentsReducer/handleUpdateCommentEvent.ts create mode 100644 app/client/src/reducers/uiReducers/tourReducer.ts create mode 100644 app/client/src/sagas/TourSagas.ts create mode 100644 app/client/src/selectors/tourSelectors.tsx create mode 100644 app/client/src/utils/hooks/useProceedToNextTourStep.tsx create mode 100644 app/client/src/utils/hooks/useResizeObserver.tsx diff --git a/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/ApiPaneTests/API_Edit_spec.js b/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/ApiPaneTests/API_Edit_spec.js index 918c4592da..94a026cb44 100644 --- a/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/ApiPaneTests/API_Edit_spec.js +++ b/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/ApiPaneTests/API_Edit_spec.js @@ -49,6 +49,9 @@ describe("API Panel Test Functionality", function() { "https://mock-api.appsmith.com/users", ); cy.enterDatasourceAndPath(testdata.baseUrl, testdata.methodWithQueryParam); - cy.ValidateQueryParams({ key: "q", value:"mimeType='application/vnd.google-apps.spreadsheet'" }); + cy.ValidateQueryParams({ + key: "q", + value: "mimeType='application/vnd.google-apps.spreadsheet'", + }); }); }); diff --git a/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/ProductUpdates/ProductUpdates_spec.js b/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/ProductUpdates/ProductUpdates_spec.js index 338970ff7b..ef124c354f 100644 --- a/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/ProductUpdates/ProductUpdates_spec.js +++ b/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/ProductUpdates/ProductUpdates_spec.js @@ -10,7 +10,7 @@ describe("Check for product updates button and modal", function() { .its("store") .invoke("getState") .then((state) => { - const { releaseItems, newReleasesCount } = state.ui.releases; + const { newReleasesCount, releaseItems } = state.ui.releases; if (Array.isArray(releaseItems) && releaseItems.length > 0) { cy.get("[data-cy=t--product-updates-btn]") .contains("What's New?") diff --git a/app/client/cypress/manual_TestSuite/List_Widget_Spec.js b/app/client/cypress/manual_TestSuite/List_Widget_Spec.js index 38cd930f04..720bd2ab87 100644 --- a/app/client/cypress/manual_TestSuite/List_Widget_Spec.js +++ b/app/client/cypress/manual_TestSuite/List_Widget_Spec.js @@ -2,104 +2,92 @@ const dsl = require("../../../fixtures/ListWidgetDsl.json"); describe("List Widget test ideas ", function() { it("List widget background colour and deploy ", function() { - // Drag and drop a List widget - // Open Property pane - // Scroll down to Styles - // Add background colour - // Add item background colour - // Ensure the colour are added appropriately - // Click on Deploy and ensure it is deployed appropriately - } - ) + // Drag and drop a List widget + // Open Property pane + // Scroll down to Styles + // Add background colour + // Add item background colour + // Ensure the colour are added appropriately + // Click on Deploy and ensure it is deployed appropriately + }); it("Adding large item Spacing for item card", function() { // Drag and drop a List widget // Open Property pane // Scroll down to Styles // Add large item spacing (>100) - // Ensure the cards get spaced appropriately - } - ) + // Ensure the cards get spaced appropriately + }); - it("Binding an API data to list widget ", function() { - //Add an API + it("Binding an API data to list widget ", function() { + //Add an API // Drag and drop a List widget // Open list Property pane // Bind the API to list widget // Add Input widget into the list widget // Bind the input widgte to the list widget - } - ) + }); - it("Copy Paste and Delete the List Widget ", function() { + it("Copy Paste and Delete the List Widget ", function() { // Drag and drop a List widget // Click on the property pane // Click on Copy the widget // Paste(cmd+v) the list widget // Click on the delete option of the Parent widget - } - ) + }); it("Renaming the widget from Property pane and Entity explorer ", function() { // Drag and drop a List widget // Click on the property pane // Click name of the widget // Rename the widget - // Navigate to the Entity Explorer + // Navigate to the Entity Explorer // Click on the Widget expands // Navigate to List widget (Double Click) - // Rename the widget - // Ensure the name of the widget is possible from both the place - } - ) + // Rename the widget + // Ensure the name of the widget is possible from both the place + }); - it("Verify the Pagination functionlaity within List Widget", function() { - // Drag and Drop list Widget + it("Verify the Pagination functionlaity within List Widget", function() { + // Drag and Drop list Widget // Click on page 2 // Ensure list widget will be redirected to page 2 - // Click on next button + // Click on next button // Ensure the list widget will be redirected to page 3 // Click on Previous button // Ensure the list widget will be redirected to page 2 // Mouse Hover on the next button // Ensure the tool tip message is appropriate - // Mouse Hover on the Previous button + // Mouse Hover on the Previous button // Ensure the tool tip message is appropriate - } - ) + }); - it("Add new item in the list widget array object", function(){ + it("Add new item in the list widget array object", function() { //Drag and drop list widget - //Click to open an property pane + //Click to open an property pane //Expand Genearl section - //Add the following new item + //Add the following new item //("id": 7,"num": 007",name": Charizard",img": "http://www.serebii.net/pokemongo/pokemon/006.png") //Ensure the new item gets added to the list widget without any error - //Check for the new page is added upon adding new items - } - ) + //Check for the new page is added upon adding new items + }); - it("Adding apt widget into the List widget", function(){ - //Drag and Drop List widget - //Expand the section 1 size in the list widget + it("Adding apt widget into the List widget", function() { + //Drag and Drop List widget + //Expand the section 1 size in the list widget //Ensure by exapdning section inside list widget the page size gets increased - //Drag and Drop button widget inside list widget + //Drag and Drop button widget inside list widget //Ensure Button widget can be placed inside list Widget //Drag and Drop Image widget inside list widget //Ensure Image widget can be placed inside list widget // Drag and drop the text widget inside the list widget // Ensure text widget can be place inside the list widget - } - ) + }); - it("Adding unapt widget to identify the error message", function(){ - //Drag and Drop List widget - //Expand the section 1 size in the list widget + it("Adding unapt widget to identify the error message", function() { + //Drag and Drop List widget + //Expand the section 1 size in the list widget //Drag and Drop widgets ie: Chart ,Date Picker radio button etc - // Ensure an understandable error message is displayed to user - } - ) - - - - }) \ No newline at end of file + // Ensure an understandable error message is displayed to user + }); +}); diff --git a/app/client/cypress/manual_TestSuite/Text_Widget_Spec.js b/app/client/cypress/manual_TestSuite/Text_Widget_Spec.js index 1aa118d32a..d180857d68 100644 --- a/app/client/cypress/manual_TestSuite/Text_Widget_Spec.js +++ b/app/client/cypress/manual_TestSuite/Text_Widget_Spec.js @@ -1,117 +1,106 @@ const homePage = require("../../../locators/Textwidget.json"); describe("Test Ideas to test different feature of text widget ", function() { - it("Add New Text widget along with BG and text colour ", function() { - // Navigate to application - // Drag and drop a Text Widget - // Navigate to Property Pane - // Add a text - // Scroll to BG colour and add a colour - // Next add a text colour - // Click on Deploy - } - ) + it("Add New Text widget along with BG and text colour ", function() { + // Navigate to application + // Drag and drop a Text Widget + // Navigate to Property Pane + // Add a text + // Scroll to BG colour and add a colour + // Next add a text colour + // Click on Deploy + }); - it("Enable Scroll feature with text colour ", function() { - // Navigate to application - // Drag and drop a Text Widget - // Add a long text in the "Label" - // Enable scroll option - // Navigate to Text colour and add a colour - // and ensure it is scrolling - // Click on deploy and check if it scrollable and colour selected is visible - } - ) + it("Enable Scroll feature with text colour ", function() { + // Navigate to application + // Drag and drop a Text Widget + // Add a long text in the "Label" + // Enable scroll option + // Navigate to Text colour and add a colour + // and ensure it is scrolling + // Click on deploy and check if it scrollable and colour selected is visible + }); - it("Adding text Size to the Text along with BG colour ", function() { - // Navigate to application - // Drag and drop a Text Widget - // Navigate to Property pane - // Add a medium text in the "Label" - // Increase the area of the Text Widget - // Navigate to BG colour and add a colour - // Naviaget to "Text Size" - // Select Paragarph option - // Ensure the text size varies accordingly - } - ) + it("Adding text Size to the Text along with BG colour ", function() { + // Navigate to application + // Drag and drop a Text Widget + // Navigate to Property pane + // Add a medium text in the "Label" + // Increase the area of the Text Widget + // Navigate to BG colour and add a colour + // Naviaget to "Text Size" + // Select Paragarph option + // Ensure the text size varies accordingly + }); - it("Adding Bold Font style and Centre Text Alignment ", function() { - // Navigate to application - // Drag and drop a Text Widget - // Navigate to Property pane - // Add a medium text in the "Label" - // Increase the area of the Text Widget - // Navigate to Font Style - // Make it Bold - // and Navigate to Alignment and make it centre - // Ensure the changes are visible to user - } - ) + it("Adding Bold Font style and Centre Text Alignment ", function() { + // Navigate to application + // Drag and drop a Text Widget + // Navigate to Property pane + // Add a medium text in the "Label" + // Increase the area of the Text Widget + // Navigate to Font Style + // Make it Bold + // and Navigate to Alignment and make it centre + // Ensure the changes are visible to user + }); - it("Adding Italic Font style and Text Alignment to exsisting text widget ", function() { - // Navigate to already exsisting Text widget - // Ensure the text is added - // Navigate to Property pane - // Navigate to Font Style - // Make it Italic font - // and Navigate to Alignment and make it Right - // Ensure the changes are visible to user - } - ) + it("Adding Italic Font style and Text Alignment to exsisting text widget ", function() { + // Navigate to already exsisting Text widget + // Ensure the text is added + // Navigate to Property pane + // Navigate to Font Style + // Make it Italic font + // and Navigate to Alignment and make it Right + // Ensure the changes are visible to user + }); - it("Expand and Contract text widget Property pane", function() { - // Navigate to already exsisting Text widget - // Navigate to Property pane - // Click on collapse option - // Observe that the property pane is contracted - // Now click again on the arrow - //and ensure it collapses - } - ) + it("Expand and Contract text widget Property pane", function() { + // Navigate to already exsisting Text widget + // Navigate to Property pane + // Click on collapse option + // Observe that the property pane is contracted + // Now click again on the arrow + //and ensure it collapses + }); - it("Copy and paste a text widget", function() { - // Navigate to already exsisting Text widget - // Ensure Clour and font feature exsists - // Copy and paste the widget - // Ensure the new widget retrives the feature exsisting from parent widget - } - ) + it("Copy and paste a text widget", function() { + // Navigate to already exsisting Text widget + // Ensure Clour and font feature exsists + // Copy and paste the widget + // Ensure the new widget retrives the feature exsisting from parent widget + }); - it("Rename and search a text widget", function() { - // Ensure there are multiple Text widget - // Navigate to Entity Explorer - // Search for "Text" keyword - // Click on one of the text widget - // Rename the text widget from the Entity explorer - // Clear the search keyword - // enter the new text widget name - // and observe the user is navigated to same text widget and properties of the widget does not change on renaming - } - ) + it("Rename and search a text widget", function() { + // Ensure there are multiple Text widget + // Navigate to Entity Explorer + // Search for "Text" keyword + // Click on one of the text widget + // Rename the text widget from the Entity explorer + // Clear the search keyword + // enter the new text widget name + // and observe the user is navigated to same text widget and properties of the widget does not change on renaming + }); - it("Search and delete a text widget", function() { - // Ensure there are multiple Text widget - // Navigate to Entity Explorer - // Search for "Text" keyword - // Click on one of the text widget - // Ensure user is navigated to Text widget - // Click on Delete option - // Ensure the Text widget is delete - // Click on Deploy adn ensure the Widget is delete - } - ) + it("Search and delete a text widget", function() { + // Ensure there are multiple Text widget + // Navigate to Entity Explorer + // Search for "Text" keyword + // Click on one of the text widget + // Ensure user is navigated to Text widget + // Click on Delete option + // Ensure the Text widget is delete + // Click on Deploy adn ensure the Widget is delete + }); - it("Search and delete a text widget", function() { - // Ensure there are multiple Text widget - // Navigate to Entity Explorer - // Search for "Text" keyword - // Click on one of the text widget - // Ensure user is navigated to Text widget - // Click on Delete option - // Ensure the Text widget is delete - // Click on Deploy adn ensure the Widget is delete - } - ) -} -) \ No newline at end of file + it("Search and delete a text widget", function() { + // Ensure there are multiple Text widget + // Navigate to Entity Explorer + // Search for "Text" keyword + // Click on one of the text widget + // Ensure user is navigated to Text widget + // Click on Delete option + // Ensure the Text widget is delete + // Click on Deploy adn ensure the Widget is delete + }); +}); diff --git a/app/client/cypress/support/commands.js b/app/client/cypress/support/commands.js index 5b8e20e933..48b6b2af7d 100644 --- a/app/client/cypress/support/commands.js +++ b/app/client/cypress/support/commands.js @@ -2347,8 +2347,12 @@ Cypress.Commands.add("assertPageSave", () => { Cypress.Commands.add("ValidateQueryParams", (param) => { cy.xpath(apiwidget.paramsTab) - .should("be.visible") - .click({ force: true }); - cy.xpath(apiwidget.paramKey).first().contains(param.key); - cy.xpath(apiwidget.paramValue).first().contains(param.value); + .should("be.visible") + .click({ force: true }); + cy.xpath(apiwidget.paramKey) + .first() + .contains(param.key); + cy.xpath(apiwidget.paramValue) + .first() + .contains(param.value); }); diff --git a/app/client/package.json b/app/client/package.json index 347bbb8a6a..9ba6903428 100644 --- a/app/client/package.json +++ b/app/client/package.json @@ -45,6 +45,7 @@ "@uppy/dashboard": "^1.16.0", "@uppy/file-input": "^1.4.22", "@uppy/google-drive": "^1.5.22", + "@uppy/image-editor": "^0.2.4", "@uppy/onedrive": "^1.1.22", "@uppy/react": "^1.11.2", "@uppy/url": "^1.5.16", @@ -62,7 +63,7 @@ "deep-diff": "^1.0.2", "downloadjs": "^1.4.7", "draft-js": "^0.11.7", - "emoji-picker-react": "^3.4.2", + "emoji-mart": "^3.0.1", "eslint": "^7.11.0", "fast-deep-equal": "^3.1.1", "fast-xml-parser": "^3.17.5", @@ -197,6 +198,7 @@ "@types/deep-diff": "^1.0.0", "@types/downloadjs": "^1.4.2", "@types/draft-js": "^0.11.1", + "@types/emoji-mart": "^3.0.4", "@types/jest": "^24.0.22", "@types/marked": "^1.2.2", "@types/react-beautiful-dnd": "^11.0.4", @@ -206,6 +208,7 @@ "@types/react-window": "^1.8.2", "@types/redux-form": "^8.1.9", "@types/redux-mock-store": "^1.0.2", + "@types/resize-observer-browser": "^0.1.5", "@types/styled-system": "^5.1.9", "@types/tern": "0.22.0", "@types/toposort": "^2.0.3", diff --git a/app/client/public/index.html b/app/client/public/index.html index 70250975eb..8079bbba08 100755 --- a/app/client/public/index.html +++ b/app/client/public/index.html @@ -33,6 +33,11 @@
+ +