diff --git a/e2e/components/DataTable.test.ts b/e2e/components/DataTable.test.ts
index 3ef3925d5b2..8ad4cce0b68 100644
--- a/e2e/components/DataTable.test.ts
+++ b/e2e/components/DataTable.test.ts
@@ -8,7 +8,7 @@ test.describe('DataTable', () => {
       test.describe(theme, () => {
         test('axe @aat', async ({page}) => {
           await visit(page, {
-            id: 'components-datatable--default',
+            id: 'drafts-components-datatable--default',
             globals: {
               colorScheme: theme,
             },
@@ -24,7 +24,7 @@ test.describe('DataTable', () => {
       test.describe(theme, () => {
         test('axe @aat', async ({page}) => {
           await visit(page, {
-            id: 'components-datatable-features--with-title',
+            id: 'drafts-components-datatable-features--with-title',
             globals: {
               colorScheme: theme,
             },
@@ -40,7 +40,7 @@ test.describe('DataTable', () => {
       test.describe(theme, () => {
         test('axe @aat', async ({page}) => {
           await visit(page, {
-            id: 'components-datatable-features--with-title-and-subtitle',
+            id: 'drafts-components-datatable-features--with-title-and-subtitle',
             globals: {
               colorScheme: theme,
             },
@@ -56,7 +56,7 @@ test.describe('DataTable', () => {
       test.describe(theme, () => {
         test('axe @aat', async ({page}) => {
           await visit(page, {
-            id: 'components-datatable-features--with-sorting',
+            id: 'drafts-components-datatable-features--with-sorting',
             globals: {
               colorScheme: theme,
             },
@@ -72,7 +72,7 @@ test.describe('DataTable', () => {
       test.describe(theme, () => {
         test('axe @aat', async ({page}) => {
           await visit(page, {
-            id: 'components-datatable-features--with-actions',
+            id: 'drafts-components-datatable-features--with-actions',
             globals: {
               colorScheme: theme,
             },
@@ -88,7 +88,7 @@ test.describe('DataTable', () => {
       test.describe(theme, () => {
         test('axe @aat', async ({page}) => {
           await visit(page, {
-            id: 'components-datatable-features--with-action',
+            id: 'drafts-components-datatable-features--with-action',
             globals: {
               colorScheme: theme,
             },
@@ -104,7 +104,7 @@ test.describe('DataTable', () => {
       test.describe(theme, () => {
         test('axe @aat', async ({page}) => {
           await visit(page, {
-            id: 'components-datatable-features--with-row-action',
+            id: 'drafts-components-datatable-features--with-row-action',
             globals: {
               colorScheme: theme,
             },
@@ -120,7 +120,7 @@ test.describe('DataTable', () => {
       test.describe(theme, () => {
         test('axe @aat', async ({page}) => {
           await visit(page, {
-            id: 'components-datatable-features--with-row-actions',
+            id: 'drafts-components-datatable-features--with-row-actions',
             globals: {
               colorScheme: theme,
             },
@@ -136,7 +136,7 @@ test.describe('DataTable', () => {
       test.describe(theme, () => {
         test('axe @aat', async ({page}) => {
           await visit(page, {
-            id: 'components-datatable-features--with-row-action-menu',
+            id: 'drafts-components-datatable-features--with-row-action-menu',
             globals: {
               colorScheme: theme,
             },
@@ -152,7 +152,7 @@ test.describe('DataTable', () => {
       test.describe(theme, () => {
         test('axe @aat', async ({page}) => {
           await visit(page, {
-            id: 'components-datatable-features--with-custom-heading',
+            id: 'drafts-components-datatable-features--with-custom-heading',
             globals: {
               colorScheme: theme,
             },
@@ -166,7 +166,7 @@ test.describe('DataTable', () => {
   test.describe('With Overflow', () => {
     test('focusable region for overflow', async ({page}) => {
       await visit(page, {
-        id: 'components-datatable-features--with-overflow',
+        id: 'drafts-components-datatable-features--with-overflow',
       })
 
       const heading = page.getByRole('heading', {name: 'Repositories'})
@@ -190,7 +190,7 @@ test.describe('DataTable', () => {
       test.describe(theme, () => {
         test('axe @aat', async ({page}) => {
           await visit(page, {
-            id: 'components-datatable-features--with-overflow',
+            id: 'drafts-components-datatable-features--with-overflow',
             globals: {
               colorScheme: theme,
             },
diff --git a/src/DataTable/DataTable.docs.json b/src/DataTable/DataTable.docs.json
index 6f163ce4381..c53a9680e83 100644
--- a/src/DataTable/DataTable.docs.json
+++ b/src/DataTable/DataTable.docs.json
@@ -5,40 +5,40 @@
   "a11yReviewed": false,
   "stories": [
     {
-      "id": "components-datatable-features--with-title"
+      "id": "drafts-components-datatable-features--with-title"
     },
     {
-      "id": "components-datatable-features--with-title-and-subtitle"
+      "id": "drafts-components-datatable-features--with-title-and-subtitle"
     },
     {
-      "id": "components-datatable-features--with-sorting"
+      "id": "drafts-components-datatable-features--with-sorting"
     },
     {
-      "id": "components-datatable-features--with-actions"
+      "id": "drafts-components-datatable-features--with-actions"
     },
     {
-      "id": "components-datatable-features--with-action"
+      "id": "drafts-components-datatable-features--with-action"
     },
     {
-      "id": "components-datatable-features--with-row-action"
+      "id": "drafts-components-datatable-features--with-row-action"
     },
     {
-      "id": "components-datatable-features--with-row-actions"
+      "id": "drafts-components-datatable-features--with-row-actions"
     },
     {
-      "id": "components-datatable-features--with-row-action-menu"
+      "id": "drafts-components-datatable-features--with-row-action-menu"
     },
     {
-      "id": "components-datatable-features--with-custom-heading"
+      "id": "drafts-components-datatable-features--with-custom-heading"
     },
     {
-      "id": "components-datatable-features--with-no-content"
+      "id": "drafts-components-datatable-features--with-no-content"
     },
     {
-      "id": "components-datatable-features--with-loading"
+      "id": "drafts-components-datatable-features--with-loading"
     },
     {
-      "id": "components-datatable-features--with-pagination"
+      "id": "drafts-components-datatable-features--with-pagination"
     }
   ],
   "props": [
diff --git a/src/DataTable/DataTable.features.stories.tsx b/src/DataTable/DataTable.features.stories.tsx
index b2286a17742..38fde55dc8c 100644
--- a/src/DataTable/DataTable.features.stories.tsx
+++ b/src/DataTable/DataTable.features.stories.tsx
@@ -25,7 +25,7 @@ import {createColumnHelper} from './column'
 import {fetchRepos, repos, useFlakeyQuery} from './storybook/data'
 
 export default {
-  title: 'Components/DataTable/Features',
+  title: 'Drafts/Components/DataTable/Features',
   component: DataTable,
 } as Meta<typeof DataTable>
 
diff --git a/src/DataTable/DataTable.stories.tsx b/src/DataTable/DataTable.stories.tsx
index c6153d8f1fa..6c5d3463391 100644
--- a/src/DataTable/DataTable.stories.tsx
+++ b/src/DataTable/DataTable.stories.tsx
@@ -9,7 +9,7 @@ import {UniqueRow} from './row'
 import {getColumnWidthArgTypes, ColWidthArgTypes} from './storyHelpers'
 
 export default {
-  title: 'Components/DataTable',
+  title: 'Drafts/Components/DataTable',
   component: DataTable,
 } as Meta<typeof DataTable>