Fix for typings in MultiSelection (#1)

opendatahub-io · Jul 12, 2024 · 733b07f · 733b07f
1 parent df085b2
commit 733b07f
Show file tree

Hide file tree

Showing 3 changed files with 25 additions and 18 deletions.
diff --git a/frontend/src/components/MultiSelection.tsx b/frontend/src/components/MultiSelection.tsx
@@ -15,7 +15,12 @@ import {
   HelperTextItem,
 } from '@patternfly/react-core';
 import { TimesIcon } from '@patternfly/react-icons/dist/esm/icons/times-icon';
-import { SelectionOptions } from '~/pages/groupSettings/groupTypes';
+
+export type SelectionOptions = {
+  id: number | string;
+  name: string;
+  selected?: boolean;
+};
 
 type MultiSelectionProps = {
   value: SelectionOptions[];

diff --git a/frontend/src/pages/groupSettings/GroupSettings.tsx b/frontend/src/pages/groupSettings/GroupSettings.tsx
@@ -11,9 +11,9 @@ import {
 import ApplicationsPage from '~/pages/ApplicationsPage';
 import { isGroupEmpty } from '~/utilities/utils';
 import SettingSection from '~/components/SettingSection';
-import { MultiSelection } from '~/components/MultiSelection';
+import { MultiSelection, SelectionOptions } from '~/components/MultiSelection';
 import { useWatchGroups } from '~/utilities/useWatchGroups';
-import { GroupsConfigField, MenuItemStatus } from './groupTypes';
+import { GroupsConfigField } from './groupTypes';
 
 const GroupSettings: React.FC = () => {
   const {
@@ -37,13 +37,27 @@ const GroupSettings: React.FC = () => {
     updateGroups(groupSettings);
   };
 
-  const handleMenuItemSelection = (newState: MenuItemStatus[], field: GroupsConfigField) => {
+  const handleMenuItemSelection = (newState: SelectionOptions[], field: GroupsConfigField) => {
     switch (field) {
       case GroupsConfigField.ADMIN:
-        setGroupSettings({ ...groupSettings, adminGroups: newState });
+        setGroupSettings({
+          ...groupSettings,
+          adminGroups: newState.map((opt) => ({
+            id: Number(opt.id),
+            name: opt.name,
+            enabled: opt.selected || false,
+          })),
+        });
         break;
       case GroupsConfigField.USER:
-        setGroupSettings({ ...groupSettings, allowedGroups: newState });
+        setGroupSettings({
+          ...groupSettings,
+          allowedGroups: newState.map((opt) => ({
+            id: Number(opt.id),
+            name: opt.name,
+            enabled: opt.selected || false,
+          })),
+        });
         break;
     }
     setIsGroupSettingsChanged(true);

diff --git a/frontend/src/pages/groupSettings/groupTypes.ts b/frontend/src/pages/groupSettings/groupTypes.ts
@@ -15,15 +15,3 @@ export type GroupStatus = {
   name: string;
   enabled: boolean;
 };
-
-export type MenuItemStatus = {
-  id: number;
-  name: string;
-  enabled: boolean;
-};
-
-export type SelectionOptions = {
-  id: number | string;
-  name: string;
-  selected?: boolean;
-};