Merge branch 'plugins-and-groups' into groups

app/README.md

@@ -9,11 +9,11 @@ The following installation steps are a part of the
 [install script](../install.bash).
 
 First, install [`nvm`](https://github.com/nvm-sh/nvm) and install and set your
-node version to `v17.9.0` using `nvm`.
+node version to `v18.1.0` using `nvm`.
 
 ```sh
-nvm install v17.9.0
-nvm use v17.9.0
+nvm install v18.1.0
+nvm use v18.1.0
 ```
 
 Then install `yarn` globally in your node environment with `npm`:

app/package.json

@@ -17,7 +17,7 @@
     "devDependencies": {
         "concurrently": "^7.2.1",
         "patch-package": "^6.4.7",
-        "typescript": "4.2.4",
+        "typescript": "^4.7.4",
         "typescript-plugin-css-modules": "^3.4.0"
     },
     "workspaces": [

app/packages/aggregations/babel.config.js

@@ -0,0 +1,6 @@
+module.exports = {
+  presets: [
+    ['@babel/preset-env', {targets: {node: 'current'}}],
+    '@babel/preset-typescript',
+  ],
+};

app/packages/aggregations/package.json

@@ -0,0 +1,34 @@
+{
+  "name": "@fiftyone/aggregations",
+  "author": "Voxel51, Inc.",
+  "version": "0.0.0",
+  "description": "Query fiftyone from a browser",
+  "homepage": "https://github.com/voxel51/fiftyone/app/packages/plugins",
+  "license": "Apache-2.0",
+  "bugs": {
+    "url": "https://github.com/voxel51/fiftyone/"
+  },
+  "main": "./src/index.ts",
+  "scripts": {
+    "dev": "vite",
+    "test": "jest",
+    "gen:aggs": "node scripts/generateAggregationClasses.js"
+  },
+  "prettier": "@fiftyone/prettier-config",
+  "private": true,
+  "files": [
+    "dist",
+    "README.md"
+  ],
+  "devDependencies": {
+    "@babel/preset-typescript": "^7.17.12",
+    "@fiftyone/prettier-config": "*",
+    "@types/react": "^18.0.12",
+    "fs-extra": "^10.1.0",
+    "jest": "^28.1.1",
+    "lodash": "^4.17.21",
+    "prettier": "2.2.1",
+    "typescript": "4.2.4",
+    "vite": "2.4.2"
+  }
+}

app/packages/aggregations/scripts/generateAggregationClasses.js

@@ -0,0 +1,118 @@
+const fs = require("fs-extra");
+const path = require("path");
+const { camelCase } = require("lodash");
+
+const rootDir = path.join(__dirname, "..", "..", "..", "..");
+const aggregationsDotPy = path.join(rootDir, "fiftyone/core/aggregations.py");
+const pluginSrc = path.join(__dirname, "..", "src");
+const generatedAggFile = path.join(pluginSrc, "aggregations.ts");
+
+async function main() {
+  const contents = await fs.readFile(aggregationsDotPy, "utf-8");
+  const lines = contents.split("\n");
+
+  let classes = [];
+  let currentClass = null;
+  let parsingArgs = false;
+  let parsingComment = false;
+  let results = {};
+  for (let i = 0; i < lines.length; i++) {
+    const line = lines[i];
+    // console.log(line)
+    if (line.trim().startsWith('"""')) {
+      parsingComment = !parsingComment;
+      if (line.trim().endsWith('"""') && line.trim() != '"""')
+        parsingComment = !parsingComment;
+      if (!parsingComment) parsingArgs = false;
+      continue;
+    }
+
+    if (parsingComment && currentClass) {
+      if (line.trim().startsWith("Args:")) {
+        parsingArgs = true;
+        continue;
+      }
+      if (line.trim().startsWith("Returns:")) {
+        parsingArgs = false;
+        continue;
+      }
+      if (
+        parsingArgs &&
+        line.startsWith("        ") &&
+        !line.startsWith("          ")
+      ) {
+        const [full, argName] = line.trim().match(/^(\w+)\s*[\:|\(]/);
+        console.log("  ", argName);
+        currentClass.args[argName] = line.trim();
+      }
+    } else {
+      if (line.startsWith("class") && line.trim().endsWith("(Aggregation):")) {
+        const [full, m1] = line.trim().match(/class (\w+)\(Aggregation\)\:/);
+        currentClass = { name: m1, args: [] };
+        classes.push(currentClass);
+      }
+    }
+
+    console.log(classes);
+    // to js
+    const js = toJS(classes);
+    fs.writeFile(generatedAggFile, js, "utf-8");
+  }
+}
+
+function toJS(classes) {
+  let output = ["import Aggregation from './Aggregation'"];
+  for (let cls of classes) {
+    output.push(`
+${printType(cls)}
+
+export class ${cls.name} extends Aggregation {
+  constructor(params: ${cls.name}Params = null) {
+    super()
+    this.params = params
+    this._cls = 'fiftyone.core.aggregations.${cls.name}'
+    this._nameMap = new Map(Object.entries({
+${printNameMap(cls.args)}
+    }))
+  }
+}`);
+  }
+  return output.join("\n");
+}
+
+function printType(cls) {
+  return `export type ${cls.name}Params = {
+${printArgs(cls.args)}
+}`;
+}
+
+function printArgs(args) {
+  const output = Object.keys(args).map((a) => `  ${fromPyToJS(a)}?: any`);
+  return output.join(",\n");
+}
+
+function printToJSON(args) {
+  const output = Object.keys(args).map(
+    (a) => `      ['${a}', this.params.${fromPyToJS(a)}]`
+  );
+  return `[
+${output.join(",\n")}
+    ]`;
+}
+
+function printNameMap(args) {
+  return Object.keys(args)
+    .map((k) => {
+      return `      ${fromPyToJS(k)}: '${k}'`;
+    })
+    .join(",\n");
+}
+
+function fromPyToJS(argName) {
+  return camelCase(argName);
+}
+
+main().catch((e) => {
+  console.error(e);
+  process.exit(1);
+});

app/packages/aggregations/src/Aggregation.ts

@@ -0,0 +1,25 @@
+export default class Aggregation {
+  _cls: string;
+  _nameMap: Map<string, string>;
+  params: object;
+  toJSON(): {
+    _cls: string;
+    kwargs: Array<Array<any>>;
+  } {
+    const _cls = this._cls;
+    const kwargs = [];
+    for (const [paramName, paramValue] of Object.entries(this.params)) {
+      if (paramValue !== null && paramValue !== undefined) {
+        kwargs.push([this._getSerializedName(paramName), paramValue]);
+      }
+    }
+
+    return { _cls, kwargs };
+  }
+  private _getSerializedName(paramName: string) {
+    if (this._nameMap.has(paramName)) {
+      return this._nameMap.get(paramName);
+    }
+    return paramName;
+  }
+}