| Age | Commit message (Collapse) | Author |
|---|
|
This commit is a significant rewriting of client-side discuss, chatter,
chat window, and messaging menu using OWL. The behavior should be broadly
the same, with some slight functional changes here and there.
From a technical standpoint, the code of messaging is mainly organized in 2
main groups of modules:
- models, which are logical entities that depict the client-side state of
messaging as a whole.
- components, which are in charge of displaying information from models.
This refactoring also introduces new JS guidelines regarding folder structure
(/static) and naming rules for JS modules.
Community PR: https://github.com/odoo/odoo/pull/39023
Enterprise PR: https://github.com/odoo/enterprise/pull/6249
Task-1914207
This PR is a collaborative work by Alexandre, Julien, Sébastien and Xavier,
with the precious help of Lucas to speed it up towards the end.
closes odoo/odoo#39023
Related: odoo/enterprise#6249
Signed-off-by: Alexandre Kühn (aku) <aku@odoo.com>
Co-authored-by: Alexandre Kühn <aku@odoo.com>
Co-authored-by: Julien Giannone <jgi@odoo.com>
Co-authored-by: Lucas Perais <lpe@odoo.com>
Co-authored-by: Sébastien Theys <seb@odoo.com>
Co-authored-by: Xavier Dubuc <xdu@odoo.com>
|
|
This reverts commit ff1c35513aecef5fbc30f7c2f3834450e719714e.
closes odoo/odoo#41480
X-original-commit: 116057b26e71db4692280463669f3e80d813ddcc
Related: odoo/enterprise#7110
Signed-off-by: Yannick Tivisse (yti) <yti@odoo.com>
|
|
FontAwesome 5 introduced new names for some icons as described on
https://fontawesome.com/how-to-use/on-the-web/setup/upgrading-from-version-4#name-changes
This commit replaces the old names to the new ones.
closes odoo/odoo#35826
Taskid: 2050241
Related: odoo/enterprise#5180
Signed-off-by: Yannick Tivisse (yti) <yti@odoo.com>
|
|
There are too many image sizes. Since they are stored resized this takes time to
generate when saving a new image, it's more rows on the attachment table, more
files on the disk, ...
64px is close enough to 128px that it can be removed without a big impact on
download size.
It will even reduce download and number of requests when both images are
displayed because now only one has to be downloaded and then benefit from cache.
The difference between the two is typically around 1.5kB which is negligible
these days, especially when the request overhead is around 0.5kB already, not
even taking into account other factors such as latency.
If a 64px image must absolutely be returned, it is still possible to pass the
size parameters to the image route. But the current guideline is to handle
resizing in the views when necessary.
Views
=====
- remove width and height attributes when existing CSS rules are overriding them
(eg. `.oe_kanban_avatar` in the right context)
- add CSS rules instead of width and height attributes when possible
- use `object-fit: cover;` where width and height are forced to avoid distortion
of non-square images
- for products, use `object-fit: contain;` instead, keep ratio but without crop
- add new CSS rules where the expected size was max 64px*64px before due to the
image size itself
- remove `img-fluid` where using size classes to avoid conflicting rules
task-2060865
closes odoo/odoo#36147
Signed-off-by: Sébastien Theys (seb) <seb@odoo.com>
|
|
On a chat window on mobile, the keyboard can be closed by clicking in
the conversation, then there's no way to send your message.
This commit add a "send" icon in the input, after emoji and attachments
icon. Actually the button was already present on mobile but hidden
because of the class o_composer_button_send (used for multiple "send"
buttons). This is fixed by restricting the hidding only to the desired
button.
It also removes an unused 1px top/bottom margin on the thread composer
(wasn't visible as the buttons' background color is the same as their
parent's background).
Finally applying the brand-primary text color on the "send" button only
when not being in a "mini composer" mode instead of globally.
Task ID: 1943863
closes odoo/odoo#32568
Signed-off-by: Adrien Dieudonné (adr) <adr@odoo.com>
|
|
Since rev. odoo/odoo@f4d541e the `session_id` cookie uses the `httponly` flag so
it cannot be accessed through client side script. But before this rev. the
`session_id` was still provided by the server to the webclient (in session_info,
mostly) and was stored and accessible. This made XSS injection more
dangerous than they should be as it was very easy to steal the `session_id`.
As the browser automatically set the `session_id` on every request to the server,
the webclient shouldn't need any explicit reference.
|
|
This commit is a refactoring of im_status management.
This commit also add im_status in two places, near the author in a mail thread and on each suggestion when using mentions.
A service to manage im_status will have multiple benefits here:
-centralise information, avoid to call the server multiple time for the same im_status
-update all im_status at once and keep consistency in display.
With this commit, the im_status updates are now done by rpc call.
Updates where previously made with the bus but this has some drawback,
since the bus will only give the information 50 seconds after the beginning of
the request, in the worst case, we van wait 2*50 seconds to get an update.
More than that, the im_status where only updates for pinned dm_chat. Dm chat
are synchronized cross tabs, making the use of the bus possible for this purpose.
Since we will need to display im_status not linked to dm_chat, the list to update
will be different from tab to tab making the use of bus difficult for this purpose.
Technical notes:
-im_search has been moved from bus to mail addons since it concerns mail.channel
-Update of an im_status should be reflected everywhere in the page.
Since im_status is a rendered template used in multiple widget, we should add
the correct logic to all concerened widget. The current solution is simple:
use a jquery selector to find every place where im_status is rendered.
-we add a new im_status: im_partner. This will indicate that that
the partner has no user linked to him, making it possible to avoid to ask
for status updates for this partner.
-The update will only be done when the tab is focused. (and will be done
asap once the tab get focus back)
|
|
Before this commit, emojis from the emoji menu in the
composer were small. This is especially true in mobile.
The cause of this issue was the style of bootstrap button
links. This commit fixes the issue by no longer considering
each emojis as button for their style, so that they do not
inherit bootstrap styles.
Task-ID 1918767
closes odoo/odoo#29606
|
|
This commit adds a button to discard replying to
a message from the Discuss inbox.
Task-ID 1881001
|
|
With this commit, the UI for "is typing..." notifications
has changed.
** before **:
In Discuss & chat windows, "is typing..." notification bar
at the bottom of the thread, inside the conversation.
** after **
In chat windows, animated '...' next to conversation name.
In Discuss, animated '...' next to conversation name in sidebar,
and text below the composer.
Task-ID 1881001
|
|
By this commit user can upload attachments by drag and drop in chatter composer.
This feature can be used from discuss UI, chat windows and form view chatter.
Before this commit chatter unlinks the attachment if another attachment uploaded
with same name. Criteria for removing duplicate attachment is changed with this
commit. Now it will remove the attachment based on name and size of attachment.
The reason for this change is, when you upload image with same name from different
directory with old condition it was not possible to attach more then one image/file
of same name.
Related to task #32469
Closes #18914
|
|
* mail, calendar
- Fix traceback when clicking on a tag without color field (introduced
in recent changes)
- Properly allow to delete tags on firefox (a button obviously cannot
contain another button)
Closes https://github.com/odoo/odoo/pull/26547
Thanks to @hbh-odoo
|
|
t-attf-title are translatable, do not use t-attf if a t-att is enough
|
|
'img-rounded' -> 'rounded'
'img-circle' -> 'rounded-circle'
|
|
- The dropdown structure was simplified, allowing to get rid of the
3-levels structure induced by <ul/> elements and dropdowns can now
contain anything. The class 'dropdown-item' is now mandatory for
each dropdown clickable element. The class 'dropdown-item-text' can
be used to add same padding and style but without making the element
have a clickable look.
- Dividers now use the class 'dropdown-divider'
- The way dropdowns are opened and hidden also changed (before the
'open' class was added on the `.dropdown-menu` parent, now the
'show' class is added on both the `.dropdown-menu` parent and the
`.dropdown-menu` itself).
- JS-wise, no click event handlers can be put on `.dropdown-toggle`
elements anymore (instead, use handlers for dropdown events).
- Carets are automatically put on `.dropdown-toggle` elements, so this
commit replaces the `.caret` elements with this. This feature was
possible to disable but would prevent us from adding a caret with
scss. Also, this simplifies the DOM. The 'o-no-caret' class was also
introduced to allow using the 'dropdown-toggle' class on non-caret
elements.
- Also adapt the scss to use $caret-width instead of $caret-width-base
|
|
That was pretty useless, better use the btn-secondary class and add
particular rules to `.btn.fa` if necessary.
|
|
Odoo made the bad choice of using the 'btn-sm' class for every button
instead of configuring the padding for default 'btn' to be smaller.
In BS4, the style of btn-sm is actually more complex, lowering the
font-size too. Also, btn-xs was removed so we would not have the
possibility to display smaller button than our default ones.
This commit removes btn-sm wherever it was used. Unfortunately, this
might remove it at some places where it made sense but this can be
restored in a second time.
|
|
The system completely changed. I also had to adapt classes to new
screen breakpoints.
hidden/hide -> d-none
show -> d-block
hidden-xs -> d-none d-md-(block/inline/...)
hidden-sm -> d-md-none d-lg-(block/inline/...)
hidden-md -> d-lg-none d-xl-(block/inline/...)
hidden-lg -> d-xl-none
visible-xs-* -> d-* d-md-none
visible-sm-* -> d-none d-md-* d-lg-none
visible-md-* -> d-none d-lg-* d-xl-none
visible-lg-* -> d-none d-xl-*
hidden-print -> d-print-none
visible-print-* -> d-none d-print-*
...
and all possible combination of those had to be handled too.
|
|
----------------------
Summary
----------------------
The purpose of this commit is to improve the JS code of the `mail` module.
It applies the new coding guidelines and makes some changes on the design
of some modules, such as the old ChatManager module.
Here is a short summary of the changes that have been made:
1. New coding guidelines
- snake_case to camelCase
- prefix private attributes and methods with '_'
- jsdoc on most methods
- one class per module
2. Rename/Merge some classes
- 'chat manager' becomes 'mail manager' (internal) and 'mail service' (external)
- 'chat window manager' is now included in mail manager
- 'thread' widget now named 'thread widget'
3. New model abstraction for mail objects:
- modules 'mail.model.*'
- modeling:
0..1 0..1 * *
ThreadWindow <------> Thread <-------> Message
/ \
/ \
Thread With Cache Document Thread
/ | \
/ | \
Mailbox Channel Support Channel
|
|
DM
- Thread: the superclass of threads.
- ThreadWindow: the window component of a thread.
- Message: mail objects representing messages.
- Thread With Cache: threads that can be used with search view (Discuss app compatible).
- Document Thread: represents the thread part of a chatter.
- Mailbox: represents what was previously called 'static' channel, e.g. 'Inbox'.
- Channel: mail objects representing channels, including livechat.
- DM: special kind of Channel for 1:1 communication in the backend.
- Support Channel: special channel for im_support module.
This new modeling approach let us easily add features on all threads, such as the
possibility to put any thread in a small window.
----------------------
Known issues
----------------------
[Already Present in Master]
1. When the Discuss app is in the background with 'Inbox' as the selected
Thread, when clicking on a document thread preview in the messaging menu
of the systray, the rainbow man appears.
2. When a document with the chatter is in the background, when receiving an
inbox notification from this document thread, the document thread is
automatically marked as read, which removes the notification right away.
3. Sometimes, opening a DM window from the "blank" thread window does not work.
4. Reply-to feature on Inbox is not working: no message is sent in the document
thread.
5. On the first login of admin user with demo data, the inbox counter is wrong
(it displays 6, instead of 3).
Explanation after investigation:
> On page load, it fetches the correct number of Inbox messages (3),
but the server notifies of 3 needaction messages right away,
so it wrongly assumes these are new needaction messages.
> Not possible for web client to detect that these messages should not
increment the Inbox counter while keeping same API.
6. Notifications for new document thread messages only work when the user sets
'handle with Odoo' for the Notification Management in the preferences.
> due to notifications on the longpoll bus for document thread
messages that come from needaction notifications.
> requires server-side changes to send notification on the longpoll
bus to mentionned user.
[New]
7. When receiving a message on a unjoined channel, thread window flickers
('open' > 'close' > 'open')
Explanation after investigation:
> JS logic:
a) On auto-join, ask server to join the channel and get channel infos.
b) The info tells the channel is not detached, but JS code makes decision
to detach it, and tells server the channel is now detached.
c) From (a), server notifies on longpoll bus the state of channel, which is
not detached. The web client thinks that the window state of the channel
has been changed somewhere else, and the channel is now closed.
d) From (b), server notifies on longpoll bus the state of channel, which is
detached. The web client opens the thread window of this channel.
> The flicker didn't occur before refactoring because the web client was only
updating the model of channel when it receives the longpoll notification.
> Server behaviour on 1st longpoll notification is necessary for cross-tab
synchronization for channel window state.
> New design implies that model and view should be synchronized, hence the
issue now.
> Solution: remove server-side thread window synchronization and replace with
client-side synchronization.
----------------------
Hacks
----------------------
The module `im_livechat` now uses mail objects that are compatible with Message
and Window objects:
Modeling for messages:
AbstractMessage
/ \
/ \
LivechatMessage Message
- AbstractMessage: message compatible with the thread widget.
- LivechatMessage: message used by im_livechat.
- Message: message used with the mail manager.
Modeling for thread windows:
AbstractThreadWindow
/ \
/ \
LivechatWindow ThreadWindow
- AbstractThreadWindow: behaviour share between all types of thread windows.
- LivechatWindow: window used by im_livechat.
- ThreadWindow: window used with mail_manager.
The reason for these hacks are twofold:
1. Use the thread widget in the frontend and livechat external lib bundles.
2. Do not have a dependency with the mail manager in the frontend and external
lib bundles.
|
|
Today, Odoo is really tricky to use without seeing the screen, it must be improved to be usable.
This PR forbid to use labels without a "for" attribute, add some title, rule and aria attributes in HTML. With that, Odoo will be fully usable with a screen reader.
* [IMP] Labels must have a for attribute. Improve accessibility.
* [IMP] Better error message when trying to read a missing cached value
* [FIX] Add some aria-label and title attributes for screen readers.
* [FIX] Template name is not included in the error message in case of SyntaxError in QWeb
* [FIX] Improve the Tour failed at step error message to be more explicit.
* [IMP] Add aria-labels
* [FIX] Add missing aria-label on failing test
* [IMP] aria-hidden means hidden. Fix all bad aria-hidden and hide aria-hidden for all.
* [IMP] Color names on kanban views and many2many tags
* [IMP] Add some checks on views for accessibility.
* [IMP] Add `alt` attribute on `img` tags.
* [IMP] Add aria-label and title on non-described icons
* [IMP] Add button role to widgets with btn class
* [IMP] Translate aria and formatted attributes.
* [IMP] Remove wrong aria-labelledby
* [IMP] Add menu role on dropdowns
* [IMP] Buttons must be focusable
* [IMP] Add aria attributes on progress bars
* [IMP] Improve accessibility of basic widgets
* [IMP] Change main layout to more semantic tags
* [IMP] Add menuitem role when missing
* [IMP] Remove wrong role='presentation'
* [IMP] Improve accessibility of tab panels
* [IMP] Add aria-invalid on invalid fields
* [IMP] Add aria-sort on ordered columns
* [IMP] Add role on alerts
* [IMP] Use dialog role, header, main and footer tags for modals
* [IMP] Add labels on o_status
* [IMP] Improve accessibility of kanban view with feeds and articles
* [IMP] Add alerts in case of new messages
* [IMP] Add widget, navigation or img role to aria-labelled items
|
|
Change the border and cross color of a recipient in mail
composer when the email is invalid (doesn't contains "@").
When sending an mail from composer the user will see easily
if an email adress is invalid and will cause a NO_VALID_RECIPIENT
error.
Task: #46158
PR: #24628
|
|
|
|
This reverts commit c778de44c7cd9b7ef5a9a91738164ab0ebd0ca06.
|
|
Remove the support to replace emojis by images. Most browser
now support colored emoji or at least black and white emojis.
The emojis list have been updated to ensure a correct support
for most os/browser.
Users have the possibility to install fonts localy if their os does not
have one of the default emoji font installed.
After default os emoji font, one of twemoji, emojione or noto color
will be selected.
The emoji list is now hardcoded in js in order to reduce the number of
records in shortcodes.
Also include a small fix for livechat to display message field when rating
is bad.
Task #36898
PR #23689
|
|
Before this commit, many2many email tags showed the recipient's name
and email address. Most of the time, the text was cut off in order to
fit in the maximum length of a many2many tag, so the email address was
usually not visible.
With this commit, many2many email tags now show only the recipient's
name. The recipient's email address is displayed when hovering on the
tag.
Task-ID 36677
|
|
When someone mentions another person in discuss/chat window, the
mentioned name was displayed just as a text, which may be unclear. With
this commit, we display mentions with the same style as mentions in a
message.
To do that, the main idea is to change the input by a div with
contenteditable set to true. This allows us to add <a>...</a> inside.
|
|
- Fix several contexts where the emoji popover was hidden by a webclient
element (control panel / ...). To solve this bug, the design has been
improved to not use popover but instead use custom design (better
integrated with new chatter design)
- Chat window is now still usable when a modal is opened
- Simplify chatter LESS
|
|
- Extract mobile specific code for the client action to a specific
file
- Massive clean of less rules
- Unify channels preview of the systray dropdown and the mobile UI
of Discuss
- Ensure to only load the last message of each channel in mobile,
as this is not used in desktop (unless the user opens the systray
menu)
- Make livechat available in Discuss mobile UI
|
|
- Brand new UI for Discuss client action (with tabs for Inbox,
chats, channels...)
- In mobile, conversations always open in Chat Windows
- Chat window UI improved (both mobile and desktop)
- Channels preview (used in the systray menu, and now in the mobile
UI of Discuss) improved
- Other minor less tweaks
|
|
- Use classes instead of repeated mixins
- Add real user avatar instead of fake one
- Reorganize LESS rules
|
|
- Improve overall design
- Better use of UI colours
- Replace planned activities icon
- Vertically align kanban icons
- Remove the 'bell shtcut' and followers caret
- Use a mixin to style the chatter (inline, not inline, compact)
|
|
Since the new views, the 'o_input' class has to be set explicitely on
<input/>, <select/> and <textarea/> elements to have the proper styling.
|
|
This commit introduce a full redesign of all JS views. We started
basically from scratch. The goal was to unify all the various views
under a common framework, to make them testable, to make then usable in
different conditions (in studio, or in the frontend), and to make our
lives easier.
Some important points are:
- we introduced new coding guidelines (camelCase, 80 chars width, ...)
- we have a brand new testing framework (still QUnit based)
- kanban view moved to the web addon
- calendar view (formerly web_calender) moved to web as well
- the tree view was removed
- all new code should be documented
We hope that this code is the start of a new era for the Odoo web
client, we want to have a high quality codebase, well documented, well
tested, well designed.
Work done by the framework team: mostly aab, ged, chm, dmo, qsm
|
|
|
|
Use the mention mechanism to autocomplete on commands (keyword /).
A first command /help has been implemented.
|
|
Use the mention mechanism of the composer to autocomplete on canned responses
(keyword :) with fuzzy search.
Directly perform the string replacement in the composer, instead of
server-side as before.
Add a menu item to access an editable list view to create and edit canned
responses.
Add two canned responses as demo data.
|
|
The BasicComposer widget is now used in chat windows, which enables the mention
feature. This is only for the backend, as for the livechat windows in the
frontend, the composer is still a simple input.
Classname 'o_chat_input' has been renamed into 'o_chat_composer' (the root
classname of the basic composer) for uniformity in the JS and LESS code of
chat windows.
|
|
Also focus the subject's input by default in extended composer.
|
|
- chatter composer did incorrectly send messages when enter is pressed
- add a div around the textareas to prevent rendering issues because of
flex
|
|
Two composers are appended to the client action: a basic composer and an
extended one used in mass mailing channels. Emojis are rendered in a container,
and when the user clicks on the emojis button, this container is shown.
The problem came from the fact that this container has the same classname in
both composers, so for both composers, the emojis were rendered in the same
container, producing an empty container for one of the two composers
(in this case, the basic one).
|
|
The chatter composer extends the basic composer to, among other things, add
a button to open the full composer next to the button to add an attachment.
In a recent commit, the basic composer template has been slightly changed and
the buttons have been extracted in a sub-template, which seems to break the
template inheritance (the xpath refers to one of those buttons).
This solution simply removes the sub-template and duplicates the code.
|
|
im_livechat:
- feedback message wording
- livechat_channel form view typo
mail:
- channel form view: email_send field label wording and layout
- notifications preview extended
- client action mass mailing composer fine tuning
- client action mass mailing channels tooltip
- client action idle bullet color
|
|
In Discuss, when the user opens a channel, the composer was the same,
regardless of the channel type. This is fine for chat channels, because
we expect mostly small one liners to be written. But for mailing
channels, it is a problem: it is too easy to send a mail to everyone
just by typing ENTER, when the user wanted to go to the next line.
This commit introduces a new widget, the extended composer, to be used
for those channels. It allows the edition of the subject line, and
don't sent messages when the enter key was pressed.
|
|
* chat windows:
- input was kicked out of the window on chrome 43
- don't animate if folded by default (e.g. after a refresh)
- width and height 100% like in the frontend
- z-index to make sure that they are over bootstrap active btn,
but below notifications, and modals
* chatter:
- internal note: send button renammed to 'Log'
- send button is the first button again
- remove annoying form view widget's tooltip
* client action: focus on composer on channel change
|
|
- display appropriate message when no results are found in a search
- don't display 'you have been invited' notif when creating private channel
- correctly join when a user was invited in a public channel
- display a message when a user join a channel through an invitation
- don't display subject for message of type notification (still a
mystery why it happens in test.odoo.com for channel of type mailing)
- better heuristic on when to display message subject
- tweak sidebar text color (slightly whiter)
- add ... to the placeholder of the text area in the composer
- invert send and icons for attach/smiley in composer
- don't display 'read less' on expanded messages
- exclude livechat channels from channel mention suggestions
|
|
The purpose of this commit is to improve the overall performance of the mention
mechanism of the client action and chatter composer, by pre-fetching some data.
First, the employees are fetched at chat initialization (basically, at web
client initialization), if hr is installed.
Second, when focusing on the composer of a channel, the members of this channel
are fetched. In the case of a chatter, the members are already known as they
are the followers of the document.
When the user types a mention, we first display suggestions from the pre-fetched
partners, and we only perform an RPC when there are no more result matching the
search string. This RPC searches among user, and then partners if there aren't
enough matches.
A few side changes occurred:
- auto_join set to True on user_ids field of res.partner to boost the query
that searches partners that are users
- the '/mail/read_followers' route now returns follower's email as well, as
we need it for the mention;
- a partner can now be mentionned several times in the same message;
- mentionned partner previsualization has been removed, mainly because of
the previous point, but also because it simplifies the code;
|
|
- put the mentionned partners and the attachment above the composer
instead of below
- debounce some links in thread.js to prevent double loading views when
double-clicking
- readd the # in front of the channelname of the title of the client action
- give the channel_id to the thread in a chat window, so it does not
display the channel name everytime it displays a message
- correctly close dm chat window when the dm channel is closed in the
main sidebar
- simplify the help messages when a channel is empty
|
|
Generalizes the mention mechanism to allow mentionning partners (@) and
channels (#).
When a user clicks on a mentionned channel, it subscribes to it and joins it.
If the mention is in a chatter, the user is redirected to the Discuss client
action.
Moves the RPCs to get the menu and action id of the Discuss client action from
systray.js to chat_managaer.js as they are now needed in the chatter as well.
Also fixes the on_channel_clicked redirection for notification message
(created/joined/left #channel). Those three messages are now of type
notification, and correctly redirect on click.
|
|
The mention mechanism of the chat composer first proposes partners that are
registered to the current channel or followers of the current document, then
users, and finally partners.
Also reduces the mention detection delay to 200ms.
|
|
... allowing multi-line edition, like in the chatter.
Shortcuts:
- in the client action: ENTER sends, SHIFT+ENTER goes to newline
- in the chatter: SHIFT+ENTER sends, ENTER goes to newline
Don't use autosize anymore to resize the textarea according to its content as
it didn't fit well within the flex layout of the client action ('height: auto'
didn't increase the height of the flex-item with 'flex-grow: 0'). We perform
the resizing ourselves instead.
|
