Merge pull request #104 from basehub-ai/toolbar

Toolbar v1
basehub-ai · May 29, 2024 · 541f8b4 · 541f8b4
2 parents b95a6bd + 593ffdd
commit 541f8b4
Show file tree

Hide file tree

Showing 19 changed files with 2,810 additions and 861 deletions.
diff --git a/packages/basehub/CHANGELOG.md b/packages/basehub/CHANGELOG.md
@@ -1,5 +1,14 @@
 # basehub
 
+## 5.1.0
+
+### Minor Changes
+
+- aeac3b6: Toolbar V1.0:
+
+  - Hardcoded & disabled branch switcher
+  - Draft mode button
+
 ## 5.0.3
 
 ### Patch Changes

diff --git a/packages/basehub/declare.ts b/packages/basehub/declare.ts
@@ -0,0 +1 @@
+declare module "*.scss";
diff --git a/packages/basehub/next-toolbar.d.ts b/packages/basehub/next-toolbar.d.ts
@@ -0,0 +1,2 @@
+/* eslint-disable import/no-unresolved */
+export * from "./dist/generated-client/next-toolbar.d.ts";
diff --git a/packages/basehub/next-toolbar.js b/packages/basehub/next-toolbar.js
@@ -0,0 +1,2 @@
+/* eslint-disable import/no-unresolved */
+export * from "./dist/generated-client/next-toolbar.js";
diff --git a/packages/basehub/package.json b/packages/basehub/package.json
@@ -2,7 +2,7 @@
   "name": "basehub",
   "description": "The first AI-native content hub.",
   "author": "JB <[email protected]>",
-  "version": "5.0.3",
+  "version": "5.1.0",
   "license": "MIT",
   "repository": "basehub-ai/basehub",
   "bugs": "https://github.com/basehub-ai/basehub/issues",
@@ -17,6 +17,9 @@
     "index.d.ts",
     "react-pump.js",
     "react-pump.d.ts",
+    "next-toolbar.js",
+    "next-toolbar.d.ts",
+    "src/next/toolbar",
     "react-rich-text.js",
     "react-rich-text.d.ts",
     "react-search.js",
@@ -45,6 +48,7 @@
     "dotenv-mono": "1.3.10",
     "esbuild": "0.19.2",
     "github-slugger": "^2.0.0",
+    "lodash.debounce": "^4.0.8",
     "lodash.get": "4.4.2",
     "pusher-js": "8.3.0",
     "react": "18.2.0",
