Merge pull request #516 from spotify/rugvip/relative

packages,plugins: make src-relative imports work everywhere

packages/cli/templates/default-app/plugins/welcome/tsconfig.json

@@ -1,4 +1,7 @@
 {
   "extends": "../../tsconfig.json",
-  "include": ["src"]
+  "include": ["src"],
+  "compilerOptions": {
+    "baseUrl": "src"
+  }
 }

packages/cli/templates/default-plugin/tsconfig.json

@@ -1,4 +1,7 @@
 {
   "extends": "../../tsconfig.json",
-  "include": ["src"]
+  "include": ["src"],
+  "compilerOptions": {
+    "baseUrl": "src"
+  }
 }

packages/core/src/api/apis/definitions/featureFlags.ts

@@ -19,7 +19,7 @@ import {
   UserFlags,
   FeatureFlagsRegistry,
   FeatureFlagsRegistryItem,
-} from '../../app/FeatureFlags';
+} from 'api/app/FeatureFlags';
 
 /**
  * The feature flags API is used to toggle functionality to users across plugins and Backstage.

packages/core/src/api/app/AppBuilder.tsx

@@ -18,16 +18,16 @@ import React, { ComponentType } from 'react';
 import { Route, Switch, Redirect } from 'react-router-dom';
 import { AppContextProvider } from './AppContext';
 import { App } from './types';
-import BackstagePlugin from '../plugin/Plugin';
+import BackstagePlugin from 'api/plugin/Plugin';
 import { FeatureFlagsRegistryItem } from './FeatureFlags';
-import { featureFlagsApiRef } from '../apis/definitions/featureFlags';
+import { featureFlagsApiRef } from 'api/apis/definitions/featureFlags';
 import {
   IconComponent,
   SystemIcons,
   SystemIconKey,
   defaultSystemIcons,
-} from '../../icons';
-import { ApiHolder, ApiProvider } from '../apis';
+} from 'icons';
+import { ApiHolder, ApiProvider } from 'api/apis';
 import LoginPage from './LoginPage';
 
 class AppImpl implements App {

packages/core/src/api/app/FeatureFlags.test.tsx

@@ -15,7 +15,7 @@
  */
 
 import { FeatureFlags as FeatureFlagsImpl } from './FeatureFlags';
