Rename archive components

gatsby-node.js

@@ -7,7 +7,7 @@ const fs = require("fs")
 const requiredArticleFrontmatter = ["authors", "date"]
 
 const LAYOUT_RESOURCES = "resources"
-const LAYOUT_ARCHIVES = "spotlights"
+const LAYOUT_SPOTLIGHTS = "spotlights"
 const LAYOUT_REGULAR = "regular"
 const LAYOUT_HOME = "home"
 
@@ -21,7 +21,7 @@ function resolveLayout(path) {
   }
 
   if (path.match(/spotlights/)) {
-    return LAYOUT_ARCHIVES
+    return LAYOUT_SPOTLIGHTS
   }
 
   return LAYOUT_REGULAR
@@ -128,11 +128,11 @@ const createResources = async ({ createPage, graphql }) => {
   }
 }
 
-const createArchives = async ({ createPage, graphql }) => {
+const createSpotlights = async ({ createPage, graphql }) => {
-  const archive = path.resolve(`src/templates/archive.tsx`)
+  const spotlights = path.resolve(`src/templates/spotlight.tsx`)
 
   const result = await graphql(`
-    query FetchArchives {
+    query FetchSpotlights {
       allFile(filter: { sourceInstanceName: { eq: "spotlights" } }) {
         edges {
           node {
@@ -151,10 +151,10 @@ const createArchives = async ({ createPage, graphql }) => {
   return result.data.allFile.edges.forEach(({ node }) => {
     createPage({
       path: path.posix.join("spotlights", node.relativePath),
-      component: archive,
+      component: spotlights,
       context: {
         file: node.relativePath,
-        layout: LAYOUT_ARCHIVES,
+        layout: LAYOUT_SPOTLIGHTS,
       },
     })
   })
@@ -211,7 +211,7 @@ exports.createPages = ({ actions, graphql }) => {
   const { createPage } = actions
 
   return Promise.all([
-    createArchives({ createPage, graphql }),
+    createSpotlights({ createPage, graphql }),
     createResources({ createPage, graphql }),
   ])
 }

src/components/SpotlightsSidebar/index.tsx

@@ -9,7 +9,7 @@ import { humanize } from "../../utils"
 import { Sidebar } from "../Sidebar"
 import * as SC from "./styles"
 
-const ALL_ARCHIVES = graphql`
+const ALL_SPOTLIGHTS = graphql`
   query {
     spotlights: allFile(
       filter: { sourceInstanceName: { eq: "spotlights" } }
@@ -42,9 +42,9 @@ function Tree({ item }: { item: IFileOrFolder }) {
   )
 }
 
-export const ArchivesSidebar: FC<HTMLAttributes<HTMLDivElement>> = (props) => {
+export const SpotlightsSidebar: FC<HTMLAttributes<HTMLDivElement>> = (props) => {
-  const { archives } = useStaticQuery(ALL_ARCHIVES)
+  const { spotlights } = useStaticQuery(ALL_SPOTLIGHTS)
-  const tree = useBuildTree(archives, "/spotlights")
+  const tree = useBuildTree(spotlights, "/spotlights")
   const sortedTree = sort((a, b) => a.title.localeCompare(b.title), tree)
 
   return (

src/layouts/SpotlightsLayout/index.tsx

@@ -1,13 +1,13 @@
 import React, { FC } from "react"
 
-import { ArchivesSidebar } from "../../components/ArchivesSidebar"
+import { SpotlightsSidebar } from "../../components/SpotlightsSidebar"
 import { ColumnLayout } from "../ColumnLayout"
 
-export const ArchivesLayout: FC = ({ children }) => {
+export const SpotlightsLayout: FC = ({ children }) => {
   return (
     <ColumnLayout
       title="Spotlights"
-      sidebar={ArchivesSidebar}
+      sidebar={SpotlightsSidebar}
       content={children}
     />
   )

src/layouts/index.tsx

@@ -1,7 +1,7 @@
 import { WindowLocation } from "@reach/router"
 import React, { FC, useMemo } from "react"
 import { LocationProvider } from "../LocationProvider"
-import { ArchivesLayout } from "./ArchivesLayout"
+import { SpotlightsLayout } from "./SpotlightsLayout"
 import { HomeLayout } from "./HomeLayout"
 import { PageLayout } from "./PageLayout"
 import { ResourcesLayout } from "./ResourcesLayout"
@@ -22,7 +22,7 @@ const BaseLayout: FC<IBaseLayout> = (props) => {
       case "resources":
         return ResourcesLayout
       case "spotlights":
-        return ArchivesLayout
+        return SpotlightsLayout
       case "regular":
         return PageLayout
       default:

src/pages/spotlights/index.tsx

@@ -5,7 +5,7 @@ import { Link } from "../../components/Link"
 import { PageContent } from "../../components/PageContent"
 import { SEO } from "../../components/SEO"
 
-function ArchivesPage() {
+function SpotlightsPage() {
   return (
     <Fragment>
       <SEO title="Tech Spotlights" />
@@ -25,4 +25,4 @@ function ArchivesPage() {
   )
 }
 
-export default ArchivesPage
+export default SpotlightsPage

src/templates/spotlight.tsx

@@ -7,7 +7,7 @@ import { humanize } from "../utils"
 import { PageContent } from "../components/PageContent"
 
 // @todo maybe find alternative type for data
-const Archive: FC<any> = ({ data }) => {
+const Spotlight: FC<any> = ({ data }) => {
   const { relativePath } = data.file
   const { body, excerpt, fields, timeToRead, frontmatter } = data.file.post
 
@@ -30,10 +30,10 @@ const Archive: FC<any> = ({ data }) => {
   )
 }
 
-export default Archive
+export default Spotlight
 
 export const query = graphql`
-  query Archive($file: String!) {
+  query Spotlight($file: String!) {
     file(relativePath: { eq: $file }) {
       relativePath
       post: childMdx {

src/types/index.d.ts

@@ -32,7 +32,7 @@ export interface IFileResourceQuery {
   }
 }
 
-export interface IFileArchiveQuery {
+export interface IFileSpotlightQuery {
   node: {
     relativePath: string
   }
@@ -50,9 +50,9 @@ export interface IAllResourcesQuery extends IAllFilesQuery {
   }
 }
 
-export interface IAllArchivesQuery extends IAllFilesQuery {
+export interface IAllSpotlightsQuery extends IAllFilesQuery {
   allFile: {
-    edges: IFileArchiveQuery[]
+    edges: IFileSpotlightQuery[]
   }
 }