Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merge for v1.18.0 release #554

Merged
merged 79 commits into from
May 7, 2020
Merged
Changes from 1 commit
Commits
Show all changes
79 commits
Select commit Hold shift + click to select a range
d3d5535
Updated import statement
siddharth-vaghasia Mar 24, 2020
9b92ba2
Update index.md
PrasadKasireddy Mar 24, 2020
cc4752c
Fix: additional check for OrgAssets HTTP request
gautamdsheth Mar 26, 2020
5fcadd8
Merge pull request #510 from siddharth-vaghasia/patch-2
AJIXuMuK Mar 27, 2020
fd00cea
1.18.0
AJIXuMuK Mar 27, 2020
645a54c
changelog, correct import for ListItemPicker and ComboBoxListItemPicker
AJIXuMuK Mar 27, 2020
8bc6018
changelog contributor
AJIXuMuK Mar 27, 2020
43f70d9
Merge pull request #511 from PrasadKasireddy/PrasadKasireddy-patch-1
AJIXuMuK Mar 27, 2020
e1c2dc8
changelog
AJIXuMuK Mar 27, 2020
b491e9a
Merge pull request #514 from gautamdsheth/filePickerFixes
AJIXuMuK Mar 27, 2020
5fc3a09
changelog
AJIXuMuK Mar 27, 2020
fbc7d93
Fix: icon picker search not working
gautamdsheth Mar 30, 2020
4f556ac
Minor improvements to icon picker, added it in test webpart
gautamdsheth Mar 31, 2020
07a7431
Fix: fileName not visible on upload tab #518
gautamdsheth Mar 31, 2020
4e74520
Fix: comboBoxListItemPicker onSelectedItem callback fix , fixed lodas…
gautamdsheth Mar 31, 2020
c433286
Add folder picker control
joelfmrodrigues Mar 31, 2020
8be1ec2
update test label
joelfmrodrigues Mar 31, 2020
2501ead
add missing export for FolderPicker
joelfmrodrigues Mar 31, 2020
16ddb57
Add missing documentation for FolderPicker control
joelfmrodrigues Mar 31, 2020
670f4b0
Change attachments filename boundaries
Gregghis Apr 2, 2020
3d591d6
Change to IconPicker Fix Search and refresh Icons
joaojmendes Apr 8, 2020
bbb04f9
Commit changes
joaojmendes Apr 8, 2020
bfe730d
Add support for selecting libraries if site url is provided as root
joelfmrodrigues Apr 9, 2020
04b6511
FolderExplorer - Allow additional items on breadcrumb
joelfmrodrigues Apr 9, 2020
92c26ea
added treeview control
siddharth-vaghasia Apr 10, 2020
c4f6b3a
Implemented IconProps and code formatting
nanddeepn Apr 10, 2020
d818fc6
fix issues related to aligment on icon due to removal of React.fragment
siddharth-vaghasia Apr 10, 2020
169ca11
added telementry to treeview.tsx
siddharth-vaghasia Apr 10, 2020
8f500fe
FolderExplorer - add support for other sites and fix breadcrumb names
joelfmrodrigues Apr 10, 2020
19273e0
Merge branch 'master' of https://github.com/siddharth-vaghasia/sp-dev…
siddharth-vaghasia Apr 11, 2020
e207992
Implemented renderCustomTreeItem
nanddeepn Apr 11, 2020
5760187
Updated images path
nanddeepn Apr 11, 2020
f4c775f
Updated style Without check boxes
nanddeepn Apr 11, 2020
1ad5749
Adding new Pagination Control
Apr 11, 2020
a14ea85
Merge pull request #535 from DRamalho92/pagination
AJIXuMuK Apr 11, 2020
31970d7
Merge branch 'dev' into folder-explorer-libraries
AJIXuMuK Apr 11, 2020
185b723
Merge pull request #534 from joelfmrodrigues/folder-explorer-libraries
AJIXuMuK Apr 11, 2020
44fcc5b
Merge pull request #533 from joaojmendes/newsControls
AJIXuMuK Apr 11, 2020
13c2559
changelog
AJIXuMuK Apr 11, 2020
646cebc
Final touches and updated documentation
siddharth-vaghasia Apr 12, 2020
77f990f
Merge branch 'dev' into master
AJIXuMuK Apr 12, 2020
170e11d
Merge pull request #536 from siddharth-vaghasia/master
AJIXuMuK Apr 12, 2020
c54acc6
new rederOption on IconPicker
joaojmendes Apr 12, 2020
cc30d3c
TreeView merge fix
AJIXuMuK Apr 12, 2020
f8b4b4c
changelog, TreeView documentation small updates
AJIXuMuK Apr 12, 2020
50125ef
Merge branch 'dev' into iconPickerNewViewOptions
AJIXuMuK Apr 12, 2020
f0e7aa1
Merge pull request #537 from joaojmendes/iconPickerNewViewOptions
AJIXuMuK Apr 12, 2020
8c034db
Merge pull request #529 from Gregghis/patch-1
AJIXuMuK Apr 12, 2020
b7acb1c
changelog, fix of #513, small improvements in IconPicker code
AJIXuMuK Apr 12, 2020
01ecbcd
Fix mistranslation in Japanese
karamem0 Apr 27, 2020
cb37469
Create sp-dev-fx-controls-react.yml
nokafor Apr 27, 2020
8618bcc
Merge branch 'dev' into add-folder-picker
AJIXuMuK Apr 28, 2020
a16abdb
merge with dev
AJIXuMuK Apr 28, 2020
5b08293
Merge branch 'joelfmrodrigues-add-folder-picker' into dev
AJIXuMuK Apr 28, 2020
69a6eab
changelog
AJIXuMuK Apr 28, 2020
8c8efc7
Merge pull request #523 from gautamdsheth/comboboxFix
AJIXuMuK Apr 28, 2020
6aa7577
changelog
AJIXuMuK Apr 28, 2020
81e808e
Merge branch 'filePickerUploadFix' of https://github.com/gautamdsheth…
AJIXuMuK Apr 28, 2020
fbc21e4
label style, display label with preview as well
AJIXuMuK Apr 28, 2020
5144958
Merge branch 'gautamdsheth-filePickerUploadFix' into dev
AJIXuMuK Apr 28, 2020
3a96e7b
changelog
AJIXuMuK Apr 28, 2020
5cd85e1
merge with dev and updates
AJIXuMuK Apr 28, 2020
75f277c
Merge branch 'gautamdsheth-iconPickerSearchFix' into dev
AJIXuMuK Apr 28, 2020
151fe35
changelog
AJIXuMuK Apr 28, 2020
84b9c81
Updating documenation for callback method
siddharth-vaghasia Apr 28, 2020
83c479b
Merge pull request #546 from nokafor/master
estruyf Apr 28, 2020
5a7a91b
Merge pull request #547 from siddharth-vaghasia/patch-3
AJIXuMuK Apr 29, 2020
bb5bd9a
changelog
AJIXuMuK Apr 29, 2020
7a58eda
ComboboxListItemPicker onSelectedItem doc update
AJIXuMuK Apr 29, 2020
92b8f1d
Merge branch 'master' of https://github.com/karamem0/sp-dev-fx-contro…
AJIXuMuK Apr 29, 2020
38d61e8
fixed ListItemAttachmentsfileDeleteError
AJIXuMuK Apr 29, 2020
65fa348
Merge branch 'karamem0-master' into dev
AJIXuMuK Apr 29, 2020
aebc832
changelog
AJIXuMuK Apr 29, 2020
81d88bb
ComboBoxListItemPicker documentation: `webUrl` was mentioned twice in…
AJIXuMuK Apr 30, 2020
e0e48d6
Fix of #542
AJIXuMuK May 5, 2020
fe3bf21
changelog
AJIXuMuK May 5, 2020
1170167
Updated all SP links
estruyf May 7, 2020
5e654f8
Updated changelog for v1.18.0 release
estruyf May 7, 2020
4d2e68b
Updated old repo links
estruyf May 7, 2020
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Prev Previous commit
Next Next commit
Add folder picker control
joelfmrodrigues committed Mar 31, 2020

