kickstart app router migration

clis/generator-cli/package.json

@@ -30,7 +30,7 @@
     "@fern-api/fs-utils": "0.15.0-rc63",
     "@fern-api/github": "workspace:*",
     "@types/jest": "^29.5.11",
-    "@types/node": "^18.7.18",
+    "@types/node": "^18.19.74",
     "@types/yargs": "^17.0.32",
     "@yarnpkg/esbuild-plugin-pnp": "^3.0.0-rc.15",
     "depcheck": "^1.4.7",

clis/vercel-scripts/package.json

@@ -16,11 +16,11 @@
     "@fern-fern/fern-docs-sdk": "0.0.5",
     "@fern-fern/vercel": "0.0.4655",
     "execa": "^9.5.1",
-    "ts-essentials": "^10.0.1"
+    "ts-essentials": "^10"
   },
   "devDependencies": {
     "@fern-platform/configs": "workspace:*",
-    "@types/node": "^18.7.18",
+    "@types/node": "^18.19.74",
     "@types/yargs": "^17.0.32",
     "depcheck": "^1.4.7",
     "eslint": "^9",

eslint.config.mjs

@@ -2,6 +2,7 @@
 
 import { FlatCompat } from "@eslint/eslintrc";
 import eslint from "@eslint/js";
+import storybook from "eslint-plugin-storybook";
 import vitest from "eslint-plugin-vitest";
 import tseslint from "typescript-eslint";
 
@@ -38,6 +39,8 @@ export default tseslint.config(
     },
   },
 
