fix: search-input warning, removed outdated items-list.tsx

Signed-off-by: Roman <ixrock@gmail.com>

src/renderer/components/input/search-input.tsx

@@ -26,7 +26,7 @@ const defaultProps: Partial<Props> = {
 export class SearchInput extends React.Component<Props> {
   static defaultProps = defaultProps as object;
 
-  @observable inputVal: string;
+  @observable inputVal = ""; // fix: use empty string to avoid react warnings
 
   @disposeOnUnmount
   updateInput = autorun(() => this.inputVal = getSearch())

src/renderer/components/items-list/index.ts

@@ -1 +0,0 @@
-export * from "./items-list"

src/renderer/components/items-list/items-list.scss

@@ -1,45 +0,0 @@
-.ItemsList {
-  &.selectable {
-    .Item:not(.disabled) {
-      cursor: pointer;
-
-      &:hover {
-        background-color: #f7f7f7;
-        border-radius: $radius;
-      }
-    }
-  }
-
-  &.inline {
-    .Item {
-      margin-right: $margin;
-    }
-  }
-}
-
-.Item {
-  padding: $padding / 2;
-  margin: 0 $margin / -2;
-  user-select: none;
-
-  .Icon {
-    &.tick-icon {
-      color: $colorOk;
-    }
-
-    &.action-icon {
-      border-radius: $radius;
-      background: white;
-      color: #36393e;
-    }
-  }
-
-  &.selected {
-  }
-
-  &.disabled {
-    opacity: .5;
-    pointer-events: none;
-  }
-}
-

src/renderer/components/items-list/items-list.tsx

@@ -1,121 +0,0 @@
-import './items-list.scss'
-import React from 'react'
-import { observer } from "mobx-react";
-import { cssNames } from "../../utils";
-import { Icon } from "../icon";
-
-interface ItemsListProps {
-  className?: string;
-  disabled?: boolean;
-  inline?: boolean;
-  selectable?: boolean;
-  multiSelect?: boolean;
-  showSelectedItems?: boolean;
-  showSelectedIcon?: boolean;
-  selectedValues?: any[];
-  onSelectChange(currentItem: any, selectedItems: any[]): void;
-}
-
-@observer
-export class ItemsList extends React.Component<ItemsListProps> {
-  static defaultProps: Partial<ItemsListProps> = {
-    selectable: true,
-    multiSelect: true,
-    showSelectedIcon: false,
-  }
-
-  onClickItem(itemValue: any) {
-    const { selectedValues, multiSelect, onSelectChange } = this.props;
-    if (multiSelect) {
-      const itemIndex = selectedValues.findIndex(value => value === itemValue);
-      if (itemIndex > -1) {
-        // remove
-        const newSelectedValues = [...selectedValues];
-        newSelectedValues.splice(itemIndex, 1);
-        onSelectChange(itemValue, newSelectedValues);
-      }
-      else {
-        // add
-        const newSelectedValues = [].concat(selectedValues, itemValue);
-        onSelectChange(itemValue, newSelectedValues)
-      }
-    }
-    else {
-      onSelectChange(itemValue, [itemValue]);
-    }
-  }
-
-  render() {
-    const { disabled, inline, selectable, selectedValues, showSelectedItems, showSelectedIcon } = this.props;
-    let { className, children } = this.props;
-    className = cssNames('ItemsList flex', className, {
-      selectable: selectable,
-      "inline wrap": inline,
-      column: !inline,
-    });
-    if (selectable) {
-      children = React.Children.toArray(children).map((item: React.ReactElement<ItemProps>) => {
-        const itemValue = item.props.value;
-        const isSelected = selectedValues.includes(itemValue);
-        const isDisabled = disabled !== undefined ? disabled : item.props.disabled;
-
-        if (showSelectedItems === false && isSelected) {
-          return null;
-        }
-
-        const onClick = (evt: React.MouseEvent<any>) => {
-          if (item.props.onClick) item.props.onClick(evt);
-          this.onClickItem(itemValue);
-        };
-
-        return React.cloneElement(item, {
-          showSelectedIcon: showSelectedIcon,
-          selected: isSelected,
-          disabled: isDisabled,
-          onClick: onClick,
-        })
-      });
-    }
-    return (
-      <ul className={className}>
-        {children}
-      </ul>
-    );
-  }
-}
-
-interface ItemProps extends React.HTMLProps<any> {
-  value: any;
-  className?: string;
-  disabled?: boolean;
-  selected?: boolean;
-  showSelectedIcon?: boolean;
-}
-
-const defaultProps: Partial<ItemProps> = {
-  showSelectedIcon: true,
-}
-
-export class Item extends React.Component<ItemProps> {
-  static defaultProps = defaultProps as object;
-
-  render() {
-    const { disabled, selected, value, showSelectedIcon, children, ...itemProps } = this.props;
-    let { className } = this.props;
-    className = cssNames('Item flex gaps', className, { disabled, selected });
-    const actionIcon = selected ? "remove" : "add";
-    return (
-      <li {...itemProps} className={className}>
-        <div className="value box grow">
-          {children}
-        </div>
-        {showSelectedIcon && selected && (
-          <Icon material="check" className="tick-icon box right"/>
-        )}
-        {!showSelectedIcon && (
-          <Icon className="action-icon" material={actionIcon}/>
-        )}
-      </li>
-    );
-  }
-}