update frontend to use split operators

This commit is contained in:
Felix Kaspar 2024-07-14 00:53:57 +02:00
parent 4056d87335
commit 40ed0f68db
3 changed files with 31 additions and 35 deletions

View File

@ -1,11 +1,10 @@
import { Link } from "react-router-dom";
import { BaseSyntheticEvent, useRef, useState } from "react";
import { Operator } from "@stirling-pdf/shared-operations/src/functions";
import i18next from "i18next";
import { Operator, OperatorSchema } from "@stirling-pdf/shared-operations/src/functions";
import Joi from "@stirling-tools/joi";
import { BuildFields } from "../components/fields/BuildFields";
import { listOperatorNames } from "@stirling-pdf/shared-operations/src/workflow/operatorAccessor";
import { getOperatorByName, getSchemaByName, listOperatorNames } from "@stirling-pdf/shared-operations/src/workflow/operatorAccessor";
import { PdfFile, RepresentationType } from "@stirling-pdf/shared-operations/src/wrappers/PdfFile";
import { Action } from "@stirling-pdf/shared-operations/declarations/Action";
@ -13,7 +12,10 @@ function Dynamic() {
const [schemaDescription, setSchemaDescription] = useState<Joi.Description>();
const operators = listOperatorNames();
const activeOperatorName = useRef<string>();
const activeOperator = useRef<typeof Operator>();
const activeSchema = useRef<OperatorSchema>();
async function selectionChanged(s: BaseSyntheticEvent) {
const selectedValue = s.target.value;
@ -23,36 +25,28 @@ function Dynamic() {
return;
}
console.log("Loading namespaces for", selectedValue);
await i18next.loadNamespaces(selectedValue, (err, t) => {
if (err) throw err;
console.log(t);
});
console.log("Loading namespaces done");
getSchemaByName(selectedValue).then(async schema => {
if(schema) {
const description = schema.schema.describe();
activeOperatorName.current = selectedValue;
activeOperator.current = await getOperatorByName(selectedValue);
activeSchema.current = schema;
console.log("Loading modules for", selectedValue);
const LoadingModule = import(`@stirling-pdf/shared-operations/src/functions/${selectedValue}`) as Promise<{ [key: string]: typeof Operator }>;
LoadingModule.then((Module) => {
const Operator = Module[capitalizeFirstLetter(selectedValue)];
const description = Operator.schema.describe();
console.log(Operator.schema);
console.log(description);
activeOperator.current = Operator;
// This will update children
setSchemaDescription(description);
// This will update children
setSchemaDescription(description);
}
});
}
async function handleSubmit(e: BaseSyntheticEvent) {
console.clear();
if(!activeOperator.current) {
if(!activeOperatorName.current || !activeOperator.current || !activeSchema.current) {
throw new Error("Please select an Operator in the Dropdown");
}
const formData = new FormData(e.target);
const values = Object.fromEntries(formData.entries());
let action: Action = {type: activeOperator.current.type, values: values};
let action: Action = {type: activeOperatorName.current, values: values};
// Validate PDF File
@ -76,7 +70,7 @@ function Dynamic() {
}
}
const validationResults = activeOperator.current.schema.validate({input: inputs, values: action.values});
const validationResults = activeSchema.current.schema.validate({input: inputs, values: action.values});
if(validationResults.error) {
console.error({error: "Validation failed", details: validationResults.error.message}, validationResults.error.stack);
@ -87,8 +81,7 @@ function Dynamic() {
operation.run(validationResults.value.input, (progress) => {
console.log("OperationProgress: " + progress.operationProgress, "CurFileProgress: " + progress.curFileProgress);
}).then(async pdfFiles => {
console.log("Done");
console.log(pdfFiles);
console.log("Result", pdfFiles);
for await (const pdfFile of (pdfFiles as PdfFile[])) {
var blob = new Blob([await pdfFile.uint8Array], {type: "application/pdf"});
@ -99,10 +92,6 @@ function Dynamic() {
}
};
function capitalizeFirstLetter(string: String) {
return string.charAt(0).toUpperCase() + string.slice(1);
}
return (
<div>
<h2>Dynamic test page for operators</h2>

View File

@ -2,7 +2,7 @@ import express, { Request, Response } from "express";
const router = express.Router();
import multer from "multer";
const upload = multer();
import { getOperatorByName } from "@stirling-pdf/shared-operations/src/workflow/operatorAccessor";
import { getOperatorByName, getSchemaByName } from "@stirling-pdf/shared-operations/src/workflow/operatorAccessor";
import { PdfFile } from "@stirling-pdf/shared-operations/src/wrappers/PdfFile";
import { respondWithPdfFiles } from "../../utils/response-utils";
@ -30,19 +30,26 @@ async function handleEndpoint(req: Request, res: Response) {
}
const pdfFiles: PdfFile[] = validationResults.value;
const operator = await getOperatorByName(req.params.func);
const schema = await getSchemaByName(req.params.func);
if(operator) {
if(schema) {
const action: Action = {type: req.params.func, values: req.body};
const validationResults = operator.schema.validate({input: pdfFiles, values: action.values});
const validationResults = schema.schema.validate({input: pdfFiles, values: action.values});
if(validationResults.error) {
res.status(400).json({error: "Value validation failed", details: validationResults.error.message});
}
else {
action.values = validationResults.value.values;
const operation = new operator(action);
const Operator = await getOperatorByName(req.params.func);
if(!Operator) {
res.status(400).json({error: `the operator of type ${req.params.func} does not exist`});
return
}
const operation = new Operator(action);
operation.run(validationResults.value.input, (progress) => {}).then(pdfFiles => {
respondWithPdfFiles(res, pdfFiles, req.params.func + "_result");
});

View File

@ -19,7 +19,7 @@ export async function getSchemaByName(name: string): Promise<OperatorSchema | un
// Check if exists
if(!compileTimeOperatorList.find(e => e.basename == name)) return;
i18next.loadNamespaces(name, (err, t) => { if (err) throw err; console.log(t) });
await i18next.loadNamespaces(name, (err) => { if (err) throw err; });
const loadedModule = await import("../functions/" + name + ".schema.ts");
const schema = loadedModule.default;
if(!schema) {