@xh/hoist 76.0.0-SNAPSHOT.1757113228632 → 76.0.0-SNAPSHOT.1757274887417

package/CHANGELOG.md

@@ -15,6 +15,13 @@
   toolbar for clarity.
 * Added new ability to specify nested tab containers in a single declarative config.  Apps may now
   provide a spec for a nested tab container directly to the `TabConfig.content` property.
+* Improvements to View Management:
+  ** Allow users to create 'Global' views directly in 'Save/Save As' Dialog.
+  ** Simplify presentation/edit of view visibility to new "Visibility" control
+  ** Support for the 'isDefaultPinned' attribute on global views has been removed.  All global
+  views will be pinned by default.  This feature was deemed too confusing, and not useful in
+  practice.  App maintainers should ensure that all global views are appropriate and well
+  organized enough to be shown immediately to new users in the view menu.
 
 ### 🐞 Bug Fixes
 

package/build/types/cmp/viewmanager/DataAccess.d.ts

@@ -20,8 +20,6 @@ export declare class DataAccess<T> {
     createViewAsync(spec: ViewCreateSpec): Promise<View<T>>;
     /** Update all aspects of a view's metadata.*/
     updateViewInfoAsync(view: ViewInfo, updates: ViewUpdateSpec): Promise<View<T>>;
-    /** Promote a view to global visibility/ownership status. */
-    makeViewGlobalAsync(view: ViewInfo): Promise<View<T>>;
     /** Update a view's value. */
     updateViewValueAsync(view: View<T>, value: Partial<T>): Promise<View<T>>;
     deleteViewsAsync(views: ViewInfo[]): Promise<void>;

package/build/types/cmp/viewmanager/ViewInfo.d.ts

@@ -24,12 +24,6 @@ export declare class ViewInfo {
     readonly isGlobal: boolean;
     /** Optional group name used for bucketing this view in display. */
     readonly group: string;
-    /**
-     * True if this view should be pinned by default to all users' menus, where it will appear
-     * unless the user has explicitly unpinned it. Only applicable for global views, can be enabled
-     * by view managers to promote especially important global views and ensure users see them.
-     */
-    readonly isDefaultPinned: boolean;
     /**
      * Original meta-data on views associated JsonBlob.
      * Not typically used by applications.
@@ -47,8 +41,10 @@ export declare class ViewInfo {
     /**
      * True if this view should appear on the users easy access menu.
      *
-     * This value is computed with the user persisted state along with the View's
-     * `defaultPinned` property.
+     * This value is computed with the user persisted state for the view.
+     *
+     * If the user has not set pinning state for the view, global views and
+     * owned views are pinned by default.
      */
     get isPinned(): boolean;
     /**

package/build/types/cmp/viewmanager/ViewManagerModel.d.ts

@@ -8,16 +8,11 @@ export interface ViewCreateSpec {
     group: string;
     description: string;
     isShared: boolean;
-    isPinned: boolean;
+    isGlobal: boolean;
+    isPinned?: boolean;
     value: PlainObject;
 }
-export interface ViewUpdateSpec {
-    name?: string;
-    group?: string;
-    description?: string;
-    isShared?: boolean;
-    isDefaultPinned?: boolean;
-}
+export type ViewUpdateSpec = Partial<Omit<ViewCreateSpec, 'value'>>;
 export interface ViewUserState {
     currentView?: string;
     userPinned: Record<string, boolean>;
@@ -209,11 +204,15 @@ export declare class ViewManagerModel<T = PlainObject> extends HoistModel {
     userPin(view: ViewInfo): void;
     userUnpin(view: ViewInfo): void;
     isUserPinned(view: ViewInfo): boolean | null;
-    validateViewNameAsync(name: string, existing?: ViewInfo): Promise<string>;
+    /**
+     * Validate a name for a view.
+     * @param name - candidate name to validate
+     * @param existing - existing view that will have the name.  null if the name is for a new view.
+     * @param isGlobal - true if the name is for a global view.
+     */
+    validateViewNameAsync(name: string, existing: ViewInfo, isGlobal: boolean): Promise<string>;
     /** Update all aspects of a view's metadata.*/
     updateViewInfoAsync(view: ViewInfo, updates: ViewUpdateSpec): Promise<View<T>>;
-    /** Promote a view to global visibility/ownership status. */
-    makeViewGlobalAsync(view: ViewInfo): Promise<View<T>>;
     deleteViewsAsync(toDelete: ViewInfo[]): Promise<void>;
     /**
      * Called by {@link ViewManagerProvider} to receive state changes from this model.

package/build/types/desktop/cmp/viewmanager/dialog/ManageDialogModel.d.ts

@@ -28,12 +28,10 @@ export declare class ManageDialogModel extends HoistModel {
     doLoadAsync(loadSpec: LoadSpec): Promise<void>;
     deleteAsync(views: ViewInfo[]): Promise<void>;
     updateAsync(view: ViewInfo, update: ViewUpdateSpec): Promise<void>;
-    makeGlobalAsync(view: ViewInfo): Promise<void>;
     togglePinned(views: ViewInfo[]): void;
     private init;
     private doUpdateAsync;
     private doDeleteAsync;
-    private doMakeGlobalAsync;
     private selectViewAsync;
     private createGridModel;
     private createTabContainerModel;

package/build/types/desktop/cmp/viewmanager/dialog/Utils.d.ts

@@ -1,3 +1,11 @@
 import { ViewManagerModel } from '@xh/hoist/cmp/viewmanager';
 import { SelectOption } from '@xh/hoist/core';
-export declare function getGroupOptions(model: ViewManagerModel, type: 'owned' | 'global'): SelectOption[];
+export declare function getGroupOptions(vmm: ViewManagerModel, isGlobal: boolean): SelectOption[];
+/**
+ * Support for "Visibility" concept used in default view editing/creation.
+ * This tri-state selection will translate into boolean `isGlobal` and `isShared`
+ * flag settings.
+ */
+export type Visibility = 'private' | 'shared' | 'global';
+export declare function getVisibilityOptions(vmm: ViewManagerModel): SelectOption[];
+export declare function getVisibilityInfo(vmm: ViewManagerModel, val: Visibility): string;

package/cmp/viewmanager/DataAccess.ts

@@ -88,17 +88,6 @@ export class DataAccess<T> {
         }
     }
 
-    /** Promote a view to global visibility/ownership status. */
-    async makeViewGlobalAsync(view: ViewInfo): Promise<View<T>> {
-        try {
-            this.ensureEditable(view);
-            const raw = await XH.fetchJson({url: 'xhView/makeGlobal', params: {token: view.token}});
-            return View.fromBlob(raw, this.model);
-        } catch (e) {
-            throw XH.exception({message: `Unable to update ${view.typedName}`, cause: e});
-        }
-    }
-
     /** Update a view's value. */
     async updateViewValueAsync(view: View<T>, value: Partial<T>): Promise<View<T>> {
         try {

package/cmp/viewmanager/ViewInfo.ts

@@ -41,13 +41,6 @@ export class ViewInfo {
     /** Optional group name used for bucketing this view in display. */
     readonly group: string;
 
-    /**
-     * True if this view should be pinned by default to all users' menus, where it will appear
-     * unless the user has explicitly unpinned it. Only applicable for global views, can be enabled
-     * by view managers to promote especially important global views and ensure users see them.
-     */
-    readonly isDefaultPinned: boolean;
-
     /**
      * Original meta-data on views associated JsonBlob.
      * Not typically used by applications.
@@ -73,7 +66,6 @@ export class ViewInfo {
         this.isGlobal = !this.owner;
 
         this.group = this.meta.group ?? null;
-        this.isDefaultPinned = !!(this.isGlobal && this.meta.isDefaultPinned);
         this.isShared = !!(!this.isGlobal && this.meta.isShared);
 
         // Round to seconds.  See: https://github.com/xh/hoist-core/issues/423
@@ -98,11 +90,13 @@ export class ViewInfo {
     /**
      * True if this view should appear on the users easy access menu.
      *
-     * This value is computed with the user persisted state along with the View's
-     * `defaultPinned` property.
+     * This value is computed with the user persisted state for the view.
+     *
+     * If the user has not set pinning state for the view, global views and
+     * owned views are pinned by default.
      */
     get isPinned(): boolean {
-        return this.isUserPinned ?? this.isDefaultPinned;
+        return this.isUserPinned ?? (this.isGlobal || this.isOwned);
     }
 
     /**

package/cmp/viewmanager/ViewManagerModel.ts

@@ -32,17 +32,12 @@ export interface ViewCreateSpec {
     group: string;
     description: string;
     isShared: boolean;
-    isPinned: boolean;
+    isGlobal: boolean;
+    isPinned?: boolean;
     value: PlainObject;
 }
 
-export interface ViewUpdateSpec {
-    name?: string;
-    group?: string;
-    description?: string;
-    isShared?: boolean;
-    isDefaultPinned?: boolean;
-}
+export type ViewUpdateSpec = Partial<Omit<ViewCreateSpec, 'value'>>;
 
 export interface ViewUserState {
     currentView?: string;
@@ -466,14 +461,24 @@ export class ViewManagerModel<T = PlainObject> extends HoistModel {
     //-----------------
     // Management
     //-----------------
-    async validateViewNameAsync(name: string, existing: ViewInfo = null): Promise<string> {
+    /**
+     * Validate a name for a view.
+     * @param name - candidate name to validate
+     * @param existing - existing view that will have the name.  null if the name is for a new view.
+     * @param isGlobal - true if the name is for a global view.
+     */
+    async validateViewNameAsync(
+        name: string,
+        existing: ViewInfo,
+        isGlobal: boolean
+    ): Promise<string> {
         const maxLength = 50;
         name = name?.trim();
         if (!name) return 'Name is required';
         if (name.length > maxLength) {
             return `Name cannot be longer than ${maxLength} characters`;
         }
-        const views = existing?.isGlobal ? this.globalViews : this.ownedViews;
+        const views = isGlobal ? this.globalViews : this.ownedViews;
         if (views.some(view => view.name === name && view.token != existing?.token)) {
             return `A ${this.typeDisplayName} with name '${name}' already exists.`;
         }
@@ -485,11 +490,6 @@ export class ViewManagerModel<T = PlainObject> extends HoistModel {
         return this.dataAccess.updateViewInfoAsync(view, updates);
     }
 
-    /** Promote a view to global visibility/ownership status. */
-    async makeViewGlobalAsync(view: ViewInfo): Promise<View<T>> {
-        return this.dataAccess.makeViewGlobalAsync(view);
-    }
-
     async deleteViewsAsync(toDelete: ViewInfo[]): Promise<void> {
         let exception;
         try {

package/desktop/cmp/viewmanager/dialog/ManageDialogModel.ts

@@ -122,10 +122,6 @@ export class ManageDialogModel extends HoistModel {
         return this.doUpdateAsync(view, update).linkTo(this.updateTask).catchDefault();
     }
 
-    async makeGlobalAsync(view: ViewInfo) {
-        return this.doMakeGlobalAsync(view).linkTo(this.updateTask).catchDefault();
-    }
-
     @action
     togglePinned(views: ViewInfo[]) {
         const allPinned = every(views, 'isPinned'),
@@ -177,9 +173,10 @@ export class ManageDialogModel extends HoistModel {
 
     private async doUpdateAsync(view: ViewInfo, update: ViewUpdateSpec) {
         const {viewManagerModel} = this;
-        await viewManagerModel.updateViewInfoAsync(view, update);
+        const updated = await viewManagerModel.updateViewInfoAsync(view, update);
         await viewManagerModel.refreshAsync();
         await this.refreshAsync();
+        await this.selectViewAsync(updated.info); // reselect -- may have moved tabs!
     }
 
     private async doDeleteAsync(views: ViewInfo[]) {
@@ -219,40 +216,6 @@ export class ManageDialogModel extends HoistModel {
         return viewManagerModel.deleteViewsAsync(views).finally(() => this.refreshAsync());
     }
 
-    private async doMakeGlobalAsync(view: ViewInfo) {
-        const {globalDisplayName, typeDisplayName, globalViews} = this.viewManagerModel,
-            {typedName} = view;
-
-        if (some(globalViews, {name: view.name})) {
-            XH.alert({
-                title: 'Alert',
-                message: `There is already a ${globalDisplayName} ${typedName}. Please rename or edit it instead.`
-            });
-            return;
-        }
-
-        const msgs = [
-            `The ${typedName} will become a ${globalDisplayName} ${typeDisplayName} visible to all other ${XH.appName} users.`,
-            strong('Are you sure you want to proceed?')
-        ];
-        const confirmed = await XH.confirm({
-            message: fragment(msgs.map(m => p(m))),
-            confirmProps: {
-                text: `Yes, change visibility`,
-                outlined: true,
-                autoFocus: false,
-                intent: 'primary'
-            }
-        });
-        if (!confirmed) return;
-
-        const {viewManagerModel} = this;
-        const updated = await viewManagerModel.makeViewGlobalAsync(view);
-        await viewManagerModel.refreshAsync();
-        await this.refreshAsync();
-        await this.selectViewAsync(updated.info); // reselect -- will have moved tabs!
-    }
-
     private async selectViewAsync(view: ViewInfo) {
         this.tabContainerModel.activateTab(
             view.isOwned ? 'owned' : view.isGlobal ? 'global' : 'shared'
@@ -362,7 +325,7 @@ export class ManageDialogModel extends HoistModel {
                         Icon.globe(),
                         `This tab shows ${globalViews} available to everyone.`,
                         br(),
-                        `${capitalize(globalViews)} can be set to appear automatically in everyone's menu, but you can choose which ${views} you would like to see by pinning/unpinning them at any time.`
+                        `${capitalize(globalViews)} appear by default in everyone's menu, but you can choose which ${views} you would like to see by pinning/unpinning them at any time.`
                     )
                 })
             });

package/desktop/cmp/viewmanager/dialog/SaveAsDialog.ts

@@ -6,17 +6,17 @@
  */
 
 import {form} from '@xh/hoist/cmp/form';
-import {filler, hbox, vframe} from '@xh/hoist/cmp/layout';
+import {filler, vframe} from '@xh/hoist/cmp/layout';
 import {hoistCmp, uses} from '@xh/hoist/core';
 import {button} from '@xh/hoist/desktop/cmp/button';
 import {formField} from '@xh/hoist/desktop/cmp/form';
-import {select, switchInput, textArea, textInput} from '@xh/hoist/desktop/cmp/input';
+import {select, textArea, textInput} from '@xh/hoist/desktop/cmp/input';
 import {panel} from '@xh/hoist/desktop/cmp/panel';
 import {toolbar} from '@xh/hoist/desktop/cmp/toolbar';
 import {dialog} from '@xh/hoist/kit/blueprint';
 import {startCase} from 'lodash';
 import {SaveAsDialogModel} from './SaveAsDialogModel';
-import {getGroupOptions} from './Utils';
+import {getGroupOptions, getVisibilityOptions, getVisibilityInfo} from './Utils';
 
 /**
  * Default Save As dialog used by ViewManager.
@@ -43,6 +43,13 @@ export const saveAsDialog = hoistCmp.factory<SaveAsDialogModel>({
 
 const formPanel = hoistCmp.factory<SaveAsDialogModel>({
     render({model}) {
+        const {parent, formModel} = model,
+            {visibility} = formModel.values,
+            isGlobal = visibility === 'global',
+            groupOptions = getGroupOptions(parent, isGlobal),
+            visOptions = getVisibilityOptions(parent),
+            visInfo = getVisibilityInfo(parent, visibility);
+
         return panel({
             item: form({
                 fieldDefaults: {
@@ -69,7 +76,7 @@ const formPanel = hoistCmp.factory<SaveAsDialogModel>({
                                 enableCreate: true,
                                 enableClear: true,
                                 placeholder: 'Select optional group....',
-                                options: getGroupOptions(model.parent, 'owned')
+                                options: groupOptions
                             })
                         }),
                         formField({
@@ -79,15 +86,12 @@ const formPanel = hoistCmp.factory<SaveAsDialogModel>({
                                 height: 70
                             })
                         }),
-                        hbox(
-                            formField({
-                                field: 'isShared',
-                                label: 'Share?',
-                                labelTextAlign: 'left',
-                                omit: !model.parent.enableSharing,
-                                item: switchInput()
-                            })
-                        )
+                        formField({
+                            field: 'visibility',
+                            omit: visOptions.length === 1,
+                            item: select({options: visOptions, enableFilter: false}),
+                            info: visInfo
+                        })
                     ]
                 })
             }),

package/desktop/cmp/viewmanager/dialog/SaveAsDialogModel.ts

@@ -6,9 +6,11 @@
  */
 
 import {FormModel} from '@xh/hoist/cmp/form';
+import {p, strong} from '@xh/hoist/cmp/layout';
 import {HoistModel, managed, XH} from '@xh/hoist/core';
 import {makeObservable, action, observable} from '@xh/hoist/mobx';
 import {ViewManagerModel} from '@xh/hoist/cmp/viewmanager';
+import {some} from 'lodash';
 
 /**
  * Backing model for ViewManagerModel's SaveAs
@@ -30,15 +32,14 @@ export class SaveAsDialogModel extends HoistModel {
     open() {
         const {parent, formModel} = this,
             src = parent.view,
-            name = parent.ownedViews.some(it => it.name === src.name)
-                ? `Copy of ${src.name}`
-                : src.name;
+            name = some(parent.ownedViews, {name: src.name}) ? `Copy of ${src.name}` : src.name;
 
         formModel.init({
             name,
             group: src.group,
             description: src.description,
-            isShared: false
+            visibility: 'private',
+            isPinned: !!src.info?.isPinned
         });
 
         this.isOpen = true;
@@ -52,7 +53,6 @@ export class SaveAsDialogModel extends HoistModel {
     async saveAsAsync() {
         try {
             await this.doSaveAsAsync().linkTo(this.parent.saveTask);
-            this.close();
         } catch (e) {
             XH.handleException(e);
         }
@@ -66,29 +66,60 @@ export class SaveAsDialogModel extends HoistModel {
             fields: [
                 {
                     name: 'name',
-                    rules: [({value}) => this.parent.validateViewNameAsync(value)]
+                    rules: [
+                        ({value}, {visibility}) => {
+                            return this.parent.validateViewNameAsync(
+                                value,
+                                null,
+                                visibility === 'global'
+                            );
+                        }
+                    ]
                 },
                 {name: 'group'},
                 {name: 'description'},
-                {name: 'isShared'}
+                {name: 'visibility'}
             ]
         });
     }
 
     private async doSaveAsAsync() {
         let {formModel, parent} = this,
-            {name, group, description, isShared} = formModel.getData(),
-            isValid = await formModel.validateAsync();
+            {typeDisplayName, globalDisplayName} = parent,
+            {name, group, description, visibility} = formModel.getData(),
+            isValid = await formModel.validateAsync(),
+            isGlobal = visibility === 'global',
+            isShared = visibility === 'shared';
 
         if (!isValid) return;
 
-        return parent.saveAsAsync({
+        if (isGlobal) {
+            const message = [
+                p(
+                    `This ${typeDisplayName} will become a ${globalDisplayName} ${typeDisplayName} visible to all other ${XH.appName} users.`
+                ),
+                p(strong('Are you sure you want to proceed?'))
+            ];
+            const confirmed = await XH.confirm({
+                message,
+                confirmProps: {
+                    text: `Yes, save ${globalDisplayName} ${typeDisplayName}`,
+                    outlined: true,
+                    autoFocus: false,
+                    intent: 'primary'
+                }
+            });
+            if (!confirmed) return;
+        }
+
+        await parent.saveAsAsync({
             name: name.trim(),
             group: group?.trim(),
             description: description?.trim(),
-            isPinned: true,
+            isGlobal,
             isShared,
             value: parent.getValue()
         });
+        this.close();
     }
 }

package/desktop/cmp/viewmanager/dialog/Utils.ts

@@ -7,12 +7,44 @@
 
 import {ViewManagerModel} from '@xh/hoist/cmp/viewmanager';
 import {SelectOption} from '@xh/hoist/core';
-import {map, uniq} from 'lodash';
+import {pluralize} from '@xh/hoist/utils/js';
+import {capitalize, map, startCase, uniq} from 'lodash';
 
-export function getGroupOptions(model: ViewManagerModel, type: 'owned' | 'global'): SelectOption[] {
-    const views = type == 'owned' ? model.ownedViews : model.globalViews;
+export function getGroupOptions(vmm: ViewManagerModel, isGlobal: boolean): SelectOption[] {
+    const views = isGlobal ? vmm.globalViews : vmm.ownedViews;
     return uniq(map(views, 'group'))
         .sort()
         .filter(g => g != null)
         .map(g => ({label: g, value: g}));
 }
+
+/**
+ * Support for "Visibility" concept used in default view editing/creation.
+ * This tri-state selection will translate into boolean `isGlobal` and `isShared`
+ * flag settings.
+ */
+export type Visibility = 'private' | 'shared' | 'global';
+
+export function getVisibilityOptions(vmm: ViewManagerModel): SelectOption[] {
+    const ret = [{value: 'private', label: 'Private'}];
+    if (vmm.enableSharing) {
+        ret.push({value: 'shared', label: 'Shared'});
+    }
+    if (vmm.enableGlobal && vmm.manageGlobal) {
+        ret.push({value: 'global', label: startCase(vmm.globalDisplayName)});
+    }
+    return ret;
+}
+
+export function getVisibilityInfo(vmm: ViewManagerModel, val: Visibility): string {
+    switch (val) {
+        case 'private':
+            return 'Visible to you only.';
+        case 'shared':
+            return `Visible to all users via the "Manage ${capitalize(pluralize(vmm.typeDisplayName))}" dialog.`;
+        case 'global':
+            return `Visible to all users and automatically pinned to their menus.`;
+        default:
+            return '';
+    }
+}

package/desktop/cmp/viewmanager/dialog/ViewPanel.ts

@@ -10,13 +10,16 @@ import {div, filler, hbox, hspacer, span, vbox, vframe, vspacer} from '@xh/hoist
 import {hoistCmp, uses, XH} from '@xh/hoist/core';
 import {button} from '@xh/hoist/desktop/cmp/button';
 import {formField} from '@xh/hoist/desktop/cmp/form';
-import {select, switchInput, textArea, textInput} from '@xh/hoist/desktop/cmp/input';
+import {select, textArea, textInput} from '@xh/hoist/desktop/cmp/input';
 import {panel} from '@xh/hoist/desktop/cmp/panel';
 import {ViewPanelModel} from '@xh/hoist/desktop/cmp/viewmanager/dialog/ViewPanelModel';
-import {getGroupOptions} from '@xh/hoist/desktop/cmp/viewmanager/dialog/Utils';
+import {
+    getGroupOptions,
+    getVisibilityInfo,
+    getVisibilityOptions
+} from '@xh/hoist/desktop/cmp/viewmanager/dialog/Utils';
 import {fmtDateTime} from '@xh/hoist/format';
 import {Icon} from '@xh/hoist/icon';
-import {capitalize, some} from 'lodash';
 
 /**
  * Form to edit or view details on a single saved view within the ViewManager manage dialog.
@@ -24,11 +27,17 @@ import {capitalize, some} from 'lodash';
 export const viewPanel = hoistCmp.factory({
     model: uses(ViewPanelModel),
     render({model}) {
-        const {view} = model;
+        const {view, parent, formModel} = model,
+            {viewManagerModel} = parent;
+
         if (!view) return null;
 
-        const {isGlobal, lastUpdated, lastUpdatedBy, isEditable} = view,
-            {enableSharing} = model.parent.viewManagerModel;
+        const {lastUpdated, lastUpdatedBy, isEditable} = view,
+            visibility = formModel.values.visibility,
+            isGlobal = visibility === 'global',
+            visOptions = getVisibilityOptions(viewManagerModel),
+            visInfo = getVisibilityInfo(viewManagerModel, visibility),
+            groupOptions = getGroupOptions(viewManagerModel, isGlobal);
 
         return panel({
             item: form({
@@ -52,10 +61,7 @@ export const viewPanel = hoistCmp.factory({
                             item: select({
                                 enableCreate: true,
                                 enableClear: true,
-                                options: getGroupOptions(
-                                    model.parent.viewManagerModel,
-                                    view.isOwned ? 'owned' : 'global'
-                                )
+                                options: groupOptions
                             }),
                             readonlyRenderer: v =>
                                 v || span({item: 'None provided', className: 'xh-text-color-muted'})
@@ -70,22 +76,10 @@ export const viewPanel = hoistCmp.factory({
                                 v || span({item: 'None provided', className: 'xh-text-color-muted'})
                         }),
                         formField({
-                            field: 'isShared',
-                            label: 'Shared?',
-                            inline: true,
-                            item: switchInput(),
-                            readonlyRenderer: v => (v ? 'Yes' : 'No'),
-                            omit: !enableSharing || isGlobal || !isEditable
-                        }),
-                        formField({
-                            field: 'isDefaultPinned',
-                            label: null,
-                            inline: true,
-                            item: switchInput({
-                                label: `Pin to everyone's menu by default`,
-                                labelSide: 'left'
-                            }),
-                            omit: !isGlobal || !isEditable
+                            field: 'visibility',
+                            omit: !isEditable || visOptions.length === 1,
+                            item: select({options: visOptions, enableFilter: false}),
+                            info: visInfo
                         }),
                         vspacer(),
                         formButtons(),
@@ -130,8 +124,6 @@ const formButtons = hoistCmp.factory<ViewPanelModel>({
             });
         }
 
-        const {enableGlobal, globalDisplayName, manageGlobal, globalViews} =
-            parent.viewManagerModel;
         return vbox({
             style: {gap: 10, alignItems: 'center'},
             items: [
@@ -145,15 +137,6 @@ const formButtons = hoistCmp.factory<ViewPanelModel>({
                     outlined: true,
                     onClick: () => parent.togglePinned([view])
                 }),
-                button({
-                    text: `Promote to ${capitalize(globalDisplayName)}`,
-                    icon: Icon.globe(),
-                    width: 200,
-                    outlined: true,
-                    disabled: some(globalViews, {name: view.name}),
-                    omit: readonly || view.isGlobal || !enableGlobal || !manageGlobal,
-                    onClick: () => parent.makeGlobalAsync(view)
-                }),
                 button({
                     text: 'Delete',
                     icon: Icon.delete(),