Skip to content

Commit 0eeea08

Browse files
ben221199ben221199
committed
Improve loading tags
1 parent da499c1 commit 0eeea08

2 files changed

Lines changed: 129 additions & 104 deletions

File tree

‎src/LBRY.tsx‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@ const VERSION_2_0: string = "2.0";
22

33
const CLAIM_SEARCH: string = "claim_search";
44
const GET: string = "get";
5+
const PREFERENCE_GET: string = "preference_get";
56
const RESOLVE: string = "resolve";
67
const SETTINGS_GET: string = "settings_get";
78
const TXO_LIST: string = "txo_list";
@@ -78,6 +79,7 @@ async function rpc(
7879
export default {
7980
CLAIM_SEARCH,
8081
GET,
82+
PREFERENCE_GET,
8183
RESOLVE,
8284
SETTINGS_GET,
8385
TXO_LIST,

‎src/Tags.tsx‎

Lines changed: 127 additions & 104 deletions
Original file line numberDiff line numberDiff line change
@@ -5,121 +5,144 @@ import LBRY from "~/LBRY";
55
import ClaimPreviewTile from "~/components/ClaimPreviewTile";
66
import CustomSVG from "~/components/CustomSVG";
77
import Loader from "~/components/Loader";
8+
import Error from "~/components/Error";
89

910
function Tags(): JSX.Element {
1011
const daemonRPC: string = useDaemonRPC();
1112

12-
const [items, setItems] = useState<object[] | string | null>(null);
13-
const [tags, setTags] = useState<string[]>([]);
14-
const [toggle, setToggle] = useState<string>("new");
13+
const [localPreferenceResponse, setLocalPreferenceResponse] = useState<object>(undefined);
14+
const [tags, setTags] = useState<string[]>([]);
15+
const [items, setItems] = useState<object[] | string | null>(null);
16+
const [toggle, setToggle] = useState<string>("new");
1517

16-
useEffect((): void => {
17-
const orderBy: string =
18-
(toggle === "new" ? "release_time" : "") +
19-
(toggle === "trending" ? "trending_score" : "") +
20-
(toggle === "top" ? "effective_amount" : "");
18+
useEffect((): void => {
19+
LBRY.rpc(
20+
daemonRPC,
21+
LBRY.PREFERENCE_GET,
22+
{ key: 'local' },
23+
null,
24+
LBRY.isUsingProxy(),
25+
).then((json: object): void => {
26+
setLocalPreferenceResponse(json);
27+
if(json?.result?.local?.tags){
28+
setTags(json?.result?.local?.tags);
29+
}
30+
});
31+
}, []);
2132

22-
const hourAgo: number = (Date.now() - 3600000) / 1000;
33+
useEffect((): void => {
34+
const orderBy: string =
35+
(toggle === "new" ? "release_time" : "") +
36+
(toggle === "trending" ? "trending_score" : "") +
37+
(toggle === "top" ? "effective_amount" : "");
2338

24-
const releaseTime: string =
25-
(toggle === "new" ? "<" + hourAgo : "") +
26-
(toggle === "trending" ? "<" + hourAgo : "") +
27-
(toggle === "top" ? ">" + hourAgo : "");
39+
const hourAgo: number = (Date.now() - 3600000) / 1000;
2840

29-
// "<1765920600"
41+
const releaseTime: string =
42+
(toggle === "new" ? "<" + hourAgo : "") +
43+
(toggle === "trending" ? "<" + hourAgo : "") +
44+
(toggle === "top" ? ">" + hourAgo : "");
3045

31-
const searchOptions: object = {
32-
page_size: 20,
33-
page: 1,
34-
claim_type: ["stream", "repost", "channel"],
35-
no_totals: true,
36-
not_channel_ids: [],
37-
not_tags: NOT_TAGS,
38-
order_by: [orderBy],
39-
has_source: true,
40-
any_tags: tags,
41-
release_time: releaseTime,
42-
include_purchase_receipt: true,
43-
};
46+
// "<1765920600"
4447

45-
LBRY.rpc(
46-
daemonRPC,
47-
LBRY.CLAIM_SEARCH,
48-
searchOptions,
49-
null,
50-
LBRY.isUsingProxy(),
51-
).then((json: object): void => {
52-
setItems(json.result.items || json.error?.message || "Unknown error");
53-
});
54-
}, [daemonRPC, tags, toggle]);
48+
const searchOptions: object = {
49+
page_size: 20,
50+
page: 1,
51+
claim_type: ["stream", "repost", "channel"],
52+
no_totals: true,
53+
not_channel_ids: [],
54+
not_tags: NOT_TAGS,
55+
order_by: [orderBy],
56+
has_source: true,
57+
any_tags: tags,
58+
release_time: releaseTime,
59+
include_purchase_receipt: true,
60+
};
5561

56-
return (
57-
<>
58-
<div>
59-
<CustomSVG
60-
style={{
61-
fill: "transparent",
62-
height: "24",
63-
width: "24",
64-
verticalAlign: "middle",
65-
stroke: "white",
66-
strokeWidth: "2px",
67-
padding: open ? "0px 8px 0px 12px" : null,
68-
}}
69-
icon="tag"
70-
viewBox="0 0 24 24"
71-
/>
72-
<h1 style={{ display: "inline-block", verticalAlign: "middle" }}>
73-
Your Tags
74-
</h1>
75-
<div style={{ padding: "16px 0" }}>
76-
<button
77-
onClick={(): void => {
78-
if (toggle !== "new") {
79-
setItems(null);
80-
}
81-
setToggle("new");
82-
}}
83-
>
84-
New
85-
</button>
86-
<button
87-
onClick={(): void => {
88-
if (toggle !== "trending") {
89-
setItems(null);
90-
}
91-
setToggle("trending");
92-
}}
93-
>
94-
Trending
95-
</button>
96-
<button
97-
onClick={(): void => {
98-
if (toggle !== "top") {
99-
setItems(null);
100-
}
101-
setToggle("top");
102-
}}
103-
>
104-
Top
105-
</button>
106-
</div>
107-
<div style={{ padding: "16px 0", textAlign: "center" }}>
108-
{items === null ? (
109-
<Loader />
110-
) : "string" === typeof items ? (
111-
<span style={{ color: "red" }}>{items}</span>
112-
) : items.length > 0 ? (
113-
items.map((cell: unknown, i: number) => (
114-
<ClaimPreviewTile claim={cell} key={i} />
115-
))
116-
) : (
117-
"No items"
118-
)}
119-
</div>
120-
</div>
121-
</>
122-
);
62+
LBRY.rpc(
63+
daemonRPC,
64+
LBRY.CLAIM_SEARCH,
65+
searchOptions,
66+
null,
67+
LBRY.isUsingProxy(),
68+
).then((json: object): void => {
69+
setItems(json.result.items || json.error?.message || "Unknown error");
70+
});
71+
}, [daemonRPC, tags, toggle]);
72+
73+
if(localPreferenceResponse){
74+
if(localPreferenceResponse.error){
75+
return <Error message={localPreferenceResponse.error.message}/>;
76+
}
77+
return (
78+
<>
79+
<div>
80+
<CustomSVG
81+
style={{
82+
fill: "transparent",
83+
height: "24",
84+
width: "24",
85+
verticalAlign: "middle",
86+
stroke: "white",
87+
strokeWidth: "2px",
88+
padding: open ? "0px 8px 0px 12px" : null,
89+
}}
90+
icon="tag"
91+
viewBox="0 0 24 24"
92+
/>
93+
<h1 style={{ display: "inline-block", verticalAlign: "middle" }}>
94+
Your Tags
95+
</h1>
96+
<div style={{ padding: "16px 0" }}>
97+
<button
98+
onClick={(): void => {
99+
if (toggle !== "new") {
100+
setItems(null);
101+
}
102+
setToggle("new");
103+
}}
104+
>
105+
New
106+
</button>
107+
<button
108+
onClick={(): void => {
109+
if (toggle !== "trending") {
110+
setItems(null);
111+
}
112+
setToggle("trending");
113+
}}
114+
>
115+
Trending
116+
</button>
117+
<button
118+
onClick={(): void => {
119+
if (toggle !== "top") {
120+
setItems(null);
121+
}
122+
setToggle("top");
123+
}}
124+
>
125+
Top
126+
</button>
127+
</div>
128+
<div style={{ padding: "16px 0", textAlign: "center" }}>
129+
{items === null ? (
130+
<Loader />
131+
) : "string" === typeof items ? (
132+
<span style={{ color: "red" }}>{items}</span>
133+
) : items.length > 0 ? (
134+
items.map((cell: unknown, i: number) => (
135+
<ClaimPreviewTile claim={cell} key={i} />
136+
))
137+
) : (
138+
"No items"
139+
)}
140+
</div>
141+
</div>
142+
</>
143+
);
144+
}
145+
return <Loader/>;
123146
}
124147

125148
export default Tags;

0 commit comments

Comments
 (0)