RO-64 - Grouped App Windows

[vallerance-bot]

Key: RO-64
Type: Story
Epic: Groups
Labels: 
Priority: Low
Affects Versions: 
Status: Backlog
Fix Versions: 

Allow multiple apps to be grouped into a single unit. These apps can be used in individual windows, like standard apps; they can also be used as group within a single window. The grouping will be facilitated by a new `` component.

The <Group /> component will be a specialized type of app and will accept the same props as <App /> components. These app props will affect the behavior and appearance of the group window (when shown). Each grouped <App /> will accept the same props that will affect the behavior and appearance of the individual app window (when shown).

Groups will introduce a new state to apps of being "docked" or "undocked". Any apps that are docked will be shown alongside other apps in the group window. Any undocked apps will be shown in their own individual app windows. The group window will only be shown if at least one app is docked inside of it. When the last app is undocked, the group window will disappear, and it will reappear when the first app is docked again.

To improve the usability of this feature, shortcuts will need to be enabled/disabled on a per-app basis. <App />s and <Group />s will accept a new showShortcut boolean prop; it will be true by default. If showShortcut is false, then no shortcut will be shown for that app (or group).

<App />s will accept a new initialDocked boolean prop (default true) that will control the initial docked state of the app; it will have no effect if the app is not a member of a group.

When a group is opened (whether by its shortcut being double clicked, or by other means), then all apps for that group will be opened (if not opened already). When a group is closed, then all apps for that group will be closed (if not closed already). Apps that are members of a group may be individually opened or closed no matter whether they are docked or undocked.

Group windows will have an additional window control that will open all of the group's child apps (if not opened already). App windows that are members of a group will have an additional window control that will toggle their docked state, i.e. will either dock them to the group or undock them from the group.

Groups will have two modes: tabs and grid. The mode of a group will be specified by a new mode prop specific to <Group />s.

The tabs mode is similar to the window system used in Adobe software. Docked apps will be shown together in the group window in a single group of tabs, each tab corresponding to an app, and only one docked app being visible at a time (which ever one is active in the tabbed view). When an app is undocked, its tab disappears and it is no longer visible in the tabbed view. Another docked app tab will become active if the active tab app is undocked. When an app is docked, it becomes the active tab.

The grid mode will make use of react-grid-layout (https://github.com/STRML/react-grid-layout). Docked apps will be shown together in the group window in a single grid where all of the docked apps can be viewed and managed at the same time. When an app is undocked, it is removed from the grid (and the grid may adjust to replace it). When the app is docked, it is added to the grid.