;
- submitting?: boolean;
-};
-
-export const RegisterComponentForm = ({ onSubmit, submitting }: Props) => {
- const { register, handleSubmit, errors, formState } = useForm({
- mode: 'onChange',
- });
- const classes = useStyles();
- const hasErrors = !!errors.entityLocation;
- const dirty = formState?.isDirty;
-
- const onSubmitValidate = handleSubmit(data => {
- data.mode = 'validate';
- onSubmit(data);
- });
-
- const onSubmitRegister = handleSubmit(data => {
- data.mode = 'register';
- onSubmit(data);
- });
-
- return submitting ? (
-
- ) : (
-
- );
-};
diff --git a/plugins/register-component/src/components/RegisterComponentForm/index.ts b/plugins/register-component/src/components/RegisterComponentForm/index.ts
deleted file mode 100644
index b864bacaad..0000000000
--- a/plugins/register-component/src/components/RegisterComponentForm/index.ts
+++ /dev/null
@@ -1,17 +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 { RegisterComponentForm } from './RegisterComponentForm';
diff --git a/plugins/register-component/src/components/RegisterComponentPage/RegisterComponentPage.test.tsx b/plugins/register-component/src/components/RegisterComponentPage/RegisterComponentPage.test.tsx
deleted file mode 100644
index 2874e77eb6..0000000000
--- a/plugins/register-component/src/components/RegisterComponentPage/RegisterComponentPage.test.tsx
+++ /dev/null
@@ -1,70 +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.
- */
-
-import { catalogApiRef } from '@backstage/plugin-catalog-react';
-import { renderInTestApp } from '@backstage/test-utils';
-import { lightTheme } from '@backstage/theme';
-import { ThemeProvider } from '@material-ui/core';
-import React from 'react';
-import { RegisterComponentPage } from './RegisterComponentPage';
-
-import { ApiProvider, ApiRegistry } from '@backstage/core-app-api';
-import { createRouteRef, errorApiRef } from '@backstage/core-plugin-api';
-
-const errorApi: jest.Mocked = {
- post: jest.fn(),
- error$: jest.fn(),
-};
-
-const catalogApi: jest.Mocked = {
- /* eslint-disable-next-line @typescript-eslint/no-unused-vars */
- addLocation: jest.fn(_a => new Promise(() => {})),
- getEntities: jest.fn(),
- getOriginLocationByEntity: jest.fn(),
- getLocationByEntity: jest.fn(),
- getLocationById: jest.fn(),
- removeLocationById: jest.fn(),
- removeEntityByUid: jest.fn(),
- getEntityByName: jest.fn(),
-};
-
-const Wrapper = ({ children }: { children?: React.ReactNode }) => (
-
- {children}
-
-);
-
-describe('RegisterComponentPage', () => {
- it('should render', async () => {
- const { getByText } = await renderInTestApp(
-
-
- ,
- );
-
- expect(getByText('Register existing component')).toBeInTheDocument();
- });
-});
diff --git a/plugins/register-component/src/components/RegisterComponentPage/RegisterComponentPage.tsx b/plugins/register-component/src/components/RegisterComponentPage/RegisterComponentPage.tsx
deleted file mode 100644
index 27ed7346ea..0000000000
--- a/plugins/register-component/src/components/RegisterComponentPage/RegisterComponentPage.tsx
+++ /dev/null
@@ -1,137 +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.
- */
-
-import { Entity, Location } from '@backstage/catalog-model';
-import { catalogApiRef } from '@backstage/plugin-catalog-react';
-import { Grid, makeStyles } from '@material-ui/core';
-import React, { useState } from 'react';
-import { useMountedState } from 'react-use';
-import { RegisterComponentForm } from '../RegisterComponentForm';
-import { RegisterComponentResultDialog } from '../RegisterComponentResultDialog';
-
-import {
- Content,
- ContentHeader,
- Header,
- InfoCard,
- Page,
- SupportButton,
-} from '@backstage/core-components';
-import { errorApiRef, RouteRef, useApi } from '@backstage/core-plugin-api';
-
-const useStyles = makeStyles(theme => ({
- dialogPaper: {
- minHeight: 250,
- minWidth: 600,
- },
- icon: {
- width: 20,
- marginRight: theme.spacing(1),
- },
- contentText: {
- paddingBottom: theme.spacing(2),
- },
-}));
-
-const FormStates = {
- Idle: 'idle',
- Success: 'success',
- Submitting: 'submitting',
-} as const;
-
-type ValuesOf = T extends Record ? V : never;
-
-export const RegisterComponentPage = ({
- catalogRouteRef,
-}: {
- catalogRouteRef: RouteRef;
-}) => {
- const classes = useStyles();
- const catalogApi = useApi(catalogApiRef);
- const [formState, setFormState] = useState>(
- FormStates.Idle,
- );
- const isMounted = useMountedState();
-
- const errorApi = useApi(errorApiRef);
-
- const [result, setResult] = useState<{
- data: {
- entities: Entity[];
- location: Location;
- } | null;
- error: null | Error;
- dryRun: boolean;
- }>({
- data: null,
- error: null,
- dryRun: false,
- });
-
- const handleSubmit = async (formData: Record) => {
- setFormState(FormStates.Submitting);
- const { entityLocation: target, mode } = formData;
- const dryRun = mode === 'validate';
- try {
- const data = await catalogApi.addLocation({ target, dryRun });
-
- if (!isMounted()) return;
-
- setResult({ error: null, data, dryRun });
- setFormState(FormStates.Success);
- } catch (e) {
- errorApi.post(e);
-
- if (!isMounted()) return;
-
- setResult({ error: e, data: null, dryRun });
- setFormState(FormStates.Idle);
- }
- };
-
- return (
-
-
-
-
-
- Start tracking your component in Backstage. TODO: Add more
- information about what this is.
-
-
-
-
-
-
-
-
-
-
- {formState === FormStates.Success && (
- setFormState(FormStates.Idle)}
- classes={{ paper: classes.dialogPaper }}
- catalogRouteRef={catalogRouteRef}
- />
- )}
-
- );
-};
diff --git a/plugins/register-component/src/components/RegisterComponentPage/index.ts b/plugins/register-component/src/components/RegisterComponentPage/index.ts
deleted file mode 100644
index 982d277451..0000000000
--- a/plugins/register-component/src/components/RegisterComponentPage/index.ts
+++ /dev/null
@@ -1,17 +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 { RegisterComponentPage } from './RegisterComponentPage';
diff --git a/plugins/register-component/src/components/RegisterComponentResultDialog/RegisterComponentResultDialog.test.tsx b/plugins/register-component/src/components/RegisterComponentResultDialog/RegisterComponentResultDialog.test.tsx
deleted file mode 100644
index 0cc36c98bc..0000000000
--- a/plugins/register-component/src/components/RegisterComponentResultDialog/RegisterComponentResultDialog.test.tsx
+++ /dev/null
@@ -1,93 +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.
- */
-
-import { Entity } from '@backstage/catalog-model';
-import { lightTheme } from '@backstage/theme';
-import { ThemeProvider } from '@material-ui/core';
-import { render, screen } from '@testing-library/react';
-import React from 'react';
-import { MemoryRouter } from 'react-router-dom';
-import { RegisterComponentResultDialog } from './RegisterComponentResultDialog';
-import { createRouteRef } from '@backstage/core-plugin-api';
-
-const Wrapper = ({ children }: { children?: React.ReactNode }) => (
-
- {children}
-
-);
-
-describe('RegisterComponentResultDialog', () => {
- it('should render', () => {
- render(
- {}}
- entities={[]}
- catalogRouteRef={createRouteRef({
- path: '/catalog',
- title: 'Software Catalog',
- })}
- />,
- { wrapper: Wrapper },
- );
-
- expect(screen.getByText('Registration Result')).toBeInTheDocument();
- });
-
- it('should show a list of components if success', async () => {
- const entities: Entity[] = [
- {
- apiVersion: 'backstage.io/v1alpha1',
- kind: 'Component',
- metadata: {
- name: 'Component1',
- },
- spec: {
- type: 'website',
- },
- },
- {
- apiVersion: 'backstage.io/v1alpha1',
- kind: 'Component',
- metadata: {
- name: 'Component2',
- },
- spec: {
- type: 'service',
- },
- },
- ];
-
- render(
- {}}
- entities={entities}
- catalogRouteRef={createRouteRef({
- path: '/catalog',
- title: 'Software Catalog',
- })}
- />,
- { wrapper: Wrapper },
- );
-
- expect(
- screen.getByText(
- 'The following entities have been successfully created:',
- ),
- ).toBeInTheDocument();
- expect(screen.getByText('Component1')).toBeInTheDocument();
- expect(screen.getByText('Component2')).toBeInTheDocument();
- });
-});
diff --git a/plugins/register-component/src/components/RegisterComponentResultDialog/RegisterComponentResultDialog.tsx b/plugins/register-component/src/components/RegisterComponentResultDialog/RegisterComponentResultDialog.tsx
deleted file mode 100644
index e13f2ac229..0000000000
--- a/plugins/register-component/src/components/RegisterComponentResultDialog/RegisterComponentResultDialog.tsx
+++ /dev/null
@@ -1,142 +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.
- */
-
-import { Entity } from '@backstage/catalog-model';
-import {
- entityRoute,
- entityRouteParams,
-} from '@backstage/plugin-catalog-react';
-import {
- Button,
- Dialog,
- DialogActions,
- DialogContent,
- DialogContentText,
- DialogTitle,
- Divider,
- Link,
- List,
- ListItem,
-} from '@material-ui/core';
-import React, { useState } from 'react';
-import { generatePath, resolvePath } from 'react-router';
-import { Link as RouterLink } from 'react-router-dom';
-
-import { RouteRef } from '@backstage/core-plugin-api';
-import { StructuredMetadataTable } from '@backstage/core-components';
-
-type Props = {
- onClose: () => void;
- classes?: Record;
- entities: Entity[];
- dryRun?: boolean;
- catalogRouteRef: RouteRef;
-};
-
-const getEntityCatalogPath = ({
- entity,
- catalogRouteRef,
-}: {
- entity: Entity;
- catalogRouteRef: RouteRef;
-}) => {
- const relativeEntityPathInsideCatalog = generatePath(
- entityRoute.path,
- entityRouteParams(entity),
- );
-
- const resolvedAbsolutePath = resolvePath(
- relativeEntityPathInsideCatalog,
- catalogRouteRef.path,
- )?.pathname;
-
- return resolvedAbsolutePath;
-};
-
-export const RegisterComponentResultDialog = ({
- onClose,
- classes,
- entities,
- dryRun,
- catalogRouteRef,
-}: Props) => {
- const [open, setOpen] = useState(true);
- const handleClose = () => {
- setOpen(false);
- };
-
- return (
-
- );
-};
diff --git a/plugins/register-component/src/components/RegisterComponentResultDialog/index.ts b/plugins/register-component/src/components/RegisterComponentResultDialog/index.ts
deleted file mode 100644
index 933125fd40..0000000000
--- a/plugins/register-component/src/components/RegisterComponentResultDialog/index.ts
+++ /dev/null
@@ -1,17 +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 { RegisterComponentResultDialog } from './RegisterComponentResultDialog';
diff --git a/plugins/register-component/src/components/Router.tsx b/plugins/register-component/src/components/Router.tsx
deleted file mode 100644
index 88f8d22f38..0000000000
--- a/plugins/register-component/src/components/Router.tsx
+++ /dev/null
@@ -1,36 +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.
- */
-import React from 'react';
-import { Route, Routes } from 'react-router';
-import { RegisterComponentPage } from './RegisterComponentPage';
-import { RouteRef } from '@backstage/core-plugin-api';
-
-// As we don't know which path the catalog's router mounted on
-// We need to inject this from the app
-
-/**
- * Provides a router for registering a component.
- *
- * @deprecated The router for this component is deprecated and replaced with the `catalog-import` plugin.
- * @see https://github.com/backstage/backstage/tree/master/plugins/catalog-import
- */
-export const Router = ({ catalogRouteRef }: { catalogRouteRef: RouteRef }) => (
-
- }
- />
-
-);
diff --git a/plugins/register-component/src/index.ts b/plugins/register-component/src/index.ts
deleted file mode 100644
index 309893679e..0000000000
--- a/plugins/register-component/src/index.ts
+++ /dev/null
@@ -1,22 +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 {
- registerComponentPlugin,
- registerComponentPlugin as plugin,
- RegisterComponentPage,
-} from './plugin';
-export { Router } from './components/Router';
diff --git a/plugins/register-component/src/plugin.test.ts b/plugins/register-component/src/plugin.test.ts
deleted file mode 100644
index c09499beda..0000000000
--- a/plugins/register-component/src/plugin.test.ts
+++ /dev/null
@@ -1,23 +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.
- */
-
-import { registerComponentPlugin } from './plugin';
-
-describe('register-component', () => {
- it('should export plugin', () => {
- expect(registerComponentPlugin).toBeDefined();
- });
-});
diff --git a/plugins/register-component/src/plugin.ts b/plugins/register-component/src/plugin.ts
deleted file mode 100644
index 61e998c94f..0000000000
--- a/plugins/register-component/src/plugin.ts
+++ /dev/null
@@ -1,42 +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.
- */
-
-import {
- createPlugin,
- createRoutableExtension,
- createRouteRef,
-} from '@backstage/core-plugin-api';
-
-const rootRouteRef = createRouteRef({
- title: 'Register Component',
-});
-
-export const registerComponentPlugin = createPlugin({
- id: 'register-component',
- routes: {
- root: rootRouteRef,
- },
-});
-
-export const RegisterComponentPage = registerComponentPlugin.provide(
- createRoutableExtension({
- component: () =>
- import('./components/RegisterComponentPage').then(
- m => m.RegisterComponentPage,
- ),
- mountPoint: rootRouteRef,
- }),
-);
diff --git a/plugins/register-component/src/setupTests.ts b/plugins/register-component/src/setupTests.ts
deleted file mode 100644
index 963c0f188b..0000000000
--- a/plugins/register-component/src/setupTests.ts
+++ /dev/null
@@ -1,17 +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.
- */
-
-import '@testing-library/jest-dom';
diff --git a/plugins/register-component/src/util/validate.test.ts b/plugins/register-component/src/util/validate.test.ts
deleted file mode 100644
index 576dc9f367..0000000000
--- a/plugins/register-component/src/util/validate.test.ts
+++ /dev/null
@@ -1,48 +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.
- */
-
-import { ComponentIdValidators } from './validate';
-
-describe('ComponentIdValidators', () => {
- describe('httpsValidator validator', () => {
- const errorMessage = 'Must start with https://.';
- test.each([
- [true, 'https://example.com'],
- [errorMessage, 'http://example.com'],
- [errorMessage, 'example.com'],
- [errorMessage, 'www.example.com'],
- [errorMessage, ''],
- [errorMessage, undefined],
- ])('should return %p for %s', (expected: string | boolean, arg: any) => {
- expect(ComponentIdValidators.httpsValidator(arg)).toBe(expected);
- });
- });
- describe('yamlValidator', () => {
- const errorMessage = "Must contain '.yaml'.";
- test.each([
- [true, '.yaml'],
- [true, 'http://example.com/blob/master/service.yaml'],
- [true, 'https://example.yaml'],
- [true, 'https://example.com?path=abc.yaml&c=1'],
- [errorMessage, 'https://example.com?path=abc_yaml&c=1'],
- [errorMessage, '.yml'],
- [errorMessage, 'http://example.com/blob/master/service'],
- [errorMessage, undefined],
- ])('should return %p for %s', (expected: string | boolean, arg: any) => {
- expect(ComponentIdValidators.yamlValidator(arg)).toBe(expected);
- });
- });
-});
diff --git a/plugins/register-component/src/util/validate.ts b/plugins/register-component/src/util/validate.ts
deleted file mode 100644
index 0b3a6f6940..0000000000
--- a/plugins/register-component/src/util/validate.ts
+++ /dev/null
@@ -1,24 +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 const ComponentIdValidators = {
- httpsValidator: (value: any) =>
- (typeof value === 'string' && value.match(/^https:\/\//) !== null) ||
- 'Must start with https://.',
- yamlValidator: (value: any) =>
- (typeof value === 'string' && value.match(/\.yaml/) !== null) ||
- "Must contain '.yaml'.",
-};
diff --git a/plugins/register-component/tsconfig.json b/plugins/register-component/tsconfig.json
deleted file mode 100644
index b663b01fa2..0000000000
--- a/plugins/register-component/tsconfig.json
+++ /dev/null
@@ -1,5 +0,0 @@
-{
- "extends": "../../tsconfig.json",
- "include": ["src", "dev"],
- "compilerOptions": {}
-}
-
-
-
-
-
-## Standalone setup
-
-1. Install plugin and its dependency `plugin-catalog`
-
-```bash
-# From your Backstage root directory
-cd packages/app
-yarn add @backstage/plugin-register-component
-```
-
-2. Add the `RegisterComponentPage` extension to your `App.tsx`:
-
-```tsx
-// packages/app/src/App.tsx
-import { RegisterComponentPage } from '@backstage/plugin-cost-insights';
-
-