Hide toolbar divider when no extensions are there

theatre/studio/src/toolbars/ExtensionToolbar/ExtensionToolbar.tsx

@@ -62,9 +62,10 @@ const ExtensionToolsetRender: React.FC<{
   return <Toolset config={config} />
 }
 
-export const ExtensionToolbar: React.FC<{toolbarId: string}> = ({
+export const ExtensionToolbar: React.FC<{
-  toolbarId,
+  toolbarId: string
-}) => {
+  showLeftDivider?: boolean
+}> = ({toolbarId, showLeftDivider}) => {
   const groups: Array<React.ReactNode> = []
   const extensionsById = useVal(getStudio().atomP.ephemeral.extensions.byId)
 
@@ -84,7 +85,12 @@ export const ExtensionToolbar: React.FC<{toolbarId: string}> = ({
 
   if (groups.length === 0) return null
 
-  return <Container>{groups}</Container>
+  return (
+    <Container>
+      {showLeftDivider ? <GroupDivider></GroupDivider> : undefined}
+      {groups}
+    </Container>
+  )
 }
 
 export default ExtensionToolbar

theatre/studio/src/toolbars/GlobalToolbar.tsx

@@ -142,13 +142,12 @@ const GlobalToolbar: React.FC = () => {
           unpinHintIcon={<DoubleChevronLeft />}
           pinned={outlinePinned}
         />
-        <GroupDivider />
         {conflicts.length > 0 ? (
           <NumberOfConflictsIndicator>
             {conflicts.length}
           </NumberOfConflictsIndicator>
         ) : null}
-        <ExtensionToolbar toolbarId="global" />
+        <ExtensionToolbar showLeftDivider toolbarId="global" />
       </SubContainer>
       <SubContainer>
         {moreMenu}