kobsio · ricoberger · Jun 30, 2022 · Jun 30, 2022
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -39,6 +39,7 @@ NOTE: As semantic versioning states all 0.y.z releases can contain breaking chan
 - [#367](https://github.com/kobsio/kobs/pull/#367): [app] Change filtering for select components, by using `item.includes(value)`.
 - [#369](https://github.com/kobsio/kobs/pull/#369): [app] Add `insights` panel, to display the insights of an application within a dashboard.
 - [#370](https://github.com/kobsio/kobs/pull/#370): [app] Change toolbar handling by replacing the Patternfly `Toolbar` and `ToolbarItem` components with a custom `Toolbar` and `ToolbarItem` component.
+- [#371](https://github.com/kobsio/kobs/pull/#371): [app] Change `hasDivider` property to `PageContentSection` component to explicit enable / disable the diver.
 
 ## [v0.8.0](https://github.com/kobsio/kobs/releases/tag/v0.8.0) (2022-03-24)
 

diff --git a/plugins/app/public/browserconfig.xml b/plugins/app/public/browserconfig.xml
@@ -1,2 +1,2 @@
 <?xml version="1.0" encoding="utf-8"?>
-<browserconfig><msapplication><tile><square70x70logo src="ms-icon-70x70.png"/><square150x150logo src="ms-icon-150x150.png"/><square310x310logo src="ms-icon-310x310.png"/><TileColor>#0066cc</TileColor></tile></msapplication></browserconfig>
+<browserconfig><msapplication><tile><square70x70logo src="ms-icon-70x70.png"/><square150x150logo src="ms-icon-150x150.png"/><square310x310logo src="ms-icon-310x310.png"/><TileColor>#000000</TileColor></tile></msapplication></browserconfig>
diff --git a/plugins/app/public/index.html b/plugins/app/public/index.html
@@ -22,8 +22,8 @@
 
     <link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
 
-    <meta name="theme-color" content="#0066cc" />
-    <meta name="msapplication-TileColor" content="#0066cc" />
+    <meta name="theme-color" content="#000000" />
+    <meta name="msapplication-TileColor" content="#000000" />
     <meta name="msapplication-TileImage" content="%PUBLIC_URL%/ms-icon-144x144.png" />
 
     <title>kobs</title>

diff --git a/plugins/app/public/manifest.json b/plugins/app/public/manifest.json
@@ -38,5 +38,9 @@
       "type": "image/png",
       "density": "4.0"
     }
-  ]
+  ],
+  "start_url": ".",
+  "display": "standalone",
+  "theme_color": "#000000",
+  "background_color": "#ffffff"
 }
diff --git a/plugins/app/src/components/applications/Application.tsx b/plugins/app/src/components/applications/Application.tsx
@@ -104,7 +104,7 @@ const Application: React.FunctionComponent = () => {
         }
       />
 
