The weeb for the next gen discord boat - Wamellow
wamellow.com
bot
discord
nextui sucks
+201
-150
+13
-13
app/(home)/bot/pronouns/layout.tsx
+13
-13
app/(home)/bot/pronouns/layout.tsx
···
5
5
import { BsDiscord } from "react-icons/bs";
6
6
import { HiHome, HiUserAdd } from "react-icons/hi";
7
7
8
+
import { ClientButton } from "@/components/client";
8
9
import Comment from "@/components/comment";
9
10
import ImageGrid from "@/components/image-grid";
10
-
import { ServerButton } from "@/components/server-button";
11
11
import { defaultFetchOptions } from "@/lib/api";
12
12
import ArrowPic from "@/public/icons/arroww.webp";
13
13
import { ApiV1TopguildsGetResponse } from "@/typings";
···
82
82
83
83
<div className="md:text-xl text-lg lg:flex w-full mt-4">
84
84
<div className="font-medium w-full grid grid-cols-2 md:flex flex-wrap h-min gap-2">
85
-
<ServerButton
85
+
<ClientButton
86
86
as={Link}
87
87
href="/bot/pronouns"
88
88
>
89
89
<HiHome />
90
-
</ServerButton>
91
-
<ServerButton
90
+
</ClientButton>
91
+
<ClientButton
92
92
as={Link}
93
93
href="/bot/pronouns/pronouns"
94
94
>
95
95
Pronouns
96
-
</ServerButton>
97
-
<ServerButton
96
+
</ClientButton>
97
+
<ClientButton
98
98
as={Link}
99
99
href="/bot/pronouns/genders"
100
100
>
101
101
Genders
102
-
</ServerButton>
103
-
<ServerButton
102
+
</ClientButton>
103
+
<ClientButton
104
104
as={Link}
105
105
href="/bot/pronouns/sexualities"
106
106
>
107
107
Sexualities
108
-
</ServerButton>
108
+
</ClientButton>
109
109
</div>
110
110
111
111
<div className="flex flex-col min-w-full lg:min-w-[420px]">
112
112
113
113
<div className="lg:ml-auto flex gap-2 text-xl font-medium mt-4 lg:mt-0">
114
-
<ServerButton
114
+
<ClientButton
115
115
as={Link}
116
116
startContent={<HiUserAdd />}
117
117
className="button-primary w-1/2 lg:w-fit !text-xl !font-medium"
···
120
120
>
121
121
<span className="block sm:hidden">Invite</span>
122
122
<span className="hidden sm:block">Invite Pronouns</span>
123
-
</ServerButton>
124
-
<ServerButton
123
+
</ClientButton>
124
+
<ClientButton
125
125
as={Link}
126
126
startContent={<BsDiscord />}
127
127
className="w-1/2 lg:w-fit !text-xl !font-medium"
···
130
130
>
131
131
<span className="block sm:hidden">Support</span>
132
132
<span className="hidden sm:block">Join support</span>
133
-
</ServerButton>
133
+
</ClientButton>
134
134
</div>
135
135
136
136
+3
-3
app/(home)/bot/pronouns/page.tsx
+3
-3
app/(home)/bot/pronouns/page.tsx
···
5
5
import { HiCash, HiPlus } from "react-icons/hi";
6
6
7
7
import Box from "@/components/box";
8
+
import { ClientButton } from "@/components/client";
8
9
import DiscordMessage from "@/components/discord/message";
9
-
import { ServerButton } from "@/components/server-button";
10
10
import cn from "@/utils/cn";
11
11
12
12
const montserrat = Montserrat({ subsets: ["latin"] });
···
62
62
</div>
63
63
64
64
<div className="flex gap-2 mt-6">
65
-
<ServerButton
65
+
<ClientButton
66
66
as={Link}
67
67
className="bg-wamellow-alpha"
68
68
startContent={<HiPlus />}
69
69
href="/support"
70
70
>
71
71
Request additional
72
-
</ServerButton>
72
+
</ClientButton>
73
73
</div>
74
74
</div>
75
75
+3
-3
app/(home)/commands.component.tsx
+3
-3
app/(home)/commands.component.tsx
···
1
-
import { Chip } from "@nextui-org/react";
2
1
import { HiFire, HiInformationCircle } from "react-icons/hi";
3
2
4
3
import Box from "@/components/box";
4
+
import { ClientChip } from "@/components/client";
5
5
import { defaultFetchOptions } from "@/lib/api";
6
6
import { intl } from "@/utils/numbers";
7
7
···
26
26
className="p-5 pb-3 dark:bg-wamellow bg-wamellow-100 rounded-lg my-4 w-full"
27
27
>
28
28
<div className="flex">
29
-
<Chip
29
+
<ClientChip
30
30
color="secondary"
31
31
variant="flat"
32
32
size="sm"
33
33
startContent={<HiFire className="ml-1" />}
34
34
>
35
35
<span className="font-semibold">Popular Slash Commands</span>
36
-
</Chip>
36
+
</ClientChip>
37
37
<div className="ml-auto flex items-center gap-1 opacity-80">
38
38
<span className="text-xs">Since 7th December</span>
39
39
<HiInformationCircle />
+7
-7
app/(home)/debug/page.tsx
+7
-7
app/(home)/debug/page.tsx
···
4
4
import { HiTrash } from "react-icons/hi";
5
5
6
6
import Box from "@/components/box";
7
-
import { ServerButton } from "@/components/server-button";
7
+
import { ClientButton } from "@/components/client";
8
8
import { Shiggy } from "@/components/shiggy";
9
9
import { getBaseUrl, getCanonicalUrl } from "@/utils/urls";
10
10
···
101
101
items={(await cookies()).getAll()}
102
102
action={(cookie) => (
103
103
<form action={deleteCookie}>
104
-
<ServerButton
104
+
<ClientButton
105
105
type="submit"
106
106
isIconOnly
107
107
>
108
108
<HiTrash className="text-red-400" />
109
-
</ServerButton>
109
+
</ClientButton>
110
110
<input className="hidden" type="text" name="name" defaultValue={cookie.name} readOnly />
111
111
</form>
112
112
)}
113
113
>
114
114
<div className="mt-4 flex gap-2 items-center">
115
115
<form action={deleteCookie}>
116
-
<ServerButton
116
+
<ClientButton
117
117
type="submit"
118
118
>
119
119
Delete all cookies
120
-
</ServerButton>
120
+
</ClientButton>
121
121
</form>
122
-
<ServerButton
122
+
<ClientButton
123
123
as={Link}
124
124
href="/logout"
125
125
prefetch={false}
126
126
>
127
127
Logout
128
-
</ServerButton>
128
+
</ClientButton>
129
129
</div>
130
130
</Panel>
131
131
+52
-52
app/(home)/page.tsx
+52
-52
app/(home)/page.tsx
···
1
-
import { AvatarGroup, Chip, Code } from "@nextui-org/react";
1
+
import { Code } from "@nextui-org/react";
2
2
import { Montserrat, Patrick_Hand } from "next/font/google";
3
3
import Image from "next/image";
4
4
import Link from "next/link";
···
7
7
8
8
import { Avatar } from "@/components/avatar";
9
9
import Box from "@/components/box";
10
+
import { ClientAvatarGroup, ClientButton, ClientChip } from "@/components/client";
10
11
import Comment from "@/components/comment";
11
12
import DiscordAppBadge from "@/components/discord/app-badge";
12
13
import DiscordChannel from "@/components/discord/channel";
···
16
17
import DiscordMessageEmbed from "@/components/discord/message-embed";
17
18
import DiscordUser from "@/components/discord/user";
18
19
import ImageReduceMotion from "@/components/image-reduce-motion";
19
-
import { ServerButton } from "@/components/server-button";
20
20
import { defaultFetchOptions } from "@/lib/api";
21
21
import AiPic from "@/public/ai.webp";
22
22
import CaptchaPic from "@/public/captcha.webp";
···
69
69
});
70
70
71
71
const Invite = () => (
72
-
<ServerButton
72
+
<ClientButton
73
73
as={Link}
74
74
color="secondary"
75
75
href="/login?invite=true"
···
78
78
>
79
79
<span className="block sm:hidden">Invite</span>
80
80
<span className="hidden sm:block">Invite Wamellow</span>
81
-
</ServerButton>
81
+
</ClientButton>
82
82
);
83
83
84
84
async function renderCount() {
···
109
109
Engage with leaderboards, starboards, and welcoming atmosphere. Dive into anime discussions, enjoy free /image AI and unleash the power of Text-To-Speech.
110
110
</span>
111
111
112
-
<AvatarGroup
112
+
<ClientAvatarGroup
113
113
className="mr-auto md:hidden"
114
114
max={8}
115
115
renderCount={renderCount}
···
124
124
/>
125
125
))
126
126
}
127
-
</AvatarGroup>
127
+
</ClientAvatarGroup>
128
128
129
129
<div className="space-y-4">
130
130
<Link
···
135
135
</Link>
136
136
137
137
<div className="flex gap-2 lg:mt-0">
138
-
<ServerButton
138
+
<ClientButton
139
139
as={Link}
140
140
className="w-1/2 lg:w-fit !text-xl !font-medium"
141
141
color="secondary"
···
146
146
>
147
147
<span className="block sm:hidden">Invite</span>
148
148
<span className="hidden sm:block">Invite Wamellow</span>
149
-
</ServerButton>
150
-
<ServerButton
149
+
</ClientButton>
150
+
<ClientButton
151
151
as={Link}
152
152
startContent={<BsDiscord />}
153
153
className="w-1/2 lg:w-fit !text-xl !font-medium"
···
156
156
>
157
157
<span className="block sm:hidden">Support</span>
158
158
<span className="hidden sm:block">Join support</span>
159
-
</ServerButton>
159
+
</ClientButton>
160
160
</div>
161
161
162
162
<span className={cn("lg:ml-auto flex gap-2 text-neutral-500 font-medium mt-3 opacity-80 pl-20 lg:pr-20 rotate-2", handwritten.className)}>
···
225
225
226
226
<Box className="flex flex-col md:flex-row gap-10 items-center">
227
227
<div className="md:w-1/2 flex flex-col items-start">
228
-
<Chip
228
+
<ClientChip
229
229
className="mb-2"
230
230
color="secondary"
231
231
variant="flat"
···
233
233
startContent={<HiCash className="mx-1" />}
234
234
>
235
235
<span className="font-semibold">100% free forever</span>
236
-
</Chip>
236
+
</ClientChip>
237
237
238
238
<h3 className={styles.h3}>40 Voices in 8 Languages</h3>
239
239
···
242
242
Great for people with aphonia, dysphonia, or other speech impairments.
243
243
</div>
244
244
245
-
<AvatarGroup
245
+
<ClientAvatarGroup
246
246
className="mt-4"
247
247
max={8}
248
248
>
···
263
263
);
264
264
})}
265
265
<span className="sr-only">Change Text-to-Speech language and voice</span>
266
-
</AvatarGroup>
266
+
</ClientAvatarGroup>
267
267
268
268
<div className="flex gap-2 mt-5">
269
269
<Invite />
270
-
<ServerButton
270
+
<ClientButton
271
271
as={Link}
272
272
className="bg-wamellow"
273
273
startContent={<BsYoutube />}
···
275
275
target="_blank"
276
276
>
277
277
Watch YouTube Video
278
-
</ServerButton>
278
+
</ClientButton>
279
279
</div>
280
280
</div>
281
281
···
320
320
321
321
<Box className="flex flex-col md:flex-row-reverse gap-10 items-center">
322
322
<div className="md:w-1/2">
323
-
<Chip
323
+
<ClientChip
324
324
className="mb-2"
325
325
color="secondary"
326
326
variant="flat"
···
328
328
startContent={<HiCash className="mx-1" />}
329
329
>
330
330
<span className="font-semibold">Styling & 30 Channels free</span>
331
-
</Chip>
331
+
</ClientChip>
332
332
<h3 className={styles.h3}>Stay up-to-date on YouTube</h3>
333
333
<div className="pt-6">
334
334
Set up notifications with free custom messages and embeds for up to 30 channels and get notified in less than a minute.
···
350
350
</div>
351
351
<div className="flex gap-2 mt-6">
352
352
<Invite />
353
-
<ServerButton
353
+
<ClientButton
354
354
as={Link}
355
355
className="bg-wamellow"
356
356
startContent={<HiArrowRight />}
357
357
href="/dashboard?to=notifications&utm_source=wamellow.com&utm_medium=home"
358
358
>
359
359
Setup
360
-
</ServerButton>
360
+
</ClientButton>
361
361
</div>
362
362
</div>
363
363
···
392
392
393
393
<Box className="flex flex-col md:flex-row gap-10 items-center">
394
394
<div className="md:w-1/2">
395
-
<Chip
395
+
<ClientChip
396
396
className="mb-2"
397
397
color="secondary"
398
398
variant="flat"
···
400
400
startContent={<HiCash className="mx-1" />}
401
401
>
402
402
<span className="font-semibold">100% no money loss</span>
403
-
</Chip>
403
+
</ClientChip>
404
404
<h3 className={styles.h3}>Free /image command</h3>
405
405
<div className="pt-6">
406
406
Summon the enchantment of AI-generated images to your Discord server with our versatile /image command, featuring over 40 distinct custom models.
407
407
Customize the rating, quality, aesthetics, image width and height, upscaled, generation steps and the CFG scale all for free.
408
408
</div>
409
409
<div className="p-4 pb-3 border dark:border-wamellow-alpha border-wamellow-100 rounded-lg my-8">
410
-
<Chip
410
+
<ClientChip
411
411
className="mb-2"
412
412
color="secondary"
413
413
variant="flat"
···
415
415
startContent={<HiFire className="mx-1" />}
416
416
>
417
417
<span className="font-semibold">NSFW Supported</span>
418
-
</Chip>
418
+
</ClientChip>
419
419
<div className="text-base">
420
420
Generate spicy images and more in nsfw marked channels.
421
421
</div>
422
422
</div>
423
423
<div className="flex gap-2 mt-6">
424
424
<Invite />
425
-
<ServerButton
425
+
<ClientButton
426
426
as={Link}
427
427
className="bg-wamellow"
428
428
startContent={<HiArrowRight />}
429
429
href="/ai-gallery?utm_source=wamellow.com&utm_medium=home"
430
430
>
431
431
View Images
432
-
</ServerButton>
432
+
</ClientButton>
433
433
</div>
434
434
</div>
435
435
···
458
458
459
459
<Box className="flex flex-col md:flex-row-reverse gap-10 items-center">
460
460
<div className="md:w-1/2">
461
-
<Chip
461
+
<ClientChip
462
462
className="mb-2"
463
463
color="secondary"
464
464
variant="flat"
···
466
466
startContent={<HiCash className="mx-1" />}
467
467
>
468
468
<span className="font-semibold">100% sexy forever</span>
469
-
</Chip>
469
+
</ClientChip>
470
470
<h3 className={styles.h3}>/anime command</h3>
471
471
<div className="pt-6">
472
472
Unleash the magic of anime right within your Discord server with Wamellow{"'"}s 25+ categories.
···
474
474
Whether it{"'"}s sharing the cutest characters or discovering stunning artwork, bring the joy of anime directly to your community, making your server a hub for all things anime-related.
475
475
</div>
476
476
<div className="p-4 pb-3 border dark:border-wamellow-alpha border-wamellow-100 rounded-lg my-8">
477
-
<Chip
477
+
<ClientChip
478
478
className="mb-2"
479
479
color="secondary"
480
480
variant="flat"
···
482
482
startContent={<HiFire className="mx-1" />}
483
483
>
484
484
<span className="font-semibold">NSFW Supported</span>
485
-
</Chip>
485
+
</ClientChip>
486
486
<div className="text-base">
487
487
Find spicy nekos, waifus, and more in nsfw marked channels.
488
488
</div>
···
516
516
517
517
<Box className="flex flex-col md:flex-row gap-10 items-center">
518
518
<div className="md:w-1/2">
519
-
<Chip
519
+
<ClientChip
520
520
className="mb-2"
521
521
color="secondary"
522
522
variant="flat"
···
524
524
startContent={<HiCash className="mx-1" />}
525
525
>
526
526
<span className="font-semibold">100% free forever</span>
527
-
</Chip>
527
+
</ClientChip>
528
528
<h3 className={styles.h3}>/leaderboard & /rank</h3>
529
529
<div className="pt-6">
530
530
Enhance your server{"’"}s engagement with our text-, voice- and invite based leaderboards, tailored to track and reward your most active members.
···
532
532
</div>
533
533
<div className="flex gap-2 mt-6">
534
534
<Invite />
535
-
<ServerButton
535
+
<ClientButton
536
536
as={Link}
537
537
className="bg-wamellow"
538
538
startContent={<HiArrowRight />}
539
539
href="/leaderboard/828676951023550495?utm_source=wamellow.com&utm_medium=home"
540
540
>
541
541
View Leaderboard
542
-
</ServerButton>
542
+
</ClientButton>
543
543
</div>
544
544
</div>
545
545
···
566
566
567
567
<Box className="flex flex-col md:flex-row gap-10 items-center">
568
568
<div className="md:w-1/2">
569
-
<Chip
569
+
<ClientChip
570
570
className="mb-2"
571
571
color="secondary"
572
572
variant="flat"
···
574
574
startContent={<HiCash className="mx-1" />}
575
575
>
576
576
<span className="font-semibold">My lawyer said that title below</span>
577
-
</Chip>
577
+
</ClientChip>
578
578
<h3 className={styles.h3}>POGBOARD DEEZ NUTS</h3>
579
579
<div className="pt-6">
580
580
With Starboards, you have the power to elevate remarkable messages within our server.
···
583
583
</div>
584
584
<div className="flex gap-2 mt-6">
585
585
<Invite />
586
-
<ServerButton
586
+
<ClientButton
587
587
as={Link}
588
588
className="bg-wamellow"
589
589
startContent={<HiArrowRight />}
590
590
href="/dashboard?to=starboard&utm_source=wamellow.com&utm_medium=home"
591
591
>
592
592
Setup
593
-
</ServerButton>
593
+
</ClientButton>
594
594
</div>
595
595
</div>
596
596
···
628
628
629
629
<Box className="flex flex-col md:flex-row-reverse gap-10 items-center">
630
630
<div className="md:w-1/2">
631
-
<Chip
631
+
<ClientChip
632
632
className="mb-2"
633
633
color="secondary"
634
634
variant="flat"
···
636
636
startContent={<HiCash className="mx-1" />}
637
637
>
638
638
<span className="font-semibold">w/ free image background</span>
639
-
</Chip>
639
+
</ClientChip>
640
640
<h3 className={styles.h3}>Greetings</h3>
641
641
<div className="pt-6">
642
642
Give a warm welcome to new members, introducing them to rules, topics, and ongoing events.
···
645
645
</div>
646
646
<div className="flex gap-2 mt-6">
647
647
<Invite />
648
-
<ServerButton
648
+
<ClientButton
649
649
as={Link}
650
650
className="bg-wamellow"
651
651
startContent={<HiArrowRight />}
652
652
href="/dashboard?to=greeting&utm_source=wamellow.com&utm_medium=home"
653
653
>
654
654
Setup
655
-
</ServerButton>
655
+
</ClientButton>
656
656
</div>
657
657
</div>
658
658
···
680
680
681
681
<Box className="flex flex-col md:flex-row gap-10 items-center">
682
682
<div className="md:w-1/2">
683
-
<Chip
683
+
<ClientChip
684
684
className="mb-2"
685
685
color="secondary"
686
686
variant="flat"
···
688
688
startContent={<HiCash className="mx-1" />}
689
689
>
690
690
<span className="font-semibold">Of course it{"'"}s free</span>
691
-
</Chip>
691
+
</ClientChip>
692
692
<h3 className={styles.h3}>Captcha verification</h3>
693
693
<div className="pt-6">
694
694
Protect your server from unwanted attacks such as bot-raids with our captcha verification system.
···
696
696
</div>
697
697
<div className="flex gap-2 mt-6">
698
698
<Invite />
699
-
<ServerButton
699
+
<ClientButton
700
700
as={Link}
701
701
className="bg-wamellow"
702
702
startContent={<HiLockOpen />}
703
703
href="/passport/1125063180801036329?utm_source=wamellow.com&utm_medium=home"
704
704
>
705
705
Try it out
706
-
</ServerButton>
707
-
<ServerButton
706
+
</ClientButton>
707
+
<ClientButton
708
708
as={Link}
709
709
className="bg-wamellow"
710
710
startContent={<HiArrowRight />}
711
711
href="/dashboard?to=greeting&utm_source=wamellow.com&utm_medium=home"
712
712
>
713
713
Setup
714
-
</ServerButton>
714
+
</ClientButton>
715
715
</div>
716
716
</div>
717
717
···
737
737
738
738
<Box className="flex flex-col md:flex-row-reverse gap-10 items-center">
739
739
<div className="md:w-1/2">
740
-
<Chip
740
+
<ClientChip
741
741
className="mb-2"
742
742
color="secondary"
743
743
variant="flat"
···
745
745
startContent={<HiCash className="mx-1" />}
746
746
>
747
747
<span className="font-semibold">30 tags free</span>
748
-
</Chip>
748
+
</ClientChip>
749
749
<h3 className={styles.h3}>Wamellow tags</h3>
750
750
<div className="pt-6">
751
751
Easily handle frequently asked questions, common queries, and repetitive tasks in a snap.
···
754
754
</div>
755
755
<div className="flex gap-2 mt-6">
756
756
<Invite />
757
-
<ServerButton
757
+
<ClientButton
758
758
as={Link}
759
759
className="bg-wamellow"
760
760
startContent={<HiArrowRight />}
761
761
href="/dashboard?to=custom-commands&utm_source=wamellow.com&utm_medium=home"
762
762
>
763
763
Setup
764
-
</ServerButton>
764
+
</ClientButton>
765
765
</div>
766
766
</div>
767
767
+2
-2
app/(home)/status/cluster.component.tsx
+2
-2
app/(home)/status/cluster.component.tsx
···
22
22
</span>
23
23
24
24
<span className="text-neutral-300">
25
-
#{cluster.id}
25
+
#{cluster.id}
26
26
</span>
27
27
</div>
28
28
···
77
77
);
78
78
}
79
79
80
-
function Row({ name, children }: { name:string; children: ReactNode; }) {
80
+
function Row({ name, children }: { name: string; children: ReactNode; }) {
81
81
return (
82
82
<div>
83
83
<span className="text-neutral-300 font-medium">{children}</span>
+10
-10
app/(home)/status/node.component.tsx
+10
-10
app/(home)/status/node.component.tsx
···
5
5
6
6
import { ApiNode } from "./api";
7
7
8
-
export function Node({ index, node }: {index:number;node:ApiNode}) {
8
+
export function Node({ index, node }: { index: number; node: ApiNode }) {
9
9
return (
10
10
<div
11
11
className="p-4 bg-wamellow rounded-lg space-y-2 outline-violet-400 duration-200 h-fit"
···
22
22
</span>
23
23
24
24
{node.id.endsWith("-lun-1") &&
25
-
<Chip
26
-
className="ml-auto hidden sm:flex"
27
-
startContent={<FaCrown className="ml-1" />}
28
-
color="warning"
29
-
variant="flat"
30
-
>
25
+
<Chip
26
+
className="ml-auto hidden sm:flex"
27
+
startContent={<FaCrown className="ml-1" />}
28
+
color="warning"
29
+
variant="flat"
30
+
>
31
31
master
32
-
</Chip>
32
+
</Chip>
33
33
}
34
34
</div>
35
35
···
51
51
);
52
52
}
53
53
54
-
function Icon({ id }: {id:string}) {
54
+
function Icon({ id }: { id: string }) {
55
55
return (
56
56
<Image
57
57
alt={`${id} country flag`}
···
63
63
);
64
64
}
65
65
66
-
function Row({ name, children }:{ name:string; children: ReactNode; }) {
66
+
function Row({ name, children }: { name: string; children: ReactNode; }) {
67
67
return (
68
68
<div>
69
69
<span className="text-neutral-300 font-medium">{children}</span>
+1
-1
app/(home)/status/side.component.tsx
+1
-1
app/(home)/status/side.component.tsx
+5
-5
app/(home)/team/repository.component.tsx
+5
-5
app/(home)/team/repository.component.tsx
···
1
-
import { Chip } from "@nextui-org/react";
2
1
import Link from "next/link";
3
2
import { HiBeaker, HiExternalLink, HiStar } from "react-icons/hi";
4
3
4
+
import { ClientChip } from "@/components/client";
5
5
import { getRepository } from "@/lib/github";
6
6
import cn from "@/utils/cn";
7
7
···
28
28
<span className="text-lg text-neutral-200 font-medium -mb-0.5">
29
29
{repo.full_name}
30
30
</span>
31
-
<Chip
31
+
<ClientChip
32
32
startContent={<HiStar className="mx-0.5 size-4" />}
33
33
variant="flat"
34
34
color="secondary"
35
35
size="sm"
36
36
>
37
37
{repo.stargazers_count}
38
-
</Chip>
39
-
<Chip
38
+
</ClientChip>
39
+
<ClientChip
40
40
startContent={<HiBeaker className="mx-1 size-3" />}
41
41
size="sm"
42
42
>
43
43
{repo.language}
44
-
</Chip>
44
+
</ClientChip>
45
45
</div>
46
46
<span className="opacity-75">{repo.description}</span>
47
47
</div>
+5
-5
app/ai-gallery/(home)/layout.tsx
+5
-5
app/ai-gallery/(home)/layout.tsx
···
5
5
import { BsDiscord } from "react-icons/bs";
6
6
import { HiUserAdd } from "react-icons/hi";
7
7
8
+
import { ClientButton } from "@/components/client";
8
9
import { Footer } from "@/components/footer";
9
-
import { ServerButton } from "@/components/server-button";
10
10
import CommandPic from "@/public/image-command.webp";
11
11
import cn from "@/utils/cn";
12
12
import { getBaseUrl, getCanonicalUrl } from "@/utils/urls";
···
81
81
</Link>
82
82
83
83
<div className="flex gap-2 mt-4">
84
-
<ServerButton
84
+
<ClientButton
85
85
as={Link}
86
86
className="w-1/2 lg:w-fit !text-xl !font-medium"
87
87
color="secondary"
···
92
92
>
93
93
<span className="block sm:hidden">Invite</span>
94
94
<span className="hidden sm:block">Invite Wamellow</span>
95
-
</ServerButton>
96
-
<ServerButton
95
+
</ClientButton>
96
+
<ClientButton
97
97
as={Link}
98
98
startContent={<BsDiscord />}
99
99
className="w-1/2 lg:w-fit !text-xl !font-medium"
···
102
102
>
103
103
<span className="block sm:hidden">Support</span>
104
104
<span className="hidden sm:block">Join support</span>
105
-
</ServerButton>
105
+
</ClientButton>
106
106
</div>
107
107
108
108
<Footer />
+3
-3
app/ai-gallery/[uploadId]/layout.tsx
+3
-3
app/ai-gallery/[uploadId]/layout.tsx
···
4
4
import Link from "next/link";
5
5
import { HiArrowLeft, HiHome, HiPlus } from "react-icons/hi";
6
6
7
+
import { ClientButton } from "@/components/client";
7
8
import { Footer } from "@/components/footer";
8
9
import Notice from "@/components/notice";
9
10
import { ScreenMessage, SupportButton } from "@/components/screen-message";
10
-
import { ServerButton } from "@/components/server-button";
11
11
import { getPageAnalytics } from "@/lib/analytics";
12
12
import { getGuild } from "@/lib/api";
13
13
import SadWumpusPic from "@/public/sad-wumpus.gif";
···
85
85
title="Something went wrong!"
86
86
description={upload.message}
87
87
buttons={<>
88
-
<ServerButton
88
+
<ClientButton
89
89
as={Link}
90
90
href="/"
91
91
startContent={<HiHome />}
92
92
>
93
93
Go back to Home
94
-
</ServerButton>
94
+
</ClientButton>
95
95
<SupportButton />
96
96
</>}
97
97
>
+3
-3
app/dashboard/[guildId]/layout.tsx
+3
-3
app/dashboard/[guildId]/layout.tsx
···
11
11
import { useQuery } from "react-query";
12
12
13
13
import { guildStore } from "@/common/guilds";
14
+
import { ClientButton } from "@/components/client";
14
15
import { CopyToClipboardButton } from "@/components/copy-to-clipboard";
15
16
import ImageReduceMotion from "@/components/image-reduce-motion";
16
17
import { ListTab } from "@/components/list";
17
18
import { AddButton, ScreenMessage, SupportButton } from "@/components/screen-message";
18
-
import { ServerButton } from "@/components/server-button";
19
19
import { cacheOptions, getData } from "@/lib/api";
20
20
import SadWumpusPic from "@/public/sad-wumpus.gif";
21
21
import { ApiV1GuildsChannelsGetResponse, ApiV1GuildsEmojisGetResponse, ApiV1GuildsGetResponse, ApiV1GuildsRolesGetResponse } from "@/typings";
···
236
236
}
237
237
description={error}
238
238
buttons={<>
239
-
<ServerButton
239
+
<ClientButton
240
240
as={Link}
241
241
href="/profile"
242
242
startContent={<HiViewGridAdd />}
243
243
>
244
244
Go back to Dashboard
245
-
</ServerButton>
245
+
</ClientButton>
246
246
{error.includes("permissions")
247
247
? <AddButton />
248
248
: <SupportButton />
+3
-2
app/leaderboard/[guildId]/layout.tsx
+3
-2
app/leaderboard/[guildId]/layout.tsx
···
1
-
import { Image } from "@nextui-org/react";
2
1
import { Metadata } from "next";
2
+
import Image from "next/image";
3
3
import { HiAnnotation, HiLink, HiUsers, HiVolumeUp } from "react-icons/hi";
4
4
5
+
import { ClientImageWall } from "@/components/client";
5
6
import ImageReduceMotion from "@/components/image-reduce-motion";
6
7
import { ListTab } from "@/components/list";
7
8
import { getGuild } from "@/lib/api";
···
93
94
}
94
95
95
96
<div className="relative mb-14 w-full">
96
-
<Image
97
+
<ClientImageWall
97
98
alt=""
98
99
className="w-full object-cover"
99
100
classNames={{ img: "!h-36 md:!h-64", blurredImg: "!h-40 md:!h-72 -top-5" }}
+6
-6
app/leaderboard/[guildId]/loading.tsx
+6
-6
app/leaderboard/[guildId]/loading.tsx
···
1
-
import { Skeleton } from "@nextui-org/react";
1
+
import { ClientSkeleton } from "@/components/client";
2
2
3
3
export default function Loading() {
4
4
return new Array(20).fill(null).map((_, i) => (
···
6
6
key={"leaderboardLoading-" + i}
7
7
className="mb-4 rounded-md p-3 flex items-center dark:bg-wamellow bg-wamellow-100 w-full"
8
8
>
9
-
<Skeleton className="rounded-full w-12 h-12 mr-3" />
9
+
<ClientSkeleton className="rounded-full w-12 h-12 mr-3" />
10
10
11
11
<div className="flex flex-col gap-2 mt-0.5">
12
-
<Skeleton className="h-5 w-28 rounded-full" />
13
-
<Skeleton className="h-3 w-20 rounded-full" />
12
+
<ClientSkeleton className="h-5 w-28 rounded-full" />
13
+
<ClientSkeleton className="h-3 w-20 rounded-full" />
14
14
</div>
15
15
16
-
<Skeleton className="ml-auto h-8 w-14 rounded-lg" />
16
+
<ClientSkeleton className="ml-auto h-8 w-14 rounded-lg" />
17
17
18
-
<Skeleton className="rounded-full w-12 h-12 ml-3" />
18
+
<ClientSkeleton className="rounded-full w-12 h-12 ml-3" />
19
19
</div>
20
20
));
21
21
}
+6
-6
app/leaderboard/[guildId]/member.component.tsx
+6
-6
app/leaderboard/[guildId]/member.component.tsx
···
1
-
import { Badge, Chip, CircularProgress } from "@nextui-org/react";
2
1
import { cookies } from "next/headers";
3
2
import Image from "next/image";
4
3
import Link from "next/link";
5
4
import { HiBadgeCheck } from "react-icons/hi";
6
5
6
+
import { ClientBadge, ClientChip, ClientCircularProgress } from "@/components/client";
7
7
import DiscordAppBadge from "@/components/discord/app-badge";
8
8
import ImageReduceMotion from "@/components/image-reduce-motion";
9
9
import { ApiV1GuildsTopmembersGetResponse, ApiV1GuildsTopmembersPaginationGetResponse } from "@/typings";
···
57
57
)}
58
58
style={averageColor ? { backgroundColor: averageColor + "50" } : {}}
59
59
>
60
-
<Badge
60
+
<ClientBadge
61
61
className={cn(
62
62
"size-6 font-bold",
63
63
(() => {
···
82
82
url={`https://cdn.discordapp.com/avatars/${member.id}/${member.avatar}`}
83
83
size={128}
84
84
/>
85
-
</Badge>
85
+
</ClientBadge>
86
86
87
87
<div className="w-full md:max-w-fit">
88
88
<div className="flex items-center gap-2">
···
130
130
</div>
131
131
132
132
<form action={publish}>
133
-
<CircularProgress
133
+
<ClientCircularProgress
134
134
as="button"
135
135
type="submit"
136
136
className="ml-4"
···
165
165
children: React.ReactNode
166
166
}) {
167
167
return (
168
-
<Chip
168
+
<ClientChip
169
169
as={Link}
170
170
color="secondary"
171
171
href="/team?utm_source=wamellow.com&utm_medium=leaderboard"
···
175
175
variant="flat"
176
176
>
177
177
<span className="font-bold">{children}</span>
178
-
</Chip>
178
+
</ClientChip>
179
179
);
180
180
}
181
181
+3
-3
app/passport/[guildId]/page.tsx
+3
-3
app/passport/[guildId]/page.tsx
···
4
4
import { BsDiscord } from "react-icons/bs";
5
5
import { HiChartBar, HiCheck, HiLightningBolt, HiLockClosed, HiStar, HiUsers, HiX } from "react-icons/hi";
6
6
7
+
import { ClientButton } from "@/components/client";
7
8
import ImageReduceMotion from "@/components/image-reduce-motion";
8
9
import { ListFeature } from "@/components/list";
9
10
import Notice, { NoticeType } from "@/components/notice";
10
11
import { OverviewLink } from "@/components/overview-link";
11
-
import { ServerButton } from "@/components/server-button";
12
12
import { getGuild } from "@/lib/api";
13
13
import paintPic from "@/public/paint.webp";
14
14
import decimalToRgb from "@/utils/decimalToRgb";
···
89
89
90
90
{guild && "id" in guild && guild?.id === "1125063180801036329" &&
91
91
<Notice type={NoticeType.Info} message="This is a demo server to test out passport verification." >
92
-
<ServerButton
92
+
<ClientButton
93
93
as={Link}
94
94
color="secondary"
95
95
href="https://discord.gg/2nrK8DfjPt"
···
97
97
startContent={<BsDiscord />}
98
98
>
99
99
Join Server
100
-
</ServerButton>
100
+
</ClientButton>
101
101
</Notice>
102
102
}
103
103
+62
components/client.tsx
+62
components/client.tsx
···
1
+
"use client";
2
+
3
+
import { AvatarGroup, Badge, Button, Chip, CircularProgress, Image, Skeleton } from "@nextui-org/react";
4
+
5
+
export function ClientButton(props: React.ComponentProps<typeof Button>) {
6
+
return (
7
+
<Button {...props}>
8
+
{props.children}
9
+
</Button>
10
+
);
11
+
}
12
+
13
+
export function ClientChip(props: React.ComponentProps<typeof Chip>) {
14
+
return (
15
+
<Chip {...props}>
16
+
{props.children}
17
+
</Chip>
18
+
);
19
+
}
20
+
21
+
export function ClientAvatarGroup(props: React.ComponentProps<typeof AvatarGroup>) {
22
+
return (
23
+
<AvatarGroup {...props}>
24
+
{props.children}
25
+
</AvatarGroup>
26
+
);
27
+
}
28
+
29
+
export function ClientImageWall(props: React.ComponentProps<typeof Image>) {
30
+
return (
31
+
<Image
32
+
alt=""
33
+
{...props}
34
+
>
35
+
{props.children}
36
+
</Image>
37
+
);
38
+
}
39
+
40
+
export function ClientSkeleton(props: React.ComponentProps<typeof Skeleton>) {
41
+
return (
42
+
<Skeleton {...props}>
43
+
{props.children}
44
+
</Skeleton>
45
+
);
46
+
}
47
+
48
+
export function ClientBadge(props: React.ComponentProps<typeof Badge>) {
49
+
return (
50
+
<Badge {...props}>
51
+
{props.children}
52
+
</Badge>
53
+
);
54
+
}
55
+
56
+
export function ClientCircularProgress(props: React.ComponentProps<typeof CircularProgress>) {
57
+
return (
58
+
<CircularProgress {...props}>
59
+
{props.children}
60
+
</CircularProgress>
61
+
);
62
+
}
+9
-9
components/screen-message.tsx
+9
-9
components/screen-message.tsx
···
5
5
6
6
import cn from "@/utils/cn";
7
7
8
-
import { ServerButton } from "./server-button";
8
+
import { ClientButton } from "./client";
9
9
10
10
type Props = {
11
11
title: string;
···
58
58
59
59
{(button && props.href) &&
60
60
<div className="w-full flex flex-col items-center">
61
-
<ServerButton
61
+
<ClientButton
62
62
as={Link}
63
63
{...props}
64
64
className={cn("px-20", props.className)}
65
65
startContent={icon}
66
66
>
67
67
{button}
68
-
</ServerButton>
68
+
</ClientButton>
69
69
</div>
70
70
}
71
71
···
85
85
86
86
export function HomeButton() {
87
87
return (
88
-
<ServerButton
88
+
<ClientButton
89
89
as={Link}
90
90
href="/"
91
91
startContent={<HiHome />}
92
92
>
93
93
Go back to Home
94
-
</ServerButton>
94
+
</ClientButton>
95
95
);
96
96
}
97
97
98
98
export function AddButton() {
99
99
return (
100
-
<ServerButton
100
+
<ClientButton
101
101
as={Link}
102
102
className="button-primary"
103
103
href="/login?invite=true"
···
105
105
startContent={<BsDiscord />}
106
106
>
107
107
Add Wamellow to your server
108
-
</ServerButton>
108
+
</ClientButton>
109
109
);
110
110
}
111
111
112
112
export function SupportButton() {
113
113
return (
114
-
<ServerButton
114
+
<ClientButton
115
115
as={Link}
116
116
className="button-primary"
117
117
href="/support"
118
118
startContent={<BsDiscord />}
119
119
>
120
120
Join support server
121
-
</ServerButton>
121
+
</ClientButton>
122
122
);
123
123
}