[#118] feat: 빈공간 클릭에 따른 새로운 Block 생성 시 서버 동기화 로직 구현

Author: domino8788

frontend/src/components/pages/PageComponent/PageComponent.tsx

@@ -6,7 +6,6 @@ import { Header, Title, Editor, BlockModal } from '@components/molecules';
 import { HeaderMenu } from '@components/organisms';
 import { useRecoilValue } from 'recoil';
 import { pageState, staticMenuToggleState, modalState } from '@/stores';
-import { createBlock } from '@/utils';
 import { useManager } from '@/hooks';
 import styled from '@emotion/styled';
 import { animated, useSpring } from 'react-spring';
@@ -42,7 +41,7 @@ function PageComponent(): JSX.Element {
   const page = useRecoilValue(pageState);
   const [
     { children },
-    { setBlock, startTransaction, commitTransaction, setFocus },
+    { insertNewChild, startTransaction, commitTransaction, setFocus },
   ] = useManager(page.rootId);
   const staticAreaStyleProps = useSpring({
     left: staticMenuToggle ? 240 : 0,
@@ -54,12 +53,8 @@ function PageComponent(): JSX.Element {
       setFocus(children[children.length - 1]);
       return;
     }
-    const { parent, block } = await createBlock({
-      parentBlockId: page.rootId,
-    });
     startTransaction();
-    setBlock(parent.id, parent);
-    setBlock(block.id, block);
+    const block = await insertNewChild({}, children.length);
     setFocus(block);
     commitTransaction();
   };