@graphcommerce/next-config 9.0.4-canary.0 → 9.0.4-canary.10

package/package.json

@@ -2,27 +2,38 @@
   "name": "@graphcommerce/next-config",
   "homepage": "https://www.graphcommerce.org/",
   "repository": "github:graphcommerce-org/graphcommerce",
-  "version": "9.0.4-canary.0",
-  "type": "commonjs",
-  "main": "dist/index.js",
-  "types": "src/index.ts",
+  "version": "9.0.4-canary.10",
+  "type": "module",
+  "types": "./src/index.ts",
+  "exports": {
+    ".": {
+      "default": "./dist/index.js"
+    },
+    "./config": {
+      "default": "./dist/generated/config.js"
+    }
+  },
   "scripts": {
-    "dev": "tsc -W --preserveWatchOutput",
-    "build": "tsc",
-    "prepack": "tsc"
+    "dev": "pkgroll --clean-dist --watch",
+    "build": "pkgroll --clean-dist",
+    "prepack": "pkgroll --clean-dist"
   },
   "dependencies": {
+    "@graphql-codegen/cli": "5.0.3",
     "@swc/core": "1.10.1",
     "@swc/wasm-web": "^1.10.1",
     "@types/circular-dependency-plugin": "^5.0.8",
+    "@types/js-yaml": "^4",
     "@types/lodash": "^4.17.13",
     "babel-plugin-macros": "^3.1.0",
     "chalk": "^4",
     "circular-dependency-plugin": "^5.2.2",
+    "cosmiconfig": "^8.3.6",
     "fast-glob": "^3.3.2",
     "glob": "^10.4.5",
     "graphql": "^16.10.0",
     "inspectpack": "^4.7.1",
+    "js-yaml": "^4.1.0",
     "js-yaml-loader": "^1.2.2",
     "lodash": "^4.17.21",
     "react": "^18.3.1",
@@ -32,10 +43,25 @@
     "zod": "^3.24.1"
   },
   "peerDependencies": {
+    "@graphcommerce/prettier-config-pwa": "^9.0.4-canary.10",
     "@lingui/loader": "*",
     "@lingui/macro": "*",
     "@lingui/react": "*",
     "dotenv": "^16",
-    "next": "*"
+    "next": "*",
+    "prettier": "^3"
+  },
+  "prettier": "@graphcommerce/prettier-config-pwa",
+  "eslint": {
+    "extends": "@graphcommerce/eslint-config-pwa"
+  },
+  "eslintConfig": {
+    "extends": "@graphcommerce/eslint-config-pwa",
+    "parserOptions": {
+      "project": "./tsconfig.json"
+    }
+  },
+  "devDependencies": {
+    "pkgroll": "^2.5.1"
   }
 }

package/src/commands/codegen.ts

@@ -5,14 +5,14 @@ import { copyFiles } from './copyFiles'
 /** Run all code generation steps in sequence */
 export async function codegen() {
   // Copy files from packages to project
-  console.log('🔄 Copying files from packages to project...')
+  console.info('🔄 Copying files from packages to project...')
   await copyFiles()
 
   // Generate GraphCommerce config types
-  console.log('⚙️  Generating GraphCommerce config types...')
+  console.info('⚙️  Generating GraphCommerce config types...')
   await generateConfig()
 
   // Generate interceptors
-  console.log('🔌 Generating interceptors...')
+  console.info('🔌 Generating interceptors...')
   await codegenInterceptors()
 }

package/src/commands/copyFiles.ts

@@ -6,7 +6,7 @@ import { resolveDependenciesSync } from '../utils/resolveDependenciesSync'
 
 // Add debug logging helper
 const debug = (...args: unknown[]) => {
-  if (process.env.DEBUG) console.log('[copy-files]', ...args)
+  if (process.env.DEBUG) console.info('[copy-files]', ...args)
 }
 
 // Add constants for the magic comments
