Library panels: Normalize feature name as "Library panels" (#33540)

packages/grafana-ui/src/components/Icon/Icon.tsx

@@ -7,7 +7,7 @@ import { IconName, IconType, IconSize } from '../../types/icon';
 import SVG from 'react-inlinesvg';
 import { cacheInitialized, initIconCache, iconRoot } from './iconBundle';
 
-const alwaysMonoIcons: IconName[] = ['grafana', 'favorite', 'heart-break', 'heart', 'panel-add', 'reusable-panel'];
+const alwaysMonoIcons: IconName[] = ['grafana', 'favorite', 'heart-break', 'heart', 'panel-add', 'library-panel'];
 
 export interface IconProps extends React.HTMLAttributes<HTMLDivElement> {
   name: IconName;

packages/grafana-ui/src/components/Icon/iconBundle.ts

@@ -140,7 +140,7 @@ import u1131 from '!!raw-loader!../../../../../public/img/icons/mono/grafana.svg
 import u1132 from '!!raw-loader!../../../../../public/img/icons/mono/heart.svg';
 import u1133 from '!!raw-loader!../../../../../public/img/icons/mono/heart-break.svg';
 import u1134 from '!!raw-loader!../../../../../public/img/icons/mono/panel-add.svg';
-import u1135 from '!!raw-loader!../../../../../public/img/icons/mono/reusable-panel.svg';
+import u1135 from '!!raw-loader!../../../../../public/img/icons/mono/library-panel.svg';
 
 function cacheItem(content: string, path: string) {
   cacheStore[iconRoot + path] = { content, status: 'loaded', queue: [] };
@@ -290,5 +290,5 @@ export function initIconCache() {
   cacheItem(u1132, 'mono/heart.svg');
   cacheItem(u1133, 'mono/heart-break.svg');
   cacheItem(u1134, 'mono/panel-add.svg');
-  cacheItem(u1135, 'mono/reusable-panel.svg');
+  cacheItem(u1135, 'mono/library-panel.svg');
 }

packages/grafana-ui/src/types/icon.ts

@@ -112,7 +112,7 @@ export type IconName =
   | 'power'
   | 'question-circle'
   | 'repeat'
-  | 'reusable-panel'
+  | 'library-panel'
   | 'rocket'
   | 'save'
   | 'search-minus'
@@ -248,7 +248,7 @@ export const getAvailableIcons = (): IconName[] => [
   'power',
   'question-circle',
   'repeat',
-  'reusable-panel',
+  'library-panel',
   'rocket',
   'save',
   'search-minus',

pkg/api/index.go

@@ -168,10 +168,10 @@ func (hs *HTTPServer) getNavTree(c *models.ReqContext, hasEditPerm bool) ([]*dto
 			Icon: "camera",
 		})
 		dashboardChildNavs = append(dashboardChildNavs, &dtos.NavLink{
-			Text: "Global panels",
+			Text: "Library panels",
 			Id:   "library-panels",
 			Url:  hs.Cfg.AppSubURL + "/library-panels",
-			Icon: "reusable-panel",
+			Icon: "library-panel",
 		})
 	}
 

public/app/features/dashboard/components/PanelEditor/PanelEditor.tsx

@@ -354,7 +354,7 @@ export class PanelEditorUnconnected extends PureComponent<Props> {
                     isOpen: true,
                   });
                 }}
-                title="Disconnects this panel from the reusable panel so that you can edit it regularly."
+                title="Disconnects this panel from the library panel so that you can edit it regularly."
                 key="unlink"
               >
                 Unlink

public/app/features/dashboard/components/PanelEditor/VisualizationSelectPane.tsx

@@ -80,7 +80,7 @@ export const VisualizationSelectPane: FC<Props> = ({ panel }) => {
     { label: 'Visualizations', value: ListMode.Visualizations },
     {
       label: 'Library panels',
-      value: ListMode.Globals,
+      value: ListMode.LibraryPanels,
       description: 'Reusable panels you can share between multiple dashboards.',
     },
   ];
@@ -124,7 +124,7 @@ export const VisualizationSelectPane: FC<Props> = ({ panel }) => {
                 onClose={() => {}}
               />
             )}