-      <PageContentSection hasPadding={false} toolbarContent={undefined} panelContent={details}>
+      <PageContentSection hasPadding={false} hasDivider={false} toolbarContent={undefined} panelContent={details}>
         {data.dashboards ? (
           <DashboardsWrapper manifest={data} references={data.dashboards} setDetails={setDetails} />
         ) : (

diff --git a/plugins/app/src/components/applications/Applications.tsx b/plugins/app/src/components/applications/Applications.tsx
@@ -45,6 +45,7 @@ const Applications: React.FunctionComponent = () => {
 
       <PageContentSection
         hasPadding={true}
+        hasDivider={true}
         toolbarContent={options ? <ApplicationsToolbar options={options} setOptions={changeOptions} /> : undefined}
         panelContent={
           selectedApplication ? (

diff --git a/plugins/app/src/components/dashboards/DashboardPage.tsx b/plugins/app/src/components/dashboards/DashboardPage.tsx
@@ -97,7 +97,7 @@ const DashboardPage: React.FunctionComponent = () => {
         }
       />
 
-      <PageContentSection hasPadding={true} toolbarContent={undefined} panelContent={details}>
+      <PageContentSection hasPadding={true} hasDivider={true} toolbarContent={undefined} panelContent={details}>
         <Dashboard dashboard={data} forceDefaultSpan={false} setDetails={setDetails} />
       </PageContentSection>
     </React.Fragment>

diff --git a/plugins/app/src/components/plugins/PluginInstances.tsx b/plugins/app/src/components/plugins/PluginInstances.tsx
@@ -49,6 +49,7 @@ const PluginInstances: React.FunctionComponent = () => {
 
       <PageContentSection
         hasPadding={true}
+        hasDivider={true}
         toolbarContent={
           <Toolbar usePageInsets={true}>
             <ToolbarItem width="200px">

diff --git a/plugins/app/src/components/plugins/PluginPageLoading.tsx b/plugins/app/src/components/plugins/PluginPageLoading.tsx
@@ -11,7 +11,7 @@ const PluginPageLoading: React.FunctionComponent = () => {
         <br />
         <Skeleton width="75%" fontSize="sm" screenreaderText="Loading description" />
       </PageSection>
-      <PageContentSection hasPadding={true} toolbarContent={undefined} panelContent={undefined}>
+      <PageContentSection hasPadding={true} hasDivider={false} toolbarContent={undefined} panelContent={undefined}>
         <p></p>
       </PageContentSection>
     </React.Fragment>

diff --git a/plugins/app/src/components/profile/Profile.tsx b/plugins/app/src/components/profile/Profile.tsx
@@ -23,7 +23,7 @@ const Profile: React.FunctionComponent = () => {
     <React.Fragment>
       <PageHeaderSection title={authContext.user.email} description="" />
 
-      <PageContentSection hasPadding={false} toolbarContent={undefined} panelContent={details}>
+      <PageContentSection hasPadding={false} hasDivider={false} toolbarContent={undefined} panelContent={details}>
         <ProfileWrapper email={authContext.user.email} setDetails={setDetails} />
       </PageContentSection>
     </React.Fragment>

diff --git a/plugins/app/src/components/resources/Resources.tsx b/plugins/app/src/components/resources/Resources.tsx
@@ -43,6 +43,7 @@ const Resources: React.FunctionComponent = () => {
 
       <PageContentSection
         hasPadding={true}
+        hasDivider={true}
         toolbarContent={options ? <ResourcesToolbar options={options} setOptions={changeOptions} /> : undefined}
         panelContent={details ? details : undefined}
       >

diff --git a/plugins/app/src/components/settings/Settings.tsx b/plugins/app/src/components/settings/Settings.tsx
@@ -10,7 +10,7 @@ const Settings: React.FunctionComponent = () => {
         description="The settings for you hub and all the satellites. You can also view the resources, which are available via each satellite."
       />
 
-      <PageContentSection hasPadding={true} toolbarContent={undefined} panelContent={undefined}>
+      <PageContentSection hasPadding={true} hasDivider={true} toolbarContent={undefined} panelContent={undefined}>
         <div>TODO: Show settings</div>
       </PageContentSection>
     </React.Fragment>

diff --git a/plugins/app/src/components/teams/Team.tsx b/plugins/app/src/components/teams/Team.tsx
@@ -108,7 +108,7 @@ const Team: React.FunctionComponent = () => {
         }
       />
 
-      <PageContentSection hasPadding={false} toolbarContent={undefined} panelContent={details}>
+      <PageContentSection hasPadding={false} hasDivider={false} toolbarContent={undefined} panelContent={details}>
         {data.dashboards ? (
           <DashboardsWrapper manifest={data} references={data.dashboards} setDetails={setDetails} />
         ) : (

diff --git a/plugins/app/src/components/teams/Teams.tsx b/plugins/app/src/components/teams/Teams.tsx
@@ -57,6 +57,7 @@ const Teams: React.FunctionComponent = () => {
 
       <PageContentSection
         hasPadding={true}
+        hasDivider={true}
         toolbarContent={
           <Toolbar usePageInsets={true}>
             <ToolbarItem>

diff --git a/plugins/app/src/components/topology/Applications.tsx b/plugins/app/src/components/topology/Applications.tsx
@@ -43,6 +43,7 @@ const Applications: React.FunctionComponent = () => {
 
       <PageContentSection
         hasPadding={true}
+        hasDivider={true}
         toolbarContent={options ? <ApplicationsToolbar options={options} setOptions={changeOptions} /> : undefined}
         panelContent={details}
       >

diff --git a/plugins/plugin-azure/src/components/containerinstances/Page.tsx b/plugins/plugin-azure/src/components/containerinstances/Page.tsx
@@ -29,7 +29,7 @@ const ContainerInstancesPage: React.FunctionComponent<IContainerInstancesPagePro
         }
       />
 
-      <PageContentSection hasPadding={true} toolbarContent={undefined} panelContent={details}>
+      <PageContentSection hasPadding={true} hasDivider={true} toolbarContent={undefined} panelContent={details}>
         <ContainerGroups instance={instance} resourceGroups={resourceGroups} setDetails={setDetails} />
       </PageContentSection>
     </React.Fragment>

diff --git a/plugins/plugin-azure/src/components/costmanagement/Page.tsx b/plugins/plugin-azure/src/components/costmanagement/Page.tsx
@@ -52,6 +52,7 @@ const CostManagementPage: React.FunctionComponent<ICostManagementPageProps> = ({
 
       <PageContentSection
         hasPadding={true}
+        hasDivider={true}
         toolbarContent={
           <CostManagementToolbar resourceGroups={resourceGroups} options={options} setOptions={changeOptions} />
         }

diff --git a/plugins/plugin-azure/src/components/kubernetesservices/Page.tsx b/plugins/plugin-azure/src/components/kubernetesservices/Page.tsx
@@ -29,7 +29,7 @@ const KubernetesServicesPage: React.FunctionComponent<IKubernetesServicesPagePro
         }
       />
 
-      <PageContentSection hasPadding={true} toolbarContent={undefined} panelContent={details}>
+      <PageContentSection hasPadding={true} hasDivider={true} toolbarContent={undefined} panelContent={details}>
         <KubernetesServices instance={instance} resourceGroups={resourceGroups} setDetails={setDetails} />
       </PageContentSection>
     </React.Fragment>

diff --git a/plugins/plugin-azure/src/components/page/OverviewPage.tsx b/plugins/plugin-azure/src/components/page/OverviewPage.tsx
@@ -29,7 +29,7 @@ const OverviewPage: React.FunctionComponent<IOverviewPageProps> = ({ instance }:
         }
       />
 
-      <PageContentSection hasPadding={true} toolbarContent={undefined} panelContent={undefined}>
+      <PageContentSection hasPadding={true} hasDivider={true} toolbarContent={undefined} panelContent={undefined}>
         <Gallery hasGutter={true}>
           {Object.keys(services).map((service) => (
             <GalleryItem key={service}>

diff --git a/plugins/plugin-azure/src/components/virtualmachinescalesets/Page.tsx b/plugins/plugin-azure/src/components/virtualmachinescalesets/Page.tsx
@@ -29,7 +29,7 @@ const VirtualMachineScaleSetsPage: React.FunctionComponent<IVirtualMachineScaleS
         }
       />
 
-      <PageContentSection hasPadding={true} toolbarContent={undefined} panelContent={details}>
+      <PageContentSection hasPadding={true} hasDivider={true} toolbarContent={undefined} panelContent={details}>
         <VirtualMachineScaleSets instance={instance} resourceGroups={resourceGroups} setDetails={setDetails} />
       </PageContentSection>
     </React.Fragment>

diff --git a/plugins/plugin-elasticsearch/src/components/page/Page.tsx b/plugins/plugin-elasticsearch/src/components/page/Page.tsx
@@ -80,6 +80,7 @@ const Page: React.FunctionComponent<IPluginPageProps> = ({ instance }: IPluginPa
 
       <PageContentSection
         hasPadding={true}
+        hasDivider={true}
         toolbarContent={<PageToolbar options={options} setOptions={changeOptions} />}
         panelContent={undefined}
       >

diff --git a/plugins/plugin-flux/src/components/page/Page.tsx b/plugins/plugin-flux/src/components/page/Page.tsx
@@ -45,6 +45,7 @@ const Page: React.FunctionComponent<IPluginPageProps> = ({ instance }: IPluginPa
 
       <PageContentSection
         hasPadding={true}
+        hasDivider={true}
         toolbarContent={<PageToolbar instance={instance} options={options} setOptions={changeOptions} />}
         panelContent={details}
       >

diff --git a/plugins/plugin-grafana/src/components/page/Page.tsx b/plugins/plugin-grafana/src/components/page/Page.tsx
@@ -41,6 +41,7 @@ const Page: React.FunctionComponent<IPluginPageProps> = ({ instance }: IPluginPa
 
       <PageContentSection
         hasPadding={true}
+        hasDivider={true}
         toolbarContent={<PageToolbar options={options} setOptions={changeOptions} />}
         panelContent={undefined}
       >

diff --git a/plugins/plugin-harbor/src/components/page/ArtifactsPage.tsx b/plugins/plugin-harbor/src/components/page/ArtifactsPage.tsx
@@ -99,6 +99,7 @@ const ArtifactsPage: React.FunctionComponent<IArtifactsPageProps> = ({ instance
 
       <PageContentSection
         hasPadding={true}
+        hasDivider={true}
         toolbarContent={<PageToolbar options={options} setOptions={changeOptions} />}
         panelContent={details}
       >

diff --git a/plugins/plugin-harbor/src/components/page/ProjectsPage.tsx b/plugins/plugin-harbor/src/components/page/ProjectsPage.tsx
@@ -89,7 +89,7 @@ const ProjectsPage: React.FunctionComponent<IProjectsPageProps> = ({ instance }:
         }
       />
 
-      <PageContentSection hasPadding={true} toolbarContent={undefined} panelContent={undefined}>
+      <PageContentSection hasPadding={true} hasDivider={true} toolbarContent={undefined} panelContent={undefined}>
         {isLoading ? (
           <div className="pf-u-text-align-center">
             <Spinner />

diff --git a/plugins/plugin-harbor/src/components/page/RepositoriesPage.tsx b/plugins/plugin-harbor/src/components/page/RepositoriesPage.tsx
@@ -97,6 +97,7 @@ const RepositoriesPage: React.FunctionComponent<IRepositoriesPageProps> = ({ ins
 
       <PageContentSection
         hasPadding={true}
+        hasDivider={true}
         toolbarContent={<PageToolbar options={options} setOptions={changeOptions} />}
         panelContent={undefined}
       >

diff --git a/plugins/plugin-helm/src/components/page/Page.tsx b/plugins/plugin-helm/src/components/page/Page.tsx
@@ -50,6 +50,7 @@ const Page: React.FunctionComponent<IPluginPageProps> = ({ instance }: IPluginPa
 
       <PageContentSection
         hasPadding={true}
+        hasDivider={true}
         toolbarContent={<PageToolbar instance={instance} options={options} setOptions={changeOptions} />}
         panelContent={details}
       >

diff --git a/plugins/plugin-istio/src/components/page/Application.tsx b/plugins/plugin-istio/src/components/page/Application.tsx
@@ -74,6 +74,7 @@ const Application: React.FunctionComponent<IApplicationProps> = ({ instance }: I
 
       <PageContentSection
         hasPadding={true}
+        hasDivider={true}
         toolbarContent={<ApplicationToolbar options={options} setOptions={changeOptions} />}
         panelContent={details}
       >

diff --git a/plugins/plugin-istio/src/components/page/Applications.tsx b/plugins/plugin-istio/src/components/page/Applications.tsx
@@ -58,6 +58,7 @@ const Applications: React.FunctionComponent<IApplicationsProps> = ({ instance }:
 
       <PageContentSection
         hasPadding={true}
+        hasDivider={true}
         toolbarContent={<ApplicationsToolbar instance={instance} options={options} setOptions={changeOptions} />}
         panelContent={undefined}
       >

diff --git a/plugins/plugin-jaeger/src/components/page/Traces.tsx b/plugins/plugin-jaeger/src/components/page/Traces.tsx
@@ -54,6 +54,7 @@ const Traces: React.FunctionComponent<ITracesProps> = ({ instance }: ITracesProp
 
       <PageContentSection
         hasPadding={true}
+        hasDivider={true}
         toolbarContent={<TracesToolbar instance={instance} options={options} setOptions={changeOptions} />}
         panelContent={details}
       >

diff --git a/plugins/plugin-kiali/src/components/page/Page.tsx b/plugins/plugin-kiali/src/components/page/Page.tsx
@@ -47,8 +47,9 @@ const Page: React.FunctionComponent<IPluginPageProps> = ({ instance }: IPluginPa
         }
       />
       <PageContentSection
-        toolbarContent={<PageToolbar instance={instance} options={options} setOptions={changeOptions} />}
         hasPadding={true}
+        hasDivider={true}
+        toolbarContent={<PageToolbar instance={instance} options={options} setOptions={changeOptions} />}
         panelContent={details}
       >
         {options.namespaces && options.namespaces.length > 0 ? (

diff --git a/plugins/plugin-klogs/src/components/page/AggregationPage.tsx b/plugins/plugin-klogs/src/components/page/AggregationPage.tsx
@@ -60,6 +60,7 @@ const AggregationPage: React.FunctionComponent<IAggregationPageProps> = ({ insta
 
       <PageContentSection
         hasPadding={true}
+        hasDivider={true}
         toolbarContent={<AggregationToolbar options={tmpOptions} setOptions={setTmpOptions} />}
         panelContent={undefined}
       >

diff --git a/plugins/plugin-klogs/src/components/page/LogsPage.tsx b/plugins/plugin-klogs/src/components/page/LogsPage.tsx
@@ -106,6 +106,7 @@ const LogsPage: React.FunctionComponent<ILogsPageProps> = ({ instance }: ILogsPa
 
       <PageContentSection
         hasPadding={true}
+        hasDivider={true}
         toolbarContent={<LogsToolbar options={options} setOptions={changeOptions} />}
         panelContent={undefined}
       >

diff --git a/plugins/plugin-opsgenie/src/components/page/Page.tsx b/plugins/plugin-opsgenie/src/components/page/Page.tsx
@@ -48,6 +48,7 @@ const Page: React.FunctionComponent<IPluginPageProps> = ({ instance }: IPluginPa
 
       <PageContentSection
         hasPadding={true}
+        hasDivider={true}
         toolbarContent={<PageToolbar options={options} setOptions={changeOptions} />}
         panelContent={details}
       >

diff --git a/plugins/plugin-prometheus/src/components/page/Page.tsx b/plugins/plugin-prometheus/src/components/page/Page.tsx
@@ -47,6 +47,7 @@ const Page: React.FunctionComponent<IPluginPageProps> = ({ instance }: IPluginPa
 
       <PageContentSection
         hasPadding={true}
+        hasDivider={true}
         toolbarContent={<PageToolbar instance={instance} options={options} setOptions={changeOptions} />}
         panelContent={undefined}
       >

diff --git a/plugins/plugin-rss/src/components/page/Page.tsx b/plugins/plugin-rss/src/components/page/Page.tsx
@@ -16,7 +16,7 @@ const Page: React.FunctionComponent<IPluginPageProps> = ({ instance }: IPluginPa
         }
       />
 
-      <PageContentSection hasPadding={true} toolbarContent={undefined} panelContent={undefined}>
+      <PageContentSection hasPadding={true} hasDivider={true} toolbarContent={undefined} panelContent={undefined}>
         <div></div>
       </PageContentSection>
     </React.Fragment>

diff --git a/plugins/plugin-sonarqube/src/components/page/Page.tsx b/plugins/plugin-sonarqube/src/components/page/Page.tsx
@@ -92,6 +92,7 @@ const Page: React.FunctionComponent<IPluginPageProps> = ({ instance }: IPluginPa
 
       <PageContentSection
         hasPadding={true}
+        hasDivider={true}
         toolbarContent={<PageToolbar options={options} setOptions={changeOptions} />}
         panelContent={undefined}
       >

diff --git a/plugins/plugin-sql/src/components/page/Page.tsx b/plugins/plugin-sql/src/components/page/Page.tsx
@@ -41,6 +41,7 @@ const Page: React.FunctionComponent<IPluginPageProps> = ({ instance }: IPluginPa
 
       <PageContentSection
         hasPadding={true}
+        hasDivider={true}
         toolbarContent={<PageToolbar options={options} setOptions={changeOptions} />}
         panelContent={undefined}
       >

diff --git a/plugins/plugin-techdocs/src/components/page/ServicePage.tsx b/plugins/plugin-techdocs/src/components/page/ServicePage.tsx
@@ -94,7 +94,7 @@ const ServicePage: React.FunctionComponent<IServicePageProps> = ({ instance }: I
         component={<PluginPageTitle satellite={data.key} name={data.name} description={data.description} />}
       />
 
-      <PageContentSection hasPadding={true} toolbarContent={undefined} panelContent={details}>
+      <PageContentSection hasPadding={true} hasDivider={true} toolbarContent={undefined} panelContent={details}>
         <ServicePageWrapper
           instance={instance}
           index={data}

diff --git a/plugins/plugin-techdocs/src/components/page/TechDocsPage.tsx b/plugins/plugin-techdocs/src/components/page/TechDocsPage.tsx
@@ -22,7 +22,7 @@ const TechDocsPage: React.FunctionComponent<ITechDocsPageProps> = ({ instance }:
         }
       />
 
-      <PageContentSection hasPadding={true} toolbarContent={undefined} panelContent={undefined}>
+      <PageContentSection hasPadding={true} hasDivider={true} toolbarContent={undefined} panelContent={undefined}>
         <Card>
           <TechDocsList instance={instance} />
         </Card>

diff --git a/plugins/shared/src/components/misc/PageContentSection.tsx b/plugins/shared/src/components/misc/PageContentSection.tsx
@@ -3,26 +3,24 @@ import React from 'react';
 
 interface IPageContentSectionProps {
   hasPadding: boolean;
+  hasDivider: boolean;
   panelContent: React.ReactNode;
   toolbarContent: React.ReactNode;
   children: React.ReactElement;
 }
 
 export const PageContentSection: React.FunctionComponent<IPageContentSectionProps> = ({
   hasPadding,
+  hasDivider,
   panelContent,
   toolbarContent,
   children,
 }: IPageContentSectionProps) => {
   return (
     <PageSection isFilled={true} padding={{ default: 'noPadding' }}>
       <Drawer isExpanded={panelContent !== undefined}>
-        {toolbarContent && (
-          <DrawerSection>
-            {toolbarContent}
-            <Divider component="div" />
-          </DrawerSection>
-        )}
+        {toolbarContent && <DrawerSection>{toolbarContent}</DrawerSection>}
+        {hasDivider && <Divider component="div" />}
         <DrawerContent className="pf-m-no-background" panelContent={panelContent}>
           <DrawerContentBody hasPadding={hasPadding}>{children}</DrawerContentBody>
         </DrawerContent>
-Original file line number
+Diff line change
@@ Expand Up @@
             }
           />
-          <PageContentSection hasPadding={true} toolbarContent={undefined} panelContent={undefined}>
+          <PageContentSection hasPadding={true} hasDivider={true} toolbarContent={undefined} panelContent={undefined}>
             <Card>
               <TechDocsList instance={instance} />
             </Card>
@@ Expand Down @@