Commit Graph

2357 Commits

Author SHA1 Message Date
Sivin Varghese
dd595675bc
chore: Update reply editor design (#10575)
# Pull Request Template

## Description

This PR will update the reply message editor’s design.

**Screen recording**


https://github.com/user-attachments/assets/40f61903-6bf7-4031-9a36-9027dffc46aa

---------

Co-authored-by: Pranav <pranavrajs@gmail.com>
Co-authored-by: Shivam Mishra <scm.mymail@gmail.com>
2025-01-08 17:49:53 +05:30
Shivam Mishra
91b1015457
feat: fixes for bubble UI (#10643)
This PR applies the following fixes

1. Images in emails have margins, causing unnecessary gaps when 1x1px
images are loaded (ref:
[42111](https://app.chatwoot.com/app/accounts/1/conversations/42111?messageId=96215315))
2. Two adjacent `<br>` tags would add a huge gap, fixed this (ref:
[42111](https://app.chatwoot.com/app/accounts/1/conversations/42111?messageId=96215315))
3. Color for outgoing emails is wrong (ref:
[41621](https://app.chatwoot.com/app/accounts/1/conversations/41621?messageId=93560032))
4. Wrong list styles (see:
[42372](https://app.chatwoot.com/app/accounts/1/conversations/42372?messageId=96208130))
5. Wrong bubble color when outgoing message is sent by a bot or captain
6. Wrong avatar when outgoing message is sent by a bot or captain
2025-01-08 09:26:40 +05:30
Shivam Mishra
c924d386f4
fix: reply-to preview not working on next bubbles (#10649) 2025-01-08 08:58:21 +05:30
Sivin Varghese
3c93cdb8b2
feat(v4): Update Inbox view card design (#10599)
Some checks failed
Frontend Lint & Test / test (push) Has been cancelled
Publish Chatwoot CE docker images / build (push) Has been cancelled
Run Chatwoot CE spec / test (push) Has been cancelled
Run Response Bot spec / test (push) Has been cancelled
2025-01-07 21:11:54 +05:30
Daniel Jimenez
918f8e6f8e
fix: AgentTable report showing test value for zero conversations (#10641)
# Pull Request Template

## Description

Changed to make use of nullish coalescing operator to only short circuit
in cases when the `metric` variable is not zero. This change also begs
the question as to whether the `stringToFloat` test function should
exist - to me it seems interesting to have test code embedded into
production code for the frontend?
Fixes #10640

## Type of change

Please delete options that are not relevant.

- [x] Bug fix (non-breaking change which fixes an issue)
- [ ] New feature (non-breaking change which adds functionality)
- [ ] Breaking change (fix or feature that would cause existing
functionality not to work as expected)
- [ ] This change requires a documentation update

## How Has This Been Tested?

Tested by opening the report overview page and reviewing that this shows
`---` for agents with no conversations assigned to them.


## Checklist:

- [x] My code follows the style guidelines of this project
- [x] I have performed a self-review of my code
- [x] I have commented on my code, particularly in hard-to-understand
areas
- [x] I have made corresponding changes to the documentation
- [x] My changes generate no new warnings
- [ ] I have added tests that prove my fix is effective or that my
feature works
- [ ] New and existing unit tests pass locally with my changes
- [x] Any dependent changes have been merged and published in downstream
modules

---------

Co-authored-by: Shivam Mishra <scm.mymail@gmail.com>
2025-01-06 13:51:27 +05:30
Shivam Mishra
c19d70a6a0
fix: bubble UI issues (#10608)
Some checks failed
Frontend Lint & Test / test (push) Has been cancelled
Publish Chatwoot CE docker images / build (push) Has been cancelled
Run Chatwoot CE spec / test (push) Has been cancelled
Run Response Bot spec / test (push) Has been cancelled
This PR has fixes for the following issues

- Inconsistent spacing between meta and text in text bubble
- Activity bubble overflows for longer text (for now I have truncated
it, I'll work with @absurdiya on a better solution)
- Ugly lookinh gradient for expand button on email bubble
- Email bubble overflow issues and text rendering issues
- Alignment for error message
- Minute-wise grouping not working
- Link color should not be blue
- Use `gray-3` for bubble background instead of `gray-4`
2024-12-21 13:36:46 +05:30
Shivam Mishra
eef70b9bd7
feat: integrate new bubbles (#10550)
To test this, set the `useNextBubble` value to `true` in the
localstorage. Here's a quick command to run in the console

```js
localStorage.setItem('useNextBubble', true)
```

```js
localStorage.setItem('useNextBubble', false)
```

---------

Co-authored-by: Pranav <pranavrajs@gmail.com>
2024-12-19 18:41:55 +05:30
Sivin Varghese
2a4c0dfa2a
chore: Adds the ability to remove labels from label card (#10591)
Some checks failed
Frontend Lint & Test / test (push) Has been cancelled
Publish Chatwoot CE docker images / build (push) Has been cancelled
Run Chatwoot CE spec / test (push) Has been cancelled
Run Response Bot spec / test (push) Has been cancelled
2024-12-17 18:43:36 +05:30
Sivin Varghese
6b348da807
feat(v4): Compose a new conversation from a phone number. (#10568) 2024-12-17 18:07:58 +05:30
Sojan Jose
1d88e0dd28
fix: Contact form breaks if name is empty (#10597)
- Handles the case where the form and contact display page breaks if
name is `null`
2024-12-17 17:16:50 +05:30
Sivin Varghese
9220afce6e
feat: Insert captain response to reply editor (#10581)
Some checks failed
Frontend Lint & Test / test (push) Has been cancelled
Publish Chatwoot CE docker images / build (push) Has been cancelled
Run Chatwoot CE spec / test (push) Has been cancelled
Run Response Bot spec / test (push) Has been cancelled
2024-12-13 15:13:16 +05:30
Shivam Mishra
19ff5bdd5e
feat: Add new message bubbles (#10481)
---------

Co-authored-by: Pranav <pranavrajs@gmail.com>
2024-12-12 17:42:22 -08:00
Sivin Varghese
67e52d7d51
fix: Chat list header overflow issue (#10577)
Some checks failed
Frontend Lint & Test / test (push) Has been cancelled
Publish Chatwoot CE docker images / build (push) Has been cancelled
Run Chatwoot CE spec / test (push) Has been cancelled
Run Response Bot spec / test (push) Has been cancelled
# Pull Request Template

## Description

This PR fixes the overflow issue with the chat list header title.

## Type of change

- [x] Bug fix (non-breaking change which fixes an issue)

## How Has This Been Tested?

**Before**
<img width="484" alt="image"
src="https://github.com/user-attachments/assets/e46f6daf-e2f3-4f1c-ba33-00a932d7788f"
/>


**After**
<img width="484" alt="image"
src="https://github.com/user-attachments/assets/d45808aa-ebbd-47e4-be32-f643c22b363f"
/>



## Checklist:

- [x] My code follows the style guidelines of this project
- [x] I have performed a self-review of my code
- [ ] I have commented on my code, particularly in hard-to-understand
areas
- [ ] I have made corresponding changes to the documentation
- [x] My changes generate no new warnings
- [ ] I have added tests that prove my fix is effective or that my
feature works
- [x] New and existing unit tests pass locally with my changes
- [ ] Any dependent changes have been merged and published in downstream
modules
2024-12-12 13:22:52 +05:30
Sivin Varghese
757fac79d1
chore: Update chat list header UI (#10573) 2024-12-12 10:12:07 +05:30
Sivin Varghese
86d37622c8
chore: Remove unused files in contact (#10570) 2024-12-11 19:29:24 -08:00
Shivam Mishra
99c699ea34
fix: links rendering in sidebar profile (#10574)
This pull request includes several changes to the `DropdownItem.vue` and `SidebarProfileMenu.vue` components to improve the handling of links.

Earlier we passed the link `/super_admin` to RouterLink directly, which would trigger validations internally and the dropdown item would not render in case of any errors. This PR fixes this by handling the native links appropriately

Fixes #10571
2024-12-11 17:42:46 -08:00
Pranav
a3290bfd42
fix: Update design of the conversation sidebar, chatlist (#10572)
- Increase the sidebar and chatlist width on screens bigger than 2xl
- Fix background of the copilot sidebar
- Increase the breakpoint for hiding chatlist from 1024 to 1200
2024-12-11 08:06:21 -08:00
Pranav
10a0333980
feat(ee): Add copilot integration (v1) to the conversation sidebar (#10566) 2024-12-10 15:36:48 -08:00
Sivin Varghese
1b0e94ec95
feat: Flag icon component (#10564)
Some checks failed
Frontend Lint & Test / test (push) Has been cancelled
Publish Chatwoot CE docker images / build (push) Has been cancelled
Run Chatwoot CE spec / test (push) Has been cancelled
Run Response Bot spec / test (push) Has been cancelled
2024-12-10 11:53:24 +05:30
giquieu
472f6d9345
feat: Ability to lock the conversation to a single thread in API channels (#10329)
Added the possibility to mark as a single conversation in the API type
inbox. This allows the conversation builder to search for the last
conversation.
I thought about searching for the last conversation with created_at:
desc order, as is done in some channels... but I didn't change the way
the conversation is searched.

Fixes: #7726 

Co-authored-by: Sojan Jose <sojan@pepalo.com>
2024-12-09 23:36:17 +08:00
Shivam Mishra
2ce7c8b845
fix: sidebar collapsed on reload (#10561)
When reloading a page, the sidebar item that is actively selected is
collapsed by default. This PR fixes it by expanding it on reload
2024-12-09 15:59:26 +05:30
Sivin Varghese
d902bb1d6f
fix: Remove duplicate contactable inbox in the conversation form (#10554)
Some checks failed
Frontend Lint & Test / test (push) Has been cancelled
Publish Chatwoot CE docker images / build (push) Has been cancelled
Run Chatwoot CE spec / test (push) Has been cancelled
Run Response Bot spec / test (push) Has been cancelled
---------

Co-authored-by: Pranav <pranavrajs@gmail.com>
2024-12-06 12:31:01 -08:00
Sivin Varghese
1b430ffae2
fix: New compose conversation form (#10548) 2024-12-06 15:40:06 +05:30
Sivin Varghese
afb3e3e649
fix: Fix issues with contact routes in old navigation sidebar (#10547) 2024-12-05 22:46:57 -08:00
Shivam Mishra
3fd585f40b
feat: Throttle meta request for large chat size (#10518)
For large accounts with huge volumes of messages, it can be very
wasteful to make the meta request so often. It also puts un-necessary
load on the DB bombarding it with so many requests. This PR fixes it by
throttling the requests to 5 seconds for all users with more than 1000
accessible chats.

### Why not cache this value in the backend?

Well, it's a bit tricky, since a user can have different permissions
over inboxes and can see different chats, maintaining a cache for each
of them is not effective, besides the requests will reach the server
anyway.
2024-12-05 22:35:30 -08:00
Sivin Varghese
b116ab5ad3
feat(v4): Compose new conversation without multiple clicks (#10545)
---------

Co-authored-by: Pranav <pranav@chatwoot.com>
Co-authored-by: Pranav <pranavrajs@gmail.com>
2024-12-05 20:16:29 -08:00
Sivin Varghese
67c90231b6
feat: Add compose conversation components (#10457)
Co-authored-by: Pranav <pranav@chatwoot.com>
Co-authored-by: Pranav <pranavrajs@gmail.com>
2024-12-05 16:31:47 -08:00
Sivin Varghese
41106bccb7
chore: Fix issues with Contact pages (#10544) 2024-12-05 14:24:10 -08:00
Shivam Mishra
cdff624a0a
feat: update notification settings (#10529)
https://github.com/user-attachments/assets/52ecf3f8-0329-4268-906e-d6102338f4af

---------

Co-authored-by: Pranav <pranav@chatwoot.com>
Co-authored-by: Pranav <pranavrajs@gmail.com>
2024-12-05 19:05:04 +05:30
Sivin Varghese
d635be4b2a
fix: Fetch assignable agents in expanded layout (#10540) 2024-12-04 21:26:00 -08:00
Sivin Varghese
f7b0d5dbe2
fix: Reset contact attributes when form is updated (#10539) 2024-12-04 21:25:28 -08:00
Sivin Varghese
3edc0542cc
fix: Fix issue with profile picture not updating (#10532)
Some checks failed
Frontend Lint & Test / test (push) Has been cancelled
Publish Chatwoot CE docker images / build (push) Has been cancelled
Run Chatwoot CE spec / test (push) Has been cancelled
Run Response Bot spec / test (push) Has been cancelled
This PR resolves the issue with updating the profile picture in the profile settings.

**Cause of issue**
The issue can be reproduced with the old `ProfileAvatar.vue` component.
While the exact reason is unclear, it seems related to cases where the
file might be `null`.

**Solution**
Replaced the old `ProfileAvatar.vue` with `Avatar.vue` and tested it. It
works fine. I’ve attached a loom video below.

Fixes https://linear.app/chatwoot/issue/CW-3768/profile-picture-bug

Co-authored-by: Pranav <pranav@chatwoot.com>
Co-authored-by: Pranav <pranavrajs@gmail.com>
2024-12-04 15:02:29 -08:00
Sivin Varghese
bf58a18af4
fix: Update contact details page errors (#10536)
Co-authored-by: Pranav <pranavrajs@gmail.com>
2024-12-04 13:58:53 -08:00
Shivam Mishra
9b6830a610
fix: Update UI issues with sidebar (#10535)
This PR fixes a few UI issues with the sidebar

1. `z-index` issues with sidebar dropdowns
2. Move the event listener to the root of the dropdown container, it
allows more consistent behaviour of the trigger, earlier the click on
the trigger when the dropdown was open would cause the container to
re-render
3. Use `perserve-open` for the status switcher menu item in the profile
menu.
4. Use `sessionStorage` instead of `localStorage` to preserve sidebar
dropdown info. When opening the dashboard without directly going to a
specific route, any previous known item would get expanded even if it's
link was not active, this caused issues across tabs too, this fixes it.
5. Use `snakeCaseKeys` instead of `decamelize` we had two packages doing
the same thing
6. Update `vueuse` the new version is vue3 only
2024-12-04 13:48:12 -08:00
Sivin Varghese
769b7171f4
feat(v4): Add new contact details screen (#10504)
Co-authored-by: Pranav <pranavrajs@gmail.com>
2024-12-03 21:29:47 -08:00
Sivin Varghese
062587487a
feat: Improve Contact list (#10522) 2024-12-02 18:23:41 -08:00
Sivin Varghese
0ab7accd3f
feat: Contact filter preview (#10516)
# Pull Request Template

## Description

**Screenshots**
<img width="986" alt="image"
src="https://github.com/user-attachments/assets/8df44237-ec51-45d3-aed3-518cded42f5d">

<img width="986" alt="image"
src="https://github.com/user-attachments/assets/2213ce2e-2461-41f0-a05a-0f955a4d7e3a">

**Story**
<img width="992" alt="image"
src="https://github.com/user-attachments/assets/f8e25fe2-11e8-4b9b-8d0b-357f9b7b6e39">
2024-12-02 16:22:05 +05:30
Sivin Varghese
1c12fbceb9
feat: New contacts advanced filter (#10514)
Some checks failed
Frontend Lint & Test / test (push) Has been cancelled
Publish Chatwoot CE docker images / build (push) Has been cancelled
Run Chatwoot CE spec / test (push) Has been cancelled
Run Response Bot spec / test (push) Has been cancelled
2024-11-29 10:55:15 +05:30
Sivin Varghese
a50e4f1748
feat(v4): Update the design for the contacts list page (#10501)
---------
Co-authored-by: Pranav <pranavrajs@gmail.com>
Co-authored-by: Pranav <pranav@chatwoot.com>
2024-11-27 20:07:20 -08:00
Shivam Mishra
25c61aba25
feat(v4): Add new conversation filters component (#10502)
Co-authored-by: Pranav <pranav@chatwoot.com>
Co-authored-by: Pranav <pranavrajs@gmail.com>
2024-11-27 20:05:54 -08:00
Pranav
35702457ed
feat: Update design for report pages (#10506)
<img width="1440" alt="Screenshot 2024-11-26 at 8 38 57 PM"
src="https://github.com/user-attachments/assets/f752157c-6134-42cb-8211-ce636ea9e4d6">
<img width="1439" alt="Screenshot 2024-11-26 at 8 40 47 PM"
src="https://github.com/user-attachments/assets/580b1f61-68bc-489b-9081-b0aeb402f31d">

---------

Co-authored-by: Shivam Mishra <scm.mymail@gmail.com>
2024-11-27 18:10:15 +08:00
Shivam Mishra
d569713b66
fix: Fix z-index issue on account switcher (#10505)
Co-authored-by: Pranav <pranav@chatwoot.com>
2024-11-26 19:59:16 -08:00
Sivin Varghese
b9d888d8ab
feat: Add contact header components (#10498) 2024-11-25 19:59:04 -08:00
Sivin Varghese
ba1b02e274
feat: Add contact empty state components (#10499) 2024-11-25 19:50:33 -08:00
Shivam Mishra
b0287fe389
feat: Add conditions row component (#10496)
---------

Co-authored-by: Pranav <pranavrajs@gmail.com>
2024-11-25 16:33:12 -08:00
Shivam Mishra
c23cd094f9
feat(v4): Add filter input components (#10493)
This PR adds three components along with stories

1. MultiSelect - This is used for filter values, allowing multiple values and folding of values where there are too many items
2. SingleSelect - This is used for filter values, allows selecting and toggling a single item
3. FilterSelect - This is used for operators and others, it allows icons and labels as well as toggling them using props. The v-model for this binds just the final value unlike the previous two components with bind the entire object.

---------

Co-authored-by: Pranav <pranavrajs@gmail.com>
2024-11-25 11:52:28 -08:00
Sivin Varghese
e9ba4200b2
feat: Add custom attributes components (#10467) 2024-11-24 16:46:00 -08:00
Shivam Mishra
0f659224a7
feat: async update of article [CW-3721] (#10435)
Some checks failed
Frontend Lint & Test / test (push) Has been cancelled
Publish Chatwoot CE docker images / build (push) Has been cancelled
Run Chatwoot CE spec / test (push) Has been cancelled
Run Response Bot spec / test (push) Has been cancelled
### The problem

Writing in the text editor can be very frustrating, the reason is that
the editor had a debounced save method which would push the article to
the backend and update the current state. This however is a bad idea,
since the can take anywhere between 100-300ms depending on network
conditions.

While this would be in progress, the article is still being edited by
the user. So at the end of the network request, the state returned from
the backend and the current state in the editor is diverged. But since
the update happens anyway, the editor would prepend older context.

```
Time   --> 

User Action:      [Edit 1] ---> [Edit 2] ---> [Edit 3]
Backend Save:           Save Req (Edit 1) ----> Response (Edit 1)
Resulting Editor State: [Edit 3] + [Edit 1] (Outdated state prepended)
```

### The solution

The solution is to unbind the article from the backend state, ensuring
that the article editor is the source of truth and ignoring the
responses. This pull request does this by adding an asynchronous save
functionality. The changes include adding a new `saveArticleAsync` event
and ensuring that the local state is not updated unnecessarily during
asynchronous saves.

```
Time   --> 

User Action:      [Edit 1] ---> [Edit 2] ---> [Edit 3]
Backend Save:           Save Req (Edit 1) ----> Response (ignored)
Resulting Editor State: [Edit 3] (Consistent and up-to-date)
```

Added the following two debounced methods

These complementary debounce methods prevent unnecessary re-renders
while ensuring backend is in sync. `saveArticleAsync` preserves the
editor as the source of truth, while `saveArticle` manages periodic
state updates from the backend with a delay large enough to safely
assume that the user has stopped typing
Method | Delay | Behavior
-- | -- | -- 
`saveArticleAsync` | 400ms | Sends data to backend and ignores the
response
`saveArticle` | 2.5s | Sends data and updates local state with the
backend response

### How to test

1. Remove the following line
dc042f6ddc/app/javascript/dashboard/components-next/HelpCenter/Pages/ArticleEditorPage/ArticleEditor.vue (L64)
1. Update the latency here to 400 (P.S. the diff shows the latency to be
600, but that was added as a stop-gap solution)

dc042f6ddc/app/javascript/dashboard/components-next/HelpCenter/Pages/ArticleEditorPage/ArticleEditor.vue (L51)
1. Set the browser network latency to Slow 3G or 3G
1. Start writing on the editor, try fixing typos with backspace or
moving around with the cursor

---------

Co-authored-by: Sivin Varghese <64252451+iamsivin@users.noreply.github.com>
Co-authored-by: Pranav <pranav@chatwoot.com>
2024-11-21 19:38:08 -08:00
Sivin Varghese
2dae4b22a2
feat: Add Label Input components (#10480) 2024-11-21 13:57:43 -08:00
Sivin Varghese
cf6ef11b9f
feat: Add contact merge form component (#10478)
Co-authored-by: Pranav <pranavrajs@gmail.com>
2024-11-21 13:52:25 -08:00