-            {listMode === ListMode.Globals && (
+            {listMode === ListMode.LibraryPanels && (
               <PanelLibraryOptionsGroup searchQuery={searchQuery} panel={panel} key="Panel Library" />
             )}
           </div>
@@ -136,7 +136,7 @@ export const VisualizationSelectPane: FC<Props> = ({ panel }) => {
 
 enum ListMode {
   Visualizations,
-  Globals,
+  LibraryPanels,
 }
 
 VisualizationSelectPane.displayName = 'VisualizationSelectPane';

public/app/features/dashboard/components/PanelEditor/getPanelFrameOptions.tsx

@@ -19,7 +19,7 @@ export function getPanelFrameCategory(props: OptionPaneRenderProps): OptionsPane
   if (isPanelModelLibraryPanel(panel)) {
     descriptor.addItem(
       new OptionsPaneItemDescriptor({
-        title: 'Global panel information',
+        title: 'Library panel information',
         render: function renderLibraryPanelInformation() {
           return <LibraryPanelInformation panel={panel} formatDate={dashboard.formatDate} />;
         },

public/app/features/dashboard/components/ShareModal/ShareLibraryPanel.tsx

@@ -8,14 +8,14 @@ interface Props {
   initialFolderId?: number;
 }
 
-export const ShareGlobalPanel = ({ panel, initialFolderId, onDismiss }: Props) => {
+export const ShareLibraryPanel = ({ panel, initialFolderId, onDismiss }: Props) => {
   if (!panel) {
     return null;
   }
 
   return (
     <>
-      <p className="share-modal-info-text">Add this panel to the panel library.</p>
+      <p className="share-modal-info-text">Create library panel.</p>
       <AddLibraryPanelContents panel={panel} initialFolderId={initialFolderId} onDismiss={onDismiss!} />
     </>
   );

public/app/features/dashboard/components/ShareModal/ShareModal.tsx

@@ -8,7 +8,7 @@ import { ShareExport } from './ShareExport';
 import { ShareEmbed } from './ShareEmbed';
 import { ShareModalTabModel } from './types';
 import { contextSrv } from 'app/core/core';
-import { ShareGlobalPanel } from './ShareGlobalPanel';
+import { ShareLibraryPanel } from './ShareLibraryPanel';
 
 const customDashboardTabs: ShareModalTabModel[] = [];
 const customPanelTabs: ShareModalTabModel[] = [];
@@ -42,7 +42,7 @@ function getTabs(props: Props) {
     tabs.push({ label: 'Embed', value: 'embed', component: ShareEmbed });
 
     if (!isPanelModelLibraryPanel(panel)) {
-      tabs.push({ label: 'Global panel', value: 'global_panel', component: ShareGlobalPanel });
+      tabs.push({ label: 'Library panel', value: 'library_panel', component: ShareLibraryPanel });
     }
     tabs.push(...customPanelTabs);
   } else {

public/app/features/dashboard/dashgrid/PanelHeader/PanelHeader.tsx

@@ -48,7 +48,7 @@ export const PanelHeader: FC<Props> = ({ panel, error, isViewing, isEditing, dat
             return (
               <div className="panel-title">
                 <PanelHeaderNotices frames={data.series} panelId={panel.id} />
-                {panel.libraryPanel && <Icon name="reusable-panel" style={{ marginRight: '4px' }} />}
+                {panel.libraryPanel && <Icon name="library-panel" style={{ marginRight: '4px' }} />}
                 {alertState ? (
                   <Icon
                     name={alertState === 'alerting' ? 'heart-break' : 'heart'}

public/app/features/dashboard/utils/getPanelMenu.test.ts

@@ -72,7 +72,7 @@ describe('getPanelMenu', () => {
             },
             Object {
               "onClick": [Function],
-              "text": "To global panel",
+              "text": "Create library panel",
             },
           ],
           "text": "More...",

public/app/features/dashboard/utils/getPanelMenu.ts

@@ -169,12 +169,12 @@ export function getPanelMenu(
 
     if (isPanelModelLibraryPanel(panel)) {
       subMenu.push({
-        text: 'Unlink global panel',
+        text: 'Unlink library panel',
         onClick: onUnlinkLibraryPanel,
       });
     } else {
       subMenu.push({
-        text: 'To global panel',
+        text: 'Create library panel',
         onClick: onAddLibraryPanel,
       });
     }

public/app/features/library-panels/components/AddLibraryPanelModal/AddLibraryPanelModal.tsx

@@ -33,7 +33,7 @@ export const AddLibraryPanelContents = ({ panel, initialFolderId, onDismiss }: A
             saveLibraryPanel(panel, folderId!).then(() => onDismiss());
           }}
         >
-          Add panel to the panel library
+          Create library panel
         </Button>
       </Modal.ButtonRow>
     </>
@@ -46,7 +46,7 @@ interface Props extends AddLibraryPanelContentsProps {
 
 export const AddLibraryPanelModal: React.FC<Props> = ({ isOpen = false, panel, initialFolderId, ...props }) => {
   return (
-    <Modal title="Add this panel to the panel library" isOpen={isOpen} onDismiss={props.onDismiss}>
+    <Modal title="Create library panel" isOpen={isOpen} onDismiss={props.onDismiss}>
       <AddLibraryPanelContents panel={panel} initialFolderId={initialFolderId} onDismiss={props.onDismiss} />
     </Modal>
   );

public/app/features/library-panels/components/LibraryPanelsView/LibraryPanelsView.tsx

@@ -62,7 +62,7 @@ export const LibraryPanelsView: React.FC<LibraryPanelViewProps> = ({
         ) : (
           libraryPanels?.map((item, i) => (
             <LibraryPanelCard
-              key={`shared-panel=${i}`}
+              key={`library-panel=${i}`}
               libraryPanel={item}
               onDelete={onDelete}
               onClick={onClickCard}

public/app/features/library-panels/components/PanelLibraryOptionsGroup/PanelLibraryOptionsGroup.tsx

@@ -76,7 +76,7 @@ export const PanelLibraryOptionsGroup: FC<Props> = ({ panel, searchQuery }) => {
       {!panel.libraryPanel && (
         <VerticalGroup align="center">
           <Button icon="plus" onClick={onAddToPanelLibrary} variant="secondary" fullWidth>
-            Add current panel to library
+            Create new library panel
           </Button>
         </VerticalGroup>
       )}