Skip to content

Open start workspace in modal from projects list #15914

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 3 commits into from
Jan 23, 2023
Merged

Open start workspace in modal from projects list #15914

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
0571bfb
fix bug with api constantly being called
selfcontained Jan 19, 2023
987c8a0
open new workspace modal instead of redirect
selfcontained Jan 20, 2023
0ed046c
swap branches add workspace button to use modal
selfcontained Jan 21, 2023
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
2 changes: 1 addition & 1 deletion components/dashboard/src/components/RepositoryFinder.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -31,7 +31,7 @@ export default function RepositoryFinder(props: RepositoryFinderProps) {
setSuggestedContextURLs(urls);
saveSearchData(urls);
});
}, [suggestedContextURLs]);
}, []);
Copy link
Contributor Author

Choose a reason for hiding this comment

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

Since this effect updates suggestedContextURLs, having it as a dep caused it to constantly run as soon as it calls setSuggestedContextURLs


const getElements = useCallback(
(searchString: string) => {
Expand Down
10 changes: 7 additions & 3 deletions components/dashboard/src/projects/Project.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -21,6 +21,7 @@ import { openAuthorizeWindow } from "../provider-utils";
import Alert from "../components/Alert";
import { listAllProjects } from "../service/public-api";
import { UserContext } from "../user-context";
import { StartWorkspaceModalContext } from "../workspaces/start-workspace-modal-context";

export default function () {
const location = useLocation();
Expand All @@ -29,6 +30,7 @@ export default function () {
const { teams } = useContext(TeamsContext);
const { user } = useContext(UserContext);
const team = getCurrentTeam(location, teams);
const { setStartWorkspaceModalProps } = useContext(StartWorkspaceModalContext);

const match = useRouteMatch<{ team: string; resource: string }>("/(t/)?:team/:resource");
const projectSlug = match?.params?.resource;
Expand Down Expand Up @@ -395,9 +397,11 @@ export default function () {
menuEntries={[
{
title: "New Workspace ...",
href: gitpodHostUrl
.withContext(`${branch.url}`, { showOptions: true })
.toString(),
onClick: () =>
Copy link
Member

Choose a reason for hiding this comment

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

Like the preserving of context here!

setStartWorkspaceModalProps({
contextUrl: branch.url,
allowContextUrlChange: true,
}),
separator: true,
},
prebuild?.status === "queued" || prebuild?.status === "building"
Expand Down
12 changes: 8 additions & 4 deletions components/dashboard/src/projects/ProjectListItem.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@
* See License.AGPL.txt in the project root for license information.
*/

import { FunctionComponent, useMemo, useState } from "react";
import { FunctionComponent, useContext, useMemo, useState } from "react";
import dayjs from "dayjs";
import { Project } from "@gitpod/gitpod-protocol";
import { Link } from "react-router-dom";
Expand All @@ -15,6 +15,7 @@ import { toRemoteURL } from "./render-utils";
import { prebuildStatusIcon } from "./Prebuilds";
import { gitpodHostUrl } from "../service/service";
import { useLatestProjectPrebuildQuery } from "../data/prebuilds/latest-project-prebuild-query";
import { StartWorkspaceModalContext } from "../workspaces/start-workspace-modal-context";

type ProjectListItemProps = {
project: Project;
Expand All @@ -25,6 +26,7 @@ export const ProjectListItem: FunctionComponent<ProjectListItemProps> = ({ proje
const team = useCurrentTeam();
const [showRemoveModal, setShowRemoveModal] = useState(false);
const { data: prebuild, isLoading } = useLatestProjectPrebuildQuery({ projectId: project.id });
const { setStartWorkspaceModalProps } = useContext(StartWorkspaceModalContext);

const teamOrUserSlug = useMemo(() => {
return !!team ? "t/" + team.slug : "projects";
Expand All @@ -47,9 +49,11 @@ export const ProjectListItem: FunctionComponent<ProjectListItemProps> = ({ proje
},
{
title: "New Workspace ...",
href: gitpodHostUrl
.withContext(`${project.cloneUrl}`, { showOptions: true })
.toString(),
onClick: () =>
setStartWorkspaceModalProps({
contextUrl: project.cloneUrl,
allowContextUrlChange: true,
}),
separator: true,
},
{
Expand Down
7 changes: 6 additions & 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 @@ -17,6 +17,8 @@ export interface StartWorkspaceModalProps {
ide?: string;
workspaceClass?: string;
contextUrl?: string;
// If contextUrl is provided, setting `allowContextUrlChange` to true will allow it to be changed still
allowContextUrlChange?: boolean;
Copy link
Contributor Author

Choose a reason for hiding this comment

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

I didn't want to change existing behavior for when the start workspace ui locks that context url, so adding this option felt like the safest approach.

onClose?: () => void;
}

Expand Down Expand Up @@ -88,7 +90,10 @@ export function StartWorkspaceModal(props: StartWorkspaceModalProps) {
<div className="-mx-6 px-6">
<div className="text-xs text-gray-500">Start a new workspace with the following options.</div>
<div className="pt-3">
<RepositoryFinder setSelection={props.contextUrl ? undefined : setRepo} initialValue={repo} />
<RepositoryFinder
setSelection={props.contextUrl && !props.allowContextUrlChange ? undefined : setRepo}
initialValue={repo}
/>
</div>
<div className="pt-3">
{errorIde && <div className="text-red-500 text-sm">{errorIde}</div>}
Expand Down