Use module path aliases for imports (#156)

* Use module path aliases for imports * Use interface for MarkdownFileWithUrl Co-authored-by: ltagliaferri <[email protected]>
sourcegraph · Aug 11, 2021 · fa27418 · fa27418
1 parent 1445037
commit fa27418
Show file tree

Hide file tree

Showing 32 changed files with 114 additions and 122 deletions.
diff --git a/components/Footer/index.tsx b/components/Footer/index.tsx
@@ -1,12 +1,11 @@
+import CreativeCommonsNotice from '@components/atoms/CreativeCommonsNotice'
 import GithubIcon from 'mdi-react/GithubIcon'
 import LinkedinIcon from 'mdi-react/LinkedinIcon'
 import TwitterIcon from 'mdi-react/TwitterIcon'
 import YouTubeIcon from 'mdi-react/YoutubeIcon'
 import Link from 'next/link'
 import React from 'react'
 
-import CreativeCommonsNotice from '../atoms/CreativeCommonsNotice'
-
 import {
     StyledFooterWrapper,
     StyledFooterContainer,

diff --git a/components/Header/index.tsx b/components/Header/index.tsx
@@ -1,8 +1,7 @@
+import HeaderCta from '@components/atoms/HeaderCta'
+import Row from '@components/atoms/Row'
 import React from 'react'
 
-import HeaderCta from '../atoms/HeaderCta'
-import Row from '../atoms/Row'
-
 import { StyledHeaderImage, StyledHeaderText } from './HeaderStyles'
 
 interface Props {

diff --git a/components/NavBar/index.tsx b/components/NavBar/index.tsx
@@ -1,10 +1,9 @@
+import Button from '@components/atoms/Button'
 import MenuDownIcon from 'mdi-react/MenuDownIcon'
 import MenuIcon from 'mdi-react/MenuIcon'
 import MenuUpIcon from 'mdi-react/MenuUpIcon'
 import React, { useState } from 'react'
 
-import Button from '../atoms/Button'
-
 import {
     StyledNavBarWrapper,
     StyledNavBarContainer,

diff --git a/components/atoms/AuthorCard/index.tsx b/components/atoms/AuthorCard/index.tsx
@@ -1,8 +1,7 @@
+import Card from '@components/atoms/Card'
+import ContentCard from '@components/atoms/ContentCard'
 import React from 'react'
 
-import Card from '../Card'
-import ContentCard from '../ContentCard'
-
 import { StyledAuthorImage } from './AuthorCardStyles'
 
 interface Props {

diff --git a/components/atoms/AuthorCardList/index.tsx b/components/atoms/AuthorCardList/index.tsx
@@ -1,9 +1,8 @@
+import AuthorCard from '@components/atoms/AuthorCard'
+import Column from '@components/atoms/Column'
+import AuthorCollection from '@interfaces/AuthorCollection'
 import React from 'react'
 
-import AuthorCollection from '../../../interfaces/AuthorCollection'
-import AuthorCard from '../AuthorCard'
-import Column from '../Column'
-
 import { StyledAuthorCardList } from './AuthorCardListStyles'
 
 interface Props {

diff --git a/components/atoms/CollectionView/index.tsx b/components/atoms/CollectionView/index.tsx
@@ -1,9 +1,8 @@
+import Card from '@components/atoms/Card'
+import MarkdownFile from '@interfaces/MarkdownFile'
 import Link from 'next/link'
 import React from 'react'
 
-import MarkdownFile from '../../../interfaces/MarkdownFile'
-import Card from '../Card'
-
 import {
     StyledCollectionHeader,
     StyledCollectionBody,

diff --git a/components/atoms/ContentCard/index.tsx b/components/atoms/ContentCard/index.tsx
@@ -1,8 +1,7 @@
+import Card from '@components/atoms/Card'
 import Link from 'next/link'
 import React from 'react'
 
-import Card from '../Card'
-
 import {
     StyledCardBody,
     StyledCardTitle,

diff --git a/components/atoms/ContentCardList/index.tsx b/components/atoms/ContentCardList/index.tsx
@@ -1,10 +1,9 @@
+import Column from '@components/atoms/Column'
+import ContentCard from '@components/atoms/ContentCard'
+import Row from '@components/atoms/Row'
+import MarkdownFileWithUrl from '@interfaces/MarkdownFileWithUrl'
 import React from 'react'
 
-import { MarkdownFileWithUrl } from '../../../types/MarkdownFileWithUrl'
-import Column from '../Column'
-import ContentCard from '../ContentCard'
-import Row from '../Row'
-
 interface Props {
     records: MarkdownFileWithUrl[]
 }

diff --git a/components/atoms/CreativeCommonsNotice/index.tsx b/components/atoms/CreativeCommonsNotice/index.tsx
@@ -13,11 +13,19 @@ const CreativeCommonsNotice: React.FunctionComponent = () => (
     <StyledCreativeCommonsNoticeContainer>
         <StyledCreativeCommonsNoticeText>
             This work is licensed under a{' '}
-            <StyledCreativeCommonsLink href={creativeCommonsUrl}>
+            <StyledCreativeCommonsLink 
+                href={creativeCommonsUrl}
+                target="_blank"
+                rel="noreferrer"
+            >
                 Creative Commons Attribution-NonCommercial-ShareAlike 4.0 International License.
             </StyledCreativeCommonsLink>
         </StyledCreativeCommonsNoticeText>
-        <a href={creativeCommonsUrl}>
+        <a 
+            href={creativeCommonsUrl}
+            target="_blank"
+            rel="noreferrer"
+        >
             <StyledCreativeCommonsImage alt="Creative Commons badge" src="/creative-commons-by-nc-sa.svg" />
         </a>
     </StyledCreativeCommonsNoticeContainer>

diff --git a/components/atoms/SourcegraphSearch/index.tsx b/components/atoms/SourcegraphSearch/index.tsx
@@ -1,9 +1,8 @@
+import Button from '@components/atoms/Button'
+import Card from '@components/atoms/Card'
+import Column from '@components/atoms/Column'
 import React, { useState } from 'react'
 
-import Button from '../Button'
-import Card from '../Card'
-import Column from '../Column'
-
 import { StyledSearchBody, StyledSearchInput } from './SourcegraphSearchStyles'
 
 interface Props {

diff --git a/components/layouts/Layout.tsx b/components/layouts/Layout.tsx
@@ -1,11 +1,11 @@
+import Container from '@components/atoms/Container'
+import { GoogleTagManagerScriptTag, GoogleTagManagerNoscriptFrame } from '@components/atoms/GoogleTagManager'
+import Footer from '@components/Footer'
+import NavBar from '@components/NavBar'
 import Head from 'next/head'
 import * as React from 'react'
 
 import { googleTagManagerId } from '../../site-config'
-import Container from '../atoms/Container'
-import { GoogleTagManagerScriptTag, GoogleTagManagerNoscriptFrame } from '../atoms/GoogleTagManager'
-import Footer from '../Footer'
-import NavBar from '../NavBar'
 
 const SITE_TITLE = 'Sourcegraph Learn'
 

diff --git a/components/layouts/PageLayout.tsx b/components/layouts/PageLayout.tsx
@@ -1,10 +1,8 @@
+import Column from '@components/atoms/Column'
+import Row from '@components/atoms/Row'
+import Layout, { Props as LayoutProps, MetaTags } from '@components/layouts/Layout'
 import React from 'react'
 
-import Column from '../atoms/Column'
-import Row from '../atoms/Row'
-
-import Layout, { Props as LayoutProps, MetaTags } from './Layout'
-
 interface Props extends LayoutProps {
     leftColumn?: React.ReactNode
     rightColumn?: React.ReactNode

diff --git a/components/templates/ArticleTemplate/index.tsx b/components/templates/ArticleTemplate/index.tsx
@@ -1,20 +1,19 @@
+import Button from '@components/atoms/Button'
+import CollectionView from '@components/atoms/CollectionView'
+import EmbeddedYoutubeVideo from '@components/atoms/EmbeddedYoutubeVideo'
+import GifLikeVideo from '@components/atoms/GifLikeVideo'
+import SourcegraphSearch from '@components/atoms/SourcegraphSearch'
+import TocWrapper from '@components/atoms/TocWrapper'
+import { MetaTags } from '@components/layouts/Layout'
+import PageLayout from '@components/layouts/PageLayout'
+import RecordCollection from '@interfaces/RecordCollection'
 import RegexIcon from 'mdi-react/RegexIcon'
 import { MDXRemote, MDXRemoteSerializeResult } from 'next-mdx-remote'
 import React from 'react'
 import rehypeReact from 'rehype-react'
 import unified from 'unified'
 import { Node } from 'unist'
 
-import RecordCollection from '../../../interfaces/RecordCollection'
-import Button from '../../atoms/Button'
-import CollectionView from '../../atoms/CollectionView'
-import EmbeddedYoutubeVideo from '../../atoms/EmbeddedYoutubeVideo'
-import GifLikeVideo from '../../atoms/GifLikeVideo'
-import SourcegraphSearch from '../../atoms/SourcegraphSearch'
-import TocWrapper from '../../atoms/TocWrapper'
-import { MetaTags } from '../../layouts/Layout'
-import PageLayout from '../../layouts/PageLayout'
-
 import {
     StyledHeaderImage,
     StyledAuthorByline,

diff --git a/interfaces/MarkdownFile.ts b/interfaces/MarkdownFile.ts
@@ -1,4 +1,4 @@
-import FrontMatter from './FrontMatter'
+import FrontMatter from '@interfaces/FrontMatter'
 
 export default interface MarkdownFile {
     slug: string

diff --git a/interfaces/MarkdownFileWithUrl.ts b/interfaces/MarkdownFileWithUrl.ts
@@ -0,0 +1,5 @@
+import MarkdownFile from '@interfaces/MarkdownFile'
+
+export default interface MarkdownFileWithUrl extends MarkdownFile { 
+    url: string 
+}
diff --git a/interfaces/RecordCollection.ts b/interfaces/RecordCollection.ts
@@ -1,7 +1,7 @@
 /**
  * Description of the fields that are supported in individual record collections
  */
- import MarkdownFile from './MarkdownFile'
+ import MarkdownFile from '@interfaces/MarkdownFile'
 
  export default interface RecordCollection {
     title: string

diff --git a/lib/loadAllRecords.ts b/lib/loadAllRecords.ts
@@ -1,7 +1,6 @@
-import MarkdownFile from '../interfaces/MarkdownFile'
-
-import listAllRecords from './listAllRecords'
-import loadMarkdownFile from './loadMarkdownFile'
+import MarkdownFile from '@interfaces/MarkdownFile'
+import listAllRecords from '@lib/listAllRecords'
+import loadMarkdownFile from '@lib/loadMarkdownFile'
 
 export default async function loadAllRecords(baseDirectory: string, includeUnlisted: boolean = false): Promise<MarkdownFile[]> {
     const records = await listAllRecords(baseDirectory)

diff --git a/lib/loadAuthorCollections.ts b/lib/loadAuthorCollections.ts
@@ -1,10 +1,9 @@
 import { promises as fs } from 'fs'
 
+import AuthorCollection from '@interfaces/AuthorCollection'
+import { normalizeAuthorCollectionDefinition } from '@util/validators'
 import yaml from 'js-yaml'
 
-import AuthorCollection from '../interfaces/AuthorCollection'
-import { normalizeAuthorCollectionDefinition } from '../util/validators'
-
 interface AuthorCollections {
     authors: AuthorCollection[]
 }

diff --git a/lib/loadMarkdownFile.ts b/lib/loadMarkdownFile.ts
@@ -1,11 +1,10 @@
 import { promises as fs } from 'fs'
 import path from 'path'
 
+import MarkdownFile from '@interfaces/MarkdownFile'
+import { normalizeFrontMatter } from '@util/validators'
 import greyMatter from 'gray-matter'
 
-import MarkdownFile from '../interfaces/MarkdownFile'
-import { normalizeFrontMatter } from '../util/validators'
-
 function removeExtension(filename: string): string {
     const parts = filename.split('.')
     if (parts.length > 1) {

diff --git a/lib/loadRecordCollections.ts b/lib/loadRecordCollections.ts
@@ -1,14 +1,12 @@
 import { promises as fs } from 'fs'
 
+import MarkdownFile from '@interfaces/MarkdownFile'
+import RecordCollection from '@interfaces/RecordCollection'
+import RecordCollectionDefinition from '@interfaces/RecordCollectionDefinition'
+import loadAllRecords from '@lib/loadAllRecords'
+import { normalizeRecordCollectionDefinition } from '@util/validators'
 import yaml from 'js-yaml'
 
-import MarkdownFile from '../interfaces/MarkdownFile'
-import RecordCollection from '../interfaces/RecordCollection'
-import RecordCollectionDefinition from '../interfaces/RecordCollectionDefinition'
-import { normalizeRecordCollectionDefinition } from '../util/validators'
-
-import loadAllRecords from './loadAllRecords'
-
 interface RecordCollections {
     recordCollections: RecordCollection[]
 }

diff --git a/lib/serializeMdxSource.ts b/lib/serializeMdxSource.ts
@@ -1,3 +1,4 @@
+import MarkdownFile from '@interfaces/MarkdownFile'
 import rehypePrism from '@mapbox/rehype-prism'
 import mdastUtilToHast from 'mdast-util-to-hast'
 import mdastUtilToc from 'mdast-util-toc'
@@ -8,8 +9,6 @@ import rehypeAutolinkHeadings from 'rehype-autolink-headings'
 import rehypeSlug from 'rehype-slug'
 import { Node } from 'unist'
 
-import MarkdownFile from '../interfaces/MarkdownFile'
-
 /**
  * Classes to add to elements in the rendered markdown (after the HTML is
  * generated). This is used to add utility styles to elements in markdown

diff --git a/pages/404.tsx b/pages/404.tsx
@@ -1,8 +1,7 @@
+import Layout from '@components/layouts/Layout'
+import ErrorTemplate from '@components/templates/ErrorTemplate'
 import * as React from 'react'
 
-import Layout from '../components/layouts/Layout'
-import ErrorTemplate from '../components/templates/ErrorTemplate'
-
 export const NotFoundPage: React.FunctionComponent = () => (
     <Layout>
         <ErrorTemplate />

diff --git a/pages/[slug].tsx b/pages/[slug].tsx
@@ -1,13 +1,13 @@
+import loadAllRecords from '@lib/loadAllRecords'
+import loadMarkdownFile from '@lib/loadMarkdownFile'
+import loadRecordCollections from '@lib/loadRecordCollections'
+import serializeMdxSource from '@lib/serializeMdxSource'
+import getQueryParameter from '@util/getQueryParameters'
+import omitUndefinedFields from '@util/omitUndefinedFields'
+import slugToTitleCase from '@util/slugToTitleCase'
 import { GetStaticPaths, GetStaticProps } from 'next'
 
 import ArticleTemplate, { Props as ArticleTemplateProps } from '../components/templates/ArticleTemplate'
-import loadAllRecords from '../lib/loadAllRecords'
-import loadMarkdownFile from '../lib/loadMarkdownFile'
-import loadRecordCollections from '../lib/loadRecordCollections'
-import serializeMdxSource from '../lib/serializeMdxSource'
-import getQueryParameter from '../util/getQueryParameters'
-import omitUndefinedFields from '../util/omitUndefinedFields'
-import slugToTitleCase from '../util/slugToTitleCase'
 
 export const getStaticPaths: GetStaticPaths = async () => {
     const posts = await loadAllRecords('posts', true)

diff --git a/pages/_app.tsx b/pages/_app.tsx
@@ -1,7 +1,7 @@
 import { AppProps } from 'next/app'
 import React from 'react'
 
-import '../styles/styles.scss'
+import '@styles/styles.scss'
 
 const App: React.FunctionComponent<AppProps> = ({ Component, pageProps }) => <Component {...pageProps} />
 

diff --git a/pages/authors/index.tsx b/pages/authors/index.tsx
@@ -1,16 +1,12 @@
+import AuthorCardList from '@components/atoms/AuthorCardList'
+import PageLayout from '@components/layouts/PageLayout'
+import AuthorCollection from '@interfaces/AuthorCollection'
+import loadAllRecords from '@lib/loadAllRecords'
+import loadAuthorCollections from '@lib/loadAuthorCollections'
+import omitUndefinedFields from '@util/omitUndefinedFields'
 import { GetStaticProps } from 'next'
 import React from 'react'
 
-import AuthorCardList from '../../components/atoms/AuthorCardList'
-import PageLayout from '../../components/layouts/PageLayout'
-import AuthorCollection from '../../interfaces/AuthorCollection'
-import MarkdownFile from '../../interfaces/MarkdownFile'
-import loadAllRecords from '../../lib/loadAllRecords'
-import loadAuthorCollections from '../../lib/loadAuthorCollections'
-import omitUndefinedFields from '../../util/omitUndefinedFields'
-
-export type MarkdownFileWithUrl = MarkdownFile & { url: string }
-
 interface Props {
     uniqueAuthors: AuthorCollection[]
 }

diff --git a/pages/guides/[slug].tsx b/pages/guides/[slug].tsx
@@ -1,12 +1,12 @@
+import loadAllRecords from '@lib/loadAllRecords'
+import loadMarkdownFile from '@lib/loadMarkdownFile'
+import serializeMdxSource from '@lib/serializeMdxSource'
+import getQueryParameter from '@util/getQueryParameters'
+import omitUndefinedFields from '@util/omitUndefinedFields'
+import slugToTitleCase from '@util/slugToTitleCase'
 import { GetStaticPaths, GetStaticProps } from 'next'
 
 import ArticleTemplate, { Props as ArticleTemplateProps } from '../../components/templates/ArticleTemplate'
-import loadAllRecords from '../../lib/loadAllRecords'
-import loadMarkdownFile from '../../lib/loadMarkdownFile'
-import serializeMdxSource from '../../lib/serializeMdxSource'
-import getQueryParameter from '../../util/getQueryParameters'
-import omitUndefinedFields from '../../util/omitUndefinedFields'
-import slugToTitleCase from '../../util/slugToTitleCase'
 
 export const getStaticPaths: GetStaticPaths = async () => {
     const guides = await loadAllRecords('guides', true)

diff --git a/pages/index.tsx b/pages/index.tsx
@@ -1,13 +1,12 @@
+import ContentCardList from '@components/atoms/ContentCardList'
+import Header from '@components/Header'
+import PageLayout from '@components/layouts/PageLayout'
+import MarkdownFileWithUrl from '@interfaces/MarkdownFileWithUrl'
+import loadAllRecords from '@lib/loadAllRecords'
+import omitUndefinedFields from '@util/omitUndefinedFields'
 import { GetStaticProps } from 'next'
 import React from 'react'
 
-import ContentCardList from '../components/atoms/ContentCardList'
-import Header from '../components/Header'
-import PageLayout from '../components/layouts/PageLayout'
-import loadAllRecords from '../lib/loadAllRecords'
-import { MarkdownFileWithUrl } from '../types/MarkdownFileWithUrl'
-import omitUndefinedFields from '../util/omitUndefinedFields'
-
 interface Props {
     posts: MarkdownFileWithUrl[]
 }