Skip to content

Commit 29e335f

Browse files
StormixStormix
committed
feat(web): support for other browser + landing page small revamp
1 parent 47a4091 commit 29e335f

11 files changed

Lines changed: 6192 additions & 10325 deletions

File tree

.vscode/moroccan-stream.code-workspace renamed to .vscode/lgamila.code-workspace

File renamed without changes.

‎apps/web/astro.config.mjs‎

Lines changed: 28 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,19 +1,41 @@
11
// @ts-check
22
import react from '@astrojs/react';
3+
import vercel from '@astrojs/vercel';
34
import tailwindcss from '@tailwindcss/vite';
45
import { defineConfig } from 'astro/config';
5-
66
import favicons from 'astro-favicons';
7-
8-
import vercel from '@astrojs/vercel';
7+
import {
8+
CHROME_EXTENSION_URL,
9+
FIREFOX_EXTENSION_URL,
10+
} from './src/lib/constants';
911

1012
// https://astro.build/config
1113
export default defineConfig({
1214
integrations: [react(), favicons()],
13-
1415
vite: {
1516
plugins: [tailwindcss()],
1617
},
17-
1818
adapter: vercel(),
19-
});
19+
redirects: {
20+
'/brave': {
21+
status: 308,
22+
destination: CHROME_EXTENSION_URL,
23+
},
24+
'/opera': {
25+
status: 308,
26+
destination: CHROME_EXTENSION_URL,
27+
},
28+
'/edge': {
29+
status: 308,
30+
destination: CHROME_EXTENSION_URL,
31+
},
32+
'/chrome': {
33+
status: 308,
34+
destination: CHROME_EXTENSION_URL,
35+
},
36+
'/firefox': {
37+
status: 308,
38+
destination: FIREFOX_EXTENSION_URL,
39+
},
40+
},
41+
});

