opti: style improve of sidebar and topbar #572;

libs/components/layout/src/header/LayoutHeader.tsx

@@ -34,6 +34,7 @@ const StyledContainerForHeaderRoot = styled('div')(({ theme }) => {
     return {
         width: '100%',
         zIndex: theme.affine.zIndex.header,
+        backgroundColor: '#fff',
     };
 });
 

libs/components/layout/src/header/Title.tsx

@@ -13,6 +13,8 @@ export const CurrentPageTitle = () => {
     const { workspace_id } = params;
     const [pageId, setPageId] = useState<string>('');
     const [pageTitle, setPageTitle] = useState<string | undefined>();
+    /* card.7 */
+    // const { items } = usePageTree();
 
     useEffect(() => {
         if (params['*']) {

libs/components/layout/src/header/utils.ts

@@ -0,0 +1,25 @@
+import { TreeItem, TreeItems } from './../workspace-sidebar/page-tree';
+
+const pickPath = (treeItems: TreeItem | TreeItems, targetId: string) => {
+    const pick = (tree: TreeItem, result: TreeItem[] = []) => {
+        if (tree.id === targetId) {
+            result.push(tree);
+            return result;
+        }
+
+        for (const child of tree?.children || []) {
+            if (pick(child, result).length) {
+                result.unshift(tree);
+                break;
+            }
+        }
+
+        return result;
+    };
+
+    return (Array.isArray(treeItems) ? treeItems : [treeItems]).map(treeItem =>
+        pick(treeItem)
+    );
+};
+
+export { pickPath };