Feature/app cleanup (#85)

Remove unused contexts, components, and props.

cli/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@wethegit/corgi",
-  "version": "2.0.3",
+  "version": "3.0.0",
   "description": "Command line interface for use with the corgi framework.",
   "main": "bin/index.js",
   "bin": {

cli/templates/page.jsx

@@ -1,21 +1,22 @@
-import { PageProvider } from "@local/context"
 import { useLocale } from "@local/hooks"
 import { setupPaths, setupProps } from "@local/utils"
 
 const LOCALE_FOLDER = "PAGE_SLUG"
 
-const PAGE_NAME = ({}) => {
+const PAGE_NAME = () => {
+  // useLocale _must_ be called in this component, passing the LOCALE_FOLDER.
+  // Whether you need to destructure anything from its return value is up to you.
   const { page, globals } = useLocale(LOCALE_FOLDER)
 
   return (
-    <PageProvider page={LOCALE_FOLDER}>
+    <>
       <header>
         <h1>{page.header.title}</h1>
         <p>{page.header.body}</p>
       </header>
 
       <main></main>
-    </PageProvider>
+    </>
   )
 }
 

cli/templates/project/src/components/layouts/home/home-layout.jsx

@@ -1,10 +1,10 @@
 import { HomeBody, HomeHeader } from "./components"
 
-export function HomeLayout({ version }) {
+export function HomeLayout() {
   return (
     <>
       <HomeHeader />
-      <HomeBody version={version} />
+      <HomeBody />
     </>
   )
 }

cli/templates/project/src/config-locales.js

@@ -3,9 +3,7 @@
  * strings. For example, if your locale string differs from the ISO standard
  * abbreviation, you can add that here.
  *   
- * The mapped object value will be available to both the Page's pageProps and the
- * useLocales hook as `localeMap`. If the locale is missing from the map then
- * localeMaps will be an empty object.
+ * The mapped object value will be available from the useLocale hook as `localeMap`.
  */
 const localeMap = new Map([
   [

cli/templates/project/src/context/index.js

@@ -1,3 +1,2 @@
 export { LocaleProvider, LocaleContext } from "./locale-context.js"
-export { PageProvider, PageContext } from "./page-context.js"
 export { SiteStateProvider, SiteStateContext } from "./site-state-context.js"

cli/templates/project/src/context/site-state-context.js

@@ -1,4 +1,4 @@
-import { createContext, useState, useReducer } from "react"
+import { createContext, useEffect, useState, useReducer } from "react"
 
 export const SiteStateContext = createContext()
 
@@ -15,6 +15,10 @@ export function SiteStateProvider({ children, version }) {
     return [newPage, ...history]
   }, [])
 
+  useEffect(() => {
+    console.log(`v${version}`)
+  }, [])
+
   return (
     <SiteStateContext.Provider
       value={{

cli/templates/project/src/hooks/use-locale.js

@@ -1,6 +1,6 @@
-import { useContext } from "react"
+import { useContext } from 'react'
 
-import { SiteStateContext, PageContext, LocaleContext } from "@local/context"
+import { SiteStateContext, LocaleContext } from '@local/context'
 
 /**
  * Retrieve locale data for the currently visible page.
@@ -16,12 +16,9 @@ import { SiteStateContext, PageContext, LocaleContext } from "@local/context"
  */
 export function useLocale(setPage) {
   const localeCache = useContext(LocaleContext)
-  const pageContext = useContext(PageContext)
   const { pageHistory } = useContext(SiteStateContext)
 
   if (setPage && localeCache.get(setPage)) return { ...localeCache.get(setPage) }
-  if (pageContext && pageContext.page && localeCache.get(pageContext.page))
-    return { ...localeCache.get(pageContext.page) }
   if (pageHistory && pageHistory.length && localeCache.get(pageHistory[0]))
     return { ...localeCache.get(pageHistory[0]) }
   return { ...Array.from(localeCache.values()).pop() }

cli/templates/project/src/hooks/use-site-state.js

@@ -1,4 +1,5 @@
-import { useContext } from "react"
-import { SiteStateContext } from "@local/context"
+import { useContext } from 'react'
+
+import { SiteStateContext } from '@local/context'
 
 export const useSiteState = () => useContext(SiteStateContext)

cli/templates/project/src/pages/[locale]/index.jsx

@@ -3,13 +3,14 @@ import { useRouter } from "next/router"
 
 import { setupPaths, setupProps } from "@local/utils"
 import { HomeLayout } from "@local/components/layouts"
-import { PageProvider } from "@local/context"
 import { defaultLocale } from "@local/config-locales"
+import { useLocale } from "@local/hooks"
 
 const LOCALE_FOLDER = "home"
 
-export default function Home({ locale, ...pageProps }) {
+export default function Home() {
   const router = useRouter()
+  const { locale } = useLocale()
 
   /*
     We need to check the locale, if its
@@ -36,11 +37,7 @@ export default function Home({ locale, ...pageProps }) {
 
   */
 
-  return (
-    <PageProvider page={LOCALE_FOLDER}>
-      {locale != defaultLocale && <HomeLayout {...pageProps} />}
-    </PageProvider>
-  )
+  return <HomeLayout />
 }
 
 export const getStaticPaths = async () => setupPaths(LOCALE_FOLDER)

cli/templates/project/src/pages/[locale]/subpage/index.jsx

@@ -1,21 +1,18 @@
-import { setupPaths, setupProps } from "@local/utils"
-import { PageProvider } from "@local/context"
 import { useLocale } from "@local/hooks"
+import { setupPaths, setupProps } from "@local/utils"
 
 const LOCALE_FOLDER = "subpage"
 
 export default function Subpage({}) {
-  const { page, globals } = useLocale(LOCALE_FOLDER)
+  const { page, globals } = useLocale()
 
   return (
-    <PageProvider page={LOCALE_FOLDER}>
-      <header>
-        <h1>{page.title}</h1>
-        <p>{page.subtitle}</p>
-      </header>
-    </PageProvider>
+    <header>
+      <h1>{page.title}</h1>
+      <p>{page.subtitle}</p>
+    </header>
   )
 }
 
 export const getStaticPaths = async () => setupPaths(LOCALE_FOLDER)
-export const getStaticProps = async (ctx) => setupProps(ctx, LOCALE_FOLDER)
+export const getStaticProps = async (ctx) => setupProps(ctx, LOCALE_FOLDER)

cli/templates/project/src/pages/_app.jsx

@@ -1,17 +1,13 @@
-import { useRouter } from "next/router"
+import { AppContextProviders, Page } from '@local/components/app'
 
-import { AppContextProviders, Page } from "@local/components/app"
-
-import "@local/styles/globals.scss"
+import '@local/styles/globals.scss'
 
 export default function App({ Component, pageProps }) {
-  const router = useRouter()
-
   return (
     <AppContextProviders {...pageProps}>
-      <Page {...pageProps}>
+      <Page>
         {/* The page component, as exported by an index.js file inside /src/pages: */}
-        <Component {...pageProps} />
+        <Component />
       </Page>
     </AppContextProviders>
   )

cli/templates/project/src/pages/index.jsx

@@ -1,11 +1,10 @@
 import { setupProps } from "@local/utils"
 
 import { HomeLayout } from "@local/components/layouts"
-import { PageProvider } from "@local/context"
 
 const LOCALE_FOLDER = "home"
 
-export default function RootRedirect({ ...pageProps }) {
+export default function RootRedirect() {
   /*
 
     ** NO PAGE CONTENT OR LOGIC HERE. **
@@ -18,11 +17,7 @@ export default function RootRedirect({ ...pageProps }) {
 
   */
 
-  return (
-    <PageProvider page={LOCALE_FOLDER}>
-      <HomeLayout {...pageProps} />
-    </PageProvider>
-  )
+  return <HomeLayout />
 }
 
 export const getStaticProps = async (ctx) => setupProps(ctx, LOCALE_FOLDER)

cli/templates/project/src/utils/page-setup.js

@@ -1,5 +1,7 @@
 import localeConfig from "@local/config-locales"
 
+import Package from '../../package.json';
+
 const { defaultLocale } = localeConfig
 
 async function getAvailableLocales(pageName) {
@@ -75,7 +77,7 @@ export async function setupProps(ctx, pageName) {
 
   return {
     props: {
-      version: require("../../package.json")?.version || 0,
+      version: Package.version || 0,
       localeData: {
         pageName: pageName || null,
         locale,

package.json

@@ -1,6 +1,6 @@
 {
   "name": "corgi",
-  "version": "0.0.2",
+  "version": "1.0.0",
   "private": true,
   "description": "Toolkit for creating statically-generated web apps via Next JS.",
   "workspaces": [