Fix edit delete action (#26)

* Fix edit delete * fix storybook
project-openubl · Jan 4, 2021 · 316045d · 316045d
1 parent 498a159
commit 316045d
Show file tree

Hide file tree

Showing 2 changed files with 41 additions and 37 deletions.
diff --git a/src/pages/companies/edit-company/edit-company-header.tsx b/src/pages/companies/edit-company/edit-company-header.tsx
@@ -2,7 +2,7 @@ import React, { useEffect } from "react";
 import { useHistory, useParams } from "react-router-dom";
 import { useDispatch } from "react-redux";
 
-import { Alert, Skeleton } from "@patternfly/react-core";
+import { Alert, PageSection, Skeleton } from "@patternfly/react-core";
 
 import { useDeleteCompany, useFetchCompany } from "shared/hooks";
 
@@ -82,41 +82,43 @@ export const EditCompanyHeader: React.FC<EditCompanyHeaderProps> = () => {
   }
 
   return (
-    <ConditionalRender
-      when={isFetching}
-      then={<Skeleton screenreaderText="Loading contents" />}
-    >
-      <PageHeader
-        title={params.company}
-        breadcrumbs={[
-          {
-            title: "Companies",
-            path: Paths.companyList,
-          },
-          {
-            title: "Company details",
-            path: Paths.editCompany,
-          },
-        ]}
-        menuActions={[
-          { label: "Edit", callback: handleOnEdit },
-          { label: "Delete", callback: handleOnDelete },
-        ]}
-        navItems={[
-          {
-            title: "Overview",
-            path: formatPath(Paths.editCompany_overview, {
-              company: params.company,
-            }),
-          },
-          {
-            title: "SUNAT",
-            path: formatPath(Paths.editCompany_sunat, {
-              company: params.company,
-            }),
-          },
-        ]}
-      />
-    </ConditionalRender>
+    <PageSection variant="light">
+      <ConditionalRender
+        when={isFetching}
+        then={<Skeleton screenreaderText="Loading contents" />}
+      >
+        <PageHeader
+          title={params.company}
+          breadcrumbs={[
+            {
+              title: "Companies",
+              path: Paths.companyList,
+            },
+            {
+              title: "Company details",
+              path: Paths.editCompany,
+            },
+          ]}
+          menuActions={[
+            { label: "Edit", callback: handleOnEdit },
+            { label: "Delete", callback: handleOnDelete },
+          ]}
+          navItems={[
+            {
+              title: "Overview",
+              path: formatPath(Paths.editCompany_overview, {
+                company: params.company,
+              }),
+            },
+            {
+              title: "SUNAT",
+              path: formatPath(Paths.editCompany_sunat, {
+                company: params.company,
+              }),
+            },
+          ]}
+        />
+      </ConditionalRender>
+    </PageSection>
   );
 };
diff --git a/src/pages/companies/edit-company/edit-company.tsx b/src/pages/companies/edit-company/edit-company.tsx
@@ -4,6 +4,7 @@ import { Redirect, Route, RouteComponentProps, Switch } from "react-router-dom";
 import { PageSection } from "@patternfly/react-core";
 
 import { AppPlaceholder } from "shared/components";
+import { DeleteWithMatchModalContainer } from "shared/containers";
 
 import { CompanytRoute, Paths } from "Paths";
 
@@ -36,6 +37,7 @@ export const EditCompany: React.FC<AnalysisConfigurationProps> = ({
           </Switch>
         </Suspense>
       </PageSection>
+      <DeleteWithMatchModalContainer />
     </>
   );
 };