@teambit/workspace 1.0.983 → 1.0.985

package/dist/ui/workspace/workspace-overview/workspace-overview.js

@@ -4,7 +4,6 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.WorkspaceOverview = WorkspaceOverview;
-exports.useCardPlugins = useCardPlugins;
 function _react() {
   const data = _interopRequireWildcard(require("react"));
   _react = function () {
@@ -26,27 +25,6 @@ function _workspaceUi() {
   };
   return data;
 }
-function _previewUi() {
-  const data = require("@teambit/preview.ui.preview-placeholder");
-  _previewUi = function () {
-    return data;
-  };
-  return data;
-}
-function _designUi() {
-  const data = require("@teambit/design.ui.tooltip");
-  _designUi = function () {
-    return data;
-  };
-  return data;
-}
-function _componentId() {
-  const data = require("@teambit/component-id");
-  _componentId = function () {
-    return data;
-  };
-  return data;
-}
 function _lodash() {
   const data = _interopRequireDefault(require("lodash.compact"));
   _lodash = function () {
@@ -69,22 +47,8 @@ function _cloudHooks() {
   return data;
 }
 function _workspaceUi2() {
-  const data = require("@teambit/workspace.ui.workspace-component-card");
-  _workspaceUi2 = function () {
-    return data;
-  };
-  return data;
-}
-function _workspaceUi3() {
   const data = require("@teambit/workspace.ui.use-workspace-mode");
-  _workspaceUi3 = function () {
-    return data;
-  };
-  return data;
-}
-function _designUi2() {
-  const data = require("@teambit/design.ui.heading");
-  _designUi2 = function () {
+  _workspaceUi2 = function () {
     return data;
   };
   return data;
@@ -96,13 +60,6 @@ function _workspaceContext() {
   };
   return data;
 }
-function _linkPlugin() {
-  const data = require("./link-plugin");
-  _linkPlugin = function () {
-    return data;
-  };
-  return data;
-}
 function _useWorkspaceAggregation() {
   const data = require("./use-workspace-aggregation");
   _useWorkspaceAggregation = function () {
@@ -117,6 +74,20 @@ function _useQueryParamWithDefault() {
   };
   return data;
 }
+function _namespaceHeader() {
+  const data = require("./namespace-header");
+  _namespaceHeader = function () {
+    return data;
+  };
+  return data;
+}
+function _hopeComponentCard() {
+  const data = require("./hope-component-card");
+  _hopeComponentCard = function () {
+    return data;
+  };
+  return data;
+}
 function _workspaceFilterPanel() {
   const data = require("./workspace-filter-panel");
   _workspaceFilterPanel = function () {
@@ -144,8 +115,7 @@ function WorkspaceOverview() {
   });
   const {
     isMinimal
-  } = (0, _workspaceUi3().useWorkspaceMode)();
-  const compModelsById = (0, _react().useMemo)(() => new Map(components.map(c => [c.id.toString(), c])), [components]);
+  } = (0, _workspaceUi2().useWorkspaceMode)();
   const uniqueScopes = [...new Set(components.map(c => c.id.scope))];
   const {
     cloudScopes
@@ -163,9 +133,11 @@ function WorkspaceOverview() {
     return {
       component,
       componentDescriptor: descriptor,
-      scope: scope && {
-        id: scope.id
-      } || undefined
+      scope: scope ? {
+        id: scope.id,
+        icon: scope.icon,
+        backgroundIconColor: scope.backgroundIconColor
+      } : undefined
     };
   }));
   const [aggregation, setAggregation] = (0, _useQueryParamWithDefault().useQueryParamWithDefault)('aggregation', 'namespaces');
@@ -173,7 +145,8 @@ function WorkspaceOverview() {
   const [activeScopes, setActiveScopes] = (0, _useQueryParamWithDefault().useListParamWithDefault)('scopes');
   const filters = (0, _react().useMemo)(() => ({
     namespaces: activeNamespaces,
-    scopes: activeScopes
+    scopes: activeScopes,
+    statuses: new Set()
   }), [activeNamespaces, activeScopes]);
   const {
     groups,
@@ -181,10 +154,6 @@ function WorkspaceOverview() {
     availableAggregations,
     filteredCount
   } = (0, _useWorkspaceAggregation().useWorkspaceAggregation)(items, aggregation, filters);
-  const plugins = useCardPlugins({
-    compModelsById,
-    showPreview: isMinimal
-  });
   return /*#__PURE__*/_react().default.createElement("div", {
     className: _workspaceOverviewModule().default.container
   }, /*#__PURE__*/_react().default.createElement(_workspaceFilterPanel().WorkspaceFilterPanel, {
@@ -196,65 +165,29 @@ function WorkspaceOverview() {
     onNamespacesChange: setActiveNamespaces,
     activeScopes: activeScopes,
     onScopesChange: setActiveScopes
-  }), filteredCount === 0 && /*#__PURE__*/_react().default.createElement(_workspaceUi().EmptyWorkspace, {
+  }), /*#__PURE__*/_react().default.createElement("div", {
+    className: _workspaceOverviewModule().default.content
+  }, filteredCount === 0 && /*#__PURE__*/_react().default.createElement(_workspaceUi().EmptyWorkspace, {
     name: workspace.name
   }), groups.map(group => /*#__PURE__*/_react().default.createElement("section", {
     key: group.name,
-    className: _workspaceOverviewModule().default.agg
-  }, groupType !== 'none' && /*#__PURE__*/_react().default.createElement(_designUi2().H3, {
-    className: _workspaceOverviewModule().default.aggregationTitle
-  }, group.displayName), /*#__PURE__*/_react().default.createElement(_explorerUiGallery().ComponentGrid, {
+    className: _workspaceOverviewModule().default.section
+  }, groupType !== 'none' && /*#__PURE__*/_react().default.createElement("div", {
+    className: _workspaceOverviewModule().default.sectionHeader
+  }, /*#__PURE__*/_react().default.createElement(_namespaceHeader().NamespaceHeader, {
+    namespace: group.name,
+    items: group.items,
+    scopeIcon: group.scopeIcon,
+    scopeIconColor: group.scopeIconColor
+  })), /*#__PURE__*/_react().default.createElement(_explorerUiGallery().ComponentGrid, {
     className: _workspaceOverviewModule().default.cardGrid
-  }, group.items.map(item => /*#__PURE__*/_react().default.createElement(_workspaceUi2().WorkspaceComponentCard, {
+  }, group.items.map(item => /*#__PURE__*/_react().default.createElement(_hopeComponentCard().HopeComponentCard, {
     key: item.component.id.toString(),
     component: item.component,
     componentDescriptor: item.componentDescriptor,
     scope: item.scope,
-    plugins: plugins,
-    shouldShowPreviewState: isMinimal
-  }))))));
-}
-function useCardPlugins({
-  compModelsById,
-  showPreview
-}) {
-  const serverUrlsSignature = _react().default.useMemo(() => {
-    const serversCount = Array.from(compModelsById.values()).filter(comp => comp.server?.url).map(comp => comp.server?.url).join(',');
-    return serversCount;
-  }, [compModelsById]);
-  const plugins = _react().default.useMemo(() => [{
-    preview: function Preview({
-      component,
-      shouldShowPreview
-    }) {
-      const compModel = compModelsById.get(component.id.toString());
-      if (!compModel) return null;
-      return /*#__PURE__*/_react().default.createElement(_previewUi().PreviewPlaceholder, {
-        componentDescriptor: component,
-        component: compModel,
-        shouldShowPreview: showPreview || shouldShowPreview
-      });
-    }
-  }, {
-    previewBottomRight: function PreviewBottomRight({
-      component
-    }) {
-      const env = component.get('teambit.envs/envs');
-      const envComponentId = env?.id ? _componentId().ComponentID.fromString(env?.id) : undefined;
-      return /*#__PURE__*/_react().default.createElement("div", {
-        className: _workspaceOverviewModule().default.rightPreviewPlugins
-      }, /*#__PURE__*/_react().default.createElement("div", {
-        className: _workspaceOverviewModule().default.badge
-      }, /*#__PURE__*/_react().default.createElement(_designUi().Tooltip, {
-        delay: 300,
-        content: envComponentId?.name
-      }, /*#__PURE__*/_react().default.createElement("img", {
-        src: env?.icon,
-        className: _workspaceOverviewModule().default.envIcon
-      }))));
-    }
-  }, new (_linkPlugin().LinkPlugin)()], [compModelsById.size, serverUrlsSignature, showPreview]);
-  return plugins;
+    showPreview: isMinimal
+  })))))));
 }
 
 //# sourceMappingURL=workspace-overview.js.map

package/dist/ui/workspace/workspace-overview/workspace-overview.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","data","_interopRequireWildcard","require","_explorerUiGallery","_workspaceUi","_previewUi","_designUi","_componentId","_lodash","_interopRequireDefault","_scopes","_cloudHooks","_workspaceUi2","_workspaceUi3","_designUi2","_workspaceContext","_linkPlugin","_useWorkspaceAggregation","_useQueryParamWithDefault","_workspaceFilterPanel","_workspaceOverviewModule","e","__esModule","default","t","WeakMap","r","n","o","i","f","__proto__","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","WorkspaceOverview","workspace","useContext","WorkspaceContext","components","componentDescriptors","length","createElement","EmptyWorkspace","name","isMinimal","useWorkspaceMode","compModelsById","useMemo","Map","map","c","id","toString","uniqueScopes","Set","scope","cloudScopes","useCloudScopes","cloudMap","s","compDescriptorMap","d","items","compact","component","deprecation","isDeprecate","descriptor","cloudScope","ScopeID","isValid","fromString","undefined","componentDescriptor","aggregation","setAggregation","useQueryParamWithDefault","activeNamespaces","setActiveNamespaces","useListParamWithDefault","activeScopes","setActiveScopes","filters","namespaces","scopes","groups","groupType","availableAggregations","filteredCount","useWorkspaceAggregation","plugins","useCardPlugins","showPreview","className","styles","container","WorkspaceFilterPanel","onAggregationChange","onNamespacesChange","onScopesChange","group","key","agg","H3","aggregationTitle","displayName","ComponentGrid","cardGrid","item","WorkspaceComponentCard","shouldShowPreviewState","serverUrlsSignature","React","serversCount","Array","from","values","filter","comp","server","url","join","preview","Preview","shouldShowPreview","compModel","PreviewPlaceholder","previewBottomRight","PreviewBottomRight","env","envComponentId","ComponentID","rightPreviewPlugins","badge","Tooltip","delay","content","src","icon","envIcon","LinkPlugin","size"],"sources":["workspace-overview.tsx"],"sourcesContent":["import React, { useContext, useMemo } from 'react';\nimport { ComponentGrid } from '@teambit/explorer.ui.gallery.component-grid';\nimport { EmptyWorkspace } from '@teambit/workspace.ui.empty-workspace';\nimport { PreviewPlaceholder } from '@teambit/preview.ui.preview-placeholder';\nimport { Tooltip } from '@teambit/design.ui.tooltip';\nimport { ComponentID } from '@teambit/component-id';\nimport type { ComponentModel } from '@teambit/component';\nimport compact from 'lodash.compact';\nimport { ScopeID } from '@teambit/scopes.scope-id';\nimport { useCloudScopes } from '@teambit/cloud.hooks.use-cloud-scopes';\nimport { WorkspaceComponentCard } from '@teambit/workspace.ui.workspace-component-card';\nimport type { ComponentCardPluginType, PluginProps } from '@teambit/explorer.ui.component-card';\nimport { useWorkspaceMode } from '@teambit/workspace.ui.use-workspace-mode';\nimport { H3 } from '@teambit/design.ui.heading';\nimport { WorkspaceContext } from '../workspace-context';\nimport { LinkPlugin } from './link-plugin';\nimport { useWorkspaceAggregation } from './use-workspace-aggregation';\nimport { useQueryParamWithDefault, useListParamWithDefault } from './use-query-param-with-default';\nimport type { AggregationType } from './workspace-overview.types';\nimport { WorkspaceFilterPanel } from './workspace-filter-panel';\nimport styles from './workspace-overview.module.scss';\n\nexport function WorkspaceOverview() {\n  const workspace = useContext(WorkspaceContext);\n  const { components, componentDescriptors } = workspace;\n\n  if (!components.length) return <EmptyWorkspace name={workspace.name} />;\n\n  const { isMinimal } = useWorkspaceMode();\n  const compModelsById = useMemo(() => new Map(components.map((c) => [c.id.toString(), c])), [components]);\n\n  const uniqueScopes = [...new Set(components.map((c) => c.id.scope))];\n  const { cloudScopes } = useCloudScopes(uniqueScopes);\n  const cloudMap = new Map((cloudScopes || []).map((s) => [s.id.toString(), s]));\n\n  const compDescriptorMap = new Map(componentDescriptors.map((d) => [d.id.toString(), d]));\n\n  const items = compact(\n    components.map((component) => {\n      if (component.deprecation?.isDeprecate) return null;\n\n      const descriptor = compDescriptorMap.get(component.id.toString());\n      if (!descriptor) return null;\n\n      const cloudScope = cloudMap.get(component.id.scope);\n      const scope =\n        cloudScope ||\n        (ScopeID.isValid(component.id.scope) && { id: ScopeID.fromString(component.id.scope) }) ||\n        undefined;\n\n      return { component, componentDescriptor: descriptor, scope: (scope && { id: scope.id }) || undefined };\n    })\n  );\n\n  const [aggregation, setAggregation] = useQueryParamWithDefault<AggregationType>('aggregation', 'namespaces');\n  const [activeNamespaces, setActiveNamespaces] = useListParamWithDefault('ns');\n  const [activeScopes, setActiveScopes] = useListParamWithDefault('scopes');\n\n  const filters = useMemo(\n    () => ({ namespaces: activeNamespaces, scopes: activeScopes }),\n    [activeNamespaces, activeScopes]\n  );\n\n  const { groups, groupType, availableAggregations, filteredCount } = useWorkspaceAggregation(\n    items,\n    aggregation,\n    filters\n  );\n\n  const plugins = useCardPlugins({ compModelsById, showPreview: isMinimal });\n\n  return (\n    <div className={styles.container}>\n      <WorkspaceFilterPanel\n        aggregation={aggregation}\n        onAggregationChange={setAggregation}\n        availableAggregations={availableAggregations}\n        items={items}\n        activeNamespaces={activeNamespaces}\n        onNamespacesChange={setActiveNamespaces}\n        activeScopes={activeScopes}\n        onScopesChange={setActiveScopes}\n      />\n\n      {filteredCount === 0 && <EmptyWorkspace name={workspace.name} />}\n\n      {groups.map((group) => (\n        <section key={group.name} className={styles.agg}>\n          {groupType !== 'none' && <H3 className={styles.aggregationTitle}>{group.displayName}</H3>}\n\n          <ComponentGrid className={styles.cardGrid}>\n            {group.items.map((item) => (\n              <WorkspaceComponentCard\n                key={item.component.id.toString()}\n                component={item.component}\n                componentDescriptor={item.componentDescriptor}\n                scope={item.scope}\n                plugins={plugins}\n                shouldShowPreviewState={isMinimal}\n              />\n            ))}\n          </ComponentGrid>\n        </section>\n      ))}\n    </div>\n  );\n}\n\nexport function useCardPlugins({\n  compModelsById,\n  showPreview,\n}: {\n  compModelsById: Map<string, ComponentModel>;\n  showPreview?: boolean;\n}): ComponentCardPluginType<PluginProps>[] {\n  const serverUrlsSignature = React.useMemo(() => {\n    const serversCount = Array.from(compModelsById.values())\n      .filter((comp) => comp.server?.url)\n      .map((comp) => comp.server?.url)\n      .join(',');\n    return serversCount;\n  }, [compModelsById]);\n\n  const plugins = React.useMemo(\n    () => [\n      {\n        preview: function Preview({ component, shouldShowPreview }) {\n          const compModel = compModelsById.get(component.id.toString());\n          if (!compModel) return null;\n          return (\n            <PreviewPlaceholder\n              componentDescriptor={component}\n              component={compModel}\n              shouldShowPreview={showPreview || shouldShowPreview}\n            />\n          );\n        },\n      },\n      {\n        previewBottomRight: function PreviewBottomRight({ component }) {\n          const env = component.get('teambit.envs/envs');\n          const envComponentId = env?.id ? ComponentID.fromString(env?.id) : undefined;\n\n          return (\n            <div className={styles.rightPreviewPlugins}>\n              <div className={styles.badge}>\n                <Tooltip delay={300} content={envComponentId?.name}>\n                  <img src={env?.icon} className={styles.envIcon} />\n                </Tooltip>\n              </div>\n            </div>\n          );\n        },\n      },\n      new LinkPlugin(),\n    ],\n    [compModelsById.size, serverUrlsSignature, showPreview]\n  );\n\n  return plugins;\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["_react","data","_interopRequireWildcard","require","_explorerUiGallery","_workspaceUi","_lodash","_interopRequireDefault","_scopes","_cloudHooks","_workspaceUi2","_workspaceContext","_useWorkspaceAggregation","_useQueryParamWithDefault","_namespaceHeader","_hopeComponentCard","_workspaceFilterPanel","_workspaceOverviewModule","e","__esModule","default","t","WeakMap","r","n","o","i","f","__proto__","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","WorkspaceOverview","workspace","useContext","WorkspaceContext","components","componentDescriptors","length","createElement","EmptyWorkspace","name","isMinimal","useWorkspaceMode","uniqueScopes","Set","map","c","id","scope","cloudScopes","useCloudScopes","cloudMap","Map","s","toString","compDescriptorMap","d","items","compact","component","deprecation","isDeprecate","descriptor","cloudScope","ScopeID","isValid","fromString","undefined","componentDescriptor","icon","backgroundIconColor","aggregation","setAggregation","useQueryParamWithDefault","activeNamespaces","setActiveNamespaces","useListParamWithDefault","activeScopes","setActiveScopes","filters","useMemo","namespaces","scopes","statuses","groups","groupType","availableAggregations","filteredCount","useWorkspaceAggregation","className","styles","container","WorkspaceFilterPanel","onAggregationChange","onNamespacesChange","onScopesChange","content","group","key","section","sectionHeader","NamespaceHeader","namespace","scopeIcon","scopeIconColor","ComponentGrid","cardGrid","item","HopeComponentCard","showPreview"],"sources":["workspace-overview.tsx"],"sourcesContent":["import React, { useContext, useMemo } from 'react';\nimport { ComponentGrid } from '@teambit/explorer.ui.gallery.component-grid';\nimport { EmptyWorkspace } from '@teambit/workspace.ui.empty-workspace';\nimport compact from 'lodash.compact';\nimport { ScopeID } from '@teambit/scopes.scope-id';\nimport { useCloudScopes } from '@teambit/cloud.hooks.use-cloud-scopes';\nimport { useWorkspaceMode } from '@teambit/workspace.ui.use-workspace-mode';\nimport { WorkspaceContext } from '../workspace-context';\nimport { useWorkspaceAggregation } from './use-workspace-aggregation';\nimport { useQueryParamWithDefault, useListParamWithDefault } from './use-query-param-with-default';\nimport { NamespaceHeader } from './namespace-header';\nimport { HopeComponentCard } from './hope-component-card';\nimport type { AggregationType } from './workspace-overview.types';\nimport { WorkspaceFilterPanel } from './workspace-filter-panel';\nimport styles from './workspace-overview.module.scss';\n\nexport function WorkspaceOverview() {\n  const workspace = useContext(WorkspaceContext);\n  const { components, componentDescriptors } = workspace;\n\n  if (!components.length) return <EmptyWorkspace name={workspace.name} />;\n\n  const { isMinimal } = useWorkspaceMode();\n  const uniqueScopes = [...new Set(components.map((c) => c.id.scope))];\n  const { cloudScopes } = useCloudScopes(uniqueScopes);\n  const cloudMap = new Map((cloudScopes || []).map((s) => [s.id.toString(), s]));\n\n  const compDescriptorMap = new Map(componentDescriptors.map((d) => [d.id.toString(), d]));\n\n  const items = compact(\n    components.map((component) => {\n      if (component.deprecation?.isDeprecate) return null;\n\n      const descriptor = compDescriptorMap.get(component.id.toString());\n      if (!descriptor) return null;\n\n      const cloudScope = cloudMap.get(component.id.scope);\n      const scope =\n        cloudScope ||\n        (ScopeID.isValid(component.id.scope) && { id: ScopeID.fromString(component.id.scope) }) ||\n        undefined;\n\n      return {\n        component,\n        componentDescriptor: descriptor,\n        scope: scope\n          ? { id: scope.id, icon: (scope as any).icon, backgroundIconColor: (scope as any).backgroundIconColor }\n          : undefined,\n      };\n    })\n  );\n\n  const [aggregation, setAggregation] = useQueryParamWithDefault<AggregationType>('aggregation', 'namespaces');\n  const [activeNamespaces, setActiveNamespaces] = useListParamWithDefault('ns');\n  const [activeScopes, setActiveScopes] = useListParamWithDefault('scopes');\n\n  const filters = useMemo(\n    () => ({ namespaces: activeNamespaces, scopes: activeScopes, statuses: new Set() as any }),\n    [activeNamespaces, activeScopes]\n  );\n\n  const { groups, groupType, availableAggregations, filteredCount } = useWorkspaceAggregation(\n    items,\n    aggregation,\n    filters\n  );\n\n  return (\n    <div className={styles.container}>\n      <WorkspaceFilterPanel\n        aggregation={aggregation}\n        onAggregationChange={setAggregation}\n        availableAggregations={availableAggregations}\n        items={items}\n        activeNamespaces={activeNamespaces}\n        onNamespacesChange={setActiveNamespaces}\n        activeScopes={activeScopes}\n        onScopesChange={setActiveScopes}\n      />\n\n      <div className={styles.content}>\n        {filteredCount === 0 && <EmptyWorkspace name={workspace.name} />}\n\n        {groups.map((group) => (\n          <section key={group.name} className={styles.section}>\n            {groupType !== 'none' && (\n              <div className={styles.sectionHeader}>\n                <NamespaceHeader\n                  namespace={group.name}\n                  items={group.items}\n                  scopeIcon={group.scopeIcon}\n                  scopeIconColor={group.scopeIconColor}\n                />\n              </div>\n            )}\n\n            <ComponentGrid className={styles.cardGrid}>\n              {group.items.map((item) => (\n                <HopeComponentCard\n                  key={item.component.id.toString()}\n                  component={item.component}\n                  componentDescriptor={item.componentDescriptor}\n                  scope={item.scope as any}\n                  showPreview={isMinimal}\n                />\n              ))}\n            </ComponentGrid>\n          </section>\n        ))}\n      </div>\n    </div>\n  );\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/ui/workspace/workspace-overview/workspace-overview.module.scss

@@ -1,211 +1,91 @@
 @import '@teambit/ui-foundation.ui.constants.z-indexes/z-indexes.module.scss';
 
 .container {
-  padding: 24px 5% 150px 5%;
   overflow-y: auto;
   height: 100%;
   box-sizing: border-box;
   z-index: 1;
 }
 
-.rightPreviewPlugins {
-  display: flex;
-  align-items: flex-end;
-  justify-content: flex-end;
-  width: 100%;
-  height: 100%;
-}
-
-.envIcon {
-  height: 14px;
+.content {
+  padding: 20px 40px 80px;
 }
 
-.badge {
-  background-color: var(--surface-color);
-  padding: 4px;
-  height: 15px;
-  margin-right: 4px;
-  z-index: $nav-z-index;
-  border-radius: 8px;
-  margin-bottom: 4px;
-  box-shadow: 0px 2px 18px rgb(0 0 0 / 10%);
-}
-
-.cardGrid {
-  display: grid;
-  gap: 32px 24px;
-  grid-template-columns: repeat(auto-fill, minmax(270px, 1fr));
-  max-width: 1280px;
-  grid-column-gap: 28px;
-  grid-row-gap: 32px;
-}
+/* ---- Command bar ---- */
 
-.filterPanel {
+.commandBar {
   display: flex;
   align-items: center;
   justify-content: space-between;
-  margin-bottom: 24px;
-  position: relative;
+  gap: 12px;
+  flex-wrap: wrap;
+  padding: 12px 40px;
+  background: color-mix(in srgb, var(--bit-accent-color, #6c5ce7) 3%, var(--background-color, #fff));
+  border-bottom: 1px solid var(--border-medium-color);
+  position: sticky;
+  top: 0;
   z-index: $modal-z-index - 1;
 }
 
-.aggButtons {
-  display: inline-flex;
-  background: var(--surface-1-color);
-  border: 1px solid var(--border-medium-color);
-  border-radius: 8px;
-  padding: 2px;
-  height: 34px;
-}
-
-.aggButton,
-.aggActive {
-  padding: 4px 12px;
-  font-size: 14px;
-  border-radius: 6px;
-  background: transparent;
-  cursor: pointer;
-  border: none;
+.leftCluster {
   display: flex;
   align-items: center;
-}
-
-.aggButton:hover {
-  background: var(--surface-hover-color);
-}
-
-.aggActive {
-  background: var(--brand-primary-color);
-  color: white;
-}
-
-.dropdownList {
-  max-height: 260px;
-  overflow-y: auto;
-  padding: 0 12px;
-  display: flex;
-  flex-direction: column;
   gap: 8px;
+  flex-wrap: wrap;
 }
 
-.dropdownItem {
+.rightCluster {
   display: flex;
   align-items: center;
   gap: 8px;
-  font-size: 14px;
-  cursor: pointer;
-}
-
-.dropdownItem input {
-  width: 16px;
-  height: 16px;
-}
-
-.count {
-  opacity: 0.55;
-}
-
-.agg {
-  margin-bottom: 28px;
+  margin-left: auto;
 }
 
-.aggregationTitle {
-  margin-top: 0;
-  margin-bottom: 15px;
+.aggToggle {
+  height: 32px !important;
+  font-size: 12.5px;
+  --surface02-color: color-mix(in srgb, var(--bit-accent-color, #6c5ce7) 20%, var(--surface-color, #f5f5f5));
 }
 
-:global(.componentGrid) {
-  grid-row-gap: 24px !important;
-  grid-column-gap: 16px !important;
-}
+/* ---- Base filter overrides ---- */
 
-.filterPanel :global(.baseFilter) {
+.commandBar :global(.baseFilter) {
   max-width: 220px;
   height: 32px;
 }
 
-.filterPanel :global(.control) {
+.commandBar :global(.control) {
   border-radius: 8px !important;
   height: 32px;
   padding: 0 10px !important;
 }
 
-.filterPanel :global(.menu) {
+.commandBar :global(.menu) {
   z-index: $modal-z-index - 1 !important;
-  border-radius: 8px !important;
+  border-radius: 14px !important;
   padding: 8px 0 !important;
+  width: 260px;
+  box-shadow: 0 24px 60px -12px rgba(20, 0, 104, 0.2);
 }
 
-.filterDropdown :global(.baseFilter) {
-  height: 32px;
-  max-width: 240px;
-  font-size: 14px;
-}
-
-.filterDropdown :global(.baseFilter .control) {
-  padding: 8px 12px;
-  border-radius: 8px;
-}
-
-.filterDropdown :global(.menu) {
-  margin-top: 10px;
-  padding: 12px 0;
-  min-width: 260px;
-  border-radius: 12px;
-
-  box-shadow: var(--bit-shadow-hover-low, 0 2px 8px rgba(0, 0, 0, 0.1));
-  border: 1px solid var(--border-medium-color, #ededed);
-}
-
-.filterDropdown :global(.checkboxContainer) {
-  padding-left: 14px;
-}
-
-.filterDropdown :global(.checkbox) {
-  margin-right: 12px;
-  accent-color: var(--bit-accent-color, #6c5ce7);
-}
-
-.filterDropdown :global(.buttonsSection) {
-  padding: 12px 16px;
-  border-top: 1px solid var(--border-medium-color, #ededed);
-}
-
-.filterDropdown :global(.placeholder > span:not(:first-child)) {
-  margin-left: 8px;
-}
+/* ---- Section ---- */
 
-.filterPanel {
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  margin-bottom: 24px;
-  gap: 16px;
-}
-
-.leftFilters {
-  display: flex;
-  gap: 12px;
-  align-items: center;
+.section {
+  margin-bottom: 40px;
 }
 
-.rightAggToggle {
-  display: flex;
-  align-items: center;
-  margin-left: auto;
-  height: 32px;
-  font-size: 14px;
+.sectionHeader {
+  position: sticky;
+  top: 57px;
+  z-index: $nav-z-index;
+  background: var(--background-color);
+  padding: 12px 0 18px;
 }
 
-.toggleBtn {
-  height: 32px !important;
-  font-size: 14px;
-}
+/* ---- Card grid ---- */
 
 .cardGrid {
   display: grid;
-  grid-template-columns: repeat(auto-fill, minmax(270px, 1fr));
-  grid-row-gap: 32px;
-  grid-column-gap: 24px;
-  max-width: 1280px;
+  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
+  gap: 14px;
 }

package/dist/ui/workspace/workspace-overview/workspace-overview.types.d.ts

@@ -6,13 +6,19 @@ export interface WorkspaceItem {
     componentDescriptor: ComponentDescriptor;
     scope?: {
         id: ScopeID;
+        icon?: string;
+        backgroundIconColor?: string;
     };
 }
 export type AggregationType = 'namespaces' | 'scopes' | 'none';
+export type Density = 'compact' | 'comfy';
+export type ComponentStatus = 'built' | 'changed' | 'building' | 'queued';
 export interface AggregationGroup {
     name: string;
     displayName: string;
     items: WorkspaceItem[];
+    scopeIcon?: string;
+    scopeIconColor?: string;
 }
 export interface AggregationResult {
     groups: AggregationGroup[];

package/dist/ui/workspace/workspace-overview/workspace-overview.types.js.map

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["workspace-overview.types.ts"],"sourcesContent":["import type { ComponentModel } from '@teambit/component';\nimport type { ComponentDescriptor } from '@teambit/component-descriptor';\nimport type { ScopeID } from '@teambit/scopes.scope-id';\n\nexport interface WorkspaceItem {\n  component: ComponentModel;\n  componentDescriptor: ComponentDescriptor;\n  scope?: { id: ScopeID };\n}\n\nexport type AggregationType = 'namespaces' | 'scopes' | 'none';\n\nexport interface AggregationGroup {\n  name: string;\n  displayName: string;\n  items: WorkspaceItem[];\n}\n\nexport interface AggregationResult {\n  groups: AggregationGroup[];\n  groupType: AggregationType;\n  availableAggregations: AggregationType[];\n  filteredCount: number;\n}\n"],"mappings":"","ignoreList":[]}
+{"version":3,"names":[],"sources":["workspace-overview.types.ts"],"sourcesContent":["import type { ComponentModel } from '@teambit/component';\nimport type { ComponentDescriptor } from '@teambit/component-descriptor';\nimport type { ScopeID } from '@teambit/scopes.scope-id';\n\nexport interface WorkspaceItem {\n  component: ComponentModel;\n  componentDescriptor: ComponentDescriptor;\n  scope?: { id: ScopeID; icon?: string; backgroundIconColor?: string };\n}\n\nexport type AggregationType = 'namespaces' | 'scopes' | 'none';\n\nexport type Density = 'compact' | 'comfy';\n\nexport type ComponentStatus = 'built' | 'changed' | 'building' | 'queued';\n\nexport interface AggregationGroup {\n  name: string;\n  displayName: string;\n  items: WorkspaceItem[];\n  scopeIcon?: string;\n  scopeIconColor?: string;\n}\n\nexport interface AggregationResult {\n  groups: AggregationGroup[];\n  groupType: AggregationType;\n  availableAggregations: AggregationType[];\n  filteredCount: number;\n}\n"],"mappings":"","ignoreList":[]}

package/dist/ui/workspace/workspace.js

@@ -218,20 +218,37 @@ function Workspace({
   }
   workspaceUI.setComponents(workspace.components);
   const inIframe = typeof window !== 'undefined' && window.parent && window.parent !== window;
+  const location = (0, _reactRouterDom().useLocation)();
+  const isOverview = location.pathname === '/' || location.pathname === '';
+  const showTopBar = !isMinimal || isMinimal && !isOverview;
   return /*#__PURE__*/_react().default.createElement(_workspaceProvider().WorkspaceProvider, {
     workspace: workspace
   }, !isMinimal && /*#__PURE__*/_react().default.createElement(NotificationsBinder, {
     reactionsRef: reactionsRef
   }), /*#__PURE__*/_react().default.createElement(_workspaceUi().PreserveWorkspaceMode, null, /*#__PURE__*/_react().default.createElement(_themeFromUrl().ThemeFromUrlSync, null), isMinimal && inIframe && /*#__PURE__*/_react().default.createElement(MinimalModeUrlBroadcasterAndListener, null), /*#__PURE__*/_react().default.createElement("div", {
     className: _workspaceModule().default.workspaceWrapper
-  }, /*#__PURE__*/_react().default.createElement(_uiFoundationUi2().TopBar, {
+  }, showTopBar && /*#__PURE__*/_react().default.createElement(_uiFoundationUi2().TopBar, {
     className: (0, _classnames().default)(_workspaceModule().default.topbar, _workspaceModule().default[themeName], isMinimal && _workspaceModule().default.minimal),
     Corner: () => /*#__PURE__*/_react().default.createElement("div", {
       className: (0, _classnames().default)(isMinimal && _workspaceModule().default.cornerWithBreadcrumb)
-    }, /*#__PURE__*/_react().default.createElement(_uiFoundationUi().Corner, {
-      className: (0, _classnames().default)(isMinimal && _workspaceModule().default.minimalCorner || _workspaceModule().default.corner, _workspaceModule().default[themeName]),
-      name: isMinimal ? '' : workspace.name,
-      icon: isMinimal ? 'https://static.bit.dev/bit-icons/house.svg' : workspace.icon
+    }, isMinimal ? /*#__PURE__*/_react().default.createElement(_reactRouterDom().Link, {
+      to: "/",
+      className: _workspaceModule().default.backButton
+    }, /*#__PURE__*/_react().default.createElement("svg", {
+      width: "18",
+      height: "18",
+      viewBox: "0 0 18 18",
+      fill: "none"
+    }, /*#__PURE__*/_react().default.createElement("path", {
+      d: "M11.25 13.5L6.75 9L11.25 4.5",
+      stroke: "currentColor",
+      strokeWidth: "1.5",
+      strokeLinecap: "round",
+      strokeLinejoin: "round"
+    }))) : /*#__PURE__*/_react().default.createElement(_uiFoundationUi().Corner, {
+      className: (0, _classnames().default)(_workspaceModule().default.corner, _workspaceModule().default[themeName]),
+      name: workspace.name,
+      icon: workspace.icon
     }), isMinimal && /*#__PURE__*/_react().default.createElement(WorkspaceBreadcrumb, null))
     // @ts-ignore - getting an error of "Types have separate declarations of a private property 'registerFn'." for some reason after upgrading teambit.harmony/harmony from 0.4.6 to 0.4.7
     ,