Search term highlighting in result table.

Kai Reinhard

16.44.2018 45f2524c72315adcf1fce458b16b070be48925f6

Search term highlighting in result table.

 borgbutler-webapp/src/components/views/archives/FileListPanel.jsx

@@ -22,7 +22,7 @@

    handleInputChange = (event) => {
        event.preventDefault();
        this.setState({filter : {...this.state.filter, [event.target.name]: event.target.value}});
        this.setState({filter: {...this.state.filter, [event.target.name]: event.target.value}});
    };


@@ -87,7 +87,8 @@
                        }}
                    />
                    <FileListTable
                        entries={this.state.fileList}/>
                        entries={this.state.fileList}
                        search={this.state.filter.search}/>
                </React.Fragment>;
            }
        }

 borgbutler-webapp/src/components/views/archives/FileListTable.jsx

@@ -4,7 +4,7 @@
import FileListEntry from './FileListEntry';

function FileListTable({entries, search}) {
    const lowercaseSearch = search.toLowerCase();
    const lowercaseSearch = search.split(' ')[0].toLowerCase();
    return (
        <Table striped bordered hover size={'sm'} responsive>
            <thead>
@@ -13,13 +13,11 @@
                <th>Modified time</th>
                <th>Size</th>
                <th>Path</th>
                <th></th>
            </tr>
            </thead>
            <tbody>
            {entries
                .filter(entry => [entry.message]
                    .join('|#|').toLowerCase()
                    .indexOf(lowercaseSearch) !== -1)
                .map((entry, index) => <FileListEntry
                    entry={entry}
                    search={lowercaseSearch}