fixes

flydelabs · Feb 20, 2024 · ac74aae · ac74aae
1 parent 4a77838
commit ac74aae
Show file tree

Hide file tree

Showing 9 changed files with 36 additions and 116 deletions.
diff --git a/flow-editor/src/visual-node-editor/MacroInstanceEditor/ConfigurableInputEditor.tsx b/flow-editor/src/visual-node-editor/MacroInstanceEditor/ConfigurableInputEditor.tsx
@@ -1,23 +1,27 @@
 import { Radio, RadioGroup } from "@blueprintjs/core";
 import React from "react";
-import { ValueCompProps } from "./ValueCompProps";
 import { ConfigurableInput } from "@flyde/core";
 
-export interface ConfigurableInputEditorProps<T extends Record<string, any>> {
+export interface ValueCompProps<T> {
+  value: T;
+  onChange: (value: T) => void;
+}
+
+export interface ConfigurableInputEditorProps<T> {
   value: ConfigurableInput<T>;
   onChange: (value: ConfigurableInput<T>) => void;
   valueRenderer: React.FC<ValueCompProps<T>>;
   modeLabel: string;
   defaultStaticValue: T;
 }
 
-export const ConfigurableInputEditor = <T extends Record<string, any>>({
+export const ConfigurableInputEditor = function <T>({
   value,
   onChange,
   valueRenderer: ValueRenderer,
   defaultStaticValue,
   modeLabel,
-}: ConfigurableInputEditorProps<T>) => {
+}: ConfigurableInputEditorProps<T>) {
   const handleModeChange = (e: React.FormEvent<HTMLInputElement>) => {
     onChange({
       mode: e.currentTarget.value as "static" | "dynamic",

diff --git a/flow-editor/src/visual-node-editor/MacroInstanceEditor/ValueCompProps.ts b/flow-editor/src/visual-node-editor/MacroInstanceEditor/ValueCompProps.ts
diff --git a/flow-editor/src/visual-node-editor/MacroInstanceEditor/buildStructuredMacroEditor.tsx b/flow-editor/src/visual-node-editor/MacroInstanceEditor/buildStructuredMacroEditor.tsx
@@ -11,10 +11,14 @@ import {
   MacroEditorFieldDefinition,
   MacroEditorFieldDefinitionType,
 } from "@flyde/core";
-import { ValueCompProps } from "./ValueCompProps";
 import { SimpleJsonEditor } from "./SimpleJsonEditor";
 import { ConfigurableInputEditor } from "./ConfigurableInputEditor";
 
+export interface ValueCompProps<T> {
+  value: T;
+  onChange: (value: T) => void;
+}
+
 export function MacroEditorBaseValueComp(
   props: ValueCompProps<any> & { config: MacroEditorFieldDefinitionType }
 ) {
@@ -120,79 +124,3 @@ export function buildStructuredMacroEditorComp<T>(
     );
   };
 }
-
-// export const TimedNodeEditor: MacroEditorComp<TimingNodeConfig> =
-//   function TimedNodeEditor(props) {
-//     const { value, onChange } = props;
-
-//     return (
-//       <>
-//         <FormGroup
-//           label="Time mode:"
-//           inline
-//           helperText="If dynamic mode is chosen, a new input pin will be exposed for the time value."
-//         >
-//           <HTMLSelect
-//             value={value.mode}
-//             onChange={(e) =>
-//               onChange({
-//                 ...value,
-//                 mode: e.target.value as any,
-//               })
-//             }
-//           >
-//             <option value="static">Static</option>
-//             <option value="dynamic">Dynamic (via input)</option>
-//           </HTMLSelect>
-//         </FormGroup>
-//         {value.mode === "static" ? (
-//           <FormGroup label="Time (in milliseconds):" inline>
-//             <NumericInput
-//               value={value.timeMs}
-//               onValueChange={(e) => onChange({ ...value, timeMs: e })}
-//             />
-//           </FormGroup>
-//         ) : null}
-//       </>
-//     );
-//   };
-
-// const IntervalEditor: MacroEditorComp<IntervalConfig> =
-//   function IntervalEditor({ value, onChange }) {
-//     return (
-//       <>
-//         <ConfigurableInputEditor
-//           value={value.time}
-//           onChange={(time) => onChange({ ...value, time })}
-//           valueRenderer={(rendererProps) => (
-//             <FormGroup label="Time (in milliseconds):" inline>
-//               <NumericInput
-//                 value={rendererProps.value.timeMs}
-//                 onValueChange={(number) =>
-//                   rendererProps.onChange({ timeMs: number })
-//                 }
-//               />
-//             </FormGroup>
-//           )}
-//           modeLabel="Interval mode:"
-//           defaultStaticValue={{ timeMs: 2000 }}
-//         />
-
-//         <ConfigurableInputEditor
-//           value={value.value}
-//           onChange={(_value) => onChange({ ...value, value: _value })}
-//           valueRenderer={(rendererProps) => (
-//             <FormGroup label="Value:" inline>
-//               <SimpleJsonEditor
-//                 value={rendererProps.value.jsonValue}
-//                 onChange={(jsonValue) => rendererProps.onChange({ jsonValue })}
-//                 label=""
-//               />
-//             </FormGroup>
-//           )}
-//           modeLabel="Value mode:"
-//           defaultStaticValue={{ jsonValue: "" }}
-//         />
-//       </>
-//     );
-//   };
diff --git a/stdlib/src/Lists/Collect/Collect.flyde.ts b/stdlib/src/Lists/Collect/Collect.flyde.ts
@@ -1,15 +1,15 @@
 import { InputPinMap, MacroNode, isDefined } from "@flyde/core";
-import { ConfigurableInput } from "../../lib/ConfigurableInput";
 import { timeToString } from "../../Timing/common";
+import { ConfigurableInput } from "@flyde/core";
 
 export type CollectConfigTime = {
   strategy: "time";
-  time: ConfigurableInput<{ timeMs?: number }>;
+  time: ConfigurableInput<number>;
 };
 
 export type CollectConfigCount = {
   strategy: "count";
-  count: ConfigurableInput<{ count?: number }>;
+  count: ConfigurableInput<number>;
 };
 
 export type CollectConfigTrigger = {
@@ -26,7 +26,7 @@ export const Collect: MacroNode<CollectConfig> = {
   displayName: "Collect",
   description: "Collects values into a list. Over time, count, or trigger.",
   namespace: "Lists",
-  defaultData: { strategy: "count", count: { mode: "static", count: 3 } },
+  defaultData: { strategy: "count", count: { mode: "static", value: 3 } },
   definitionBuilder: (config) => {
     const inputs = {
       value: { description: "Value to collect" },
@@ -47,13 +47,13 @@ export const Collect: MacroNode<CollectConfig> = {
     const displayName = (() => {
       if (config.strategy === "time") {
         if (config.time.mode === "static") {
-          return `Collect over ${timeToString(config.time.timeMs)}`;
+          return `Collect over ${timeToString(config.time.value)}`;
         } else {
           return "Collect over time";
         }
       } else if (config.strategy === "count") {
         if (config.count.mode === "static") {
-          return `Collect ${config.count.count} values`;
+          return `Collect ${config.count.value} values`;
         } else {
           return "Collect values";
         }
@@ -66,14 +66,14 @@ export const Collect: MacroNode<CollectConfig> = {
       if (config.strategy === "time") {
         if (config.time.mode === "static") {
           return `Emits a list of all values received, from the first value and until ${timeToString(
-            config.time.timeMs
+            config.time.value
           )} pass.`;
         } else {
           return "Emits a list of all values received, from the first value and until the specified amount of time passes.";
         }
       } else if (config.strategy === "count") {
         if (config.count.mode === "static") {
-          return `Collect ${config.count.count} values and emit a list of them.`;
+          return `Collect ${config.count.value} values and emit a list of them.`;
         } else {
           return "Collect a specified amount of values and emit a list of them.";
         }
@@ -107,7 +107,7 @@ export const Collect: MacroNode<CollectConfig> = {
 
       if (config.strategy === "time") {
         const timeValue =
-          config.time.mode === "dynamic" ? time : config.time.timeMs;
+          config.time.mode === "dynamic" ? time : config.time.value;
 
         const timer = adv.state.get("timer");
         if (!timer) {
@@ -120,7 +120,7 @@ export const Collect: MacroNode<CollectConfig> = {
         }
       } else if (config.strategy === "count") {
         const countValue =
-          config.count.mode === "dynamic" ? count : config.count.count;
+          config.count.mode === "dynamic" ? count : config.count.value;
         if (list.length >= countValue) {
           outputs.list.next(list);
           adv.state.set("list", []);

diff --git a/stdlib/src/Lists/Collect/Collect.tsx b/stdlib/src/Lists/Collect/Collect.tsx
@@ -11,11 +11,11 @@ const defaultValuePerStrategy: Record<
 > = {
   count: {
     strategy: "count",
-    count: { mode: "static", count: 2 },
+    count: { mode: "static", value: 2 },
   },
   time: {
     strategy: "time",
-    time: { mode: "static", timeMs: 2000 },
+    time: { mode: "static", value: 2000 },
   },
   trigger: {
     strategy: "trigger",
@@ -45,18 +45,18 @@ const CollectEditor: MacroEditorComp<CollectConfig> = function CollectEditor({
             valueRenderer={(props) => (
               <FormGroup label="Count:" inline>
                 <NumericInput
-                  value={props.value.count}
+                  value={props.value}
                   onValueChange={(e) =>
                     onChange({
                       ...value,
-                      count: { mode: "static", count: e },
+                      count: { mode: "static", value: e },
                     })
                   }
                 />
               </FormGroup>
             )}
             modeLabel="Count mode:"
-            defaultStaticValue={{ count: 2 }}
+            defaultStaticValue={2}
           />
         );
       case "time":
@@ -67,18 +67,18 @@ const CollectEditor: MacroEditorComp<CollectConfig> = function CollectEditor({
             valueRenderer={(props) => (
               <FormGroup label="Time:" inline>
                 <NumericInput
-                  value={props.value.timeMs}
+                  value={props.value}
                   onValueChange={(e) =>
                     onChange({
                       ...value,
-                      time: { mode: "static", timeMs: e },
+                      time: { mode: "static", value: e },
                     })
                   }
                 />
               </FormGroup>
             )}
             modeLabel="Time mode:"
-            defaultStaticValue={{ timeMs: 2000 }}
+            defaultStaticValue={2000}
           />
         );
     }

diff --git a/stdlib/src/Timing/Delay/Delay.tsx b/stdlib/src/Timing/Delay/Delay.tsx
diff --git a/stdlib/src/lib/ConfigurableInputEditor.tsx b/stdlib/src/lib/ConfigurableInputEditor.tsx
@@ -7,21 +7,21 @@ export interface ValueCompProps<T> {
   onChange: (value: T) => void;
 }
 
-export interface ConfigurableInputEditorProps<T extends Record<string, any>> {
+export interface ConfigurableInputEditorProps<T> {
   value: ConfigurableInput<T>;
   onChange: (value: ConfigurableInput<T>) => void;
   valueRenderer: React.FC<ValueCompProps<T>>;
   modeLabel: string;
   defaultStaticValue: T;
 }
 
-export const ConfigurableInputEditor = <T extends Record<string, any>>({
+export const ConfigurableInputEditor = function <T>({
   value,
   onChange,
   valueRenderer: ValueRenderer,
   defaultStaticValue,
   modeLabel,
-}: ConfigurableInputEditorProps<T>) => {
+}: ConfigurableInputEditorProps<T>) {
   const handleModeChange = (e: React.FormEvent<HTMLInputElement>) => {
     onChange({
       mode: e.currentTarget.value as "static" | "dynamic",

diff --git a/website/src/pages/_hero-example/ExampleDebounceThrottle.flyde b/website/src/pages/_hero-example/ExampleDebounceThrottle.flyde
@@ -79,7 +79,7 @@ node:
         strategy: count
         count:
           mode: static
-          count: 3
+          value: 3
       style:
         size: small
     - pos:

diff --git a/website/src/pages/_hero-example/ExampleReactivity.flyde b/website/src/pages/_hero-example/ExampleReactivity.flyde
@@ -59,7 +59,7 @@ node:
         strategy: count
         count:
           mode: static
-          count: 3
+          value: 3
     - pos:
         x: -630.6297778320313
         y: -425.5123219069296