humhub / calendar

Create one-time or recurring events, invite and manage attendees, and keep track of all your events with the Calendar module.
28 stars 46 forks source link

Invite Users / Manage Users #263

Closed luke- closed 2 years ago

luke- commented 2 years ago

image

Related to: https://github.com/humhub/calendar/issues/1

yurabakhtin commented 2 years ago

@luke- I have started this in PR https://github.com/humhub/calendar/pull/264

yurabakhtin commented 2 years ago

@luke- I have done this please review:

invite
luke- commented 2 years ago

@yurabakhtin Thanks! It would be good if the invited people can decide themselves which option (yes, no, maybe) they mark. A new notification "You have been invited" makes sense here.

There should also be a possibility that the event creator can manually manage the participants. Remove people, change status, add (without invitation).

yurabakhtin commented 2 years ago

@luke-

Thanks! It would be good if the invited people can decide themselves which option (yes, no, maybe) they mark. A new notification "You have been invited" makes sense here.

Commit https://github.com/humhub/calendar/pull/264/commits/2513221998c2d311914246439c6f9b30efdd50c2.

yurabakhtin commented 2 years ago

@luke-

There should also be a possibility that the event creator can manually manage the participants. Remove people, change status,

Commit https://github.com/humhub/calendar/pull/264/commits/cb7c7fdc820ca16258559dcf297bd1f2c9dc6f9d

participants-list

add (without invitation).

I will do this later.

yurabakhtin commented 2 years ago

@luke-

add (without invitation).

Commits https://github.com/humhub/calendar/pull/264/commits/43e344b82105ceb0d5b033ca6bc9aebd492e709f, https://github.com/humhub/calendar/pull/264/commits/65b2dcd31c284820ece9e2ac5b738a21ec666eec:

add-users

luke- commented 2 years ago

@yurabakhtin Thanks, please see my notes:

1.) It would be good if the "Participants" are not listed as a tab in the "Edit Event" modal, but become a modal of their own. This could, for example, be automatically opened directly after save a new calendar entry

The "Participants" modal should fulfil two tasks. Firstly, it should allow all users (without write access) to view the participants of the event. The organiser should also be able to manage the participants via this modal.

Read Access & Organistator:

Organistator (Write Access):

It would be good if you could try to layout the modal yourself. If necessary, Angela can then optimise it again.

2.) The Participants Modal should be linked here: image

3.) Show Number of Invited Users image

4.) If an event is set to "Only by Invite", the action buttons for non-invited participants should be greyed out. Note "Only for invited participants".

5.) Please remove this feature: image

6.) In the "Participants" modal there should be a button, "Invite all Space Members". Here an ActiveJob should be triggered.

yurabakhtin commented 2 years ago

@luke- Commit https://github.com/humhub/calendar/pull/264/commits/e0a4a1186a1db030af8d56d5270b44f0bea8d735:

I have moved the participants list from tad to new modal window:

new_participants_list

View is user has no permission to edit the calendar entry:

new_participants_list-no-edit-perms

Next step I think to move the button "Invite participants" into the same modal window, it will be added after the green button "+ Add participants" and it will have the same interface except of no status selector.

luke- commented 2 years ago

@yurabakhtin Yeah, looks nice! Maybe the invite can also placed on the top of the modal. For "read only", the filter can be also used or is it disabled?

yurabakhtin commented 2 years ago

@luke-

For "read only", the filter can be also used or is it disabled?

It is enabled, i.e. it works same way as for editor, I just did the screenshot from another browser(FF win) and it displays the <select> like disabled style, but it is enabled really.

luke- commented 2 years ago

@yurabakhtin It would be good if the "Participants" would open right after the Create modal. If the users are only set to Invite. Also, the Invite button is missing here. after a reload it is there. image

yurabakhtin commented 2 years ago

@luke- Commit https://github.com/humhub/calendar/pull/264/commits/badd2d69e93ac33ee44fced0f37218cdace49ff5:

I added the button "Invite" on the "Participants" modal window:

invite_button

Also on click the old button the form to invite users is automatically loaded:

invite_button2

Also, the Invite button is missing here. after a reload it is there.

I didn't fix this issue yet, but do we need this button here if we have same on the "Participants" modal window?

luke- commented 2 years ago

