Split and combine packages, improve DX across packages

.github/labels.yml

@@ -24,15 +24,17 @@
   description: New feature or request
 - name: packages:components
   color: 0075ca
-- name: packages:engine
+- name: packages:execute
   color: 0075ca
-- name: packages:env
-  color: 0075ca
-- name: packages:helpers
+- name: packages:fetch
   color: 0075ca
 - name: packages:hooks
   color: 0075ca
-- name: packages:style
+- name: packages:logger
+  color: 0075ca
+- name: packages:runtimes
   color: 0075ca
-- name: packages:types
+- name: packages:scripts
+  color: 0075ca
+- name: packages:style
   color: 0075ca

.github/pr-labels.yml

@@ -22,33 +22,39 @@ packages:components:
       - any-glob-to-any-file:
           - packages/components/*
           - packages/components/**/*
-packages:engine:
+packages:execute:
   - changed-files:
       - any-glob-to-any-file:
-          - packages/engine/*
-          - packages/engine/**/*
-packages:env:
+          - packages/execute/*
+          - packages/execute/**/*
+packages:fetch:
   - changed-files:
       - any-glob-to-any-file:
-          - packages/env/*
-          - packages/env/**/*
-packages:helpers:
-  - changed-files:
-      - any-glob-to-any-file:
-          - packages/helpers/*
-          - packages/helpers/**/*
+          - packages/fetch/*
+          - packages/fetch/**/*
 packages:hooks:
   - changed-files:
       - any-glob-to-any-file:
           - packages/hooks/*
           - packages/hooks/**/*
+packages:logger:
+  - changed-files:
+      - any-glob-to-any-file:
+          - packages/logger/*
+          - packages/logger/**/*
+packages:runtimes:
+  - changed-files:
+      - any-glob-to-any-file:
+          - packages/runtimes/*
+          - packages/runtimes/**/*
+packages:scripts:
+  - changed-files:
+      - any-glob-to-any-file:
+          - packages/scripts/*
+          - packages/scripts/**/*
 packages:style:
   - changed-files:
       - any-glob-to-any-file:
           - packages/style/*
           - packages/style/**/*
-packages:types:
-  - changed-files:
-      - any-glob-to-any-file:
-          - packages/types/*
-          - packages/types/**/*
+

apps/browser-extension/package.json

