Commit graph

4893 commits

Author SHA1 Message Date
J. Ryan Stinnett
784599d9e9 Add primary reactions to action bar
This adds the primary reactions to the action bar. They act as toggles where you
can only select one from each group at a time.

Note that currently we aren't actually sending the reaction at all. That's left
for a separate task.

Fixes https://github.com/vector-im/riot-web/issues/9576
2019-04-30 18:09:10 +01:00
J. Ryan Stinnett
00ca930d2e Extract actionable content check to helper 2019-04-30 17:51:18 +01:00
J. Ryan Stinnett
6db12f84df
Merge pull request #2936 from jryans/preview-bar-fire
Add important info to new preview bar
2019-04-30 10:20:09 +01:00
J. Ryan Stinnett
b7642b38a7 Show the room avatar for invites
This changes to the room avatar instead of the inviter's avatar.
2019-04-30 09:56:44 +01:00
J. Ryan Stinnett
e71896420e Show only a static inviter name with full MXID
This removes the clickable inviter behaviour, as it was too confusing to reveal
the user info sidebar and also hide the invite. Keeping both on screen would be
okay, but seems a bit too complex to resolve right before RC.

In addition, this adds the full inviter MXID to ensure it's clear who invited
you.
2019-04-30 09:56:44 +01:00
J. Ryan Stinnett
ad6be3cc1b Change invite preview text for DMs
Use more specifc text for when previewing an invite to a direct message room.
2019-04-29 17:48:48 +01:00
J. Ryan Stinnett
338dc602f0 Explicitly mention the room name in all preview bar cases
Adjusts all cases of the room preview bar to mention the room name explicitly
when possible.
2019-04-29 16:34:57 +01:00
J. Ryan Stinnett
739c8c0314 Promote reply button up to message action bar
This moves the reply action out of the existing options menu and up to the
message action bar for easier access.
2019-04-29 15:53:03 +01:00
J. Ryan Stinnett
8ef9fe951d Update styling of message action bar for multiple buttons
This applies the new design for multiple buttons in the message action bar,
paving the way for more things to appear here.

In addition, this changes the existing options button to use the three vertical
dots icon. Some theme colors are also tweaked to align with what they were meant
to be from the unified palette.
2019-04-29 15:20:51 +01:00
J. Ryan Stinnett
ed8bbc7082 Extract message options button to action bar
This adds a new action bar component to hold multiple per-message actions. This
existing options button has moved to this new component, and is currently the
only action.
2019-04-29 15:20:50 +01:00
J. Ryan Stinnett
530c92e03d Rename event edit button to options button
This naming is clearer as it doesn't really edit at all (it shows a context
menu). This should also be less confusing with actual editing when it arrives.
2019-04-29 15:20:50 +01:00
J. Ryan Stinnett
af17829229 Blur active field before submit validation 2019-04-25 14:29:10 +01:00
J. Ryan Stinnett
26f732723e Animate tooltips when hiding as well as showing
This uses the same animation style as on show, but twice as fast.
2019-04-25 14:29:10 +01:00
J. Ryan Stinnett
aec14e64fa Throttle validation in response to user input
This avoids the case of the password complexity progress jumping wildly for
every character you type.
2019-04-25 14:29:10 +01:00
J. Ryan Stinnett
67d7091dcd Password score progress should be full width in tooltip 2019-04-25 14:29:10 +01:00
J. Ryan Stinnett
a20d23daf3 Remove older password length check
Now that we have a fancier password complexity check, remove the older minimum
length to avoid the feeling of two password style guides fighting each other.
2019-04-25 14:29:10 +01:00
J. Ryan Stinnett
4f41161a47 Check password complexity during registration
This adds a password complexity rule during registration to require strong
passwords. This is based on the `zxcvbn` module that we already use for key
backup passphrases.

In addition, this also tweaks validation more generally to allow rules to be
async functions.
2019-04-25 14:29:10 +01:00
J. Ryan Stinnett
008ca3543b Migrate passwords on registration to new validation
In addition to migrating password fields, this also removes the remaining
support for old-style validation in registration now that all checks have been
converted.
2019-04-25 14:29:10 +01:00
J. Ryan Stinnett
aaf745ae2a Migrate phone number on registration to new validation 2019-04-25 14:29:09 +01:00
J. Ryan Stinnett
9064875312 Migrate email on registration to new validation 2019-04-25 14:29:09 +01:00
J. Ryan Stinnett
1cbb4be6f7 Add support for validating more strictly at submit time
When submitting a form, we want to validate more strictly to check for empty
values that might be required. A separate mode is used since we want to ignore
this issue when visiting a field one by one to enter data.

