Skip to content

Commit

Permalink
Upgrade to PatternFly 5 Alpha
Browse files Browse the repository at this point in the history
  • Loading branch information
@justin-stephenson
justin-stephenson committed May 17, 2023
1 parent 4b0bfc7 commit 12ab19b
Show file tree
Hide file tree
Showing 4 changed files with 75 additions and 75 deletions.
3 changes: 2 additions & 1 deletion package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -47,7 +47,8 @@
"@patternfly/react-core": "5.0.0-alpha.72",
"@patternfly/react-styles": "5.0.0-alpha.7",
"@patternfly/react-icons": "5.0.0-alpha.10",
"@patternfly/react-table": "^4.113.0",
"@patternfly/react-tokens": "5.0.0-alpha.9",
"@patternfly/react-table": "5.0.0-alpha.74",
"buffer": "^6.0.3",
"comment-json": "^4.2.3",
"date-fns": "^2.29.3",
Expand Down
82 changes: 46 additions & 36 deletions src/config.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -36,10 +36,9 @@ import {
Bullseye,
EmptyState,
EmptyStateIcon,
Title,
EmptyStateBody,
EmptyStateVariant,
Page, PageSection,
Page, PageSection, EmptyStateHeader,
} from "@patternfly/react-core";
import { ExclamationCircleIcon } from "@patternfly/react-icons";
import { global_danger_color_200 } from "@patternfly/react-tokens";
Expand All @@ -53,6 +52,7 @@ class GeneralConfig extends React.Component {
constructor(props) {
super(props);
this.handleSubmit = this.handleSubmit.bind(this);
this.handleInputChange = this.handleInputChange.bind(this);
this.setConfig = this.setConfig.bind(this);
this.fileReadFailed = this.fileReadFailed.bind(this);
this.readConfig = this.readConfig.bind(this);
Expand Down Expand Up @@ -191,6 +191,12 @@ class GeneralConfig extends React.Component {
this.readConfig();
}

handleInputChange(name, value) {
const state = {};
state[name] = value;
this.setState(state);
}

render() {
const form =
(this.state.config_loaded === false && this.state.file_error === false)
Expand All @@ -202,14 +208,14 @@ class GeneralConfig extends React.Component {
<TextInput
id="shell"
value={this.state.shell}
onChange={shell => this.setState({ shell })}
onChange={(_event, value) => this.handleInputChange("shell", _event, value)}
/>
</FormGroup>
<FormGroup label={_("Notice")}>
<TextInput
id="notice"
value={this.state.notice}
onChange={notice => this.setState({ notice })}
onChange={(_event, value) => this.handleInputChange("notice", _event, value)}
/>
</FormGroup>
<FormGroup label={_("Latency")}>
Expand All @@ -218,7 +224,7 @@ class GeneralConfig extends React.Component {
type="number"
step="1"
value={this.state.latency}
onChange={latency => this.setState({ latency })}
onChange={(_event, value) => this.handleInputChange("latency", _event, value)}
/>
</FormGroup>
<FormGroup label={_("Payload Size, bytes")}>
Expand All @@ -227,26 +233,26 @@ class GeneralConfig extends React.Component {
type="number"
step="1"
value={this.state.payload}
onChange={payload => this.setState({ payload })}
onChange={(_event, value) => this.handleInputChange("payload", _event, value)}
/>
</FormGroup>
<FormGroup label={_("Logging")}>
<Checkbox
id="log_input"
isChecked={this.state.log_input}
onChange={log_input => this.setState({ log_input })}
onChange={(_event, log_input) => this.setState({ log_input })}
label={_("User's Input")}
/>
<Checkbox
id="log_output"
isChecked={this.state.log_output}
onChange={log_output => this.setState({ log_output })}
onChange={(_event, log_output) => this.setState({ log_output })}
label={_("User's Output")}
/>
<Checkbox
id="log_window"
isChecked={this.state.log_window}
onChange={log_window => this.setState({ log_window })}
onChange={(_event, log_window) => this.setState({ log_window })}
label={_("Window Resize")}
/>
</FormGroup>
Expand All @@ -256,7 +262,7 @@ class GeneralConfig extends React.Component {
type="number"
step="1"
value={this.state.limit_rate}
onChange={limit_rate => this.setState({ limit_rate })}
onChange={(_event, value) => this.handleInputChange("limit_rate", _event, value)}
/>
</FormGroup>
<FormGroup label={_("Burst, bytes")}>
Expand All @@ -265,14 +271,14 @@ class GeneralConfig extends React.Component {
type="number"
step="1"
value={this.state.limit_burst}
onChange={limit_burst => this.setState({ limit_burst })}
onChange={(_event, value) => this.handleInputChange("limit_burst", _event, value)}
/>
</FormGroup>
<FormGroup label={_("Logging Limit Action")}>
<FormSelect
id="limit_action"
value={this.state.limit_action}
onChange={limit_action => this.setState({ limit_action })}
onChange={(_event, value) => this.handleInputChange("limit_action", _event, value)}
>
{[
{ value: "", label: "" },
Expand All @@ -292,23 +298,22 @@ class GeneralConfig extends React.Component {
<TextInput
id="file_path"
value={this.state.file_path}
onChange={file_path => this.setState({ file_path })}
onChange={(_event, value) => this.handleInputChange("file_path", _event, value)}
/>
</FormGroup>
<FormGroup label={_("Syslog Facility")}>
<TextInput
id="syslog_facility"
value={this.state.syslog_facility}
onChange={syslog_facility =>
this.setState({ syslog_facility })}
onChange={(_event, value) => this.handleInputChange("syslog_facility", _event, value)}

/>
</FormGroup>
<FormGroup label={_("Syslog Priority")}>
<FormSelect
id="syslog_priority"
value={this.state.syslog_priority}
onChange={syslog_priority =>
this.setState({ syslog_priority })}
onChange={(_event, value) => this.handleInputChange("syslog_priority", _event, value)}
>
{[
{ value: "", label: "" },
Expand All @@ -326,8 +331,8 @@ class GeneralConfig extends React.Component {
<FormSelect
id="journal_priority"
value={this.state.journal_priority}
onChange={journal_priority =>
this.setState({ journal_priority })}
onChange={(_event, value) => this.handleInputChange("journal_priority", _event, value)}

>
{[
{ value: "", label: "" },
Expand All @@ -345,17 +350,15 @@ class GeneralConfig extends React.Component {
<Checkbox
id="journal_augment"
isChecked={this.state.journal_augment}
onChange={journal_augment =>
this.setState({ journal_augment })}
onChange={(_event, journal_augment) => this.setState({ journal_augment })}
label={_("Augment")}
/>
</FormGroup>
<FormGroup label={_("Writer")}>
<FormSelect
id="writer"
value={this.state.writer}
onChange={writer =>
this.setState({ writer })}
onChange={(_event, value) => this.handleInputChange("writer", _event, value)}
>
{[
{ value: "", label: "" },
Expand Down Expand Up @@ -385,17 +388,17 @@ class GeneralConfig extends React.Component {
)
: (
<Bullseye>
<EmptyState variant={EmptyStateVariant.small}>
<EmptyStateIcon
<EmptyState variant={EmptyStateVariant.sm}>
<EmptyStateHeader
titleText={<>{_("There is no configuration file of tlog present in your system.")}</>}
icon={
<EmptyStateIcon
icon={ExclamationCircleIcon}
color={global_danger_color_200.value}
/>
} headingLevel="h4"
/>
<Title headingLevel="h4" size="lg">
{_("There is no configuration file of tlog present in your system.")}
</Title>
<Title headingLevel="h4" size="lg">
{_("Please, check the /etc/tlog/tlog-rec-session.conf or if tlog is installed.")}
</Title>
<EmptyStateHeader titleText={<>{_("Please, check the /etc/tlog/tlog-rec-session.conf or if tlog is installed.")}</>} headingLevel="h4" />
<EmptyStateBody>
{this.state.file_error}
</EmptyStateBody>
Expand All @@ -416,6 +419,7 @@ class SssdConfig extends React.Component {
constructor(props) {
super(props);
this.handleSubmit = this.handleSubmit.bind(this);
this.handleInputChange = this.handleInputChange.bind(this);
this.confSave = this.confSave.bind(this);
this.restartSSSD = this.restartSSSD.bind(this);
this.file = null;
Expand Down Expand Up @@ -543,14 +547,20 @@ class SssdConfig extends React.Component {
e.preventDefault();
}

handleInputChange(name, value) {
const state = {};
state[name] = value;
this.setState(state);
}

render() {
const form = (
<Form isHorizontal>
<FormGroup label="Scope">
<FormSelect
id="scope"
value={this.state.scope}
onChange={scope => this.setState({ scope })}
onChange={(_event, value) => this.handleInputChange("scope", _event, value)}
>
{[
{ value: "none", label: _("None") },
Expand All @@ -571,14 +581,14 @@ class SssdConfig extends React.Component {
<TextInput
id="users"
value={this.state.users}
onChange={users => this.setState({ users })}
onChange={(_event, value) => this.handleInputChange("users", _event, value)}
/>
</FormGroup>
<FormGroup label={_("Groups")}>
<TextInput
id="groups"
value={this.state.groups}
onChange={groups => this.setState({ groups })}
onChange={(_event, value) => this.handleInputChange("groups", _event, value)}
/>
</FormGroup>
</>}
Expand All @@ -588,14 +598,14 @@ class SssdConfig extends React.Component {
<TextInput
id="exclude_users"
value={this.state.exclude_users}
onChange={exclude_users => this.setState({ exclude_users })}
onChange={(_event, value) => this.handleInputChange("exclude_users", _event, value)}
/>
</FormGroup>
<FormGroup label={_("Exclude Groups")}>
<TextInput
id="exclude_groups"
value={this.state.exclude_groups}
onChange={exclude_groups => this.setState({ exclude_groups })}
onChange={(_event, value) => this.handleInputChange("exclude_groups", _event, value)}
/>
</FormGroup>
</>}
Expand Down
4 changes: 2 additions & 2 deletions src/player.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -692,7 +692,7 @@ class Search extends React.Component {
id="search_rec"
type="search"
value={this.state.search}
onChange={value => this.handleInputChange("search", value)}
onChange={(_event, value) => this.handleInputChange("search", value)}
/>
<Button
variant="control"
Expand Down Expand Up @@ -1357,7 +1357,7 @@ export class Player extends React.Component {
);

const visualControls = (
<ToolbarGroup variant="icon-button-group" alignment={{ default: 'alignRight' }}>
<ToolbarGroup variant="icon-button-group" align={{ default: 'alignRight' }}>
<ToolbarItem>
<Button
variant="plain"
Expand Down
Loading

0 comments on commit 12ab19b

Please sign in to comment.