@@ -55,10 +59,13 @@
     "zod": "3.22.1"
   },
   "devDependencies": {
+    "@types/lodash.debounce": "^4.0.9",
     "@types/lodash.get": "4.4.9",
     "@types/node": "18.13.0",
     "@types/react": "18.2.20",
     "@types/react-dom": "18.2.7",
+    "esbuild-scss-modules-plugin": "^1.1.1",
+    "next": "^13.5.3",
     "tsconfig": "workspace:*",
     "tsup": "8.0.2",
     "type-fest": "3.0.0"

diff --git a/packages/basehub/src-react-pump/server-pump.tsx b/packages/basehub/src-react-pump/server-pump.tsx
@@ -79,7 +79,8 @@ export const Pump = async <Queries extends Array<PumpQuery>>({
   }> = await Promise.all(
     queriesWithFallback.map(async (singleQuery) => {
       const rawQueryOp = generateQueryOp(singleQuery);
-      const cacheKey = JSON.stringify(rawQueryOp);
+      const cacheKey =
+        JSON.stringify(rawQueryOp) + (draft ? "_draft" : "_prod");
 
       let data: QueryResults<Queries>[number] | undefined = undefined;
 

diff --git a/packages/basehub/src/bin/main.ts b/packages/basehub/src/bin/main.ts
@@ -4,6 +4,7 @@ import path from "path";
 import { Args } from ".";
 import fs from "fs";
 import * as esbuild from "esbuild";
+import { ScssModulesPlugin } from "esbuild-scss-modules-plugin";
 import {
   getStuffFromEnv,
   runtime__getStuffFromEnvString,
@@ -117,7 +118,11 @@ export const main = async (
 
     // this should go at the end so that it doesn't suffer any modifications.
     schemaFileContents = schemaFileContents.concat(
-      `\n${runtime__getStuffFromEnvString({ ...options, draft })}}`
+      `\n${runtime__getStuffFromEnvString({
+        ...options,
+        draft,
+        forceDraft: opts?.forceDraft,
+      })}}`
     );
 
     // 3. append our basehub function to the end of the file.
@@ -143,10 +148,12 @@ export const main = async (
       "react-dom",
       "../index",
       "@basehub/mutation-api-helpers",
+      "next",
     ];
 
     logIfNotSilent(silent, "📦 Compiling to JavaScript...");
     const reactPumpOutDir = path.join(basehubOutputPath, "react-pump");
+    const nextToolbarOutDir = path.join(basehubOutputPath, "next-toolbar");
     await Promise.all([
       esbuild.build({
         entryPoints: [generatedMainExportPath],
@@ -192,6 +199,41 @@ export const main = async (
           },
         ],
       }),
+      esbuild.build({
+        entryPoints: [
+          path.join(basehubModulePath, "src", "next", "toolbar", "index.ts"),
+        ],
+        bundle: true,
+        outdir: nextToolbarOutDir,
+        minify: false,
+        treeShaking: true,
+        splitting: true,
+        format: "esm",
+        target: ["es2020", "node18"],
+        external: peerDependencies,
+        plugins: [
+          ScssModulesPlugin(),
+          {
+            name: "use-client-for-client-components",
+            setup(build) {
+              build.onEnd(() => {
+                const rxp = /['"]use client['"]\s?;/i;
+                const outputFilePaths = fs.readdirSync(nextToolbarOutDir);
+                outputFilePaths
+                  ?.filter((fileName) => !fileName.endsWith(".map"))
+                  .forEach((fileName) => {
+                    // if the file contains "use client" we'll make sure it's on the top.
+                    const filePath = path.join(nextToolbarOutDir, fileName);
+                    const fileContents = fs.readFileSync(filePath, "utf-8");
+                    if (!rxp.test(fileContents)) return;
+                    const newContents = fileContents.replace(rxp, "");
+                    fs.writeFileSync(filePath, `"use client";\n${newContents}`);
+                  });
+              });
+            },
+          },
+        ],
+      }),
     ]);
 
     appendGeneratedCodeBanner(basehubOutputPath, args["--banner"]);
@@ -223,6 +265,14 @@ export const main = async (
         basehubModulePath,
         "react-pump.d.ts"
       );
+      const nextToolbarIndexJsPath = path.join(
+        basehubModulePath,
+        "next-toolbar.js"
+      );
+      const nextToolbarIndexDtsPath = path.join(
+        basehubModulePath,
+        "next-toolbar.d.ts"
+      );
       fs.writeFileSync(
         indexJsPath,
         `module.exports = require("${path.relative(
@@ -251,6 +301,20 @@ export const main = async (
           path.join(reactPumpOutDir, "index.d.ts")
         )}";`
       );
+      fs.writeFileSync(
+        nextToolbarIndexJsPath,
+        `module.exports = require("${path.relative(
+          basehubModulePath,
+          path.join(nextToolbarOutDir, "index.js")
+        )}");`
+      );
+      fs.writeFileSync(
+        nextToolbarIndexDtsPath,
+        `export * from "${path.relative(
+          basehubModulePath,
+          path.join(nextToolbarOutDir, "index.d.ts")
+        )}";`
+      );
     }
 
     if (shouldAppendToGitIgnore) {

diff --git a/packages/basehub/src/bin/util/get-stuff-from-env.ts b/packages/basehub/src/bin/util/get-stuff-from-env.ts
@@ -9,6 +9,7 @@ export const basehubAPIOrigin = "https://api.basehub.com";
 const defaultEnvVarPrefix = "BASEHUB";
 
 export type Options = {
+  forceDraft?: boolean;
   draft?: boolean;
   output: string | undefined;
   prefix: string | undefined;
@@ -295,6 +296,7 @@ export const getStuffFromEnv = (options) => {
     // 3. done.
 
     return {
+      isForcedDraft: ${!!options.forceDraft},
       draft,
       url: basehubUrl,
       headers: {