mirror of https://github.com/mue/mue.git
64 lines
1.8 KiB
JavaScript
64 lines
1.8 KiB
JavaScript
import variables from 'config/variables';
|
|
|
|
import { MdEdit, MdCancel } from 'react-icons/md';
|
|
import { Button } from 'components/Elements';
|
|
|
|
const QuickLink = ({ item, deleteLink, startEditLink }) => {
|
|
let target,
|
|
rel = null;
|
|
if (localStorage.getItem('quicklinksnewtab') === 'true') {
|
|
target = '_blank';
|
|
rel = 'noopener noreferrer';
|
|
}
|
|
|
|
const useText = localStorage.getItem('quicklinksText') === 'true';
|
|
|
|
if (useText) {
|
|
return (
|
|
<a
|
|
className="quicklinkstext"
|
|
onContextMenu={(e) => deleteLink(item.key, e)}
|
|
href={item.url}
|
|
target={target}
|
|
rel={rel}
|
|
draggable={false}
|
|
>
|
|
{item.name}
|
|
</a>
|
|
);
|
|
}
|
|
|
|
const img =
|
|
item.icon ||
|
|
'https://icon.horse/icon/ ' + item.url.replace('https://', '').replace('http://', '');
|
|
|
|
return (
|
|
<div className="messageMap">
|
|
<div className="icon">
|
|
<img
|
|
src={img}
|
|
alt={item.name}
|
|
draggable={false}
|
|
style={{ height: '30px', width: '30px' }}
|
|
/>
|
|
</div>
|
|
<div className="messageText">
|
|
<div className="title">{item.name}</div>
|
|
<div className="subtitle">
|
|
<a className="quicklinknostyle" target="_blank" rel="noopener noreferrer" href={item.url}>
|
|
{item.url}
|
|
</a>
|
|
</div>
|
|
</div>
|
|
<div>
|
|
<div className="messageAction">
|
|
<Button type="settings" onClick={() => startEditLink(item)} icon={<MdEdit />} label={variables.getMessage('modals.main.settings.sections.quicklinks.edit')} />
|
|
<Button type="settings" onClick={(e) => deleteLink(item.key, e)} icon={ <MdCancel />} label={variables.getMessage('modals.main.marketplace.product.buttons.remove')} />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export { QuickLink as default, QuickLink };
|