Merge pull request #1223 from spotify/freben/named

chore(catalog): consistent use of named exports
2020-06-10 09:03:31 +02:00
parent 2c26f1f781 9964044ed6
commit 3c13b2ee93
13 changed files with 40 additions and 73 deletions
@@ -14,20 +14,20 @@
 * limitations under the License.
 */

-import React from 'react';
-import { render } from '@testing-library/react';
-import CatalogPage from './CatalogPage';
+import { Entity } from '@backstage/catalog-model';
 import {
-  ApiRegistry,
  ApiProvider,
+  ApiRegistry,
  errorApiRef,
  storageApiRef,
  WebStorage,
 } from '@backstage/core';
-import { wrapInTestApp, MockErrorApi } from '@backstage/test-utils';
+import { MockErrorApi, wrapInTestApp } from '@backstage/test-utils';
+import { render } from '@testing-library/react';
+import React from 'react';
 import { catalogApiRef } from '../..';
 import { CatalogApi } from '../../api/types';
-import { Entity } from '@backstage/catalog-model';
+import { CatalogPage } from './CatalogPage';

 describe('CatalogPage', () => {
  const mockErrorApi = new MockErrorApi();
@@ -14,6 +14,7 @@
 * limitations under the License.
 */

+import { LocationSpec } from '@backstage/catalog-model';
 import {
  Content,
  ContentHeader,
@@ -26,26 +27,23 @@ import {
  SupportButton,
  useApi,
 } from '@backstage/core';
-import { LocationSpec } from '@backstage/catalog-model';
 import { rootRoute as scaffolderRootRoute } from '@backstage/plugin-scaffolder';
-import { Button, makeStyles, Typography, Link } from '@material-ui/core';
-import GitHub from '@material-ui/icons/GitHub';
+import { Button, Link, makeStyles, Typography } from '@material-ui/core';
 import Edit from '@material-ui/icons/Edit';
+import GitHub from '@material-ui/icons/GitHub';
 import React, { FC, useCallback, useState } from 'react';
 import { Link as RouterLink } from 'react-router-dom';
 import { useAsync } from 'react-use';
 import { catalogApiRef } from '../..';
 import { Component } from '../../data/component';
-import { defaultFilter, filterGroups, dataResolvers } from '../../data/filters';
+import { dataResolvers, defaultFilter, filterGroups } from '../../data/filters';
 import { entityToComponent, findLocationForEntityMeta } from '../../data/utils';
+import { useStarredEntities } from '../../hooks/useStarredEntites';
 import {
  CatalogFilter,
  CatalogFilterItem,
 } from '../CatalogFilter/CatalogFilter';
-
-import { useStarredEntities } from '../../hooks/useStarredEntites';
-
-import CatalogTable from '../CatalogTable/CatalogTable';
+import { CatalogTable } from '../CatalogTable/CatalogTable';

 const useStyles = makeStyles(theme => ({
  contentWrapper: {
@@ -60,7 +58,7 @@ const useStyles = makeStyles(theme => ({
  },
 }));

-const CatalogPage: FC<{}> = () => {
+export const CatalogPage: FC<{}> = () => {
  const catalogApi = useApi(catalogApiRef);
  const { starredEntities } = useStarredEntities();
  const [selectedFilter, setSelectedFilter] = useState<CatalogFilterItem>(
@@ -201,5 +199,3 @@ const CatalogPage: FC<{}> = () => {
    </Page>
  );
 };
-
-export default CatalogPage;
@@ -1,17 +0,0 @@
-/*
- * Copyright 2020 Spotify AB
- *
- * 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 { default } from './CatalogPage';
@@ -16,7 +16,7 @@
 import * as React from 'react';
 import { render } from '@testing-library/react';
 import { wrapInTestApp } from '@backstage/test-utils';
-import CatalogTable from './CatalogTable';
+import { CatalogTable } from './CatalogTable';
 import { Component } from '../../data/component';

 const components: Component[] = [
@@ -17,9 +17,8 @@ import { Table, TableColumn } from '@backstage/core';
 import { Link } from '@material-ui/core';
 import { Alert } from '@material-ui/lab';
 import React, { FC } from 'react';
-import { Link as RouterLink, generatePath } from 'react-router-dom';
+import { generatePath, Link as RouterLink } from 'react-router-dom';
 import { Component } from '../../data/component';
-
 import { entityRoute } from '../../routes';

 const columns: TableColumn[] = [
@@ -62,7 +61,7 @@ type CatalogTableProps = {
  actions?: any;
 };

-const CatalogTable: FC<CatalogTableProps> = ({
+export const CatalogTable: FC<CatalogTableProps> = ({
  components,
  loading,
  error,
@@ -95,5 +94,3 @@ const CatalogTable: FC<CatalogTableProps> = ({
    />
  );
 };
-
-export default CatalogTable;
@@ -13,7 +13,7 @@
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
-import ComponentContextMenu from './ComponentContextMenu';
+import { ComponentContextMenu } from './ComponentContextMenu';
 import { render } from '@testing-library/react';
 import * as React from 'react';
 import { act } from 'react-dom/test-utils';
@@ -21,11 +21,11 @@ import {
  Popover,
  Typography,
 } from '@material-ui/core';
+import { makeStyles } from '@material-ui/core/styles';
 import Cancel from '@material-ui/icons/Cancel';
 import MoreVert from '@material-ui/icons/MoreVert';
 import SwapHoriz from '@material-ui/icons/SwapHoriz';
 import React, { FC, useState } from 'react';
-import { makeStyles } from '@material-ui/core/styles';

 // TODO(freben): It should probably instead be the case that Header sets the theme text color to white inside itself unconditionally instead
 const useStyles = makeStyles({
@@ -38,7 +38,7 @@ type ComponentContextMenuProps = {
  onUnregisterComponent: () => void;
 };

-const ComponentContextMenu: FC<ComponentContextMenuProps> = ({
+export const ComponentContextMenu: FC<ComponentContextMenuProps> = ({
  onUnregisterComponent,
 }) => {
  const [anchorEl, setAnchorEl] = useState<HTMLButtonElement>();
@@ -94,5 +94,3 @@ const ComponentContextMenu: FC<ComponentContextMenuProps> = ({
    </div>
  );
 };
-
-export default ComponentContextMenu;
@@ -14,7 +14,7 @@
 * limitations under the License.
 */
 import React from 'react';
-import ComponentMetadataCard from './ComponentMetadataCard';
+import { ComponentMetadataCard } from './ComponentMetadataCard';
 import { Component } from '../../data/component';
 import { render } from '@testing-library/react';

@@ -13,18 +13,16 @@
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
+import { InfoCard, Progress, StructuredMetadataTable } from '@backstage/core';
 import React, { FC } from 'react';
 import { Component } from '../../data/component';
-import { Progress, InfoCard, StructuredMetadataTable } from '@backstage/core';

-type ComponentMetadataCardProps = {
+type Props = {
  loading: boolean;
  component: Component | undefined;
 };
-const ComponentMetadataCard: FC<ComponentMetadataCardProps> = ({
-  loading,
-  component,
-}) => {
+
+export const ComponentMetadataCard: FC<Props> = ({ loading, component }) => {
  if (loading) {
    return (
      <InfoCard title="Metadata">
@@ -41,4 +39,3 @@ const ComponentMetadataCard: FC<ComponentMetadataCardProps> = ({
    </InfoCard>
  );
 };
-export default ComponentMetadataCard;
@@ -13,7 +13,7 @@
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
-import ComponentPage from './ComponentPage';
+import { ComponentPage } from './ComponentPage';
 import { render, wait } from '@testing-library/react';
 import * as React from 'react';
 import { wrapInTestApp } from '@backstage/test-utils';
@@ -13,27 +13,26 @@
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
-import React, { FC, useEffect, useState } from 'react';
-import { useAsync } from 'react-use';
-import ComponentMetadataCard from '../ComponentMetadataCard/ComponentMetadataCard';
 import {
  Content,
-  Header,
-  pageTheme,
-  Page,
-  useApi,
  ErrorApi,
  errorApiRef,
+  Header,
  HeaderTabs,
+  Page,
+  pageTheme,
+  useApi,
 } from '@backstage/core';
-import ComponentContextMenu from '../ComponentContextMenu/ComponentContextMenu';
-import ComponentRemovalDialog from '../ComponentRemovalDialog/ComponentRemovalDialog';
-
 import { SentryIssuesWidget } from '@backstage/plugin-sentry';
 import { Grid } from '@material-ui/core';
+import React, { FC, useEffect, useState } from 'react';
+import { useAsync } from 'react-use';
 import { catalogApiRef } from '../..';
-import { entityToComponent } from '../../data/utils';
 import { Component } from '../../data/component';
+import { entityToComponent } from '../../data/utils';
+import { ComponentContextMenu } from '../ComponentContextMenu/ComponentContextMenu';
+import { ComponentMetadataCard } from '../ComponentMetadataCard/ComponentMetadataCard';
+import { ComponentRemovalDialog } from '../ComponentRemovalDialog/ComponentRemovalDialog';

 const REDIRECT_DELAY = 1000;

@@ -49,7 +48,7 @@ type ComponentPageProps = {
  };
 };

-const ComponentPage: FC<ComponentPageProps> = ({ match, history }) => {
+export const ComponentPage: FC<ComponentPageProps> = ({ match, history }) => {
  const [confirmationDialogOpen, setConfirmationDialogOpen] = useState(false);
  const [removingPending, setRemovingPending] = useState(false);
  const showRemovalDialog = () => setConfirmationDialogOpen(true);
@@ -151,4 +150,3 @@ const ComponentPage: FC<ComponentPageProps> = ({ match, history }) => {
    </Page>
  );
 };
-export default ComponentPage;
@@ -51,7 +51,7 @@ function useColocatedEntities(component: Component): AsyncState<Entity[]> {
  }, [catalogApi, component]);
 }

-const ComponentRemovalDialog: FC<ComponentRemovalDialogProps> = ({
+export const ComponentRemovalDialog: FC<ComponentRemovalDialogProps> = ({
  onConfirm,
  onCancel,
  onClose,
@@ -114,5 +114,3 @@ const ComponentRemovalDialog: FC<ComponentRemovalDialogProps> = ({
    </Dialog>
  );
 };
-
-export default ComponentRemovalDialog;
@@ -15,9 +15,9 @@
 */

 import { createPlugin } from '@backstage/core';
-import CatalogPage from './components/CatalogPage';
-import ComponentPage from './components/ComponentPage/ComponentPage';
-import { rootRoute, entityRoute } from './routes';
+import { CatalogPage } from './components/CatalogPage/CatalogPage';
+import { ComponentPage } from './components/ComponentPage/ComponentPage';
+import { entityRoute, rootRoute } from './routes';

 export const plugin = createPlugin({
  id: 'catalog',