From fcee13b017772ceb8d78335da336b6547a7fd642 Mon Sep 17 00:00:00 2001
From: Jessica Chowdhury <67977755+JessChowdhury@users.noreply.github.com>
Date: Tue, 14 May 2024 14:46:16 +0100
Subject: [PATCH] fix: depth field in api view throws error when no value
 present (#6106)

---
 packages/next/src/views/API/index.client.tsx | 2 +-
 test/admin/e2e.spec.ts                       | 9 +++++++++
 2 files changed, 10 insertions(+), 1 deletion(-)

diff --git a/packages/next/src/views/API/index.client.tsx b/packages/next/src/views/API/index.client.tsx
index 6cb7fdcb89..909db51a2e 100644
--- a/packages/next/src/views/API/index.client.tsx
+++ b/packages/next/src/views/API/index.client.tsx
@@ -187,7 +187,7 @@ export const APIViewClient: React.FC = () => {
               max={10}
               min={0}
               name="depth"
-              onChange={(value) => setDepth(value.toString())}
+              onChange={(value) => setDepth(value?.toString())}
               path="depth"
               step={1}
             />
diff --git a/test/admin/e2e.spec.ts b/test/admin/e2e.spec.ts
index 9e53df24bc..4411bcc383 100644
--- a/test/admin/e2e.spec.ts
+++ b/test/admin/e2e.spec.ts
@@ -312,6 +312,15 @@ describe('admin', () => {
       await expect(page.locator('#field-sidebarField')).toBeDisabled()
     })
 
+    test('collection — depth field should have value 0 when empty', async () => {
+      const { id } = await createPost()
+      await page.goto(`${postsUrl.edit(id)}/api`)
+
+      const depthField = page.locator('#field-depth')
+      await depthField.fill('')
+      await expect(depthField).toHaveValue('0')
+    })
+
     test('global — should not show API tab when disabled in config', async () => {
       await page.goto(postsUrl.global(noApiViewGlobalSlug))
       await expect(page.locator('.doc-tabs__tabs-container')).not.toContainText('API')