‎apps/web/package.json‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@
1212
},
1313
"dependencies": {
1414
"@astrojs/react": "^4.3.0",
15-
"@astrojs/vercel": "^8.2.2",
15+
"@astrojs/vercel": "^8.2.5",
1616
"@hookform/resolvers": "^4.1.3",
1717
"@radix-ui/react-label": "^2.1.7",
1818
"@radix-ui/react-separator": "^1.1.7",
@@ -21,7 +21,7 @@
2121
"@tanstack/react-query": "^5.83.0",
2222
"@types/react": "^19.1.8",
2323
"@types/react-dom": "^19.1.6",
24-
"astro": "^5.12.0",
24+
"astro": "^5.12.8",
2525
"astro-favicons": "^3.1.5",
2626
"class-variance-authority": "^0.7.1",
2727
"clsx": "^2.1.1",

‎apps/web/src/components/molecules/download-extension.tsx‎

Lines changed: 39 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -1,20 +1,46 @@
11
import { AiOutlineChrome } from 'react-icons/ai';
2+
import { FaBraveReverse } from 'react-icons/fa6';
3+
import { RiFirefoxLine } from 'react-icons/ri';
4+
import { SiOperagx } from 'react-icons/si';
5+
import { TbBrandEdge } from 'react-icons/tb';
26
import { Button } from '@/components/ui/button';
37

48
export const DownloadExtension = () => {
59
return (
6-
<Button
7-
className="w-fit mt-4"
8-
onClick={() => {
9-
window.open(
10-
'https://chromewebstore.google.com/detail/amhjldbacojfmlcbhjlpnnnjokcfakjp/',
11-
'_blank'
12-
);
13-
}}
14-
variant="outline"
15-
>
16-
<AiOutlineChrome className="size-4" />
17-
Download Extension
18-
</Button>
10+
<div className="flex flex-col items-center justify-center gap-4">
11+
<div className="space-x-4">
12+
<Button
13+
className="w-fit mt-4"
14+
onClick={() => {
15+
window.open('/chrome', '_blank');
16+
}}
17+
variant="outline"
18+
>
19+
<AiOutlineChrome className="size-4" />
20+
Download for Chrome
21+
</Button>
22+
<Button
23+
className="w-fit mt-4"
24+
onClick={() => {
25+
window.open('/firefox', '_blank');
26+
}}
27+
variant="outline"
28+
>
29+
<RiFirefoxLine className="size-4" />
30+
Download for Firefox
31+
</Button>
32+
</div>
33+
<div className="text-sm text-muted-foreground">
34+
Also works for these browsers:
35+
</div>
36+
<div className="flex flex-row items-center justify-center gap-2">
37+
<Button
38+
icon={<FaBraveReverse className="size-4" />}
39+
variant="outline"
40+
/>
41+
<Button icon={<SiOperagx className="size-4" />} variant="outline" />{' '}
42+
<Button icon={<TbBrandEdge className="size-4" />} variant="outline" />
43+
</div>
44+
</div>
1945
);
2046
};

‎apps/web/src/components/molecules/streamer-stats.tsx‎

Lines changed: 81 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,81 @@
1+
import { QueryClientProvider, useQuery } from '@tanstack/react-query';
2+
import { API_URL } from '@/lib/constants';
3+
import { queryClient } from '@/store';
4+
5+
interface Streamer {
6+
id: string;
7+
name: string;
8+
isLive: boolean;
9+
livePlatform: string | null;
10+
}
11+
12+
interface StreamerData {
13+
streamers: Streamer[];
14+
}
15+
16+
async function fetchStreamers(): Promise<StreamerData> {
17+
const response = await fetch(`${API_URL}/api/streamers`);
18+
if (!response.ok) {
19+
throw new Error('Failed to fetch streamers');
20+
}
21+
return response.json();
22+
}
23+
24+
function StreamerStatsClient() {
25+
const { data, isLoading, error } = useQuery({
26+
queryKey: ['streamers'],
27+
queryFn: fetchStreamers,
28+
});
29+
30+
const totalStreamers = data?.streamers.length || 0;
31+
const liveStreamers = data?.streamers.filter((s) => s.isLive).length || 0;
32+
const supportedPlatforms = 2; // Twitch and Kick
33+
34+
if (error) {
35+
// Fallback to static numbers if API fails
36+
return (
37+
<div className="grid grid-cols-1 md:grid-cols-3 gap-8 text-center">
38+
<div className="space-y-2">
39+
<div className="text-4xl font-bold text-accent">50+</div>
40+
<div className="text-muted-foreground">Streamers Supported</div>
41+
</div>
42+
<div className="space-y-2">
43+
<div className="text-4xl font-bold text-accent">2</div>
44+
<div className="text-muted-foreground">Platforms Supported</div>
45+
</div>
46+
<div className="space-y-2">
47+
<div className="text-4xl font-bold text-accent">∞</div>
48+
<div className="text-muted-foreground">Potential to Unlock</div>
49+
</div>
50+
</div>
51+
);
52+
}
53+
54+
return (
55+
<div className="grid grid-cols-1 md:grid-cols-3 gap-8 text-center">
56+
<div className="space-y-2">
57+
<div className="text-4xl font-bold text-accent">
58+
{isLoading ? "..." : totalStreamers}
59+
</div>
60+
<div className="text-muted-foreground">Streamers Supported</div>
61+
</div>
62+
<div className="space-y-2">
63+
<div className="text-4xl font-bold text-accent">
64+
{isLoading ? "..." : liveStreamers}
65+
</div>
66+
<div className="text-muted-foreground">Currently Live</div>
67+
</div>
68+
<div className="space-y-2">
69+
<div className="text-4xl font-bold text-accent">{supportedPlatforms}</div>
70+
<div className="text-muted-foreground">Platforms Supported</div>
71+
</div>
72+
</div>
73+
);
74+
}
75+
export function StreamerStats() {
76+
return (
77+
<QueryClientProvider client={queryClient}>
78+
<StreamerStatsClient />
79+
</QueryClientProvider>
80+
);
81+
}

‎apps/web/src/components/templates/fullscreen.astro‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -21,8 +21,8 @@ import { Toaster } from '../ui/sonner';
2121
<link rel="stylesheet" href="https://rsms.me/inter/inter.css" />
2222

2323
</head>
24-
<body class="flex h-screen w-screen flex-col items-center justify-center overflow-x-hidden">
25-
<main class="flex flex-col items-center justify-center flex-grow container">
24+
<body class="flex flex-col items-center justify-center overflow-x-hidden py-5">
25+
<main class="flex flex-col flex-grow container">
2626
<slot />
2727
</main>
2828
<Footer />

0 commit comments

Comments
 (0)