@orangiene Can you please take a look into this as discussed?

orangiene commented 2 years ago

@luke- Here are the updated screens as discussed: https://www.figma.com/file/tshvUVBzxy7uW8eZs6n6IG?node-id=0:1#147324343

Please specify in the last screen from which number of users the pagination is displayed. I would suggest from a number of 8-10 users.

luke- commented 2 years ago

@yurabakhtin Can you please adapt the modals as suggested by @orangiene

yurabakhtin commented 2 years ago

@orangiene @luke- On the figma url I find 2 parts related to the calendar module: "Calendar IST" and "Calendar Roadmap". What part should be implemented, both? I guess only the "Calendar Roadmap" because it looks like new version. Should I skip the part "Calendar IST" completely? or something should be implemented from the part?

@orangiene

Please specify in the last screen from which number of users the pagination is displayed. I would suggest from a number of 8-10 users.

Sorry, not clear this, could you please draw what and where I should print this, thanks.

yurabakhtin commented 2 years ago

@luke- I have some questions:

Calendar Roadmap:

1) Step 02 -> Step 03: It will be easier to save Event in DB right after click on the button "Next". I.e. on loading the modal "Event Participants" it would be better to load the data by Event ID. So the button "Create event" should be named as "Update event", and the button "Next" should be named as "Create event". Do you agree this? Or should we really to pass all data from the first modal to the next modal without storing Event in DB? If yes I can try to implement this somehow.

2) Step 04: Do I understand correctly: the tab "Participants of the event" should appears only after we select option "Only by Invite"? I.e. on two other options we deny to add/edit/delete participants, right?

3) Step 05: Currently we have 2 separate forms:

On new interface I see a single form, but in such cases we should send email with invitation? Only when status is selected to "Invite"? Also on this step we cannot have the button with name "Create event" because on the action of the blue button "send" we should know event ID in order to append new participants. Or do you think we should store all these data in some other place like Sessions and then do all saving and adding of participants only after press the button "Create event"?

yurabakhtin commented 2 years ago

@luke- Should I continue new changes in the same PR https://github.com/humhub/calendar/pull/264?

orangiene commented 2 years ago

@orangiene @luke- On the figma url I find 2 parts related to the calendar module: "Calendar IST" and "Calendar Roadmap". What part should be implemented, both? I guess only the "Calendar Roadmap" because it looks like new version. Should I skip the part "Calendar IST" completely? or something should be implemented from the part?

@orangiene

Please specify in the last screen from which number of users the pagination is displayed. I would suggest from a number of 8-10 users.

Sorry, not clear this, could you please draw what and where I should print this, thanks.

@yurabakhtin You can skip "Calendar IST" completely. sorry for confusing.

@luke- please specify from which number of users the pagination is displayed. I would suggest 8 or 10. What do you think?

yurabakhtin commented 2 years ago

@orangiene @luke-

Please specify in the last screen from which number of users the pagination is displayed. I would suggest from a number of 8-10 users.

From this text:

@luke- please specify from which number of users the pagination is displayed. I would suggest 8 or 10. What do you think?

I got you want to increase the page size to 8 or 10 users, right? Currently we have 8 users per page, I use the core user module setting humhub\modules\user\Module->userListPaginationSize = 8 - https://github.com/humhub/humhub/blob/master/protected/humhub/modules/user/Module.php#L55.

luke- commented 2 years ago

@yurabakhtin

luke- commented 2 years ago

@yurabakhtin

yurabakhtin commented 2 years ago

@luke- Thank you for the answers:

  • Participants Tab: We should also display it when "Everyone can participante"

Ok, then participants list and all related buttons and actions should be hidden/denied when option "No participants" is selected

buttons_no_participants
  • DB Save: Leave the button label "Next" but already save it to the DB (Should be the simplest solutions or?)

Yes, if the entry will be saved in DB right after click on the button "Next" then implementation will be easier. You wrote "Leave the button label "Next"", ok, but what about other buttons "Create event"? Maybe we should choose better title because at that moment Event is already created/stored in DB.

luke- commented 2 years ago

@yurabakhtin

Thanks!

yurabakhtin commented 2 years ago

@luke- I have started new changes in the commit https://github.com/humhub/calendar/pull/264/commits/e6654f9f5c9511da51c73f0fdee1a36328db113d.

