Admin panel refactor (#10119)

addressing > 
There are two patterns to avoid:
Creating functions that return JSX like renderThing() -> this was taken
already addressed in https://github.com/twentyhq/twenty/pull/10011
Making a hook that "stores" all the logic of a component - > this PR is
addressing this particular pattern
In essence, handlers should remain in the component and be connected to
their events.
And everything in a handler can be abstracted into its dedicated hook.
For example:
const { myReactiveState } =
useRecoilValue(myReactiveStateComponentState);
const { removeThingFromOtherThing } = useRemoveThingFromOtherThing();

const handleClick = () => {
  if (isDefined(myReactiveState)) {
    removeThingFromOtherThing();
  }
}

Broadly speaking, this is how you can split large components into
several sub-hooks.

---------

Co-authored-by: Lucas Bordeau <bordeau.lucas@gmail.com>

packages/twenty-server/src/engine/core-modules/environment/constants/environment-variables-group-metadata.ts

@@ -19,7 +19,7 @@ export const ENVIRONMENT_VARIABLES_GROUP_METADATA: Record<
     position: 200,
     description:
       'We use this to limit the number of requests to the server. This is useful to prevent abuse.',
-    isHiddenOnLoad: false,
+    isHiddenOnLoad: true,
   },
   [EnvironmentVariablesGroup.StorageConfig]: {
     position: 300,
@@ -46,13 +46,13 @@ export const ENVIRONMENT_VARIABLES_GROUP_METADATA: Record<
   [EnvironmentVariablesGroup.Logging]: {
     position: 700,
     description: '',
-    isHiddenOnLoad: false,
+    isHiddenOnLoad: true,
   },
   [EnvironmentVariablesGroup.ExceptionHandler]: {
     position: 800,
     description:
       'By default, exceptions are sent to the logs. This should be enough for most self-hosting use-cases. For our cloud app we use Sentry.',
-    isHiddenOnLoad: false,
+    isHiddenOnLoad: true,
   },
   [EnvironmentVariablesGroup.Other]: {
     position: 900,