Sort blocks

Significant-Gravitas · Oct 11, 2024 · 5750743 · 5750743
1 parent 32bbc13
commit 5750743
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 6 deletions.
diff --git a/autogpt_platform/frontend/src/components/edit/control/BlocksControl.tsx b/autogpt_platform/frontend/src/components/edit/control/BlocksControl.tsx
@@ -40,15 +40,16 @@ export const BlocksControl: React.FC<BlocksControlProps> = ({
   addBlock,
   pinBlocksPopover,
 }) => {
+  const blockList = blocks.sort((a, b) => a.name.localeCompare(b.name));
   const [searchQuery, setSearchQuery] = useState("");
   const [selectedCategory, setSelectedCategory] = useState<string | null>(null);
-  const [filteredBlocks, setFilteredBlocks] = useState<Block[]>(blocks);
+  const [filteredBlocks, setFilteredBlocks] = useState<Block[]>(blockList);
 
   const resetFilters = React.useCallback(() => {
     setSearchQuery("");
     setSelectedCategory(null);
-    setFilteredBlocks(blocks);
-  }, [blocks]);
+    setFilteredBlocks(blockList);
+  }, [blockList]);
 
   // Extract unique categories from blocks
   const categories = Array.from(
@@ -60,7 +61,7 @@ export const BlocksControl: React.FC<BlocksControlProps> = ({
 
   React.useEffect(() => {
     setFilteredBlocks(
-      blocks.filter(
+      blockList.filter(
         (block: Block) =>
           (block.name.toLowerCase().includes(searchQuery.toLowerCase()) ||
             beautifyString(block.name)
@@ -70,7 +71,7 @@ export const BlocksControl: React.FC<BlocksControlProps> = ({
             block.categories.some((cat) => cat.category === selectedCategory)),
       ),
     );
-  }, [blocks, searchQuery, selectedCategory]);
+  }, [blockList, searchQuery, selectedCategory]);
 
   return (
     <Popover

diff --git a/autogpt_platform/frontend/src/components/tutorial.ts b/autogpt_platform/frontend/src/components/tutorial.ts
@@ -431,7 +431,7 @@ export const startTutorial = (
     },
     buttons: [],
     beforeShowPromise: () =>
-      waitForElement('[data-id^="badge-"][data-id$="-QUEUED"]'),
+      waitForElement('[data-id^="badge-"][data-id$="-QUEUED"]').then(fitViewToScreen),
     when: {
       show: () => {
         waitForElement('[data-id^="badge-"][data-id$="-COMPLETED"]').then(