Add risk assessment tab

Signed-off-by: Bryan Frimin <bryan@getprobo.com>
Signed-off-by: Sacha Al Himdani <sacha@getprobo.com>

packages/ui/src/Atoms/Button/Button.tsx

@@ -9,7 +9,7 @@ import { tv, type VariantProps } from "tailwind-variants";
 import { Slot } from "../Slot";
 
 export const button = tv({
-    base: "flex items-center justify-center gap-[6px] px-3 py-2 rounded-full cursor-pointer text-sm font-medium h-8 focus:outline-none",
+    base: "flex items-center justify-center gap-[6px] px-3 py-2 rounded-full cursor-pointer text-sm font-medium h-8 focus:outline-none whitespace-nowrap",
     variants: {
         variant: {
             primary:

packages/ui/src/Atoms/Dropzone/Dropzone.tsx

@@ -80,8 +80,6 @@ export function Dropzone(props: Props) {
         hasError: !!error,
     });
 
-    console.log(error);
-
     return (
         <div {...getRootProps()} className={wrapper()}>
             <div className={zone()}>

packages/ui/src/Atoms/Select/Select.tsx

@@ -15,16 +15,17 @@ import { IconChevronGrabberVertical } from "../Icons/IconChevronGrabberVertical.
 import { tv } from "tailwind-variants";
 import { Children, type ComponentProps, type PropsWithChildren } from "react";
 
-type Props = PropsWithChildren<
+type Props<T> = PropsWithChildren<
     {
         id?: string;
         placeholder?: string;
-        onValueChange?: (s: string) => void;
+        onValueChange?: (s: NonNullable<T>) => void;
         variant?: "default" | "editor" | "dashed";
         invalid?: boolean;
         disabled?: boolean;
         className?: string;
-    } & Omit<ComponentProps<typeof Root>, "onChange">
+        value?: T;
+    } & Omit<ComponentProps<typeof Root>, "onChange" | "value">
 >;
 
 const select = tv({
@@ -70,19 +71,19 @@ const select = tv({
     },
 });
 
-export function Select({
+export function Select<T>({
     placeholder,
     children,
     onValueChange,
     value,
     ...props
-}: Props) {
+}: Props<T>) {
     const { trigger, content, icon } = select({
         ...props,
     });
 
     return (
-        <Root onValueChange={onValueChange} value={value}>
+        <Root onValueChange={onValueChange} value={value as string}>
             <Trigger
                 {...props}
                 className={trigger({ className: props.className })}
@@ -122,7 +123,7 @@ export function Option({ children, ...props }: ComponentProps<typeof Item>) {
         <Item
             {...props}
             className={
-                "flex gap-2 items-center h-8 text-sm font-medium text-txt-primary hover:bg-tertiary-hover active:bg-tertiary-pressed cursor-pointer px-[10px]"
+                "flex gap-2 items-center min-h-8 py-1 text-sm font-medium text-txt-primary hover:bg-tertiary-hover active:bg-tertiary-pressed cursor-pointer px-[10px] text-start"
             }
         >
             <ItemText asChild>

packages/ui/src/Atoms/Table/Table.tsx

@@ -1,4 +1,9 @@
-import { createContext, useContext, type PropsWithChildren } from "react";
+import {
+    createContext,
+    useContext,
+    type HTMLAttributes,
+    type PropsWithChildren,
+} from "react";
 import { Card } from "../Card/Card";
 import { Link } from "react-router";
 import clsx from "clsx";
@@ -25,9 +30,13 @@ export function Thead({ children }: PropsWithChildren) {
 export function Th({
     children,
     className,
-}: PropsWithChildren<{ className?: string }>) {
+    width,
+}: PropsWithChildren<{ className?: string; width?: number }>) {
     return (
-        <th className={clsx("first:pl-6 last:pr-6 py-3", className)}>
+        <th
+            className={clsx("first:pl-6 last:pr-6 py-3", className)}
+            style={{ width }}
+        >
             {children}
         </th>
     );
@@ -35,17 +44,21 @@ export function Th({
 
 const TrContext = createContext({} as { to?: string });
 
-export function Tr({ children, to }: PropsWithChildren<{ to?: string }>) {
+export function Tr({
+    to,
+    className,
+    ...props
+}: { to?: string } & HTMLAttributes<HTMLTableRowElement>) {
     return (
         <TrContext value={{ to }}>
             <tr
+                {...props}
                 className={clsx(
                     "border-border-low border-y first:border-none last:border-none",
-                    to && "hover:bg-subtle",
+                    (to || props.onClick) && "hover:bg-subtle",
+                    className,
                 )}
-            >
-                {children}
-            </tr>
+            />
         </TrContext>
     );
 }
@@ -63,15 +76,17 @@ export function Td({
     noLink,
     className,
     width,
-}: PropsWithChildren<{
+    ...props
+}: {
     noLink?: boolean;
-    className?: string;
     width?: number;
-}>) {
+    colSpan?: number;
+} & HTMLAttributes<HTMLTableCellElement>) {
     const { to } = useContext(TrContext);
     if (!to || noLink) {
         return (
             <td
+                {...props}
                 width={width}
                 className={clsx("first:pl-6 last:pr-6 py-3", className)}
             >
@@ -81,6 +96,7 @@ export function Td({
     }
     return (
         <td
+            {...props}
             width={width}
             className={clsx(
                 "first:*:pl-6 *:block last:*:pr-6 *:py-3",