B2B-36: add personal dashboard (#20)

* B2B-36: add dashboard cards

* B2B-36: add dashboard cards

* card variants, some improvements, gen db types

* add menus to home page

* update db types

* remove unnecessary card variant

---------

Co-authored-by: Helena <helena@Helenas-MacBook-Pro.local>

packages/ui/src/shadcn/card.tsx

@@ -1,15 +1,31 @@
 import * as React from 'react';
 
-import { cn } from '../lib/utils';
+import { VariantProps, cva } from 'class-variance-authority';
+import { cn } from '.';
 
-const Card: React.FC<React.HTMLAttributes<HTMLDivElement>> = ({
-  className,
-  ...props
-}) => (
-  <div
-    className={cn('bg-card text-card-foreground rounded-xl border', className)}
-    {...props}
-  />
+const cardVariants = cva('text-card-foreground rounded-xl border', {
+  variants: {
+    variant: {
+      default: 'bg-card',
+      'gradient-warning':
+        'from-warning/30 via-warning/10 to-background bg-gradient-to-t',
+      'gradient-destructive':
+        'from-destructive/30 via-destructive/10 to-background bg-gradient-to-t',
+      'gradient-success':
+        'from-success/30 via-success/10 to-background bg-gradient-to-t',
+    },
+  },
+  defaultVariants: {
+    variant: 'default',
+  },
+});
+
+export interface CardProps
+  extends React.HTMLAttributes<HTMLDivElement>,
+    VariantProps<typeof cardVariants> {}
+
+const Card: React.FC<CardProps> = ({ className, variant, ...props }) => (
+  <div className={cn(cardVariants({ variant, className }))} {...props} />
 );
 Card.displayName = 'Card';