+  ...storybook.configs["flat/recommended"],
+
   ...compat.config({
     extends: [
       "turbo",
@@ -48,11 +51,7 @@ export default tseslint.config(
     ],
     settings: {
       next: {
-        rootDir: [
-          "packages/fern-docs/bundle",
-          "packages/fern-docs/local-preview-bundle",
-          "packages/fern-docs/search-ui",
-        ],
+        rootDir: ["packages/fern-docs/bundle", "packages/fern-docs/search-ui"],
       },
       react: {
         version: "18",

package.json

@@ -24,7 +24,7 @@
     "lint:fix": "pnpm root-package:fix && pnpm lint:eslint:fix && pnpm lint:style:fix && pnpm format",
     "lint:style": "turbo lint:style",
     "lint:style:fix": "turbo lint:style:fix",
-    "playwright:build": "turbo --filter='playwright-*' --filter='@fern-docs/local-preview-bundle' build",
+    "playwright:build": "turbo --filter='playwright-*' build",
     "playwright:test": "pnpm exec playwright test",
     "publish": "pnpm -r --filter=!private --parallel exec -- npm publish --access public",
     "radix:up": "pnpm up -r \"@radix-ui/*\"",
@@ -43,14 +43,11 @@
     "elliptic": "6.6.0",
     "esbuild": "0.24.2",
     "eslint": "9.17.0",
-    "eslint-config-next": "15.1.2",
+    "eslint-config-next": "14.2.23",
     "instantsearch.js": "4.75.4",
-    "jsonpath-plus": "10.0.7",
     "markdown-to-jsx": "7.4.0",
     "micromatch": "4.0.8",
     "postcss": "8.4.31",
-    "react": "18.3.1",
-    "react-dom": "18.3.1",
     "tailwindcss": "3.4.17",
     "typescript": "5.7.2",
     "webpack": "5.94.0"
@@ -63,8 +60,8 @@
   },
   "devDependencies": {
     "@babel/core": "^7.26.0",
-    "@babel/preset-env": "^7.26.0",
-    "@babel/preset-react": "^7.25.9",
+    "@babel/preset-env": "^7.26.7",
+    "@babel/preset-react": "^7.26.3",
     "@babel/preset-typescript": "^7.26.0",
     "@eslint/compat": "^1.2.4",
     "@eslint/eslintrc": "^3.2.0",
@@ -76,21 +73,22 @@
     "@types/http-proxy": "^1.17.15",
     "@types/is-ci": "^3.0.4",
     "@types/js-yaml": "^4.0.9",
-    "@types/node": "^18.7.18",
+    "@types/node": "^18.19.74",
     "@typescript-eslint/eslint-plugin": "8.18.1",
     "@typescript-eslint/parser": "8.18.1",
     "@yarnpkg/sdks": "^3.1.0",
     "chalk": "^5.3.0",
     "depcheck": "^1.4.7",
     "dotenv": "^16.4.5",
     "eslint": "^9",
-    "eslint-config-next": "15.1.2",
+    "eslint-config-next": "14.2.23",
     "eslint-config-prettier": "^9.1.0",
     "eslint-config-turbo": "^2.3.3",
     "eslint-plugin-deprecation": "^3.0.0",
     "eslint-plugin-import": "^2.31.0",
     "eslint-plugin-react": "^7.37.2",
     "eslint-plugin-react-hooks": "^5.1.0",
+    "eslint-plugin-storybook": "^0.11.2",
     "eslint-plugin-tailwindcss": "^3.17.5",
     "eslint-plugin-vitest": "^0.5.4",
     "execa": "^5.1.1",

packages/cdk/package.json

@@ -31,7 +31,7 @@
   "devDependencies": {
     "@fern-platform/configs": "workspace:*",
     "@types/archiver": "^6.0.2",
-    "@types/node": "^18.7.18",
+    "@types/node": "^18.19.74",
     "aws-cdk": "^2.118.0",
     "prettier": "^3.4.2",
     "typescript": "^5"

packages/commons/core-utils/package.json

@@ -64,7 +64,7 @@
   },
   "devDependencies": {
     "@fern-platform/configs": "workspace:*",
-    "@types/node": "^18.7.18",
+    "@types/node": "^18.19.74",
     "@types/title": "^3.4.3",
     "@types/ua-parser-js": "^0.7.39",
     "depcheck": "^1.4.7",

packages/commons/fdr-utils/package.json

@@ -32,11 +32,11 @@
   },
   "dependencies": {
     "@fern-api/fdr-sdk": "workspace:*",
-    "ts-essentials": "^10.0.1"
+    "ts-essentials": "^10"
   },
   "devDependencies": {
     "@fern-platform/configs": "workspace:*",
-    "@types/node": "^18.7.18",
+    "@types/node": "^18.19.74",
     "depcheck": "^1.4.7",
     "eslint": "^9",
     "prettier": "^3.4.2",

packages/commons/github/package.json

@@ -40,7 +40,7 @@
   },
   "devDependencies": {
     "@fern-platform/configs": "workspace:*",
-    "@types/node": "^18.7.18",
+    "@types/node": "^18.19.74",
     "depcheck": "^1.4.7",
     "eslint": "^9",
     "prettier": "^3.4.2",

packages/commons/loadable/package.json

@@ -33,7 +33,7 @@
   },
   "devDependencies": {
     "@fern-platform/configs": "workspace:*",
-    "@types/node": "^18.7.18",
+    "@types/node": "^18.19.74",
     "depcheck": "^1.4.7",
     "eslint": "^9",
     "prettier": "^3.4.2",

packages/commons/react-commons/package.json

@@ -34,11 +34,11 @@
     "fastdom": "^1.0.12",
     "immer": "^9.0.15",
     "react": "^18",
-    "ts-essentials": "^10.0.1"
+    "ts-essentials": "^10"
   },
   "devDependencies": {
     "@fern-platform/configs": "workspace:*",
-    "@types/node": "^18.7.18",
+    "@types/node": "^18.19.74",
     "@types/react": "^18",
     "depcheck": "^1.4.7",
     "eslint": "^9",

packages/commons/react-commons/src/useResizeObserver.ts

@@ -5,7 +5,7 @@ import { noop } from "ts-essentials";
 import { useEventCallback } from "./useEventCallback";
 
 export function useResizeObserver(
-  ref: RefObject<HTMLElement>,
+  ref: RefObject<HTMLElement | null>,
   measure: (entries: ResizeObserverEntry[]) => void
 ): void {
   // ResizeObserver is not supported in SSG, so this hook should be disabled on the server-side

packages/fdr-sdk/package.json

@@ -61,7 +61,7 @@
     "qs": "6.12.0",
     "tinycolor2": "^1.6.0",
     "title": "^3.5.3",
-    "ts-essentials": "^10.0.1",
+    "ts-essentials": "^10",
     "url-join": "5.0.0"
   },
   "devDependencies": {

packages/fdr-sdk/src/navigation/NodeCollector.ts

@@ -74,6 +74,7 @@ export class NodeCollector {
 
   private defaultVersion: FernNavigation.VersionNode | undefined;
   private versionNodes: FernNavigation.VersionNode[] = [];
+  private productNodes: FernNavigation.ProductNode[] = [];
   constructor(rootNode: FernNavigation.NavigationNode | undefined) {
     if (rootNode == null) {
       return;
@@ -84,6 +85,10 @@ export class NodeCollector {
         this.versionNodes.push(node);
       }
 
+      if (node.type === "product") {
+        this.productNodes.push(node);
+      }
+
       if (node.type === "version" && node.default && rootNode.type === "root") {
         const copy = JSON.parse(
           JSON.stringify(node)
@@ -260,6 +265,10 @@ export class NodeCollector {
     return this.versionNodes;
   };
 
+  public getProductNodes = (): FernNavigation.ProductNode[] => {
+    return this.productNodes;
+  };
+
   public getNodesInOrder = (): FernNavigation.NavigationNode[] => {
     return this.nodesInOrder;
   };

packages/fdr-sdk/src/navigation/utils/findNode.ts

@@ -1,6 +1,7 @@
 import { FernNavigation } from "../..";
 import { NodeCollector } from "../NodeCollector";
 import { isApiReferenceNode } from "../versions/latest/isApiReferenceNode";
+import { isProductNode } from "../versions/latest/isProductNode";
 import { isSidebarRootNode } from "../versions/latest/isSidebarRootNode";
 import { isTabbedNode } from "../versions/latest/isTabbedNode";
 import { isUnversionedNode } from "../versions/latest/isUnversionedNode";
@@ -17,7 +18,9 @@ export declare namespace Node {
     breadcrumb: readonly FernNavigation.BreadcrumbItem[];
     root: FernNavigation.RootNode;
     versions: readonly FernNavigation.VersionNode[];
+    products: readonly FernNavigation.ProductNode[];
     currentVersion: FernNavigation.VersionNode | undefined;
+    currentProduct: FernNavigation.ProductNode | undefined;
     currentTab:
       | FernNavigation.TabNode
       | FernNavigation.ChangelogNode
@@ -79,6 +82,7 @@ export function findNode(
 
   const sidebar = found.parents.find(isSidebarRootNode);
   const currentVersion = found.parents.find(isVersionNode);
+  const currentProduct = found.parents.find(isProductNode);
   const unversionedNode = found.parents.find(isUnversionedNode);
   const versionChild = (currentVersion ?? unversionedNode)?.child;
   const landingPage = (currentVersion ?? unversionedNode)?.landingPage;
@@ -113,6 +117,7 @@ export function findNode(
       }
       return node;
     });
+    const products = collector.getProductNodes();
     const currentTab =
       currentTabNode?.type === "tab" || currentTabNode?.type === "changelog"
         ? currentTabNode
@@ -128,8 +133,10 @@ export function findNode(
       parents: found.parents,
       root,
       versions, // this is used to render the version switcher
+      products, // this is used to render the product switcher
       tabs: tabbedNode?.children ?? [],
       currentVersion,
+      currentProduct,
       currentTab,
       sidebar,
       apiReference,

packages/fdr-sdk/src/navigation/utils/index.ts

@@ -8,3 +8,4 @@ export * from "./toApis";
 export * from "./toPages";
 export * from "./toRootNode";
 export * from "./toUnversionedSlug";
+export * from "./updatePointsTo";

packages/fdr-sdk/src/navigation/versions/latest/NavigationNodeParent.ts

@@ -1,4 +1,6 @@
-import { NavigationNode } from "./NavigationNode";
-import { NavigationNodeLeaf } from "./NavigationNodeLeaf";
+import { FernNavigation } from "../../..";
 
-export type NavigationNodeParent = Exclude<NavigationNode, NavigationNodeLeaf>;
+export type NavigationNodeParent = Exclude<
+  FernNavigation.NavigationNode,
+  FernNavigation.NavigationNodeLeaf
+>;

packages/fdr-sdk/src/navigation/versions/latest/index.ts

@@ -3,6 +3,7 @@ export * from "../../../client/generated/api/resources/navigation/resources/late
 export * from "./getChildren";
 export * from "./getPageId";
 export * from "./isApiReferenceNode";
+export * from "./isProductNode";
 export * from "./isSidebarRootNode";
 export * from "./isTabbedNode";
 export * from "./isUnversionedNode";