Permissions popup

Use this to manage user permissions or visibility rules

Overview

A popup that includes a custom input dropdown UI to copy link to clipboard, a user search input, and a list of users, each with a permissions dropdown and toggle.

Structure

This responsive popup consists of three main groups

  • dropdown_copytoclipboard_template This custom input dropdown includes UI for displaying a link, allowing the user to manage its visibility rule, and an icon button to copy the url input to your browser's clipboard.

  • Group Main invite user This group contains the input that searches users by name or email. We use a Fuzzy Search & Autocomplete plugin here for the search. For the fuzzy search to work, the Search&Autocorrect fuzzy search element should always be visible on page load and Input Invite user should have an ID input_users_invite attribute. When Input invite user is not empty, RepeatingGroup User list will be filtered if the fuzzy search returns a match, otherwise Group Inner empty state will be shown. The user can click on Group Clear input to clear he value in Input invite user.

  • Group Main users list This group contains a RepeatingGroup User list for displaying users that have permissions. Each entry includes an image, a name, a hidden email, a menufocus_permissions_template, and a toggle.

    • In menufocus_permissions_template, it use a RepeatingGroup Dropdown to display a list of menu options. For demo purpose, we use Arbitrary Text as a data source. Click here to learn how to change the data source.

How to set up

  • Update the Permissions Popup's content type. For example, you might want to set the popup's content to a 'Project' data type. You'll need to trigger the popup from a button on the page and display a 'project' value in the popup.

  • Go to dropdown_copytoclipboard_template reusable element and update any copy. Add workflows to when a dropdown option is clicked (e.g. setting the 'project's' link visibility to private when the private option is clicked). Change Input URL's value to a dynamic value.

  • Update Search&Autocorrect fuzzy search's search criteria.

  • Update RepeatingGroup User's data source if needed.

  • Add a workflow to CanvasToggle share access. For example, you might want to add a workflow like 'when CanvasToggle share access is changed, update parent group's user's access permission to yes'.

  • Go to menufocus_permissions_template and update RepeatingGroup Dropdown's data source. For example, you might want to use an option set here. Add an additional workflow to when Group Option 1 is clicked, update menufocus_permissions_template user's permission (you need to add this fields to whichever data type you are using).