Commit Graph

149 Commits

Author SHA1 Message Date
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