import { Meta } from '@storybook/addon-docs';
import Link from '@cloudscape-design/components/link';

<Meta title="Migration/MigratingFromLegacy" />

# Migrating from NorthStar legacy

## Before you start

### Styling

NorthStar v2 is built leveraging Cloudscape components using its global styling theme as base. 
The styling of those components may look differently from the previous version of NorthStar. 

Screenshot - NorthStar Legacy AppLayout                                  | Screenshot - NorthStar v2 AppLayout 
------------------------------------------------------------------------ |:-------------------------------------------------------------
![NorthStar Legacy AppLayout](./img/screenshot-northstar-legacy.png)     | ![NorthStar V2 AppLayout](./img/screenshot-northstar-v2.png)


### Components to be ported

The list below includes components that have not been ported to NorthStar v2 and there are not matched Cloudscape components. 
If you have an existing NorthStar legacy application using these components and would like to migration it to NorthStar v2. Please raise a [GitHub issue](https://github.com/aws/aws-northstar/issues/new?assignees=&labels=enhancement&template=feature_request.md&title=%5bV2%5d%5bMigration%5d%3CComponentName%3E) if assistant is required. 
We will support you on the migration of these components. 

* [Hidden](https://northstar.aws-prototyping.cloud/#/Layouts/Hidden)
* [JupyterNotebook](https://northstar.aws-prototyping.cloud/#/Advanced%20Components/JupyterNotebook)
* [Map](https://northstar.aws-prototyping.cloud/#/Components/Map)
* [NotificationButton](https://northstar.aws-prototyping.cloud/#/Advanced%20Components/NotificationButton)
* [Overlay](https://northstar.aws-prototyping.cloud/#/Components/Overlay)
* [PivotTable](https://northstar.aws-prototyping.cloud/#/Components/PivotTable)
* [Placeholder](https://northstar.aws-prototyping.cloud/#/Components/Placeholder)
* [TreeView](https://northstar.aws-prototyping.cloud/#/Components/TreeView)
* [ScatterChart](https://northstar.aws-prototyping.cloud/#/Charts/ScatterChart)

## Migration steps

Refer to the migration steps under Migration folder for each component.