diff --git a/frontend/appflowy_web_app/src/components/publish/outline/OutlineItem.tsx b/frontend/appflowy_web_app/src/components/publish/outline/OutlineItem.tsx
index 2f86610d60..ef4a175356 100644
--- a/frontend/appflowy_web_app/src/components/publish/outline/OutlineItem.tsx
+++ b/frontend/appflowy_web_app/src/components/publish/outline/OutlineItem.tsx
@@ -6,7 +6,7 @@ import React, { useCallback, useContext } from 'react';
 import { ReactComponent as ChevronDownIcon } from '@/assets/chevron_down.svg';
 import { useTranslation } from 'react-i18next';
 
-function OutlineItem({ view, level = 0, width }: { view: PublishViewInfo; width: number; level: number }) {
+function OutlineItem({ view, level = 0, width }: { view: PublishViewInfo; width: number; level?: number }) {
   const [isExpanded, setIsExpanded] = React.useState(false);
   const getIcon = useCallback(() => {
     if (isExpanded) {