diff --git a/frontend/src/components/Form.tsx b/frontend/src/components/Form.tsx
index 90350d9a..57dbb362 100644
--- a/frontend/src/components/Form.tsx
+++ b/frontend/src/components/Form.tsx
@@ -1,6 +1,6 @@
 import React, { useEffect } from "react";
 import Grid from "@mui/joy/Grid";
-import { useForm } from "react-hook-form";
+import { useForm, FormProvider } from "react-hook-form";
 import axios from "axios";
 import { yupResolver } from "@hookform/resolvers/yup";
 import Button from "@mui/joy/Button";
@@ -65,17 +65,20 @@ export const Form: React.FunctionComponent<FormProps> = ({
     setDisableDownloadButton,
   } = useFromStore();
 
-  //TODO - we need to make it global (zuatand)
+  //TODO - we need to make it global
+
+  const methods = useForm<FormValues>({
+    defaultValues: { species: [{ molecule: "CO", mole_fraction: 0.1 }] },
+    resolver: yupResolver(formSchema),
+  });
+
   const {
     control,
     handleSubmit,
     setValue,
     watch,
     formState: { dirtyFields },
-  } = useForm<FormValues>({
-    defaultValues: { species: [{ molecule: "CO", mole_fraction: 0.1 }] },
-    resolver: yupResolver(formSchema),
-  });
+  } = methods;
 
   const databaseWatch = watch("database");
   React.useEffect(() => {
@@ -283,131 +286,133 @@ export const Form: React.FunctionComponent<FormProps> = ({
   }, [setValue, isNonEquilibrium]);
 
   return (
-    <form
-      onSubmit={handleSubmit((data) => onSubmit(data, `calculate-spectrum`))}
-    >
-      <Grid container spacing={3}>
-        <Grid xs={12} sm={8} md={5} lg={6}>
-          <DatabaseField control={control}></DatabaseField>
-        </Grid>
-        <Grid xs={12} sm={8} md={5} lg={6}>
-          <Mode control={control} />
-        </Grid>
-        <Grid xs={12}>
-          <WavenumberRangeSlider
-            isUnitChanged={simulateSlitUnit}
-            minRange={simulateSlitUnit ? 1000 : 500}
-            maxRange={simulateSlitUnit ? 20000 : 10000}
-            control={control}
-            setValue={setValue}
-          />
-        </Grid>
-
-        {isNonEquilibrium ? (
-          <Grid sm={8} lg={4}>
-            <TGas control={control} />
+    <FormProvider {...methods}>
+      <form
+        onSubmit={handleSubmit((data) => onSubmit(data, `calculate-spectrum`))}
+      >
+        <Grid container spacing={3}>
+          <Grid xs={12} sm={8} md={5} lg={6}>
+            <DatabaseField control={control}></DatabaseField>
           </Grid>
-        ) : (
-          <Grid sm={8} lg={12}>
-            <TGas control={control} />
+          <Grid xs={12} sm={8} md={5} lg={6}>
+            <Mode control={control} />
+          </Grid>
+          <Grid xs={12}>
+            <WavenumberRangeSlider
+              isUnitChanged={simulateSlitUnit}
+              minRange={simulateSlitUnit ? 1000 : 500}
+              maxRange={simulateSlitUnit ? 20000 : 10000}
+              control={control}
+              setValue={setValue}
+            />
           </Grid>
-        )}
 
-        {isNonEquilibrium ? (
-          <>
+          {isNonEquilibrium ? (
             <Grid sm={8} lg={4}>
-              <TRot control={control} />
+              <TGas control={control} />
             </Grid>
-            <Grid sm={8} lg={4}>
-              <TVib control={control} />
+          ) : (
+            <Grid sm={8} lg={12}>
+              <TGas />
             </Grid>
-          </>
-        ) : null}
+          )}
 
-        {isNonEquilibrium ? (
-          <Grid sm={8} lg={12}>
-            <Pressure control={control} />
-          </Grid>
-        ) : (
-          <Grid sm={8} lg={12}>
-            <Pressure control={control} />
-          </Grid>
-        )}
+          {isNonEquilibrium ? (
+            <>
+              <Grid sm={8} lg={4}>
+                <TRot control={control} />
+              </Grid>
+              <Grid sm={8} lg={4}>
+                <TVib control={control} />
+              </Grid>
+            </>
+          ) : null}
 
-        {isNonEquilibrium ? (
-          <>
+          {isNonEquilibrium ? (
             <Grid sm={8} lg={12}>
-              <PathLength control={control} />
+              <Pressure control={control} />
             </Grid>
-          </>
-        ) : (
-          <>
+          ) : (
             <Grid sm={8} lg={12}>
-              <PathLength control={control} />
+              <Pressure control={control} />
             </Grid>
-          </>
-        )}
+          )}
 
-        <Grid xs={12}>
-          <Species
-            isNonEquilibrium={isNonEquilibrium}
-            control={control}
-            databaseWatch={databaseWatch}
-          />
-        </Grid>
+          {isNonEquilibrium ? (
+            <>
+              <Grid sm={8} lg={12}>
+                <PathLength control={control} />
+              </Grid>
+            </>
+          ) : (
+            <>
+              <Grid sm={8} lg={12}>
+                <PathLength control={control} />
+              </Grid>
+            </>
+          )}
 
-        {useSimulateSlitFunction ? (
           <Grid xs={12}>
-            <UseSimulateSlitSwitch control={control} setValue={setValue} />
+            <Species
+              isNonEquilibrium={isNonEquilibrium}
+              control={control}
+              databaseWatch={databaseWatch}
+            />
           </Grid>
-        ) : null}
 
-        {useSimulateSlitFunction ? (
-          useSlit ? (
+          {useSimulateSlitFunction ? (
+            <Grid xs={12}>
+              <UseSimulateSlitSwitch control={control} setValue={setValue} />
+            </Grid>
+          ) : null}
+
+          {useSimulateSlitFunction ? (
+            useSlit ? (
+              <Grid xs={12}>
+                <SimulateSlit
+                  isUnitChangeable={simulateSlitUnit}
+                  control={control}
+                />
+              </Grid>
+            ) : null
+          ) : null}
+          {showNonEquilibriumSwitch && (
             <Grid xs={12}>
-              <SimulateSlit
-                isUnitChangeable={simulateSlitUnit}
-                control={control}
-              />
+              <UseNonEquilibriumCalculationsSwitch />
             </Grid>
-          ) : null
-        ) : null}
-        {showNonEquilibriumSwitch && (
+          )}
+          <Grid xs={6}>
+            <CalcSpectrumButton />
+          </Grid>
+          <Grid xs={6}>
+            <Button
+              fullWidth
+              disabled={disableAddToPlotButton}
+              onClick={handleSubmit((data) =>
+                onSubmit(data, `calculate-spectrum`, true)
+              )}
+            >
+              Add to plot
+            </Button>
+          </Grid>
           <Grid xs={12}>
-            <UseNonEquilibriumCalculationsSwitch />
+            <DownloadSpecButton
+              disabled={disableDownloadButton}
+              onClick={handleSubmit((data) => {
+                onSubmit(data, `download-spectrum`);
+              })}
+            />
+          </Grid>
+          <Grid xs={12}>
+            <DownloadTxtButton
+              disabled={disableDownloadButton}
+              onClick={handleSubmit((data) => {
+                onSubmit(data, `download-txt`);
+              })}
+            />
           </Grid>
-        )}
-        <Grid xs={6}>
-          <CalcSpectrumButton />
-        </Grid>
-        <Grid xs={6}>
-          <Button
-            fullWidth
-            disabled={disableAddToPlotButton}
-            onClick={handleSubmit((data) =>
-              onSubmit(data, `calculate-spectrum`, true)
-            )}
-          >
-            Add to plot
-          </Button>
-        </Grid>
-        <Grid xs={12}>
-          <DownloadSpecButton
-            disabled={disableDownloadButton}
-            onClick={handleSubmit((data) => {
-              onSubmit(data, `download-spectrum`);
-            })}
-          />
-        </Grid>
-        <Grid xs={12}>
-          <DownloadTxtButton
-            disabled={disableDownloadButton}
-            onClick={handleSubmit((data) => {
-              onSubmit(data, `download-txt`);
-            })}
-          />
         </Grid>
-      </Grid>
-    </form>
+      </form>
+    </FormProvider>
   );
 };
diff --git a/frontend/src/components/fields/TGas.tsx b/frontend/src/components/fields/TGas.tsx
index f2c1ee7d..6e992d13 100644
--- a/frontend/src/components/fields/TGas.tsx
+++ b/frontend/src/components/fields/TGas.tsx
@@ -2,47 +2,46 @@ import Input from "@mui/joy/Input";
 import FormControl from "@mui/joy/FormControl";
 import FormLabel from "@mui/joy/FormLabel";
 import FormHelperText from "@mui/joy/FormHelperText";
-import React, { ReactNode } from "react";
 import InputAdornment from "@mui/material/InputAdornment";
-import { Control, Controller } from "react-hook-form";
-import { FormValues } from "../types";
+import {  Controller, useFormContext } from "react-hook-form";
 
-interface TGasProps {
-  control: Control<FormValues>;
-}
-export const TGas: React.FC<TGasProps> = ({ control }) => (
-  <Controller
-    render={({ field, formState }) => (
-      <FormControl>
-        <FormLabel>TGas</FormLabel>
-        <Input
-          {...field}
-          {...formState}
-          id="tgas-input"
-          type="number"
-          onChange={field.onChange}
-          value={field.value}
-          error={!!formState.errors?.tgas}
-          endDecorator={<InputAdornment position="end">K</InputAdornment>}
-          onKeyPress={(event: any) => {
-            if (event?.key === "-" || event?.key === "+") {
-              event.preventDefault();
-            }
-          }}
-        />
-        {formState.errors?.tgas ? (
-          <FormHelperText
-            sx={{
-              color: "red",
+
+
+export const TGas: React.FC = () => {
+  const { control } = useFormContext();
+  return (
+    <Controller
+      render={({ field, fieldState }) => (
+        <FormControl>
+          <FormLabel>TGas</FormLabel>
+          <Input
+            {...field}
+            id="tgas-input"
+            type="number"
+            onChange={field.onChange}
+            value={field.value}
+            error={!!fieldState.error}
+            endDecorator={<InputAdornment position="end">K</InputAdornment>}
+            onKeyPress={(event: any) => {
+              if (event?.key === "-" || event?.key === "+") {
+                event.preventDefault();
+              }
             }}
-          >
-            {formState.errors?.tgas?.message}
-          </FormHelperText>
-        ) : null}
-      </FormControl>
-    )}
-    name="tgas"
-    control={control}
-    defaultValue={300}
-  />
-);
+          />
+          {fieldState.error ? (
+            <FormHelperText
+              sx={{
+                color: "red",
+              }}
+            >
+              {fieldState.error.message}
+            </FormHelperText>
+          ) : null}
+        </FormControl>
+      )}
+      name="tgas"
+      control={control}
+      defaultValue={300}
+    />
+  );
+};