Skip to content

Commit 2824a78

Browse files
mttwcmttwc
committed
Adjustments to localization, fix comments
1 parent 901b3d4 commit 2824a78

11 files changed

+91
-56
lines changed

‎src/components/createNewNotebook/createNewNotebookCreateErrorRenderStrategy.tsx renamed to ‎src/components/createNewNotebook/createNewNotebookErrorRenderStrategy.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@ import { Strings } from '../../strings';
66
import { CreateNewNotebookCommonProperties } from './createNewNotebookCommonProperties';
77
import { CreateNewNotebookRowTemplate } from './createNewNotebookRowTemplate';
88

9-
export class CreateNewNotebookCreateErrorRenderStrategy extends CreateNewNotebookCommonProperties implements NodeRenderStrategy {
9+
export class CreateNewNotebookErrorRenderStrategy extends CreateNewNotebookCommonProperties implements NodeRenderStrategy {
1010
onClickBinded = () => { };
1111

1212
// We don't listen for enter as we assume that we want the user to change the name before

‎src/components/createNewNotebook/createNewNotebookNode.tsx

+2-2
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ import { NodeRenderStrategy } from '../treeView/nodeRenderStrategy';
44
import { CreateNewNotebookNotStartedRenderStrategy } from './createNewNotebookNotStartedRenderStrategy';
55
import { CreateNewNotebookInputRenderStrategy } from './createNewNotebookInputRenderStrategy';
66
import { CreateNewNotebookInProgressRenderStrategy } from './createNewNotebookInProgressRenderStrategy';
7-
import { CreateNewNotebookCreateErrorRenderStrategy } from './createNewNotebookCreateErrorRenderStrategy';
7+
import { CreateNewNotebookErrorRenderStrategy } from './createNewNotebookErrorRenderStrategy';
88
import { InnerGlobals } from '../../props/globalProps';
99
import { CreateEntityNode } from '../treeView/createEntityNode';
1010

@@ -41,7 +41,7 @@ export class CreateNewNotebookNode extends React.Component<CreateNewNotebookNode
4141
}
4242

4343
private createErrorRenderStrategy(inputValue: string, onInputChange: (evt: React.ChangeEvent<HTMLInputElement>) => void): NodeRenderStrategy {
44-
return new CreateNewNotebookCreateErrorRenderStrategy(inputValue, onInputChange);
44+
return new CreateNewNotebookErrorRenderStrategy(inputValue, onInputChange);
4545
}
4646

4747
private inProgressRenderStrategy(inputValue: string): NodeRenderStrategy {

‎src/components/createNewSection/createNewSectionCreateErrorRenderStrategy.tsx renamed to ‎src/components/createNewSection/createNewSectionErrorRenderStrategy.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@ import { Strings } from '../../strings';
66
import { CreateNewSectionCommonProperties } from './createNewSectionCommonProperties';
77
import { CreateNewSectionRowTemplate } from './createNewSectionRowTemplate';
88

9-
export class CreateNewSectionCreateErrorRenderStrategy extends CreateNewSectionCommonProperties implements NodeRenderStrategy {
9+
export class CreateNewSectionErrorRenderStrategy extends CreateNewSectionCommonProperties implements NodeRenderStrategy {
1010
onClickBinded = () => { };
1111

1212
// We don't listen for enter as we assume that we want the user to change the name before

‎src/components/createNewSection/createNewSectionNode.tsx

+2-2
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@ import { NodeRenderStrategy } from '../treeView/nodeRenderStrategy';
66
import { CreateNewSectionNotStartedRenderStrategy } from './createNewSectionNotStartedRenderStrategy';
77
import { CreateNewSectionInputRenderStrategy } from './createNewSectionInputRenderStrategy';
88
import { CreateNewSectionInProgressRenderStrategy } from './createNewSectionInProgressRenderStrategy';
9-
import { CreateNewSectionCreateErrorRenderStrategy } from './createNewSectionCreateErrorRenderStrategy';
9+
import { CreateNewSectionErrorRenderStrategy } from './createNewSectionErrorRenderStrategy';
1010
import { InnerGlobals } from '../../props/globalProps';
1111
import { CreateEntityNode } from '../treeView/createEntityNode';
1212

@@ -45,7 +45,7 @@ export class CreateNewSectionNode extends React.Component<CreateNewSectionNodePr
4545
}
4646

4747
private createErrorRenderStrategy(inputValue: string, onInputChange: (evt: React.ChangeEvent<HTMLInputElement>) => void): NodeRenderStrategy {
48-
return new CreateNewSectionCreateErrorRenderStrategy(this.props.parent.id, inputValue, onInputChange);
48+
return new CreateNewSectionErrorRenderStrategy(this.props.parent.id, inputValue, onInputChange);
4949
}
5050

5151
private inProgressRenderStrategy(inputValue: string): NodeRenderStrategy {

‎src/components/pageRenderStrategy.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,7 @@ export class PageRenderStrategy implements NodeRenderStrategy {
1818
<div className='picker-icon'>
1919
<img
2020
src={require('../images/section_icon.png')}
21-
alt={Strings.get('Accessibility.PageIcon', this.globals.strings)} />
21+
alt={Strings.get('Accessibility.PageIcon')} />
2222
</div>
2323
<div>
2424
<label className='ms-fontSize-sPlus'>{this.page.name}</label>

‎src/components/sharedNotebookRenderStrategy.tsx

+2-2
Original file line numberDiff line numberDiff line change
@@ -35,7 +35,7 @@ export class SharedNotebookRenderStrategy implements ExpandableNodeRenderStrateg
3535
<label className='breadcrumbs'>{this.breadcrumbs()}</label>
3636
</div>
3737
<div className='picker-shared-icon'>
38-
<span aria-hidden='true'>{Strings.get('Shared', this.globals.strings)}</span>
38+
<span aria-hidden='true'>{Strings.get('Shared')}</span>
3939
<i className='ms-Icon ms-Icon--People' />
4040
</div>
4141
</div>);
@@ -51,7 +51,7 @@ export class SharedNotebookRenderStrategy implements ExpandableNodeRenderStrateg
5151

5252
getChildren(childrenLevel: number): JSX.Element[] {
5353
if (typeof (this.notebook.apiHttpErrorCode) === 'number') {
54-
const errorString = Strings.getError(this.notebook.apiHttpErrorCode, this.globals.strings);
54+
const errorString = Strings.getError(this.notebook.apiHttpErrorCode);
5555
return [
5656
<li role='status' aria-live='polite' aria-label={errorString} className='progress-row'>
5757
<div>{errorString}</div>

‎src/components/treeView/createEntityNode.tsx

+18-17
Original file line numberDiff line numberDiff line change
@@ -64,28 +64,29 @@ export class CreateEntityNode extends React.Component<CreateEntityNodeProps, Cre
6464
}
6565

6666
private handleEnterInput() {
67-
if (NameValidator.validateNotebookName(this.state.nameInputValue)) {
67+
if (!this.state.nameInputValue) {
68+
// User aborted action by clicking out when the input box is empty/whitespace
69+
this.resetAndFocus();
70+
}
71+
72+
const trimmedName = this.state.nameInputValue.trim();
73+
if (!trimmedName || NameValidator.validateNotebookName(trimmedName)) {
6874
// Don't fire off request or change state if user attempts to submit invalid name
6975
return;
7076
}
7177

72-
// Check for whitespace
73-
if (this.state.nameInputValue && this.state.nameInputValue.trim()) {
74-
this.setState({ status: 'InProgress' });
75-
76-
this.props.createEntity(this.state.nameInputValue).then(() => {
77-
if (this.componentIsMounted) {
78-
this.setState(this.defaultState());
79-
}
80-
}).catch((error) => {
81-
this.setState({
82-
status: 'CreateError'
83-
});
78+
this.setState({ status: 'InProgress' });
79+
80+
this.props.createEntity(trimmedName).then(() => {
81+
if (this.componentIsMounted) {
82+
this.setState(this.defaultState());
83+
}
84+
}).catch((error) => {
85+
// TODO (machiam) Add means to show error to the user
86+
this.setState({
87+
status: 'CreateError'
8488
});
85-
} else {
86-
// User aborted action by clicking out when the input box is empty/whitespace
87-
this.resetAndFocus();
88-
}
89+
});
8990
}
9091

9192
private resetAndFocus() {

‎src/localizedComponent.tsx

+21
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
import * as React from 'react';
2+
3+
import { Strings } from './strings';
4+
5+
export interface LocalizedComponentProps {
6+
stringOverrides: {} | undefined;
7+
}
8+
9+
/**
10+
* Wrapper component that sets localized strings.
11+
*/
12+
export class LocalizedComponent extends React.Component<LocalizedComponentProps, {}> {
13+
constructor(props: LocalizedComponentProps) {
14+
super();
15+
Strings.setOverrides(props.stringOverrides);
16+
}
17+
18+
render() {
19+
return (<div>{this.props.children}</div>);
20+
}
21+
}

‎src/oneNotePickerBase.tsx

+9-6
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,7 @@ import './oneNotePicker.scss';
55
import { Constants } from './constants';
66
import { Strings } from './strings';
77
import { GlobalProps } from './props/globalProps';
8+
import { LocalizedComponent } from './localizedComponent';
89

910
export abstract class OneNotePickerBase<TState extends GlobalProps, TProps> extends React.Component<TState, TProps> {
1011
protected treeViewId() {
@@ -22,12 +23,14 @@ export abstract class OneNotePickerBase<TState extends GlobalProps, TProps> exte
2223

2324
render() {
2425
return (
25-
<div className='onenote-picker ms-fontColor-themePrimary'>
26-
<ul role='tree' aria-label={Strings.get('Accessibility.PickerTableName', this.props.globals.strings)}
27-
className='menu-list picker-list-header' aria-activedescendant={this.activeDescendentId()}>
28-
{this.rootNodes()}
29-
</ul>
30-
</div>
26+
<LocalizedComponent stringOverrides={this.props.globals.strings}>
27+
<div className='onenote-picker ms-fontColor-themePrimary'>
28+
<ul role='tree' aria-label={Strings.get('Accessibility.PickerTableName')}
29+
className='menu-list picker-list-header' aria-activedescendant={this.activeDescendentId()}>
30+
{this.rootNodes()}
31+
</ul>
32+
</div>
33+
</LocalizedComponent>
3134
);
3235
}
3336
}

‎src/oneNoteSingleNotebookDropdown.tsx

+22-18
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,7 @@
11
import * as React from 'react';
22

3+
import { LocalizedComponent } from './localizedComponent';
4+
35
import { OneNoteSingleNotebookPickerProps, OneNoteSingleNotebookPicker } from './oneNoteSingleNotebookPicker';
46

57
export interface OneNoteSingleNotebookDropdownState {
@@ -80,25 +82,27 @@ export class OneNoteSingleNotebookDropdown extends React.Component<OneNoteSingle
8082
newProps.globals.callbacks = newCallbacks;
8183

8284
return (
83-
<div className='picker-dropdown' ref={this.setWrapperRef}>
84-
<div className='picker-dropdown-padding'>
85-
<a className='picker-dropdown-toggle' onClick={this.onClick.bind(this)}>
86-
<div className='dropdown-arrow-container'>
87-
<svg version='1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'>
88-
<polygon id='XMLID_10_' points='3.5,7 4.4,6.1 8,9.7 11.7,6.1 12.6,7 8,11.5' />
89-
</svg>
90-
</div>
91-
<div className='picker-dropdown-toggle-label' title={this.props.dropdownLabel}>
92-
{this.props.dropdownLabel}
93-
</div>
94-
</a>
85+
<LocalizedComponent stringOverrides={this.props.globals.strings}>
86+
<div className='picker-dropdown' ref={this.setWrapperRef}>
87+
<div className='picker-dropdown-padding'>
88+
<a className='picker-dropdown-toggle' onClick={this.onClick.bind(this)}>
89+
<div className='dropdown-arrow-container'>
90+
<svg version='1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'>
91+
<polygon id='XMLID_10_' points='3.5,7 4.4,6.1 8,9.7 11.7,6.1 12.6,7 8,11.5' />
92+
</svg>
93+
</div>
94+
<div className='picker-dropdown-toggle-label' title={this.props.dropdownLabel}>
95+
{this.props.dropdownLabel}
96+
</div>
97+
</a>
98+
</div>
99+
{this.state.popupVisible ?
100+
<div className={'picker-popup ' + (this.props.popupDirection === 'top' ? 'popup-upwards' : '')}>
101+
{this.props.popupContentOverride ? this.props.popupContentOverride : <OneNoteSingleNotebookPicker {...newProps} />}
102+
</div> :
103+
undefined}
95104
</div>
96-
{this.state.popupVisible ?
97-
<div className={'picker-popup ' + (this.props.popupDirection === 'top' ? 'popup-upwards' : '')}>
98-
{this.props.popupContentOverride ? this.props.popupContentOverride : <OneNoteSingleNotebookPicker {...newProps} />}
99-
</div> :
100-
undefined}
101-
</div>
105+
</LocalizedComponent>
102106
);
103107
}
104108
}

‎src/strings.ts

+12-6
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,6 @@
11
export class Strings {
2+
private static overrides: {} | undefined;
3+
24
private static defaults: {} = {
35
'Shared': 'Shared',
46
'Error.4XX': 'You no longer have access to this notebook.',
@@ -21,19 +23,23 @@ export class Strings {
2123
'Input.CreateSectionPlaceholder': 'Untitled Section'
2224
};
2325

24-
static get(key: string, overrides?: {}): string {
25-
overrides = overrides || {};
26+
static setOverrides(overrides: {} | undefined) {
27+
this.overrides = overrides;
28+
}
29+
30+
static get(key: string): string {
31+
const overrides = this.overrides || {};
2632
return overrides[key] || this.defaults[key] || '';
2733
}
2834

29-
static getError(responseCode: number, overrides?: {}) {
35+
static getError(responseCode: number) {
3036
const responseStr = responseCode + '';
3137
if (responseStr.indexOf('4') === 0) {
32-
return this.get('Error.4XX', overrides);
38+
return this.get('Error.4XX');
3339
}
3440
if (responseStr.indexOf('5') === 0) {
35-
return this.get('Error.5XX', overrides);
41+
return this.get('Error.5XX');
3642
}
37-
return this.get('Error.Fallback', overrides);
43+
return this.get('Error.Fallback');
3844
}
3945
}

0 commit comments

Comments
 (0)