fix: add bg url, search tooltip, stats changes

Co-authored-by: David Ralph <me@davidcralph.co.uk>
This commit is contained in:
alexsparkes
2023-03-15 18:34:02 +00:00
parent 0313408b66
commit 6d315974cc
29 changed files with 776 additions and 781 deletions

View File

@@ -29,6 +29,7 @@ export default class CustomSettings extends PureComponent {
this.state = {
customBackground: this.getCustom(),
customURLModal: false,
urlError: '',
};
this.customDnd = createRef(null);
}
@@ -130,6 +131,16 @@ export default class CustomSettings extends PureComponent {
}
addCustomURL(e) {
// regex: https://ihateregex.io/expr/url/
// eslint-disable-next-line no-useless-escape
const urlRegex =
/https?:\/\/(www\.)?[-a-zA-Z0-9@:%._~#=]{1,256}\.[a-zA-Z0-9()]{1,6}\b([-a-zA-Z0-9()!@:%_.~#?&=]*)/;
if (urlRegex.test(e) === false) {
return this.setState({
urlError: variables.getMessage('widgets.quicklinks.url_error'),
});
}
this.setState({
customURLModal: false,
currentBackgroundIndex: this.state.customBackground.length,
@@ -273,6 +284,7 @@ export default class CustomSettings extends PureComponent {
>
<CustomURLModal
modalClose={(e) => this.addCustomURL(e)}
urlError={this.state.urlError}
modalCloseOnly={() => this.setState({ customURLModal: false })}
/>
</Modal>

View File

@@ -1,9 +1,9 @@
import variables from 'modules/variables';
import { useState, memo } from 'react';
import { MdAdd, MdClose } from 'react-icons/md';
import { MdAdd, MdClose, MdOutlineAddLink } from 'react-icons/md';
import Tooltip from 'components/helpers/tooltip/Tooltip';
function CustomURLModal({ modalClose, modalCloseOnly }) {
function CustomURLModal({ modalClose, urlError, modalCloseOnly }) {
const [url, setURL] = useState();
return (
@@ -20,23 +20,24 @@ function CustomURLModal({ modalClose, modalCloseOnly }) {
</div>
</Tooltip>
</div>
<div className="copy">
<input
type="text"
value={url}
onChange={(e) => setURL(e.target.value)}
onChange={(e) => setURL(e.target.value.replace(/(\r\n|\n|\r)/gm, ''))}
varient="outlined"
/>
<Tooltip
title={variables.getMessage('modals.main.settings.sections.background.source.add_url')}
placement="top"
>
<button onClick={() => modalClose(url)}>
<MdAdd />
</button>
</Tooltip>
<span className="dropdown-error">{urlError}</span>
<div className="resetFooter">
<button className="textButton" onClick={modalCloseOnly}>
<MdClose />
{variables.getMessage('modals.main.settings.sections.advanced.reset_modal.cancel')}
</button>
<button onClick={() => modalClose(url)}>
<MdOutlineAddLink />
{variables.getMessage('modals.main.settings.sections.background.source.add_url')}
</button>
</div>
</div>
</div>
);
}