@@ -14,10 +14,10 @@
   },
   "dependencies": {
     "@evaluate/components": "workspace:^",
-    "@evaluate/engine": "workspace:^",
-    "@evaluate/helpers": "workspace:^",
-    "@evaluate/shapes": "workspace:^",
-    "@evaluate/styles": "workspace:^",
+    "@evaluate/execute": "workspace:^",
+    "@evaluate/logger": "workspace:^",
+    "@evaluate/runtimes": "workspace:^",
+    "@evaluate/style": "workspace:^",
     "@t3-oss/env-core": "^0.13.8",
     "lucide-react": "^0.525.0",
     "posthog-js": "^1.257.0",

apps/browser-extension/src/background/index.ts

@@ -1,9 +1,5 @@
-import { executeCode } from '@evaluate/engine/execute';
-import {
-  getRuntimeDefaultFileName,
-  searchRuntimes,
-} from '@evaluate/engine/runtimes';
-import type { ExecuteResult, PartialRuntime } from '@evaluate/shapes';
+import { type ExecuteResult, executeCode } from '@evaluate/execute';
+import { type Runtime, searchForRuntimes } from '@evaluate/runtimes';
 import type { ProtocolWithReturn } from 'webext-bridge';
 import { onMessage, sendMessage } from 'webext-bridge/background';
 import browser from 'webextension-polyfill';
@@ -23,7 +19,7 @@ declare module 'webext-bridge' {
     >;
     executionFailed: ProtocolWithReturn<{ errorMessage: string }, void>;
     executionFinished: ProtocolWithReturn<
-      { code: string; runtimes: PartialRuntime[]; results: ExecuteResult[] },
+      { code: string; runtimes: Runtime[]; results: ExecuteResult[] },
       void
     >;
     getBackgroundSessionId: ProtocolWithReturn<void, string | undefined>;
@@ -47,7 +43,6 @@ browser.contextMenus.create({
 });
 
 browser.action.onClicked.addListener(async () => {
-  console.log(posthog);
   posthog?.capture('clicked_browser_action');
   browser.tabs.create({ url: `${env.VITE_PUBLIC_WEBSITE_URL}` });
 });
@@ -60,7 +55,7 @@ browser.contextMenus.onClicked.addListener(async (info, tab) => {
 
   const selection = await sendMessage('getSelectionInfo', void 0, endpoint);
   const { code, resolvables } = selection;
-  const runtimes = (await searchRuntimes(...resolvables)).slice(0, 5);
+  const runtimes = (await searchForRuntimes(resolvables)).slice(0, 5);
   if (!runtimes.length)
     return sendMessage('unknownRuntime', { code }, endpoint);
 
@@ -70,17 +65,12 @@ browser.contextMenus.onClicked.addListener(async (info, tab) => {
 
   const promises = [];
   for (const runtime of runtimes) {
-    const fileName = getRuntimeDefaultFileName(runtime.id) ?? 'file.code';
-    const initialPromise = executeCode({
-      runtime: runtime.id,
-      files: { [fileName]: code },
-      entry: fileName,
-    })
-      .then((result) => {
+    const initialPromise = executeCode(runtime, { code })
+      .then(([result, options]) => {
         posthog?.capture('executed_code', {
           runtime_id: runtime.id,
-          code_length: code.length,
-          code_lines: code.split('\n').length,
+          code_length: options.length,
+          code_lines: options.lines,
           compile_successful: result.compile?.success ?? null,
           execution_successful: result.success,
         });

apps/browser-extension/src/content-script/execution/dialog.tsx

@@ -11,7 +11,8 @@ import {
   TabsList,
   TabsTrigger,
 } from '@evaluate/components/tabs';
-import type { ExecuteResult, PartialRuntime } from '@evaluate/shapes';
+import type { ExecuteResult } from '@evaluate/execute';
+import type { Runtime } from '@evaluate/runtimes';
 import browser from 'webextension-polyfill';
 import env from '~/env';
 import { ResultDialog } from './result';
@@ -25,7 +26,7 @@ export function ExecutionDialog({
 }: {
   portal: HTMLElement;
   code: string;
-  runtimes: PartialRuntime[];
+  runtimes: Runtime[];
   results: ExecuteResult[];
   setResults: (results: ExecuteResult[]) => void;
 }) {
@@ -68,7 +69,7 @@ export function ExecutionDialog({
               {runtimes.map((runtime, i) => (
                 <TabsContent key={runtime.id} value={runtime.id}>
                   <ResultDialog
-                    code={code}
+                    options={{ code }}
                     runtime={runtime}
                     result={results[i]!}
                   />

apps/browser-extension/src/content-script/execution/index.tsx

@@ -1,13 +1,14 @@
 import { toast } from '@evaluate/components/toast';
-import type { ExecuteResult, PartialRuntime } from '@evaluate/shapes';
+import { type ExecuteResult, makePickRuntimePathname } from '@evaluate/execute';
+import type { Runtime } from '@evaluate/runtimes';
 import { useEffect, useState } from 'react';
 import { onMessage } from 'webext-bridge/content-script';
-import { makePickRuntimeUrl } from '~/helpers/make-url';
+import env from '~/env.js';
 import { ExecutionDialog } from './dialog';
 
 export function Execution({ dialogPortal }: { dialogPortal: HTMLElement }) {
   const [code, setCode] = useState('');
-  const [runtimes, setRuntimes] = useState<PartialRuntime[]>([]);
+  const [runtimes, setRuntimes] = useState<Runtime[]>([]);
   const [results, setResults] = useState<ExecuteResult[]>([]);
 
   useEffect(() => {
@@ -16,7 +17,10 @@ export function Execution({ dialogPortal }: { dialogPortal: HTMLElement }) {
     const removeUnknownRuntimeListener = onMessage(
       'unknownRuntime',
       ({ data: { code } }) => {
-        const pickUrl = makePickRuntimeUrl(code);
+        const pickUrl = new URL(
+          makePickRuntimePathname({ code }),
+          env.VITE_PUBLIC_WEBSITE_URL,
+        );
         toast.error('Could not determine runtime', {
           description:
             'Evaluate was unable to determine a runtime for the selected text.',

apps/browser-extension/src/content-script/execution/result.tsx

@@ -1,18 +1,23 @@
 import { Button } from '@evaluate/components/button';
 import { Label } from '@evaluate/components/label';
 import { Textarea } from '@evaluate/components/textarea';
-import type { ExecuteResult, PartialRuntime } from '@evaluate/shapes';
+import {
+  type ExecuteResult,
+  makeEditCodePathname,
+  makePickRuntimePathname,
+} from '@evaluate/execute';
+import type { Runtime } from '@evaluate/runtimes';
 import { ExternalLinkIcon } from 'lucide-react';
 import { twMerge as cn } from 'tailwind-merge';
-import { makeEditCodeUrl, makePickRuntimeUrl } from '~/helpers/make-url';
+import env from '~/env.js';
 
 export function ResultDialog({
-  code,
   runtime,
+  options,
   result,
 }: {
-  code: string;
-  runtime: PartialRuntime;
+  runtime: Runtime;
+  options: { code: string };
   result: ExecuteResult;
 }) {
   let output = result.output;
@@ -41,25 +46,31 @@ export function ResultDialog({
       </div>
 
       <div className="flex justify-end gap-2">
-        {code && (
+        {options.code && (
           <Button variant="secondary" asChild>
             <a
               target="_blank"
               rel="noreferrer noopener"
-              href={makePickRuntimeUrl(code)}
+              href={new URL(
+                makePickRuntimePathname(options),
+                env.VITE_PUBLIC_WEBSITE_URL,
+              ).toString()}
             >
               <span>Change Runtime</span>
               <ExternalLinkIcon size={16} className="ml-1" />
             </a>
           </Button>
         )}
 
-        {code && runtime && (
+        {options.code && runtime && (
           <Button variant="secondary" asChild>
             <a
               target="_blank"
               rel="noreferrer noopener"
-              href={makeEditCodeUrl(runtime, code)}
+              href={new URL(
+                makeEditCodePathname(runtime, options),
+                env.VITE_PUBLIC_WEBSITE_URL,
+              ).toString()}
             >
               <span>Edit Code</span>
               <ExternalLinkIcon size={16} className="ml-1" />

apps/browser-extension/src/content-script/index.tsx

@@ -1,10 +1,10 @@
 import { Toaster } from '@evaluate/components/toast';
 import { createRoot } from 'react-dom/client';
-import sonnerCss from 'sonner/dist/styles.css?inline';
+// import sonnerCss from 'sonner/dist/styles.css?inline';
 import { onMessage, sendMessage } from 'webext-bridge/content-script';
 import { extractRuntimeResolvables } from '~/helpers/runtime-resolvables';
 import posthog, { sessionLog } from '~/services/posthog';
-import tailwindCss from '../styles.css?inline';
+import tailwindCss from '../style.css?inline';
 import { Execution } from './execution';
 import { createIsolatedElement } from './shadow-root';
 
@@ -33,7 +33,7 @@ const { parentElement, portalElement, isolatedElement } = createIsolatedElement(
     styles: {
       // TODO: Figure out why this is necessary
       tailwind: tailwindCss.replaceAll('border-style:', '__ignore__:'),
-      sonner: sonnerCss,
+      // sonner: sonnerCss,
     },
     isolatedEvents: true,
   },

apps/browser-extension/src/services/posthog.ts

@@ -1,4 +1,4 @@
-import { createLogger } from '@evaluate/helpers/create-logger';
+import createLogger from '@evaluate/logger';
 import posthog from 'posthog-js';
 import env from '~/env';
 

apps/browser-extension/src/style.css

@@ -0,0 +1,4 @@
+@import "@evaluate/style";
+@import "@evaluate/components";
+@import "sonner/dist/styles.css";
+@source ".";

apps/discord-bot/package.json

@@ -18,15 +18,15 @@
     "build": "pnpm tsup"
   },
   "dependencies": {
-    "@buape/carbon": "0.9.0",
-    "@evaluate/engine": "workspace:^",
-    "@evaluate/helpers": "workspace:^",
-    "@evaluate/shapes": "workspace:^",
+    "@buape/carbon": "^0.9.0",
+    "@evaluate/execute": "workspace:^",
+    "@evaluate/logger": "workspace:^",
+    "@evaluate/runtimes": "workspace:^",
     "@t3-oss/env-core": "^0.13.8",
     "date-fns": "^4.1.0",
     "es-toolkit": "^1.39.7",
     "posthog-node": "^5.5.1",
-    "zod": "4.0.5"
+    "zod": "^4.0.5"
   },
   "devDependencies": {
     "tsup": "^8.5.0"

apps/discord-bot/src/commands/evaluate.ts

@@ -5,11 +5,11 @@ import {
   type CommandInteraction,
   type CommandOptions,
 } from '@buape/carbon';
-import { fetchRuntimes, searchRuntimes } from '@evaluate/engine/runtimes';
+import { fetchAllRuntimes, searchForRuntimes } from '@evaluate/runtimes';
 import { EvaluateModal } from '~/components/evaluate-modal';
 import { handleEvaluating } from '~/handlers/evaluate';
+import { getInteractionContext } from '~/helpers/session-context';
 import { captureEvent } from '~/services/posthog';
-import { getInteractionContext } from '~/utilities/session-context';
 
 export class EvaluateCommand extends Command {
   name = 'evaluate';
@@ -47,12 +47,12 @@ export class EvaluateCommand extends Command {
     const runtime = interaction.options.getString('runtime');
 
     if (runtime) {
-      const runtimes = await searchRuntimes(runtime);
+      const runtimes = await searchForRuntimes(runtime);
       return interaction.respond(
         runtimes.slice(0, 25).map((r) => ({ name: r.name, value: r.id })),
       );
     } else {
-      const runtimes = await fetchRuntimes();
+      const runtimes = await fetchAllRuntimes();
       return interaction.respond(
         runtimes.slice(0, 25).map((r) => ({ name: r.name, value: r.id })),
       );
@@ -70,7 +70,7 @@ export class EvaluateCommand extends Command {
     const args = use.options.getString('arguments');
 
     if (runtime && code) {
-      return handleEvaluating(use, { runtime, code, args, input });
+      return handleEvaluating(use, runtime, { code, args, input });
     } else {
       const modal = new EvaluateModal({ runtime, code, args, input });
       return use.showModal(modal);