Add twenty/folder-structure custom oxlint rule (#18467)

## Summary

- Re-implements `eslint-plugin-project-structure`'s folder structure
enforcement as a custom oxlint rule (`twenty/folder-structure`),
recovering functionality lost during the ESLint → Oxlint migration
- Validates `src/modules/` structure: kebab-case module folder names,
allowed subdirectories (hooks, utils, components, states, types,
graphql, etc.), hook file naming (`use{PascalCase}.(ts|tsx)`), util file
naming (`{camelCase}.(ts|tsx)`), and module nesting depth (max 4 levels)
- Enabled as `"warn"` in twenty-front with 403 pre-existing violations
to address incrementally

## What the rule checks

| Check | Example valid | Example invalid |
|-------|-------------|-----------------|
| Module names kebab-case | `object-record/` | `graphWidgetBarChart/` |
| Allowed subdirs only | `hooks/`, `components/`, `utils/` |
`random-stuff/` |
| Hook file naming | `useMyHook.ts` | `badName.ts` |
| Util file naming | `buildQuery.ts` | `build-query.ts` |
| Max nesting depth 4 | `a/b/c/d/hooks/` | `a/b/c/d/e/hooks/` |
| Utils kebab-case subfolders | `utils/cron-to-human/` |
`utils/camelCase/` |

## Pre-existing violations (403 total)

| Category | Count | Examples |
|----------|-------|---------|
| Non-kebab-case module names | 160 | `graphWidgetBarChart`,
`AIChatThreads` |
| Module depth > 4 | 215 |
`settings/roles/role-permissions/object-level-permissions/field-permissions`
|
| Util file naming | 22 | `.util.ts` suffix, kebab-case, PascalCase
filenames |
| Misc (hooks, tests) | 6 | Non-hook files in hooks/, folders in test
dirs |

packages/twenty-front/src/modules/ui/input/effect-components/IconPickerScrollEffect.tsx

@@ -0,0 +1,52 @@
+import { iconPickerVisibleCountState } from '@/ui/input/states/iconPickerVisibleCountState';
+import { useSetAtomFamilyState } from '@/ui/utilities/state/jotai/hooks/useSetAtomFamilyState';
+import { useScrollWrapperHTMLElement } from '@/ui/utilities/scroll/hooks/useScrollWrapperHTMLElement';
+import { useEffect } from 'react';
+
+type IconPickerScrollEffectProps = {
+  sentinelId: string;
+  dropdownId: string;
+};
+
+export const IconPickerScrollEffect = ({
+  sentinelId,
+  dropdownId,
+}: IconPickerScrollEffectProps) => {
+  const { scrollWrapperHTMLElement } = useScrollWrapperHTMLElement();
+
+  const setIconPickerVisibleCount = useSetAtomFamilyState(
+    iconPickerVisibleCountState,
+    dropdownId,
+  );
+
+  useEffect(() => {
+    const element = document.querySelector(
+      `#${sentinelId}`,
+    ) as HTMLElement | null;
+
+    if (!element) return;
+
+    const observer = new IntersectionObserver(
+      (entries) => {
+        entries.forEach((entry) => {
+          if (entry.isIntersecting) {
+            setIconPickerVisibleCount((previousCount) => previousCount + 25);
+          }
+        });
+      },
+      {
+        root: scrollWrapperHTMLElement,
+        rootMargin: '10px',
+        threshold: 1.0,
+      },
+    );
+
+    observer.observe(element);
+
+    return () => {
+      observer.disconnect();
+    };
+  }, [sentinelId, scrollWrapperHTMLElement, setIconPickerVisibleCount]);
+
+  return null;
+};