honeymoose
/
sp-dev-fx-webparts
mirror of https://github.com/pnp/sp-dev-fx-webparts.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Updated code for React Document

This commit is contained in:
Harsha Vardhini 2020-05-01 12:03:41 +05:30
parent c8c13b400c
commit 0e18c255cd
3 changed files with 41 additions and 31 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
samples/react-documents-detailslist/config/package-solution.json
View File

@ -8,6 +8,6 @@
"version": "1.0.0.0"
},
"paths": {
"zippedPackage": "solution/react-documents.sppkg"
"zippedPackage": "solution/reactDocuments.sppkg"
}
}

2
samples/react-documents-detailslist/config/write-manifests.json
View File

@ -1,5 +1,5 @@
{
"$schema": "https://developer.microsoft.com/json-schemas/spfx-build/write-manifests.schema.json",
//NOTE: the cdnBasePath works with relative path; this is useful when you move the pakedge between different environments (dev, staging, prod)
"cdnBasePath": "/sites/dev03/Style Library/CDN"
"cdnBasePath": "<!-- PATH TO CDN -->"
}

68
samples/react-documents-detailslist/src/components/documentsList/component/Documents.tsx
View File

@ -6,7 +6,9 @@ import {
Link, MarqueeSelection, DetailsList, Selection, Image, ImageFit,
SelectionMode, Spinner, SpinnerSize, Fabric, ColumnActionsMode, IColumn, CheckboxVisibility,
Callout, Panel, PanelType, IContextualMenuItem, autobind, ContextualMenu, IContextualMenuProps, DirectionalHint,
css
css,
MessageBarType,
MessageBar
} from 'office-ui-fabric-react';
import { IDocumentsProps } from './IDocumentsProps';
@ -52,32 +54,32 @@ export default class LibraryDocuments extends React.Component<IDocumentsProps, I
let { contextualMenuProps } = this.state;
if (!this._isConfigurationValid && this.props.webPartDisplayMode === DisplayMode.Edit) {
return (
<div className={styles.notification}>
<div className={styles.notificationIcon}>
<i className={css("ms-Icon ms-Icon--ErrorBadge", styles.notificationIcon)} aria-hidden="true"></i>
<span className={styles.notificationHeader}>
Edit Mode
</span>
</div>
</div>);
}
if (!this._isConfigurationValid && this.props.webPartDisplayMode === DisplayMode.Read) {
return (
<div>
<div className={styles.notification}>
<div className={styles.notificationIcon}>
<i className={css("ms-Icon ms-Icon--ErrorBadge", styles.notificationIcon)} aria-hidden="true"></i>
<span className={styles.notificationHeader}>
Preview Mode
</span>
</div>
</div>
</div>);
}
/* if (!this._isConfigurationValid && this.props.webPartDisplayMode === DisplayMode.Edit) {
return (
<div className={styles.notification}>
<div className={styles.notificationIcon}>
<i className={css("ms-Icon ms-Icon--ErrorBadge", styles.notificationIcon)} aria-hidden="true"></i>
<span className={styles.notificationHeader}>
Edit Mode
</span>
</div>
</div>);
}
if (!this._isConfigurationValid && this.props.webPartDisplayMode === DisplayMode.Read) {
return (
<div>
<div className={styles.notification}>
<div className={styles.notificationIcon}>
<i className={css("ms-Icon ms-Icon--ErrorBadge", styles.notificationIcon)} aria-hidden="true"></i>
<span className={styles.notificationHeader}>
Preview Mode
</span>
</div>
</div>
</div>);
}*/
if (this._isConfigurationValid) {
if (this.state.isLoading) {
@ -134,7 +136,7 @@ export default class LibraryDocuments extends React.Component<IDocumentsProps, I
onRenderItemColumn={this._renderItemColumn}
checkboxVisibility={CheckboxVisibility.hidden} />
{contextualMenuProps && (
<ContextualMenu { ...contextualMenuProps } />
<ContextualMenu {...contextualMenuProps} />
)}
</MarqueeSelection>
</div>
@ -142,6 +144,14 @@ export default class LibraryDocuments extends React.Component<IDocumentsProps, I
);
}
}
else {
return (<MessageBar
messageBarType={MessageBarType.warning}
isMultiline={false}
dismissButtonAriaLabel="Close">
Please enter the Library URL from the PropertyPane.
</MessageBar>);
}
}
@ -400,7 +410,7 @@ export default class LibraryDocuments extends React.Component<IDocumentsProps, I
return document[column.fieldName];
}],
[column.isSortedDescending ? "desc" : "asc"]) ;
[column.isSortedDescending ? "desc" : "asc"]);
this.setState({
displayedDocuments: modifiedDocs,