diff --git a/src/stories/components/SortableList.stories.tsx b/src/stories/components/SortableList.stories.tsx
index ec1fad0c..31c378df 100644
--- a/src/stories/components/SortableList.stories.tsx
+++ b/src/stories/components/SortableList.stories.tsx
@@ -4,7 +4,7 @@ import Instructor from '@shared/types/Instructor';
 import { tailwindColorways } from '@shared/util/storybook';
 import type { Meta, StoryObj } from '@storybook/react';
 import PopupCourseBlock from '@views/components/common/PopupCourseBlock';
-import type { BaseItem } from '@views/components/common/SortableList';
+import type { BaseItem, SortableListProps } from '@views/components/common/SortableList';
 import { SortableList } from '@views/components/common/SortableList';
 import React from 'react';
 
@@ -94,11 +94,13 @@ export const Default: Story = {
             course,
         })),
         onChange: () => {},
-        renderItem: ({ id, course }) => <PopupCourseBlock key={id} course={course} colors={course.colors} />,
+        renderItem: (item: CourseWithId) => (
+            <PopupCourseBlock key={item.id} course={item.course} colors={item.course.colors} />
+        ),
     },
     render: args => (
         <div className='h-3xl w-3xl transform-none'>
-            <SortableList {...args} />
+            <SortableList {...(args as SortableListProps<CourseWithId>)} />
         </div>
     ),
 };