refactor(*): refactor model for classnames

src/checkbox/index.tsx

@@ -2,26 +2,30 @@ import * as React from "react"
 
 import "./style.scss"
 
-type Props = {
+export type Props = {
 	onChange?:any,
 	checked?:boolean,
 	children?:any,
 	className?:string
 	disabled?:boolean
 }
 
+import C from './model'
+
+import Icon from 'src/icon'
+
 export default (p:Props) => {
 
 	const {onChange, children, checked, className, disabled} = p;
 
 	return (
 		<div className={`field form-group checkbox-wrapper ${className ? className : ''}`}>
 			<div
-				className={`custom-checkbox ${checked ? 'checked' : ''} ${disabled ? 'disabled' : ''}`}
+				className={`custom-checkbox ${checked ? C.classNames.checkboxChecked : ''} ${disabled ? C.classNames.checkboxDisabled : ''}`}
 				onClick={()=>onChange(!checked)}>
 
-				<i className="material-icons unchecked">check_box_outline_blank</i>
-				<i className="material-icons checked">check_box</i>
+				<Icon name="check_box_outline_blank" />
+				<Icon name="check_box" />
 
 				<span className="children">{children}</span>
 

src/checkbox/model.ts

@@ -0,0 +1,8 @@
+export default {
+  classNames: {
+    checkboxWrapper: 'checkbox-wrapper',
+    checkbox: 'custom-checkbox',
+    checkboxChecked: 'checked',
+    checkboxDisabled: 'disabled'
+  }
+}

src/filtered/index.tsx

@@ -29,6 +29,7 @@ export type Props<T> = VProps<T> & {
 	children?:any,
 	filter?:string
 	onChangeFilter?,
+	hideFilter?
 	selectable?
 	onChangeSelection?
 }
@@ -70,11 +71,9 @@ export default class FilteredVirtualizedTable<T> extends React.Component<Props<T
 	}
 
 	componentWillReceiveProps(n:Props<T>){
-		//if(n.items.length != this.props.items.length){
 		if(JSON.stringify(n.items) != JSON.stringify(this.props.items)){
 			this.load(n)
 		}
-		//}
 	}
 
 	setFilteredList(items){
@@ -175,22 +174,25 @@ export default class FilteredVirtualizedTable<T> extends React.Component<Props<T
 
 		return (
 			<div className={`filtered-virtualized-table ${!vTableProps.height?'window-scroll':''}`}>
-				<div className="head">
-					<div className="filter-box">
-						<SearchField
-						value={filter}
-						onChange={this.setFilter}/>
+				{
+					p.hideFilter &&
+					<div className="head">
+						<div className="filter-box">
+							<SearchField
+							value={filter}
+							onChange={this.setFilter}/>
+							{
+								<span className="badge badge-secondary counter">{counter.visible}</span>
+							}
+						</div>
 						{
-							<span className="badge badge-secondary counter">{counter.visible}</span>
+							children &&
+							<div className="other-filters">
+								{children}
+							</div>
 						}
 					</div>
-					{
-						children &&
-						<div className="other-filters">
-							{children}
-						</div>
-					}
-				</div>
+				}
 				<VTable {...vTableProps} columns={_columns} items={filteredList} />
 			</div>
 		)

src/icon/index.tsx

@@ -5,8 +5,10 @@ export type Props = {
 	name:string
 }
 
+import CP from 'src/model'
+
 const Icon = (p:Props) => {
-	return <i className={`material-icons ${p.type || ''}`}>{p.name}</i>
+	return <i className={`${CP.classNames.icon} ${p.type || ''}`}>{p.name}</i>
 }
 
 export default Icon

src/icon/model.ts

@@ -0,0 +1,5 @@
+export default {
+  classNames: {
+    icon: 'material-icons'
+  }
+}

src/searchfield/index.tsx

@@ -1,19 +1,21 @@
 import * as React from 'react'
 
-type Props = {
+export type Props = {
 	onChange:Function,
 	value
 }
 
 import Icon from 'src/icon'
 
+import CP from 'src/model'
+
 export default (p:Props) => {
 	const {
 		onChange,
 		value
 	} = p
 	return (
-		<div className="search-box">
+		<div className={CP.classNames.searchField}>
 			<div className="input-group">
 
 				<input type="text" className="form-control"

src/searchfield/model.ts

@@ -0,0 +1,5 @@
+export default {
+  classNames: {
+    searchField: 'search-box'
+  }
+}