Workspace management in Browser

Workspace v7 or later provides users with the ability to save, rename, or delete a workspace, and to switch workspaces. If needed, developers can also control whether users can save workspaces or workspace elements (pages or views).

In Workspace v16.1 or later, developers can further customize the save and copy workflows. See Customize the save workflow.

As a developer, you can include the workspace management customizations you need in your Workspace Platform. Your platform calls/implements the OpenFin Workspace APIs, and by default saves your customized settings in local storage. To persist settings, you can use the OpenFin Snapshot object, or you can write your own model for storage.

For an explanation of the Browser elements that can be modified, see Parts of windows in Browser.

Enable content sharing

You can also implement content sharing by working with the existing Workspace interfaces and methods. See the workspace-starter example for ideas about how you might write your implementation.

What users can do

Here’s what users can do:

From the main Browser menu:
- Save the current workspace
- Save any modifications to the current workspace with a different name (save workspace as)
- Rename the workspace
- Delete the entire workspace
- Switch to a different workspace
From the Browser toolbar:
- Save the current workspace
- Save any modifications to the current workspace with a different name (save workspace as)
- Save the current page
- Save any modifications to the current page (save page as)
From the page tab context menu:
- Save the current page
- Save any modifications to the current page (save page as)
- Rename the page
- Duplicate the entire page

Although the controls for these user actions are displayed in the Browser, any changed content that is saved as part of the workspace is also available by searching in Home.

What platform developers can control

All settings for users to customize their workspaces are enabled by default. To disable any setting, you remove the object that represents it from the array of context menu options. By default this array looks like:

const contextMenuTemplate = [
    {
        type: MenuItemType.Label,
        label: 'New Window',
        data: {
            type: GlobalContextMenuOptionType.NewWindow
        }
    },
    {
        type: MenuItemType.Label,
        label: 'New Page',
        data: {
            type: GlobalContextMenuOptionType.NewPage
        }
    },
    {
        type: MenuItemType.Separator,
        data: undefined
    },
    {
        type: MenuItemType.Label,
        label: 'Restore to Last Saved Changes',
        data: {
            type: GlobalContextMenuOptionType.RestoreChanges
        }
    },
    {
        type: MenuItemType.Label,
        label: 'Save Workspace',
        data: {
            type: GlobalContextMenuOptionType.SaveWorkspace
        }
    },
    {
        type: MenuItemType.Label,
        label: 'Save Workspace As...',
        data: {
            type: GlobalContextMenuOptionType.SaveWorkspaceAs
        }
    },
    {
        type: MenuItemType.Label,
        label: 'Rename Workspace',
        data: {
            type: GlobalContextMenuOptionType.RenameWorkspace
        }
    },
    {
        label: 'Switch Workspace'
    },
    {
        label: 'Delete Workspace'
    },
    {
        type: MenuItemType.Separator,
        data: undefined
    }
]

For example, to prevent users from making modifications to a workspace, you modify the template to remove all workspace-related options. In this example, these options are commented out, but you could remove them entirely. Notice that the example still allows users to add new windows or new pages, but they can't do anything to add them to the workspace. You can similarly remove the options to add new windows or new pages.

const contextMenuTemplate = [
    {
        type: MenuItemType.Label,
        label: 'New Window',
        data: {
            type: GlobalContextMenuOptionType.NewWindow
        }
    },
    {
        type: MenuItemType.Label,
        label: 'New Page',
        data: {
            type: GlobalContextMenuOptionType.NewPage
        }
    },
    {
        type: MenuItemType.Separator,
        data: undefined
    },
    /** 
    {
        type: MenuItemType.Label,
        label: 'Restore to Last Saved Changes',
        data: {
            type: GlobalContextMenuOptionType.RestoreChanges
        }
    }, */
    /**
    {
        type: MenuItemType.Label,
        label: 'Save Workspace',
        data: {
            type: GlobalContextMenuOptionType.SaveWorkspace
        }
    },
    {
        type: MenuItemType.Label,
        label: 'Save Workspace As...',
        data: {
            type: GlobalContextMenuOptionType.SaveWorkspaceAs
        }
    },
    {
        type: MenuItemType.Label,
        label: 'Rename Workspace',
        data: {
            type: GlobalContextMenuOptionType.RenameWorkspace
        }
    },
    {
        label: 'Switch Workspace'
    },
    {
        label: 'Delete Workspace'
    },
    {
        type: MenuItemType.Separator,
        data: undefined
    }
    */
]

Then pass the modified template to the payload for the context menu:

export type OpenGlobalContextMenuPayload = OpenGlobalContextMenuRequest & {
    /** Template defining the options to show in the context menu. */
    template: GlobalContextMenuItemTemplate[];

    /** Identity of the Browser window where context menu should be shown. */
    identity: NamedIdentity;

    /** Default function that handles stock context menu options. */
    callback: (data: GlobalContextMenuItemData, payload: OpenGlobalContextMenuPayload) => any;
};

Developers can also change names of workspace management commands in menus. For example:

const saveWorkspace = {
  type: MenuItemType.Label,
  label: 'YOUR_CUSTOM_MENU_LABEL',
  data: {
      type: GlobalContextMenuOptionType.SaveWorkspace
  }
};