Moving "X is typing" below the composer


#1

At Discourse we applied:

.rc-message-box {
   padding: 2px 24px 24px 24px;
}

.rc-message-box__typing {
  top: inherit;
  bottom: 6px;
}

image

This emulates what Slack does and kills 22px of whitespace above the composer.

Is this something that should be applied to Rocket Chat?

(also, we need a better category than uncategorized here)


#2

I believe in 0.58.0 and earlier the indicator was actually below the input. Its a very recent change where we moved it up.

As you might be aware we’ve been giving Rocket.Chat a pretty big facelift kind of piece by piece.

I know this particular choice was as a result of the redesign. I think might have been influenced by a few regular issues encountered.

Primarily around there just not being enough real-estate.

Imagine you have a case where you are on mobile web. Tiny amount of space, and then you have two people typing at the same time you are.

aaron.ogle and someonewithalongusername are also typing

I can definitely understand the desire to remove the whitespace. Its especially noticeable when scrolling :grimacing:

image

I’ve create an issue to look into it: https://github.com/RocketChat/Rocket.Chat/issues/9214


#3

Totally get that, but the problem I have is that this ends up compromising desktop just to keep mobile happy which is not ideal. If mobile needs a magic adjustment it can always be applied via media queries.

Point of reference on one, we have been using it below now for quite a few days and everyone seems fine with it.


#4

Seconding this. Having it below on desktop makes a lot of sense.


#5

There is a now a PR open to move it:

But its actually moving it so its at the end of message list… So not always visible. I think still needs refined a bit.