Commit Graph

280 Commits

Author SHA1 Message Date
chapoi
d10fd697b4
UX: responsive oneboxing with images in chat (#22824)
* UX: fix narrow oneboxing with images in chat

* UX: more responsive oneboxing

* UX: onebox-avatar limits

* ony flex non onebox-avatars
2023-07-27 13:57:30 +02:00
Joffrey JAFFEUX
2d567cee26
FEATURE: thread pagination (#22624)
Prior to this commit we were loading a large number of thread messages without any pagination. This commit attempts to fix this and also improves the following points:

- code sharing between channels and threads:
Attempts to reuse/share the code use in channels for threads. To make it possible part of this code has been extracted in dedicated helpers or has been improved to reduce the duplication needed.

Examples of extracted helpers:
- `stackingContextFix`: the ios hack for rendering bug when momentum scrolling is interrupted
- `scrollListToMessage`, `scrollListToTop`, `scrollListToBottom`:  a series of helper to correctly scroll to a specific position in the list of messages

- better general performance of listing messages:
One of the main changes which has been made is to remove the computation of visible message during scroll, it will only happen when needed (update last read for example). This constant recomputation of `message.visible` on intersection observer event while scrolling was consuming a lot of CPU time.
2023-07-27 09:57:03 +02:00
Joffrey JAFFEUX
a982b6765f
FIX: allows to resize panels on tablets (#22640)
On tablets like iPad where we allow channel and thread to be on the same screen, it was not possible to resize the panels due to code being thought for mouse events. This commit should now correctly allow for this.

The "resizer" has also been made larger to simplify touching.

No test as it's hard to test on iPad and dragging events are also complex.
2023-07-17 15:11:51 +02:00
chapoi
e4deba0075
UX: size down unread indicators fror drawer/mobile (#22636) 2023-07-17 12:54:00 +02:00
Joffrey JAFFEUX
720063fcfb
FIX: s/--border-radius-large)/--d-border-radius-large (#22587) 2023-07-13 10:17:29 +02:00
chapoi
ab67b2bda9
UX: more border-radius removal from chat (#22542) 2023-07-12 14:30:06 +02:00
chapoi
9576aab391
UX: z-index for for tippy box in chat (#22541) 2023-07-12 14:29:44 +02:00
chapoi
8c74bb6573
UX: lower border radius for channel cards (#22513) 2023-07-10 19:07:01 +02:00
chapoi
0ce0bcd8ff
Remove border radius from chat (#22437)
* add border-radius-large variable

* UX: replace chat border-radius with variable
2023-07-10 15:07:38 +02:00
Joffrey JAFFEUX
9830c40386
DEV: makes chat modals use the new <DModal /> component (#22495)
This commit also standardize the naming pattern of modals: `<Chat::Modal::FooBar />` and changes css class accordingly.

Co-authored-by: David Taylor <david@taylorhq.com>
2023-07-10 13:43:33 +02:00
chapoi
c7cebbfe38
UX: change z-index of thread resizer to be below emoji popup (#22505) 2023-07-10 12:27:55 +02:00
chapoi
c2b98802ea
UX: message creator spacing and sizing on mobile + fix text wrapping (#22508)
* UX: mobile more spacing and bigger

* UX: align text better

* UX: ellipsis and pill bg colour

* UX: disabled-chat msg styling
2023-07-10 12:27:26 +02:00
Joffrey JAFFEUX
af22f77d38
DEV: removes unused components (#22497)
Removes the following components which are not used anymore:
- d-progress-bar
- on-visibility-action
2023-07-10 09:54:45 +02:00
Joffrey JAFFEUX
03e495186f
FIX: makes chat user avatar show presence by default (#22490)
It's way more common to have presence enabled than disabled, so we should have been making it the default from start.

This commit also changes the namespace of `<ChatUserAvatar />` into `<Chat::UserAvatar />` and refactors tests.
2023-07-10 09:36:20 +02:00
Mark VanLandingham
3171fd1a0a
DEV: Introduce Chat Notices with publishing method (#22369) 2023-07-06 08:26:25 -05:00
Joffrey JAFFEUX
d75d64bf16
FEATURE: new jump to channel menu (#22383)
This commit replaces two existing screens:
- draft
- channel selection modal

Main features compared to existing solutions
- features are now combined, meaning you can for example create multi users DM
- it will show users with chat disabled
- it shows unread state
- hopefully a better look/feel
- lots of small details and fixes...

Other noticeable fixes
- starting a DM with a user, even from the user card and clicking <kbd>Chat</kbd> will not show a green dot for the target user (or even the channel) until a message is actually sent
- it should almost never do a full page reload anymore

---------

Co-authored-by: Martin Brennan <mjrbrennan@gmail.com>
Co-authored-by: Jordan Vidrine <30537603+jordanvidrine@users.noreply.github.com>
Co-authored-by: chapoi <101828855+chapoi@users.noreply.github.com>
Co-authored-by: Mark VanLandingham <markvanlan@gmail.com>
2023-07-05 18:18:27 +02:00
chapoi
ee1dbd46c6
UX: Thread indicator small fixes (#22389)
* UX: make timestamp font size smaller

* UX: participants use copy instead of avatar

* FIX: Move thread participant count into i18n

---------

Co-authored-by: Martin Brennan <martin@discourse.org>
2023-07-04 10:32:09 +02:00
Joffrey JAFFEUX
ea0b8ca38c
FEATURE: allows to enable/disable threading in UI (#22307)
Enabling/Disabling threading has been possible through command line until now. This commit introduces two new UIs:

- When creating a channel, it will be available once the category has been selected
- On the settings page of a channel for admins
2023-06-29 07:19:12 +02:00
Martin Brennan
cec68b3e2c
FEATURE: Conditionally change back button route for thread (#22129)
When clicking back from a thread, we want to either go back to the
channel if the thread was opened from an indicator, or to the thread
list if we opened it from there. Since ember doesn't give a nice way
to get the previous route, we need to store this ourselves. We only
do this on mobile, on desktop we just follow existing behaviour.

Also implements a chat router history.

---------

Co-authored-by: Joffrey JAFFEUX <j.jaffeux@gmail.com>
2023-06-28 09:58:47 +10:00
Jarek Radosz
a6bd3994f3
UX: Align chat separators, increase mobile chat width (#22298) 2023-06-27 18:49:45 +02:00
chapoi
802fb3b194
UX: chat message thread indicator improvements (#22224)
- gridified the thread message indicator, alleviating some problems with positioning and overflow
participant avatars will overlap/smush on smaller size and mobile
- the excerpt went from 3 > 2 lines of wrapping on smaller size, still 1 line on large size
- dropped the copy of "last reply"
- fixed wrong line height
- moved the "x replies" over to the right near the participants, as that makes more sense
- using a bubble to indicate other participants, instead of copy

This PR introduces the @container query, which is experimental. Nothing will break when it's being viewed in a not-supported browser, but it will be less elegant.
2023-06-26 14:47:13 +02:00
Kris
6ec95fa79c
FIX: sidebar dot color when chat is off (#22264) 2023-06-26 10:43:35 +02:00
chapoi
a2a31eb420
UX: adding max height to image in chat blockquote (#22255)
* UX: adding max height to  blockquote image in chat
2023-06-23 10:33:12 +02:00
Jarek Radosz
876ff17cc2
DEV: Update eslint/prettier (#22226) 2023-06-21 20:59:03 +02:00
Jan Cernik
e51bbfa4e8
FEATURE: Scroll to first message when clicking date in chat (#21926)
This PR adds a new parameter to fetch chat messages: `target_date`.

It can be used to fetch messages by a specific date string. Note that it does not need to be the `created_at` date of an existing message, it can be any date. Similar to `target_message_id`, it retrieves an array of past and future messages following the query limits.
2023-06-20 15:58:38 +02:00
Joffrey JAFFEUX
cbb9396353
REFACTOR: <ChatMessage> component (#22172)
- Moves `<ChatMessageInfo />` to `<Chat::Message::Info />`
- Moves `<ChatMessageAvatar />` to `<Chat::Message::Avatar />`
- Moves `<ChatMessageLeftGutter />` to `<Chat::Message::LeftGutter />`, adds tests
- Creates `<Chat::Message::Error />`
- Creates `<Chat::Message::MentionWarning />`, adds tests and a styleguide
- Creates a model for ChatMessageMentionWarning, adds fabricator for it
- Keeps the enter/leave viewport logic inside the `<ChatMessage />` component instead of bubbling it to the channel and thread components
- Adds a scale animation when clicking a reaction
- Creates `chat/later-fn` modifier which accepts a function and a delay. It allows to call a function Xms after a component has been inserted, it's useful for animations.
- Moves css code out of chat-message into relevant files
- Deletes unused code

<!-- NOTE: All pull requests should have tests (rspec in Ruby, qunit in JavaScript). If your code does not include test coverage, please include an explanation of why it was omitted. -->
2023-06-19 09:50:54 +02:00
Joffrey JAFFEUX
7db6d27292
FIX: correctly sets and uses has-reply class (#22153)
The layout was broken for messages replying to another message in non threaded channels.

This commit also refactors the chat-message-test to use fabricators.
2023-06-16 14:04:11 +02:00
Joffrey JAFFEUX
ab286cc6e1
FIX: css class was incorrect (#22149)
This was preventing to have the correct active background on the chat message while hovering the action's menu.
2023-06-16 12:33:13 +02:00
Joffrey JAFFEUX
7dafd275ac
FIX: various mobile chat improvements (#22132)
- FIX: improves reactions and thread indicator touch event on mobile
These "buttons" are located inside a scroll list which makes them very specific. The general idea is to ensure these events are passive and are not bubbling to the parent.
- DEV: moves state on top level message node
- FIX: ensures popover arrow has the correct border
- FIX: makes a message expanded by default
- FIX applies the same ios scroll fix on thread and channel
- UI: better active/hover state for thread indicator
- UI: attempts to follow more closely our BEM naming scheme
- FIX: reduces bottom padding on message with thread indicator and user info hidden
- UI: add padding for first message in thread
- FIX: prevents actions backdrop to open thread
- UI: makes thread indicator resizable
2023-06-16 11:36:43 +02:00
Joffrey JAFFEUX
79a260a6bb
FIX: allows selection of messages in threads (#22119)
This commit fixes the selection of message in threads and also applies various refactorings
- improves specs and especially page objects/components
- makes the channel/thread panes responsible of the state
- adds an animationend modifier
- continues to follow the logic of "state" should be displayed as data attributes on component by having a new `data-selected` attribute on chat messages
2023-06-15 11:27:31 +02:00
Martin Brennan
c819c96c31
FIX: Minor thread indicator issue (#22128)
* Set a line height for the last reply excerpt so the height
  does not jump when including an emoji
2023-06-15 16:05:06 +10:00
Martin Brennan
f75ac9da30
FEATURE: Thread indicator improvements and participants (#21909)
This commit adds the initial part of thread indicator improvements:

* Show the reply count, last reply date and excerpt,
and the participants of the thread's avatars and
count of additional participants
* Add a participants component for the thread that
can be reused for the list
* Add a query class to get the thread participants
* Live update the thread indicator more consistently
with the last reply and participant details
image image

In subsequent PRs we will cache the participants since
they do not change often, and improve the thread list
further with participants.

This commit also adds a showPresence boolean (default
true) to ChatUserAvatar, since we don't want to show the
online indicator for thread participants.

---------

Co-authored-by: chapoi <charlie@discourse.org>
2023-06-15 10:49:27 +10:00
Kris
e0f848c2ea
REFACTOR: move shadow vars to css custom props (#22094) 2023-06-13 16:38:31 -04:00
Roman Rizzi
8938ecabc2
FEATURE: Custom content summarization strategies. (#21813)
* FEATURE: Content custom summarization strategies.

This PR establishes a pattern for plugins to register alternative ways of summarizing content by extending a class that defines an interface.

Core controls which strategy we'll use and who has access to it through the `summarization_strategy` and `custom_summarization_allowed_groups`. It also defines the UI for summarizing topics.

Other plugins can access this summarization mechanism and implement their features, removing cross-plugin customizations, as it currently happens between chat and the discourse-ai plugin.

* Group membership validation and rate limiting

* Work with objects instead of classes

* Port summarization feature from discourse-ai to chat

* Rename available summaries to 'Top Replies' and 'Summary'
2023-06-13 14:21:46 -03:00
chapoi
fca6c1836c
UX: Chat unread indicator refactor (#22040)
* move the chat unread indicator to top to match the profile avatar indicator
* add white border to profile avatar indicator (badge notification) to match chat indicator and userstatus styling
* change `.urgent` to BEM
* congregate all styling into mixin
  * update chat index to use mixin
  * update thread indicator to use mixin
  * update header indicator to use mixin

---------

Co-authored-by: Joffrey JAFFEUX <j.jaffeux@gmail.com>
Co-authored-by: Martin Brennan <martin@discourse.org>
2023-06-12 14:33:45 +10:00
Joffrey JAFFEUX
89d7b1861d
FIX: various mobile optimizations (#22043)
* FIX: increases resize observer throttle delay
25ms is not necessary and was sometimes causing jankyness.

* FIX: removes ios momentum fix delay
Instead of a 50ms, simply use next+schedule("afterRender") to attempt to have the shortest delay possible.

* FIX: backdrop event propagation
Prevents backdrop touch to propagate to underlying channel/thread.

* UX: adds is-active class to container of active message
This change allows to keep the background on the active message while the actions menu is displayed.

* FIX: prevents skip-link to be selected on press

* UX: allows to close actions menu instantly
The backdrop should always receive events, we don't need to wait for the menu to be fully displayed.

* UI: adds spacing between last message and composer

* UI: makes backdrop less dark

* FIX: makes events passive on long-press modifier
2023-06-09 17:37:26 +02:00
Bianca Nenciu
4973f0ccde
UX: Remove 'Create Topics' notice (#21958)
We are looking at simplifying the new admin/user experience and the
many notices bring unnecessary complexity.
2023-06-08 22:30:26 +03:00
Sérgio Saquetim
e306a521fd
DEV: Added chat api to remove secondary actions (#21982)
In some cases, plugins may want to hide some of these actions
at all times, overriding the rules for canX with hiding these
buttons. To achieve this, a plugin can call the API
`removeChatComposerSecondaryButtons` and pass the list of button
IDs that should be removed as argument, like the example below:

```
withPluginApi("1.2.0", (api) => {
  api.removeChatComposerSecondaryActions("copyLink", "select");
});
```

---------

Co-authored-by: Martin Brennan <martin@discourse.org>
2023-06-08 11:37:50 -03:00
Joffrey JAFFEUX
e6c6c342d9
REFACTOR: composer/thread (#21910)
This commit contains multiple changes to improve the composer behavior especially in the context of a thread:

- Generally rename anything of the form `chatChannelThread...` to `chatThread...``
- Moves the textarea interactor instance inside the composer server
- Improves the focus state and closing of panel related to the use of the Escape shortcut
- Creates `Chat::ThreadList` as a component instead of having `Chat::Thread::ListItem` and others which could imply they were children of a the `Chat::Thread` component
2023-06-07 21:49:15 +02:00
chapoi
86facadec1
FIX: apply chat header icon indicator style to urgent only (#21967)
* FIX: apply chat header icon indicator style to urgent only

* UX: smaller padding
2023-06-07 06:42:51 +02:00
chapoi
9809103ed9
UX: fix number cutoff in header chat indicator (#21946)
In the chat header indicator, expand to a pill when the number reaches
N digits, and also display 99+ if the number is over 99.
2023-06-07 11:42:08 +10:00
chapoi
8c4cbd748d
UX: fix greyed out add button in chat composer when focussed (#21947) 2023-06-06 11:18:50 +02:00
chapoi
d40649c648
UX: chat channel header icons (#21887)
* UX: BEM fix for has-unreads

* UX: small refactor for chat channel header icons

* UX: refactor chat thread unread indicator

* UX: channel header thread icon hover styling

* DEV: Spec fixes

* UX: fix font + line-height

---------

Co-authored-by: Martin Brennan <martin@discourse.org>
2023-06-02 10:34:19 +02:00
Joffrey JAFFEUX
7b7c4c383a
UX: followups to #1f37fe5 (#21859)
- ensures buttons are aligned to the bottom
- makes the emoji icon tertiary as initially intended
- correctly sets the icon scale of the sending button
2023-05-31 16:58:31 +02:00
chapoi
1f37fe5fa5
UX: chat composer buttons refactor + emoji (#21852)
- Made the emoji btn blue when composer is focused
- Moved everything chat-composer-button to its own file and BEM-ified it and making the choice to only work with our own is-disabled definition instead of with the attribute :disabled, for consistency
2023-05-31 15:12:35 +02:00
Martin Brennan
6ec6cfccf8
FEATURE: Chat thread header indicator improvements (#21807)
This changes the thread header positioning of the
unread indicator to match the designs based on the route:

1. When the channel is open, show the indicator of # unread
   threads with the icon
2. When the threads list is open, show no indicator since
   you are on the list and can see which threads are unread
3. When a single thread is open, show the unread threads
   indicator along with a left < back button, with a label
   to show that this goes back to ongoing discussions

Drawer changes to come in another PR.
2023-05-30 10:10:07 +02:00
Joffrey JAFFEUX
9215de3af7
FIX: ensures chat-thread is not overflowing (#21782) 2023-05-29 09:55:50 +02:00
Martin Brennan
7a9514922b
FEATURE: Improving thread list item and header (#21749)
* Moved the settings cog from thread list to thread and
  put it in a new header component
* Remove thread original message component, no longer needed
  and the list item and thread indicator styles/content
  will be quite different
* Start adding content (unread indicator etc.) to the thread
  list item and changing structure to be more like designs
* Serialize the last thread reply when opening the thread index,
  show in list and update with message bus
2023-05-29 09:11:55 +02:00
Joffrey JAFFEUX
0645f3628c
UI: minor spacing adjustment in message details (#21761) 2023-05-26 09:16:27 +02:00
Martin Brennan
b6c5a2da08
FEATURE: Initial chat thread unread indicators (#21694)
This commit adds the thread index and individual thread
in the index list unread indicators, and wires up the message
bus events to mark the threads as read/unread when:

1. People send a new message in the thread
2. The user marks a thread as read

There are several hacky parts and TODOs to cover before
this is more functional:

1. We need to flesh out the thread scrolling and message
   visibility behaviour. Currently if you scroll to the end
   of the thread it will just mark the whole thread read
   unconditionally.
2. We need to send down the thread current user membership
   along with the last read message ID to the client and
   update that with read state.
3. We need to handle the sidebar unread dot for when threads
   are unread in the channel and clear it based on when the
   channel was last viewed.
4. We need to show some indicator of thread unreads on the
   thread indicators on original messages.
5. UI improvements to make the experience nicer and more
   like the actual design rather than just placeholders.

But, the basic premise around incrementing/decrementing the
thread overview count and showing which thread is unread
in the list is working as intended.
2023-05-25 09:56:19 +02:00
Kris
5dd89e0b70
UX: iPad footer nav now included in header offset (#21699) 2023-05-23 17:49:19 -04:00
Joffrey JAFFEUX
b8bd3b07ef
DEV: regroups composer button code (#21690)
This commit makes it easier to ensure each button have a similar behavior: hover, disabled, focus...

It also removes some dead code (__inline-button) and fixes a bug where the emoji button didnt have the right un-focused color (it was more visible than it should.
2023-05-23 10:12:03 +02:00
Joffrey JAFFEUX
c3a3ede8cf
FIX: correct replying indicator padding (#21679) 2023-05-22 17:55:31 +02:00
Joffrey JAFFEUX
bdfd80bfe0
UI: chat composer step 2 (#21641)
- few improved alignments
- displays emoji picker button inline on desktop
- keeps composer focused when focusing dropdown button
- align buttons to bottom when increasing height of textarea
- max-height of textarea is now linked to the height of the screen

Co-authored-by: chapoi <charlie@discourse.org>
2023-05-22 17:00:50 +02:00
Jarek Radosz
f2339d2d5b
DEV: Fix random typos (#21638) 2023-05-18 15:34:46 +02:00
chapoi
7444ab006d
UX: General chat composer tweaks (#21639)
- prevent hover on disabled state
- more contrast between focus and not focus for send button
2023-05-18 15:15:10 +02:00
Joffrey JAFFEUX
ed123c7cec
FIX: adds missing margin on desktop draft message (#21637) 2023-05-18 14:40:37 +02:00
chapoi
ab4e2bed84
UX: minor fix with new composer and reply/edit (#21634) 2023-05-18 12:04:14 +02:00
Joffrey JAFFEUX
44d28cd778
FIX: ensures replying indicator has limited height (#21614) 2023-05-17 18:03:15 +02:00
Joffrey JAFFEUX
df2614c0fb
FIX: ensures chat composer docks to topic composer (#21610) 2023-05-17 11:16:03 +02:00
chapoi
4c476b42b0
UX: chat composer styling on focus (#21603) 2023-05-17 07:10:02 +02:00
Joffrey JAFFEUX
928fab1c4e
FIX: compensate for lack of replying indicator on draft (#21597)
As we don't have the spacing generated by the replying indicator, we need to manually add spacing.
2023-05-16 22:32:07 +02:00
Joffrey JAFFEUX
0881186bfd
UI: removes thread margins (#21595) 2023-05-16 21:28:25 +02:00
Joffrey JAFFEUX
2f73316104
FIX: followups to composer notch adjustments (#21592)
We had safe-area-inset-bottom still set at a wrong place which was causing issues but was also useful to some cases. This commit removes it and ensures the affected cases are corrected.
2023-05-16 20:05:56 +02:00
Joffrey JAFFEUX
4bfd1fd998
FIX: allows notch to have composer bg color (#21589) 2023-05-16 18:46:14 +02:00
Joffrey JAFFEUX
f45d1e6791
UX: implements new composer design (#21588)
This is only the first steps of a redesign

- redesigns the buttons to have a larger hitzone
- generally bigger composer
- clicking near textarea focuses the input
- relies on the fact that safe-area-inset-bottom is set globally and doesn’t need to be set in sub components
2023-05-16 17:17:12 +02:00
Martin Brennan
a2b12b6ace
FIX: Drawer styles for chat thread icon (#21577)
The spacing was not correct for this icon
in the drawer.
2023-05-16 12:49:19 +02:00
Joffrey JAFFEUX
a3522a5937
FIX: chat height fixes (#21561)
- Correctly resize when sending a message on android
- Do not blur active element
- Update direct message creator height following changes
2023-05-15 22:00:03 +02:00
Joffrey JAFFEUX
94b95266ca
FIX: hides global notice on chat (#21557)
It's not necessary and we already hide create-topics-notice and bootstrap mode, and it's also annoying to get correct chat's height.
2023-05-15 17:08:05 +02:00
Joffrey JAFFEUX
4b15ba405c
FIX: moves chat height computation to a mixin (#21555)
This commit also removes safe-area-inset-bottom when keyboard is displayed to avoid having a taller than needed space between composer and replying indicator.
2023-05-15 15:53:18 +02:00
Joffrey JAFFEUX
660a40ca06
FIX: various fixes following channel height changes (#21553)
- apply height on threads list
- apply height on thread
- correctly applies env(safe-area-inset-bottom)
2023-05-15 14:39:11 +02:00
Joffrey JAFFEUX
5ce0697348
FIX: limits max height to viewport on channel only (#21539)
Before this commit chat was applying a fixed height on everything under the `/chat` route. It's only really needed on the channel page with the composer at the bottom of the page.

This commits makes the following changes:
- moves height limitation from `#main-outlet-wrapper` to `.chat-channel`
- makes browse channel page and members list page full height and rely on main document scrollbar
- adds height computation for draft header and direct message creator block to ensure the height is correct when creating a draft channel
- makes chat index full height to rely on the browser scrollbar. As a result the <kbd> + </kbd> button used on mobile to create a direct message as been moved out of `<ChannelsList>` into the chat index template
- sidebar height was relying on chat setting a max height, as a result the height computation of sidebar has been changed to work correctly, especially with an opened keyboard on mobile or ipad
2023-05-15 11:46:33 +02:00
chapoi
74f01b8cbd
UX: hide settings btn when disabled
Also sets lighter border on hover
2023-05-15 07:53:30 +02:00
Martin Brennan
c1cde16966
FIX: Thread reply indicator overflow (#21529)
In some cases the thread reply count indicator
(e.g. 433 replies) would wrap to the next line.
2023-05-12 15:46:22 +02:00
Joffrey JAFFEUX
55c4a550c1
FEATURE: chat-replying indicator for threads (#21485)
This feature adds the replying indicator in threads, it uses the same `/chat-reply/CHANNEL_ID` prefix than the channel composer replying indicator as we don't have specific right on threads ATM (if you can access channel, you can access thread). Thread will however use a presence channel name of the following format: `/chat-reply/CHANNEL_ID/thread/THREAD_ID`

This commit also simplifies the computation of `users` to eventually avoid a race-condition leading to a leak of the indicator in another channel/thread.

<!-- NOTE: All pull requests should have tests (rspec in Ruby, qunit in JavaScript). If your code does not include test coverage, please include an explanation of why it was omitted. -->
2023-05-11 08:02:04 +02:00
Martin Brennan
9b95a65dff
DEV: Fix thread excerpt word break (#21482)
Changing from break-all to break-word because otherwise
longer words (not just links) are split into separ
ate lines.
2023-05-10 17:20:02 +02:00
Joffrey JAFFEUX
b713ae166f
FIX: excerpt overflow and children click events (#21473) 2023-05-10 15:07:43 +02:00
Martin Brennan
91c5658e9b
FIX: Handle deleted original message for thread index (#21470)
Since we have channel message retention which deletes
messages, we can end up with cases where the thread
is still around but the message is deleted. We will
handle the cascade delete in a different commit --
for now we will ensure the thread list lookup handles
this case and doesn't error.
2023-05-10 13:58:15 +02:00
Jan Cernik
cbbaeb55b5
FIX: Don't autojoin users when they have ready-only permissions (#20213)
After this change, in order to join a chat channel, a user needs to be in a group with at least “Reply” permission for the category. If the user only has “See” permission, they are able to preview the channel, but not join it or send messages. The auto-join function also follows this new restriction.

---------

Co-authored-by: Martin Brennan <martin@discourse.org>
2023-05-10 08:45:13 -03:00
Joffrey JAFFEUX
c6b43ce68b
FEATURE: Thread list initial UI (#21412)
This commit adds an initial thread list UI. There are several limitations
with this that will be addressed in future PRs:

* There is no MessageBus reactivity, so e.g. if someone edits the original
   message of the thread it will not be reflected in the list. However if
   the thread title is updated the original message indicator will be updated.
* There is no unread functionality for threads in the list, if new messages
   come into the thread there is no indicator in the UI.
* There is no unread indicator on the actual button to open the thread list.
* No pagination.

In saying that, this is the functionality so far:

* We show a list of the 50 threads that the user has most recently participated
   in (i.e. sent a message) for the channel in descending order.
* Each thread we show a rich excerpt, the title, and the user who is the OM creator.
* The title is editable by staff and by the OM creator.
* Thread indicators show a title. We also replace emojis in the titles.
* Thread list works in the drawer/mobile.
2023-05-10 11:42:32 +02:00
Joffrey JAFFEUX
e935d2bddb
FIX: minor thread changes on mobile (#21457)
- do not render sidepanel resizer as it's not usable on mobile
- removes 1px to the bottom spacing, this spacing won't be necessary once we implement chat-replying-indicator for thread
2023-05-09 22:38:44 +02:00
Joffrey JAFFEUX
cb5e5f3e5b
UX: groups deleted messages (#21411)
Any continuous series of deleted messages will now be grouped into one single expand button.
2023-05-05 17:08:33 +02:00
Joffrey JAFFEUX
187b59d376
UX: implements draft threads (#21361)
This commit implements all the necessary logic to create thread seamlessly. For this it relies on the same logic used for messages and generates a `staged-id`(using the format: `staged-thread-CHANNEL_ID-MESSAGE_ID` which is used to re-conciliate state client sides once the thread has been persisted on the backend.

Part of this change the client side is now always using real thread and channel objects instead of sometimes relying on a flat `threadId` or `channelId`.

This PR also brings three UX changes:
- thread starts from top
- number of buttons on message actions is dependent of the width of the enclosing container
- <kbd>shift + ArrowUp</kbd> will reply to the last message
2023-05-05 08:55:55 +02:00
Joffrey JAFFEUX
e66f640234
FIX: ensures page height is correct on ipad + hub (#21345)
The previous style was not being in each case, this should correctly fix it.
2023-05-02 23:00:16 +02:00
Joffrey JAFFEUX
290bd975c5
FIX: correctly differentiates channel/thread upload inputs (#21301)
Prior to this fix uploads event could end up in the wrong textarea. This will most importantly allow pasting an image in the thread composer.

Also fixes a minor padding issue on thread when uploads are associated to it.
2023-04-28 19:08:55 +02:00
Joffrey JAFFEUX
1403064835
FIX: correctly homogenizes panels min width (#21294)
`.chat-channel` had `300px` min width, when `.chat-drawer` was `250px`, resulting in overflowing channel when in drawer. This commits ensures the limits are always set at `250px`.
2023-04-28 13:05:00 +02:00
Joffrey JAFFEUX
e4029bfab8
FIX: chat height was incorrect on ipad (#21289) 2023-04-28 10:51:23 +02:00
chapoi
f29f131387
UX: composer use BEM + small tweaks to enabled/disabled styling (#21246)
- using BEM notation
- making animation linear instead of default ease
- small tweaks to composer state (disabled/send-disabled/send-enabled)
- fixing bug with disabled composer on mobile
2023-04-28 10:24:49 +02:00
Joffrey JAFFEUX
d381629655
FIX: correct border color of message actions (#21261)
This is a followup of 1372c5c435
2023-04-26 19:42:04 +02:00
Joffrey JAFFEUX
7c9b8c42c1
FIX: allows composer to expand (#21234)
The fixed height was preventing the underlying textarea to expand (up to 125px height) when adding new lines with shift + enter
2023-04-25 11:00:18 +02:00
Joffrey JAFFEUX
bf886662df
UX: improves composer and thread panel (#21210)
This pull request is a full overhaul of the chat-composer and contains various improvements to the thread panel. They have been grouped in the same PR as lots of improvements/fixes to the thread panel needed an improved composer. This is meant as a first step.

### New features included in this PR

- A resizable side panel
- A clear dropzone area for uploads
- A simplified design for image uploads, this is only a first step towards more redesign of this area in the future

### Notable fixes in this PR

- Correct placeholder in thread panel
- Allows to edit the last message of a thread with arrow up
- Correctly focus composer when replying to a message
- The reply indicator is added instantly in the channel when starting a thread
- Prevents a large variety of bug where the composer could bug and prevent sending message or would clear your input while it has content

### Technical notes

To achieve this PR, three important changes have been made:

- `<ChatComposer>` has been fully rewritten and is now a glimmer component
- The chat composer now takes a `ChatMessage` as input which can directly be used in other operations, it simplifies a lot of logic as we are always working a with a `ChatMessage`
- `TextareaInteractor` has been created to wrap the existing `TextareaTextManipulation` mixin, it will make future migrations easier and allow us to have a less polluted `<ChatComposer>`

Note ".chat-live-pane" has been renamed ".chat-channel"

Design for upload dropzone is from @chapoi
2023-04-25 10:23:03 +02:00
chapoi
ba2adc7793
UX: chat thread hover (#21181)
* UX: switch standard message hover to new hover colour var

* UX: chat thread indication minor design changes
2023-04-20 16:32:21 +02:00
Martin Brennan
525d23e0e0
FIX: Revert "DEV: Add overflow-x: hidden to chat message containers (#21030)" (#21178)
This reverts commit 768851920e.

This was causing issues with the local date popup, cutting off
the top of it, there is no way to overrule an overflow:hidden
on the parent. Not z-index related.
2023-04-20 03:01:48 +02:00
chapoi
c57f423083
UX: remove new message element from chatpane (#21143)
* UX: remove new message element

* Update chat-scroll-to-bottom-arrow.hbs

* Linting

---------

Co-authored-by: Joffrey JAFFEUX <j.jaffeux@gmail.com>
2023-04-19 01:54:15 +02:00
chapoi
4b02fa7082
UX: slight design changes to chat timestamp (#21144) 2023-04-19 01:54:02 +02:00
chapoi
b8583f274d
UX: prevent overflow in description (#21124) 2023-04-18 04:20:25 +02:00
chapoi
9e269f993b
FIX: overflow of channel title in preview card (#21112) 2023-04-17 15:05:59 +02:00
Martin Brennan
bd5c5c4b5f
FEATURE: Reacting to MessageBus in chat thread panel (#21070)
This commit introduces a ChatChannelPaneSubscriptionsManager
and a ChatChannelThreadPaneSubscriptionsManager that inherits
from the first service that handle MessageBus subscriptions
for the main channel and the thread panel respectively.

This necessitated a change to Chat::Publisher to be able to
send MessageBus messages to multiple channels based on whether
a message was an OM for a thread, a thread reply, or a regular
channel message.

An initial change to update the thread indicator with new replies
has been done too, but that will be improved in future as we have
more data to update on the indicators.

Still remaining is to fully move over the handleSentMessage
functionality which includes scrolling and new message indicator
things.

Co-authored-by: Joffrey JAFFEUX <j.jaffeux@gmail.com>
2023-04-13 14:45:50 +02:00
Joffrey JAFFEUX
18c81958e5
UX: various tweaks on thread (#21083)
- Back button in drawer will bring you back to channel
- Larger font for thread indicator
- Prevents screen flashing due to clearing messages when they were already loaded
- Fixes a bug where did-update params were inverted causing an error when expanding/collapsing drawer
2023-04-13 10:08:12 +02:00
Martin Brennan
584a17c948
FEATURE: Initial chat thread indicator and disabling echo mode in channels (#21047)
This commit introduces a new thread indicator for channels with `threading_enabled`
set to true and the `enable_exp` site setting set to true. In addition, in the main channel
stream we now hide all messages that are linked to threads except for the original message,
disabling the concept of an "echo mode" for now, we may revisit this in future. We also
remove the jigsaw puzzle "Open Thread" button for message actions, since the thread
indicator can just be used instead.

This also stops the `Chat::Publisher` from sending any messages related to chat
messages that are linked to a thread, unless that chat message is the OM of the
thread. A subsequent PR will link up all MessageBus events within the thread panel,
and for the message indicators.

Another subsequent PR will add the excerpt of the latest message in each thread,
as well as the avatars of the users messaging in the thread.

Co-authored-by: Joffrey JAFFEUX <j.jaffeux@gmail.com>
2023-04-12 11:09:06 +10:00
Joffrey JAFFEUX
f55266e1ca
UX: chat mobile tweaks (#21041)
- rounded active style for messages
- better active state on chat message actions rows
- ensures long press on a message is not selecting text
- slightly improved messages actions animation and background fading
- ensures chat emoji picker is not cutoff on right side
- removes old legacy code related to hovered message
2023-04-11 09:03:12 +02:00
Joffrey JAFFEUX
c7b49a14c7
Chat/drawer ux tweaks (#21032)
- clicking empty area on the header will toggle collapse/expand it
- applies a background on hover of the channel title
- active state for small buttons
- the back button now has the correct icon color when hovered
- adds missing focus state for heade buttons icons
2023-04-10 07:43:11 +02:00
Jan Cernik
768851920e
DEV: Add overflow-x: hidden to chat message containers (#21030) 2023-04-08 13:37:13 -03:00
Jan Cernik
a6cba32e57
FIX: Resize chat collapser when using small width drawer (#21017) 2023-04-08 10:43:17 -03:00
Joffrey JAFFEUX
720cf24659
FIX: shows a message as hovered when hovering actions (#21026)
When hovering the chat message actions we are technically not hovering the message anymore, which was removing the background and is slightly unexpected. This commit ensures we keep this background until closing the message actions.
2023-04-07 20:29:33 +02:00
Martin Brennan
ea548292bc
DEV: Refactoring chat message actions for ChatMessage component usage in thread panel (#20756)
This commit is a major overhaul of how chat message actions work, to make it so they are reusable between the main chat channel and the chat thread panel, as well as many improvements and fixes for the thread panel.

There are now several new classes and concepts:

* ChatMessageInteractor -  This is initialized from the ChatMessage, ChatMessageActionsDesktop, and ChatMessageActionsMobile components. This handles permissions about what actions can be done for each
message based on the context (thread or channel), handles the actions themselves (e.g. copyLink, delete, edit),
and interacts with the pane of the current context to modify the UI
* ChatChannelThreadPane and ChatChannelPane services - This represents the UI context which contains the
messages, and are mostly used for state management for things like message selection.
* ChatChannelThreadComposer and ChatChannelComposer - This handles interaction between the pane, the
message actions, and the composer, dealing with reply and edit message state.
* Scrolling logic for the messages has now been moved to a helper so it can be shared between the main channel pane and the thread pane
* Various improvements with the emoji picker on both mobile and desktop. The DOM node of each component is now located outside of the message which prevents a large range of issues.

The thread panel now also works in the chat drawer, and the thread messages have less
actions than the main panel, since some do not make sense there (e.g. moving messages to
a different channel). The thread panel title, excerpt, and message sender have also been removed
for now to save space.

This gives us a solid base to keep expanding on and fixing up threads. Subsequent PRs will
make the thread MessageBus subscriptions work and disable echo mode
for the initial release of threads.

Co-authored-by: Joffrey JAFFEUX <j.jaffeux@gmail.com>
2023-04-06 15:19:52 +02:00
chapoi
6e2fd7a451
UX: Chat channel title overflow ellipsis fixes (#20956)
* UX: add correct class

* UX: prioritise name over user messages when truncating

* UX: add missing overflows to enable ellipsis
2023-04-04 12:44:36 +02:00
Joffrey JAFFEUX
1219f41c68
UX: multiple minor improvements (#20917)
- Raises the scroll distance to 250px instead of 100px to show the arrow down button
- Always have a margin on drawer when showing channel list, removes this margin when the scrollbar is apparent
- Makes all scrollbar used in chat look the same through the chat-scrollbar mixin
- Ensures hover state is not persistent on channel row in mobile
- Makes the channel row full width on mobile
2023-04-03 10:46:38 +02:00
Jan Cernik
afe3e36363
DEV: Remove lazy-yt and replace with lazy-videos (#20722)
- Refactors the old plugin to remove jquery usage
- Adds support for Vimeo videos (default on) and Tiktok (experimental and default off)
2023-03-29 11:54:25 -04:00
Kris
147941a5d7
UX: update chat icon to d-chat (#20744) 2023-03-21 10:40:42 -04:00
Jarek Radosz
38fdd842f5
UX: Fix chat separator alignment (#20669)
Also: work around 1px svg shift in scroll-to-bottom button
2023-03-18 18:03:54 +01:00
Joffrey JAFFEUX
12a18d4d55
DEV: properly namespace chat (#20690)
This commit main goal was to comply with Zeitwerk and properly rely on autoloading. To achieve this, most resources have been namespaced under the `Chat` module.

- Given all models are now namespaced with `Chat::` and would change the stored types in DB when using polymorphism or STI (single table inheritance), this commit uses various Rails methods to ensure proper class is loaded and the stored name in DB is unchanged, eg: `Chat::Message` model will be stored as `"ChatMessage"`, and `"ChatMessage"` will correctly load `Chat::Message` model.
- Jobs are now using constants only, eg: `Jobs::Chat::Foo` and should only be enqueued this way

Notes:
- This commit also used this opportunity to limit the number of registered css files in plugin.rb
- `discourse_dev` support has been removed within this commit and will be reintroduced later

<!-- NOTE: All pull requests should have tests (rspec in Ruby, qunit in JavaScript). If your code does not include test coverage, please include an explanation of why it was omitted. -->
2023-03-17 14:24:38 +01:00
Joffrey JAFFEUX
73be7b3dd8
FIX: improves unread state precision (#20615)
- Will consider a message read only one the bottom of the message has been read
- Will allow to mark a message bigger than the view port as read
- Code should be more performant as the scroll is doing less (albeit more often)
- Gives us a very precise scroll state. Problem with throttling scroll is that you could end up never getting the even where scrollTop is at 0, opening a whole range of edge cases to handle
2023-03-09 19:06:33 +01:00
Jarek Radosz
3c4bfb6a9f
UX: Tweak last-visit/date separators (#20601)
1. Restore the left margin on both (which reflects the right margin of the scroll bar space)
2. Fix the center alignment of scroll-to-bottom icon
3. Fix the spacing of the `-` character between a date label and "last visit" label
4. Fix the incorrect display the border on date label when at the bottom of viewport
2023-03-09 13:44:02 +01:00
Joffrey JAFFEUX
f76ea32246
FIX: broken sticky date on firefox (#20594) 2023-03-08 22:23:24 +01:00
Jarek Radosz
c25d79168b
UX: Fix chat-reply overflow (#20592) 2023-03-08 21:12:49 +01:00
Joffrey JAFFEUX
b5e736504a
PERF: applies optimisations on chat-live pane (#20532)
- group writes when computing separators positions
- shows skeleton only on initial load
- forces date separator to be pinned when first message to prevent a pinned - not pinned - pinned sequence when loading more in past
- relies on `message.visible` property instead of checking `isElementInViewport`
- attempts to load next/prev messages earlier
- do not scroll to on fetch more
- hides `last visit` text while pinned
2023-03-06 16:42:11 +01:00
chapoi
28f8bdf91d
UX: remove visual chat msg staging effect (#20542) 2023-03-06 10:07:46 +01:00
Joffrey JAFFEUX
5d6e8fdff0
UX: makes last visit stand out less (#20524) 2023-03-03 15:55:22 +01:00
Joffrey JAFFEUX
6b0aeced7e
DEV: rework the chat-live-pane (#20519)
This PR is introducing glimmer usage in the chat-live-pane, for components but also for models. RestModel usage has been dropped in favor of native classes.

Other changes/additions in this PR:

sticky dates, scrolling will now keep the date separator of the current section at the top of the screen
better unread management, marking a channel as unread will correctly mark the correct message and not mark the whole channel as read. Tracking state will also now correctly return unread count and unread mentions.
adds an animation on bottom arrow
better scrolling behavior, we should now always correctly keep the scroll position while loading more
reactions are now more reactive, and will update their tooltip without needed to close/reopen it
skeleton has been improved with placeholder images and reactions
when making a reaction on the desktop message actions, the menu won't move anymore
simplify logic and stop maintaining a list of unloaded messages
2023-03-03 13:09:25 +01:00
Joffrey JAFFEUX
435761ef58
Revert "DEV: rework the chat-live-pane (#20511)" (#20514)
This reverts commit 10e1831139.
2023-03-02 20:20:39 +01:00
Joffrey JAFFEUX
10e1831139
DEV: rework the chat-live-pane (#20511)
This PR is introducing glimmer usage in the chat-live-pane, for components but also for models. RestModel usage has been dropped in favor of native classes.

Other changes/additions in this PR:

- sticky dates, scrolling will now keep the date separator of the current section at the top of the screen
- better unread management, marking a channel as unread will correctly mark the correct message and not mark the whole channel as read. Tracking state will also now correctly return unread count and unread mentions.
- adds an animation on bottom arrow
- better scrolling behavior, we should now always correctly keep the scroll position while loading more
- reactions are now more reactive, and will update their tooltip without needed to close/reopen it
- skeleton has been improved with placeholder images and reactions
- when making a reaction on the desktop message actions, the menu won't move anymore
- simplify logic and stop maintaining a list of unloaded messages
2023-03-02 19:46:03 +01:00
Joffrey JAFFEUX
31480bde92
Revert "DEV: rework the chat-live-pane" (#20510)
This reverts commit 67c0498f64.
2023-03-02 16:59:11 +01:00
Joffrey JAFFEUX
67c0498f64
DEV: rework the chat-live-pane
This PR is introducing glimmer usage in the chat-live-pane, for components but also for models. RestModel usage has been dropped in favor of native classes.

Other changes/additions in this PR:

- sticky dates, scrolling will now keep the date separator of the current section at the top of the screen
- better unread management, marking a channel as unread will correctly mark the correct message and not mark the whole channel as read. Tracking state will also now correctly return unread count and unread mentions.
- adds an animation on bottom arrow
- better scrolling behavior, we should now always correctly keep the scroll position while loading more
- reactions are now more reactive, and will update their tooltip without needed to close/reopen it
- skeleton has been improved with placeholder images and reactions
- when making a reaction on the desktop message actions, the menu won't move anymore
- simplify logic and stop maintaining a list of unloaded messages
2023-03-02 16:34:25 +01:00
Jarek Radosz
c81d4f60af
UX: Fix large onebox avatars in img chat messages (#20469)
When you included an image and a full-line (github) onebox in a single message the user avatar in the inbox would be incorrectly embiggened.
2023-02-27 23:03:02 +01:00
chapoi
87de3c2319
UX: highlight vars updates (#20346)
* UX: replace highlight vars in popup menu

* UX: replace highlight vars in autcomplete

* UX: replace highlight vars in menu-panel

* UX: update style guide

* UX: bulk replace highlight vars in various small appearances
2023-02-21 10:15:49 +01:00
chapoi
8c80d330fa
UX: apply skeleton animation on content only (#20376) 2023-02-20 18:54:00 +01:00
Keegan George
9c29d688e7
FEATURE: Add word count and indicator when exceeded max (#19367)
**This PR creates a new core reusable component wraps a character counter around any input.**

The component accepts the arguments: `max` (the maximum character limit), `value` (the value of text to be monitored).

It can be used for example, like so:
```hbs
  <CharCounter @max="50" @value={{this.charCounterContent}}>
    <textarea
      placeholder={{i18n "styleguide.sections.char_counter.placeholder"}}
      {{on "input" (action (mut this.charCounterContent) value="target.value")}}
      class="styleguide--char-counter"></textarea>
  </CharCounter>
```

**This PR also:**
1. Applies this component to the chat plugins edit channel's *Edit Description** modal, thereby replacing the simple text area which provided no visual indication when text exceeded the max allowed characters.
2. Adds an example to the `/styleguide` route
2023-02-20 12:06:43 +01:00
Joffrey JAFFEUX
e797d2082b
UX: contains overscroll in channels list (#20353) 2023-02-18 11:00:02 +01:00
Jan Cernik
f48e25b215
FIX: Chat member user card rendered out of view (#20332) 2023-02-17 10:14:00 -03:00
Joffrey JAFFEUX
a0b83dac86
UX: prevents scroll in chat to propagate to parents (#20347)
Prior to this fix, scrolling in the drawer for example, would also scroll the full page when reaching bottom of available messages.
2023-02-17 13:39:51 +01:00
chapoi
8465f53a35
UX: userstatus limit handling in UI (#20343)
* UX: handle long userstatus in menupanel

* UX: remove margin on userstatus emoji

* UX: change emoji sise of user status in DM creator

* FIX: user status overflow on chat index
2023-02-17 06:54:56 +01:00
Joffrey JAFFEUX
5ebf016a3f
FIX: removes uneeded footer-nav-height subtraction (#20336)
This was incorrectly added.
2023-02-16 18:25:36 +01:00
Joffrey JAFFEUX
7391f8e077
FIX: correctly account for ipad footer nav height (#20334)
This code also removes duplicated code in chat which doesn’t seem necessary anymore.
2023-02-16 16:49:17 +01:00
chapoi
33ee46d62b
UX: update chat draft icon colour (#20326) 2023-02-16 09:16:07 +01:00
Martin Brennan
c767a38086
FIX: Overflowing chat content in main-chat-outlet grid (#20301)
Follow up to 82b4a53d29

On mobile, we just need to add `min-width: 0` to
`chat-live-pane` so it will not overflow the grid
defined in `main-chat-outlet.chat-view`.

The overflow could be triggered by:

1. Replying on mobile to a really long chat message
2. Uploading > 2 files

Both of these situations are fixed.
2023-02-15 12:48:18 +10:00
Joffrey JAFFEUX
82b4a53d29
FIX: reverts part of thread css (#20286)
This css was causing the view on mobile to take more space than the available width. This was particularly visible with uploads due to a bug preventing the overflow, this is also fixed.
2023-02-14 15:38:26 +01:00
Martin Brennan
07ab20131a
FEATURE: Chat side panel with threads initial skeleton (#20209)
This commit introduces the skeleton of the chat thread UI. The
structure of the components looks like this. Its done this way
so the side panel can be used for other things as well if we wish,
not just for threads:

```
.main-chat-outlet
   <ChatLivePane />
   <ChatSidePanel>
     <-- rendered with {{outlet}} -->
     <ChatThread />
   </ChatSidePanel>
```

Later on the `ChatThreadList` will be rendered here as well.
Now, when you go to a channel you can open a thread by clicking
on either the Open Thread message action button or by clicking on
the reply indicator. This will take you to a route like `chat/c/:slug/:channelId/t/:threadId`.
This works on mobile as well.

This commit includes basic serializers and routes for threads,
as well as a new `ChatThreadsManager` service in JS that caches
threads for a channel the same way the channel threads manager does.

The chat messages inside the thread are intentionally left out
until a later PR.

**NOTE: These changes are gated behind the site setting enable_experimental_chat_threaded_discussions
and the threading_enabled boolean on a ChatChannel**
2023-02-14 11:38:41 +10:00
chapoi
d33d98f9c1
FIX: changed classname for YT images (#20212) 2023-02-08 05:57:36 +01:00
Joffrey JAFFEUX
a04201ae01
UX: implements a random and auto generated skeleton (#20202)
UI is not modified much besides removing the border-bottom, and using only message body.

However instead of having a fix template, this is all automatically generated and random, resulting in a more natural experience.
2023-02-07 22:48:10 +01:00
Joffrey JAFFEUX
b755b45029
FIX: apply max-height on the outer container (#20199)
This change allow to correctly work with the topic composer height changing.
2023-02-07 22:00:00 +01:00
Joffrey JAFFEUX
7dcaaec90c
UX: allows drawer to take most of height space (#20197)
Only the header's height and 15px spacing are removed from the height of the viewport.

Previously it was limited to 90vh and there was also a useless property on a child node limiting it to 85vh. We now use only one property.
2023-02-07 19:49:00 +01:00
chapoi
2f8ad17aed
UX: apply same style for highlight mention span (#20176) 2023-02-06 10:56:52 +01:00
Jan Cernik
44df5ee7c8
FIX: Allow keyboard navigation when searching emojis in chat (#20157) 2023-02-03 11:36:45 -03:00
Joffrey JAFFEUX
d5024d96f1
FEATURE: resizeable chat drawer (#20160)
This commit implements a requested feature: resizing the chat drawer.

The user can now adjust the drawer size to their liking, and the new size will be stored in localstorage so that it persists across refreshes. In addition to this feature, a bug was fixed where the --composer-right margin was not being correctly computed. This bug could have resulted in incorrectly positioned drawer when the composer was expanded.

Note that it includes support for RTL.
2023-02-03 15:11:12 +01:00
chapoi
565b5c4b18
UX: remove chat-specific font declaration (#20096) 2023-01-31 11:00:33 +01:00
chapoi
d0780eacdc
FIX: preserves avatar size inside onebox (#20066)
* UX: Wrap chat one-box avatars

* UX: restrict onebox image css to non-avatar
2023-01-30 13:59:25 +01:00
Martin Brennan
db5ad34508
FEATURE: Allow editing channel slug (#19948)
This commit introduces the ability to edit the channel
slug from the About tab for the chat channel when the user
is admin. Similar to the create channel modal functionality
introduced in 641e94f, if
the slug is left empty then we autogenerate a slug based
on the channel name, and if the user just changes the slug
manually we use that instead.

We do not do any link remapping or anything else of the
sort, when the category slug is changed that does not happen
either.
2023-01-30 13:18:34 +10:00
Kris
e3a48d2681
FIX: data-popper-reference-hidden too broad (#19937) 2023-01-23 14:28:48 -05:00
Martin Brennan
641e94fc3c
FEATURE: Allow changing slug on create channel (#19928)
This commit allows us to set the channel slug when creating new chat
channels. As well as this, it introduces a new `SlugsController` which can
generate a slug using `Slug.for` and a name string for input. We call this
after the user finishes typing the channel name (debounced) and fill in
the autogenerated slug in the background, and update the slug input
placeholder.

This autogenerated slug is used by default, but if the user writes anything
else in the input it will be used instead.
2023-01-23 14:48:33 +10:00