1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
|
// Grab any variables you need
const react = Spicetify.React;
const reactDOM = Spicetify.ReactDOM;
const {
URI,
React: { useState, useEffect, useCallback },
Platform: { History },
} = Spicetify;
// The main custom app render function. The component returned is what is rendered in Spotify.
function render() {
betterlibrary();
return react.createElement(Grid, { title: "loading..." });
}
// Our main component
class Grid extends react.Component {
constructor(props) {
super(props);
Object.assign(this, props);
this.state = {
foo: "bar",
data: "etc"
};
// console.log("test");
}
render() {
return react.createElement("section", {
className: "contentSpacing",
},
react.createElement("div", {
className: "betterlibheader",
}, react.createElement("h1", null, this.props.title),
),
);
// ), react.createElement("div", {
// id: "marketplace-grid",
// className: "main-gridContainer-gridContainer",
// "data-tab": CONFIG.activeTab,
// style: {
// "--minimumColumnWidth": "180px",
// },
// }, [...cardList]),
// react.createElement("footer", {
// style: {
// margin: "auto",
// textAlign: "center",
// },
// }, !this.state.endOfList && (this.state.rest ? react.createElement(LoadMoreIcon, { onClick: this.loadMore.bind(this) }) : react.createElement(LoadingIcon)),
// ), react.createElement(TopBarContent, {
// switchCallback: this.switchTo.bind(this),
// links: CONFIG.tabs,
// activeLink: CONFIG.activeTab,
// });
}
}
|