imterah/element-portable
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Improve styling of edge case devtools state keys (#7794)

Browse source
This commit is contained in:
Michael Telatynski 2022-02-14 23:37:45 +00:00 • committed by GitHub
parent 401e5127f4
commit 8d3c2eddd6
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 27 additions and 2 deletions
Download patch file Download diff file Expand all files Collapse all files

14
src/components/views/dialogs/DevtoolsDialog.tsx
View file

@ -28,6 +28,7 @@ import {
import { Room } from "matrix-js-sdk/src/models/room";
import { MatrixEvent } from "matrix-js-sdk/src/models/event";
import { logger } from "matrix-js-sdk/src/logger";
import classNames from 'classnames';
import SyntaxHighlight from '../elements/SyntaxHighlight';
import { _t } from '../../../languageHandler';
@ -538,8 +539,17 @@ class RoomStateExplorer extends React.PureComponent<IExplorerProps, IRoomStateEx
list = <FilteredList query={this.state.queryStateKey} onChange={this.onQueryStateKey}>
{
Array.from(stateGroup.entries()).map(([stateKey, ev]) => {
return <button className={classes} key={stateKey} onClick={this.onViewSourceClick(ev)}>
{ stateKey }
const trimmed = stateKey.trim();
return <button
className={classNames(classes, {
mx_DevTools_RoomStateExplorer_button_hasSpaces: trimmed.length !== stateKey.length,
mx_DevTools_RoomStateExplorer_button_emptyString: !trimmed,
})}
key={stateKey}
onClick={this.onViewSourceClick(ev)}
>
{ trimmed ? stateKey : _t("<%(count)s spaces>", { count: stateKey.length }) }
</button>;
})
}