feat(sdk): Dashboard updates for SDK users

packages/app/src/app/graphql/types.ts

@@ -427,6 +427,7 @@ export type Team = {
    */
   projects: Array<Project>;
   sandboxes: Array<Sandbox>;
+  sdkWorkspace: Scalars['Boolean'];
   settings: Maybe<WorkspaceSandboxSettings>;
   shortid: Scalars['String'];
   subscription: Maybe<ProSubscription>;
@@ -3578,6 +3579,7 @@ export type CurrentTeamInfoFragmentFragment = {
   legacy: boolean;
   frozen: boolean;
   insertedAt: string;
+  sdkWorkspace: boolean;
   users: Array<{
     __typename?: 'User';
     id: any;
@@ -5279,6 +5281,7 @@ export type GetTeamQuery = {
       legacy: boolean;
       frozen: boolean;
       insertedAt: string;
+      sdkWorkspace: boolean;
       users: Array<{
         __typename?: 'User';
         id: any;

packages/app/src/app/hooks/useActiveTeamInfo.ts

@@ -0,0 +1,37 @@
+import { useAppState } from 'app/overmind';
+
+export type ActiveTeamInfo = {
+  id: string | null;
+  name: string | null;
+  sdkWorkspace: boolean;
+  frozen: boolean;
+};
+
+/**
+ * Hook to access active team information.
+ * 
+ * This hook provides an abstraction layer over the Overmind state,
+ * making it easier to migrate away from Overmind in the future.
+ * 
+ * @returns Active team information or null values if no team is active
+ */
+export const useActiveTeamInfo = (): ActiveTeamInfo => {
+  const { activeTeamInfo } = useAppState();
+
+  if (!activeTeamInfo) {
+    return {
+      id: null,
+      name: null,
+      sdkWorkspace: false,
+      frozen: false,
+    };
+  }
+
+  return {
+    id: activeTeamInfo.id,
+    name: activeTeamInfo.name,
+    sdkWorkspace: activeTeamInfo.sdkWorkspace ?? false,
+    frozen: activeTeamInfo.frozen,
+  };
+};
+

packages/app/src/app/overmind/effects/gql/dashboard/fragments.ts

@@ -187,6 +187,7 @@ export const currentTeamInfoFragment = gql`
     legacy
     frozen
     insertedAt
+    sdkWorkspace
     users {
       id
       avatarUrl

packages/app/src/app/pages/Dashboard/Header/index.tsx

@@ -12,6 +12,7 @@ import { UserMenu } from 'app/pages/common/UserMenu';
 import { Notifications } from 'app/components/Notifications';
 import { dashboard as dashboardUrls } from '@codesandbox/common/lib/utils/url-generator';
 import { useWorkspaceLimits } from 'app/hooks/useWorkspaceLimits';
+import { useActiveTeamInfo } from 'app/hooks/useActiveTeamInfo';
 import { TeamAvatar } from 'app/components/TeamAvatar';
 import { WorkspaceSelect } from 'app/components/WorkspaceSelect';
 import { SkeletonTextBlock } from 'app/components/Skeleton/elements';
@@ -25,6 +26,7 @@ export const Header: React.FC<HeaderProps> = React.memo(
     const history = useHistory();
     const actions = useActions();
     const { isFrozen } = useWorkspaceLimits();
+    const { sdkWorkspace } = useActiveTeamInfo();
     const {
       activeWorkspaceAuthorization,
       hasLogIn,
@@ -96,31 +98,35 @@ export const Header: React.FC<HeaderProps> = React.memo(
 
         <Stack align="center" gap={2}>
           <SearchInputGroup />
-          <Button
-            variant="secondary"
-            disabled={activeWorkspaceAuthorization === 'READ' || isFrozen}
-            onClick={() => {
-              track('Dashboard - Topbar - Import');
-              actions.modalOpened({ modal: 'import' });
-            }}
-            autoWidth
-          >
-            <Icon name="github" size={16} css={{ marginRight: '4px' }} />
-            Import
-          </Button>
-
-          <Button
-            variant="primary"
-            disabled={activeWorkspaceAuthorization === 'READ'}
-            onClick={() => {
-              track('Dashboard - Topbar - Create');
-              actions.modalOpened({ modal: 'create' });
-            }}
-            autoWidth
-          >
-            <Icon name="plus" size={12} css={{ marginRight: '4px' }} />
-            Create
-          </Button>
+          {!sdkWorkspace && (
+            <>
+              <Button
+                variant="secondary"
+                disabled={activeWorkspaceAuthorization === 'READ' || isFrozen}
+                onClick={() => {
+                  track('Dashboard - Topbar - Import');
+                  actions.modalOpened({ modal: 'import' });
+                }}
+                autoWidth
+              >
+                <Icon name="github" size={16} css={{ marginRight: '4px' }} />
+                Import
+              </Button>
+
+              <Button
+                variant="primary"
+                disabled={activeWorkspaceAuthorization === 'READ'}
+                onClick={() => {
+                  track('Dashboard - Topbar - Create');
+                  actions.modalOpened({ modal: 'create' });
+                }}
+                autoWidth
+              >
+                <Icon name="plus" size={12} css={{ marginRight: '4px' }} />
+                Create
+              </Button>
+            </>
+          )}
 
           {hasLogIn && <Notifications dashboard />}
 

packages/app/src/app/pages/Dashboard/Sidebar/index.tsx

@@ -7,6 +7,7 @@ import css from '@styled-system/css';
 import { useWorkspaceAuthorization } from 'app/hooks/useWorkspaceAuthorization';
 import { useWorkspaceSubscription } from 'app/hooks/useWorkspaceSubscription';
 import { useWorkspaceFeatureFlags } from 'app/hooks/useWorkspaceFeatureFlags';
+import { useActiveTeamInfo } from 'app/hooks/useActiveTeamInfo';
 import { ContextMenu } from './ContextMenu';
 import { DashboardBaseFolder } from '../types';
 import { Position } from '../Components/Selection';
@@ -76,7 +77,13 @@ export const Sidebar: React.FC<SidebarProps> = ({
     setNewFolderPath,
   };
 
-  const showRespositories = !state.environment.isOnPrem;
+  const { sdkWorkspace } = useActiveTeamInfo();
+
+  const hasRepositories = state.activeTeam && state.sidebar[state.activeTeam]
+    ? state.sidebar[state.activeTeam].repositories.length > 0
+    : false;
+
+  const showRespositories = !state.environment.isOnPrem && (!sdkWorkspace || hasRepositories);
 
   const { ubbBeta } = useWorkspaceFeatureFlags();
   const { isPrimarySpace, isTeamAdmin, isTeamEditor } = useWorkspaceAuthorization();
@@ -204,15 +211,17 @@ export const Sidebar: React.FC<SidebarProps> = ({
               size={2}
               css={css({ color: 'sideBarSectionHeader.foreground' })}
             >
-              Devboxes and Sandboxes
+              {sdkWorkspace ? 'Sandboxes' : 'Devboxes and Sandboxes'}
             </Text>
           </Element>
-          <RowItem
-            name="Drafts"
-            page="drafts"
-            path={dashboardUrls.drafts(activeTeam)}
-            icon="file"
-          />
+          {!sdkWorkspace && (
+            <RowItem
+              name="Drafts"
+              page="drafts"
+              path={dashboardUrls.drafts(activeTeam)}
+              icon="file"
+            />
+          )}
 
           <NestableRowItem
             name={ROOT_COLLECTION_NAME}
@@ -252,13 +261,17 @@ export const Sidebar: React.FC<SidebarProps> = ({
             path={dashboardUrls.deleted(activeTeam)}
             icon="trash"
           />
-          <Element marginTop={4} />
-          <RowItem
-            name="Shared with me"
-            page="shared"
-            path={dashboardUrls.shared(activeTeam)}
-            icon="sharing"
-          />
+          {!sdkWorkspace && (
+            <>
+              <Element marginTop={4} />
+              <RowItem
+                name="Shared with me"
+                page="shared"
+                path={dashboardUrls.shared(activeTeam)}
+                icon="sharing"
+              />
+            </>
+          )}
         </List>
         {ubbBeta && state.activeTeamInfo && (
           <UsageProgress