Commit Graph

21 Commits

Author SHA1 Message Date
chapoi
cdf8eb8055
UX: update minwidth to chat sidepanel + better title word-break fn (#29954) 2024-11-27 06:04:04 +01:00
chapoi
3a11e70b3d
UX: chat drawer hover effect width calc fix (#29910) 2024-11-26 03:25:12 +01:00
Joffrey JAFFEUX
66409fa8b4
UX: improved collapsed drawer state/interactions (#29850)
- Clicking the channel title of a collapsed drawer will only open the drawer, and not open settings
- Remove the back button when the drawer is collapsed
- Uses same icon for toggling on chat that composer
- add max-width to minimised drawer + add hover effect
---------

Co-authored-by: chapoi <101828855+chapoi@users.noreply.github.com>
2024-11-25 03:39:03 +01:00
David Battersby
139e21e37d
UX: fix chat title margin on drawer and side panel (#26171)
Fixes alignment issues within the drawer mode and chat sidebar panel on desktop.
2024-03-14 13:41:42 +08:00
Joffrey JAFFEUX
76953cc356
FEATURE: allows to force a thread (#25987)
Forcing a thread will work even in channel which don't have `threading_enabled` or in direct message channels.

For now this feature is only available through the `ChatSDK`:

```ruby
ChatSDK::Message.create(in_reply_to_id: 1, guardian: guardian, raw: "foo bar baz", channel_id: 2, force_thread: true)
```
2024-03-06 12:03:42 +01:00
Kris
8c22831672
UX: update appropriate btn-flat instances to btn-transparent (#25945)
With the adjustments of `btn-transparent` in https://github.com/discourse/discourse/pull/24666, there are more buttons that could use this class instead of `btn-flat`. This mostly relates to `x` close buttons, but also includes composer and chat toggles.

The primary difference between these styles is that `btn-transparent` never has a background, where `btn-flat` may have a hover or focus background.
2024-02-29 11:47:07 +01:00
chapoi
292685d3de
UX: Chat browse redesign (#25698)
* UX: fix search input placeholder cutoff

* UX: use transparent button for new-channel

* UX: remove settings link

* UX: removed joined tag

* UX: increase lock icon size

* UX: use grid for channel card

* UX: chat-channel-card styling + cleanup

* UX: dont space about tabs on mobile

* specs

* PR feedback

Co-authored-by: Joffrey JAFFEUX <j.jaffeux@gmail.com>

* PR feedback > translation

* Remove import

* UX: update copy

---------

Co-authored-by: Joffrey JAFFEUX <j.jaffeux@gmail.com>
2024-02-15 18:00:22 +01:00
Jan Cernik
ab326d10d8
FIX: Make long thread titles readable (#25456)
When reaching the top of a thread, the full thread title will be displayed if it was too long to fit.
It works in mobile, drawer mode, and fullscreen.
---------

Co-authored-by: Joffrey JAFFEUX <j.jaffeux@gmail.com>
2024-01-30 14:18:00 +01:00
David Battersby
4512e5652f
FEATURE: Mobile Chat Footer Redesign (#25161)
This update adds three tabs to the bottom of the chat overlay to make it easier for users to navigate chat on mobile.

As a result of this change:

- Direct Messages are now shown separately from public channels on mobile
- My Threads has now moved from the channel list to it's own tab on mobile
- My Threads can still be accessed on desktop via the sidebar and within the drawer channel list
- Chat back button has been updated to navigate to the correct tab (for both channels and threads)

Some special cases:

- If DMs are not used then the tab is not rendered
- If the user has no threads then the tab is not rendered
- If both the tabs for DMs and Threads aren't available then the whole footer will not be rendered
- Chat footer is only shown on the listing pages (DMs, Channels, My Threads)

---------

Co-authored-by: chapoi <101828855+chapoi@users.noreply.github.com>
Co-authored-by: Joffrey JAFFEUX <j.jaffeux@gmail.com>
2024-01-16 14:29:33 +08:00
chapoi
b063d92ad1
UX: chat header size and alignments (#25239)
This commit:

- increased the size of chat-header-offset from 46px to 56px on mobile
- tweaked navbar padding
- Increased the gap between back button and title; this means no more perfect alignment, but I think that's perfectly fine and a fair trade off for an easier click target for the back button without fear of hitting the title
2024-01-12 14:27:44 +01:00
chapoi
22d4fbf59c
UX: chat navbar > alignments part 2 (#24985)
* UX: chat navbar > alignments part 2

* Change copy to be consistent My threads

* Dont show back button on full page desktop
2023-12-20 16:24:10 +01:00
Alan Guo Xiang Tan
cdd66b24ec
Revert "UX: typo (#24971)" (#24979)
This reverts commit b8a36dd870.

Commit is breaking the build
2023-12-20 13:20:34 +08:00
chapoi
63b217c2bc
UX: chat navbar header specific case (#24972) 2023-12-19 16:37:16 +01:00
chapoi
b8a36dd870
UX: typo (#24971) 2023-12-19 16:26:47 +01:00
chapoi
558c709fef
UX: align navbar and composer uploads (#24970) 2023-12-19 15:41:51 +01:00
chapoi
9f4fbd0279
UX: use same colour for thread icon as for indicator when unread (#24967) 2023-12-19 12:09:09 +01:00
Joffrey JAFFEUX
53b96638c5
DEV: implements <Chat::Navbar /> (#24917)
This new navbar component is used for every navbar in chat, full page or drawer, and any screen.

This commit also uses this opportunity to correctly decouple drawer-routes from full page routes. This will avoid having this kind of properties in components: `@includeHeader={{false}}`. The header is now defined in the parent template using a navbar. Each route has now its own template wrapped in a div of the name of the route, eg: `<div class="c-routes-threads">..</div>`.

The navbar API:

```gjs
<Navbar as |navbar|>
 <navbar.BackButton />
 <navbar.Title @title="Foo" />
 <navbar.ChannelTitle @channel={{@channel}} />
 <navbar.Actions as |action|>
   <action.CloseThreadButton />
 </navbar.Actions>
</navbar>
```

The full list of components is listed in `plugins/chat/assets/javascripts/discourse/components/navbar/index.gjs` and `plugins/chat/assets/javascripts/discourse/components/navbar/actions.gjs`.

Visually the header is not changing much, only in drawer mode the background has been removed.

This commit also introduces a `<List />` component to facilitate rendering lists in chat plugin.
2023-12-18 17:49:58 +01:00
Penar Musaraj
8a4ab79be2
DEV: Improve header offset calculation (#24910) 2023-12-15 15:29:17 +01:00
Joffrey JAFFEUX
875966cc9e
FIX: ensures border and shadow of header is visible (#24847) 2023-12-12 14:18:36 +01:00
Joffrey JAFFEUX
fca67117ee
FIX: incorrect spacing with my threads on ios (#24843)
- sticky doesn't work well with overflow: hidden parents. These overflows were used to hide other issues which shouldn't exist anyways. If it causes issues we should fix the root cause.

- our `--header-offset` is changing a lot on safari while scrolling, sometimes with very unexpected value like: negative or very high value, which causes the navbar to appear at unexpected positions for few ms, this commit is using the value of the header on insert and not changing it after, it shouldn't cause any issue.
2023-12-12 11:32:36 +01:00
Joffrey JAFFEUX
09277bc543
FEATURE: my threads page (#24771)
This commit adds a new "My threads" link in sidebar and drawer. This link will open the "/chat/threads" page which contains all threads where the current user is a member. It's ordered by activity (unread and then last message created).

Moreover, the threads list of a channel page is now showing every threads of a channel, and not just the ones where you are a member.
2023-12-11 07:38:07 +01:00