homostellaris / seshy Goto Github PK

It would be good if Seshy could have its own URLs that when clicked open a particular saved session in Chrome. One use case would be having a todo with a link to the tabs needed to complete that todo.

More information about the required screenshots can be found in the Chrome developer docs.

Ideally these windows would not be shown at all in the session manager.

The Chrome sync APIs throttle requests eventually which leads to some unreliable behaviour. Debouncing the event listeners for tab updates and other things should decrease the likelihood of this happening as well as eliminate unnecessary load on the client's CPU.

As a user,
I would like to be able to remove sessions,
So that I can keep my session lists pruned and stay focused on my work

• When users delete a session it is gone permanently.
• Sessions can be deleted from the session manager by:
  • Pressing the # key.
  • Clicking the trash icon.
• When a session is deleted the session card disappears from the session list and:
  • If the session is an open, unsaved session then it's window is closed.
  • If the session is an unshelved session then it's window and bookmark folder are removed and it is not reshelved (it is no longer a saved session).
  • If the session is a shelved session then its bookmark folder is removed.

As a user,
I want to be able to rename sessions,
So that I can ensure they always have a meaningful name.

• A user can rename a selected session by:
  • Pressing the r key.
  • Clicking on the session name input.

As a user,
I would like to be able to resume sessions that I have already saved,
So that I can pick up where I left off

• When the user activates the browser action the session management popup is visible.
• A list of sessions is visible in the popup.
• The first saved session in the list is already selected.
• Pressing the enter key will go to the selected session.
  • If the session is already open in the currently focused window then the session manager will simply be closed.
  • If the session is already open in a window that is not currently focused then that window will be focused.
  • If the session is shelved then a new window will be created with the same tabs in the same order as when the session was last shelved.
• The pinned state of the tabs will not be saved (will be implemented later).

If the folder Other Bookmarks/Seshy/Seshy exists session folders get created in Other Bookmarks rather than Other Bookmarks/Seshy which breaks functionality.

It might be that you have several windows open and one that you've named 'UI testing'. You are multi-tasking so the last window you touched was actually another one named 'Retrospective'. You click a link in Slack that is to do with UI testing but the link opens in the Retrospective window rather than the UI testing window because it is the currently active window.

One solution to this might be to make it easy to drag and drop the tabs into the UI testing window but without having to faff around re-sizing windows to make this possible. This could be achieved through the session manager by dragging and dropping cards on top of one another (and providing a toast notification with an 'undo' option in case this happens by accident).

https://developer.chrome.com/docs/extensions/mv2/migrating_to_service_workers/

Could use MDC toast notifications for this.

There should be a clickable button for closing open sessions and returning them to their shelved state. Currently you have to close the actual Chrome window but it's helpful to be able to do everything within the session manager.

As a user,
I would like to guidance on how to use the app when I need it,
So that becoming productive with the extension is as low effort as possible.

• The assistance page is a general page that contains multiple different forms of help for the user. It is split into 3 tabs:
  • The first tab is Getting Started.
  • The second tab is Help & Support.
  • The third tab is Keyboard Shortcuts.

• The rationale is that there should be one place a user can go for 'assistance' of any kind. Many apps have multiple sections for slightly different forms of assistance like Help, Getting Started, Keyboard Shortcuts, About, Contact Us, FAQ. Often the information the user needs could lie in more than one of these possible locations. It is frustrating for a user who needs assistance to immediately have an additional problem to solve: where do I look?. This adds a cognitive burden in addition to the one they already have due to not having some information they need. Having a single place to go with everything they might need I hope will make the user feel as though they are very quickly close to the answer they require.

• The help page is shown when:
  • The browser action is activated for the first time after installing the extension.
    • In this case the Getting Started tab is focused.
  • The question mark icon in the top right is clicked.
    • In this case the Help & Support tab is focused.
  • The ? key is pressed.
    • In this case the Keyboard Shortcuts tab is focused.
• The Getting Started tab will provide a brief explanation of how to use the extension.
• The Getting Started tab will explain how to view the assistance page again.
• The Help & Support tab will link to an appropriate section in the GitHub wiki where there is more in-depth information.

This will allow the use of promises but necessitate the use of service workers.

Similar to what Parabol does for new groupings of cards. Hoping there is a small library for this.

There is a webpack plugin that watches the filesystem and hot reloads the extension.

All commits on master are considered production-ready. Should be able to inspect environment variables in Travis build to see if the current branch is master and if so enable publishing pending passing tests.

As a user,
I want to be able to easily select sessions,
So that I can perform an action quickly and get back to the task at hand.

• When the session manager is opened the session card for the current window will automatically be selected.
• Selected sessions will be indicated by a blue sidebar (like Inbox) on the session card.
• Session cards can be selected by:
  • Pressing UP or DOWN arrow keys to select the session card above or below the currently selected one respectively.
  • Clicking on a session card.
  • Pressing LEFT or RIGHT arrow keys to skip to the nearest card in the section above or below the current section respectively.

The extension is not remotely accessible you absolute barstard. Sort it out.

Google material icons will be used as the browser action icon to represent various different states.

• When the current session is unsaved the browser action icon will be a bookmark icon.
• When the current session is saved the browser action icon will be a bookmark border icon.
• When the current session is saving the browser action will change to the sync icon for at least 1 second (in order to provide clear and reassuring feedback to the user).

As a user,
I would like to be able to easily tell what tabs a session contains,
So I can decide whether to focus it or save it

Currently the session card looks a bit like this:

Awesome Session
----------------------------------------
3 tabs <-------- empty space ---------->

• The empty space could be filled with a line of circular favicons allowing users to see at a glance what tabs they have saved in their session, conveying extra information in addition to the session name.
  • A hover or click could show a full list of favicons and tab titles.
• There is a chance it will just make the UI too busy without adding much value. A prototype should be done first.
• If it is implemented the loading of the favicons should not block the UI.
• Unsaved sessions could read Title of first tab and more...

When there are no items in one of the sections (unsaved, unshelved, shelved) we should use some sort of placeholder. We don't want to hide the section entirely because it makes the layout inconsistent which harms familiarity and hides information from the user about the concepts at play which harms their learning.

See the material design guidance on empty states to decide what type of placeholder to use.

This might be when Chrome is quit and the local storage is not given chance to be cleared.

As a user,
I want to be able to save sessions,
So I can be comfortable closing windows that I don't need right now but will need again in the future.

• A saved session will be automatically shelved when its window is closed.
• Before a session is saved, it will have the default name Unsaved Session.
• The session card for the current window will always be selected upon opening the session manager, so that users can immediately perform an action such as saving the session.
  • In total the user needs to do the following to save a session.
    • ctrl + shift + s (or click the extension button)
    • r to name the session (or click in the session name input)
    • Type a name (or leave the name as Unsaved Session)
    • ENTER (or click elsewhere to focus some other element)
• Saved sessions will be indicated by their cloud icon turning from grey to blue.

More information about the required screenshots can be found in the Chrome developer docs.

Almost all the code uses the callback pattern. Promises would improve the legibility of the code significantly.

The Chrome Promise NPM package may be of use.