Skip to content

[t&p] add workspaces to teams #5555

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 1 commit into from
Sep 27, 2021
Merged

[t&p] add workspaces to teams #5555

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
14 changes: 12 additions & 2 deletions components/dashboard/src/App.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -265,6 +265,9 @@ function App() {
if (resourceOrPrebuild === "configure") {
return <ConfigureProject />;
}
if (resourceOrPrebuild === "workspaces") {
return <Workspaces />;
}
if (resourceOrPrebuild === "prebuilds") {
return <Prebuilds />;
}
Expand All @@ -276,21 +279,28 @@ function App() {
<Route exact path="/teams/new" component={NewTeam} />
<Route exact path="/teams/join" component={JoinTeam} />
</Route>
{(teams || []).map(team => <Route key={`route-for-team-${team.slug}`} path={`/t/${team.slug}`}>
{(teams || []).map(team =>
<Route path={`/t/${team.slug}`} key={team.slug}>
<Route exact path={`/t/${team.slug}`}>
<Redirect to={`/t/${team.slug}/projects`} />
<Redirect to={`/t/${team.slug}/workspaces`} />
</Route>
<Route exact path={`/t/${team.slug}/:maybeProject/:resourceOrPrebuild?`} render={(props) => {
const { maybeProject, resourceOrPrebuild } = props.match.params;
if (maybeProject === "projects") {
return <Projects />;
}
if (maybeProject === "workspaces") {
return <Workspaces />;
}
if (maybeProject === "members") {
return <Members />;
}
if (resourceOrPrebuild === "configure") {
return <ConfigureProject />;
}
if (resourceOrPrebuild === "workspaces") {
return <Workspaces />;
}
if (resourceOrPrebuild === "prebuilds") {
return <Prebuilds />;
}
Expand Down
12 changes: 10 additions & 2 deletions components/dashboard/src/Menu.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -43,7 +43,7 @@ export default function Menu() {
})();
const prebuildId = (() => {
const resource = projectName && match?.params?.segment3;
if (resource !== "prebuilds" && resource !== "settings" && resource !== "configure") {
if (resource !== "workspaces" && resource !== "prebuilds" && resource !== "settings" && resource !== "configure") {
return resource;
}
})();
Expand Down Expand Up @@ -93,6 +93,10 @@ export default function Menu() {
title: 'Branches',
link: `${teamOrUserSlug}/${projectName}`
},
{
title: 'Workspaces',
link: `${teamOrUserSlug}/${projectName}/workspaces`
},
{
title: 'Prebuilds',
link: `${teamOrUserSlug}/${projectName}/prebuilds`
Expand All @@ -109,7 +113,11 @@ export default function Menu() {
{
title: 'Projects',
link: `/t/${team.slug}/projects`,
alternatives: [`/${team.slug}`]
},
{
title: 'Workspaces',
link: `/t/${team.slug}/workspaces`,
alternatives: [`/t/${team.slug}`]
},
{
title: 'Members',
Expand Down
2 changes: 1 addition & 1 deletion components/dashboard/src/components/Header.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,7 @@ export default function Header(p: HeaderProps) {
document.title = `${p.title} — Gitpod`;
}, []);
return <div className="lg:px-28 px-10 border-gray-200 dark:border-gray-800">
<div className="flex pb-8 pt-6">
<div className="flex py-10">
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

issue: Do we need to change this? Spacing works great with pb-8 pt-6 as the heading font and height provide the visual balance needed here. 💭

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I adjusted it to match your designs

<div className="">
{typeof p.title === "string" ? (<h1 className="tracking-tight">{p.title}</h1>) : p.title}
{typeof p.subtitle === "string" ? (<h2 className="tracking-wide">{p.subtitle}</h2>) : p.subtitle}
Expand Down
2 changes: 1 addition & 1 deletion components/dashboard/src/index.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -59,7 +59,7 @@
}

a.gp-link {
@apply underline underline-thickness-thin underline-offset-small text-gray-400 dark:text-gray-600 hover:text-gray-500 dark:hover:text-gray-500;
@apply text-blue-500 hover:text-blue-600 dark:text-blue-400 dark:hover:text-blue-500;
}

input[type=text], input[type=search], input[type=password], select {
Expand Down
2 changes: 1 addition & 1 deletion components/dashboard/src/workspaces/StartWorkspaceModal.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -43,7 +43,7 @@ export function StartWorkspaceModal(p: StartWorkspaceModalProps) {
<div className="border-t border-gray-200 dark:border-gray-800 mt-2 -mx-6 px-6 pt-2">
<div className="flex">
<TabMenuItem name='Recent' selected={selection === 'Recent'} onClick={() => setSelection('Recent')} />
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

issue: This is more accurately Recent Projects for team-level and project-level pages, right? Could it make sense to rename this to Projects and mention in the description below the sorting aspect?

Create a new workspace using the default branch for all recently added projects in this team.

<TabMenuItem name='Examples' selected={selection === 'Examples'} onClick={() => setSelection('Examples')} />
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

thought: For project-level workspaces, this modal could surface in the future (❗) more relevant links, as we've discussed for the Project Overview page, like Assigned Issues or Authored Pull Requests. Food for thought. 🍔

{p.examples.length>0 && <TabMenuItem name='Examples' selected={selection === 'Examples'} onClick={() => setSelection('Examples')} />}
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

issue: Works great for team-level workspaces but does not make much sense for project-level workspaces, right? I'd expect New Workspace action to create a new workspace for the associated project without asking for confirmation or project selection. What do you think?

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

thought: For project-level workspaces, triggering the new workspace modal could be helpful if in the future we'd like to ask for branch or workspace-specific variables before starting a workspace. Food for thought. 🍔

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

suggestion: Nice! However, a single item tab group does not make much sense, right? Maybe we could hide the tabs altogether for team-level and project-level level workspaces (new workspace modal)?

</div>
</div>
<div className="border-t border-gray-200 dark:border-gray-800 -mx-6 px-6 py-2">
Expand Down
Loading