@mikezimm/fps-library-v2
Version:
Library of reusable typescript/javascript functions, interfaces and constants
183 lines (181 loc) • 11.2 kB
JavaScript
/**
* CodeAnalizerComment: Updated 5 imports on 2024-09-22 14:49:52
* Update:: import { IModernPagesProps } to '@mikezimm/fps-core-v7/lib/components/molecules/ModernPages/Interfaces/IModernPagesProps;'
* Update:: import { IModernPagesState } to '@mikezimm/fps-core-v7/lib/components/molecules/ModernPages/Interfaces/IModernPagesProps;'
* Update:: import { ModernPageValues } to '@mikezimm/fps-core-v7/lib/components/molecules/ModernPages/Interfaces/IModernPagesProps;'
* Update:: import { PanelType } to '@mikezimm/fps-core-v7/lib/types/@fluentUI/@7.199.1/Panel;'
* Update:: import { getMMMDDFromStr } to '@mikezimm/fps-core-v7/lib/logic/Time/monthLabels;'
*/
/**
* CodeAnalizerComment: Updated 5 imports on 2024-09-21 23:07:24
* Update:: import { IModernPagesProps } to '@mikezimm/fps-core-v7/lib/components/molecules/ModernPages/Interfaces/IModernPagesProps;'
* Update:: import { IModernPagesState } to '@mikezimm/fps-core-v7/lib/components/molecules/ModernPages/Interfaces/IModernPagesProps;'
* Update:: import { ModernPageValues } to '@mikezimm/fps-core-v7/lib/components/molecules/ModernPages/Interfaces/IModernPagesProps;'
* Update:: import { IPagesContent } to '@mikezimm/fps-core-v7/lib/components/molecules/source-props/SitePages/IPagesContent;'
* Update:: import { sortObjectArrayByNumberKey } to '@mikezimm/fps-core-v7/lib/logic/Arrays/sorting/numbers;'
*/
import * as React from 'react';
import { ModernPageValues, } from '@mikezimm/fps-core-v7/lib/components/molecules/ModernPages/Interfaces/IModernPagesProps';
import { Panel, } from '@fluentui/react/lib/Panel';
import { PanelType } from '@fluentui/react/lib/Panel';
import { getDocWikiAPI } from "@mikezimm/fps-core-v7/lib/components/molecules/ModernPages/functions/getDocWikiAPI";
import SingleModernPage from './SinglePage/SingleModernPage';
import { sortObjectArrayByNumberKey } from '@mikezimm/fps-core-v7/lib/logic/Arrays/sorting/numbers';
import { getMMMDDFromStr } from '@mikezimm/fps-core-v7/lib/logic/Time/monthLabels';
require('@mikezimm/fps-styles/dist/ModernPages.css');
// NOTE: linkNoLeadingTarget is used in Layouts1, Layouts2 and Modern Pages... maybe consolidate
export const linkNoLeadingTarget = /<a[\s\S]*?href=/gim; //
// const consoleLineItemBuild: boolean = false;
/**
*
Never list these page titles in the list of pages:
*/
const ignoreThesePages = [
'Easy Contents',
'EasyContents', //
];
export default class ModernPages extends React.Component {
constructor(props) {
super(props);
this.imageStyle = '';
console.log('constructor:');
this.state = {
showItemPanel: false,
showCanvasContent1: this.props.canvasOptions.pagePreference === 'canvasContent1' ? true : false,
showPanelJSON: false,
showThisItem: this.props.pages.length > 0 ? this.props.pages[0] : null,
refreshId: `${this.props.refreshId}`,
sort: {
prop: this.props.sort.prop,
order: this.props.sort.order,
},
};
}
async componentDidMount() {
console.log('MP: componentDidMount:');
await this.updateWebInfo('', false);
}
async updateWebInfo(webUrl, listChangeOnly) {
console.log('MP: updateWebInfo:');
if (this.state.showThisItem && this.state.showCanvasContent1 === true) {
await getDocWikiAPI(this.state.showThisItem, this.props.source, this.props.canvasOptions, this.state.showCanvasContent1, this.updateModernState.bind(this));
}
// this.setState({ docs: docs, buckets: buckets, sups: sups });
}
//
/***
* d8888b. d888888b d8888b. db db d8888b. d8888b. .d8b. d888888b d88888b
* 88 `8D `88' 88 `8D 88 88 88 `8D 88 `8D d8' `8b `~~88~~' 88'
* 88 88 88 88 88 88 88 88oodD' 88 88 88ooo88 88 88ooooo
* 88 88 88 88 88 88 88 88~~~ 88 88 88~~~88 88 88~~~~~
* 88 .8D .88. 88 .8D 88b d88 88 88 .8D 88 88 88 88.
* Y8888D' Y888888P Y8888D' ~Y8888P' 88 Y8888D' YP YP YP Y88888P
*
*
*/
async componentDidUpdate(prevProps) {
//Just rebuild the component
const { showSearch, showPublishDate, pages, source, refreshId, canvasOptions } = this.props;
const hasNewPages = (pages === null || pages === void 0 ? void 0 : pages.length) && (pages === null || pages === void 0 ? void 0 : pages.length) > 0 && pages.length !== prevProps.pages.length ? true : false;
if (hasNewPages === true && this.state.showCanvasContent1 === true) {
// Get full page if it is required and first page is available
getDocWikiAPI(pages[0], source, canvasOptions, this.state.showCanvasContent1, this.updateModernState.bind(this));
}
else if (hasNewPages === true || refreshId !== prevProps.refreshId) {
console.log('MP: componentDidUpdate: refreshId', prevProps.refreshId, refreshId);
let showThisItem = this.state.showThisItem;
if (!showThisItem && pages.length > 0)
showThisItem = pages[0];
this.setState({ refreshId: refreshId, showThisItem: showThisItem });
}
else if (JSON.stringify(canvasOptions) !== JSON.stringify(prevProps.canvasOptions)) {
console.log('MP: ModernPages style update: ', this.imageStyle);
this.setState({ refreshId: refreshId, });
}
}
render() {
if (ModernPageValues.indexOf(this.props.mainPivotKey) < 0) {
return (null);
}
else {
const { showSearch, showPublishDate, pages, source, refreshId, canvasOptions } = this.props;
console.log('ModernPages: ReactElement', refreshId);
const pagesList = [];
const SortedPages = sortObjectArrayByNumberKey(pages, this.state.sort.order, this.state.sort.prop);
SortedPages.map(item => {
const classNames = ['titleListItem', 'leftFilter'];
//Disabled lint on this line in case it was number vs text
if (this.state.showThisItem && (item.ID == this.state.showThisItem.ID)) {
classNames.push('isSelected');
} // eslint-disable-line eqeqeq
//Make sure page has Title and is not a dud, also check it's not a common page that does not belong in this component
if (item.Title && ignoreThesePages.indexOf(item.Title) < 0) {
pagesList.push(React.createElement("li", { className: classNames.join(' '), onClick: this.clickNewsItem.bind(this, item.ID, 'pages', item), style: null }, showPublishDate === true ?
React.createElement("div", { style: { display: 'inline-block' } },
React.createElement("div", null, getMMMDDFromStr(item.FirstPublishedDate)),
React.createElement("div", null, item.Title))
: item.Title));
}
});
const page = React.createElement("div", { className: ['modernPage', this.props.debugMode === true ? 'debugMode' : null].join(' '), style: {} },
React.createElement("div", { className: 'titleList' },
React.createElement("h3", null, source.searchSource),
React.createElement("div", { className: 'pageDescription' }, source.searchSourceDesc),
pagesList),
React.createElement(SingleModernPage, { page: this.state.showThisItem, showCanvasContent1: this.state.showCanvasContent1, source: source, refreshId: refreshId, canvasOptions: canvasOptions, imageStyle: this.imageStyle, debugMode: this.props.debugMode, searchText: this.state.searchText }));
const userPanel = this.state.showItemPanel !== true ? null : React.createElement("div", null,
React.createElement(Panel, { isOpen: this.state.showItemPanel === true ? true : false,
// this prop makes the panel non-modal
isBlocking: true, onDismiss: this._onClosePanel.bind(this), closeButtonAriaLabel: "Close", type: PanelType.large, isLightDismiss: true },
React.createElement(SingleModernPage, { page: this.state.showThisItem, showCanvasContent1: true, source: source, refreshId: refreshId, canvasOptions: canvasOptions, imageStyle: this.imageStyle, debugMode: this.props.debugMode, searchText: this.state.searchText })));
const debugContent = this.props.debugMode !== true ? null : React.createElement("div", { style: { cursor: 'default', marginLeft: '20px' } },
"App in debugMode - Change in Web Part Properties - Page Preferences. ",
React.createElement("b", null,
React.createElement("em", null, "Currently in ModernPage")));
return (
// <div className={ styles.alvFinMan }>
React.createElement("div", { className: null },
React.createElement("div", { className: null },
debugContent,
page,
userPanel)));
}
}
//getDocWiki( item: IPagesContent, source: ISourcePropsFM, canvasOptions: ICanvasContentOptions, callBack: any )
updateModernState(item, showCanvasContent1) {
this.setState({
showItemPanel: showCanvasContent1 === false ? true : false,
showCanvasContent1: showCanvasContent1,
showThisItem: item
});
}
async clickNewsItem(ID, category, item, e) {
console.log('clickNewsItem:', ID, item);
// debugger;
const { showSearch, showPublishDate, pages, source, refreshId, canvasOptions } = this.props;
const newState = this.state.showItemPanel;
if (e.altKey === true) {
// newState = this.state.showItemPanel === true ? false : true;
const showCanvasContent1 = e.ctrlKey === true ? true : false;
await getDocWikiAPI(item, source, canvasOptions, showCanvasContent1, this.updateModernState.bind(this));
}
else if (e.ctrlKey === true && item.File) {
window.open(item.File.ServerRelativeUrl, '_blank');
this.setState({ showThisItem: item, showItemPanel: newState });
}
else if (this.state.showCanvasContent1 === true) {
await getDocWikiAPI(item, source, canvasOptions, true, this.updateModernState.bind(this));
}
else if (canvasOptions.pagePreference === 'tab' && item.File) {
window.open(item.File.ServerRelativeUrl, '_blank');
this.setState({ showThisItem: item, showItemPanel: newState });
}
else {
this.setState({ showThisItem: item, showItemPanel: newState });
}
}
_onClosePanel() {
this.setState({ showItemPanel: false });
}
}
//# sourceMappingURL=ModernPages.js.map