-import { FeatureFlagState } from '../apis/definitions/featureFlags';
+import { FeatureFlagState } from 'api/apis/definitions/featureFlags';
 
 describe('FeatureFlags', () => {
   beforeEach(() => {

packages/core/src/api/app/FeatureFlags.tsx

@@ -14,11 +14,11 @@
  * limitations under the License.
  */
 
-import { FeatureFlagName } from '../plugin/types';
+import { FeatureFlagName } from 'api/plugin/types';
 import {
   FeatureFlagState,
   FeatureFlagsApi,
-} from '../apis/definitions/featureFlags';
+} from 'api/apis/definitions/featureFlags';
 
 /**
  * Helper method for validating compatibility and flag name.

packages/core/src/api/app/LoginPage/LoginPage.tsx

@@ -16,10 +16,10 @@
 
 import React, { FC, useState } from 'react';
 import { GitHub as GitHubIcon } from '@material-ui/icons';
-import Page from '../../../layout/Page';
-import Header from '../../../layout/Header';
-import Content from '../../../layout/Content/Content';
-import ContentHeader from '../../../layout/ContentHeader/ContentHeader';
+import Page from 'layout/Page';
+import Header from 'layout/Header';
+import Content from 'layout/Content/Content';
+import ContentHeader from 'layout/ContentHeader/ContentHeader';
 import {
   Grid,
   Typography,
@@ -29,7 +29,7 @@ import {
   ListItem,
   Link,
 } from '@material-ui/core';
-import InfoCard from '../../../layout/InfoCard/InfoCard';
+import InfoCard from 'layout/InfoCard/InfoCard';
 
 enum AuthType {
   GitHub,

packages/core/src/api/app/types.ts

@@ -15,7 +15,7 @@
  */
 
 import { ComponentType } from 'react';
-import { IconComponent, SystemIconKey } from '../../icons';
+import { IconComponent, SystemIconKey } from 'icons';
 
 export type App = {
   getSystemIcon(key: SystemIconKey): IconComponent;

packages/core/src/api/plugin/Plugin.tsx

@@ -21,8 +21,8 @@ import {
   RouteOptions,
   FeatureFlagName,
 } from './types';
-import { validateBrowserCompat, validateFlagName } from '../app/FeatureFlags';
-import { Widget } from '../widgetView/types';
+import { validateBrowserCompat, validateFlagName } from 'api/app/FeatureFlags';
+import { Widget } from 'api/widgetView/types';
 
 export type PluginConfig = {
   id: string;

packages/core/src/api/plugin/types.ts

@@ -15,7 +15,7 @@
  */
 
 import { ComponentType } from 'react';
-import { Widget } from '../widgetView/types';
+import { Widget } from 'api/widgetView/types';
 
 export type RouteOptions = {
   // Whether the route path must match exactly, defaults to true.

packages/core/src/api/widgetView/WidgetViewBuilder.tsx

@@ -15,10 +15,10 @@
  */
 
 import React, { ComponentType } from 'react';
-import { AppComponentBuilder } from '../app/types';
+import { AppComponentBuilder } from 'api/app/types';
 import { Widget } from './types';
-import BackstagePlugin from '../plugin/Plugin';
-import DefaultWidgetView from '../../components/DefaultWidgetView';
+import BackstagePlugin from 'api/plugin/Plugin';
+import DefaultWidgetView from 'components/DefaultWidgetView';
 
 type WidgetViewRegistration =
   | {

packages/core/src/components/DefaultWidgetView/DefaultWidgetView.tsx

@@ -16,7 +16,7 @@
 
 import React, { FC } from 'react';
 import { Grid, Paper, makeStyles, Theme } from '@material-ui/core';
-import { WidgetViewProps } from '../../api/widgetView/types';
+import { WidgetViewProps } from 'api/widgetView/types';
 
 const useStyles = makeStyles<Theme>(theme => ({
   root: {

packages/core/src/components/ProgressCard.tsx

@@ -17,8 +17,8 @@
 import React, { FC } from 'react';
 import { makeStyles } from '@material-ui/core';
 
-import InfoCard from '../layout/InfoCard';
-import { Props as BottomLinkProps } from '../layout/InfoCard/BottomLink';
+import InfoCard from 'layout/InfoCard';
+import { Props as BottomLinkProps } from 'layout/InfoCard/BottomLink';
 import CircleProgress from './CircleProgress';
 
 type Props = {

packages/core/src/icons/icons.tsx

@@ -18,7 +18,7 @@ import { SvgIconProps } from '@material-ui/core';
 import PeopleIcon from '@material-ui/icons/People';
 import PersonIcon from '@material-ui/icons/Person';
 import React, { FC } from 'react';
-import { useApp } from '../api/app/AppContext';
+import { useApp } from 'api/app/AppContext';
 import { IconComponent, SystemIconKey, SystemIcons } from './types';
 
 export const defaultSystemIcons: SystemIcons = {

packages/core/src/layout/Header/Header.tsx

@@ -19,7 +19,7 @@ import Helmet from 'react-helmet';
 import { Typography, Tooltip, makeStyles } from '@material-ui/core';
 import { BackstageTheme } from '@backstage/theme';
 
-import { Theme } from '../Page/Page';
+import { Theme } from 'layout/Page/Page';
 // import { Link } from 'shared/components';
 import Waves from './Waves';
 

packages/core/src/layout/Header/Waves.test.tsx

@@ -16,7 +16,7 @@
 
 import React from 'react';
 import { render } from '@testing-library/react';
-import { pageTheme } from '../Page/PageThemeProvider';
+import { pageTheme } from 'layout/Page/PageThemeProvider';
 import Waves from './Waves';
 
 describe('<Waves/>', () => {

packages/core/src/layout/Header/Waves.tsx

@@ -16,7 +16,7 @@
 
 import React, { FC } from 'react';
 import { makeStyles } from '@material-ui/core';
-import { PageTheme } from '../Page';
+import { PageTheme } from 'layout/Page';
 
 const useStyles = makeStyles<PageTheme>({
   wave: {

packages/core/src/layout/HeaderLabel/OwnerHeaderLabel.js

@@ -18,7 +18,7 @@ import React, { Component } from 'react';
 import PropTypes from 'prop-types';
 import { Tooltip, Link, withStyles } from '@material-ui/core';
 
-import { StatusError } from '../../components/Status';
+import { StatusError } from 'components/Status';
 import HeaderLabel from './HeaderLabel';
 
 const style = theme => ({

packages/core/src/layout/InfoCard/InfoCard.tsx

@@ -24,7 +24,7 @@ import {
   withStyles,
   makeStyles,
 } from '@material-ui/core';
-import ErrorBoundary from '../ErrorBoundary/ErrorBoundary';
+import ErrorBoundary from 'layout/ErrorBoundary/ErrorBoundary';
 import BottomLink, { Props as BottomLinkProps } from './BottomLink';
 
 const useStyles = makeStyles(theme => ({

packages/core/tsconfig.json

@@ -2,6 +2,7 @@
   "extends": "../../tsconfig.json",
   "include": ["src"],
   "compilerOptions": {
+    "baseUrl": "src",
     "noImplicitAny": false
   }
 }

packages/storybook/.storybook/main.js

@@ -1,3 +1,5 @@
+const path = require('path');
+
 module.exports = {
   stories: [
     '../../core/src/layout/**/*.stories.tsx',
@@ -5,6 +7,7 @@ module.exports = {
   ],
   addons: ['@storybook/addon-actions', '@storybook/addon-links'],
   webpackFinal: async config => {
+    config.resolve.modules.push(path.resolve(__dirname, '../../core/src'));
     config.module.rules.push(
       {
         test: /\.(ts|tsx)$/,

packages/test-utils/tsconfig.json

@@ -1,4 +1,7 @@
 {
   "extends": "../../tsconfig.json",
-  "include": ["src"]
+  "include": ["src"],
+  "compilerOptions": {
+    "baseUrl": "src"
+  }
 }

packages/theme/tsconfig.json

@@ -1,4 +1,7 @@
 {
   "extends": "../../tsconfig.json",
-  "include": ["src"]
+  "include": ["src"],
+  "compilerOptions": {
+    "baseUrl": "src"
+  }
 }

plugins/home-page/src/components/HomePage/HomePage.tsx

@@ -16,7 +16,7 @@
 
 import React, { FC } from 'react';
 import { Typography, Link, Grid } from '@material-ui/core';
-import HomePageTimer from '../HomepageTimer';
+import HomePageTimer from 'components/HomepageTimer';
 import { Content, InfoCard, Header, Page, pageTheme } from '@backstage/core';
 import SquadTechHealth from './SquadTechHealth';
 import Table from '@material-ui/core/Table';

plugins/home-page/src/plugin.ts

@@ -15,7 +15,7 @@
  */
 
 import { createPlugin } from '@backstage/core';
-import HomePage from './components/HomePage';
+import HomePage from 'components/HomePage';
 
 export default createPlugin({
   id: 'home-page',

plugins/home-page/tsconfig.json

@@ -1,4 +1,7 @@
 {
   "extends": "../../tsconfig.json",
-  "include": ["src"]
+  "include": ["src"],
+  "compilerOptions": {
+    "baseUrl": "src"
+  }
 }

plugins/welcome/src/components/WelcomePage/WelcomePage.tsx

@@ -24,7 +24,7 @@ import {
   ListItemText,
   Link,
 } from '@material-ui/core';
-import Timer from '../Timer';
+import Timer from 'components/Timer';
 import {
   Content,
   InfoCard,

plugins/welcome/src/plugin.ts

@@ -15,7 +15,7 @@
  */
 
 import { createPlugin } from '@backstage/core';
-import WelcomePage from './components/WelcomePage';
+import WelcomePage from 'components/WelcomePage';
 
 export default createPlugin({
   id: 'welcome',

plugins/welcome/tsconfig.json

@@ -1,4 +1,7 @@
 {
   "extends": "../../tsconfig.json",
-  "include": ["src"]
+  "include": ["src"],
+  "compilerOptions": {
+    "baseUrl": "src"
+  }
 }