apricote/Listory
1
0
Fork 0
mirror of https://github.com/apricote/Listory.git synced 2026-01-13 21:21:02 +00:00
Code Issues Projects Releases Packages Wiki Activity

fix(frontend): show empty report only when not loading

Browse source
This commit is contained in:
Julian Tölle 2022-06-25 17:40:20 +02:00
parent fa2d1f426f
commit 79b375ca08
5 changed files with 10 additions and 10 deletions
Download patch file Download diff file Expand all files Collapse all files

4
frontend/src/components/ReportListens.tsx
View file

@ -38,7 +38,7 @@ export const ReportListens: React.FC = () => {
const { report, isLoading } = useListensReport(reportOptions); const { report, isLoading } = useListensReport(reportOptions);
const reportHasItems = !isLoading && report.length !== 0; const reportHasItems = report.length !== 0;
requireUser(); requireUser();
@ -76,7 +76,7 @@ export const ReportListens: React.FC = () => {
<div className="loader rounded-full border-8 h-64 w-64"></div> <div className="loader rounded-full border-8 h-64 w-64"></div>
</div> </div>
)} )}
{!reportHasItems && ( {!reportHasItems && !isLoading && (
<div> <div>
<p>Report is emtpy! :(</p> <p>Report is emtpy! :(</p>
</div> </div>

4
frontend/src/components/ReportTopAlbums.tsx
View file

@ -26,7 +26,7 @@ export const ReportTopAlbums: React.FC = () => {
const { topAlbums, isLoading } = useTopAlbums(options); const { topAlbums, isLoading } = useTopAlbums(options);
const reportHasItems = !isLoading && topAlbums.length !== 0; const reportHasItems = topAlbums.length !== 0;
const maxCount = getMaxCount(topAlbums); const maxCount = getMaxCount(topAlbums);
requireUser(); requireUser();
@ -47,7 +47,7 @@ export const ReportTopAlbums: React.FC = () => {
<div className="loader rounded-full border-8 h-64 w-64"></div> <div className="loader rounded-full border-8 h-64 w-64"></div>
</div> </div>
)} )}
{!reportHasItems && ( {!reportHasItems && !isLoading && (
<div> <div>
<p>Report is emtpy! :(</p> <p>Report is emtpy! :(</p>
</div> </div>

4
frontend/src/components/ReportTopArtists.tsx
View file

@ -25,7 +25,7 @@ export const ReportTopArtists: React.FC = () => {
const { topArtists, isLoading } = useTopArtists(options); const { topArtists, isLoading } = useTopArtists(options);
const reportHasItems = !isLoading && topArtists.length !== 0; const reportHasItems = topArtists.length !== 0;
const maxCount = getMaxCount(topArtists); const maxCount = getMaxCount(topArtists);
requireUser(); requireUser();
@ -46,7 +46,7 @@ export const ReportTopArtists: React.FC = () => {
<div className="loader rounded-full border-8 h-64 w-64"></div> <div className="loader rounded-full border-8 h-64 w-64"></div>
</div> </div>
)} )}
{!reportHasItems && ( {!reportHasItems && !isLoading && (
<div> <div>
<p>Report is emtpy! :(</p> <p>Report is emtpy! :(</p>
</div> </div>

4
frontend/src/components/ReportTopGenres.tsx
View file

@ -29,7 +29,7 @@ export const ReportTopGenres: React.FC = () => {
const { topGenres, isLoading } = useTopGenres(options); const { topGenres, isLoading } = useTopGenres(options);
const reportHasItems = !isLoading && topGenres.length !== 0; const reportHasItems = topGenres.length !== 0;
requireUser(); requireUser();
@ -51,7 +51,7 @@ export const ReportTopGenres: React.FC = () => {
<div className="loader rounded-full border-8 h-64 w-64"></div> <div className="loader rounded-full border-8 h-64 w-64"></div>
</div> </div>
)} )}
{!reportHasItems && ( {!reportHasItems && !isLoading && (
<div> <div>
<p>Report is emtpy! :(</p> <p>Report is emtpy! :(</p>
</div> </div>

4
frontend/src/components/ReportTopTracks.tsx
View file

@ -26,7 +26,7 @@ export const ReportTopTracks: React.FC = () => {
const { topTracks, isLoading } = useTopTracks(options); const { topTracks, isLoading } = useTopTracks(options);
const reportHasItems = !isLoading && topTracks.length !== 0; const reportHasItems = topTracks.length !== 0;
requireUser(); requireUser();
@ -48,7 +48,7 @@ export const ReportTopTracks: React.FC = () => {
<div className="loader rounded-full border-8 h-64 w-64"></div> <div className="loader rounded-full border-8 h-64 w-64"></div>
</div> </div>
)} )}
{!reportHasItems && ( {!reportHasItems && !isLoading && (
<div> <div>
<p>Report is emtpy! :(</p> <p>Report is emtpy! :(</p>
</div> </div>