fix formatting

src/groups/GroupsCreateModal.tsx

@@ -1,4 +1,4 @@
-import React, {useContext} from "react";
+import React, { useContext } from "react";
 import {
   AlertVariant,
   Button,
@@ -6,7 +6,7 @@ import {
   FormGroup,
   Modal,
   ModalVariant,
-  TextInput
+  TextInput,
 } from "@patternfly/react-core";
 import { useTranslation } from "react-i18next";
 import { HttpClientContext } from "../http-service/HttpClientContext";
@@ -22,8 +22,13 @@ type GroupsCreateModalProps = {
   setCreateGroupName: (createGroupName: string) => void;
 };
 
-export const GroupsCreateModal = ({handleModalToggle, isCreateModalOpen, setIsCreateModalOpen, createGroupName, setCreateGroupName}: GroupsCreateModalProps) => {
+export const GroupsCreateModal = ({
-  
+  handleModalToggle,
+  isCreateModalOpen,
+  setIsCreateModalOpen,
+  createGroupName,
+  setCreateGroupName,
+}: GroupsCreateModalProps) => {
   const { t } = useTranslation("groups");
   const httpClient = useContext(HttpClientContext)!;
   const { realm } = useContext(RealmContext);
@@ -32,19 +37,21 @@ export const GroupsCreateModal = ({handleModalToggle, isCreateModalOpen, setIsCr
   const { register, errors } = form;
 
   const valueChange = (createGroupName: string) => {
-    setCreateGroupName(createGroupName)
+    setCreateGroupName(createGroupName);
-  }
+  };
 
   const submitForm = async () => {
     try {
-      await httpClient.doPost(`/admin/realms/${realm}/groups`, {name: createGroupName});
+      await httpClient.doPost(`/admin/realms/${realm}/groups`, {
+        name: createGroupName,
+      });
       setIsCreateModalOpen(false);
       setCreateGroupName("");
       add(t("groupCreated"), AlertVariant.success);
     } catch (error) {
       add(`${t("couldNotCreateGroup")} ': '${error}'`, AlertVariant.danger);
     }
-  }
+  };
 
   return (
     <React.Fragment>
@@ -57,7 +64,7 @@ export const GroupsCreateModal = ({handleModalToggle, isCreateModalOpen, setIsCr
         actions={[
           <Button key="confirm" variant="primary" onClick={() => submitForm()}>
             {t("create")}
-          </Button>
+          </Button>,
         ]}
       >
         <Form isHorizontal>

src/groups/GroupsList.tsx

@@ -5,10 +5,7 @@ import {
   TableBody,
   TableVariant,
 } from "@patternfly/react-table";
-import { 
+import { Button, AlertVariant } from "@patternfly/react-core";
-  Button,
-  AlertVariant
-} from "@patternfly/react-core";
 import { useTranslation } from "react-i18next";
 import { GroupRepresentation } from "./models/groups";
 import { UsersIcon } from "@patternfly/react-icons";
@@ -31,7 +28,6 @@ export const GroupsList = ({ list }: GroupsListProps) => {
     { cells: [<Button key="0">Test</Button>], selected: false },
   ]);
 
-
   const formatData = (data: GroupRepresentation[]) =>
     data.map((group: { [key: string]: any }, index) => {
       const groupName = group[columnGroupName];
@@ -81,21 +77,21 @@ export const GroupsList = ({ list }: GroupsListProps) => {
     {
       title: t("common:Delete"),
       onClick: (_: React.MouseEvent<Element, MouseEvent>, rowId: number) => {
-        try { httpClient.doDelete(
+        try {
+          httpClient.doDelete(
             `/admin/realms/${realm}/groups/${list![rowId].id}`
           );
           add(t("Group deleted"), AlertVariant.success);
         } catch (error) {
           add(`${t("clientDeleteError")} ${error}`, AlertVariant.danger);
         }
- 
+      },
-      }
     },
   ];
 
   return (
     <React.Fragment>
-      <Alerts/>
+      <Alerts />
       {formattedData && (
         <Table
           actions={actions}

src/groups/GroupsSection.tsx

@@ -21,7 +21,6 @@ import {
 } from "@patternfly/react-core";
 import "./GroupsSection.css";
 
-
 export const GroupsSection = () => {
   const { t } = useTranslation("groups");
   const httpClient = useContext(HttpClientContext)!;
@@ -37,8 +36,6 @@ export const GroupsSection = () => {
 
   const [isCreateModalOpen, setIsCreateModalOpen] = useState(false);
 
-
-
   const loader = async () => {
     const groups = await httpClient.doGet<ServerGroupsArrayRepresentation[]>(
       "/admin/realms/master/groups",
@@ -97,15 +94,12 @@ export const GroupsSection = () => {
   };
 
   const handleModalToggle = () => {
-    setIsCreateModalOpen(!isCreateModalOpen)
+    setIsCreateModalOpen(!isCreateModalOpen);
   };
 
   return (
     <React.Fragment>
-      <ViewHeader
+      <ViewHeader titleKey="groups:groups" subKey="groups:groupsDescription" />
-        titleKey="groups:groups"
-        subKey="groups:groupsDescription"
-      />
       <PageSection variant={PageSectionVariants.light}>
         <TableToolbar
           count={10}
@@ -144,9 +138,7 @@ export const GroupsSection = () => {
           }
         >
           {rawData && filteredData && (
-            <GroupsList
+            <GroupsList list={filteredData ? filteredData : rawData} />
-              list={filteredData ? filteredData : rawData}
-            />
           )}
         </TableToolbar>
         <GroupsCreateModal