mirror of https://github.com/mue/mue.git
Cleanup: Remove unused file
This commit is contained in:
parent
dbd85cdc95
commit
851e6ff7e8
|
@ -44,4 +44,6 @@ function ResetModal({ modalClose }) {
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
export default memo(ResetModal);
|
const MemoizedResetModal = memo(ResetModal);
|
||||||
|
|
||||||
|
export { MemoizedResetModal as default, MemoizedResetModal as ResetModal };
|
|
@ -0,0 +1 @@
|
||||||
|
export * from './ResetModal';
|
|
@ -2,3 +2,4 @@ export * from './Button';
|
||||||
export * from './Tooltip';
|
export * from './Tooltip';
|
||||||
export * from './ShareModal';
|
export * from './ShareModal';
|
||||||
export * from './AddModal';
|
export * from './AddModal';
|
||||||
|
export * from './ResetModal';
|
||||||
|
|
|
@ -11,7 +11,7 @@ import {
|
||||||
import { exportSettings, importSettings } from 'utils/settings';
|
import { exportSettings, importSettings } from 'utils/settings';
|
||||||
|
|
||||||
import { FileUpload, Text, Switch, Dropdown } from 'components/Form/Settings';
|
import { FileUpload, Text, Switch, Dropdown } from 'components/Form/Settings';
|
||||||
import ResetModal from '../ResetModal';
|
import { ResetModal } from 'components/Elements';
|
||||||
|
|
||||||
import { Header, Section, Row, Content, Action } from 'components/Layout/Settings';
|
import { Header, Section, Row, Content, Action } from 'components/Layout/Settings';
|
||||||
|
|
||||||
|
|
|
@ -1,273 +0,0 @@
|
||||||
import variables from 'config/variables';
|
|
||||||
import { PureComponent, createRef } from 'react';
|
|
||||||
import { MdAddLink, MdLinkOff } from 'react-icons/md';
|
|
||||||
import { Header, Row, Content, Action, PreferencesWrapper } from 'components/Layout/Settings';
|
|
||||||
import { Checkbox, Dropdown } from 'components/Form/Settings';
|
|
||||||
import { Button } from 'components/Elements';
|
|
||||||
import Modal from 'react-modal';
|
|
||||||
|
|
||||||
import AddModal from './quicklinks/AddModal';
|
|
||||||
|
|
||||||
import EventBus from 'utils/eventbus';
|
|
||||||
import QuickLink from './quicklinks/QuickLink';
|
|
||||||
import { getTitleFromUrl, isValidUrl } from 'utils/links';
|
|
||||||
|
|
||||||
export default class QuickLinks extends PureComponent {
|
|
||||||
constructor() {
|
|
||||||
super();
|
|
||||||
this.state = {
|
|
||||||
items: JSON.parse(localStorage.getItem('quicklinks')),
|
|
||||||
showAddModal: false,
|
|
||||||
urlError: '',
|
|
||||||
iconError: '',
|
|
||||||
edit: false,
|
|
||||||
editData: '',
|
|
||||||
};
|
|
||||||
this.quicklinksContainer = createRef();
|
|
||||||
}
|
|
||||||
|
|
||||||
deleteLink(key, event) {
|
|
||||||
event.preventDefault();
|
|
||||||
|
|
||||||
// remove link from array
|
|
||||||
const data = JSON.parse(localStorage.getItem('quicklinks')).filter((i) => i.key !== key);
|
|
||||||
|
|
||||||
localStorage.setItem('quicklinks', JSON.stringify(data));
|
|
||||||
this.setState({
|
|
||||||
items: data,
|
|
||||||
});
|
|
||||||
|
|
||||||
variables.stats.postEvent('feature', 'Quicklink delete');
|
|
||||||
}
|
|
||||||
|
|
||||||
async addLink(name, url, icon) {
|
|
||||||
const data = JSON.parse(localStorage.getItem('quicklinks'));
|
|
||||||
|
|
||||||
if (!url.startsWith('http://') && !url.startsWith('https://')) {
|
|
||||||
url = 'http://' + url;
|
|
||||||
}
|
|
||||||
|
|
||||||
if (url.length <= 0 || isValidUrl(url) === false) {
|
|
||||||
return this.setState({
|
|
||||||
urlError: variables.getMessage('widgets.quicklinks.url_error'),
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
if (icon.length > 0 && isValidUrl(icon) === false) {
|
|
||||||
return this.setState({
|
|
||||||
iconError: variables.getMessage('widgets.quicklinks.url_error'),
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
data.push({
|
|
||||||
name: name || (await getTitleFromUrl(url)),
|
|
||||||
url,
|
|
||||||
icon: icon || '',
|
|
||||||
key: Math.random().toString(36).substring(7) + 1,
|
|
||||||
});
|
|
||||||
|
|
||||||
localStorage.setItem('quicklinks', JSON.stringify(data));
|
|
||||||
|
|
||||||
this.setState({
|
|
||||||
items: data,
|
|
||||||
showAddModal: false,
|
|
||||||
urlError: '',
|
|
||||||
iconError: '',
|
|
||||||
});
|
|
||||||
|
|
||||||
variables.stats.postEvent('feature', 'Quicklink add');
|
|
||||||
}
|
|
||||||
|
|
||||||
startEditLink(data) {
|
|
||||||
this.setState({
|
|
||||||
edit: true,
|
|
||||||
editData: data,
|
|
||||||
showAddModal: true,
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
async editLink(og, name, url, icon) {
|
|
||||||
const data = JSON.parse(localStorage.getItem('quicklinks'));
|
|
||||||
const dataobj = data.find((i) => i.key === og.key);
|
|
||||||
dataobj.name = name || (await getTitleFromUrl(url));
|
|
||||||
dataobj.url = url;
|
|
||||||
dataobj.icon = icon || '';
|
|
||||||
|
|
||||||
localStorage.setItem('quicklinks', JSON.stringify(data));
|
|
||||||
|
|
||||||
this.setState({
|
|
||||||
items: data,
|
|
||||||
showAddModal: false,
|
|
||||||
edit: false,
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
componentDidMount() {
|
|
||||||
EventBus.on('refresh', (data) => {
|
|
||||||
if (data === 'quicklinks') {
|
|
||||||
if (localStorage.getItem('quicklinksenabled') === 'false') {
|
|
||||||
return (this.quicklinksContainer.current.style.display = 'none');
|
|
||||||
}
|
|
||||||
|
|
||||||
this.quicklinksContainer.current.style.display = 'block';
|
|
||||||
|
|
||||||
this.setState({
|
|
||||||
items: JSON.parse(localStorage.getItem('quicklinks')),
|
|
||||||
});
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
componentWillUnmount() {
|
|
||||||
EventBus.off('refresh');
|
|
||||||
}
|
|
||||||
|
|
||||||
render() {
|
|
||||||
const QUICKLINKS_SECTION = 'modals.main.settings.sections.quicklinks';
|
|
||||||
|
|
||||||
const AdditionalSettings = () => {
|
|
||||||
return (
|
|
||||||
<Row>
|
|
||||||
<Content
|
|
||||||
title={variables.getMessage('modals.main.settings.additional_settings')}
|
|
||||||
subtitle={variables.getMessage(`${QUICKLINKS_SECTION}.additional`)}
|
|
||||||
/>
|
|
||||||
<Action>
|
|
||||||
<Checkbox
|
|
||||||
name="quicklinksnewtab"
|
|
||||||
text={variables.getMessage(`${QUICKLINKS_SECTION}.open_new`)}
|
|
||||||
category="quicklinks"
|
|
||||||
/>
|
|
||||||
<Checkbox
|
|
||||||
name="quicklinkstooltip"
|
|
||||||
text={variables.getMessage(`${QUICKLINKS_SECTION}.tooltip`)}
|
|
||||||
category="quicklinks"
|
|
||||||
/>
|
|
||||||
</Action>
|
|
||||||
</Row>
|
|
||||||
);
|
|
||||||
};
|
|
||||||
|
|
||||||
const StylingOptions = () => {
|
|
||||||
return (
|
|
||||||
<Row>
|
|
||||||
<Content
|
|
||||||
title={variables.getMessage(`${QUICKLINKS_SECTION}.styling`)}
|
|
||||||
subtitle={variables.getMessage(
|
|
||||||
'modals.main.settings.sections.quicklinks.styling_description',
|
|
||||||
)}
|
|
||||||
/>
|
|
||||||
<Action>
|
|
||||||
<Dropdown
|
|
||||||
label={variables.getMessage(`${QUICKLINKS_SECTION}.style`)}
|
|
||||||
name="quickLinksStyle"
|
|
||||||
category="quicklinks"
|
|
||||||
items={[
|
|
||||||
{
|
|
||||||
value: 'icon',
|
|
||||||
text: variables.getMessage(`${QUICKLINKS_SECTION}.options.icon`),
|
|
||||||
},
|
|
||||||
{
|
|
||||||
value: 'text',
|
|
||||||
text: variables.getMessage(`${QUICKLINKS_SECTION}.options.text_only`),
|
|
||||||
},
|
|
||||||
{
|
|
||||||
value: 'metro',
|
|
||||||
text: variables.getMessage(`${QUICKLINKS_SECTION}.options.metro`),
|
|
||||||
},
|
|
||||||
]}
|
|
||||||
/>
|
|
||||||
</Action>
|
|
||||||
</Row>
|
|
||||||
);
|
|
||||||
};
|
|
||||||
|
|
||||||
const AddLink = () => {
|
|
||||||
return (
|
|
||||||
<Row final={true}>
|
|
||||||
<Content title={variables.getMessage(`${QUICKLINKS_SECTION}.title`)} />
|
|
||||||
<Action>
|
|
||||||
<Button
|
|
||||||
type="settings"
|
|
||||||
onClick={() => this.setState({ showAddModal: true })}
|
|
||||||
icon={<MdAddLink />}
|
|
||||||
label={variables.getMessage(`${QUICKLINKS_SECTION}.add_link`)}
|
|
||||||
/>
|
|
||||||
</Action>
|
|
||||||
</Row>
|
|
||||||
);
|
|
||||||
};
|
|
||||||
|
|
||||||
return (
|
|
||||||
<>
|
|
||||||
<Header
|
|
||||||
title={variables.getMessage(`${QUICKLINKS_SECTION}.title`)}
|
|
||||||
setting="quicklinksenabled"
|
|
||||||
category="quicklinks"
|
|
||||||
element=".quicklinks-container"
|
|
||||||
zoomSetting="zoomQuicklinks"
|
|
||||||
visibilityToggle={true}
|
|
||||||
/>
|
|
||||||
<PreferencesWrapper
|
|
||||||
setting="quicklinksenabled"
|
|
||||||
visibilityToggle={true}
|
|
||||||
zoomSetting="zoomQuicklinks"
|
|
||||||
>
|
|
||||||
<AdditionalSettings />
|
|
||||||
<StylingOptions />
|
|
||||||
<AddLink />
|
|
||||||
|
|
||||||
{this.state.items.length === 0 && (
|
|
||||||
<div className="photosEmpty">
|
|
||||||
<div className="emptyNewMessage">
|
|
||||||
<MdLinkOff />
|
|
||||||
<span className="title">
|
|
||||||
{variables.getMessage(`${QUICKLINKS_SECTION}.no_quicklinks`)}
|
|
||||||
</span>
|
|
||||||
<span className="subtitle">
|
|
||||||
{variables.getMessage('modals.main.settings.sections.message.add_some')}
|
|
||||||
</span>
|
|
||||||
<Button
|
|
||||||
type="settings"
|
|
||||||
onClick={() => this.setState({ showAddModal: true })}
|
|
||||||
icon={<MdAddLink />}
|
|
||||||
label={variables.getMessage(`${QUICKLINKS_SECTION}.add_link`)}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
</PreferencesWrapper>
|
|
||||||
|
|
||||||
<div className="messagesContainer" ref={this.quicklinksContainer}>
|
|
||||||
{this.state.items.map((item, i) => (
|
|
||||||
<QuickLink
|
|
||||||
key={i}
|
|
||||||
item={item}
|
|
||||||
startEditLink={() => this.startEditLink(item)}
|
|
||||||
deleteLink={(key, e) => this.deleteLink(key, e)}
|
|
||||||
/>
|
|
||||||
))}
|
|
||||||
</div>
|
|
||||||
<Modal
|
|
||||||
closeTimeoutMS={100}
|
|
||||||
onRequestClose={() => this.setState({ showAddModal: false, urlError: '', iconError: '' })}
|
|
||||||
isOpen={this.state.showAddModal}
|
|
||||||
className="Modal resetmodal mainModal"
|
|
||||||
overlayClassName="Overlay resetoverlay"
|
|
||||||
ariaHideApp={false}
|
|
||||||
>
|
|
||||||
<AddModal
|
|
||||||
urlError={this.state.urlError}
|
|
||||||
addLink={(name, url, icon) => this.addLink(name, url, icon)}
|
|
||||||
editLink={(og, name, url, icon) => this.editLink(og, name, url, icon)}
|
|
||||||
edit={this.state.edit}
|
|
||||||
editData={this.state.editData}
|
|
||||||
closeModal={() =>
|
|
||||||
this.setState({ showAddModal: false, urlError: '', iconError: '', edit: false })
|
|
||||||
}
|
|
||||||
/>
|
|
||||||
</Modal>
|
|
||||||
</>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
}
|
|
|
@ -6,10 +6,9 @@ import Tabs from './backend/Tabs';
|
||||||
import Overview from '../settings/sections/Overview';
|
import Overview from '../settings/sections/Overview';
|
||||||
import { NavbarOptions } from 'features/navbar';
|
import { NavbarOptions } from 'features/navbar';
|
||||||
import { GreetingOptions } from 'features/greeting';
|
import { GreetingOptions } from 'features/greeting';
|
||||||
import { TimeOptions } from 'features/time';
|
import { TimeOptions, DateOptions } from 'features/time';
|
||||||
import { QuickLinksOptions } from 'features/quicklinks';
|
import { QuickLinksOptions } from 'features/quicklinks';
|
||||||
import { QuoteOptions } from 'features/quote';
|
import { QuoteOptions } from 'features/quote';
|
||||||
import Date from '../settings/sections/Date';
|
|
||||||
import { MessageOptions } from 'features/message';
|
import { MessageOptions } from 'features/message';
|
||||||
import { BackgroundOptions } from 'features/background';
|
import { BackgroundOptions } from 'features/background';
|
||||||
import { SearchOptions } from 'features/search';
|
import { SearchOptions } from 'features/search';
|
||||||
|
@ -41,7 +40,7 @@ const sections = [
|
||||||
component: QuickLinksOptions,
|
component: QuickLinksOptions,
|
||||||
},
|
},
|
||||||
{ label: 'modals.main.settings.sections.quote.title', name: 'quote', component: QuoteOptions },
|
{ label: 'modals.main.settings.sections.quote.title', name: 'quote', component: QuoteOptions },
|
||||||
{ label: 'modals.main.settings.sections.date.title', name: 'date', component: Date },
|
{ label: 'modals.main.settings.sections.date.title', name: 'date', component: DateOptions },
|
||||||
{
|
{
|
||||||
label: 'modals.main.settings.sections.message.title',
|
label: 'modals.main.settings.sections.message.title',
|
||||||
name: 'message',
|
name: 'message',
|
||||||
|
|
|
@ -6,7 +6,7 @@ import { Checkbox, Dropdown } from 'components/Form/Settings';
|
||||||
|
|
||||||
import { Row, Content, Action, PreferencesWrapper } from 'components/Layout/Settings';
|
import { Row, Content, Action, PreferencesWrapper } from 'components/Layout/Settings';
|
||||||
|
|
||||||
export default function Date() {
|
function DateOptions() {
|
||||||
const [dateType, setDateType] = useState(localStorage.getItem('dateType') || 'long');
|
const [dateType, setDateType] = useState(localStorage.getItem('dateType') || 'long');
|
||||||
const dateFormats = ['DMY', 'MDY', 'YMD'];
|
const dateFormats = ['DMY', 'MDY', 'YMD'];
|
||||||
|
|
||||||
|
@ -142,3 +142,5 @@ export default function Date() {
|
||||||
</>
|
</>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
export { DateOptions as default, DateOptions };
|
|
@ -1 +1,2 @@
|
||||||
export * from './TimeOptions';
|
export * from './TimeOptions';
|
||||||
|
export * from './DateOptions';
|
||||||
|
|
Loading…
Reference in New Issue