Skip to content

Commit 3cfa915

Browse files
committed
Icon fixes
1 parent e0629d5 commit 3cfa915

File tree

11 files changed

+41
-51
lines changed

11 files changed

+41
-51
lines changed

src/components/containers/Modal.js

+4-4
Original file line numberDiff line numberDiff line change
@@ -5,12 +5,12 @@ import PropTypes from 'prop-types';
55

66
const ModalHeader = ({title, handleClose}) => (
77
<div className="modal__header">
8-
{title ? <div className="modal__header__title">{title}</div> : null}
9-
{handleClose ? (
8+
{Boolean(title) && <div className="modal__header__title">{title}</div>}
9+
{Boolean(handleClose) && (
1010
<div className="modal__header__close" onClick={handleClose ? () => handleClose() : null}>
11-
<Icon path={mdiClose} />
11+
<Icon size="24px" path={mdiClose} />
1212
</div>
13-
) : null}
13+
)}
1414
</div>
1515
);
1616

src/components/containers/PanelEmpty.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@ import {bem} from 'lib';
66
export const PanelMessage = ({children, heading, icon: PlotlyIcon}) => (
77
<div className="panel__empty__message">
88
<div className="panel__empty__message__icon">
9-
{PlotlyIcon ? <PlotlyIcon /> : <Icon path={mdiChartLine} size="24px" />}
9+
{PlotlyIcon ? <PlotlyIcon /> : <Icon size="24px" path={mdiChartLine} />}
1010
</div>
1111
{Boolean(heading) && <div className="panel__empty__message__heading">{heading}</div>}
1212
<div className="panel__empty__message__content">{children}</div>

src/components/fields/Field.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@ import {getMultiValueText} from 'lib/constants';
88

99
export const FieldDelete = ({onClick}) => (
1010
<div className="field__delete" onClick={onClick}>
11-
<Icon path={mdiClose} />
11+
<Icon size="24px" path={mdiClose} />
1212
</div>
1313
);
1414

src/components/fields/TraceSelector.js

+2-1
Original file line numberDiff line numberDiff line change
@@ -141,7 +141,8 @@ class TraceSelector extends Component {
141141
</div>
142142
{exampleOnClick && (
143143
<div className="js-test-info" style={{padding: '16px 0 12px 0'}}>
144-
See basic usage <a onClick={exampleOnClick}>example</a>.
144+
{_('See basic usage ')}
145+
<a onClick={exampleOnClick}>{_('example')}</a>.
145146
</div>
146147
)}
147148
</Field>

src/components/widgets/Button.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@ const Button = ({children, className, icon, label, variant, ...rest}) => (
1010
<div className={bem('button', 'wrapper')}>
1111
{Boolean(icon) && (
1212
<div className={bem('button', 'icon')}>
13-
<Icon path={icon} size="24px" />{' '}
13+
<Icon size="24px" path={icon} />
1414
</div>
1515
)}
1616
<div className="button__label">{label || children}</div>

src/components/widgets/CheckboxGroup.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,7 @@ class CheckboxGroup extends Component {
1616
}
1717

1818
handleChange(i) {
19-
var newOptions = this.props.options.slice();
19+
const newOptions = this.props.options.slice();
2020
newOptions[i] = Object.assign(newOptions[i], {
2121
checked: !newOptions[i].checked,
2222
});

src/components/widgets/RadioBlocks.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -35,7 +35,7 @@ class RadioBlocks extends Component {
3535
return (
3636
<div className={optionClass} key={value} onClick={() => this.handleChange(value)}>
3737
{Icon ? <Icon className="radio-block__icon" /> : null}
38-
{label ? <span>{label}</span> : null}
38+
{label ? <>{label}</> : null}
3939
</div>
4040
);
4141
}

src/components/widgets/SymbolSelector.js

+6-10
Original file line numberDiff line numberDiff line change
@@ -53,13 +53,11 @@ export default class SymbolSelector extends Component {
5353
};
5454

5555
return (
56-
<span>
57-
<svg width="18" height="18">
58-
<g transform="translate(8,8)">
59-
<path d={currentSymbol.label} style={symbolStyle} />
60-
</g>
61-
</svg>
62-
</span>
56+
<svg width="18" height="18">
57+
<g transform="translate(8,8)">
58+
<path d={currentSymbol.label} style={symbolStyle} />
59+
</g>
60+
</svg>
6361
);
6462
}
6563

@@ -100,9 +98,7 @@ export default class SymbolSelector extends Component {
10098
<div>
10199
<div className={toggleClass} onClick={this.togglePanel}>
102100
<span className="symbol-selector__toggle_option">{this.renderActiveOption()}</span>
103-
<span>
104-
<Icon path={mdiMenuDown} className="symbol-selector__toggle__caret" />
105-
</span>
101+
<Icon path={mdiMenuDown} className="symbol-selector__toggle__caret" />
106102
</div>
107103
{isOpen && this.renderOptions()}
108104
</div>

src/components/widgets/TextArea.js

+8-10
Original file line numberDiff line numberDiff line change
@@ -29,16 +29,14 @@ export default class TextArea extends Component {
2929

3030
render() {
3131
return (
32-
<span>
33-
<textarea
34-
value={this.state.value}
35-
rows={this.props.visibleRows}
36-
cols={this.props.areaWidth}
37-
placeholder={this.props.placeholder}
38-
onChange={this.onChange}
39-
className={this.props.textareaClass}
40-
/>
41-
</span>
32+
<textarea
33+
value={this.state.value}
34+
rows={this.props.visibleRows}
35+
cols={this.props.areaWidth}
36+
placeholder={this.props.placeholder}
37+
onChange={this.onChange}
38+
className={this.props.textareaClass}
39+
/>
4240
);
4341
}
4442
}

src/components/widgets/TraceTypeSelector.js

+10-15
Original file line numberDiff line numberDiff line change
@@ -106,42 +106,37 @@ class TraceTypeSelector extends Component {
106106
{
107107
label: _('Charts like this by Plotly users.'),
108108
onClick:
109-
chartHelp[value] &&
110-
chartHelp[value].feedQuery &&
109+
chartHelp[value]?.feedQuery &&
111110
((e) =>
112111
onClick(e, () =>
113112
window.open(
114113
`https://plot.ly/feed/?q=${chartHelp[value] ? chartHelp[value].feedQuery : value}`,
115114
'_blank'
116115
)
117116
)),
118-
icon: <Icon path={mdiMagnify} />,
117+
icon: <Icon size="16px" path={mdiMagnify} />,
119118
},
120119
{
121120
label: _('View tutorials on this chart type.'),
122121
onClick:
123-
chartHelp[value] &&
124-
chartHelp[value].helpDoc &&
122+
chartHelp[value]?.helpDoc &&
125123
((e) => onClick(e, () => window.open(chartHelp[value].helpDoc, '_blank'))),
126-
icon: <Icon path={mdiApps} />,
124+
icon: <Icon size="16px" path={mdiApps} />,
127125
},
128126
{
129127
label: _('See a basic example.'),
130-
onClick:
131-
chartHelp[value] &&
132-
chartHelp[value].examplePlot &&
133-
((e) => onClick(e, chartHelp[value].examplePlot)),
134-
icon: <Icon path={mdiPoll} />,
128+
onClick: chartHelp[value]?.examplePlot && ((e) => onClick(e, chartHelp[value].examplePlot)),
129+
icon: <Icon size="16px" path={mdiPoll} />,
135130
},
136131
];
137132
}
138133

139134
renderCategories() {
140-
const {fullValue} = this.props;
141-
const {localize: _, chartHelp} = this.context;
142135
const {
136+
fullValue,
143137
traceTypesConfig: {traces, categories, complex},
144138
} = this.props;
139+
const {localize: _, chartHelp} = this.context;
145140

146141
return categories(_).map((category, i) => {
147142
const items = traces(_)
@@ -182,11 +177,11 @@ class TraceTypeSelector extends Component {
182177
}
183178

184179
renderSingleBlock() {
185-
const {fullValue} = this.props;
186-
const {localize: _} = this.context;
187180
const {
181+
fullValue,
188182
traceTypesConfig: {traces, complex},
189183
} = this.props;
184+
const {localize: _} = this.context;
190185

191186
return (
192187
<div className="trace-grid-single-block">

src/components/widgets/text_editors/RichText/configuration.js

+6-6
Original file line numberDiff line numberDiff line change
@@ -64,25 +64,25 @@ export const INLINE_STYLES = [
6464
},
6565
{
6666
label: (
67-
<span>
67+
<>
6868
x<span style={STYLE_MAP[SUBSCRIPT]}>2</span>
69-
</span>
69+
</>
7070
),
7171
value: SUBSCRIPT,
7272
},
7373
{
7474
label: (
75-
<span>
75+
<>
7676
x<span style={STYLE_MAP[SUPERSCRIPT]}>2</span>
77-
</span>
77+
</>
7878
),
7979
value: SUPERSCRIPT,
8080
},
8181
{
8282
label: (
83-
<span>
83+
<>
8484
<Icon path={mdiLinkVariant} className="icon-link" />
85-
</span>
85+
</>
8686
),
8787
value: LINK,
8888
},

0 commit comments

Comments
 (0)