refactor: use tabs instead of spaces

inertia/components/common/tabs/tabs.tsx

@@ -6,37 +6,37 @@ import TabPanel from '~/components/common/tabs/tab_panel';
 import TransitionLayout from '~/components/layouts/_transition_layout';
 
 export interface Tab {
-  title: string;
-  content: ReactNode;
-  icon?: IconType;
-  danger?: boolean;
+	title: string;
+	content: ReactNode;
+	icon?: IconType;
+	danger?: boolean;
 }
 
 export default function Tabs({ tabs }: { tabs: Tab[] }) {
-  const [activeTabIndex, setActiveTabIndex] = useState<number>(0);
+	const [activeTabIndex, setActiveTabIndex] = useState<number>(0);
 
-  const handleTabClick = (index: number) => {
-    setActiveTabIndex(index);
-  };
+	const handleTabClick = (index: number) => {
+		setActiveTabIndex(index);
+	};
 
-  return (
-    <div css={{ width: '100%' }}>
-      <TabList>
-        {tabs.map(({ title, icon: Icon, danger }, index) => (
-          <TabItem
-            key={index}
-            active={index === activeTabIndex}
-            onClick={() => handleTabClick(index)}
-            danger={danger ?? false}
-          >
-            {!!Icon && <Icon size={20} />}
-            {title}
-          </TabItem>
-        ))}
-      </TabList>
-      <TabPanel key={tabs[activeTabIndex].title}>
-        <TransitionLayout>{tabs[activeTabIndex].content}</TransitionLayout>
-      </TabPanel>
-    </div>
-  );
+	return (
+		<div css={{ width: '100%' }}>
+			<TabList>
+				{tabs.map(({ title, icon: Icon, danger }, index) => (
+					<TabItem
+						key={index}
+						active={index === activeTabIndex}
+						onClick={() => handleTabClick(index)}
+						danger={danger ?? false}
+					>
+						{!!Icon && <Icon size={20} />}
+						{title}
+					</TabItem>
+				))}
+			</TabList>
+			<TabPanel key={tabs[activeTabIndex].title}>
+				<TransitionLayout>{tabs[activeTabIndex].content}</TransitionLayout>
+			</TabPanel>
+		</div>
+	);
 }