Unverified

This commit is not signed, but one or more authors requires that any commit attributed to them is signed.
commit c43328661cb5e4f6fda880dde6c577c246d53c12
1 change: 1 addition & 0 deletions src/FolderPicker.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
export * from './controls/folderPicker/index';
46 changes: 46 additions & 0 deletions src/controls/folderPicker/FolderPicker.module.scss
Original file line number Diff line number Diff line change
@@ -0,0 +1,46 @@
// @import "~@microsoft/sp-office-ui-fabric-core/dist/sass/SPFabricCore.scss";
@import '~office-ui-fabric-react/dist/sass/References.scss';


.folderPicker {
display: flex;
align-items: center;

.selection {
width: 90%;
}

.selectFolderLabel {
color: $ms-color-neutralSecondary;
}

.selectFolder {
align-items: center;
display: flex;
margin-right: 5px;
max-width: 90%;
span {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
}

& .selectButton {
width: 10%;
display: flex;
justify-content: center;
}
}

.actions {
button {
margin-right: 15px;
}
}

label.required::after {
content: " *";
color: rgb(168, 0, 0);
padding-right: 12px;
}
141 changes: 141 additions & 0 deletions src/controls/folderPicker/FolderPicker.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,141 @@
import * as React from 'react';
import styles from './FolderPicker.module.scss';
import { IFolderPickerProps, IFolderPickerState } from '.';
import { IFolder } from '../../services/IFolderExplorerService';
import { IconButton, PrimaryButton, DefaultButton } from 'office-ui-fabric-react/lib/Button';
import { Label } from 'office-ui-fabric-react/lib/Label';
import { Link } from 'office-ui-fabric-react/lib/Link';
import { getId } from 'office-ui-fabric-react/lib/Utilities';
import { Panel, PanelType } from 'office-ui-fabric-react/lib/Panel';
import { FolderExplorer } from '../folderExplorer/FolderExplorer';


export default class FolderPicker extends React.Component<IFolderPickerProps, IFolderPickerState> {

private _folderLinkId = getId('folderLink');
private _selectedFolder: IFolder;

constructor(props: IFolderPickerProps) {
super(props);

this.state = {
showPanel: false,
selectedFolder: this.props.defaultFolder
};
}

public componentWillReceiveProps(nextProps: IFolderPickerProps) {

this.setState({
selectedFolder: nextProps.defaultFolder,
});

}

public render(): React.ReactElement<IFolderPickerProps> {
return (
<div>
{this.props.label &&
<Label className={this.props.required ? styles.required : ''} htmlFor={this._folderLinkId}>{this.props.label}</Label>
}
<div className={styles.folderPicker}>
<div className={styles.selection}>
{!this.state.selectedFolder &&
<span className={styles.selectFolderLabel}>Select a folder</span>
}
{this.state.selectedFolder &&
<div className={styles.selectFolder}>
<Link className={styles.selectFolder} target='_blank' data-interception="off" id={this._folderLinkId} href={this.state.selectedFolder.ServerRelativeUrl}>
<span title={this.state.selectedFolder.Name}>{this.state.selectedFolder.Name}</span>
</Link>
<IconButton
iconProps={{ iconName: 'Cancel' }}
title="Delete selection"
ariaLabel="Delete selection"
onClick={this._resetSelection}
disabled={this.props.disabled}
/>
</div>
}
</div>
<div className={styles.selectButton}>
<IconButton
iconProps={{ iconName: 'FolderList' }}
title="Select folder"
ariaLabel="Select folder"
disabled={this.props.disabled}
onClick={this._showPanel}
/>
</div>
</div>

<Panel
isOpen={this.state.showPanel}
type={PanelType.medium}
onDismiss={this._hidePanel}
headerText="Select folder"
closeButtonAriaLabel="Close"
onRenderFooterContent={this._onRenderFooterContent}
>
<div>
<FolderExplorer
context={this.props.context}
rootFolder={this.props.rootFolder}
defaultFolder={this.state.selectedFolder}
onSelect={this._onFolderSelect}
canCreateFolders={this.props.canCreateFolders}
/>
</div>
</Panel>

</div>
);
}

private _showPanel = () => {
this.setState({ showPanel: true });
}

private _hidePanel = () => {
this.setState({ showPanel: false });
}

private _onRenderFooterContent = () => {
return (
<div className={styles.actions}>
<PrimaryButton iconProps={{ iconName: 'Save' }} onClick={this._onFolderSave}>
Save
</PrimaryButton>
<DefaultButton iconProps={{ iconName: 'Cancel' }} onClick={this._hidePanel}>
Cancel
</DefaultButton>
</div>
);
}

private _onFolderSelect = (folder: IFolder): void => {
this._selectedFolder = folder;
}

private _onFolderSave = (): void => {
this.setState({
selectedFolder: this._selectedFolder,
showPanel: false,
});

this.props.onSelect(this._selectedFolder);
}

private _resetSelection = (): void => {
this._selectedFolder = null;

this.setState({
selectedFolder: this._selectedFolder,
});

this.props.onSelect(this._selectedFolder);
}



}
46 changes: 46 additions & 0 deletions src/controls/folderPicker/IFolderPickerProps.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,46 @@
import { WebPartContext } from '@microsoft/sp-webpart-base';
import { ExtensionContext } from '@microsoft/sp-extension-base';
import { IFolder } from '../../services/IFolderExplorerService';

export interface IFolderPickerProps {
/**
* Current context
*/
context: WebPartContext | ExtensionContext;

/**
* The field label
*/
label: string;

/**
* The lowest level folder that can be explored. This can be the root folder of a library.
*/
rootFolder: IFolder;

/**
* The default folder to be explored
*/
defaultFolder?: IFolder;

/**
* Is the field required
*/
required?: boolean;

/**
* Is the field disabled
*/
disabled?: boolean;

/**
* Allow current user to create folders on the target location. If enabled, you need to ensure that the user has the required permissions
*/
canCreateFolders?: boolean;

/**
* Callback function called after a folder is selected
* @argument folder The selected folder
*/
onSelect: (folder: IFolder) => void;
}
6 changes: 6 additions & 0 deletions src/controls/folderPicker/IFolderPickerState.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,6 @@
import { IFolder } from '../../services/IFolderExplorerService';

export interface IFolderPickerState {
showPanel: boolean;
selectedFolder: IFolder;
}
3 changes: 3 additions & 0 deletions src/controls/folderPicker/index.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
export * from './FolderPicker';
export * from './IFolderPickerProps';
export * from './IFolderPickerState';
70 changes: 42 additions & 28 deletions src/webparts/controlsTest/components/ControlsTest.tsx
Original file line number Diff line number Diff line change
@@ -53,7 +53,8 @@ import {
} from 'office-ui-fabric-react/lib/DocumentCard';
import { ImageFit } from 'office-ui-fabric-react/lib/Image';
import { FilePicker, IFilePickerResult } from '../../../FilePicker';
import { FolderExplorer, IFolder } from '../../../FolderExplorer';
import { FolderExplorer, IFolder } from '../../../controls/folderExplorer';
import FolderPicker from '../../../controls/folderPicker/FolderPicker';

/**
* The sample data below was randomly generated (except for the title). It is used by the grid layout
@@ -330,6 +331,11 @@ export default class ControlsTest extends React.Component<IControlsTestProps, IC
}
}

private _onFolderSelect = (folder: IFolder): void => {
console.log('selected folder', folder);

}

private _onRenderGridItem = (item: any, _finalSize: ISize, isCompact: boolean): JSX.Element => {
const previewProps: IDocumentCardPreviewProps = {
previewImages: [
@@ -711,14 +717,14 @@ export default class ControlsTest extends React.Component<IControlsTestProps, IC
<div className="ms-font-m">ComboBoxListItemPicker:

<ComboBoxListItemPicker listId={'0ffa51d7-4ad1-4f04-8cfe-98209905d6da'}
columnInternalName='Title'
keyColumnInternalName='Id'
multiSelect={true}
onSelectedItem={(data) => {
console.log(`Item(s):`, data);
}}
webUrl={this.props.context.pageContext.web.absoluteUrl}
spHttpClient={this.props.context.spHttpClient} />
columnInternalName='Title'
keyColumnInternalName='Id'
multiSelect={true}
onSelectedItem={(data) => {
console.log(`Item(s):`, data);
}}
webUrl={this.props.context.pageContext.web.absoluteUrl}
spHttpClient={this.props.context.spHttpClient} />

</div>

@@ -836,6 +842,18 @@ export default class ControlsTest extends React.Component<IControlsTestProps, IC
iframeOnLoad={(iframe: any) => { console.log('iframe loaded'); }}
/>
</div>
<div>
<FolderPicker context={this.props.context}
rootFolder={{
Name: 'Documents',
ServerRelativeUrl: `${this.props.context.pageContext.web.serverRelativeUrl === '/' ? '' : this.props.context.pageContext.web.serverRelativeUrl}/Shared Documents`
}}
onSelect={this._onFolderSelect}
label='Pick a folder'
required={true}
canCreateFolders={true}
></FolderPicker>
</div>
</div>
</div>
</div>
@@ -917,27 +935,23 @@ export default class ControlsTest extends React.Component<IControlsTestProps, IC
/>

<div>
<FolderExplorer
context={this.props.context}
rootFolder={{
Name: 'Documents',
ServerRelativeUrl: `${this.props.context.pageContext.web.serverRelativeUrl === '/' ? '' : this.props.context.pageContext.web.serverRelativeUrl}/Shared Documents`
}}
defaultFolder={{
Name: 'Documents',
ServerRelativeUrl: `${this.props.context.pageContext.web.serverRelativeUrl === '/' ? '' : this.props.context.pageContext.web.serverRelativeUrl}/Shared Documents`
}}
onSelect={this._onFolderSelect}
canCreateFolders={true}
/>
</div>
<FolderExplorer
context={this.props.context}
rootFolder={{
Name: 'Documents',
ServerRelativeUrl: `${this.props.context.pageContext.web.serverRelativeUrl === '/' ? '' : this.props.context.pageContext.web.serverRelativeUrl}/Shared Documents`
}}
defaultFolder={{
Name: 'Documents',
ServerRelativeUrl: `${this.props.context.pageContext.web.serverRelativeUrl === '/' ? '' : this.props.context.pageContext.web.serverRelativeUrl}/Shared Documents`
}}
onSelect={this._onFolderSelect}
canCreateFolders={true}
/>
</div>

</div>
);
}

private _onFolderSelect = (folder: IFolder): void => {
console.log('selected folder', folder);

}

}