fix(server): resolved failing to use dynamic secret due to superuser

frontend/src/components/v2/Card/Card.tsx

@@ -1,4 +1,4 @@
-import { forwardRef, ReactNode } from "react";
+import { CSSProperties, forwardRef, ReactNode } from "react";
 import { twMerge } from "tailwind-merge";
 
 export type CardTitleProps = {
@@ -31,10 +31,13 @@ export const CardFooter = ({ children, className }: CardFooterProps) => (
 export type CardBodyProps = {
   children: ReactNode;
   className?: string;
+  style?: CSSProperties;
 };
 
-export const CardBody = ({ children, className }: CardBodyProps) => (
-  <div className={twMerge("px-6 pb-6 pt-0", className)}>{children}</div>
+export const CardBody = ({ children, className, style }: CardBodyProps) => (
+  <div className={twMerge("px-6 pb-6 pt-0", className)} style={style}>
+    {children}
+  </div>
 );
 
 export type CardProps = {
@@ -44,10 +47,14 @@ export type CardProps = {
   isRounded?: boolean;
   isPlain?: boolean;
   isHoverable?: boolean;
+  style?: CSSProperties;
 };
 
 export const Card = forwardRef<HTMLDivElement, CardProps>(
-  ({ children, isFullHeight, isRounded, isHoverable, isPlain, className }, ref): JSX.Element => {
+  (
+    { children, isFullHeight, isRounded, isHoverable, isPlain, className, style },
+    ref
+  ): JSX.Element => {
     return (
       <div
         ref={ref}
@@ -59,6 +66,7 @@ export const Card = forwardRef<HTMLDivElement, CardProps>(
           isHoverable && "hover:shadow-xl",
           className
         )}
+        style={style}
       >
         {children}
       </div>