Fix block adding (esp w index)

reearth · Aug 9, 2023 · ca63014 · ca63014
1 parent 1533c67
commit ca63014
Show file tree

Hide file tree

Showing 3 changed files with 13 additions and 12 deletions.
diff --git a/web/src/beta/features/Editor/StoryPanel/Page/BlockAddBar.tsx b/web/src/beta/features/Editor/StoryPanel/Page/BlockAddBar.tsx
@@ -90,6 +90,7 @@ const StyledIcon = styled(Icon)`
   padding: 2px;
   cursor: pointer;
   transition: opacity 0.4s;
+  z-index: 100;
 `;
 
 const Line = styled.div`

diff --git a/web/src/beta/features/Editor/StoryPanel/Page/hooks.ts b/web/src/beta/features/Editor/StoryPanel/Page/hooks.ts
@@ -22,13 +22,14 @@ export default ({
   });
 
   const handleStoryBlockCreate = useCallback(
-    async (extensionId?: string, pluginId?: string) => {
+    (index?: number) => async (extensionId?: string, pluginId?: string) => {
       if (!extensionId || !pluginId || !storyId || !pageId) return;
       await useCreateStoryBlock({
         pluginId,
         extensionId,
         storyId,
         pageId,
+        index,
       });
     },
     [storyId, pageId, useCreateStoryBlock],

diff --git a/web/src/beta/features/Editor/StoryPanel/Page/index.tsx b/web/src/beta/features/Editor/StoryPanel/Page/index.tsx
@@ -52,7 +52,14 @@ const StoryPage: React.FC<Props> = ({
       <Text size="h2" customColor>
         {pageTitle ?? "No Title"}
       </Text>
-      {installedStoryBlocks && installedStoryBlocks.length > 0 ? (
+      <BlockAddBar
+        openBlocks={openBlocksIndex === -1}
+        installableStoryBlocks={installableStoryBlocks}
+        onBlockOpen={() => handleBlockOpen(-1)}
+        onBlockAdd={handleStoryBlockCreate(0)}
+      />
+      {installedStoryBlocks &&
+        installedStoryBlocks.length > 0 &&
         installedStoryBlocks?.map((b, idx) => (
           <Fragment key={idx}>
             <StoryBlock
@@ -65,18 +72,10 @@ const StoryPage: React.FC<Props> = ({
               openBlocks={openBlocksIndex === idx}
               installableStoryBlocks={installableStoryBlocks}
               onBlockOpen={() => handleBlockOpen(idx)}
-              onBlockAdd={handleStoryBlockCreate}
+              onBlockAdd={handleStoryBlockCreate(idx + 1)}
             />
           </Fragment>
-        ))
-      ) : (
-        <BlockAddBar
-          openBlocks={openBlocksIndex === -1}
-          installableStoryBlocks={installableStoryBlocks}
-          onBlockOpen={() => handleBlockOpen(-1)}
-          onBlockAdd={handleStoryBlockCreate}
-        />
-      )}
+        ))}
     </Wrapper>
   );
 };