diff --git a/app/react/components/form-components/FilePicker/FilePicker.stories.tsx b/app/react/components/form-components/FilePicker/FilePicker.stories.tsx
index 55fa81a46d..b64115e8ad 100644
--- a/app/react/components/form-components/FilePicker/FilePicker.stories.tsx
+++ b/app/react/components/form-components/FilePicker/FilePicker.stories.tsx
@@ -130,6 +130,13 @@ const REPO_NODES: FileNode[] = [
{ name: 'tsconfig.json' },
];
+const HUGE_REPO_NODES: FileNode[] = Array.from({ length: 100 }, (_, dir) => ({
+ name: `service-${dir}`,
+ children: Array.from({ length: 100 }, (_, file) => ({
+ name: `config-${file}.yml`,
+ })),
+}));
+
// ─── Skeleton ─────────────────────────────────────────────────────────────────
export const Skeleton: StoryObj<{ loading: boolean }> = {
@@ -217,3 +224,29 @@ export const Default: Story = {
},
},
};
+
+// ─── Huge repo (BE-13263) ──────────────────────────────────────────────────────
+
+export const HugeRepo: Story = {
+ args: {
+ files: HUGE_REPO_NODES,
+ exampleExpressions: ['*.yml'],
+ },
+ render: (args) => {
+ // eslint-disable-next-line react-hooks/rules-of-hooks
+ const [value, setValue] = useState