studio: upgrade to 22 fixes

CONTRIBUTING.md

@@ -108,7 +108,6 @@ instructions [here](https://docs.microsoft.com/en-us/windows/wsl/install-win10).
 ### How is a contribution reviewed and accepted?
 
 - **If you are opening an issue...**
-
   - Fill out all required sections for your issue type. Issues that are not
     filled out properly will be flagged as `invalid` and will be closed if not
     updated.

packages/api/package.json

@@ -21,11 +21,11 @@
     "prepare:redoc": "redoc-cli bundle --cdn -o docs/index.html src/schema/schema.yaml",
     "prepare:type-check": "tsc --pretty --noEmit",
     "prepare": "run-s compile-schemas && run-p \"prepare:**\"",
-    "compile-schemas": "node -r esm src/schema/compile-schemas.js",
-    "pull-ai-schema": "node -r esm src/schema/pull-ai-schema.js",
+    "compile-schemas": "node src/schema/compile-schemas.mjs",
+    "pull-ai-schema": "node dist/schema/pull-ai-schema.js",
     "dev-server": "run-s compile-schemas && node dist/cli.js",
     "redoc": "nodemon -w src/schema/schema.yaml -x npm run prepare:redoc",
-    "siserver": "nodemon -w dist -x node -r esm dist/stream-info-service.js -e js,yaml",
+    "siserver": "nodemon -w dist -x node dist/stream-info-service.js -e js,yaml",
     "dev:server": "NODE_ENV=development LP_API_FRONTEND=false nodemon --inspect -w dist -x node dist/cli.js -e js,yaml",
     "dev:babel": "yarn run prepare:babel --watch",
     "dev:yaml-json": "nodemon -w ./src/schema -e 'yaml' -x 'run-s compile-schemas'",
@@ -95,7 +95,7 @@
     "lodash": "^4.17.21",
     "m3u8-parser": "^4.4.0",
     "mime": "^3.0.0",
-    "minio": "^7.0.12",
+    "minio": "8",
     "morgan": "^1.9.1",
     "mqtt": "^4.2.6",
     "ms": "^2.1.2",
@@ -165,7 +165,7 @@
     ]
   },
   "browserslist": [
-    "node 16"
+    "node 22"
   ],
   "types": "src/schema/types.d.ts",
   "nodemonConfig": {

packages/api/src/schema/compile-schemas.js → packages/api/src/schema/compile-schemas.mjs

@@ -1,12 +1,17 @@
 import Ajv from "ajv";
 import ajvFormats from "ajv-formats";
-import standaloneCode from "ajv/dist/standalone";
+import standaloneCode from "ajv/dist/standalone/index.js";
 import fs from "fs-extra";
-import { safeLoad as parseYaml, safeDump as serializeYaml } from "js-yaml";
+import pkg from 'js-yaml';
+const { safeLoad: parseYaml, safeDump: serializeYaml } = pkg;
 import $RefParser from "json-schema-ref-parser";
 import { compile as generateTypes } from "json-schema-to-typescript";
 import _ from "lodash";
 import path from "path";
+import { fileURLToPath } from 'url';
+
+const __filename = fileURLToPath(import.meta.url);
+const __dirname = path.dirname(__filename);
 
 // This takes schema.yaml as its input and produces a few outputs.
 // 1. types.d.ts, TypeScript definitions of the JSON-schema objects
@@ -57,7 +62,7 @@ const schemaDir = path.resolve(__dirname, ".");
 process.chdir(schemaDir);
 
 const validatorDir = path.resolve(schemaDir, "validators");
-const schemaDistDir = path.resolve(__dirname, "..", "dist", "schema");
+const schemaDistDir = path.resolve(__dirname, "..", "..", "dist", "schema");
 fs.ensureDirSync(validatorDir);
 fs.ensureDirSync(schemaDistDir);
 

packages/api/src/schema/pull-ai-schema.js → packages/api/src/schema/pull-ai-schema.ts

@@ -1,6 +1,7 @@
 import fs from "fs-extra";
 import { safeLoad as parseYaml, safeDump as serializeYaml } from "js-yaml";
 import path from "path";
+import fetch from "node-fetch";
 
 // This downloads the AI schema from the AI worker repo and saves in the local
 // ai-api-schema.yaml file, referenced by our main api-schema.yaml file.
@@ -14,6 +15,7 @@ export const defaultModels = {
   "segment-anything-2": "facebook/sam2-hiera-large",
   llm: "meta-llama/Meta-Llama-3.1-8B-Instruct",
 };
+
 const schemaDir = path.resolve(__dirname, ".");
 const aiSchemaUrl =
   "https://raw.githubusercontent.com/livepeer/ai-worker/refs/heads/main/runner/gateway.openapi.yaml";
@@ -31,7 +33,7 @@ const studioApiErrorSchema = {
   },
 };
 
