Bookmarks Bar

The bookmarks bar appears right below the channel header on Professional and Enterprise licensed servers. The bookmarks bar is not visible on Team edition servers.

Mobile

The bookmarks bar should be hidden by default on mobile if there are no bookmarks.
If there are bookmarks however, the bookmark bar would appear.
There is no way to hide/show the bookmarks bar on a user+channel level on mobile.

Desktop

The bookmark bar would appear on a channel by default even if you do not have a bookmark.

Adding a bookmark

Mobile

A user can add a bookmark by doing two things.

1. Clicking the plus button on the bookmarks bar.

2. Clicking the plus button in the channel info modal.

Desktop

There is only one way to add a bookmark on desktop, using the + button on the bookmarks bar itself.

Adding a bookmark popup/dropdown

Mobile

If you click on add a bookmark, a popup appears allowing you to choose a file or a link.

Desktop

A dropdown appears, allowing you to add a link or a file.

1. Adding a link

A user can add any valid link. As soon as the user enters a link, we fetch the open graph data, image and title, and display it. The user has a choice to change the title or the image to whatever he wants.

A spinner should also appear when the opengraph image and title is being fetched.

Updating bookmark icon

The user should be able to revert to the original bookmark icon if needed. So we would be storing that in the emoji picker. If not that, we can have a reset link if easier to revert back to the original icon.

Mobile

If the link is invalid, we’ll show an error:

Desktop

2. Adding a file

As soon as the user clicks on attach a file, a user can go through the same process as the attach file option in the post menu.

The user can only add one image at the time, and would have the option to change the image icon appearing on the bookmark and title.

Mobile

Desktop

How it displays with other banners

It would always be pinned right below the channel header.

Editing a bookmark

Mobile

You can see bookmark settings by long pressing on it. That would open the edit bookmark menu, allowing you to edit, delete, and share the bookmark.

On mobile we would have these options:

• Edit

• Copy link

  • Will not be visible for files if public links are disabled.

• Share

• Delete

Desktop

On desktop, a “…” icon would appear on hover, that the user can click to get two options.
Edit, and Delete.

On desktop we would have these options:

• Edit

• Copy link

• Delete

Opening bookmarks

1. Opening a file bookmark is going to behave exactly how clicking on a file thumbnail behaves in a post.

2. Opening a link will behave differently if its internal or external

   1. Internal link

      1. Clicking It would behave similarly as a permalink preview.

   2. External link

      1. Open the link in a new tab

Reorder Bookmarks

The user can reorder bookmarks only on desktop, and this would be a channel level change.

Anyone updating a bookmark order would update it for everyone else. There would be no way for a user to update a bookmark only for themselves.

The user can just hover over the bookmarks item, and drag it left and right to change the order of the bookmarks for himself.

Example of notion below.

Include files in bookmarks in search and in the files RHS

The files that anyone adds in a bookmark should be searchable and be shown in the RHS.

Permissions

As seen above, all actions related to the bookmarks bar would be linked to the Manage channel settings permission in your system scheme

Channel Header change on Desktop

Designs can be seen here

We are moving the channel header items into a single row to save some vertical real estate.

That means rearranging the header UI area in all places, bots, channels, drafts, threads, etc.

Open questions

cc Eric Sethna

1. Should we allow users to reorder bookmarks on mobile?

   1. No for now.

2. Should we allow users to add a bookmark with just an icon, no label/title? (Slack allows bookmarks without a label).

   1. No for now.

3. Should we include an open link option in the bookmarks dropdown/popover.

   1. No.

4. Should we have a “…” icon for options, or allow right click for options in desktop (both web and desktop app).

   1. No right click, as we’re not doing it anywhere else.

5. Should we expand the chip on “…” or overlap it with text.

   1. Overlap

6. Permissions are linked to channel settings

   1. Update help text to say bookmarks.

7. Should we update channel header UI?

   1. Yes, we’ve decided to do that in V1.

8. Should we have the ability to show/hide bookmarks?

   1. Not in V1, we’ll work on it iteratively.

9. Should people be able to reorder bookmarks

   1. Yes at a channel level, and only for desktop and following the same permissions as editing

10. Copy link icon if they don’t have edit permissions (desktop only)