Shared: Selector: Fix types

packages/shared/components/access-right-select/AccessRightSelect.types.ts

@@ -46,7 +46,7 @@ type PropsFromCombobox = Pick<
   | "withBlur"
 >;
 
-export interface AccessRightSelectProps extends PropsFromCombobox {
+export type AccessRightSelectProps = PropsFromCombobox & {
   /** List of access options */
   accessOptions: ComboboxProps["options"];
-}
+};

packages/shared/components/selector/Selector.types.ts

@@ -223,29 +223,32 @@ export type TAccessRight = {
   access: string | number;
 };
 
-export type TSelectorAccessRights =
-  | {
-      withAccessRights: true;
-      accessRights: TAccessRight[];
-      selectedAccessRight: TAccessRight | null;
-      onAccessRightsChange: (access: TAccessRight) => void;
-      accessRightsMode?: SelectorAccessRightsMode;
-    }
-  | {
-      withAccessRights?: undefined;
-      accessRights?: undefined;
-      selectedAccessRight?: undefined;
-      onAccessRightsChange?: undefined;
-      accessRightsMode?: undefined;
-    };
-
-export interface AccessSelectorProps {
-  onAccessRightsChange: (access: TAccessRight) => void;
+type TWithAccessRightsProps = {
+  withAccessRights: true;
   accessRights: TAccessRight[];
-  selectedOption: TAccessRight | null;
-  footerRef: React.RefObject<HTMLDivElement>;
+  selectedAccessRight: TAccessRight | null;
+  onAccessRightsChange: (access: TAccessRight) => void;
   accessRightsMode?: SelectorAccessRightsMode;
-}
+};
+
+type TWithoutAccessRightsProps = {
+  withAccessRights?: undefined;
+  accessRights?: undefined;
+  selectedAccessRight?: undefined;
+  onAccessRightsChange?: undefined;
+  accessRightsMode?: undefined;
+};
+
+export type TSelectorAccessRights =
+  | TWithAccessRightsProps
+  | TWithoutAccessRightsProps;
+
+export type AccessSelectorProps = Omit<
+  TWithAccessRightsProps,
+  "withAccessRights"
+> & {
+  footerRef: React.RefObject<HTMLDivElement>;
+};
 
 // footer input
 

packages/shared/components/selector/sub-components/AccessSelector.tsx

@@ -12,7 +12,7 @@ const AccessSelector = (props: AccessSelectorProps) => {
   const {
     onAccessRightsChange,
     accessRights,
-    selectedOption,
+    selectedAccessRight,
     footerRef,
     accessRightsMode = SelectorAccessRightsMode.Compact,
   } = props;
@@ -38,7 +38,7 @@ const AccessSelector = (props: AccessSelectorProps) => {
       size={ComboBoxSize.content}
       scaled={false}
       manualWidth="fit-content"
-      selectedOption={selectedOption as TOption}
+      selectedOption={selectedAccessRight as TOption}
       showDisabledItems
       directionX="right"
       directionY="top"
@@ -47,7 +47,7 @@ const AccessSelector = (props: AccessSelectorProps) => {
   ) : (
     <StyledAccessSelector
       className=""
-      selectedOption={selectedOption as TOption}
+      selectedOption={selectedAccessRight as TOption}
       onSelect={onSelect}
       accessOptions={accessRights as TOption[]}
       size={ComboBoxSize.content}

packages/shared/components/selector/sub-components/Footer.tsx

@@ -151,7 +151,7 @@ const Footer = React.memo(
           {withAccessRights && (
             <AccessSelector
               accessRights={accessRights}
-              selectedOption={selectedAccessRight}
+              selectedAccessRight={selectedAccessRight}
               onAccessRightsChange={onAccessRightsChange}
               footerRef={ref}
               accessRightsMode={accessRightsMode}