Merge pull request transitive-bullshit#386 from transitive-bullshit/f…

…eature/prettier-plugin-sort-imports

.prettierrc

@@ -7,5 +7,14 @@
   "bracketSpacing": true,
   "bracketSameLine": false,
   "arrowParens": "always",
-  "trailingComma": "none"
+  "trailingComma": "none",
+  "importOrder": [
+    "^(react/(.*)$)|^(react$)|^(next/(.*)$)|^(next$)",
+    "<THIRD_PARTY_MODULES>",
+    "^(@/lib/(.*)$)|^(@/components/(.*)$)|^(@/styles/(.*)$)",
+    "^[./]"
+  ],
+  "importOrderSeparation": true,
+  "importOrderSortSpecifiers": true,
+  "importOrderGroupNamespaceSpecifiers": true
 }

components/ErrorPage.tsx

@@ -1,6 +1,6 @@
 import * as React from 'react'
-import { PageHead } from './PageHead'
 
+import { PageHead } from './PageHead'
 import styles from './styles.module.css'
 
 export const ErrorPage: React.FC<{ statusCode: number }> = ({ statusCode }) => {

components/Footer.tsx

@@ -1,15 +1,16 @@
 import * as React from 'react'
-import { FaTwitter } from '@react-icons/all-files/fa/FaTwitter'
-import { FaZhihu } from '@react-icons/all-files/fa/FaZhihu'
+
+import { FaEnvelopeOpenText } from '@react-icons/all-files/fa/FaEnvelopeOpenText'
 import { FaGithub } from '@react-icons/all-files/fa/FaGithub'
 import { FaLinkedin } from '@react-icons/all-files/fa/FaLinkedin'
-import { FaEnvelopeOpenText } from '@react-icons/all-files/fa/FaEnvelopeOpenText'
+import { FaTwitter } from '@react-icons/all-files/fa/FaTwitter'
 import { FaYoutube } from '@react-icons/all-files/fa/FaYoutube'
-import { IoSunnyOutline } from '@react-icons/all-files/io5/IoSunnyOutline'
+import { FaZhihu } from '@react-icons/all-files/fa/FaZhihu'
 import { IoMoonSharp } from '@react-icons/all-files/io5/IoMoonSharp'
+import { IoSunnyOutline } from '@react-icons/all-files/io5/IoSunnyOutline'
 
-import { useDarkMode } from 'lib/use-dark-mode'
-import * as config from 'lib/config'
+import * as config from '@/lib/config'
+import { useDarkMode } from '@/lib/use-dark-mode'
 
 import styles from './styles.module.css'
 

components/Loading.tsx

@@ -1,6 +1,6 @@
 import * as React from 'react'
-import { LoadingIcon } from './LoadingIcon'
 
+import { LoadingIcon } from './LoadingIcon'
 import styles from './styles.module.css'
 
 export const Loading: React.FC = () => (

components/LoadingIcon.tsx

@@ -1,5 +1,7 @@
 import * as React from 'react'
+
 import cs from 'classnames'
+
 import styles from './styles.module.css'
 
 export const LoadingIcon = (props) => {

components/NotionPage.tsx

@@ -1,36 +1,31 @@
 import * as React from 'react'
-import Link from 'next/link'
-import Image from 'next/image'
 import dynamic from 'next/dynamic'
-import cs from 'classnames'
+import Image from 'next/image'
+import Link from 'next/link'
 import { useRouter } from 'next/router'
-import { useSearchParam } from 'react-use'
-import BodyClassName from 'react-body-classname'
-import { PageBlock } from 'notion-types'
-
-import TweetEmbed from 'react-tweet-embed'
 
-// core notion renderer
+import cs from 'classnames'
+import { PageBlock } from 'notion-types'
+import { formatDate, getBlockTitle, getPageProperty } from 'notion-utils'
+import BodyClassName from 'react-body-classname'
 import { NotionRenderer } from 'react-notion-x'
+import TweetEmbed from 'react-tweet-embed'
+import { useSearchParam } from 'react-use'
 
-// utils
-import { getBlockTitle, getPageProperty, formatDate } from 'notion-utils'
-import { mapPageUrl, getCanonicalPageUrl } from 'lib/map-page-url'
-import { mapImageUrl } from 'lib/map-image-url'
-import { searchNotion } from 'lib/search-notion'
-import { useDarkMode } from 'lib/use-dark-mode'
-import * as types from 'lib/types'
-import * as config from 'lib/config'
+import * as config from '@/lib/config'
+import * as types from '@/lib/types'
+import { mapImageUrl } from '@/lib/map-image-url'
+import { getCanonicalPageUrl, mapPageUrl } from '@/lib/map-page-url'
+import { searchNotion } from '@/lib/search-notion'
+import { useDarkMode } from '@/lib/use-dark-mode'
 
-// components
+import { Footer } from './Footer'
+import { GitHubShareButton } from './GitHubShareButton'
 import { Loading } from './Loading'
+import { NotionPageHeader } from './NotionPageHeader'
 import { Page404 } from './Page404'
-import { PageHead } from './PageHead'
 import { PageAside } from './PageAside'
-import { Footer } from './Footer'
-import { NotionPageHeader } from './NotionPageHeader'
-import { GitHubShareButton } from './GitHubShareButton'
-
+import { PageHead } from './PageHead'
 import styles from './styles.module.css'
 
 // -----------------------------------------------------------------------------

components/NotionPageHeader.tsx

@@ -1,12 +1,13 @@
 import * as React from 'react'
-import cs from 'classnames'
-import { IoSunnyOutline } from '@react-icons/all-files/io5/IoSunnyOutline'
-import { IoMoonSharp } from '@react-icons/all-files/io5/IoMoonSharp'
-import { Header, Breadcrumbs, Search, useNotionContext } from 'react-notion-x'
+
 import * as types from 'notion-types'
+import { IoMoonSharp } from '@react-icons/all-files/io5/IoMoonSharp'
+import { IoSunnyOutline } from '@react-icons/all-files/io5/IoSunnyOutline'
+import cs from 'classnames'
+import { Breadcrumbs, Header, Search, useNotionContext } from 'react-notion-x'
 
-import { useDarkMode } from 'lib/use-dark-mode'
-import { navigationStyle, navigationLinks, isSearchEnabled } from 'lib/config'
+import { isSearchEnabled, navigationLinks, navigationStyle } from '@/lib/config'
+import { useDarkMode } from '@/lib/use-dark-mode'
 
 import styles from './styles.module.css'
 

components/Page404.tsx

@@ -1,7 +1,8 @@
 import * as React from 'react'
-import * as types from 'lib/types'
-import { PageHead } from './PageHead'
 
+import * as types from '@/lib/types'
+
+import { PageHead } from './PageHead'
 import styles from './styles.module.css'
 
 export const Page404: React.FC<types.PageProps> = ({ site, pageId, error }) => {

components/PageActions.tsx

@@ -1,6 +1,7 @@
 import * as React from 'react'
-import { IoHeartOutline } from '@react-icons/all-files/io5/IoHeartOutline'
+
 import { AiOutlineRetweet } from '@react-icons/all-files/ai/AiOutlineRetweet'
+import { IoHeartOutline } from '@react-icons/all-files/io5/IoHeartOutline'
 
 import styles from './styles.module.css'
 

components/PageAside.tsx

@@ -1,11 +1,12 @@
 import * as React from 'react'
+
 import { Block, ExtendedRecordMap } from 'notion-types'
 
+import { getPageTweet } from '@/lib/get-page-tweet'
+
 import { PageActions } from './PageActions'
 import { PageSocial } from './PageSocial'
 
-import { getPageTweet } from 'lib/get-page-tweet'
-
 export const PageAside: React.FC<{
   block: Block
   recordMap: ExtendedRecordMap

components/PageHead.tsx

@@ -1,9 +1,9 @@
-import Head from 'next/head'
 import * as React from 'react'
+import Head from 'next/head'
 
-import * as types from 'lib/types'
-import * as config from 'lib/config'
-import { getSocialImageUrl } from 'lib/get-social-image-url'
+import * as config from '@/lib/config'
+import * as types from '@/lib/types'
+import { getSocialImageUrl } from '@/lib/get-social-image-url'
 
 export const PageHead: React.FC<
   types.PageProps & {

components/PageSocial.tsx

@@ -1,7 +1,8 @@
 import * as React from 'react'
+
 import cs from 'classnames'
 
-import * as config from 'lib/config'
+import * as config from '@/lib/config'
 
 import styles from './PageSocial.module.css'
 

lib/config.ts

@@ -4,15 +4,15 @@
  * This file pulls from the root "site.config.ts" as well as environment variables
  * for optional depenencies.
  */
-
 import { parsePageId } from 'notion-utils'
 import type posthog from 'posthog-js'
+
 import { getEnv, getSiteConfig } from './get-config-value'
 import { NavigationLink } from './site-config'
 import {
+  NavigationStyle,
   PageUrlOverridesInverseMap,
   PageUrlOverridesMap,
-  NavigationStyle,
   Site
 } from './types'
 

lib/db.ts

@@ -1,7 +1,7 @@
 import Keyv from '@keyvhq/core'
 import KeyvRedis from '@keyvhq/redis'
 
-import { isRedisEnabled, redisUrl, redisNamespace } from './config'
+import { isRedisEnabled, redisNamespace, redisUrl } from './config'
 
 let db: Keyv
 if (isRedisEnabled) {

lib/get-canonical-page-id.ts

@@ -1,7 +1,7 @@
 import { ExtendedRecordMap } from 'notion-types'
 import {
-  parsePageId,
-  getCanonicalPageId as getCanonicalPageIdImpl
+  getCanonicalPageId as getCanonicalPageIdImpl,
+  parsePageId
 } from 'notion-utils'
 
 import { inversePageUrlOverrides } from './config'

lib/get-page-tweet.ts

@@ -1,6 +1,7 @@
-import * as types from './types'
 import { getPageProperty } from 'notion-utils'
 
+import * as types from './types'
+
 export function getPageTweet(
   block: types.Block,
   recordMap: types.ExtendedRecordMap

lib/get-site-map.ts

@@ -1,11 +1,11 @@
-import pMemoize from 'p-memoize'
 import { getAllPagesInSpace, uuidToId } from 'notion-utils'
+import pMemoize from 'p-memoize'
 
-import { includeNotionIdInUrls } from './config'
-import { notion } from './notion-api'
-import { getCanonicalPageId } from './get-canonical-page-id'
 import * as config from './config'
 import * as types from './types'
+import { includeNotionIdInUrls } from './config'
+import { getCanonicalPageId } from './get-canonical-page-id'
+import { notion } from './notion-api'
 
 const uuid = !!includeNotionIdInUrls
 

lib/map-image-url.ts

@@ -1,7 +1,7 @@
 import { Block } from 'notion-types'
 import { defaultMapImageUrl } from 'react-notion-x'
 
-import { defaultPageIcon, defaultPageCover } from './config'
+import { defaultPageCover, defaultPageIcon } from './config'
 
 export const mapImageUrl = (url: string, block: Block) => {
   if (url === defaultPageCover || url === defaultPageIcon) {

lib/map-page-url.ts

@@ -1,9 +1,9 @@
 import { ExtendedRecordMap } from 'notion-types'
-import { uuidToId, parsePageId } from 'notion-utils'
+import { parsePageId, uuidToId } from 'notion-utils'
 
-import { Site } from './types'
 import { includeNotionIdInUrls } from './config'
 import { getCanonicalPageId } from './get-canonical-page-id'
+import { Site } from './types'
 
 // include UUIDs in page URLs during local development but not in production
 // (they're nice for debugging and speed up local dev)

lib/notion.ts

@@ -1,15 +1,15 @@
-import pMap from 'p-map'
-import pMemoize from 'p-memoize'
 import { ExtendedRecordMap, SearchParams, SearchResults } from 'notion-types'
 import { mergeRecordMaps } from 'notion-utils'
+import pMap from 'p-map'
+import pMemoize from 'p-memoize'
 
-import { notion } from './notion-api'
-import { getPreviewImageMap } from './preview-images'
 import {
   isPreviewImageSupportEnabled,
-  navigationStyle,
-  navigationLinks
+  navigationLinks,
+  navigationStyle
 } from './config'
+import { notion } from './notion-api'
+import { getPreviewImageMap } from './preview-images'
 
 const getNavigationLinkPages = pMemoize(
   async (): Promise<ExtendedRecordMap[]> => {

lib/oembed.ts

@@ -1,6 +1,7 @@
-import { parsePageId, getPageTitle } from 'notion-utils'
-import { getPage } from './notion'
+import { getPageTitle, parsePageId } from 'notion-utils'
+
 import * as config from './config'
+import { getPage } from './notion'
 
 export const oembed = async ({
   url,

lib/preview-images.ts

@@ -1,11 +1,11 @@
 import got from 'got'
 import lqip from 'lqip-modern'
-import pMap from 'p-map'
-import pMemoize from 'p-memoize'
 import { ExtendedRecordMap, PreviewImage, PreviewImageMap } from 'notion-types'
 import { getPageImageUrls, normalizeUrl } from 'notion-utils'
+import pMap from 'p-map'
+import pMemoize from 'p-memoize'
 
-import { defaultPageIcon, defaultPageCover } from './config'
+import { defaultPageCover, defaultPageIcon } from './config'
 import { db } from './db'
 import { mapImageUrl } from './map-image-url'
 

lib/resolve-notion-page.ts

@@ -1,11 +1,11 @@
-import { parsePageId } from 'notion-utils'
 import { ExtendedRecordMap } from 'notion-types'
+import { parsePageId } from 'notion-utils'
 
 import * as acl from './acl'
-import { pageUrlOverrides, pageUrlAdditions, environment, site } from './config'
+import { environment, pageUrlAdditions, pageUrlOverrides, site } from './config'
 import { db } from './db'
-import { getPage } from './notion'
 import { getSiteMap } from './get-site-map'
+import { getPage } from './notion'
 
 export async function resolveNotionPage(domain: string, rawPageId?: string) {
   let pageId: string

lib/search-notion.ts

@@ -1,10 +1,10 @@
 // import ky from 'ky'
+import ExpiryMap from 'expiry-map'
 import fetch from 'isomorphic-unfetch'
 import pMemoize from 'p-memoize'
-import ExpiryMap from 'expiry-map'
 
-import { api } from './config'
 import * as types from './types'
+import { api } from './config'
 
 export const searchNotion = pMemoize(searchNotionImpl, {
   cacheKey: (args) => args[0]?.query,

package.json

@@ -54,6 +54,7 @@
   },
   "devDependencies": {
     "@next/bundle-analyzer": "^12.3.1",
+    "@trivago/prettier-plugin-sort-imports": "^3.3.1",
     "@types/node": "^18.8.5",
     "@types/react": "^18.0.21",
     "@typescript-eslint/eslint-plugin": "^5.40.0",

pages/404.tsx

@@ -1,3 +1,3 @@
-import { Page404 } from 'components'
+import { Page404 } from '@/components/Page404'
 
 export default Page404

pages/[pageId].tsx

@@ -1,10 +1,11 @@
 import * as React from 'react'
 import { GetStaticProps } from 'next'
-import { isDev, domain } from 'lib/config'
-import { getSiteMap } from 'lib/get-site-map'
-import { resolveNotionPage } from 'lib/resolve-notion-page'
-import { PageProps, Params } from 'lib/types'
-import { NotionPage } from 'components'
+
+import { NotionPage } from '@/components/NotionPage'
+import { domain, isDev } from '@/lib/config'
+import { getSiteMap } from '@/lib/get-site-map'
+import { resolveNotionPage } from '@/lib/resolve-notion-page'
+import { PageProps, Params } from '@/lib/types'
 
 export const getStaticProps: GetStaticProps<PageProps, Params> = async (
   context