fix: the tabs height

keephq · Oct 14, 2024 · 7ef3a6f · 7ef3a6f
1 parent 4e08816
commit 7ef3a6f
Show file tree

Hide file tree

Showing 5 changed files with 262 additions and 230 deletions.
diff --git a/keep-ui/app/loading.tsx b/keep-ui/app/loading.tsx
@@ -1,22 +1,27 @@
 import { Subtitle, Title } from "@tremor/react";
 import Image from "next/image";
+import { clsx } from "clsx";
 
 export default function Loading({
   includeMinHeight = true,
   slowLoading = false,
   loadingText = "Just a second, getting your data 🚨",
-  extraLoadingText = ""
+  extraLoadingText = "",
+  className,
 }: {
   includeMinHeight?: boolean;
   slowLoading?: boolean;
   loadingText?: string;
   extraLoadingText?: string;
-}) { 
+  className?: string;
+}) {
   return (
     <main
-      className={`flex flex-col items-center justify-center ${
-        includeMinHeight ? "min-h-screen-minus-200" : ""
-      }`}
+      className={clsx(
+        "flex flex-col items-center justify-center",
+        includeMinHeight && "min-h-screen-minus-200",
+        className
+      )}
     >
       <Image
         className="animate-bounce"
@@ -26,11 +31,9 @@ export default function Loading({
         height={200}
       />
       <Title>{loadingText}</Title>
-
-      {extraLoadingText && (
-        <Subtitle>{extraLoadingText}</Subtitle>
-      )}
-
+
+      {extraLoadingText && <Subtitle>{extraLoadingText}</Subtitle>}
+
       {slowLoading && (
         <Subtitle>
           This is taking a bit longer then usual, please wait...