Merge branch 'feat/filesystem_and_search' into feat/migrate-layout

packages/app/src/components/workspace-slider-bar/WorkspaceSelector/SelectorPopperContent.tsx

@@ -44,6 +44,7 @@ export const SelectorPopperContent = () => {
         {workspacesMeta.map(workspace => {
           return (
             <WorkspaceItem
+              type={workspace.type}
               key={workspace.id}
               id={workspace.id}
               name={`workspace-${workspace.id}`}

packages/app/src/components/workspace-slider-bar/WorkspaceSelector/WorkspaceItem/WorkspaceItem/WorkspaceItem.tsx

@@ -7,11 +7,13 @@ import {
 } from '../styles';
 import { FooterSetting } from './FooterSetting';
 import { FooterUsers } from './FooterUsers';
+import { WorkspaceType } from '@pathfinder/data-services';
 
 interface WorkspaceItemProps {
   id: string;
   name: string;
   icon: string;
+  type: WorkspaceType;
   onClick?: (workspaceId: string) => void;
 }
 
@@ -19,6 +21,7 @@ export const WorkspaceItem = ({
   id,
   name,
   icon,
+  type,
   onClick,
 }: WorkspaceItemProps) => {
   const router = useRouter();
@@ -32,6 +35,7 @@ export const WorkspaceItem = ({
       onClick={() => {
         router.push(`/workspace/${id}`);
       }}
+      isPrivate={type === WorkspaceType.Private}
     >
       <WorkspaceItemAvatar alt={name} src={icon}>
         {name.charAt(0)}
@@ -58,17 +62,21 @@ const Name = styled('div')(({ theme }) => {
   };
 });
 
-const StyledWrapper = styled(WorkspaceItemWrapper)({
-  '& .footer-setting': {
-    display: 'none',
-  },
-  ':hover .footer-users': {
-    display: 'none',
-  },
-  ':hover .footer-setting': {
-    display: 'block',
-  },
-});
+const StyledWrapper = styled(WorkspaceItemWrapper)<{ isPrivate: boolean }>(
+  ({ isPrivate }) => {
+    return {
+      '& .footer-setting': {
+        display: 'none',
+      },
+      ':hover .footer-users': {
+        display: isPrivate ? 'block' : 'none',
+      },
+      ':hover .footer-setting': {
+        display: isPrivate ? 'none' : 'block',
+      },
+    };
+  }
+);
 
 const Footer = styled('div')({
   width: '42px',