Merge Chat app sidebar / user list more with Contacts menu

[jancborchardt]

Now that the Chat function is properly integrated in the Contacts menu with #13, it would be cool to see how we can combine further.

We have the conversation windows on the bottom for each person or group, which are good.
Then there’s a big user list on the right though, either shown or not shown. This is exactly why we developed the Contacts menu/popover to not be so present and be easier to include in the apps layouts, especially with some apps like Files and Tasks using a right sidebar already. :)

Some things are missing from the Contacts menu though, for example:

• Last message written with that person, as mocked up at Design spec: Contacts menu server#207
• Online status directly on the avatar, as mocked up at Design spec: Contacts menu server#207 (comment)
• Clicking the avatar or username should launch a chat (if the Chat app is installed)
• Notification for new messages, with a red bubble on the Contacts menu (like for the Notifications menu)
• What else …?

Could we move these things from the user list to the Contacts menu in an effort to move towards one unified solution? :) What do you think @sualko @ChristophWurst @karlitschek?

[sualko]

As mentioned earlier it would be cool to unify the contact list, but not every xmpp contact is in the users address book. We would need a way to manipulate this list on the client side (adding, removing, updating xmpp contacts).

• Online status is already visualized by a colored bubble in the top right corner of the chat icon
• Last message: I think this would be possible
• Notification? What do you mean? Is there a nc js api for this? Jsxc already displays html5 notifications.
• Ordering: How can I manipulate the order on client side, because the hole xmpp stuff is handled client-side?

[jancborchardt]

Online status is already visualized by a colored bubble in the top right corner of the chat icon

Yup, and that should ideally also go into the Contacts menu. :) As was commented at nextcloud/server#207 (comment)

Notification? What do you mean? Is there a nc js api for this? Jsxc already displays html5 notifications.

I mean simply changing the Contacts menu icon to full opacity and maybe adding a red bubble to it when there is a new message.

Ordering: How can I manipulate the order on client side, because the hole xmpp stuff is handled client-side?

@ChristophWurst @georgehrke can you advise here? :)

[sualko]

Yup, and that should ideally also go into the Contacts menu.

I meant it's already there (maybe it's to small 😋):

maybe adding a red bubble to it when there is a new message.

If there is an api for that, I am happy to use it. Otherwise I could create a red bubble by myself, but I think it should be all little more "official".

[jancborchardt]

@sualko alright! I meant having the bubble on the avatar, as it currently is in the sidebar of the Chat app. :) And another point of enhancement (added it above too):

• if the chat app is installed, clicking anywhere on the avatar or name should also launch a chat. :)

[sualko]

I meant having the bubble on the avatar

We have to consider, that there could be cases where people have multiple accounts, e.g. work and privat, linked in a contact. One solution would be to aggregate those presences and show only the highest available on the avatar. On hover we could show more details. We have a similar issue if we like to launch a chat by clicking on an avatar if it belongs to an address book entry and not to an nc user. Any ideas how to solve this?

[jancborchardt]

@sualko good point. We could presume that the default is one chat account. If there are multiple ones, clicking on the avatar/name could also open the 3-dot menu with the different chat accounts in there and user handles showing next to them as we do when people have several email addresses.

And yes, the highest »available« status should be used for the avatar. Meaning if you are online on any of your accounts, you will show as online.

[sualko]

I added your first 3 points to the contact menu:

• Last message written with that person
• Online status directly on the avatar
• Clicking the avatar should launch a chat

[jancborchardt]

Awesome! Check it out @karlitschek @ChristophWurst :)

[karlitschek]

wow. this is suuuper cool