convert from jsonforms to formik (#72)

* convert from jsonforms to formik

Author: jacobfilik

web-conexs-client/package.json

@@ -16,14 +16,12 @@
     "@emotion/react": "^11.14.0",
     "@emotion/styled": "^11.14.0",
     "@h5web/lib": "^13.0.0",
-    "@jsonforms/core": "^3.5.1",
-    "@jsonforms/material-renderers": "^3.5.1",
-    "@jsonforms/react": "^3.5.1",
     "@mui/icons-material": "^6.4.2",
     "@mui/material": "^6.4.2",
     "@react-three/fiber": "8",
     "@tanstack/react-query": "^5.75.1",
     "axios": "^1.7.9",
+    "formik": "^2.4.9",
     "molstar": "^5.0.0",
     "ndarray": "^1.0.19",
     "react": "^18.3.1",

web-conexs-client/pnpm-lock.yaml

@@ -74,8 +74,13 @@ export default function ConvertFromCif(props: {
 
   return (
     <Card>
-      <Stack>
-        <Typography>{title}</Typography>
+      <Stack margin="5px">
+        <Typography variant="subtitle1">{title}</Typography>
+        {!props.isFractional && (
+          <Typography variant="subtitle2" sx={{ fontStyle: "italic" }}>
+            Only suitable for molecular crystals
+          </Typography>
+        )}
         <Stack direction="row" spacing="5px" margin="5px">
           <Button
             variant="contained"

web-conexs-client/src/components/ConvertFromCif.tsx

@@ -11,12 +11,12 @@ export interface StateIconButtonProps extends ButtonProps {
 export default function StateIconButton(props: StateIconButtonProps) {
   const { state, resetState, ...buttonProps } = props;
 
-  if (props.state == "running") {
+  if (state == "running") {
     buttonProps.endIcon = <CircularProgress size="1em" />;
   } else if (props.state == "error") {
     buttonProps.endIcon = <ErrorIcon />;
-    setTimeout(() => props.resetState(), 2000);
-  } else if (props.state == "ok") {
+    setTimeout(() => resetState(), 2000);
+  } else if (state == "ok") {
     buttonProps.endIcon = <CheckCircleIcon />;
     setTimeout(() => props.resetState(), 2000);
   }

web-conexs-client/src/components/StateIconButton.tsx

@@ -45,7 +45,7 @@ export default function WelcomePage() {
             alignItems: "center",
           }}
         >
-          <Typography variant="h6" padding="16px" fontStyle="italic">
+          <Typography variant="h6" padding="16px" fontStyle="">
             A platform for your first steps in theoretical x-ray spectroscopy.
           </Typography>
           <Typography>

web-conexs-client/src/components/WelcomePage.tsx

@@ -82,7 +82,7 @@ export default function CreateCystalPage() {
             endIcon={<PublishIcon />}
             resetState={resetState}
             state={state}
-            disabled={disabled}
+            disabled={crystal == null || disabled}
             variant="contained"
             onClick={() => {
               setDisabled(true);