The weeb for the next gen discord boat - Wamellow
wamellow.com
bot
discord
wrap components into suspense
+14
-4
+5
-1
app/(home)/layout.tsx
+5
-1
app/(home)/layout.tsx
+8
-2
app/(home)/page.tsx
+8
-2
app/(home)/page.tsx
···
2
2
import { Montserrat, Patrick_Hand } from "next/font/google";
3
3
import Image from "next/image";
4
4
import Link from "next/link";
5
+
import { Suspense } from "react";
5
6
import { BsDiscord, BsYoutube } from "react-icons/bs";
6
7
import { HiArrowNarrowRight, HiArrowRight, HiCash, HiCheck, HiFire, HiLockOpen, HiUserAdd } from "react-icons/hi";
7
8
···
17
18
import DiscordMessageEmbed from "@/components/discord/message-embed";
18
19
import DiscordUser from "@/components/discord/user";
19
20
import ImageReduceMotion from "@/components/image-reduce-motion";
21
+
import { Skeleton } from "@/components/ui/skeleton";
20
22
import { defaultFetchOptions } from "@/lib/api";
21
23
import AiPic from "@/public/ai.webp";
22
24
import CaptchaPic from "@/public/captcha.webp";
···
93
95
<div className="flex w-full items-center gap-8 mb-16 md:mb-12 min-h-[500px] h-[calc(100svh-14rem)] md:h-[calc(100svh-17rem)]">
94
96
<div className="md:min-w-96 w-full md:w-2/3 xl:w-1/2 flex flex-col space-y-6">
95
97
96
-
<Ratings />
98
+
<Suspense fallback={<Skeleton className="w-[15rem] !h-6 !m-0" isLoading={true} />}>
99
+
<Ratings />
100
+
</Suspense>
97
101
98
102
<h1 className={cn(montserrat.className, "lg:text-7xl md:text-6xl text-5xl font-semibold dark:text-neutral-100 text-neutral-900 break-words")}>
99
103
<span className="bg-gradient-to-r from-indigo-400 to-pink-400 bg-clip-text text-transparent h-20 break-keep">
···
816
820
content="FUCK EVERYTHING! EXCEPT LUNA, LUNA MUST BE PROTECTED AT ALL COSTS"
817
821
/>
818
822
819
-
<Commands />
823
+
<Suspense>
824
+
<Commands />
825
+
</Suspense>
820
826
821
827
</div>
822
828
);
+1
-1
app/(home)/ratings.component.tsx
+1
-1
app/(home)/ratings.component.tsx