From b878c74dc4c30717f1dd690c916a28c5fd0401b6 Mon Sep 17 00:00:00 2001 From: KRTirtho Date: Sat, 8 May 2021 00:04:16 +0600 Subject: [PATCH] added retry button for ManualLyricDialog --- src/components/ManualLyricDialog.tsx | 52 ++++++++++++++++----- src/helpers/fetchLyrics.ts | 70 ++++++++++++++++------------ 2 files changed, 79 insertions(+), 43 deletions(-) diff --git a/src/components/ManualLyricDialog.tsx b/src/components/ManualLyricDialog.tsx index 41a359749..656b65ea9 100644 --- a/src/components/ManualLyricDialog.tsx +++ b/src/components/ManualLyricDialog.tsx @@ -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(false); const [lyrics, setLyrics] = useState(""); 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) - .then((lyrics: string) => { - setLyrics(lyrics); - }) - .catch((e: Error) => { - showError(e, `[Finding lyrics for ${track.name} failed]: `); - setLyrics("No lyrics found, rare track :)"); - }); + 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 <>; } diff --git a/src/helpers/fetchLyrics.ts b/src/helpers/fetchLyrics.ts index b90ea5846..7e1d2368b 100644 --- a/src/helpers/fetchLyrics.ts +++ b/src/helpers/fetchLyrics.ts @@ -1,41 +1,49 @@ - -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 = '
'; const delim2 = '
'; const url = "https://www.google.com/search?q="; -export default async function fetchLyrics(artists:string, title: string) { - let lyrics; +export default async function fetchLyrics(artists: string, title: string) { + let lyrics; + try { + console.log("[lyric query]:", `${url}${encodeURIComponent(title + " " + artists)}+lyrics`); + lyrics = (await axios.get(`${url}${encodeURIComponent(title + " " + artists)}+lyrics`, { responseType: "text" })).data; + [, lyrics] = lyrics.split(delim1); + [lyrics] = lyrics.split(delim2); + } catch (err) { + showError(err, "[Lyric Query Error]: "); try { - lyrics = (await axios.get(`${url}${encodeURIComponent(title + " " + artists)}+lyrics`, {responseType: "text"})).data; + console.log("[lyric query]:", `${url}${encodeURIComponent(title + " " + artists)}+song+lyrics`); + lyrics = (await axios.get(`${url}${encodeURIComponent(title + " " + artists)}+song+lyrics`)).data; + [, lyrics] = lyrics.split(delim1); + [lyrics] = lyrics.split(delim2); + } catch (err_1) { + showError(err_1, "[Lyric Query Error]: "); + try { + console.log("[lyric query]:", `${url}${encodeURIComponent(title + " " + artists)}+song`); + lyrics = (await axios.get(`${url}${encodeURIComponent(title + " " + artists)}+song`)).data; [, lyrics] = lyrics.split(delim1); [lyrics] = lyrics.split(delim2); - } catch (m) { + } catch (err_2) { + showError(err_2, "[Lyric Query Error]: "); try { - lyrics = (await axios.get(`${url}${encodeURIComponent(title + " " + artists)}+song+lyrics`)).data; - [, lyrics] = lyrics.split(delim1); - [lyrics] = lyrics.split(delim2); - } catch (n) { - try { - lyrics = (await axios.get(`${url}${encodeURIComponent(title + " " + artists)}+song`)).data; - [, lyrics] = lyrics.split(delim1); - [lyrics] = lyrics.split(delim2); - } catch (o) { - try { - lyrics = (await axios.get(`${url}${encodeURIComponent(title + " " + artists)}`)).data; - [, lyrics] = lyrics.split(delim1); - [lyrics] = lyrics.split(delim2); - } catch (p) { - lyrics = 'Not Found'; - } - } + console.log("[lyric query]:", `${url}${encodeURIComponent(title + " " + artists)}`); + lyrics = (await axios.get(`${url}${encodeURIComponent(title + " " + artists)}`)).data; + [, lyrics] = lyrics.split(delim1); + [lyrics] = lyrics.split(delim2); + } catch (err_3) { + showError(err_3, "[Lyric Query Error]: "); + lyrics = "Not Found"; } + } } - const rets = lyrics.split('\n'); - let final = ''; - for (const ret of rets) { - final = `${final}${htmlToText.htmlToText(ret)}\n`; - } - return final.trim(); -} \ No newline at end of file + } + const rets = lyrics.split("\n"); + let final = ""; + for (const ret of rets) { + final = `${final}${htmlToText.htmlToText(ret)}\n`; + } + return final.trim(); +}