Commit Graph

9 Commits

Author SHA1 Message Date
David Taylor
66de6a43a8
FIX: Ensure do-not-disturb icon updates correctly (#28253)
`currentUser.do_not_disturb_until` is a string, so we need to parse it before comparing to the current timestamp
2024-08-06 19:13:13 +01:00
David Taylor
c333e9d6e6
FIX: Improve topic/header integration when navigating away (#28040)
- Ensure main title is set as 'not visible' when removed from DOM

- `deactivate` -> `willTransition` to ensure proper behavior when navigating between multiple topics

Followup to bdec564d14
2024-07-23 14:57:15 +01:00
David Taylor
bdec564d14
DEV: Refactor header topic-info handling (#27989)
- Move topic-title on-screen detection to intersection-observer (via new modifier), and add a boolean to header service which indicates whether it's on-screen

- Move scroll-direction from Mixin to dedicated service. Teach it to pause scroll monitoring while transitions are in progress, to avoid reporting false changes in scroll direction. Also resets to a 'neutral' state after each navigation, which indicates the the user has not yet scrolled

- When entering a topic view, notify the header service which post is being targeted. It can then make an educated guess about whether the topic title is likely to be in-view

- Update header service `topicInfoVisible` to be a declarative getter, based on the three refactored sources of truth mentioned above

- Update legacy widget header to use the header service for topic info

All of these changes mean that the header no longer 'flickers' when navigating into topics on mobile. As well as the improved UX, this should also improve our Cumulative Layout Shift (CLS) web vital metrics.
2024-07-23 10:24:44 +01:00
Kris
0d4492c7b7
A11Y: Close header dropdown menus on focusout (#27901)
Co-authored-by: Joffrey JAFFEUX <j.jaffeux@gmail.com>
2024-07-16 09:11:26 -04:00
Martin Brennan
0434112aa7
UX: Streamline reset password page (#27341)
This commit includes various UX improvements to the reset
password page:

* Introduce a `hide-application-header-buttons` helper to do the following:
  * Hide Sign Up and Log In buttons, they are not necessary on this flow
  * Hide the sidebar, it is a distraction on this flow
* Improve messaging when a 2FA confirmation is required first
* Improve display of server-side ActiveRecord model validation errors
  in password form, e.g. instead of "is the same as your current password"
  we do "The password is the same as your current password"
* Move password tip to next line below input and move caps lock hint
  inline with Show/Hide password toggle
* Add system specs for 2FA flow on reset password page
* Fixes a computed property conflict issue on the password reset
   page when toggling 2FA methods
2024-06-05 15:22:59 +10:00
Kelv
2df4f38a97
FIX: restore docked body document from glimmer site header (#27003) 2024-05-14 00:12:38 +08:00
David Taylor
3733db866c
DEV: Introduce default 'auto' mode for glimmer header (#26467)
This will automatically enable the glimmer header when all installed themes/plugins are ready. This replaces the old group-based site setting.

In 'auto' mode, we check for calls to deprecated APIs (e.g. decorateWidget) which affect the old header. If any are present, we stick to the old header implementation and print a message to the console alongside the normal deprecation messages.

To override this automatic behavior, a new `glimmer_header_mode` site setting can be set to 'disabled' or 'enabled'.

This change also means that our test suite is running with the glimmer header. This unveiled a couple of small issues (e.g. some incorrect `aria-*` and `alt` text) which are now fixed. A number of selectors had to be updated to ensure the tests were clicking the actual `<button>` elements rather than the surrounding `<li>` elements.
2024-04-10 14:35:54 +01:00
Isaac Janzen
c7b2369bfa
FIX: In topic search for glimmer header (#26040)
- Fix cmd + f keyboard shortcut that opens up the search menu or browser search
2024-03-07 11:14:43 -07:00
Isaac Janzen
21f23cc032
DEV: Convert header to glimmer (#25214)
Here is a breakdown of the changes that will be implemented in this PR.

# Widgets -> Glimmer

Obviously, the intention of the todo here is to convert the header from widgets to glimmer. This PR splits the respective widgets as so:

### widgets/site-header.js
```mermaid height=200
flowchart TB
    A[widgets/site-header.js] 
    A-->B[components/glimmer-site-header.gjs]
```

### widgets/header.js and children
```mermaid height=200
flowchart TB
    A[widgets/header.js] 
    A-->B[components/glimmer-header.gjs]
    B-->C[glimmer-header/contents.gjs]
    C-->D[./auth-buttons.gjs]
    C-->E[./icons.gjs]
    C-->F[./user-menu-wrapper.gjs]
    C-->G[./hamburger-dropdown-wrapper.gjs]
    C-->H[./user-menu-wrapper.gjs]
    C-->I[./sidebar-toggle.gjs]
    C-->J[./topic/info.gjs]
```

There are additional components rendered within the `glimmer-header/*` components, but I will leave those out for now. From this view you can see that we split apart the logic of `widgets/header.js` into 10+ components. Breaking apart these mega files has many benefits (readability, etc).

# Services

I have introduced a [header](cdb42caa04/app/assets/javascripts/discourse/app/services/header.js) service. This simplifies how we pass around data in the header, as well as fixes a bug we have with "swiping" menu panels.


# Modifiers
Added a [close-on-click-outside](cdb42caa04/app/assets/javascripts/discourse/app/modifiers/close-on-click-outside.js) modifier that is built upon the [close-on-click-outside modifier](https://github.com/discourse/discourse/blob/main/app/assets/javascripts/float-kit/addon/modifiers/close-on-click-outside.js) that @jjaffeux built for float-kit. I think we could replace float-kit's implementation with mine and have it in a centralized location as they are extremely similar.

# Tests
Rewrote the existing header tests ([1](https://github.com/discourse/discourse/blob/main/app/assets/javascripts/discourse/tests/integration/components/widgets/header-test.js), [2](https://github.com/discourse/discourse/blob/main/app/assets/javascripts/discourse/tests/integration/components/site-header-test.js)) as system tests. 

# Other
- Converted `widgets/user-status-bubble.js` to a gjs component
- Converted `widgets/sidebar-toggle.js` to a gjs component
- Converted `topicFeaturedLinkNode()` to a gjs component
- Deprecated the [docking mixin](https://github.com/discourse/discourse/blob/main/app/assets/javascripts/discourse/app/mixins/docking.js)
2024-02-23 11:08:15 -07:00