Review fixes

frontend/src/layouts/OrganizationLayout/components/MinimizedOrgSidebar/MinimizedOrgSidebar.tsx

@@ -164,7 +164,10 @@ export const MinimizedOrgSidebar = () => {
   const handleCopyToken = async () => {
     try {
       await window.navigator.clipboard.writeText(getAuthToken());
-      createNotification({ type: "success", text: "Copied current login session token to clipboard" });
+      createNotification({
+        type: "success",
+        text: "Copied current login session token to clipboard"
+      });
     } catch (error) {
       console.log(error);
       createNotification({ type: "error", text: "Failed to copy user token to clipboard" });

frontend/src/pages/admin/EnvironmentPage/EnvironmentPage.tsx

@@ -2,6 +2,7 @@ import { Helmet } from "react-helmet";
 import { useTranslation } from "react-i18next";
 
 import { PageHeader } from "@app/components/v2";
+
 import { EnvironmentPageForm } from "./components";
 
 export const EnvironmentPage = () => {

frontend/src/pages/admin/EnvironmentPage/components/EnvironmentPageForm.tsx

@@ -1,12 +1,12 @@
 import { useCallback, useEffect, useMemo, useState } from "react";
 import { Controller, useForm, useWatch } from "react-hook-form";
+import { faExclamationTriangle, faMagnifyingGlass } from "@fortawesome/free-solid-svg-icons";
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
 import { zodResolver } from "@hookform/resolvers/zod";
 import { z } from "zod";
 
 import { createNotification } from "@app/components/notifications";
 import { Button, FormControl, Input, SecretInput, Tooltip } from "@app/components/v2";
-import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
-import { faExclamationTriangle, faMagnifyingGlass } from "@fortawesome/free-solid-svg-icons";
 import { useGetEnvOverrides, useUpdateServerConfig } from "@app/hooks/api";
 
 type TForm = Record<string, string>;
@@ -55,14 +55,11 @@ export const EnvironmentPageForm = () => {
 
     return Object.values(envOverrides)
       .map((group) => {
-        const filteredFields = group.fields.filter((field) => {
-          const value = formValues?.[field.key] ?? "";
-          return (
+        const filteredFields = group.fields.filter(
+          (field) =>
             field.key.toLowerCase().includes(searchTerm) ||
-            (field.description ?? "").toLowerCase().includes(searchTerm) ||
-            value.toLowerCase().includes(searchTerm)
-          );
-        });
+            (field.description ?? "").toLowerCase().includes(searchTerm)
+        );
 
         if (filteredFields.length > 0) {
           return { ...group, fields: filteredFields };
@@ -103,91 +100,89 @@ export const EnvironmentPageForm = () => {
   );
 
   return (
-    <>
-      <form
-        className="flex flex-col gap-4 rounded-lg border border-mineshaft-600 bg-mineshaft-900 p-4"
-        onSubmit={handleSubmit(onSubmit)}
-      >
-        <div className="flex w-full flex-row items-center justify-between">
-          <div>
-            <div className="flex items-start gap-1">
-              <p className="text-xl font-semibold text-mineshaft-100">Overrides</p>
-            </div>
-            <p className="text-sm text-bunker-300">Override specific environment variables.</p>
-          </div>
-
-          <div className="flex flex-row gap-2">
-            <Button
-              type="submit"
-              variant="outline_bg"
-              isLoading={isSubmitting}
-              isDisabled={isSubmitting || !isDirty}
-            >
-              Save Overrides
-            </Button>
+    <form
+      className="flex flex-col gap-4 rounded-lg border border-mineshaft-600 bg-mineshaft-900 p-4"
+      onSubmit={handleSubmit(onSubmit)}
+    >
+      <div className="flex w-full flex-row items-center justify-between">
+        <div>
+          <div className="flex items-start gap-1">
+            <p className="text-xl font-semibold text-mineshaft-100">Overrides</p>
           </div>
+          <p className="text-sm text-bunker-300">Override specific environment variables.</p>
         </div>
-        <Input
-          value={search}
-          onChange={(e) => setSearch(e.target.value)}
-          leftIcon={<FontAwesomeIcon icon={faMagnifyingGlass} />}
-          placeholder="Search for keys, descriptions, and values..."
-          className="flex-1"
-        />
-        <div className="flex flex-col gap-4">
-          {filteredData.map((group) => (
-            <div key={group!.name}>
-              <span className="mb-2 text-sm text-mineshaft-300">{group!.name}</span>
-              <div className="rounded-lg border border-mineshaft-700 bg-mineshaft-800">
-                <div className="flex flex-col">
-                  {group!.fields.map((field, i) => (
-                    <div
-                      key={field.key}
-                      className={`flex items-center justify-between gap-4 border-mineshaft-500 p-4 ${
-                        i === 0 ? "" : "border-t"
-                      }`}
-                    >
-                      <div className="flex max-w-lg flex-col">
-                        <span className="text-sm">{field.key}</span>
-                        <span className="text-sm text-mineshaft-400">{field.description}</span>
-                      </div>
 
-                      <div className="flex grow items-center justify-end gap-2">
-                        {field.hasEnvEntry && (
-                          <Tooltip
-                            content="Setting this value will override an existing environment variable"
-                            className="text-center"
-                          >
-                            <FontAwesomeIcon icon={faExclamationTriangle} className="text-red" />
-                          </Tooltip>
-                        )}
-
-                        <Controller
-                          control={control}
-                          name={field.key}
-                          render={({ field: formGenField, fieldState: { error } }) => (
-                            <FormControl
-                              isError={Boolean(error)}
-                              errorText={error?.message}
-                              className="mb-0 w-full max-w-sm"
-                            >
-                              <SecretInput
-                                {...formGenField}
-                                autoComplete="off"
-                                containerClassName="text-bunker-300 hover:border-mineshaft-400 border border-mineshaft-600 bg-bunker-600 px-2 py-1.5"
-                              />
-                            </FormControl>
-                          )}
-                        />
-                      </div>
+        <div className="flex flex-row gap-2">
+          <Button
+            type="submit"
+            variant="outline_bg"
+            isLoading={isSubmitting}
+            isDisabled={isSubmitting || !isDirty}
+          >
+            Save Overrides
+          </Button>
+        </div>
+      </div>
+      <Input
+        value={search}
+        onChange={(e) => setSearch(e.target.value)}
+        leftIcon={<FontAwesomeIcon icon={faMagnifyingGlass} />}
+        placeholder="Search for keys, descriptions, and values..."
+        className="flex-1"
+      />
+      <div className="flex flex-col gap-4">
+        {filteredData.map((group) => (
+          <div key={group!.name}>
+            <span className="mb-2 text-sm text-mineshaft-300">{group!.name}</span>
+            <div className="rounded-lg border border-mineshaft-700 bg-mineshaft-800">
+              <div className="flex flex-col">
+                {group!.fields.map((field, i) => (
+                  <div
+                    key={field.key}
+                    className={`flex items-center justify-between gap-4 border-mineshaft-500 p-4 ${
+                      i === 0 ? "" : "border-t"
+                    }`}
+                  >
+                    <div className="flex max-w-lg flex-col">
+                      <span className="text-sm">{field.key}</span>
+                      <span className="text-sm text-mineshaft-400">{field.description}</span>
                     </div>
-                  ))}
-                </div>
+
+                    <div className="flex grow items-center justify-end gap-2">
+                      {field.hasEnvEntry && (
+                        <Tooltip
+                          content="Setting this value will override an existing environment variable"
+                          className="text-center"
+                        >
+                          <FontAwesomeIcon icon={faExclamationTriangle} className="text-red" />
+                        </Tooltip>
+                      )}
+
+                      <Controller
+                        control={control}
+                        name={field.key}
+                        render={({ field: formGenField, fieldState: { error } }) => (
+                          <FormControl
+                            isError={Boolean(error)}
+                            errorText={error?.message}
+                            className="mb-0 w-full max-w-sm"
+                          >
+                            <SecretInput
+                              {...formGenField}
+                              autoComplete="off"
+                              containerClassName="text-bunker-300 hover:border-mineshaft-400 border border-mineshaft-600 bg-bunker-600 px-2 py-1.5"
+                            />
+                          </FormControl>
+                        )}
+                      />
+                    </div>
+                  </div>
+                ))}
               </div>
             </div>
-          ))}
-        </div>
-      </form>
-    </>
+          </div>
+        ))}
+      </div>
+    </form>
   );
 };