From 89459feed65821aca0a86a69b68315880f4c4951 Mon Sep 17 00:00:00 2001
From: Louis Chan <louischan@oursky.com>
Date: Tue, 10 Dec 2024 12:40:17 +0800
Subject: [PATCH] Fix type error in mergeStyles.ts

---
 portal/src/util/mergeStyles.ts | 24 +++++++++++++-----------
 1 file changed, 13 insertions(+), 11 deletions(-)

diff --git a/portal/src/util/mergeStyles.ts b/portal/src/util/mergeStyles.ts
index c1106d73b0..11fe1b0885 100644
--- a/portal/src/util/mergeStyles.ts
+++ b/portal/src/util/mergeStyles.ts
@@ -1,30 +1,32 @@
 import { useCallback, useMemo } from "react";
-import { IStyleFunctionOrObject, IStyleSet } from "@fluentui/react";
+import { IStyleFunctionOrObject } from "@fluentui/react";
 import {
   concatStyleSetsWithProps,
   concatStyleSets,
   IConcatenatedStyleSet,
+  IStyleSetBase,
 } from "@fluentui/merge-styles";
 
-export function useMergedStyles<TStylesProps, IStyleSet>(
-  ...styless: (IStyleFunctionOrObject<TStylesProps, IStyleSet> | undefined)[]
-): IStyleFunctionOrObject<TStylesProps, IStyleSet> {
+export function useMergedStyles<TStylesProps, TStyleSet extends IStyleSetBase>(
+  ...styless: (IStyleFunctionOrObject<TStylesProps, TStyleSet> | undefined)[]
+): (
+  props: TStylesProps
+) => ReturnType<typeof concatStyleSetsWithProps<TStylesProps, TStyleSet>> {
   return useCallback(
     (props) => {
       return concatStyleSetsWithProps(props, ...styless);
     },
-    // eslint-disable-next-line
+    // eslint-disable-next-line react-hooks/exhaustive-deps
     [...styless]
   );
 }
 
-export function useMergedStylesPlain(
-  // eslint-disable-next-line @typescript-eslint/no-redundant-type-constituents
-  ...styless: (IStyleSet | undefined)[]
-): IConcatenatedStyleSet<IStyleSet> {
+export function useMergedStylesPlain<TStyleSet extends IStyleSetBase>(
+  ...styless: (TStyleSet | undefined)[]
+): IConcatenatedStyleSet<TStyleSet> {
   return useMemo(
     () => concatStyleSets(...styless),
-    // eslint-disable-next-line
+    // eslint-disable-next-line react-hooks/exhaustive-deps
     [...styless]
-  ) as IConcatenatedStyleSet<IStyleSet>;
+  ) as IConcatenatedStyleSet<TStyleSet>;
 }