diff options
| author | bobzel <zzzman@gmail.com> | 2023-12-06 20:02:36 -0500 |
|---|---|---|
| committer | bobzel <zzzman@gmail.com> | 2023-12-06 20:02:36 -0500 |
| commit | c30a5b644458a7ab03a4dabe93face035aa0a21b (patch) | |
| tree | 2fed8f18909ad185757ae96eb93eb85482ac3a6c /src/client/views/search | |
| parent | 6d38096db5f0d550866d82d954436447d0c36a65 (diff) | |
more error/warning fixes
Diffstat (limited to 'src/client/views/search')
| -rw-r--r-- | src/client/views/search/IconButton.tsx | 76 |
1 files changed, 40 insertions, 36 deletions
diff --git a/src/client/views/search/IconButton.tsx b/src/client/views/search/IconButton.tsx index 6cf3a5f72..9aae347e7 100644 --- a/src/client/views/search/IconButton.tsx +++ b/src/client/views/search/IconButton.tsx @@ -1,29 +1,28 @@ import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; -import * as _ from "lodash"; +import * as _ from 'lodash'; import { action, IReactionDisposer, observable, reaction, runInAction } from 'mobx'; import { observer } from 'mobx-react'; import * as React from 'react'; -import { DocumentType } from "../../documents/DocumentTypes"; +import { DocumentType } from '../../documents/DocumentTypes'; import '../global/globalCssVariables.scss'; import { IconBar } from './IconBar'; -import "./IconButton.scss"; -import "./SearchBox.scss"; +import './IconButton.scss'; +import './SearchBox.scss'; import { Font } from '@react-pdf/renderer'; -interface IconButtonProps { +interface iconButtonProps { type: string; } @observer -export class IconButton extends React.Component<IconButtonProps>{ - +export class IconButton extends React.Component<iconButtonProps> { @observable private _isSelected: boolean = IconBar.Instance.getIcons().indexOf(this.props.type) !== -1; @observable private _hover = false; private _resetReaction?: IReactionDisposer; private _selectAllReaction?: IReactionDisposer; static Instance: IconButton; - constructor(props: IconButtonProps) { + constructor(props: iconButtonProps) { super(props); IconButton.Instance = this; } @@ -40,7 +39,7 @@ export class IconButton extends React.Component<IconButtonProps>{ IconBar.Instance._resetClicked = false; } } - }), + }) ); this._selectAllReaction = reaction( @@ -54,24 +53,35 @@ export class IconButton extends React.Component<IconButtonProps>{ IconBar.Instance._selectAllClicked = false; } } - }), + }) ); - } + }; @action.bound getIcon() { switch (this.props.type) { - case (DocumentType.NONE): return "ban"; - case (DocumentType.AUDIO): return "music"; - case (DocumentType.COL): return "object-group"; - case (DocumentType.IMG): return "image"; - case (DocumentType.LINK): return "link"; - case (DocumentType.PDF): return "file-pdf"; - case (DocumentType.RTF): return "sticky-note"; - case (DocumentType.VID): return "video"; - case (DocumentType.WEB): return "globe-asia"; - case (DocumentType.MAP): return "map-marker-alt"; - default: return "caret-down"; + case DocumentType.NONE: + return 'ban'; + case DocumentType.AUDIO: + return 'music'; + case DocumentType.COL: + return 'object-group'; + case DocumentType.IMG: + return 'image'; + case DocumentType.LINK: + return 'link'; + case DocumentType.PDF: + return 'file-pdf'; + case DocumentType.RTF: + return 'sticky-note'; + case DocumentType.VID: + return 'video'; + case DocumentType.WEB: + return 'globe-asia'; + case DocumentType.MAP: + return 'map-marker-alt'; + default: + return 'caret-down'; } } @@ -82,45 +92,39 @@ export class IconButton extends React.Component<IconButtonProps>{ if (!this._isSelected) { this._isSelected = true; newList.push(this.props.type); - } - else { + } else { this._isSelected = false; _.pull(newList, this.props.type); } IconBar.Instance.updateIcon(newList); - } + }; selected = { opacity: 1, - backgroundColor: "#121721", + backgroundColor: '#121721', //backgroundColor: "rgb(128, 128, 128)" }; notSelected = { opacity: 0.2, - backgroundColor: "#121721", + backgroundColor: '#121721', }; hoverStyle = { opacity: 1, - backgroundColor: "rgb(128, 128, 128)" + backgroundColor: 'rgb(128, 128, 128)', //backgroundColor: "rgb(178, 206, 248)" //$medium-blue }; render() { return ( - <div className="type-outer" id={this.props.type + "-filter"} - onMouseEnter={() => this._hover = true} - onMouseLeave={() => this._hover = false} - onClick={this.onClick}> - <div className="type-icon" id={this.props.type + "-icon"} - style={this._hover ? this.hoverStyle : this._isSelected ? this.selected : this.notSelected} - > + <div className="type-outer" id={this.props.type + '-filter'} onMouseEnter={() => (this._hover = true)} onMouseLeave={() => (this._hover = false)} onClick={this.onClick}> + <div className="type-icon" id={this.props.type + '-icon'} style={this._hover ? this.hoverStyle : this._isSelected ? this.selected : this.notSelected}> <FontAwesomeIcon className="fontawesome-icon" icon={this.getIcon()} /> </div> {/* <div className="filter-description">{this.props.type}</div> */} </div> ); } -}
\ No newline at end of file +} |
