Fix @probo/ui lint

Signed-off-by: Émile Ré <nemile.re@gmail.com>

packages/ui/src/Atoms/Badge/Badge.tsx

@@ -40,6 +40,6 @@ const badge = tv({
 
 export function Badge(props: Props) {
     const Component = props.asChild ? Slot : "div";
-    const { asChild, size, variant, ...restProps } = props;
-    return <Component {...restProps} className={badge(props)} />;
+    const { size, variant, ...restProps } = props;
+    return <Component {...restProps} className={badge({ size, variant })} />;
 }

packages/ui/src/Atoms/InfiniteScrollTrigger/InfiniteScrollTrigger.tsx

@@ -18,7 +18,7 @@ export function InfiniteScrollTrigger({ children, onView, loading }: Props) {
     const onViewRef = useRefSync(onView);
     useEffect(() => {
         if (inView && !loading) onViewRef.current();
-    }, [inView, loading]);
+    }, [inView, loading, onViewRef]);
 
     return (
         <div

packages/ui/src/Atoms/Input/Input.tsx

@@ -34,8 +34,9 @@ export function Input({
     onValueChange,
     ...props
 }: Props) {
+    const [focus, setFocus] = useState(false);
+
     if (IconComponent) {
-        const [focus, setFocus] = useState(false);
         return (
             <div
                 className={input({

packages/ui/src/Atoms/Textarea/Textarea.tsx

@@ -3,6 +3,7 @@ import {
     type TextareaHTMLAttributes,
     type RefCallback,
     useLayoutEffect,
+    useCallback,
 } from "react";
 import { input } from "../Input/Input";
 import clsx from "clsx";
@@ -17,16 +18,16 @@ export function Textarea(props: Props) {
     const ref = useRef<HTMLTextAreaElement>(null);
     const { autogrow, ref: propsRef, ...restProps } = props;
 
-    const adjustHeight = () => {
+    const adjustHeight = useCallback(() => {
         if (!autogrow || !ref.current) return;
         ref.current.style.height = "inherit";
         const paddingY = 2;
         ref.current.style.height = `${ref.current.scrollHeight + paddingY * 2}px`;
-    };
+    }, [autogrow, ref]);
 
     useLayoutEffect(() => {
         adjustHeight();
-    }, []);
+    }, [adjustHeight]);
 
     return (
         <textarea

packages/ui/src/Atoms/Toasts/Toasts.stories.tsx

@@ -11,7 +11,7 @@ export default {
 type Story = StoryObj<typeof Toasts>;
 
 export const Default: Story = {
-    render() {
+    render: function Render() {
         const { toast } = useToast();
         return (
             <>

packages/ui/src/Layouts/Layout.tsx

@@ -78,7 +78,7 @@ export function Drawer({
         return () => {
             setDrawer(false);
         };
-    }, []);
+    }, [setDrawer]);
     return createPortal(
         <aside
             className={clsx(

packages/ui/src/Molecules/Combobox/Combobox.stories.tsx

@@ -12,7 +12,7 @@ export default {
 type Story = StoryObj<typeof Combobox>;
 
 export const Default: Story = {
-    render: () => {
+    render: function Render() {
         const [items, setItems] = useState(["a", "b", "c"] as string[]);
         const onSearch = (query: string) => {
             setItems(times(10, (i) => `${query} ${i}`));

packages/ui/src/Molecules/Dialog/ConfirmDialog.tsx

@@ -59,7 +59,7 @@ export function useConfirm() {
                 label: props.label ?? __("Delete"),
             });
         },
-        [open],
+        [open, __],
     );
 }
 

packages/ui/src/Molecules/DurationPicker/DurationPicker.stories.tsx

@@ -11,7 +11,7 @@ export default {
 type Story = StoryObj<typeof DurationPicker>;
 
 export const Default: Story = {
-    render() {
+    render: function Render() {
         const [value, setValue] = useState<string | null>("PT1H");
         return <DurationPicker value={value} onValueChange={setValue} />;
     },

packages/ui/src/Molecules/MeasureImplementation/MeasureImplementation.stories.tsx

@@ -10,21 +10,23 @@ export default {
 
 type Story = StoryObj<typeof MeasureImplementation>;
 
+type MeasureState = "IMPLEMENTED" | "IN_PROGRESS" | "NOT_APPLICABLE" | "NOT_STARTED";
+
 export const Default: Story = {
     args: {
         measures: [
             ...times(15, () => ({
-                state: "IMPLEMENTED",
+                state: "IMPLEMENTED" as MeasureState,
             })),
             ...times(10, () => ({
-                state: "IN_PROGRESS",
+                state: "IN_PROGRESS" as MeasureState,
             })),
             ...times(5, () => ({
-                state: "NOT_APPLICABLE",
+                state: "NOT_APPLICABLE" as MeasureState,
             })),
             ...times(5, () => ({
-                state: "NOT_STARTED",
+                state: "NOT_STARTED" as MeasureState,
             })),
-        ] as any,
+        ],
     },
 };

packages/ui/src/Molecules/Risks/RisksChart.tsx

@@ -59,7 +59,7 @@ export function RisksChart({ organizationId, type, risks }: Props) {
         return groupBy(risks ?? [], (risk) =>
             cellKey(risk[impactField], risk[likelihoodField]),
         );
-    }, [organizationId, risks]);
+    }, [impactField, likelihoodField, risks]);
 
     return (
         <Card padded className="text-txt-primary">

packages/ui/src/Molecules/Table/DataTable.stories.tsx

@@ -19,7 +19,7 @@ export default {
 type Story = StoryObj<Component>;
 
 export const Default: Story = {
-    render: ({ onUpdate }) => {
+    render: function Render({ onUpdate }) {
         const [state, setState] = useState({
             name: "John",
             status: "delivered",