chore(docs): convert all scripts to esm (#35996)

Scripts currently use CJS, which is causing a bit of a mess when trying
to use shared utilities from the app. Converting everything to ESM so
there are fewer conflicts when adding new scripts going forward.

apps/docs/app/guides/database/database-advisors/page.tsx

@@ -1,15 +1,15 @@
 import { Octokit } from '@octokit/core'
-import { capitalize } from 'lodash'
+import { capitalize } from 'lodash-es'
 import { type SerializeOptions } from 'next-mdx-remote/dist/types'
 import rehypeSlug from 'rehype-slug'
 
 import { Heading } from 'ui'
 
-import { genGuideMeta } from '~/features/docs/GuidesMdx.utils'
 import { GuideTemplate, newEditLink } from '~/features/docs/GuidesMdx.template'
+import { genGuideMeta } from '~/features/docs/GuidesMdx.utils'
 import { MDXRemoteBase } from '~/features/docs/MdxBase'
 import { fetchRevalidatePerDay } from '~/features/helpers.fetch'
-import { Tabs, TabPanel } from '~/features/ui/Tabs'
+import { TabPanel, Tabs } from '~/features/ui/Tabs'
 import { UrlTransformFunction, linkTransform } from '~/lib/mdx/plugins/rehypeLinkTransform'
 import remarkMkDocsAdmonition from '~/lib/mdx/plugins/remarkAdmonition'
 import { removeTitle } from '~/lib/mdx/plugins/remarkRemoveTitle'

apps/docs/components/Feedback/Feedback.utils.ts

@@ -1,4 +1,4 @@
-import { pick } from 'lodash'
+import { pick } from 'lodash-es'
 
 /**
  * Gets the Notion team to send feedback to based on the pathname.

apps/docs/components/ProjectConfigVariables/ProjectConfigVariables.ComboBox.tsx

@@ -1,18 +1,18 @@
+import { noop } from 'lodash-es'
 import { Check, ChevronsUpDown } from 'lucide-react'
-import { noop } from 'lodash'
 import { useState } from 'react'
 import {
   Button_Shadcn_ as Button,
-  Popover_Shadcn_ as Popover,
-  PopoverTrigger_Shadcn_ as PopoverTrigger,
-  PopoverContent_Shadcn_ as PopoverContent,
-  Command_Shadcn_ as Command,
-  CommandInput_Shadcn_ as CommandInput,
-  CommandEmpty_Shadcn_ as CommandEmpty,
-  CommandItem_Shadcn_ as CommandItem,
-  CommandGroup_Shadcn_ as CommandGroup,
-  CommandList_Shadcn_ as CommandList,
   cn,
+  Command_Shadcn_ as Command,
+  CommandEmpty_Shadcn_ as CommandEmpty,
+  CommandGroup_Shadcn_ as CommandGroup,
+  CommandInput_Shadcn_ as CommandInput,
+  CommandItem_Shadcn_ as CommandItem,
+  CommandList_Shadcn_ as CommandList,
+  Popover_Shadcn_ as Popover,
+  PopoverContent_Shadcn_ as PopoverContent,
+  PopoverTrigger_Shadcn_ as PopoverTrigger,
   ScrollArea,
 } from 'ui'
 

apps/docs/components/SharedData.tsx

@@ -1,4 +1,4 @@
-import { at } from 'lodash'
+import { at } from 'lodash-es'
 import { ReactNode } from 'react'
 import { config, logConstants } from 'shared-data'
 

apps/docs/features/docs/Reference.generated.script.ts

@@ -1,4 +1,4 @@
-import { isPlainObject, keyBy } from 'lodash'
+import { isPlainObject, keyBy } from 'lodash-es'
 import { mkdir, readFile, writeFile } from 'node:fs/promises'
 import { dirname, join } from 'node:path'
 import { fileURLToPath } from 'node:url'

apps/docs/features/docs/Reference.navigation.client.tsx

@@ -2,7 +2,7 @@
 
 import * as Collapsible from '@radix-ui/react-collapsible'
 
-import { debounce } from 'lodash'
+import { debounce } from 'lodash-es'
 import { ChevronUp } from 'lucide-react'
 import Link from 'next/link'
 import { usePathname } from 'next/navigation'

apps/docs/features/docs/Reference.ui.tsx

@@ -1,4 +1,4 @@
-import { isEqual } from 'lodash'
+import { isEqual } from 'lodash-es'
 import { ChevronRight, XCircle } from 'lucide-react'
 import type { HTMLAttributes, PropsWithChildren } from 'react'
 import ReactMarkdown from 'react-markdown'

apps/docs/generator/helpers.ts

@@ -1,5 +1,5 @@
 import * as fs from 'fs'
-import { mapValues, values } from 'lodash'
+import { mapValues, values } from 'lodash-es'
 
 export const slugify = (text: string) => {
   if (!text) return ''

apps/docs/generator/legacy.ts

@@ -8,15 +8,15 @@
  *    tsx ReferenceGenerator.ts -o docs/client spec/supabase.yml
  */
 
+import * as fs from 'fs'
+import * as yaml from 'js-yaml'
+import { uniqBy } from 'lodash-es'
+import { flattenSections } from '../lib/helpers'
 import Example from './legacy/components/Example'
 import Page from './legacy/components/Page'
 import Tab from './legacy/components/Tab'
+import { OpenRef, TsDoc } from './legacy/definitions'
 import { slugify, tsDocCommentToMdComment, writeToDisk } from './legacy/lib/helpers'
-import { TsDoc, OpenRef } from './legacy/definitions'
-import { uniqBy } from 'lodash'
-import * as fs from 'fs'
-import * as yaml from 'js-yaml'
-import { flattenSections } from '../lib/helpers'
 
 const commonDocSpecJson = JSON.parse(
   fs.readFileSync('spec/common-client-libs-sections.json', 'utf8')

apps/docs/lib/refGenerator/helpers.ts

@@ -1,9 +1,9 @@
 import type { TsDoc } from '../../generator/legacy/definitions'
 
-import { values, mapValues } from 'lodash'
+import { mapValues, values } from 'lodash-es'
 import type { OpenAPIV3 } from 'openapi-types'
-import { flattenSections } from '../helpers'
 import type { ICommonItem } from '~/components/reference/Reference.types'
+import { flattenSections } from '../helpers'
 
 export function extractTsDocNode(nodeToFind: string, definition: any) {
   const nodePath = nodeToFind.split('.')

apps/docs/lib/remotePatterns.js

@@ -1,4 +1,4 @@
-module.exports = [
+export default [
   {
     protocol: 'https',
     hostname: 'avatars.githubusercontent.com',

apps/docs/next.config.mjs

@@ -34,13 +34,6 @@ const nextConfig = {
     // @ts-ignore
     remotePatterns,
   },
-  // TODO: @next/mdx ^13.0.2 only supports experimental mdxRs flag. next ^13.0.2 will stop warning about this being unsupported.
-  // mdxRs: true,
-  modularizeImports: {
-    lodash: {
-      transform: 'lodash/{{member}}',
-    },
-  },
   webpack: (config) => {
     config.module.rules.push({
       test: /\.include$/,

apps/docs/package.json

@@ -2,37 +2,38 @@
   "name": "docs",
   "version": "0.0.0",
   "private": true,
+  "type": "module",
   "scripts": {
-    "preinstall": "npx only-allow pnpm",
-    "predev": "pnpm run codegen:graphql && pnpm run codegen:references && pnpm run codegen:examples",
-    "dev": "concurrently --kill-others \"next dev --port 3001\" \"pnpm run dev:watch:troubleshooting\"",
-    "dev:watch:troubleshooting": "node ./scripts/troubleshooting/watch.mjs",
-    "dev:secrets:pull": "AWS_PROFILE=supabase-dev node ../../scripts/getSecrets.js -n local/docs",
-    "prebuild": "pnpm run codegen:graphql && pnpm run codegen:references && pnpm run codegen:examples",
     "build": "next build",
     "build:analyze": "ANALYZE=true next build",
-    "build:sitemap": "tsx ./internals/generate-sitemap.ts",
     "build:llms": "tsx ./scripts/llms.ts",
-    "postbuild": "pnpm run build:sitemap && pnpm run build:llms && ./../../scripts/upload-static-assets.sh",
-    "start": "next start",
+    "build:sitemap": "tsx ./internals/generate-sitemap.ts",
+    "clean": "rimraf .next .turbo node_modules features/docs/generated examples __generated__",
+    "codegen:examples": "cp -r ../../examples ./examples",
+    "codegen:graphql": "tsx --conditions=react-server ./scripts/graphqlSchema.ts && graphql-codegen --config codegen.ts",
+    "codegen:references": "tsx features/docs/Reference.generated.script.ts",
+    "codemod:frontmatter": "node ./scripts/codemod/mdx-meta.mjs && prettier --write \"content/**/*.mdx\"",
+    "dev": "concurrently --kill-others \"next dev --port 3001\" \"pnpm run dev:watch:troubleshooting\"",
+    "dev:secrets:pull": "AWS_PROFILE=supabase-dev node ../../scripts/getSecrets.js -n local/docs",
+    "dev:watch:troubleshooting": "node ./scripts/troubleshooting/watch.mjs",
+    "embeddings": "tsx scripts/search/generate-embeddings.ts",
+    "embeddings:refresh": "pnpm run embeddings --refresh",
+    "last-changed": "tsx scripts/last-changed.ts",
+    "last-changed:reset": "pnpm run last-changed -- --reset",
     "lint": "next lint",
     "lint:mdx": "supa-mdx-lint content --config ../../supa-mdx-lint.config.toml",
-    "pretypecheck": "pnpm run codegen:graphql",
-    "typecheck": "tsc --noEmit",
+    "postbuild": "pnpm run build:sitemap && pnpm run build:llms && ./../../scripts/upload-static-assets.sh",
+    "prebuild": "pnpm run codegen:graphql && pnpm run codegen:references && pnpm run codegen:examples",
+    "predev": "pnpm run codegen:graphql && pnpm run codegen:references && pnpm run codegen:examples",
+    "preinstall": "npx only-allow pnpm",
     "pretest": "pnpm run codegen:examples",
+    "pretypecheck": "pnpm run codegen:graphql",
+    "start": "next start",
     "test": "pnpm supabase start && pnpm run test:local && pnpm supabase stop",
     "test:local": "vitest --exclude \"**/*.smoke.test.ts\"",
     "test:smoke": "pnpm run codegen:references && vitest -t \"prod smoke test\"",
-    "embeddings": "tsx scripts/search/generate-embeddings.ts",
-    "embeddings:refresh": "pnpm run embeddings --refresh",
     "troubleshooting:sync": "node features/docs/Troubleshooting.script.mjs",
-    "last-changed": "tsx scripts/last-changed.ts",
-    "last-changed:reset": "pnpm run last-changed -- --reset",
-    "codegen:examples": "cp -r ../../examples ./examples",
-    "codemod:frontmatter": "node ./scripts/codemod/mdx-meta.mjs && prettier --write \"content/**/*.mdx\"",
-    "codegen:graphql": "tsx --conditions=react-server ./scripts/graphqlSchema.ts && graphql-codegen --config codegen.ts",
-    "codegen:references": "tsx features/docs/Reference.generated.script.ts",
-    "clean": "rimraf .next .turbo node_modules features/docs/generated examples __generated__"
+    "typecheck": "tsc --noEmit"
   },
   "dependencies": {
     "@har-sdk/openapi-sampler": "^2.2.0",
@@ -70,7 +71,7 @@
     "jsrsasign": "^11.0.0",
     "katex": "^0.16.21",
     "libpg-query": "15.2.0",
-    "lodash": "^4.17.21",
+    "lodash-es": "^4.17.21",
     "lucide-react": "*",
     "mdast": "^3.0.0",
     "mdast-util-from-markdown": "^1.2.0",
@@ -125,6 +126,7 @@
     "@types/graphql-validation-complexity": "^0.4.4",
     "@types/hast": "^2.3.4",
     "@types/jsrsasign": "^10.5.12",
+    "@types/lodash-es": "^4.17.12",
     "@types/mdast": "^3.0.0",
     "@types/node": "catalog:",
     "@types/react": "catalog:",

apps/docs/scripts/graphqlSchema.ts

@@ -1,7 +1,10 @@
 import { printSchema } from 'graphql'
 import fs from 'node:fs'
 import path from 'node:path'
-import { rootGraphQLSchema } from '../resources/rootSchema'
+import { fileURLToPath } from 'node:url'
+import { rootGraphQLSchema } from '../resources/rootSchema.js'
+
+const __dirname = path.dirname(fileURLToPath(import.meta.url))
 
 async function generateGraphQLSchema() {
   try {
@@ -22,6 +25,6 @@ async function generateGraphQLSchema() {
   }
 }
 
-if (require.main === module) {
+if (process.argv[1] === fileURLToPath(import.meta.url)) {
   generateGraphQLSchema()
 }

apps/docs/scripts/last-changed.ts

@@ -18,11 +18,12 @@ import matter from 'gray-matter'
 import { createHash } from 'node:crypto'
 import { readdirSync } from 'node:fs'
 import { readFile } from 'node:fs/promises'
-import { join } from 'node:path'
+import path, { join } from 'node:path'
+import { fileURLToPath } from 'node:url'
 import { parseArgs } from 'node:util'
 import { SimpleGit, simpleGit } from 'simple-git'
 import { parse } from 'smol-toml'
-import { type Section } from './helpers.mdx'
+import { Section } from './helpers.mdx.js'
 
 interface Options {
   reset: boolean
@@ -49,6 +50,8 @@ const REQUIRED_ENV_VARS = {
   SERVICE_ROLE_KEY: 'SUPABASE_SERVICE_ROLE_KEY',
 } as const
 
+const __dirname = path.dirname(fileURLToPath(import.meta.url))
+
 async function main() {
   console.log('Updating content timestamps....')
 

apps/docs/scripts/llms.ts

@@ -1,6 +1,6 @@
 import 'dotenv/config'
 import fs from 'node:fs/promises'
-
+import { fileURLToPath } from 'node:url'
 import {
   fetchCliLibReferenceSource,
   fetchCSharpLibReferenceSource,
@@ -11,7 +11,7 @@ import {
   fetchPythonLibReferenceSource,
   fetchSwiftLibReferenceSource,
   type SearchSource,
-} from './search/sources'
+} from './search/sources/index.js'
 
 interface Source {
   title: string
@@ -97,6 +97,6 @@ async function generateLlmsTxt() {
   }
 }
 
-if (require.main === module) {
+if (process.argv[1] === fileURLToPath(import.meta.url)) {
   generateLlmsTxt()
 }

apps/docs/scripts/search/generate-embeddings.ts

@@ -3,8 +3,8 @@ import 'dotenv/config'
 import { parseArgs } from 'node:util'
 import { OpenAI } from 'openai'
 import { v4 as uuidv4 } from 'uuid'
-import type { Json, Section } from '../helpers.mdx'
-import { fetchAllSources } from './sources'
+import type { Json, Section } from '../helpers.mdx.js'
+import { fetchAllSources } from './sources/index.js'
 
 const args = parseArgs({
   options: {

apps/docs/scripts/search/sources/base.ts

@@ -1,4 +1,4 @@
-import type { Json, Section } from '../../helpers.mdx'
+import type { Json, Section } from '../../helpers.mdx.js'
 
 export abstract class BaseLoader {
   type: string

apps/docs/scripts/search/sources/github-discussion.ts

@@ -2,7 +2,7 @@ import { createAppAuth } from '@octokit/auth-app'
 import { Octokit } from '@octokit/core'
 import { paginateGraphql } from '@octokit/plugin-paginate-graphql'
 import crypto, { createHash } from 'node:crypto'
-import { BaseLoader, BaseSource } from './base'
+import { BaseLoader, BaseSource } from './base.js'
 
 export const ExtendedOctokit = Octokit.plugin(paginateGraphql)
 export type ExtendedOctokit = InstanceType<typeof ExtendedOctokit>

apps/docs/scripts/search/sources/index.ts

@@ -4,9 +4,9 @@ import {
   GitHubDiscussionLoader,
   type GitHubDiscussionSource,
   fetchDiscussions,
-} from './github-discussion'
-import { MarkdownLoader, type MarkdownSource } from './markdown'
-import { IntegrationLoader, type IntegrationSource, fetchPartners } from './partner-integrations'
+} from './github-discussion.js'
+import { MarkdownLoader, type MarkdownSource } from './markdown.js'
+import { IntegrationLoader, type IntegrationSource, fetchPartners } from './partner-integrations.js'
 import {
   CliReferenceLoader,
   type CliReferenceSource,
@@ -14,8 +14,8 @@ import {
   type ClientLibReferenceSource,
   OpenApiReferenceLoader,
   type OpenApiReferenceSource,
-} from './reference-doc'
-import { walk } from './util'
+} from './reference-doc.js'
+import { walk } from './util.js'
 
 const ignoredFiles = ['pages/404.mdx']
 

apps/docs/scripts/search/sources/markdown.ts

@@ -1,6 +1,6 @@
 import { readFile } from 'fs/promises'
-import { processMdx } from '../../helpers.mdx'
-import { BaseLoader, BaseSource } from './base'
+import { processMdx } from '../../helpers.mdx.js'
+import { BaseLoader, BaseSource } from './base.js'
 
 export class MarkdownLoader extends BaseLoader {
   type = 'markdown' as const

apps/docs/scripts/search/sources/partner-integrations.ts

@@ -1,8 +1,7 @@
 import { type SupabaseClient, createClient } from '@supabase/supabase-js'
-import { upperFirst } from 'lodash'
-
-import { BaseLoader, BaseSource } from './base'
-import { processMdx } from '../../helpers.mdx'
+import { upperFirst } from 'lodash-es'
+import { processMdx } from '../../helpers.mdx.js'
+import { BaseLoader, BaseSource } from './base.js'
 
 type PartnerData = {
   slug: string // The partner slug corresponding to the last part of the URL

apps/docs/scripts/search/sources/reference-doc.ts

@@ -7,12 +7,12 @@ import type {
   ICommonSection,
   IFunctionDefinition,
   ISpec,
-} from '../../../components/reference/Reference.types'
-import type { CliCommand, CliSpec } from '../../../generator/types/CliSpec'
-import { flattenSections } from '../../../lib/helpers'
-import { enrichedOperation, gen_v3 } from '../../../lib/refGenerator/helpers'
-import type { Json } from '../../helpers.mdx'
-import { BaseLoader, BaseSource } from './base'
+} from '../../../components/reference/Reference.types.js'
+import type { CliCommand, CliSpec } from '../../../generator/types/CliSpec.js'
+import { flattenSections } from '../../../lib/helpers.js'
+import { enrichedOperation, gen_v3 } from '../../../lib/refGenerator/helpers.js'
+import type { Json } from '../../helpers.mdx.js'
+import { BaseLoader, BaseSource } from './base.js'
 
 export abstract class ReferenceLoader<SpecSection> extends BaseLoader {
   type = 'reference' as const

apps/docs/scripts/tsconfig.json

@@ -1,6 +1,8 @@
 // generator files need their own tsconfig.json because they don't like "module": "esnext" setting that nextjs requires in the main tsconfig
 {
   "compilerOptions": {
+    "module": "NodeNext",
+    "moduleResolution": "NodeNext",
     "incremental": true,
     "noImplicitAny": false,
     "esModuleInterop": true,

pnpm-lock.yaml

@@ -324,7 +324,7 @@ importers:
       libpg-query:
         specifier: 15.2.0
         version: 15.2.0(encoding@0.1.13)(supports-color@8.1.1)
-      lodash:
+      lodash-es:
         specifier: ^4.17.21
         version: 4.17.21
       lucide-react:
@@ -484,6 +484,9 @@ importers:
       '@types/jsrsasign':
         specifier: ^10.5.12
         version: 10.5.12
+      '@types/lodash-es':
+        specifier: ^4.17.12
+        version: 4.17.12
       '@types/mdast':
         specifier: ^3.0.0
         version: 3.0.15
@@ -7691,6 +7694,9 @@ packages:
   '@types/katex@0.16.7':
     resolution: {integrity: sha512-HMwFiRujE5PjrgwHQ25+bsLJgowjGjm5Z8FVSf0N6PwgJrwxH0QxzHYDcKsTfV3wva0vzrpqMTJS2jXPr5BMEQ==}
 
+  '@types/lodash-es@4.17.12':
+    resolution: {integrity: sha512-0NgftHUcV4v34VhXm8QBSftKVXtbkBG3ViCjs6+eJ5a6y6Mi/jiFGPc1sC7QK+9BFhWrURE3EOggmWaSxL9OzQ==}
+
   '@types/lodash.template@4.5.0':
     resolution: {integrity: sha512-4LgHxK16IPbGR7TmXpPvNT7iNGsLCdQY6Rc0mi1a/JECt8et/D4hx6NMVAJej/d932sj1mJsg0QYHKL189O0Qw==}
 
@@ -23522,9 +23528,13 @@ snapshots:
 
   '@types/katex@0.16.7': {}
 
+  '@types/lodash-es@4.17.12':
+    dependencies:
+      '@types/lodash': 4.17.16
+
   '@types/lodash.template@4.5.0':
     dependencies:
-      '@types/lodash': 4.17.5
+      '@types/lodash': 4.17.16
 
   '@types/lodash@4.17.16': {}