mirror of https://github.com/mue/mue.git
175 lines
4.6 KiB
JavaScript
175 lines
4.6 KiB
JavaScript
import variables from 'modules/variables';
|
|
import { PureComponent } from 'react';
|
|
import { MdLocalMall } from 'react-icons/md';
|
|
import { toast } from 'react-toastify';
|
|
|
|
import Item from '../Item';
|
|
import Items from '../Items';
|
|
import Dropdown from '../../settings/Dropdown';
|
|
|
|
import { uninstall, urlParser } from 'modules/helpers/marketplace';
|
|
|
|
export default class Added extends PureComponent {
|
|
getMessage = (text) => variables.language.getMessage(variables.languagecode, text);
|
|
|
|
constructor() {
|
|
super();
|
|
this.state = {
|
|
installed: JSON.parse(localStorage.getItem('installed')),
|
|
item: {},
|
|
button: '',
|
|
};
|
|
this.buttons = {
|
|
uninstall: (
|
|
<button className="removeFromMue" onClick={() => this.uninstall()}>
|
|
{this.getMessage('modals.main.marketplace.product.buttons.remove')}
|
|
</button>
|
|
),
|
|
};
|
|
}
|
|
|
|
toggle(type, data) {
|
|
if (type === 'item') {
|
|
const installed = JSON.parse(localStorage.getItem('installed'));
|
|
const info = {
|
|
data: installed.find((i) => i.name === data.name),
|
|
};
|
|
|
|
this.setState({
|
|
item: {
|
|
type: info.data.type,
|
|
display_name: info.data.name,
|
|
author: info.data.author,
|
|
description: urlParser(info.data.description.replace(/\n/g, '<br>')),
|
|
//updated: info.updated,
|
|
version: info.data.version,
|
|
icon: info.data.screenshot_url,
|
|
data: info.data,
|
|
},
|
|
button: this.buttons.uninstall,
|
|
});
|
|
variables.stats.postEvent('marketplace', 'Item viewed');
|
|
} else {
|
|
this.setState({
|
|
item: {},
|
|
});
|
|
}
|
|
}
|
|
|
|
uninstall() {
|
|
uninstall(this.state.item.type, this.state.item.display_name);
|
|
|
|
toast(this.getMessage('toasts.uninstalled'));
|
|
|
|
this.setState({
|
|
button: '',
|
|
installed: JSON.parse(localStorage.getItem('installed')),
|
|
});
|
|
|
|
variables.stats.postEvent('marketplace', 'Uninstall');
|
|
}
|
|
|
|
sortAddons(value, sendEvent) {
|
|
let installed = JSON.parse(localStorage.getItem('installed'));
|
|
switch (value) {
|
|
case 'newest':
|
|
installed.reverse();
|
|
break;
|
|
case 'oldest':
|
|
break;
|
|
case 'a-z':
|
|
installed.sort();
|
|
break;
|
|
case 'z-a':
|
|
installed.sort();
|
|
installed.reverse();
|
|
break;
|
|
default:
|
|
break;
|
|
}
|
|
|
|
this.setState({
|
|
installed,
|
|
});
|
|
|
|
if (sendEvent) {
|
|
variables.stats.postEvent('marketplace', 'Sort');
|
|
}
|
|
}
|
|
|
|
updateCheck() {
|
|
let updates = 0;
|
|
this.state.installed.forEach(async (item) => {
|
|
const data = await (
|
|
await fetch(variables.constants.MARKETPLACE_URL + '/item/' + item.name)
|
|
).json();
|
|
if (data.version !== item.version) {
|
|
updates++;
|
|
}
|
|
});
|
|
|
|
if (updates > 0) {
|
|
toast(
|
|
this.getMessage('modals.main.addons.updates_available', {
|
|
amount: updates,
|
|
}),
|
|
);
|
|
} else {
|
|
toast(this.getMessage('modals.main.addons.no_updates'));
|
|
}
|
|
}
|
|
|
|
componentDidMount() {
|
|
this.sortAddons(localStorage.getItem('sortAddons'), false);
|
|
}
|
|
|
|
render() {
|
|
if (this.state.installed.length === 0) {
|
|
return (
|
|
<div className="emptyItems">
|
|
<div className="emptyMessage">
|
|
<MdLocalMall />
|
|
<span className="title">{this.getMessage('modals.main.addons.empty.title')}</span>
|
|
<span className="subtitle">
|
|
{this.getMessage('modals.main.addons.empty.description')}
|
|
</span>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
if (this.state.item.display_name) {
|
|
return (
|
|
<Item
|
|
data={this.state.item}
|
|
button={this.state.button}
|
|
toggleFunction={() => this.toggle()}
|
|
/>
|
|
);
|
|
}
|
|
|
|
return (
|
|
<>
|
|
<Dropdown
|
|
label={this.getMessage('modals.main.addons.sort.title')}
|
|
name="sortAddons"
|
|
onChange={(value) => this.sortAddons(value)}
|
|
>
|
|
<option value="newest">{this.getMessage('modals.main.addons.sort.newest')}</option>
|
|
<option value="oldest">{this.getMessage('modals.main.addons.sort.oldest')}</option>
|
|
<option value="a-z">{this.getMessage('modals.main.addons.sort.a_z')}</option>
|
|
<option value="z-a">{this.getMessage('modals.main.addons.sort.z_a')}</option>
|
|
</Dropdown>
|
|
<button className="addToMue sideload updateCheck" onClick={() => this.updateCheck()}>
|
|
{this.getMessage('modals.main.addons.check_updates')}
|
|
</button>
|
|
<br />
|
|
<Items
|
|
items={this.state.installed}
|
|
toggleFunction={(input) => this.toggle('item', input)}
|
|
/>
|
|
</>
|
|
);
|
|
}
|
|
}
|