]> Untitled Git - lemmy-ui.git/blobdiff - src/shared/components/common/data-type-select.tsx
component classes v2
[lemmy-ui.git] / src / shared / components / common / data-type-select.tsx
index b9b6a6f580c07a04cac295e7f93c9203c39e9162..b61d6840ff7b4e769d806af1a34634337e4138b5 100644 (file)
@@ -15,13 +15,12 @@ export class DataTypeSelect extends Component<
   DataTypeSelectProps,
   DataTypeSelectState
 > {
-  private emptyState: DataTypeSelectState = {
+  state: DataTypeSelectState = {
     type_: this.props.type_,
   };
 
   constructor(props: any, context: any) {
     super(props, context);
-    this.state = this.emptyState;
   }
 
   static getDerivedStateFromProps(props: any): DataTypeSelectProps {
@@ -32,7 +31,7 @@ export class DataTypeSelect extends Component<
 
   render() {
     return (
-      <div class="btn-group btn-group-toggle flex-wrap mb-2">
+      <div className="data-type-select btn-group btn-group-toggle flex-wrap">
         <label
           className={`pointer btn btn-outline-secondary 
             ${this.state.type_ == DataType.Post && "active"}
@@ -40,6 +39,7 @@ export class DataTypeSelect extends Component<
         >
           <input
             type="radio"
+            className="btn-check"
             value={DataType.Post}
             checked={this.state.type_ == DataType.Post}
             onChange={linkEvent(this, this.handleTypeChange)}
@@ -53,6 +53,7 @@ export class DataTypeSelect extends Component<
         >
           <input
             type="radio"
+            className="btn-check"
             value={DataType.Comment}
             checked={this.state.type_ == DataType.Comment}
             onChange={linkEvent(this, this.handleTypeChange)}
@@ -64,6 +65,6 @@ export class DataTypeSelect extends Component<
   }
 
   handleTypeChange(i: DataTypeSelect, event: any) {
-    i.props.onChange(Number(event.target.value));
+    i.props.onChange?.(Number(event.target.value));
   }
 }