orangiene commented 2 years ago

@yurabakhtin @luke- the modal should have a width of 800px on desktop, please.

yurabakhtin commented 2 years ago

@luke- @orangiene New changes in commit https://github.com/humhub/calendar/pull/264/commits/47d649028a1b11b992afb11dabbea2c486de2296.

I still need to fix one issue: after filter or switch page the user picker and checkboxes broken.

preview_new_ui_participants
yurabakhtin commented 2 years ago

@luke- @orangiene Commit https://github.com/humhub/calendar/pull/264/commits/b0ceeae8dc4c6e2736435a79abada3524d45007d - all new changes have been done, please check.

orangiene commented 2 years ago

@yurabakhtin Thank you for the implementation. While clicking through, we noticed a few small things, also in the concept.

I'll mark you again in figma at the corresponding place. I have written the user story under the screens. You can find the adjustments both in the screens themselves and in blue below them.

In summary, please make the following adjustments:

Step 01:

Calendar-Step-01

Step 02: Remains as it is

Step 03: (during the creation of an event) Please put the tab "settings" into a tab layout. Please use the buttons "back" and "save" ("save" button for "no participants" and "next" button for all other possibilities).

Calendar-Step-03a

Step 03: (while editing an event) During the editing of the event please use the two buttons "close" and "save".

Calendar-Step-03b

Step 04: Please use the buttons "back" and "next" (by using "Only by Invite") and only for creating an event. If the user edit an event, please use "save" for the button.

Calendar-Step-04

Step 05: We renamed the tab "Participants of the event" to "Participants".

we have arranged the elements differently: Add new participants checkbox "invite all participants from the space grey line Filter number of participants

Please note the spacing between the filter tabs (8px)

Calendar-Step-05

Step 06: We renamed the tab "Participants of the event" to "Participants".

we have arranged the elements differently: Add new participants checkbox "invite all participants from the space grey line Filter number of participants list of participants (pagination)

Please note the spacing between the filter tabs (8px)

Calendar-Step-06

Step 07: we added a 2nd button if the user wants to edit the event. (after clicking on an event in the calendar) new button: "invite"

Calendar-Step-07

yurabakhtin commented 2 years ago

@luke- @orangiene New changes in the commit https://github.com/humhub/calendar/pull/264/commits/40a1101414b29674213ce3455904a1f36b7a6691.

luke- commented 2 years ago

@yurabakhtin Great work. Here some points.

1.) Would be great when title has directly focus, after open modal image

2.) Set new Participants als Invited by default image

3.) image

luke- commented 2 years ago

4.) If the Event is "Private", it should be only possible to invite (User Picker) Space members. If the Event is Public all Members should be available.

luke- commented 2 years ago

5.) Migrate old legeacy file tab. image Files should be now inserted via the RichText Field

6.) Cleanup Edit (Default Hide these tabs) image

7.) Visibility Chooser image

yurabakhtin commented 2 years ago

@luke- Commit https://github.com/humhub/calendar/pull/264/commits/f4a427d011fd23fc8083e8a7501f37f55a03f64e:

1.) Would be great when title has directly focus, after open modal

I tested this to open the form and from global calendar page and from space/user calendar page - in all cases the title field is focused. Please give me more details how/when you can see the title is not focused, thanks.

2.) Set new Participants als Invited by default

Done.

3.)

Done.

luke- commented 2 years ago

1.) I can't currently recreate it myself. I will report if it occurs again.

yurabakhtin commented 2 years ago

@luke-

4.) If the Event is "Private", it should be only possible to invite (User Picker) Space members. If the Event is Public all Members should be available.

Commit https://github.com/humhub/calendar/pull/264/commits/40451b86183aa8a97419b10e6fb1b3f652dc5454. I am not sure what you mean here by "Private", so please review I have got you correctly:

only_invite
yurabakhtin commented 2 years ago

@luke-

5.) Migrate old legeacy file tab. Files should be now inserted via the RichText Field

Commit https://github.com/humhub/calendar/pull/264/commits/8f30482919989252637e95820aab581a1cacd67c.

Please note after deleting the tab "Files", the already attached files could not be deleted from the calendar entry:

attached_files

You wrote on the screenshot "All existing Files should be added as Link to the Description Field". Do you mean here we should migrate all attached files in the end of the Description Field as links list?