As an example, we convert the pre-existing logic for the username requirement
using this new support.
2019-04-25 14:29:09 +01:00
J. Ryan Stinnett
778697abf1 Use input element's value directly
Since we're keeping the input as a ref anyway, let's use that rather than
requiring the value to be passed to `validate`. This allows others to call
`validate` as well.
2019-04-25 14:29:09 +01:00
J. Ryan Stinnett
5d95c31875 Focus the first invalid field
This adjusts the submission step to focus the first invalid field and redisplay
validation. This also rearranges the older style field error handling on
registration which is slated for removal once we convert all fields to the new
style.
2019-04-25 14:29:09 +01:00
J. Ryan Stinnett
62a01e7a37 Track per-field validity with new-style validation
This updates the registration form to include the new-style validation state
when deciding whether the entire form is valid overall.

In addition, this tweaks the validation helper to take functions instead of
strings for translated text. This allows the validation helper to be create once
per component instead of once every render, which improves performance.
2019-04-25 14:29:09 +01:00
J. Ryan Stinnett
37e09b5569 Add check and x icons for validation feedback
Adds icons from the Feather set with the same color as text. Tweaks validation
item spacing to match the design.
2019-04-25 14:29:09 +01:00
J. Ryan Stinnett
87f13cfe55 Add focus handling to validation
Update the Field component and validation handling to show / hide validation
feedback on focus / blur events.
2019-04-25 14:29:09 +01:00
J. Ryan Stinnett
338d83ab55 Add validation feedback helper
This adds a general validation feedback mechanism for checking input values. An
initial example is wired up for the username input on registration.
2019-04-25 14:29:09 +01:00
J. Ryan Stinnett
37ecf2a623 Remove unused ref from Field component
The `fieldInput` ref is no longer used now that we have controlled components
everywhere.
2019-04-25 14:29:09 +01:00
J. Ryan Stinnett
4784d5e9f2 Also say "Connect ..." on remaining key backup buttons
This updates the remaining buttons shown when a backup exists but is not trusted
so that they all now say "Connect this device to Key Backup" instead of "Use Key
Backup".

This is a follow up to https://github.com/matrix-org/matrix-react-sdk/pull/2917
and was agreed with Riot iOS team
https://github.com/vector-im/riot-ios/pull/2375#issuecomment-485788118.

Fixes https://github.com/vector-im/riot-web/issues/9542
2019-04-24 11:05:27 +01:00
J. Ryan Stinnett
9917bed942
Merge pull request #2883 from YaoiFangirl420/cleanup_message_composer
Cleanup message composer render() method
2019-04-18 10:14:01 +01:00
Bruno Windels
0fbe10a816
Merge pull request #2925 from matrix-org/bwindels/stylepreviewbar
Redesigned room preview bar
2019-04-18 08:50:56 +00:00
Bruno Windels
0a463472b3 update prop types (and fix typo) 2019-04-17 19:05:52 +02:00
Bruno Windels
8e750e18d7 add class for message case for e2e tests 2019-04-17 11:46:04 +02:00
Bruno Windels
22874f62ab Merge branch 'develop' into bwindels/stylepreviewbar 2019-04-17 11:06:21 +02:00
Bruno Windels
1100320351 make non-member inviter name also bold 2019-04-17 11:02:58 +02:00
Bruno Windels
86620839ae make username clickable 2019-04-17 10:57:45 +02:00
Bruno Windels
8a371080d7 colored inviter name and layout 2019-04-17 10:22:35 +02:00
Bruno Windels
eeaa7143ac move name coloring out of sender profile
so we can reuse it in room preview bar
2019-04-17 10:21:30 +02:00
Travis Ralston
e0c976e96e Merge branch 'develop' into cleanup_message_composer 2019-04-16 11:18:52 -06:00
Bruno Windels
56ade1ead5 WIP on showing inviter avatar 2019-04-16 18:48:47 +02:00
Bruno Windels
f9a2b76966 show room name where available when header isn't visible (no preview) 2019-04-16 17:50:20 +02:00
Bruno Windels
eeb9b4b2e3 don't show re-join upon kicked when we know you can't 2019-04-16 17:23:45 +02:00
Bruno Windels
dbb73439e4 also return Joining when internally busy looking something up 2019-04-16 17:23:24 +02:00
Bruno Windels
523311b50c saner order for message case detection (can't be joining when kicked) 2019-04-16 17:23:01 +02:00
Ross Brandes
15e68c3ba1
Make alt-enter insert new line on macOS
Alt-enter is a common macOS shortcut for inserting a new line in an
input that has a separate action tied to the enter key.

Signed-off-by: Ross Brandes <ross.brandes@gmail.com>
2019-04-15 21:15:38 -04:00
Bruno Windels
36951dd7b7 cleanup spinner props and use always preview bar when room operation is in progress 2019-04-15 18:49:00 +02:00
Bruno Windels
7459e19f06 fix lint 2019-04-15 17:56:36 +02:00
Bruno Windels
fd6c594a8f put auth buttons in preview bar 2019-04-15 17:52:17 +02:00
Bruno Windels
1d0c402093 improve error messages, etc 2019-04-15 17:11:17 +02:00
J. Ryan Stinnett
2054d53782 Tweaked wording after discussing with @lampholder 2019-04-15 15:10:48 +01:00