lint existing files

HolodexNet · Oct 23, 2023 · 4f11956 · 4f11956
1 parent 3999a46
commit 4f11956
Show file tree

Hide file tree

Showing 25 changed files with 274 additions and 285 deletions.
diff --git a/packages/react/src/components/about/ContactList.tsx b/packages/react/src/components/about/ContactList.tsx
@@ -3,10 +3,10 @@ import { AboutHeading } from "@/components/about/Heading";
 import { useTranslation } from "react-i18next";
 import { Link } from "react-router-dom";
 
-export function ContactList () {
+export function ContactList() {
   const { t } = useTranslation();
 
-	return (
+  return (
     <div>
       <AboutHeading>{t("about.contact.discord")}</AboutHeading>
       <Link to="https://discord.gg/A24AbzgvRJ" target="_blank">
@@ -41,4 +41,4 @@ export function ContactList () {
       <AboutFaqEmailForm />
     </div>
   );
-}
+}
diff --git a/packages/react/src/components/about/Description.tsx b/packages/react/src/components/about/Description.tsx
@@ -1,9 +1,16 @@
 import { cn } from "@/lib/utils";
 import { DetailedHTMLProps, HTMLAttributes } from "react";
 
-export function AboutDescription (props: DetailedHTMLProps<HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>) {
-
-	return (
-		<p {...props} className={cn('mt-2 leading-8 tracking-wide', props.className)} />
-	)
-}
+export function AboutDescription(
+  props: DetailedHTMLProps<
+    HTMLAttributes<HTMLParagraphElement>,
+    HTMLParagraphElement
+  >,
+) {
+  return (
+    <p
+      {...props}
+      className={cn("mt-2 leading-8 tracking-wide", props.className)}
+    />
+  );
+}
diff --git a/packages/react/src/components/about/Heading.tsx b/packages/react/src/components/about/Heading.tsx
@@ -1,9 +1,19 @@
 import { cn } from "@/lib/utils";
 import { DetailedHTMLProps, HTMLAttributes } from "react";
 
-export function AboutHeading (props: DetailedHTMLProps<HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>) {
-
-	return (
-		<h3 {...props} className={cn('text-2xl font-bold tracking-wide mt-3 mb-2', props.className)} />
-	)
-}
+export function AboutHeading(
+  props: DetailedHTMLProps<
+    HTMLAttributes<HTMLHeadingElement>,
+    HTMLHeadingElement
+  >,
+) {
+  return (
+    <h3
+      {...props}
+      className={cn(
+        "text-2xl font-bold tracking-wide mt-3 mb-2",
+        props.className,
+      )}
+    />
+  );
+}
diff --git a/packages/react/src/components/about/QuickLink.tsx b/packages/react/src/components/about/QuickLink.tsx
@@ -17,7 +17,7 @@ export interface QuickLinkProps {
 
 export function QuickLink({ className, icon, label, href }: QuickLinkProps) {
   return (
-    <Button className={className} size='lg' variant='outline' asChild>
+    <Button className={className} size="lg" variant="outline" asChild>
       <Link to={href} target="_blank">
         <div className={icon} />
         {label}

diff --git a/packages/react/src/components/about/request/LanguagePicker.tsx b/packages/react/src/components/about/request/LanguagePicker.tsx
@@ -73,17 +73,19 @@ export function LanguagePicker<
       defaultValue={field.value}
       {...form.register(name, {
         required: {
-					value: true,
-					message: t('channelRequest.required')
-				},
+          value: true,
+          message: t("channelRequest.required"),
+        },
       })}
     >
       <SelectTrigger>
         <SelectValue placeholder={t("channelRequest.selectLanguage")} />
       </SelectTrigger>
       <SelectContent>
         {languages.map(({ text, value }) => (
-          <SelectItem key={value} value={value}>{text}</SelectItem>
+          <SelectItem key={value} value={value}>
+            {text}
+          </SelectItem>
         ))}
       </SelectContent>
     </Select>

diff --git a/packages/react/src/components/layout/InlayContainer.tsx b/packages/react/src/components/layout/InlayContainer.tsx
@@ -10,10 +10,10 @@ interface InlayContainerProps {
 export function InlayContainer({ children }: InlayContainerProps) {
   return (
     <div className="flex justify-center gap-4 p-4 md:p-8">
-      <div className="bg-base-3 flex h-fit w-80 shrink-0 flex-col gap-2 rounded-lg px-2 py-4">
+      <div className="flex h-fit w-80 shrink-0 flex-col gap-2 rounded-lg bg-base-3 px-2 py-4">
         {children}
       </div>
-      <div className="bg-base-3 w-full max-w-screen-lg rounded-lg p-2 md:p-4">
+      <div className="w-full max-w-screen-lg rounded-lg bg-base-3 p-2 md:p-4">
         <Suspense fallback={<Loading size="xl" />}>
           <Outlet />
         </Suspense>
@@ -36,9 +36,9 @@ export function InlayContainerTabItem({
   label,
   href,
 }: InlayContainerTabItemProps) {
-	const location = useLocation();
+  const location = useLocation();
 
-	return (
+  return (
     <Button
       asChild
       className="justify-start"

diff --git a/packages/react/src/components/video/VideoCard.tsx b/packages/react/src/components/video/VideoCard.tsx
@@ -110,12 +110,12 @@ export function VideoCard({
               </div>
               <Link
                 to={`/channel/${channel?.id}`}
-                className="text-base-11 hover:text-base-12 line-clamp-1 text-xs md:text-sm"
+                className="line-clamp-1 text-xs text-base-11 hover:text-base-12 md:text-sm"
               >
                 {channel?.name}
               </Link>
               {status === "live" && (
-                <div className="text-base-11 flex gap-1 text-xs md:text-sm">
+                <div className="flex gap-1 text-xs text-base-11 md:text-sm">
                   <span className="text-red-500">
                     {t("component.videoCard.liveNow")}
                   </span>
@@ -134,15 +134,15 @@ export function VideoCard({
               {(type === "placeholder" || status === "upcoming") &&
                 status !== "live" &&
                 start_scheduled && (
-                  <span className="text-base-11 line-clamp-1 text-xs md:text-sm">
+                  <span className="line-clamp-1 text-xs text-base-11 md:text-sm">
                     {t("time.diff_future_date", {
                       0: dayjs(start_scheduled).fromNow(false),
                       1: dayjs(start_scheduled).format("hh:mm A"),
                     })}
                   </span>
                 )}
               {status === "past" && available_at && (
-                <span className="text-base-11 line-clamp-1 text-xs md:text-sm">
+                <span className="line-clamp-1 text-xs text-base-11 md:text-sm">
                   {t("time.distance_past_date", {
                     0: dayjs(available_at).fromNow(false),
                   })}
@@ -239,14 +239,14 @@ export function VideoCard({
                         : undefined
                     }
                   >
-                    <div className="text-base-11 hover:text-base-12 line-clamp-1 text-xs md:text-sm">
+                    <div className="line-clamp-1 text-xs text-base-11 hover:text-base-12 md:text-sm">
                       {channel.name}
                     </div>
                   </Link>
                 )}
                 <div className="flex text-xs md:text-sm">
                   {status === "live" && (
-                    <div className="text-base-11 flex gap-1">
+                    <div className="flex gap-1 text-base-11">
                       <span className="text-red-500">
                         {t("component.videoCard.liveNow")}
                       </span>

diff --git a/packages/react/src/routes/about/changelog.tsx b/packages/react/src/routes/about/changelog.tsx
@@ -1,9 +1,8 @@
-
 export default function AboutChangelog() {
-	return (
-      <iframe
-        className="min-h-[70vh] w-full"
-        src="https://holodexnet.github.io/Holodex/CHANGELOG.html"
-      />
+  return (
+    <iframe
+      className="min-h-[70vh] w-full"
+      src="https://holodexnet.github.io/Holodex/CHANGELOG.html"
+    />
   );
-}
+}
diff --git a/packages/react/src/routes/about/general.tsx b/packages/react/src/routes/about/general.tsx
@@ -7,68 +7,59 @@ import { useTranslation } from "react-i18next";
 export default function AboutGeneral() {
   const { t } = useTranslation();
 
-  const quickLinks: QuickLinkProps[] = useMemo(() =>([
-    {
-      className: "border-blue-11 text-blue-11",
-      href: "https://twitter.com/holodex",
-      icon: "i-lucide:twitter",
-      label: t("about.quicklink.twitter"),
-    },
-    {
-      className: "border-blue-500 text-blue-500",
-      href: "https://ko-fi.com/holodex",
-      icon: "i-cib:ko-fi",
-      label: t("about.quicklink.ko-fi"),
-    },
-    {
-      className: "border-secondary-11 text-secondary-11",
-      href: "https://github.com/HolodexNet/Holodex",
-      icon: "i-lucide:github",
-      label: t("about.quicklink.github"),
-    },
-    {
-      className: "border-orange-10 text-orange-10",
-      href: "https://docs.holodex.net/docs/holodex/f4e6fa31af431-getting-started",
-      icon: "i-lucide:file-code",
-      label: t("about.quicklink.apiDocs"),
-    },
-    {
-      className: "border-violet-10 text-violet-10",
-      href: "https://discord.gg/A24AbzgvRJ",
-      icon: "i-carbon:logo-discord",
-      label: t("about.discordBtn"),
-    },
-  ]), [t]);
+  const quickLinks: QuickLinkProps[] = useMemo(
+    () => [
+      {
+        className: "border-blue-11 text-blue-11",
+        href: "https://twitter.com/holodex",
+        icon: "i-lucide:twitter",
+        label: t("about.quicklink.twitter"),
+      },
+      {
+        className: "border-blue-500 text-blue-500",
+        href: "https://ko-fi.com/holodex",
+        icon: "i-cib:ko-fi",
+        label: t("about.quicklink.ko-fi"),
+      },
+      {
+        className: "border-secondary-11 text-secondary-11",
+        href: "https://github.com/HolodexNet/Holodex",
+        icon: "i-lucide:github",
+        label: t("about.quicklink.github"),
+      },
+      {
+        className: "border-orange-10 text-orange-10",
+        href: "https://docs.holodex.net/docs/holodex/f4e6fa31af431-getting-started",
+        icon: "i-lucide:file-code",
+        label: t("about.quicklink.apiDocs"),
+      },
+      {
+        className: "border-violet-10 text-violet-10",
+        href: "https://discord.gg/A24AbzgvRJ",
+        icon: "i-carbon:logo-discord",
+        label: t("about.discordBtn"),
+      },
+    ],
+    [t],
+  );
 
   return (
     <article className="w-full">
       <AboutHeading>{t("about.general.summary.title")}</AboutHeading>
-      <AboutDescription>
-        {t("about.general.summary.0")}
-      </AboutDescription>
-      <AboutDescription>
-        {t("about.general.summary.1")}
-      </AboutDescription>
-      <AboutDescription>
-        {t("about.general.summary.2")}
-      </AboutDescription>
+      <AboutDescription>{t("about.general.summary.0")}</AboutDescription>
+      <AboutDescription>{t("about.general.summary.1")}</AboutDescription>
+      <AboutDescription>{t("about.general.summary.2")}</AboutDescription>
       <AboutHeading>{t("about.credits.title")}</AboutHeading>
-      <AboutDescription>
-        {t("about.general.credits.0")}
-      </AboutDescription>
-      <AboutDescription>
-        {t("about.general.credits.1")}
-      </AboutDescription>
+      <AboutDescription>{t("about.general.credits.0")}</AboutDescription>
+      <AboutDescription>{t("about.general.credits.1")}</AboutDescription>
       <ul className="list-inside list-disc pt-1">
         <li>RiceCakes (creator, admin)</li>
         <li>Xrave (admin)</li>
         <li>Uetchy (dev, designer)</li>
         <li>MadeT (designer)</li>
         <li>NeloBlivion (twitch support, editor)</li>
         <li className="opacity-60">
-          <small>
-            {t("about.general.credits.addRequest")}
-          </small>
+          <small>{t("about.general.credits.addRequest")}</small>
         </li>
       </ul>
       <AboutHeading>{t("about.quicklinks")}</AboutHeading>

diff --git a/packages/react/src/routes/about/privacy.tsx b/packages/react/src/routes/about/privacy.tsx
@@ -18,27 +18,15 @@ export default function Privacy() {
         })}
       </AboutDescription>
       <AboutHeading>{t("about.privacy.heading.1")}</AboutHeading>
-      <AboutDescription>
-        {t("about.privacy.text.1-1")}
-      </AboutDescription>
-      <AboutDescription>
-        {t("about.privacy.text.1-2")}
-      </AboutDescription>
+      <AboutDescription>{t("about.privacy.text.1-1")}</AboutDescription>
+      <AboutDescription>{t("about.privacy.text.1-2")}</AboutDescription>
       <AboutHeading>{t("about.privacy.heading.2")}</AboutHeading>
-      <AboutDescription>
-        {t("about.privacy.text.2-1")}
-      </AboutDescription>
-      <AboutDescription>
-        {t("about.privacy.text.2-2")}
-      </AboutDescription>
+      <AboutDescription>{t("about.privacy.text.2-1")}</AboutDescription>
+      <AboutDescription>{t("about.privacy.text.2-2")}</AboutDescription>
       <AboutHeading>{t("about.privacy.heading.3")}</AboutHeading>
-      <AboutDescription>
-        {t("about.privacy.text.3-1")}
-      </AboutDescription>
+      <AboutDescription>{t("about.privacy.text.3-1")}</AboutDescription>
       <AboutHeading>{t("about.privacy.heading.4")}</AboutHeading>
-      <AboutDescription>
-        {t("about.privacy.text.4-1")}
-      </AboutDescription>
+      <AboutDescription>{t("about.privacy.text.4-1")}</AboutDescription>
       <AboutHeading>{t("about.privacy.heading.5")}</AboutHeading>
       <AboutDescription>
         {t("about.privacy.text.5-1")}{" "}

diff --git a/packages/react/src/routes/about/request.tsx b/packages/react/src/routes/about/request.tsx
@@ -15,7 +15,7 @@ export default function AboutRequest() {
 
   return (
     <div className="flex flex-col gap-2">
-			<AboutHeading>{t('channelRequest.RequestType')}</AboutHeading>
+      <AboutHeading>{t("channelRequest.RequestType")}</AboutHeading>
       <RadioGroup className="flex flex-col gap-2" onValueChange={setType}>
         <RadioGroupItem value="addVtuber" className="sr-only" id="addVtuber" />
         <Label htmlFor="addVtuber">
@@ -46,10 +46,10 @@ export default function AboutRequest() {
           </RequestTypeRadioButton>
         </Label>
       </RadioGroup>
-			{type === 'addVtuber' && <AddVtuberForm />}
-			{type === 'addSubber' && <AddSubberForm />}
-			{type === 'modifyInfo' && <ModifyInfoForm />}
-			{type === 'delete' && <DeleteChannelForm />}
+      {type === "addVtuber" && <AddVtuberForm />}
+      {type === "addSubber" && <AddSubberForm />}
+      {type === "modifyInfo" && <ModifyInfoForm />}
+      {type === "delete" && <DeleteChannelForm />}
     </div>
   );
 }