wip build
Seto Elkahfi committed
Aug 4, 2024 at 16:29 UTC
9111469b3c3bc91fe4ad0a38c1eacf6a03582034
20 files changed
+128
-78
frontend/splitfire-desktop/app/_ui/skeleton-card.tsx
+1
-1
@@ -1,7 +1,7 @@
1
"use client";
2
3
import clsx from "clsx";
4
-import { SongProvider } from "../../models/SongResponse";
4
+import { SongProvider } from "@/models/song-response";
5
import Image from "next/image";
6
import { useRouter } from "next/navigation";
7
frontend/splitfire-desktop/app/components/index.tsx
new
+55
@@ -0,0 +1,55 @@
1
+"use client";
2
+
3
+import { TAURI_CONTENT_CAROUSEL } from "@/lib/tauriHandler";
4
+import { ContentCarouselResponse } from "@/models/content";
5
+import { SongProvider } from "@/models/song-response";
6
+import { invoke } from "@tauri-apps/api";
7
+import { useState, useEffect } from "react";
8
+import {
9
+ SkeletonCard,
10
+ SongProviderCard,
11
+ SongProviderPath,
12
+} from "../_ui/skeleton-card";
13
+import { useLogger } from "@/lib/logger";
14
+
15
+export default function Index() {
16
+
17
+ const log = useLogger("Discover");
18
+ const [songProviders, setSongProviders] = useState<SongProvider[]>([]);
19
+
20
+ useEffect(() => {
21
+ log.debug("Discover page loaded");
22
+ async function fetchData() {
23
+ try {
24
+ const response = await invoke<ContentCarouselResponse>(
25
+ TAURI_CONTENT_CAROUSEL
26
+ );
27
+ log.debug("Data", response);
28
+ setSongProviders(response.audio_files);
29
+ } catch (error) {
30
+ log.error("Failed to fetch data", error);
31
+ }
32
+ }
33
+ fetchData();
34
+ // eslint-disable-next-line react-hooks/exhaustive-deps
35
+ }, []);
36
+
37
+ return (
38
+ <div className="prose prose-sm prose-invert max-w-none">
39
+ <div className="grid grid-cols-3 gap-6">
40
+ {songProviders.length === 0 &&
41
+ Array.from({ length: 6 }).map((_, i) => (
42
+ <SkeletonCard key={i} isLoading={true} />
43
+ ))}
44
+ {songProviders.length > 0 &&
45
+ songProviders.map((SongProvider, i) => (
46
+ <SongProviderCard
47
+ key={i}
48
+ songProvider={SongProvider}
49
+ path={SongProviderPath.SPLIT}
50
+ />
51
+ ))}
52
+ </div>
53
+ </div>
54
+ );
55
+}
frontend/splitfire-desktop/app/debug/layout.tsx
+2
@@ -1,3 +1,5 @@
1
+"use client";
2
+
3
import React from 'react';
4
5
export default async function Layout({
frontend/splitfire-desktop/app/login/layout.tsx
+2
@@ -1,3 +1,5 @@
1
+"use client";
2
+
3
import React from 'react';
4
5
export default async function Layout({
frontend/splitfire-desktop/app/logout/layout.tsx
+2
@@ -1,3 +1,5 @@
1
+"use client";
2
+
3
import React from "react";
4
5
export default async function Layout({
frontend/splitfire-desktop/app/page.tsx
+2
-35
@@ -1,30 +1,8 @@
1
"use client";
2
3
-import { useEffect, useState } from "react";
4
-import { SkeletonCard, SongProviderCard, SongProviderPath } from "./_ui/skeleton-card";
5
-import { invoke } from "@tauri-apps/api";
6
-import { TAURI_CONTENT_CAROUSEL } from "../lib/tauriHandler";
7
-import { ContentCarouselResponse } from "@/models/content";
8
-import { SongProvider } from "../models/SongResponse";
3
+import Index from "./components";
4
5
export default function Page() {
11
-
12
- const [songProviders, setSongProviders] = useState<SongProvider[]>([]);
13
-
14
- useEffect(() => {
15
- console.log("Discover page loaded");
16
- async function fetchData() {
17
- try {
18
- const response = await invoke<ContentCarouselResponse>(TAURI_CONTENT_CAROUSEL);
19
- console.log("Data", response);
20
- setSongProviders(response.audio_files);
21
- } catch (error) {
22
- console.error("Failed to fetch data", error);
23
- }
24
- }
25
- fetchData();
26
- }, []);
27
-
6
return (
7
<div className="space-y-9">
8
<div className="flex justify-between">
@@ -32,18 +10,7 @@ export default function Page() {
10
<h1 className="text-3xl font-bold">Discover</h1>
11
</div>
12
</div>
35
- <div>
36
- <div className="prose prose-sm prose-invert max-w-none">
37
- <div className="grid grid-cols-3 gap-6">
38
- { songProviders.length === 0 && Array.from({ length: 6 }).map((_, i) => (
39
- <SkeletonCard key={i} isLoading={true} />
40
- ))}
41
- { songProviders.length > 0 && songProviders.map((SongProvider, i) => (
42
- <SongProviderCard key={i} songProvider={SongProvider} path={SongProviderPath.SPLIT} />
43
- ))}
44
- </div>
45
- </div>
46
- </div>
13
+ <Index />
14
</div>
15
);
16
}
frontend/splitfire-desktop/app/play/layout.tsx
+2
@@ -1,3 +1,5 @@
1
+"use client";
2
+
3
import React from 'react';
4
5
export default async function Layout({
frontend/splitfire-desktop/app/profile/layout.tsx
+2
@@ -1,3 +1,5 @@
1
+"use client";
2
+
3
import React from 'react';
4
5
export default async function Layout({
frontend/splitfire-desktop/app/ready-to-play/layout.tsx
+2
@@ -1,3 +1,5 @@
1
+"use client";
2
+
3
import React from 'react';
4
5
export default async function Layout({
frontend/splitfire-desktop/app/ready-to-play/page.tsx
+1
-1
@@ -5,7 +5,7 @@ import { invoke } from "@tauri-apps/api";
5
import { useEffect, useState } from "react";
6
import { TAURI_CONTENT_READY_TO_PLAY } from "../../lib/tauriHandler";
7
import { SkeletonCard, SongProviderCard, SongProviderPath } from "../_ui/skeleton-card";
8
-import { SongProvider } from "../../models/SongResponse";
8
+import { SongProvider } from "../../models/song-response";
9
10
export default function Page() {
11
const [songProviders, setSongProviders] = useState<SongProvider[]>([]);
frontend/splitfire-desktop/app/register/layout.tsx
+2
@@ -1,3 +1,5 @@
1
+"use client";
2
+
3
import React from 'react';
4
5
export default async function Layout({
frontend/splitfire-desktop/app/split/_components/song-votes.tsx
+1
-1
@@ -1,6 +1,6 @@
1
"use client";
2
3
-import { SongProvider } from "@/models/SongResponse";
3
+import { SongProvider } from "@/models/song-response";
4
import { SongProviderVote } from "@/models/SongVotesDetailResponse";
5
import VotesView from "./votes-view";
6
import SongVotesImage from "./song-votes-image";
frontend/splitfire-desktop/app/split/layout.tsx
+2
@@ -1,3 +1,5 @@
1
+"use client";
2
+
3
import React from 'react';
4
5
export default async function Layout({
frontend/splitfire-desktop/app/split/page.tsx
+1
-1
@@ -5,7 +5,7 @@ import { useLogger } from "@/lib/logger";
5
import { useEffect, useState } from "react";
6
import { invoke } from "@tauri-apps/api";
7
import { TAURI_CONTENT_SONG_BRIDGE_DETAIL } from "@/lib/tauriHandler";
8
-import { SongProvider } from "@/models/SongResponse";
8
+import { SongProvider } from "@/models/song-response";
9
import { SongProviderVote } from "@/models/SongVotesDetailResponse";
10
import SongVotes from "./_components/song-votes";
11
import { SongBridgeResponse } from "@/models/content";
frontend/splitfire-desktop/app/top-voted/components/index.tsx
new
+45
@@ -0,0 +1,45 @@
1
+"use client";
2
+
3
+import { SkeletonCard, SongProviderCard, SongProviderPath } from "@/app/_ui/skeleton-card";
4
+import { useLogger } from "@/lib/logger";
5
+import { TAURI_CONTENT_TOP_VOTED } from "@/lib/tauriHandler";
6
+import { ContentCarouselResponse } from "@/models/content";
7
+import { SongProvider } from "@/models/song-response";
8
+import { invoke } from "@tauri-apps/api";
9
+import { useState, useEffect } from "react";
10
+
11
+export default function Index() {
12
+
13
+ const log = useLogger("Top votes");
14
+ const [songProviders, setSongProviders] = useState<SongProvider[]>([]);
15
+
16
+ useEffect(() => {
17
+ log.debug("Top votes page loaded");
18
+ async function fetchData() {
19
+ try {
20
+ const response = await invoke<ContentCarouselResponse>(TAURI_CONTENT_TOP_VOTED);
21
+ log.debug("Data", response);
22
+ setSongProviders(response.audio_files);
23
+ } catch (error) {
24
+ log.error("Failed to fetch data", error);
25
+ }
26
+ }
27
+ fetchData();
28
+ // eslint-disable-next-line react-hooks/exhaustive-deps
29
+ }, []);
30
+
31
+ return (
32
+ <div>
33
+ <div className="prose prose-sm prose-invert max-w-none">
34
+ <div className="grid grid-cols-3 gap-6">
35
+ { songProviders.length === 0 && Array.from({ length: 6 }).map((_, i) => (
36
+ <SkeletonCard key={i} isLoading={true} />
37
+ ))}
38
+ { songProviders.length > 0 && songProviders.map((SongProvider, i) => (
39
+ <SongProviderCard key={i} songProvider={SongProvider} path={SongProviderPath.SPLIT} />
40
+ ))}
41
+ </div>
42
+ </div>
43
+ </div>
44
+ );
45
+}
\ No newline at end of file
frontend/splitfire-desktop/app/top-voted/layout.tsx
+2
@@ -1,3 +1,5 @@
1
+"use client";
2
+
3
import React from 'react';
4
5
export default async function Layout({
frontend/splitfire-desktop/app/top-voted/page.tsx
+2
-37
@@ -1,32 +1,8 @@
1
"use client";
2
3
-import { ContentCarouselResponse } from "@/models/content";
4
-import { invoke } from "@tauri-apps/api";
5
-import { useState, useEffect } from "react";
6
-import { TAURI_CONTENT_TOP_VOTED } from "../../lib/tauriHandler";
7
-import { SongProvider } from "../../models/SongResponse";
8
-import { SkeletonCard, SongProviderCard, SongProviderPath } from "../_ui/skeleton-card";
9
-import { useLogger } from "../../lib/logger";
3
+import Index from "./components";
4
5
export default function Page() {
12
- const log = useLogger("TOp votes");
13
- const [songProviders, setSongProviders] = useState<SongProvider[]>([]);
14
-
15
- useEffect(() => {
16
- log.debug("Top votes page loaded");
17
- async function fetchData() {
18
- try {
19
- const response = await invoke<ContentCarouselResponse>(TAURI_CONTENT_TOP_VOTED);
20
- console.log("Data", response);
21
- setSongProviders(response.audio_files);
22
- } catch (error) {
23
- console.error("Failed to fetch data", error);
24
- }
25
- }
26
- fetchData();
27
- // eslint-disable-next-line react-hooks/exhaustive-deps
28
- }, []);
29
-
6
return (
7
<div className="space-y-9">
8
<div className="flex justify-between">
@@ -34,18 +10,7 @@ export default function Page() {
10
<h1 className="text-3xl font-bold">Top Voted</h1>
11
</div>
12
</div>
37
- <div>
38
- <div className="prose prose-sm prose-invert max-w-none">
39
- <div className="grid grid-cols-3 gap-6">
40
- { songProviders.length === 0 && Array.from({ length: 6 }).map((_, i) => (
41
- <SkeletonCard key={i} isLoading={true} />
42
- ))}
43
- { songProviders.length > 0 && songProviders.map((SongProvider, i) => (
44
- <SongProviderCard key={i} songProvider={SongProvider} path={SongProviderPath.SPLIT} />
45
- ))}
46
- </div>
47
- </div>
48
- </div>
13
+ <Index />
14
</div>
15
);
16
}
\ No newline at end of file
frontend/splitfire-desktop/models/SongVotesDetailResponse.tsx
+1
-1
@@ -1,4 +1,4 @@
1
-import { SongProvider } from "./SongResponse"
1
+import { SongProvider } from "./song-response"
2
3
4
export enum VoteType {
frontend/splitfire-desktop/models/content.ts
+1
-1
@@ -1,4 +1,4 @@
1
-import { SongProvider } from "@/models/SongResponse";
1
+import { SongProvider } from "@/models/song-response";
2
import { TauriResponse } from "./shared";
3
import { SongProviderVote } from "@/models/SongVotesDetailResponse";
4