-const write = (dir, data) => {
+const write = (dir: string, data: string) => {
   if (fs.existsSync(dir)) {
     const existing = fs.readFileSync(dir, "utf8");
     if (existing === data) {
@@ -42,17 +44,20 @@ const write = (dir, data) => {
   console.log(`wrote ${dir}`);
 };
 
-const mapObject = (obj, fn) => {
+const mapObject = (
+  obj: any,
+  fn: (key: string, value: any) => [string, any],
+) => {
   return Object.fromEntries(
     Object.entries(obj).map(([key, value]) => fn(key, value)),
   );
 };
 
-const downloadAiSchema = async () => {
+export const downloadAiSchema = async () => {
   // download the file
   const response = await fetch(aiSchemaUrl);
   const data = await response.text();
-  const schema = parseYaml(data);
+  const schema = parseYaml(data) as any;
 
   // remove info and servers fields
   delete schema.info;
@@ -105,7 +110,7 @@ const downloadAiSchema = async () => {
   schema.components.schemas = mapObject(
     schema.components.schemas,
     (key, value) => {
-      let pipelineName;
+      let pipelineName: string;
       if (key.endsWith("Params")) {
         pipelineName = key.slice(0, -6);
       } else if (key.startsWith("Body_gen")) {
@@ -119,9 +124,12 @@ const downloadAiSchema = async () => {
         .toLowerCase();
 
       if (pipelineName in defaultModels && value.properties.model_id) {
-        value.properties.model_id.default = defaultModels[pipelineName];
+        value.properties.model_id.default =
+          defaultModels[pipelineName as keyof typeof defaultModels];
         if (value.required) {
-          value.required = value.required.filter((key) => key !== "model_id");
+          value.required = value.required.filter(
+            (key: string) => key !== "model_id",
+          );
         }
       }
       value.additionalProperties = false;
@@ -134,7 +142,10 @@ const downloadAiSchema = async () => {
   write(path.resolve(schemaDir, "ai-api-schema.yaml"), yaml);
 };
 
-downloadAiSchema().catch((err) => {
-  console.error(err);
-  process.exit(1);
-});
+// Only run the download when this file is executed directly, not when imported
+if (require.main === module) {
+  downloadAiSchema().catch((err) => {
+    console.error(err);
+    process.exit(1);
+  });
+}

packages/www/components/FileUpload/AssetFailedStatusItem.tsx

@@ -12,7 +12,7 @@ const AssetFailedStatusItem = ({ asset }: { asset: Asset }) => {
     <Text variant="red">
       {name?.length > MAX_FILENAME_LENGTH
         ? `${name.slice(0, MAX_FILENAME_LENGTH)}...`
-        : name ?? ""}
+        : (name ?? "")}
     </Text>
   );
 

packages/www/components/FileUpload/FileItem.tsx

@@ -13,7 +13,7 @@ const FileItem = ({ fileUpload }: { fileUpload: FileUpload }) => {
     <Text>
       {name?.length > MAX_FILENAME_LENGTH
         ? `${name.slice(0, MAX_FILENAME_LENGTH)}...`
-        : name ?? ""}
+        : (name ?? "")}
     </Text>
   );
 

packages/www/css/markdown.css

@@ -3,8 +3,9 @@
   -webkit-text-size-adjust: 100%;
   color: #171717;
   background-color: #ffffff;
-  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial,
-    sans-serif, "Apple Color Emoji", "Segoe UI Emoji";
+  font-family:
+    -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif,
+    "Apple Color Emoji", "Segoe UI Emoji";
   font-size: 18px;
   line-height: 1.7;
   word-wrap: break-word;

packages/www/next-env.d.ts

@@ -2,4 +2,4 @@
 /// <reference types="next/image-types/global" />
 
 // NOTE: This file should not be edited
-// see https://nextjs.org/docs/basic-features/typescript for more information.
+// see https://nextjs.org/docs/pages/building-your-application/configuring/typescript for more information.