a
/
badguardhome
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Merge pull request #57 in DNS/adguard-dns from feature/354 to master 

* commit '0545aeff3fb8368238e8c61d43589ef8b4a6d8e8':
  Fix variable
  Add hash to the static JS/CSS
  Fix tooltip width
  Fix default filtering for query log
  Fix textarea width
This commit is contained in:
Eugene Bujak 2018-10-09 21:15:26 +03:00
parent 165722585f 0545aeff3f
commit 93c451cb0c
8 changed files with 35 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
client/src/components/Dashboard/Counters.js
View File

@ -4,6 +4,8 @@ import PropTypes from 'prop-types';
import Card from '../ui/Card'; import Card from '../ui/Card';
import Tooltip from '../ui/Tooltip'; import Tooltip from '../ui/Tooltip';
const tooltipType = 'tooltip-custom--narrow';
const Counters = props => ( const Counters = props => (
<Card title="General statistics" subtitle="in the last 24 hours" bodyType="card-table" refresh={props.refreshButton}> <Card title="General statistics" subtitle="in the last 24 hours" bodyType="card-table" refresh={props.refreshButton}>
<table className="table card-table"> <table className="table card-table">
@ -11,7 +13,7 @@ const Counters = props => (
<tr> <tr>
<td> <td>
DNS Queries DNS Queries
<Tooltip text="A number of DNS quieries processed in the last 24 hours" /> <Tooltip text="A number of DNS quieries processed in the last 24 hours" type={tooltipType} />
</td> </td>
<td className="text-right"> <td className="text-right">
<span className="text-muted"> <span className="text-muted">
@ -22,7 +24,7 @@ const Counters = props => (
<tr> <tr>
<td> <td>
Blocked by filters Blocked by filters
<Tooltip text="A number of DNS requests blocked by filters" /> <Tooltip text="A number of DNS requests blocked by filters" type={tooltipType} />
</td> </td>
<td className="text-right"> <td className="text-right">
<span className="text-muted"> <span className="text-muted">
@ -33,7 +35,7 @@ const Counters = props => (
<tr> <tr>
<td> <td>
Blocked malware/phishing Blocked malware/phishing
<Tooltip text="A number of DNS requests blocked" /> <Tooltip text="A number of DNS requests blocked" type={tooltipType} />
</td> </td>
<td className="text-right"> <td className="text-right">
<span className="text-muted"> <span className="text-muted">
@ -44,7 +46,7 @@ const Counters = props => (
<tr> <tr>
<td> <td>
Blocked adult websites Blocked adult websites
<Tooltip text="A number of adult websites blocked" /> <Tooltip text="A number of adult websites blocked" type={tooltipType} />
</td> </td>
<td className="text-right"> <td className="text-right">
<span className="text-muted"> <span className="text-muted">
@ -55,7 +57,7 @@ const Counters = props => (
<tr> <tr>
<td> <td>
Enforced safe search Enforced safe search
<Tooltip text="A number of DNS requests to search engines for which Safe Search was enforced" /> <Tooltip text="A number of DNS requests to search engines for which Safe Search was enforced" type={tooltipType} />
</td> </td>
<td className="text-right"> <td className="text-right">
<span className="text-muted"> <span className="text-muted">
@ -66,7 +68,7 @@ const Counters = props => (
<tr> <tr>
<td> <td>
Average processing time Average processing time
<Tooltip text="Average time in milliseconds on processing a DNS request" /> <Tooltip text="Average time in milliseconds on processing a DNS request" type={tooltipType} />
</td> </td>
<td className="text-right"> <td className="text-right">
<span className="text-muted"> <span className="text-muted">

2
client/src/components/Filters/UserRules.js
View File

@ -20,7 +20,7 @@ export default class UserRules extends Component {
subtitle="Enter one rule on a line. You can use either adblock rules or hosts files syntax." subtitle="Enter one rule on a line. You can use either adblock rules or hosts files syntax."
> >
<form onSubmit={this.handleSubmit}> <form onSubmit={this.handleSubmit}>
<textarea className="form-control form-control--textarea" value={this.props.userRules} onChange={this.handleChange} /> <textarea className="form-control form-control--textarea-large" value={this.props.userRules} onChange={this.handleChange} />
<div className="card-actions"> <div className="card-actions">
<button <button
className="btn btn-success btn-standart" className="btn btn-success btn-standart"

17
client/src/components/Logs/index.js
View File

@ -42,14 +42,10 @@ class Logs extends Component {
toggleBlocking = (type, domain) => { toggleBlocking = (type, domain) => {
const { userRules } = this.props.filtering; const { userRules } = this.props.filtering;
const lineEnding = !endsWith(userRules, '\n') ? '\n' : ''; const lineEnding = !endsWith(userRules, '\n') ? '\n' : '';
let blockingRule = `@@||${domain}^$important`; const baseRule = `||${domain}^$important`;
let unblockingRule = `||${domain}^$important`; const baseUnblocking = `@@${baseRule}`;
const blockingRule = type === 'block' ? baseUnblocking : baseRule;
if (type === 'unblock') { const unblockingRule = type === 'block' ? baseRule : baseUnblocking;
blockingRule = `||${domain}^$important`;
unblockingRule = `@@||${domain}^$important`;
}
const preparedBlockingRule = new RegExp(`(^|\n)${escapeRegExp(blockingRule)}($|\n)`); const preparedBlockingRule = new RegExp(`(^|\n)${escapeRegExp(blockingRule)}($|\n)`);
const preparedUnblockingRule = new RegExp(`(^|\n)${escapeRegExp(unblockingRule)}($|\n)`); const preparedUnblockingRule = new RegExp(`(^|\n)${escapeRegExp(unblockingRule)}($|\n)`);
@ -189,6 +185,11 @@ class Logs extends Component {
defaultPageSize={50} defaultPageSize={50}
minRows={7} minRows={7}
noDataText="No logs found" noDataText="No logs found"
defaultFilterMethod={(filter, row) => {
const id = filter.pivotId || filter.id;
return row[id] !== undefined ?
String(row[id]).indexOf(filter.value) !== -1 : true;
}}
defaultSorted={[ defaultSorted={[
{ {
id: 'time', id: 'time',

4
client/src/components/Settings/Settings.css
View File

@ -14,3 +14,7 @@
.form-control--textarea { .form-control--textarea {
min-height: 110px; min-height: 110px;
} }
.form-control--textarea-large {
min-height: 240px;
}

4
client/src/components/ui/Card.css
View File

@ -40,11 +40,11 @@
background-size: 14px; background-size: 14px;
background-position: center; background-position: center;
background-repeat: no-repeat; background-repeat: no-repeat;
background-image: url('data:image/svg+xml;base64,PHN2ZyBmaWxsPSJub25lIiBoZWlnaHQ9IjI0IiBzdHJva2U9IiM0NjdmY2YiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIyIiB2aWV3Qm94PSIwIDAgMjQgMjQiIHdpZHRoPSIyNCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBkPSJtMjMgNHY2aC02Ii8+PHBhdGggZD0ibTEgMjB2LTZoNiIvPjxwYXRoIGQ9Im0zLjUxIDlhOSA5IDAgMCAxIDE0Ljg1LTMuMzZsNC42NCA0LjM2bS0yMiA0IDQuNjQgNC4zNmE5IDkgMCAwIDAgMTQuODUtMy4zNiIvPjwvc3ZnPg=='); background-image: url("data:image/svg+xml;base64,PHN2ZyBmaWxsPSJub25lIiBoZWlnaHQ9IjI0IiBzdHJva2U9IiM0NjdmY2YiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIyIiB2aWV3Qm94PSIwIDAgMjQgMjQiIHdpZHRoPSIyNCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBkPSJtMjMgNHY2aC02Ii8+PHBhdGggZD0ibTEgMjB2LTZoNiIvPjxwYXRoIGQ9Im0zLjUxIDlhOSA5IDAgMCAxIDE0Ljg1LTMuMzZsNC42NCA0LjM2bS0yMiA0IDQuNjQgNC4zNmE5IDkgMCAwIDAgMTQuODUtMy4zNiIvPjwvc3ZnPg==");
} }
.card-refresh:hover, .card-refresh:hover,
.card-refresh:not(:disabled):not(.disabled):active, .card-refresh:not(:disabled):not(.disabled):active,
.card-refresh:focus:active { .card-refresh:focus:active {
background-image: url('data:image/svg+xml;base64,PHN2ZyBmaWxsPSJub25lIiBoZWlnaHQ9IjI0IiBzdHJva2U9IiNmZmYiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIyIiB2aWV3Qm94PSIwIDAgMjQgMjQiIHdpZHRoPSIyNCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBkPSJtMjMgNHY2aC02Ii8+PHBhdGggZD0ibTEgMjB2LTZoNiIvPjxwYXRoIGQ9Im0zLjUxIDlhOSA5IDAgMCAxIDE0Ljg1LTMuMzZsNC42NCA0LjM2bS0yMiA0IDQuNjQgNC4zNmE5IDkgMCAwIDAgMTQuODUtMy4zNiIvPjwvc3ZnPg=='); background-image: url("data:image/svg+xml;base64,PHN2ZyBmaWxsPSJub25lIiBoZWlnaHQ9IjI0IiBzdHJva2U9IiNmZmYiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIyIiB2aWV3Qm94PSIwIDAgMjQgMjQiIHdpZHRoPSIyNCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBkPSJtMjMgNHY2aC02Ii8+PHBhdGggZD0ibTEgMjB2LTZoNiIvPjxwYXRoIGQ9Im0zLjUxIDlhOSA5IDAgMCAxIDE0Ljg1LTMuMzZsNC42NCA0LjM2bS0yMiA0IDQuNjQgNC4zNmE5IDkgMCAwIDAgMTQuODUtMy4zNiIvPjwvc3ZnPg==");
} }

8
client/src/components/ui/Tooltip.css
View File

@ -17,14 +17,14 @@
display: block; display: block;
position: absolute; position: absolute;
bottom: calc(100% + 12px); bottom: calc(100% + 12px);
left: calc(50% - 103px); left: 50%;
width: 206px;
padding: 10px 15px; padding: 10px 15px;
font-size: 0.85rem; font-size: 0.85rem;
text-align: center; text-align: center;
color: #fff; color: #fff;
background-color: #585965; background-color: #585965;
border-radius: 3px; border-radius: 3px;
transform: translateX(-50%);
visibility: hidden; visibility: hidden;
opacity: 0; opacity: 0;
} }
@ -48,3 +48,7 @@
visibility: visible; visibility: visible;
opacity: 1; opacity: 1;
} }
.tooltip-custom--narrow:before {
width: 206px;
}

3
client/src/components/ui/Tooltip.js
View File

@ -4,11 +4,12 @@ import PropTypes from 'prop-types';
import './Tooltip.css'; import './Tooltip.css';
const Tooltip = props => ( const Tooltip = props => (
<div data-tooltip={props.text} className="tooltip-custom"></div> <div data-tooltip={props.text} className={`tooltip-custom ${props.type}`}></div>
); );
Tooltip.propTypes = { Tooltip.propTypes = {
text: PropTypes.string.isRequired, text: PropTypes.string.isRequired,
type: PropTypes.string,
}; };
export default Tooltip; export default Tooltip;

5
client/webpack.common.js
View File

@ -19,7 +19,7 @@ const config = {
}, },
output: { output: {
path: PUBLIC_PATH, path: PUBLIC_PATH,
filename: '[name].js', filename: '[name].[chunkhash].js',
}, },
resolve: { resolve: {
modules: ['node_modules'], modules: ['node_modules'],
@ -94,10 +94,11 @@ const config = {
}), }),
new HtmlWebpackPlugin({ new HtmlWebpackPlugin({
inject: true, inject: true,
cache: false,
template: HTML_PATH, template: HTML_PATH,
}), }),
new ExtractTextPlugin({ new ExtractTextPlugin({
filename: '[name].css', filename: '[name].[contenthash].css',
}), }),
], ],
}; };