luke- commented 2 years ago

@yurabakhtin Yes, simply append them to the Description Field as Link List. Then the links can be simply deleted or?

yurabakhtin commented 2 years ago

@luke-

6.) Cleanup Edit (Default Hide these tabs)

Commit https://github.com/humhub/calendar/pull/264/commits/8a5f86614b9317820f8f72ba9ba25d28c1e55cc1

Please note the tab and option "Reminder" are visible only for future events:

new_options
yurabakhtin commented 2 years ago

@luke-

Yes, simply append them to the Description Field as Link List. Then the links can be simply deleted or?

Commit https://github.com/humhub/calendar/pull/264/commits/35c6b310749d2f12ff794a22ea20ae257aae741e.

yurabakhtin commented 2 years ago

@luke-

7.) Visibility Chooser

Commit https://github.com/humhub/calendar/pull/264/commits/154cad519e3de8e2b1655a78ed30d22c717e5a62 - I have done to use core widget ContentVisibilitySelect, but for topics we already use core widget \humhub\modules\topic\widgets\TopicPicker.

luke- commented 2 years ago

@yurabakhtin Work well, thank you!

@orangiene If the event is "Invite Only", a user will not see that. Does it make sense to display a badge "Invite Only" or the disabled buttons ?

image

When a user clicks on the invite notification, he gets the following view. Actually, we wanted to omit the text, but if the user is in the "Invited" status, it might be good to display more prominently that a response is requested. image

luke- commented 2 years ago

@yurabakhtin Can you please also add some tests. Especially for special cases like opening participants after create, notifcations- would be great if we have test coverage for that...

yurabakhtin commented 2 years ago

@luke- I have fixed only unit tests here https://github.com/humhub/calendar/pull/264/commits/1238ad4ad37c2040671943d0cf9dc9722614f9d8, also acceptance tests should be fixed, however checks for tests are not running on github side https://github.com/humhub/calendar/runs/5275858172.

luke- commented 2 years ago

@yurabakhtin Can you please look into this: image

yurabakhtin commented 2 years ago

@luke- Commit https://github.com/humhub/calendar/pull/264/commits/375f85b60b3fe9c5dbb3b0098e7401ea17ce4b53 I used core url where not members are displayed but they are not active, if you prefer to don't display the not member completely please let me know and I will implement a separate action in the calendar module:

private_vs_public_event_users
orangiene commented 2 years ago

We can use an "Invite only" as a tag. But I wouldn't include an additional text with an icon and a hint that the user should select his role. That is too much text and will not be read.

If we want to get the user to interact (click on the button), then let's make the button bigger and more prominent.

I am currently working on the new UI board and also on the buttons. For activities like "yes, no, maybe" I would go back to the typical and intuitive colours and characters.

Until the buttons are tuned, let's just go for bigger buttons. To bring more calmness into the module and to direct the focus on the buttons, I would take out the icons for date, participant and location.

What do you think?

calendar-stream-01a

calendar-stream-01b

calendar-stream-02a

calendar-stream-02b

orangiene commented 2 years ago

@luke-

6.) Cleanup Edit (Default Hide these tabs)

Commit 8a5f866

Please note the tab and option "Reminder" are visible only for future events:

new_options

@yurabakhtin

Could you please reduce the distance between the four select options (All Day, Recurring...)? then we only need one line and not two lines for desktop. Space: 24px

Thank you

yurabakhtin commented 2 years ago

@luke-

Can you please also add some tests. Especially for special cases like opening participants after create, notifcations- would be great if we have test coverage for that...

I have fixed all already existing acceptance tests in the commit https://github.com/humhub/calendar/pull/264/commits/5f723c172ba97a6522cce7b8ad1005d98f002348. After my fixes the tests work with new modal "Event Participants", so I don't see a reason create some new test else.

Do you know why tests are not run currently on github side?

yurabakhtin commented 2 years ago

@orangiene

Could you please reduce the distance between the four select options (All Day, Recurring...)? then we only need one line and not two lines for desktop. Space: 24px

We use there bootstrap column styles. Please note for space we display long title for Public:

wide-screen

for narrow screen it looks better:

narrow-screen

If need I can modify the styles for checkbox like this, but these changes should be done in core:

updated_style