Improved the icons

Signed-off-by: Karan Shah <karan.shah@simplybusiness.co.uk>

plugins/airbrake/dev/components/FlexColumn/FlexColumn.tsx

@@ -1,34 +0,0 @@
-/*
- * Copyright 2022 The Backstage Authors
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-import React, { PropsWithChildren, ReactNode } from 'react';
-
-export declare type FlexColumnProps = {
-  children?: ReactNode;
-};
-
-export const FlexColumn = (props: PropsWithChildren<FlexColumnProps>) => {
-  return (
-    <div
-      style={{
-        display: 'flex',
-        flexDirection: 'column',
-        gap: '2em',
-      }}
-    >
-      {props.children}
-    </div>
-  );
-};

plugins/airbrake/dev/components/FlexColumn/index.ts

@@ -1,18 +0,0 @@
-/*
- * Copyright 2020 The Backstage Authors
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-
-export { FlexColumn } from './FlexColumn';
-export type { FlexColumnProps } from './FlexColumn';

plugins/airbrake/dev/index.tsx

@@ -21,9 +21,8 @@ import { ApiBar } from './components/ApiBar';
 import { Content, Header, Page } from '@backstage/core-components';
 import { EntityProvider } from '@backstage/plugin-catalog-react';
 import { createEntity } from '../src/api/mock/mock-entity';
-import AirplanemodeActiveIcon from '@material-ui/icons/AirplanemodeActive';
-import AirplanemodeInactiveIcon from '@material-ui/icons/AirplanemodeInactive';
-import { FlexColumn } from './components/FlexColumn';
+import CloudOffIcon from '@material-ui/icons/CloudOff';
+import CloudIcon from '@material-ui/icons/Cloud';
 
 createDevApp()
   .registerPlugin(airbrakePlugin)
@@ -35,42 +34,33 @@ createDevApp()
   .addPage({
     element: (
       <Page themeId="tool">
-        <Header
-          title="Airbrake demo application"
-          subtitle="This uses a fake API"
-        />
+        <Header title="Airbrake demo application" subtitle="Mock API" />
         <Content>
-          <FlexColumn>
-            <EntityProvider entity={createEntity('demo')}>
-              <EntityAirbrakeContent />
-            </EntityProvider>
-          </FlexColumn>
+          <EntityProvider entity={createEntity('demo')}>
+            <EntityAirbrakeContent />
+          </EntityProvider>
         </Content>
       </Page>
     ),
     title: 'Mock API',
     path: '/airbrake-mock-api',
-    icon: AirplanemodeActiveIcon,
+    icon: CloudOffIcon,
   })
   .addPage({
     element: (
       <Page themeId="tool">
-        <Header
-          title="Airbrake demo application"
-          subtitle="Test the plugin below"
-        />
+        <Header title="Airbrake demo application" subtitle="Real API">
+          <ApiBar />
+        </Header>
         <Content>
-          <FlexColumn>
-            <ApiBar />
-            <EntityProvider entity={createEntity('demo')}>
-              <EntityAirbrakeContent />
-            </EntityProvider>
-          </FlexColumn>
+          <EntityProvider entity={createEntity('demo')}>
+            <EntityAirbrakeContent />
+          </EntityProvider>
         </Content>
       </Page>
     ),
     title: 'Real API',
     path: '/airbrake-real-api',
-    icon: AirplanemodeInactiveIcon,
+    icon: CloudIcon,
   })
   .render();