Skip to content

Commit 406e73f

Browse files
estruyfestruyf
committed
Coding guideline changes
1 parent ebe7fb8 commit 406e73f

19 files changed

+146
-118
lines changed

‎config/karma.config.js

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2,9 +2,8 @@
22
var existingKarmaConfig = require('@microsoft/sp-build-web/lib/karma/karma.config');
33
var gulp_core_build = require("@microsoft/gulp-core-build");
44
var htmlReporter = require('karma-html-reporter');
5-
var path = require('path');
6-
75
var remapCoverageReporter = require('karma-remap-coverage');
6+
var path = require('path');
87

98
module.exports = function (config) {
109
existingKarmaConfig(config);

‎src/controls/fileTypeIcon/FileTypeIcon.tsx

Lines changed: 14 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
1-
import * as React from "react";
1+
import * as React from 'react';
22
import { findIndex } from '@microsoft/sp-lodash-subset';
3-
import { IFileTypeIconProps, ApplicationType, ApplicationIconList, IconType, IconSizes, ImageSize, IImageResult, ICON_GENERIC_16, ICON_GENERIC_48, ICON_GENERIC_96 } from "./IFileTypeIcon";
3+
import { IFileTypeIconProps, ApplicationType, ApplicationIconList, IconType, IconSizes, ImageSize, IImageResult, ICON_GENERIC_16, ICON_GENERIC_48, ICON_GENERIC_96 } from './IFileTypeIcon';
44

5-
const ICON_GENERIC = "Page";
6-
const ICON_DEFAULT_SIZE = "icon16";
5+
const ICON_GENERIC = 'Page';
6+
const ICON_DEFAULT_SIZE = 'icon16';
77

88
/**
99
* File type icon component
@@ -14,14 +14,13 @@ export class FileTypeIcon extends React.Component<IFileTypeIconProps, {}> {
1414
}
1515

1616
/**
17-
* @function
1817
* Function which returns the font icon
1918
*/
2019
private _getIconClassName(): string {
2120
let className = ICON_GENERIC;
2221

2322
// Check if the path property is provided
24-
if (typeof this.props.path !== "undefined" && this.props.path !== null) {
23+
if (typeof this.props.path !== 'undefined' && this.props.path !== null) {
2524
const path: string = this.props.path;
2625
const fileExtension: string = this._getFileExtension(path);
2726
// Check the known file extensions list
@@ -31,7 +30,7 @@ export class FileTypeIcon extends React.Component<IFileTypeIconProps, {}> {
3130
}
3231
}
3332
// Check if the application name has been provided
34-
else if (typeof this.props.application !== "undefined" && this.props.application !== null) {
33+
else if (typeof this.props.application !== 'undefined' && this.props.application !== null) {
3534
const application: ApplicationType = this.props.application;
3635
const iconName = this._getIconByApplicationType(application, IconType.font);
3736
if (iconName !== null) {
@@ -44,28 +43,27 @@ export class FileTypeIcon extends React.Component<IFileTypeIconProps, {}> {
4443

4544

4645
/**
47-
* @function
4846
* Function which returns the image icon
4947
*/
5048
private _getIconImageName(): IImageResult {
5149
let size = ICON_DEFAULT_SIZE;
5250
let image: string | null = null;
5351

5452
// Get the right icon size to display
55-
if (typeof this.props.size !== "undefined" && this.props.size !== null) {
53+
if (typeof this.props.size !== 'undefined' && this.props.size !== null) {
5654
// Retrieve the right icon size
5755
size = this._getFileSizeName(this.props.size);
5856
}
5957

6058
// Check if the path is provided
61-
if (typeof this.props.path !== "undefined" && this.props.path !== null) {
59+
if (typeof this.props.path !== 'undefined' && this.props.path !== null) {
6260
const path: string = this.props.path;
6361
const fileExtension: string = this._getFileExtension(path);
6462
// Get the image for the current file extension
6563
image = this._getIconByExtension(fileExtension.toLowerCase(), IconType.image);
6664
}
6765
// Check if the application name has been provided
68-
else if (typeof this.props.application !== "undefined" && this.props.application !== null) {
66+
else if (typeof this.props.application !== 'undefined' && this.props.application !== null) {
6967
const application: ApplicationType = this.props.application;
7068
image = this._getIconByApplicationType(application, IconType.image);
7169
}
@@ -77,7 +75,6 @@ export class FileTypeIcon extends React.Component<IFileTypeIconProps, {}> {
7775
}
7876

7977
/**
80-
* @function
8178
* Function to retrieve the file extension from the path
8279
*
8380
* @param value File path
@@ -97,7 +94,6 @@ export class FileTypeIcon extends React.Component<IFileTypeIconProps, {}> {
9794
}
9895

9996
/**
100-
* @function
10197
* Find the icon name for the provided extension
10298
*
10399
* @param extension File extension
@@ -128,7 +124,6 @@ export class FileTypeIcon extends React.Component<IFileTypeIconProps, {}> {
128124
}
129125

130126
/**
131-
* @function
132127
* Find the icon name for the application
133128
*
134129
* @param application
@@ -154,7 +149,6 @@ export class FileTypeIcon extends React.Component<IFileTypeIconProps, {}> {
154149
}
155150

156151
/**
157-
* @function
158152
* Return the right image size for the provided value
159153
*
160154
* @param value Image size value
@@ -183,20 +177,20 @@ export class FileTypeIcon extends React.Component<IFileTypeIconProps, {}> {
183177
// Return an image icon element
184178
const iconImage = this._getIconImageName();
185179
// Check if the image was found, otherwise a generic image will be returned
186-
if (typeof iconImage.image !== "undefined" && iconImage.image !== null) {
180+
if (typeof iconImage.image !== 'undefined' && iconImage.image !== null) {
187181
iconElm = <div style={{ display: 'inline-block' }} className={`ms-BrandIcon--${iconImage.size} ms-BrandIcon--${iconImage.image}`}></div>;
188182
} else {
189183
// Return a generic image
190184
let imgElm = <img />;
191185
// Check the size of the generic image which has to be returned
192186
switch (iconImage.size) {
193-
case "icon16":
187+
case 'icon16':
194188
imgElm = <img src={ICON_GENERIC_16} />;
195189
break;
196-
case "icon48":
190+
case 'icon48':
197191
imgElm = <img src={ICON_GENERIC_48} />;
198192
break;
199-
case "icon96":
193+
case 'icon96':
200194
imgElm = <img src={ICON_GENERIC_96} />;
201195
break;
202196
default:
@@ -213,7 +207,7 @@ export class FileTypeIcon extends React.Component<IFileTypeIconProps, {}> {
213207
} else {
214208
// Return the icon font element
215209
const iconClass = this._getIconClassName();
216-
iconElm = <i className={`ms-Icon ms-Icon--${iconClass}`} aria-hidden="true"></i>;
210+
iconElm = <i className={`ms-Icon ms-Icon--${iconClass}`} aria-hidden='true'></i>;
217211
}
218212

219213
// Return the icon element

‎src/controls/fileTypeIcon/IFileTypeIcon.ts

Lines changed: 57 additions & 58 deletions
Large diffs are not rendered by default.

‎src/controls/listView/IListView.ts

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@ import { IColumn } from 'office-ui-fabric-react/lib/components/DetailsList';
44
export { SelectionMode };
55

66
export interface IListViewProps {
7+
78
/**
89
* Specify the name of the file URL path which will be used to show the file icon.
910
*/
@@ -33,6 +34,7 @@ export interface IListViewProps {
3334
}
3435

3536
export interface IListViewState {
37+
3638
/**
3739
* The items to render.
3840
*/
@@ -45,6 +47,7 @@ export interface IListViewState {
4547
}
4648

4749
export interface IViewField {
50+
4851
/**
4952
* Name of the field
5053
*/

‎src/controls/listView/ListView.tsx

Lines changed: 10 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
1-
import * as React from "react";
1+
import * as React from 'react';
22
import { DetailsList, DetailsListLayoutMode, Selection, SelectionMode } from 'office-ui-fabric-react/lib/DetailsList';
3-
import { IListViewProps, IListViewState, IViewField } from "./IListView";
4-
import { IColumn } from "office-ui-fabric-react/lib/components/DetailsList";
3+
import { IListViewProps, IListViewState, IViewField } from './IListView';
4+
import { IColumn } from 'office-ui-fabric-react/lib/components/DetailsList';
55
import { findIndex, has, sortBy, isEqual, cloneDeep } from '@microsoft/sp-lodash-subset';
6-
import { FileTypeIcon, IconType } from "../fileTypeIcon/index";
6+
import { FileTypeIcon, IconType } from '../fileTypeIcon/index';
77

88
/**
99
* File type icon component
@@ -22,7 +22,7 @@ export class ListView extends React.Component<IListViewProps, IListViewState> {
2222
// Binding the functions
2323
this._columnClick = this._columnClick.bind(this);
2424

25-
if (typeof this.props.selection !== "undefined" && this.props.selection !== null) {
25+
if (typeof this.props.selection !== 'undefined' && this.props.selection !== null) {
2626
// Initialize the selection
2727
this._selection = new Selection({
2828
// Create the event handler when a selection changes
@@ -56,19 +56,19 @@ export class ListView extends React.Component<IListViewProps, IListViewState> {
5656
let tempState: IListViewState = cloneDeep(this.state);
5757
let columns: IColumn[] = null;
5858
// Check if a set of items was provided
59-
if (typeof this.props.items !== "undefined" && this.props.items !== null) {
59+
if (typeof this.props.items !== 'undefined' && this.props.items !== null) {
6060
tempState.items = this._flattenItems(this.props.items);
6161
}
6262

6363
// Check if an icon needs to be shown
64-
if (typeof this.props.iconFieldName !== "undefined" && this.props.iconFieldName !== null) {
64+
if (typeof this.props.iconFieldName !== 'undefined' && this.props.iconFieldName !== null) {
6565
if (columns === null) { columns = []; }
6666
const iconColumn = this._createIconColumn(this.props.iconFieldName);
6767
columns.push(iconColumn);
6868
}
6969

7070
// Check if view fields were provided
71-
if (typeof this.props.viewFields !== "undefined" && this.props.viewFields !== null) {
71+
if (typeof this.props.viewFields !== 'undefined' && this.props.viewFields !== null) {
7272
if (columns === null) { columns = []; }
7373
columns = this._createColumns(this.props.viewFields, columns);
7474
}
@@ -187,10 +187,10 @@ export class ListView extends React.Component<IListViewProps, IListViewState> {
187187
if (columnIdx !== -1) {
188188
const field = this.props.viewFields[columnIdx];
189189
// Check if the field needs to be sorted
190-
if (has(field, "sorting")) {
190+
if (has(field, 'sorting')) {
191191
// Check if the sorting option is true
192192
if (field.sorting) {
193-
const sortDescending = typeof column.isSortedDescending === "undefined" ? false : !column.isSortedDescending;
193+
const sortDescending = typeof column.isSortedDescending === 'undefined' ? false : !column.isSortedDescending;
194194
const sortedItems = this._sortItems(this.state.items, column.key, sortDescending);
195195
// Update the columns
196196
const sortedColumns = this.state.columns.map(c => {

‎src/controls/placeholder/IPlaceholderComponent.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
11
/**
22
* Used to display a placeholder in case of no or temporary content. Button is optional.
33
*
4-
* @public
54
*/
65
export interface IPlaceholderProps {
6+
77
/**
88
* Text description for the placeholder. Appears bellow the Icon and IconText.
99
*/

‎src/controls/placeholder/PlaceholderComponent.module.scss

Lines changed: 11 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@
22
display: -webkit-box;
33
display: -ms-flexbox;
44
display: flex;
5+
56
.placeholderContainer {
67
-webkit-box-align: center;
78
-ms-flex-align: center;
@@ -11,24 +12,29 @@
1112
background-color: "[theme:neutralLighter, default: #f4f4f4]";
1213
width: 100%;
1314
padding: 80px 0;
15+
1416
.placeholderHead {
1517
color: "[theme:neutralPrimary, default: #333333]";
18+
1619
.placeholderHeadContainer {
1720
height: 100%;
1821
white-space: nowrap;
1922
text-align: center;
2023
}
24+
2125
.placeholderIcon {
2226
display: inline-block;
2327
vertical-align: middle;
2428
white-space: normal;
2529
}
30+
2631
.placeholderText {
2732
display: inline-block;
2833
vertical-align: middle;
2934
white-space: normal
3035
}
3136
}
37+
3238
.placeholderDescription {
3339
width: 65%;
3440
vertical-align: middle;
@@ -47,8 +53,11 @@
4753

4854
[dir=ltr] .placeholder,
4955
[dir=rtl] .placeholder {
56+
5057
.placeholderContainer {
58+
5159
.placeholderHead {
60+
5261
.placeholderText {
5362
padding-left: 20px;
5463
}
@@ -60,9 +69,10 @@
6069
position: relative;
6170
height: 100%;
6271
z-index: 1;
72+
6373
.placeholderSpinnerContainer {
6474
position: relative;
6575
width: 100%;
6676
margin: 164px 0
6777
}
68-
}
78+
}

‎src/controls/placeholder/PlaceholderComponent.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
1-
import * as React from "react";
2-
import { IPlaceholderProps } from "./IPlaceholderComponent";
1+
import * as React from 'react';
2+
import { IPlaceholderProps } from './IPlaceholderComponent';
33
import { PrimaryButton } from 'office-ui-fabric-react/lib/components/Button';
44
import styles from './PlaceholderComponent.module.scss';
55

@@ -27,7 +27,7 @@ export class Placeholder extends React.Component<IPlaceholderProps, {}> {
2727
* Default React component render method
2828
*/
2929
public render(): React.ReactElement<IPlaceholderProps> {
30-
const iconName = typeof this.props.iconName !== "undefined" && this.props.iconName !== null ? `ms-Icon--${this.props.iconName}` : '';
30+
const iconName = typeof this.props.iconName !== 'undefined' && this.props.iconName !== null ? `ms-Icon--${this.props.iconName}` : '';
3131

3232
return (
3333
<div className={`${styles.placeholder} ${this.props.contentClassName ? this.props.contentClassName : ''}`}>

‎src/controls/siteBreadcrumb/ISiteBreadcrumb.ts

Lines changed: 6 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,16 +1,19 @@
1-
import ApplicationCustomizerContext from "@microsoft/sp-application-base/lib/extensibility/ApplicationCustomizerContext";
2-
import { IBreadcrumbItem } from "office-ui-fabric-react/lib/Breadcrumb";
3-
import { WebPartContext } from "@microsoft/sp-webpart-base";
1+
import ApplicationCustomizerContext from '@microsoft/sp-application-base/lib/extensibility/ApplicationCustomizerContext';
2+
import { IBreadcrumbItem } from 'office-ui-fabric-react/lib/Breadcrumb';
3+
import { WebPartContext } from '@microsoft/sp-webpart-base';
44

55
export interface ISiteBreadcrumbProps {
6+
67
context: WebPartContext | ApplicationCustomizerContext;
78
}
89

910
export interface ISiteBreadcrumbState {
11+
1012
breadcrumbItems: IBreadcrumbItem[];
1113
}
1214

1315
export interface IWebInfo {
16+
1417
Id: string;
1518
Title: string;
1619
ServerRelativeUrl: string;

‎src/controls/siteBreadcrumb/SiteBreadcrumb.module.scss

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,9 +2,11 @@
22
>div {
33
padding-left: 7px;
44
}
5+
56
div[role="navigation"] {
67
margin-top: 0;
78
}
9+
810
.breadcrumbLinks {
911
ol {
1012
li {

0 commit comments

Comments
 (0)