diff --git a/plugins/plugin-client-common/src/components/Client/StatusStripe/Settings.tsx b/plugins/plugin-client-common/src/components/Client/StatusStripe/Settings.tsx index 6115a9de854..dd8d2837e61 100644 --- a/plugins/plugin-client-common/src/components/Client/StatusStripe/Settings.tsx +++ b/plugins/plugin-client-common/src/components/Client/StatusStripe/Settings.tsx @@ -22,11 +22,9 @@ import { getPersistedThemeChoice, i18n, pexecInCurrentTab, - uiThemes, - Theme + uiThemes } from '@kui-shell/core' -import { Loading } from '../../..' import DropdownWidget, { Props as DropdownWidgetProps } from './DropdownWidget' const strings = i18n('plugin-client-common') @@ -35,7 +33,7 @@ type Props = Pick interface State { currentTheme: string - themes: Theme[] + actions: DropdownWidgetProps['actions'] } export default class Settings extends React.PureComponent { @@ -44,7 +42,7 @@ export default class Settings extends React.PureComponent { this.state = { currentTheme: undefined, - themes: [] + actions: [] } this.recomputeThemeList() @@ -64,46 +62,15 @@ export default class Settings extends React.PureComponent { this.setState({ currentTheme, - themes: themes + actions: themes.map(_ => ({ + label: _.name, + isSelected: _.name === currentTheme, + handler: () => pexecInCurrentTab(`theme set ${encodeComponent(_.name)}`, undefined, true) + })) }) } - private header() { - if (!this.state.currentTheme) { - return - } else { - return ( - -
{strings('Current Theme')}
-
- {this.state.currentTheme} -
-
{this.changeTheme()}
-
- ) - } - } - - private body() { - if (!this.state.currentTheme) { - return - } else { - return - } - } - - /** @return UI for changing themes */ - private changeTheme() { - return ( - pexecInCurrentTab('themes')}> - {strings('Switch theme')} - - ) - } - public render() { - // aria-label="Settings" - // tabIndex={0} if (!this.state || !this.state.currentTheme) { return } @@ -113,11 +80,7 @@ export default class Settings extends React.PureComponent { noPadding id="kui--settings-widget" title={strings('Switch theme')} - actions={this.state.themes.map(_ => ({ - label: _.name, - isSelected: _.name === this.state.currentTheme, - handler: () => pexecInCurrentTab(`theme set ${encodeComponent(_.name)}`) - }))} + actions={this.state.actions} /> ) }