feat: support keep last

backend/funix/decorator/__init__.py

@@ -236,6 +236,7 @@ def funix(
     autorun: bool = False,
     disable: bool = False,
     figure_to_image: bool = False,
+    keep_last: bool = False,
 ):
     """
     Decorator for functions to convert them to web apps
@@ -277,6 +278,7 @@ def funix(
         autorun(bool): allow users to use continuity runs on the front end
         disable(bool): disable this function
         figure_to_image(bool): convert matplotlib figure to image
+        keep_last(bool): keep the last input and output in the frontend
 
     Returns:
         function: the decorated function
@@ -453,6 +455,7 @@ def _function_reactive_update():
                     "websocket": need_websocket,
                     "reactive": has_reactive_params,
                     "autorun": autorun,
+                    "keepLast": keep_last,
                 }
             )
 

frontend/src/App.tsx

@@ -668,7 +668,7 @@ const App = () => {
               spacing={2}
             >
               <Typography variant="body2">
-                Power by <Link href="https://funix.io">Funix.io</Link>,
+                Powered by <Link href="https://funix.io">Funix.io</Link>,
                 minimally building apps in Python
               </Typography>
               <Box>

frontend/src/components/FunixFunction/InputPanel.tsx

@@ -9,7 +9,7 @@ import {
 import Card from "@mui/material/Card"; // eslint-disable-next-line @typescript-eslint/ban-ts-comment
 // @ts-ignore
 import Form from "@rjsf/material-ui/v5";
-import React, { useEffect, useState } from "react";
+import React, { useEffect, useRef, useState } from "react";
 import {
   callFunctionRaw,
   FunctionDetail,
@@ -36,7 +36,14 @@ const InputPanel = (props: {
   const [asyncWaiting, setAsyncWaiting] = useState(false);
   const [requestDone, setRequestDone] = useState(true);
   const [
-    { functionSecret, backHistory, backConsensus, saveHistory, appSecret },
+    {
+      functionSecret,
+      backHistory,
+      backConsensus,
+      saveHistory,
+      appSecret,
+      last,
+    },
     setStore,
   ] = useAtom(storeAtom);
   const { setInputOutput } = useFunixHistory();
@@ -45,6 +52,7 @@ const InputPanel = (props: {
   const [tempOutput, setTempOutput] = useState<string | null>(null);
   const tempOutputRef = React.useRef<string | null>(null);
   const [autoRun, setAutoRun] = useState(false);
+  const lock = useRef(false);
 
   const isLarge =
     Object.values(props.detail.schema.properties).findIndex((value) => {
@@ -57,6 +65,14 @@ const InputPanel = (props: {
       }
     }) !== -1;
 
+  useEffect(() => {
+    if (lock.current) return;
+    lock.current = true;
+    if (props.preview.keepLast && props.preview.id in last) {
+      setForm(last[props.preview.id].input);
+    }
+  }, []);
+
   useEffect(() => {
     setWaiting(() => !requestDone);
   }, [asyncWaiting]);
@@ -225,21 +241,35 @@ const InputPanel = (props: {
       socket.addEventListener("close", async function () {
         setWaiting(() => false);
         setRequestDone(() => true);
-        console.log(saveHistory, tempOutputRef.current, isLarge);
-        if (saveHistory && tempOutputRef.current && !isLarge) {
-          try {
-            await setInputOutput(
-              now,
-              props.preview.name,
-              props.preview.path,
-              newForm,
-              tempOutputRef.current
-            );
-          } catch (e) {
-            enqueueSnackbar("Failed to save history, check your console", {
-              variant: "error",
-            });
-            console.error(e);
+        if (tempOutputRef.current !== null) {
+          const currentOutput = tempOutputRef.current;
+          setStore((store) => {
+            const newLast = { ...store.last };
+            newLast[props.preview.id] = {
+              input: newForm,
+              output: JSON.parse(currentOutput),
+            };
+            return {
+              ...store,
+              last: newLast,
+            };
+          });
+
+          if (saveHistory && !isLarge) {
+            try {
+              await setInputOutput(
+                now,
+                props.preview.name,
+                props.preview.path,
+                newForm,
+                currentOutput
+              );
+            } catch (e) {
+              enqueueSnackbar("Failed to save history, check your console", {
+                variant: "error",
+              });
+              console.error(e);
+            }
           }
         }
       });
@@ -253,6 +283,18 @@ const InputPanel = (props: {
       setWaiting(() => false);
       setRequestDone(() => true);
 
+      setStore((store) => {
+        const newLast = { ...store.last };
+        newLast[props.preview.id] = {
+          input: newForm,
+          output: JSON.parse(result),
+        };
+        return {
+          ...store,
+          last: newLast,
+        };
+      });
+
       if (saveHistory && !isLarge) {
         try {
           await setInputOutput(

frontend/src/components/FunixFunction/index.tsx

@@ -22,7 +22,14 @@ const FunixFunction: React.FC<FunctionDetailProps> = ({ preview, backend }) => {
   // );
   const [detail, setDetail] = useState<FunctionDetail | null>(null);
   const [
-    { inputOutputWidth, functionSecret, backHistory, backConsensus, appSecret },
+    {
+      inputOutputWidth,
+      functionSecret,
+      backHistory,
+      backConsensus,
+      appSecret,
+      last,
+    },
     setStore,
   ] = useAtom(storeAtom);
   const [width, setWidth] = useState(inputOutputWidth);
@@ -129,8 +136,13 @@ const FunixFunction: React.FC<FunctionDetailProps> = ({ preview, backend }) => {
       .then((data: FunctionDetail) => {
         setDetail(data);
         setWarning(false);
+      })
+      .then(() => {
+        if (preview.keepLast && preview.id in last) {
+          setResponse(JSON.stringify(last[preview.id].output));
+        }
       });
-  }, [preview, backend]);
+  }, [preview, backend, last]);
 
   const needSecret = preview.secret;
 

frontend/src/components/FunixFunctionList.tsx

@@ -215,7 +215,8 @@ const FunixFunctionList: React.FC<FunctionListProps> = ({ backend }) => {
     return (
       <FunixList functionLength={state.length}>
         {state
-          .sort((a, b) => a.name.localeCompare(b.name))
+          // no sort for no tree
+          // .sort((a, b) => a.name.localeCompare(b.name))
           .map((functionPreview) => (
             <ListItemButton
               onClick={() => {

frontend/src/shared/index.ts

@@ -81,6 +81,10 @@ export type FunctionPreview = {
    * autorun
    */
   autorun: boolean;
+  /**
+   * keep last history
+   */
+  keepLast: boolean;
 };
 
 export type GetListResponse = {

frontend/src/shared/useFunixHistory.ts

@@ -1,4 +1,4 @@
-import { PostCallResponse } from "./index";
+import type { PostCallResponse } from "./index";
 import * as localforage from "localforage";
 import { enqueueSnackbar } from "notistack";
 import { v4 as uuid4 } from "uuid";

frontend/src/store.ts

@@ -1,7 +1,12 @@
 import { atom } from "jotai";
-import { FunctionPreview } from "./shared";
+import { FunctionPreview, PostCallResponse } from "./shared";
 import { History } from "./shared/useFunixHistory";
 
+export type LastStore = {
+  input: Record<any, any>;
+  output: PostCallResponse | string;
+};
+
 export type Store = {
   selectedFunction: null | FunctionPreview;
   functions: null | string[];
@@ -16,6 +21,7 @@ export type Store = {
   saveHistory: boolean;
   appSecret: null | string;
   histories: History[];
+  last: Record<string, LastStore>;
 };
 
 // atomWithStorage("saveHistory", true);
@@ -51,5 +57,6 @@ export const storeAtom = atom<Store>({
   backConsensus: [false, false, false],
   appSecret: null,
   histories: [],
+  last: {},
   ...fromLocalStorage(),
 });