kris/roblox
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

useBestFriends();

Browse Source
This commit is contained in:
Kris
2025-07-24 19:50:54 +03:00
parent 980b27bf84
commit c7d3cd85be
24 changed files with 925 additions and 249 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
app/layout.tsx
View File

@@ -2,6 +2,7 @@ import type { Metadata } from "next";
import { Geist, Geist_Mono } from "next/font/google";
import "./globals.css";
import { TooltipProvider } from "@/components/ui/tooltip";
import { Toaster } from "@/components/ui/toaster";
const geistSans = Geist({
variable: "--font-geist-sans",
@@ -29,7 +30,8 @@ export default function RootLayout({
className={`${geistSans.variable} ${geistMono.variable} antialiased overflow-x-hidden`}
>
<TooltipProvider>
{children}
<main>{children}</main>
<Toaster />
</TooltipProvider>
</body>
</html>

123
app/page.tsx
View File

@@ -1,10 +1,13 @@
"use client";
import { FriendsHomeSect } from "@/components/FriendsOnlineSection";
import { GameCard } from "@/components/gameCard";
import { HomeLoggedInHeader } from "@/components/loggedInHeader";
import { QuickTopUI, QuickTopUILogoPart } from "@/components/QuickTopUI";
import { VerifiedIcon } from "@/components/RobloxIcons";
import {
BestFriendsHomeSect,
FriendsHomeSect
} from "@/components/roblox/FriendsOnline";
import { GameCard } from "@/components/roblox/GameCard";
import { HomeLoggedInHeader } from "@/components/site/HomeUserHeader";
import { OutfitSelector } from "@/components/site/OutfitQuickChooser";
import { QuickTopUI, QuickTopUILogoPart } from "@/components/site/QuickTopUI";
import { Alert, AlertDescription, AlertTitle } from "@/components/ui/alert";
import { Card, CardContent } from "@/components/ui/card";
import {
@@ -13,6 +16,7 @@ import {
} from "@/lib/omniRecommendation";
import { loadThumbnails } from "@/lib/thumbnailLoader";
import { AlertTriangleIcon } from "lucide-react";
import Image from "next/image";
import { useEffect, useState } from "react";
export default function Home() {
@@ -36,58 +40,67 @@ export default function Home() {
}, []);
return (
<div className="overflow-scroll no-scrollbar w-screen max-h-screen h-screen antialiased overflow-x-hidden">
<QuickTopUI />
<QuickTopUILogoPart />
<HomeLoggedInHeader />
<FriendsHomeSect className="pt-8" />
<div className="justify-center w-screen px-8 pt-6">
<Alert variant="default" className="space-x-2">
<AlertTriangleIcon />
<AlertTitle>Warning</AlertTitle>
<AlertDescription>
This is work in progess, you can follow the development
process on GitHub.
</AlertDescription>
</Alert>
</div>
<div className="p-4 space-y-8 no-scrollbar">
{!rec ? (
<Card>
<CardContent className="p-4">
<div className="h-[200px] flex items-center justify-center">
<div className="animate-pulse text-muted-foreground">
{"Loading..."}
<>
<Image src={window.localStorage.BgImageUrl || "/bg.png"} width={1920} height={1080} className="w-screen h-screen bg-blend-hard-light fixed top-0 left-0 blur-lg opacity-25" alt=""/>
<div className="z-10 isolate overflow-scroll no-scrollbar w-screen max-h-screen h-screen antialiased overflow-x-hidden">
<QuickTopUI />
<QuickTopUILogoPart />
<HomeLoggedInHeader />
<div className="h-4" />
<BestFriendsHomeSect className="pt-2" />
<FriendsHomeSect className="pt-2" />
<div className="justify-center w-screen px-8 pt-6">
<Alert variant="default" className="bg-base/50 space-x-2">
<AlertTriangleIcon />
<AlertTitle>Warning</AlertTitle>
<AlertDescription>
This is work in progess, you can follow the
development process on GitHub.
</AlertDescription>
</Alert>
</div>
<div className="p-4 space-y-8 no-scrollbar">
{!rec ? (
<Card>
<CardContent className="p-4">
<div className="h-[200px] flex items-center justify-center">
<div className="animate-pulse text-muted-foreground">
{"Loading..."}
</div>
</div>
</div>
</CardContent>
</Card>
) : (
rec.sorts
.filter((a) => SORTS_ALLOWED_IDS.includes(a.topicId))
.map((sort, idx) => (
<div key={idx}>
<h1 className="text-2xl pb-2">{sort.topic}</h1>
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-4">
{(sort.recommendationList || []).map(
(recommendation, idxb) => {
const game =
rec.contentMetadata.Game[
recommendation.contentId.toString()
];
return (
<GameCard
key={idxb}
game={game}
/>
);
}
)}
</CardContent>
</Card>
) : (
rec.sorts
.filter((a) =>
SORTS_ALLOWED_IDS.includes(a.topicId)
)
.map((sort, idx) => (
<div key={idx}>
<h1 className="text-2xl pb-2">
{sort.topic}
</h1>
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-4">
{(sort.recommendationList || []).map(
(recommendation, idxb) => {
const game =
rec.contentMetadata.Game[
recommendation.contentId.toString()
];
return (
<GameCard
key={idxb}
game={game}
/>
);
}
)}
</div>
</div>
</div>
))
)}
))
)}
</div>
</div>
</div>
</>
);
}