@@ -25,6 +25,13 @@ const GITIGNORE_SECTION_END = '# end managed by: graphcommerce'
  * - Ensures the file ends with a newline
  */
 async function updateGitignore(managedFiles: string[]) {
+  const escapedFiles = managedFiles
+    .map((file) =>
+      // Escape special characters in file names
+      file.replace(/[*+?^${}()|[\]\\]/g, '\\$&'),
+    )
+    .sort()
+
   const gitignorePath = path.join(process.cwd(), '.gitignore')
   let content: string
 
@@ -44,10 +51,10 @@ async function updateGitignore(managedFiles: string[]) {
   content = content.replace(sectionRegex, '')
 
   // Only add new section if there are files to manage
-  if (managedFiles.length > 0) {
+  if (escapedFiles.length > 0) {
     const newSection = [
       GITIGNORE_SECTION_START,
-      ...managedFiles.sort(),
+      ...escapedFiles,
       GITIGNORE_SECTION_END,
       '', // Empty line at the end
     ].join('\n')
@@ -206,7 +213,7 @@ Found in packages:
             return
           }
           if (management === 'unmanaged') {
-            console.log(
+            console.info(
               `Note: File ${file} has been modified. Add '${MANAGED_LOCALLY.trim()}' at the top to manage it locally.`,
             )
             debug(`File ${file} doesn't have management comment, skipping`)
@@ -220,7 +227,7 @@ Found in packages:
 Source: ${sourcePath}`)
             process.exit(1)
           }
-          console.log(`Creating new file: ${file}\nSource: ${sourcePath}`)
+          console.info(`Creating new file: ${file}\nSource: ${sourcePath}`)
           debug('File does not exist yet')
         }
 
@@ -234,7 +241,7 @@ Source: ${sourcePath}`)
         // Copy the file with magic comment
         await fs.writeFile(targetPath, contentWithComment)
         if (targetContent) {
-          console.log(`Updated managed file: ${file}`)
+          console.info(`Updated managed file: ${file}`)
           debug(`Overwrote existing file: ${file}`)
         }
 
@@ -293,7 +300,7 @@ Source: ${sourcePath}`)
         // Then try to remove the file
         try {
           await fs.unlink(filePath)
-          console.log(`Removed managed file: ${file}`)
+          console.info(`Removed managed file: ${file}`)
           debug(`Removed file: ${file}`)
         } catch (err) {
           if ((err as { code?: string }).code !== 'ENOENT') {

package/src/config/commands/generateConfig.ts

@@ -1,8 +1,9 @@
-// eslint-disable-next-line import/no-extraneous-dependencies
-import { writeFileSync } from 'fs'
+import { readFileSync, writeFileSync } from 'fs'
+import prettierConf from '@graphcommerce/prettier-config-pwa'
 import { generate } from '@graphql-codegen/cli'
 import { transformFileSync } from '@swc/core'
 import dotenv from 'dotenv'
+import prettier from 'prettier'
 import { findParentPath } from '../../utils/isMonorepo'
 import { resolveDependenciesSync } from '../../utils/resolveDependenciesSync'
 import { resolveDependency } from '../../utils/resolveDependency'
@@ -27,10 +28,9 @@ export async function generateConfig() {
     schema: ['graphql/**/Config.graphqls', ...schemaLocations],
     generates: {
       [targetTs]: {
-        plugins: ['typescript', 'typescript-validation-schema', 'add'],
+        plugins: ['typescript', 'typescript-validation-schema'],
         config: {
           // enumsAsTypes: true,
-          content: '/* eslint-disable */',
           schema: 'zod',
           notAllowEmptyString: true,
           strictScalars: true,
@@ -50,9 +50,20 @@ export async function generateConfig() {
     },
   })
 
+  writeFileSync(
+    targetTs,
+    await prettier.format(readFileSync(targetTs, 'utf-8'), {
+      ...prettierConf,
+      parser: 'typescript',
+      plugins: prettierConf.plugins?.filter(
+        (p) => typeof p === 'string' && !p.includes('prettier-plugin-sort-imports'),
+      ),
+    }),
+  )
+
   const result = transformFileSync(targetTs, {
-    module: { type: 'commonjs' },
-    env: { targets: { node: '16' } },
+    module: { type: 'nodenext' },
+    env: { targets: { node: '18' } },
   })
 
   writeFileSync(targetJs, result.code)

package/src/config/demoConfig.ts

@@ -1,4 +1,3 @@
-// eslint-disable-next-line import/no-extraneous-dependencies
 import type { PartialDeep } from 'type-fest'
 import type { GraphCommerceConfig, GraphCommerceStorefrontConfig } from '../generated/config'
 

package/src/config/loadConfig.ts

@@ -1,11 +1,9 @@
 /* eslint-disable no-console */
-// eslint-disable-next-line import/no-extraneous-dependencies
 import { cosmiconfigSync } from 'cosmiconfig'
 import type { GraphCommerceConfig } from '../generated/config'
 import { GraphCommerceConfigSchema } from '../generated/config'
 import { demoConfig } from './demoConfig'
-import { formatAppliedEnv } from './utils/mergeEnvIntoConfig'
-import { rewriteLegacyEnv } from './utils/rewriteLegacyEnv'
+import { formatAppliedEnv, mergeEnvIntoConfig } from './utils/mergeEnvIntoConfig'
 
 export * from './utils/configToImportMeta'
 export * from './utils/replaceConfigInString'
@@ -28,12 +26,8 @@ export function loadConfig(cwd: string): GraphCommerceConfig {
     confFile ||= {}
 
     const schema = GraphCommerceConfigSchema()
-    const [mergedConfig, applyResult] = rewriteLegacyEnv(
-      schema,
-      process.env,
-      // eslint-disable-next-line @typescript-eslint/no-unsafe-argument
-      confFile,
-    )
+    // eslint-disable-next-line @typescript-eslint/no-unsafe-argument
+    const [mergedConfig, applyResult] = mergeEnvIntoConfig(schema, confFile, process.env)
 
     if (applyResult.length > 0 && isMainProcess) console.log(formatAppliedEnv(applyResult))
 

package/src/config/utils/mergeEnvIntoConfig.ts

@@ -1,8 +1,6 @@
-/* eslint-disable import/no-extraneous-dependencies */
 import { cloneDeep, mergeDeep } from '@apollo/client/utilities'
 import chalk from 'chalk'
-import { get, set } from 'lodash'
-import snakeCase from 'lodash/snakeCase'
+import lodash from 'lodash'
 import type { ZodAny, ZodRawShape, ZodTypeAny } from 'zod'
 import {
   z,
@@ -19,7 +17,11 @@ import {
 } from 'zod'
 import diff from './diff'
 
-const fmt = (s: string) => s.split(/(\d+)/).map(snakeCase).join('')
+const fmt = (s: string) =>
+  s
+    .split(/(\d+)/)
+    .map((v) => lodash.snakeCase(v))
+    .join('')
 export const toEnvStr = (path: string[]) => ['GC', ...path].map(fmt).join('_').toUpperCase()
 const dotNotation = (pathParts: string[]) =>
   pathParts
@@ -178,14 +180,14 @@ export function mergeEnvIntoConfig(
       return
     }
 
-    const dotValue = get(newConfig, dotVar)
+    const dotValue = lodash.get(newConfig, dotVar)
     const merged = mergeDeep(dotValue, value)
 
     const from = diff(merged, dotValue)
     const to = diff(dotValue, merged)
 
     applyResult.push({ envVar, envValue, dotVar, from, to })
-    set(newConfig, dotVar, merged)
+    lodash.set(newConfig, dotVar, merged)
   })
 
   return [newConfig, applyResult] as const
@@ -204,9 +206,7 @@ export function mergeEnvIntoConfig(
 export function formatAppliedEnv(applyResult: ApplyResult) {
   let hasError = false
   let hasWarning = false
-  const lines = applyResult.map(({ from, to, envValue, envVar, dotVar, error, warning }) => {
-    const fromFmt = chalk.red(JSON.stringify(from))
-    const toFmt = chalk.green(JSON.stringify(to))
+  const lines = applyResult.map(({ from, to, envVar, dotVar, error, warning }) => {
     const envVariableFmt = `${envVar}`
     const dotVariableFmt = chalk.bold.underline(`${dotVar}`)