@mikezimm/fps-library-v2
Version:
Library of reusable typescript/javascript functions, interfaces and constants
197 lines (195 loc) • 14 kB
JavaScript
/**
* CodeAnalizerComment: Updated 4 imports on 2024-09-22 14:49:52
* Update:: import { IBannerPages } to '@mikezimm/fps-core-v7/lib/banner/mainReact/IWebpartBannerProps;'
* Update:: import { IWebpartBannerProps } to '@mikezimm/fps-core-v7/lib/banner/mainReact/IWebpartBannerProps;'
* Update:: import { PanelType } to '@mikezimm/fps-core-v7/lib/types/@fluentUI/@7.199.1/Panel;'
* Update:: import { IFPSWindow } to '@mikezimm/fps-core-v7/lib/banner/features/FPSDOM/Window;'
*/
/**
* CodeAnalizerComment: Updated 4 imports on 2024-09-21 23:07:24
* Update:: import { PivotLinkFormat } to '@mikezimm/fps-core-v7/lib/types/@fluentUI/@7.199.1/Pivot;'
* Update:: import { PivotLinkSize } to '@mikezimm/fps-core-v7/lib/types/@fluentUI/@7.199.1/Pivot;'
* Update:: import { IFPSWindow } to '@mikezimm/fps-core-v7/lib/banner/features/FPSDOM/Window;'
* Update:: import { check4This } to '@mikezimm/fps-core-v7/lib/logic/Links/CheckSearch;'
*/
import * as React from 'react';
import WebPartLinks from "../components/WebPartLinks/WebPartLinks";
import { createPerformanceTableVisitor } from '../../components/molecules/Performance/tables';
import ReactJson from '@microlink/react-json-view';
import { MessageBar, MessageBarType, } from '@fluentui/react/lib/MessageBar';
import { PanelType } from '@fluentui/react/lib/Panel';
import { PivotLinkFormat, PivotLinkSize } from '@fluentui/react/lib/Pivot';
import { Pivot, PivotItem, } from '@fluentui/react/lib/Pivot';
import SinglePage from '../components/SingleHelpPage/SinglePage';
import { Icon } from '@fluentui/react/lib/Icon';
import { getHistoryContent } from '../features/WebPartHistory/HistoryContent';
import { check4This, Check4 } from '@mikezimm/fps-core-v7/lib/logic/Links/CheckSearch';
import { visitorPanelInfo } from '../components/VisitorPanel/VisitorPanelComponent';
import { getWebPartVersionElement } from './VersionElement';
const HX = 'OOTBHelpPanel'; //2022-01-31: Added Pivot Tiles
const H0 = 'Why'; //2022-01-31: Added Pivot Tiles
const H1 = 'Getting started'; //Templates
const H2 = 'Basics'; //Templates
const H3 = 'Advanced'; //Templates
const H4 = 'Future'; //Templates
const H5 = 'Dev'; //Templates
const H6 = 'Errors'; //Templates
const H7 = 'Tricks'; //Templates
const H8 = 'About'; //Templates
const H9 = 'Export'; //Templates
const HA = 'History'; //Templates
const HB = 'Health'; //Templates
export const pivotHeadingX = HX;
export const pivotHeading0 = H0;
// Added contentPages to params for https://github.com/mikezimm/fps-library-v2/issues/9
export function getFullPanel(bannerProps, selectedKey, panelType, _selectedIndex, _panelWidth, contentPages) {
const { gitHubRepo, showRepoLinks, replacePanelWarning, replacePanelHTML, exportProps, webpartHistory } = bannerProps;
const { fpsCert } = bannerProps;
const webPartLinks = React.createElement(WebPartLinks, { parentListURL: '', childListURL: '', parentListName: '', childListName: '', repoObject: gitHubRepo, showRepoLinks: showRepoLinks });
const thisWindow = window;
let content = null;
let thisPage = null;
// let showMedical = this.isShowTricks && ( thisWindow.FPSUser || thisWindow.FPSOptions ) ? true : false;
let showMedical = bannerProps.showTricks === true && (thisWindow.FPSUser || thisWindow.FPSOptions) ? true : false;
if (check4This(Check4.showFPS_Eq_true) === true)
showMedical = true;
const bonusHTML1 = bannerProps.bonusHTML1 ? bannerProps.bonusHTML1 : null;
const panelPerformance = bannerProps.panelPerformance ? createPerformanceTableVisitor(bannerProps.panelPerformance, []) : null;
if (check4This(Check4.tracePerformance_Eq_true) === true)
console.log(`tracePerformance getFullPanel ~ 59`, JSON.parse(JSON.stringify(bannerProps.panelPerformance)));
const bonusHTML2 = bannerProps.bonusHTML2 ? bannerProps.bonusHTML2 : null;
// const xxxxxacePanelHTML = visitorPanelInfo( properties, setup.main._repoLink, '', '', createPerformanceTableVisitor( setup.main._performance, setup.main._keysToShow ), 'mainWebPartRenderBannerSetupX' );
const replacePanelHTMLX = visitorPanelInfo(bannerProps, gitHubRepo, '', '', null, 'getFullPanel');
if (selectedKey === HX) {
console.log('Banner component -build content');
content = React.createElement("div", null,
React.createElement("div", { style: { padding: '10px 20px 20px 20px', background: 'yellow', marginTop: '20px' } }, replacePanelWarning),
React.createElement("div", null, replacePanelHTMLX),
bonusHTML1 ? React.createElement("div", null, bonusHTML1) : null,
React.createElement("div", null, bannerProps.versionInfo),
panelPerformance ? React.createElement("div", null,
"getFullPanel",
panelPerformance) : null,
bonusHTML2 ? React.createElement("div", null, bonusHTML2) : null);
}
else if (selectedKey === H1) {
content = contentPages.gettingStartedContent;
}
else if (selectedKey === H2) {
content = contentPages.basicsContent;
}
else if (selectedKey === H3) {
content = contentPages.advancedContent;
}
else if (selectedKey === H4) {
content = contentPages.futureContent;
// } else if ( selectedKey === H5 ) {
// content= this.dev;
}
else if (selectedKey === H6) {
content = contentPages.errorsContent;
}
else if (selectedKey === H7) {
content = contentPages.tricksTable;
}
else if (selectedKey === H8) {
content = contentPages.aboutTable;
}
else if (selectedKey === H0) { //2022-01-31: Added Pivot Tiles
content = contentPages.whyContent;
}
else if (selectedKey === H9) { //2022-01-31: Added Pivot Tiles
content = React.createElement("div", { id: "CommandsJSONPanel", style: { paddingTop: '20px' } },
React.createElement("h3", null, "Summary of Exportable Properties"),
React.createElement(ReactJson, { src: exportProps, name: 'Export Properties', collapsed: false, displayDataTypes: true, displayObjectSize: true, enableClipboard: true, style: { padding: '10px 0px' } }),
React.createElement(ReactJson, { src: webpartHistory, name: 'Webpart History', collapsed: 2, displayDataTypes: true, displayObjectSize: true, enableClipboard: true, style: { padding: '10px 0px' } }));
}
else if (selectedKey === HA) { //2022-01-31: Added Pivot Tiles
content = getHistoryContent(bannerProps.webpartHistory);
}
else if (selectedKey === HB) { //2022-01-31: Added Pivot Tiles
if (showMedical === true) {
let medicalElements = [];
if (thisWindow.FPSEnviro) {
medicalElements.push(React.createElement(ReactJson, { src: thisWindow.FPSEnviro, name: 'FPSEnviro', collapsed: 1, displayDataTypes: true, displayObjectSize: true, enableClipboard: false, style: { padding: '10px 0px' } }));
}
if (thisWindow.FPSUser) {
medicalElements.push(React.createElement(ReactJson, { src: thisWindow.FPSUser, name: 'FPSUser', collapsed: true, displayDataTypes: true, displayObjectSize: true, enableClipboard: false, style: { padding: '10px 0px' } }));
}
if (thisWindow.FPSOptions) {
medicalElements.push(React.createElement(ReactJson, { src: thisWindow.FPSOptions, name: 'FPSOptions', collapsed: true, displayDataTypes: true, displayObjectSize: true, enableClipboard: false, style: { padding: '10px 0px' } }));
}
if (thisWindow.FPSEasyIcons) {
medicalElements.push(React.createElement(ReactJson, { src: thisWindow.FPSEasyIcons, name: 'FPSEasyIcons', collapsed: true, displayDataTypes: true, displayObjectSize: true, enableClipboard: false, style: { padding: '10px 0px' } }));
}
if (thisWindow.FPSDigestValues) {
medicalElements.push(React.createElement(ReactJson, { src: thisWindow.FPSDigestValues, name: 'FPSDigestValues', collapsed: true, displayDataTypes: true, displayObjectSize: true, enableClipboard: false, style: { padding: '10px 0px' } }));
}
medicalElements.push(React.createElement(ReactJson, { src: fpsCert, name: 'FPSCert', collapsed: true, displayDataTypes: true, displayObjectSize: true, enableClipboard: false, style: { padding: '10px 0px' } }));
content = React.createElement("div", { id: "MedicalPanel", style: { paddingTop: '20px' } }, medicalElements);
}
}
if (selectedKey === H9 || selectedKey === HA || selectedKey === HB || selectedKey === HX) {
thisPage = content;
}
else {
thisPage = content === undefined ? undefined : React.createElement(SinglePage, { allLoaded: true, showInfo: true, content: content });
}
const tipHeaderStyle = { paddingRight: '10px', textAlign: 'left' };
const tipsTable = React.createElement("table", null,
React.createElement("tr", null,
React.createElement("th", { style: tipHeaderStyle }, "Do this"),
React.createElement("th", { style: tipHeaderStyle }, "Where"),
React.createElement("th", { style: { textAlign: 'left' } }, "Result")),
getRandomTip(contentPages.webParTips));
const tips = contentPages.webParTips.length === 0 ? null :
React.createElement(MessageBar, { messageBarType: MessageBarType.warning },
React.createElement("div", { style: { fontWeight: 600, fontSize: 'large', marginBottom: '12px' } }, "Pro TIP:"),
React.createElement("div", { style: { minHeight: '30px' } }, tipsTable));
const wideIcon = bannerProps.wideToggle !== true ? null : React.createElement(Icon, { iconName: panelType === PanelType.medium ? 'MaximumValue' : 'MinimumValue', style: { fontSize: 'xx-large', cursor: 'pointer' }, onClick: _panelWidth.bind(this) });
const showExport = bannerProps.showExport === true && exportProps !== null ? true : false;
const showHistory = webpartHistory ? true : false;
let panelTitle = bannerProps.panelTitle;
if (panelTitle && ['hide', 'ignore', 'empty'].indexOf(panelTitle.toLowerCase()) >= 0) {
panelTitle = gitHubRepo.desc;
}
// const certEle = getCertElement( bannerProps, fpsCert.warned === true || fpsCert.expired === true ? 'Page' : 'Bar', 'normal' );
const panelContent = React.createElement("div", { style: { paddingBottom: '50px' } },
tips,
getWebPartVersionElement(bannerProps),
webPartLinks,
React.createElement("div", { style: { display: 'flex', flexWrap: 'nowrap', justifyContent: 'space-between', alignItems: 'center' } },
React.createElement("h3", null,
" ",
panelTitle),
React.createElement("div", { title: panelType === PanelType.medium ? 'Make panel wider' : 'Make panel narrower' }, wideIcon)),
React.createElement(Pivot, { linkFormat: PivotLinkFormat.links, linkSize: PivotLinkSize.normal, onLinkClick: _selectedIndex },
replacePanelHTML == '' ? undefined : React.createElement(PivotItem, { headerText: undefined, ariaLabel: HX, title: HX, itemKey: HX, itemIcon: 'SunQuestionMark' }),
!contentPages.whyContent ? undefined : React.createElement(PivotItem, { headerText: H0, ariaLabel: H0, title: H0, itemKey: H0, itemIcon: 'QandA' }),
!contentPages.gettingStartedContent ? undefined : React.createElement(PivotItem, { headerText: H1, ariaLabel: H1, title: H1, itemKey: H1, itemIcon: undefined }),
!contentPages.basicsContent ? undefined : React.createElement(PivotItem, { headerText: H2, ariaLabel: H2, title: H2, itemKey: H2, itemIcon: undefined }),
bannerProps.showTricks !== true || !contentPages.advancedContent ? undefined : React.createElement(PivotItem, { headerText: undefined, ariaLabel: H3, title: H3, itemKey: H3, itemIcon: 'FilterSettings' }),
!contentPages.futureContent ? undefined : React.createElement(PivotItem, { headerText: H4, ariaLabel: H4, title: H4, itemKey: H4, itemIcon: 'RenewalFuture' }),
!contentPages.errorsContent ? undefined : React.createElement(PivotItem, { headerText: H6, ariaLabel: H6, title: H6, itemKey: H6, itemIcon: 'Warning12' }),
bannerProps.showTricks !== true || !contentPages.tricksTable ? undefined : React.createElement(PivotItem, { headerText: undefined, ariaLabel: H7, title: H7, itemKey: H7, itemIcon: 'AutoEnhanceOn' }),
!contentPages.aboutTable ? undefined : React.createElement(PivotItem, { headerText: undefined, ariaLabel: H8, title: H8, itemKey: H8, itemIcon: 'Info' }),
showExport !== true ? null : React.createElement(PivotItem, { headerText: undefined, ariaLabel: H9, title: H9, itemKey: H9, itemIcon: 'Export' }),
showHistory !== true ? null : React.createElement(PivotItem, { headerText: undefined, ariaLabel: HA, title: HA, itemKey: HA, itemIcon: 'FullHistory' }),
showMedical !== true ? null : React.createElement(PivotItem, { headerText: undefined, ariaLabel: HB, title: HB, itemKey: HB, itemIcon: 'Medical' })),
thisPage);
return panelContent;
}
/***
* dD d8888b. .d8b. d8b db d8888b. d888888b d888888b d8888b.
* d8' 88 `8D d8' `8b 888o 88 88 `8D `~~88~~' `88' 88 `8D
* d8' 88oobY' 88ooo88 88V8o 88 88 88 88 88 88oodD'
* d8' 88`8b 88~~~88 88 V8o88 88 88 88 88 88~~~
* d8' 88 `88. 88 88 88 V888 88 .8D 88 .88. 88
* C8' 88 YD YP YP VP V8P Y8888D' YP Y888888P 88
*
*
*/
function getRandomTip(webParTipsX) {
return webParTipsX[Math.floor(Math.random() * webParTipsX.length)];
}
//# sourceMappingURL=FullPanel.js.map