kitty/spotube
1
0
Fork 0
mirror of https://github.com/KRTirtho/spotube.git synced 2025-09-14 16:25:16 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

added retry button for ManualLyricDialog

Browse Source
This commit is contained in:
KRTirtho 2021-05-08 00:04:16 +06:00
parent 19457cdd57
commit b878c74dc4
2 changed files with 79 additions and 43 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

38
src/components/ManualLyricDialog.tsx
View File

@ -1,23 +1,38 @@
import { FlexLayout, QDialog, QLabel, QScrollArea, QWidget, TextFormat } from "@nodegui/nodegui";
import { FlexLayout, QDialog, QLabel, QPushButton, QScrollArea, QWidget, TextFormat } from "@nodegui/nodegui";
import React, { PropsWithChildren, useEffect, useState } from "react";
import showError from "../helpers/showError";
import fetchLyrics from "../helpers/fetchLyrics";
interface ManualLyricDialogProps extends PropsWithChildren<{}> {
open: boolean;
onClose?: (closed:boolean) => void;
onClose?: (closed: boolean) => void;
track: SpotifyApi.TrackObjectSimplified | SpotifyApi.TrackObjectFull;
}
function ManualLyricDialog({ open, track, onClose }: ManualLyricDialogProps) {
const dialog = new QDialog();
const areaContainer = new QWidget();
const retryButton = new QPushButton();
const scrollArea = new QScrollArea();
const titleLabel = new QLabel();
const lyricLabel = new QLabel();
const [lyricNotFound, setLyricNotFound] = useState<boolean>(false);
const [lyrics, setLyrics] = useState<string>("");
const artists = track.artists.map((artist) => artist.name).join(", ");
async function handleBtnClick() {
try {
const lyrics = await fetchLyrics(artists, track.name);
console.log('lyrics:', lyrics)
setLyrics(lyrics);
setLyricNotFound(lyrics === "Not Found");
} catch (error) {
showError(error, `[Finding lyrics for ${track.name} failed]: `);
setLyrics("No lyrics found, rare track :)");
setLyricNotFound(true);
}
}
useEffect(() => {
// title label
titleLabel.setText(`
@ -34,27 +49,40 @@ function ManualLyricDialog({ open, track, onClose }: ManualLyricDialogProps) {
areaContainer.setInlineStyle("flex: 1; flex-direction: 'column'; padding: 10px;");
areaContainer.layout?.addWidget(titleLabel);
areaContainer.layout?.addWidget(lyricLabel);
areaContainer.layout?.addWidget(retryButton);
// scroll area
scrollArea.setInlineStyle("flex: 1;");
scrollArea.setWidget(areaContainer);
// reload button
retryButton.setText("Retry");
retryButton.addEventListener("clicked", handleBtnClick);
// dialog
dialog.setWindowTitle("Lyrics");
dialog.setLayout(new FlexLayout());
dialog.layout?.addWidget(scrollArea);
open ? dialog.open() : dialog.close();
open && fetchLyrics(artists, track.name)
open &&
fetchLyrics(artists, track.name)
.then((lyrics: string) => {
setLyrics(lyrics);
setLyricNotFound(lyrics === "Not Found");
})
.catch((e: Error) => {
showError(e, `[Finding lyrics for ${track.name} failed]: `);
setLyrics("No lyrics found, rare track :)");
setLyricNotFound(true);
});
return () => {
dialog.hide()
}
retryButton.removeEventListener("clicked", handleBtnClick);
dialog.hide();
};
}, [open, track, lyrics]);
useEffect(() => {
retryButton.setEnabled(!lyricNotFound);
}, [lyricNotFound]);
return <></>;
}

32
src/helpers/fetchLyrics.ts
View File

@ -1,39 +1,47 @@
import axios from 'axios';
import htmlToText from 'html-to-text';
import axios from "axios";
import htmlToText from "html-to-text";
import showError from "./showError";
const delim1 = '</div></div></div></div><div class="hwc"><div class="BNeawe tAd8D AP7Wnd"><div><div class="BNeawe tAd8D AP7Wnd">';
const delim2 = '</div></div></div></div></div><div><span class="hwc"><div class="BNeawe uEec3 AP7Wnd">';
const url = "https://www.google.com/search?q=";
export default async function fetchLyrics(artists:string, title: string) {
export default async function fetchLyrics(artists: string, title: string) {
let lyrics;
try {
lyrics = (await axios.get<string>(`${url}${encodeURIComponent(title + " " + artists)}+lyrics`, {responseType: "text"})).data;
console.log("[lyric query]:", `${url}${encodeURIComponent(title + " " + artists)}+lyrics`);
lyrics = (await axios.get<string>(`${url}${encodeURIComponent(title + " " + artists)}+lyrics`, { responseType: "text" })).data;
[, lyrics] = lyrics.split(delim1);
[lyrics] = lyrics.split(delim2);
} catch (m) {
} catch (err) {
showError(err, "[Lyric Query Error]: ");
try {
console.log("[lyric query]:", `${url}${encodeURIComponent(title + " " + artists)}+song+lyrics`);
lyrics = (await axios.get<string>(`${url}${encodeURIComponent(title + " " + artists)}+song+lyrics`)).data;
[, lyrics] = lyrics.split(delim1);
[lyrics] = lyrics.split(delim2);
} catch (n) {
} catch (err_1) {
showError(err_1, "[Lyric Query Error]: ");
try {
console.log("[lyric query]:", `${url}${encodeURIComponent(title + " " + artists)}+song`);
lyrics = (await axios.get<string>(`${url}${encodeURIComponent(title + " " + artists)}+song`)).data;
[, lyrics] = lyrics.split(delim1);
[lyrics] = lyrics.split(delim2);
} catch (o) {
} catch (err_2) {
showError(err_2, "[Lyric Query Error]: ");
try {
console.log("[lyric query]:", `${url}${encodeURIComponent(title + " " + artists)}`);
lyrics = (await axios.get<string>(`${url}${encodeURIComponent(title + " " + artists)}`)).data;
[, lyrics] = lyrics.split(delim1);
[lyrics] = lyrics.split(delim2);
} catch (p) {
lyrics = 'Not Found';
} catch (err_3) {
showError(err_3, "[Lyric Query Error]: ");
lyrics = "Not Found";
}
}
}
}
const rets = lyrics.split('\n');
let final = '';
const rets = lyrics.split("\n");
let final = "";
for (const ret of rets) {
final = `${final}${htmlToText.htmlToText(ret)}\n`;
}